/* ForCoffee — buildless, self-hosted website. All assets are local. */
:root{--paper:#f5f3ed;--ink:#262b27;--muted:#6e7369;--line:#dedfd4;--olive:#45513d;--olive-dark:#34402e;--sage:#dfe5d5;--cream:#eeebe2;--white:#fffefa;--blue:#596b97;--serif:Georgia,'Times New Roman',serif;--sans:Arial,Helvetica,sans-serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:100px}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased}
[hidden]{display:none!important}
button,a,input,summary{-webkit-tap-highlight-color:transparent}
button{font:inherit;color:inherit;cursor:pointer}
a{color:inherit;text-decoration:none}
button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #697cbb;outline-offset:5px}
button:disabled{cursor:default;opacity:.55}
img,svg{display:block;max-width:100%}
img{height:auto}
p,h1,h2,h3,figure{margin:0}
::selection{background:#d3ddc7;color:var(--ink)}
.container{width:min(calc(100% - 96px),1200px);margin-inline:auto}
.skip-link{position:fixed;z-index:500;left:15px;top:-100px;padding:12px 20px;background:var(--ink);color:#fff;border-radius:4px}
.skip-link:focus{top:15px}
.site-header{position:sticky;top:0;z-index:50;background:rgba(245,243,237,.97);border-bottom:1px solid var(--line)}
.header-inner{height:92px;display:flex;align-items:center;justify-content:space-between;gap:32px}
.brand{display:inline-flex;align-items:center;flex:none;min-height:44px}
.brand img{width:160px;height:auto;max-height:52px;object-fit:contain}
.brand-wordmark{font-family:var(--serif);font-size:30px;letter-spacing:-1px}
.main-nav,.simple-nav{display:flex;align-items:center;gap:34px;font-size:13px;font-weight:500}
.main-nav>a:not(.nav-contact),.simple-nav>a{padding-block:12px;position:relative}
.main-nav>a:not(.nav-contact):after{content:'';position:absolute;left:0;right:0;bottom:7px;height:1px;background:var(--olive);transform:scaleX(0);transform-origin:left;transition:transform .2s}
.main-nav>a:hover:after{transform:scaleX(1)}
.main-nav .nav-contact{margin-left:15px;padding:12px 18px;border:1px solid #bfc4b6;border-radius:3px;display:flex;gap:24px;align-items:center;transition:background .2s}
.nav-contact:hover{background:var(--sage)}
.menu-toggle{display:none}
.eyebrow{font-family:var(--sans);font-size:10px;font-weight:600;letter-spacing:1.7px;line-height:1.5;text-transform:uppercase;color:var(--olive)}
.tiny-square{display:inline-block;width:6px;height:6px;background:var(--olive);margin-right:7px;vertical-align:1px}
.hero{display:grid;grid-template-columns:1fr 1.03fr;gap:64px;align-items:center;padding-block:68px 64px}
.hero-copy{padding-bottom:8px}
.hero h1{font-family:var(--serif);font-weight:400;font-size:clamp(68px,6.3vw,89px);line-height:1.02;letter-spacing:-4.8px;margin:25px 0 27px}
h1 em,h2 em{font-weight:400;font-style:italic;color:#6c765b}
.hero-description{max-width:400px;color:#686e62;font-size:15px;line-height:1.85}
.hero-actions{display:flex;align-items:center;gap:28px;margin-top:30px}
.button,.btn{display:inline-flex;align-items:center;justify-content:center;gap:25px;padding:14px 23px;min-height:50px;border:1px solid transparent;border-radius:3px;font-size:13px;line-height:1.4;font-weight:500;transition:background .2s,transform .2s}
.button:hover,.btn:hover{transform:translateY(-2px)}
.button--primary,.btn-primary{background:var(--olive);color:var(--white)}
.button--primary:hover,.btn-primary:hover{background:var(--olive-dark)}
.button--secondary,.btn-secondary{background:transparent;border-color:var(--line);color:var(--ink)}
.button--secondary:hover,.btn-secondary:hover{background:var(--cream)}
.button--cream{background:#eeecde;color:var(--olive-dark)}
.button--cream:hover{background:#fffefa}
.text-link{font-size:12px;display:inline-flex;align-items:center;gap:16px;border-bottom:1px solid #9da48f;padding-block:8px}
.text-link:hover{color:var(--olive)}
.hero-footnote{display:flex;align-items:center;gap:9px;font-size:10px;color:#7f8476;margin-top:34px;letter-spacing:.2px}
.status-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:#7c8d68;flex:none}
.hero-art{background:#edece3;border:1px solid #e2e3d8;border-radius:5px;position:relative;align-self:stretch;display:flex;flex-direction:column;justify-content:space-between;min-width:0;margin-top:5px}
.art-topline{display:flex;justify-content:space-between;gap:10px;font-size:8px;letter-spacing:1.5px;color:#7f8574;padding:25px 28px 0}
.coffee-art-mount{width:100%;padding:0 8px}
.coffee-scene{width:100%;height:auto;aspect-ratio:6/5;overflow:visible}
.hero-art figcaption{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 25px 20px;border-top:1px solid #dfe1d4;font-size:10px;color:#777f6b}
.replay-button{border:0;background:transparent;font-size:10px;display:flex;align-items:center;gap:6px;padding:6px 0;white-space:nowrap}
.replay-button span{font-size:15px;line-height:1}
.coffee-bean{opacity:0;transform-box:fill-box;transform-origin:center}
.coffee-stream{opacity:0}
.coffee-fill{opacity:1}
.coffee-steam{opacity:.55}
.is-brewing .coffee-bean{animation:bean-drop 1s ease-in both}
.is-brewing .bean-2{animation-delay:.16s}
.is-brewing .bean-3{animation-delay:.32s}
.is-brewing .grinder-wheel{transform-box:fill-box;transform-origin:center;animation:grind 1s linear 1s both}
.is-brewing .coffee-stream{animation:pour 1.65s linear 2s both}
.is-brewing .coffee-fill{animation:fill-cup 1.5s ease 2.1s both}
.is-brewing .coffee-steam{animation:steam-in .8s ease 3.3s both}
@keyframes bean-drop{0%{opacity:0;transform:translateY(-42px) rotate(-18deg)}15%{opacity:1}70%{opacity:1}100%{opacity:0;transform:translateY(40px) rotate(28deg)}}
@keyframes grind{from{transform:rotate(0)}to{transform:rotate(360deg)}}
@keyframes pour{0%,100%{opacity:0}12%,88%{opacity:1}}
@keyframes fill-cup{0%{opacity:0}25%{opacity:.2}100%{opacity:1}}
@keyframes steam-in{from{opacity:0;transform:translateY(4px)}to{opacity:.55;transform:translateY(0)}}
.discipline-strip{border-block:1px solid var(--line)}
.discipline-inner{display:flex;align-items:center;justify-content:space-between;gap:24px;padding-block:22px;font-size:11px;color:#747a6d;letter-spacing:.15px}
.discipline-inner i{font-style:normal;font-size:16px;color:#959e87}
.projects-section{padding-block:93px 88px}
.section-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:60px}
h2{font-family:var(--serif);font-weight:400;font-size:clamp(40px,4.6vw,58px);line-height:1.12;letter-spacing:-2.1px}
.section-heading h2,.approach-intro h2,.about-copy h2,.contact-inner h2{margin-top:20px}
.section-heading>p{max-width:335px;color:var(--muted);font-size:13px;line-height:1.85;padding-bottom:4px}
.project-toolbar{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:43px;margin-bottom:28px}
.project-filters{display:flex;gap:7px;flex-wrap:wrap}
.project-filters button{border:1px solid transparent;background:transparent;font-size:11px;padding:9px 16px;border-radius:30px;transition:background .2s}
.project-filters button span{font-size:9px;margin-left:7px;opacity:.65}
.project-filters button:hover{background:#eaece1}
.project-filters button.is-active{background:var(--olive);color:var(--white)}
.project-count{font-size:10px;color:#858b7d;white-space:nowrap}
.projects-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:40px 28px}
.project-card{min-width:0}
.project-card--sales{grid-column:span 7}
.project-card--game{grid-column:span 5}
.product-visual{height:352px;border-radius:5px;overflow:hidden;position:relative}
.sales-visual{background:#e2e5e0;border:1px solid #dce1d8}
.sales-visual:before{content:'';position:absolute;width:220px;height:220px;border:1px solid #ced8cd;border-radius:50%;top:-120px;left:-100px}
.sales-window{position:absolute;width:92%;min-width:440px;height:290px;right:-8px;bottom:-12px;transform:rotate(-5deg);background:#fffefa;border:1px solid #cdd4c9;border-radius:9px;box-shadow:-13px 14px 30px #4a53491c;overflow:hidden}
.window-top{height:43px;padding-inline:15px;display:flex;align-items:center;justify-content:space-between;font-size:11px;border-bottom:1px solid #eeeee8}
.window-top strong{font-weight:400;color:#8f9588}
.window-dots{display:flex;gap:4px}
.window-dots b{width:4px;height:4px;border-radius:50%;background:#c2c9bb}
.window-mini-icon{font-size:14px;color:#74836b}
.sales-interface{display:grid;grid-template-columns:38px 37% 1fr;height:calc(100% - 43px)}
.mock-sidebar{display:flex;align-items:center;flex-direction:column;gap:17px;border-right:1px solid #eaece4;padding:12px 6px;color:#99a18f;font-size:13px}
.sidebar-mark{font-family:Georgia,serif;font-size:20px;font-style:italic;color:#59684f;line-height:1}
.mock-sidebar .side-active{background:#e6ebdd;padding:2px 5px;border-radius:4px;color:#58684d}
.mock-sidebar .side-bottom{font-size:8px;background:#f0e9dc;border-radius:50%;width:20px;height:20px;display:grid;place-items:center;margin-top:auto;color:#736553}
.mock-inbox{border-right:1px solid #eaece4;padding:17px 10px;position:relative}
.mock-title{font-size:11px;font-weight:600;display:flex;justify-content:space-between;margin-bottom:20px}
.mock-title span{color:#8f9b83;font-size:12px}
.mock-conversation{display:flex;align-items:center;gap:7px;background:#eff2e8;padding:9px 6px;margin-inline:-4px;position:relative;border-radius:4px}
.mock-conversation i{font-style:normal;font-size:7px;background:#d8e1ce;min-width:24px;height:24px;display:grid;place-items:center;border-radius:50%;color:#5d7151}
.mock-conversation b{font-weight:500;font-size:7px;display:block;white-space:nowrap}
.mock-conversation div>span{font-size:6px;color:#8e9484;display:block;white-space:nowrap;margin-top:3px}
.mock-conversation em{position:absolute;right:5px;top:13px;border-radius:50%;width:3px;height:3px;background:#7c9761}
.conversation-line{height:5px;width:68%;margin:20px 0 0 28px;background:#e7e9e2;border-radius:10px}
.conversation-line.short{width:44%;margin-top:6px;background:#f1f2ed}
.inbox-label{position:absolute;bottom:17px;left:12px;font-size:6px;letter-spacing:1px;color:#a2a892}
.mock-chat{padding:17px 12px;background:#fafbf6;position:relative}
.chat-top{display:flex;align-items:center;gap:6px;font-size:8px;margin-bottom:15px;color:#7b8671}
.chat-top .status-dot{width:4px;height:4px}
.chat-bubble{font-size:7px;line-height:1.65;padding:8px 10px;border-radius:7px;max-width:88%;margin-bottom:10px}
.chat-bubble.incoming{background:#eeeee7;border-bottom-left-radius:1px;color:#727a66}
.chat-bubble.outgoing{background:#617451;color:#f4f7ec;margin-left:auto;border-bottom-right-radius:1px}
.handoff{text-align:center;font-size:7px;line-height:1.8;color:#8e9686;padding-top:5px}
.handoff>span{font-size:10px;display:block;color:#6e825d}
.handoff strong{font-weight:400;color:#6b765e}
.chat-input{position:absolute;bottom:12px;left:12px;right:12px;background:white;border:1px solid #e5e9df;font-size:7px;color:#a4a995;padding:7px 9px;border-radius:4px;display:flex;justify-content:space-between}
.concept-label{position:absolute;left:17px;top:17px;font-size:7px;line-height:1.5;letter-spacing:1.25px;color:#626c59;background:rgba(245,245,234,.88);padding:5px 8px;border-radius:2px}
.game-visual{background:#dce7d9}
.game-landscape{position:absolute;width:100%;height:100%;object-fit:cover;object-position:center 56%}
.game-visual-top{position:absolute;top:25px;left:25px;right:25px;display:flex;align-items:center;justify-content:space-between;color:#466949;z-index:2}
.game-level{font-size:8px;letter-spacing:1.5px}
.game-star{font-size:25px;line-height:1}
.game-visual .concept-label{top:auto;left:auto;right:15px;bottom:14px;background:#f4f6e9e8}
.word-tiles{position:absolute;left:50%;top:82px;transform:translateX(-50%) rotate(-5deg);display:flex;gap:6px}
.word-tiles span{display:grid;place-items:center;font-family:var(--serif);font-size:30px;width:49px;height:57px;border-radius:7px;background:#fdf9e8;border:1px solid #ede6cb;box-shadow:0 5px 0 #dadcc7,0 9px 15px #293b2333;color:#3d5736}
.word-tiles span:nth-child(2){transform:translateY(-7px) rotate(7deg)}
.word-tiles span:nth-child(4){transform:rotate(8deg)}
.game-caption{position:absolute;bottom:50px;left:28px;font-family:var(--serif);font-size:30px;line-height:1.08;letter-spacing:-.7px;color:#fdfef4;text-shadow:0 1px 12px #355b2d66}
.game-caption em{font-weight:400}
.project-content{padding-top:21px}
.project-meta{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:8px;letter-spacing:1.15px;color:#7f8674}
.status-pill{font-size:8px;letter-spacing:0;border:1px solid #d6dbce;padding:3px 8px;border-radius:20px;white-space:nowrap;color:#717d60}
.project-title-row{display:flex;justify-content:space-between;align-items:center;margin-top:10px;gap:15px}
.project-title-row h3{font-family:var(--serif);font-size:29px;font-weight:400;letter-spacing:-.7px}
.project-open{display:grid;place-items:center;width:37px;height:37px;font-size:22px;border:1px solid #d0d6c7;border-radius:50%;flex:none;transition:background .2s,transform .2s}
.project-open:hover{background:var(--sage);transform:rotate(10deg)}
.project-content>p{color:#7a8170;font-size:12px;line-height:1.8;margin-top:10px;max-width:450px}
.project-tags{display:flex;gap:7px;margin-top:17px;flex-wrap:wrap}
.project-tags span{font-size:9px;background:#ebece3;padding:4px 9px;border-radius:3px;color:#747c69}
.project-card--seo{grid-column:span 12;display:grid;grid-template-columns:1.15fr 1fr;gap:45px;border-top:1px solid var(--line);padding-top:38px;align-items:center}
.project-card--seo .product-visual{height:260px;background:#e8e6dc}
.project-card--seo .project-content{padding:10px 18px 10px 0}
.seo-window{position:absolute;left:10%;right:10%;top:42px;background:#fdfcf7;border:1px solid #d5d8c8;border-radius:7px;padding:18px 21px;transform:rotate(-2deg);box-shadow:0 12px 24px #52583d13}
.seo-top{display:flex;align-items:center;gap:10px;font-size:10px}
.seo-symbol{background:#edf0e4;border:1px solid #dce2cb;border-radius:7px;width:30px;height:30px;display:grid;place-items:center;color:#6c8054;font-size:24px}
.seo-top strong{font-size:9px;display:block;font-weight:500}
.seo-top small{font-size:7px;display:block;color:#9a9f8d;margin-top:2px}
.seo-dots{margin-left:auto;font-size:21px;letter-spacing:2px;align-self:flex-start;line-height:1}
.chart-panel{height:100px;position:relative;margin:16px 0 7px}
.chart-panel>svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.chart-grid{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:space-between}
.chart-grid i{border-top:1px dashed #e8ebde}
.seo-controls{display:flex;justify-content:space-between;align-items:center;font-size:6px;color:#919781;gap:10px;border-top:1px solid #e4e7db;padding-top:9px}
.seo-controls i{display:inline-block;width:4px;height:4px;border-radius:50%;background:#768a57;margin-right:3px}
.project-disclaimer{font-size:9px;color:#8b917f;line-height:1.7;margin-top:28px;border-top:1px solid var(--line);padding-top:16px}
.approach-section{background:#e9ede1;padding-block:80px;border-block:1px solid #e0e5d6}
.approach-layout{display:grid;grid-template-columns:1fr 1.15fr;gap:95px}
.approach-intro h2{font-size:47px;letter-spacing:-1.7px}
.approach-intro>p:last-child{font-size:12px;color:#7e8770;line-height:1.9;margin-top:25px;max-width:340px}
.principles{padding-top:22px}
.principles article{display:flex;align-items:flex-start;gap:21px;border-bottom:1px solid #cfd8c2;padding:27px 0}
.principles article:first-child{padding-top:0}
.principles article:last-child{border-bottom:0;padding-bottom:0}
.principle-number{font-size:9px;color:#909b7f;line-height:26px}
.principles h3{font-family:var(--serif);font-weight:400;font-size:23px;letter-spacing:-.4px;margin-bottom:9px}
.principles p{font-size:11px;line-height:1.85;max-width:390px;color:#7b866c}
.principle-symbol{font-family:var(--serif);font-size:22px;margin-left:auto;padding-left:12px;color:#7e9066}
.about-section{padding-block:105px;display:grid;grid-template-columns:.9fr 1.1fr;gap:125px;align-items:center}
.about-note{position:relative;margin:10px 0 10px 25px;transform:rotate(-5deg);padding:56px 38px 28px;background:#e9e3d5;box-shadow:8px 14px 24px #5b573a0c;aspect-ratio:1/1.04;display:flex;flex-direction:column;justify-content:space-between;border:1px solid #e2dccd}
.note-pin{position:absolute;top:-10px;left:44%;width:72px;height:26px;background:#c5c9b580;transform:rotate(6deg)}
.about-note>p{font-family:var(--serif);font-size:36px;line-height:1.35;letter-spacing:-1px;color:#65644f}
.about-note em{color:#85816b}
.note-bottom{display:flex;justify-content:space-between;align-items:flex-end;margin-top:28px;gap:12px}
.note-bottom span{font-size:7px;letter-spacing:1.3px;color:#898573}
.note-bottom svg{width:49px;height:42px;color:#8c8b76}
.about-copy>p:not(.eyebrow){font-size:13px;line-height:1.9;color:var(--muted);margin-top:24px;max-width:450px}
.about-copy .text-link{margin-top:24px}
.contact-section{background:#414d38;color:#f2f0e4;padding-block:65px}
.contact-inner{display:grid;grid-template-columns:1.15fr 1fr;align-items:center;gap:85px}
.contact-inner .eyebrow{color:#acb69c}
.contact-inner h2{font-size:44px;letter-spacing:-1.5px}
.contact-inner h2 em{color:#c5cdb5}
.contact-inner>div>p:not(.eyebrow){font-size:12px;color:#b8c2aa;line-height:1.85;margin-top:20px}
.contact-actions{padding-top:30px}
.contact-email{font-family:var(--serif);font-size:clamp(20px,2.5vw,29px);line-height:1.4;letter-spacing:-.6px;word-break:break-word;border-bottom:1px solid #7b876c;padding-bottom:12px;display:inline-block}
.contact-button-row{display:flex;align-items:center;gap:25px;margin-top:27px}
.copy-email{font-size:10px;background:none;border:0;color:#c7ceba;padding:10px 0;text-decoration:underline;text-underline-offset:4px}
.copy-email-feedback{font-size:10px!important;line-height:1.5;min-height:15px;margin:10px 0 0!important;color:#d0d7c2!important}
.contact-note{font-size:9px!important;color:#a2af92!important;margin-top:5px!important}
.site-footer{padding-block:35px 40px}
.footer-inner{display:flex;align-items:center;justify-content:space-between;gap:30px}
.footer-inner .brand img{width:150px}
.footer-inner>p{font-size:9px;color:#6d7662;line-height:1.8}
.footer-inner>p>span{font-size:8px;color:#8b927f}
.footer-links{display:flex;gap:25px;font-size:10px;color:#7b856c}
.footer-links a:hover{text-decoration:underline;text-underline-offset:4px}
dialog{border:1px solid #e0e3d7;padding:47px 42px 38px;max-width:590px;width:calc(100% - 36px);border-radius:8px;background:var(--paper);color:var(--ink);box-shadow:0 30px 90px #18201455;max-height:85dvh;overflow-y:auto}
dialog::backdrop{background:rgba(30,36,28,.48);backdrop-filter:blur(4px)}
.dialog-close{position:absolute;right:16px;top:12px;font-size:29px;font-weight:300;width:35px;height:35px;background:transparent;border:0;line-height:1}
dialog h2{font-size:37px;margin:15px 0 19px;letter-spacing:-1.2px}
dialog>p:not(.eyebrow){font-size:13px;color:var(--muted);line-height:1.8}
dialog ul{padding-left:20px;margin:22px 0;font-size:12px;color:#6a745e;line-height:1.8}
dialog li{padding-left:5px;margin-top:6px}
.dialog-actions{display:flex;flex-wrap:wrap;gap:12px;padding-top:13px;border-top:1px solid var(--line)}
.dialog-availability{flex-basis:100%;font-size:12px;color:var(--muted);line-height:1.7;margin-bottom:6px}
.noscript-note{font-size:12px;padding:12px 24px;background:#e9eddf;color:#4d5d3c}
.legal-main{max-width:850px;padding-block:55px 85px}
.breadcrumbs{font-size:11px;color:var(--muted);margin-bottom:40px}
.breadcrumbs a{text-decoration:underline;text-underline-offset:3px}
.page-title{font-family:var(--serif);font-size:52px;font-weight:400;letter-spacing:-1.8px;line-height:1.15;margin:16px 0 22px}
.lead{font-size:16px;color:var(--muted);line-height:1.85;max-width:700px}
.prose{margin-top:35px;max-width:740px}
.prose h2{font-family:var(--sans);font-size:19px;font-weight:500;letter-spacing:-.3px;line-height:1.4;margin:32px 0 12px}
.prose p,.prose li{font-size:14px;line-height:1.9;color:#6a7360}
.prose p+p{margin-top:12px}
.prose a{text-decoration:underline;text-underline-offset:4px}
.contact-card{padding:27px 30px;background:#e9ede1;margin-top:35px;border-radius:4px}
.contact-card h2{font-family:var(--serif);font-size:26px;letter-spacing:-.6px;margin:0 0 10px}
.contact-card p{font-size:13px;color:#737f65;margin-bottom:12px}
.contact-card a{word-break:break-word}
@media(min-width:1600px){.hero{padding-block:78px 76px;gap:80px}.hero h1{font-size:94px}}
@media(max-width:1100px){.container{width:calc(100% - 64px)}.hero{gap:35px;padding-block:55px}.hero h1{font-size:73px;letter-spacing:-4px}.hero-description{font-size:14px}.main-nav{gap:25px}.main-nav .nav-contact{margin-left:0}.hero-actions{gap:20px}.text-link{font-size:11px}.hero-art figcaption{padding-inline:18px}.art-topline{padding-inline:20px}.section-heading>p{max-width:300px}.approach-layout{gap:60px}.about-section{gap:70px}.contact-inner{gap:50px}.project-card--seo{gap:32px}.product-visual{height:320px}.sales-window{height:268px}.inbox-label{display:none}.handoff{padding-top:0}}
@media(max-width:900px){.header-inner{height:78px}.brand img{width:142px}.main-nav{gap:20px;font-size:12px}.main-nav .nav-contact{padding:10px 14px;gap:10px}.hero{gap:26px;padding-block:47px}.hero h1{font-size:67px;letter-spacing:-3.5px}.eyebrow{font-size:9px}.hero-description{font-size:13px}.hero-actions{gap:18px;align-items:flex-start;flex-direction:column}.hero-actions .text-link{padding-top:0}.hero-footnote{margin-top:25px}.hero-art{align-self:center}.art-topline{font-size:7px;letter-spacing:1px;padding:20px 15px 0}.hero-art figcaption{font-size:8px;gap:6px;padding:10px 15px}.replay-button{font-size:8px}.section-heading{gap:30px}.section-heading>p{max-width:260px;font-size:12px}h2{font-size:47px}.project-meta{font-size:7px;letter-spacing:.7px}.status-pill{font-size:7px}.project-title-row h3{font-size:25px}.project-content>p{font-size:11px}.projects-grid{gap:30px 20px}.product-visual{height:290px}.sales-window{min-width:400px;height:260px;right:-38px;bottom:-30px}.game-caption{font-size:26px;left:22px}.word-tiles{top:72px}.word-tiles span{width:40px;height:48px;font-size:25px}.game-visual-top{left:20px;right:20px;top:20px}.game-level{font-size:7px}.project-card--seo .product-visual{height:235px}.seo-window{left:7%;right:7%;top:35px;padding:16px}.approach-intro h2{font-size:40px}.approach-layout{gap:40px}.principles h3{font-size:20px}.principles p{font-size:10px}.principles article{gap:14px}.principle-symbol{display:none}.about-section{gap:60px;padding-block:85px}.about-note{padding:43px 25px 23px;margin-left:10px}.about-note>p{font-size:29px}.about-copy h2{font-size:42px}.about-copy>p:not(.eyebrow){font-size:12px}.contact-inner h2{font-size:37px}.contact-button-row{gap:18px;align-items:flex-start;flex-direction:column}.contact-actions{padding-top:10px}.copy-email{padding-block:0}.footer-links{gap:20px}.footer-inner>p{font-size:8px}}
@media(max-width:700px){.container{width:calc(100% - 40px)}.header-inner{height:74px;position:relative}.brand img{width:140px}.menu-toggle{display:flex;align-items:center;gap:14px;border:1px solid #ccd1c1;border-radius:3px;background:transparent;padding:9px 11px;font-size:11px;min-height:40px}.menu-lines{width:15px;height:9px;border-top:1px solid currentColor;border-bottom:1px solid currentColor;display:block}.main-nav{display:none;position:absolute;top:calc(100% + 1px);left:-20px;right:-20px;padding:18px 20px 22px;background:var(--paper);border-bottom:1px solid var(--line);box-shadow:0 12px 18px #2e37280b;flex-direction:column;align-items:stretch;gap:5px;font-size:14px}.main-nav.is-open{display:flex}.main-nav a{padding:11px 10px!important}.main-nav .nav-contact{justify-content:space-between;margin-top:8px}.main-nav>a:after{display:none}.hero{grid-template-columns:1fr;gap:33px;padding-block:38px 35px}.hero h1{font-size:75px;letter-spacing:-4px;margin-block:20px 22px}.hero-description{font-size:14px;max-width:460px;line-height:1.85}.hero-actions{flex-direction:row;gap:25px;align-items:center;margin-top:25px}.hero-actions .text-link{padding-top:8px}.hero-footnote{margin-top:25px}.hero-art{width:100%;max-width:530px;justify-self:center;margin-top:0}.coffee-art-mount{padding-inline:10px}.art-topline{font-size:8px;padding:22px 23px 0}.hero-art figcaption{padding:13px 21px 16px;font-size:10px}.replay-button{font-size:9px}.discipline-inner{padding-block:18px;display:grid;grid-template-columns:1fr 1fr;row-gap:12px;column-gap:20px;font-size:10px}.discipline-inner i{display:none}.discipline-inner>span:before{content:'✳';margin-right:9px;color:#9ca58e;font-size:11px}.projects-section{padding-block:59px 58px}.section-heading{display:block}.section-heading h2{font-size:48px;margin-top:14px}.section-heading>p{font-size:12px;max-width:100%;margin-top:21px}.project-toolbar{margin-top:28px;margin-bottom:23px;gap:10px}.project-filters{gap:3px}.project-filters button{font-size:10px;padding:8px 11px}.project-count{display:none}.projects-grid{grid-template-columns:1fr;gap:35px}.project-card--sales,.project-card--game,.project-card--seo{grid-column:auto}.product-visual{height:330px}.sales-window{width:96%;min-width:380px;right:-20px;bottom:-12px;height:270px}.project-meta{font-size:8px;letter-spacing:1px}.status-pill{font-size:8px}.project-content{padding-top:17px}.project-title-row{margin-top:7px}.project-title-row h3{font-size:29px}.project-content>p{font-size:12px;margin-top:10px}.project-tags{margin-top:14px}.project-tags span{font-size:9px}.game-visual{height:350px}.game-visual-top{top:24px;left:25px;right:25px}.game-level{font-size:8px}.word-tiles{top:80px}.word-tiles span{width:49px;height:57px;font-size:29px}.game-caption{font-size:31px;left:27px;bottom:50px}.project-card--seo{display:block;border:0;padding-top:0}.project-card--seo .product-visual{height:280px}.project-card--seo .project-content{padding:17px 0 0}.seo-window{top:47px;left:9%;right:9%;padding:18px}.chart-panel{height:110px}.seo-controls{font-size:7px}.project-disclaimer{margin-top:25px;font-size:9px}.approach-section{padding-block:55px}.approach-layout{grid-template-columns:1fr;gap:37px}.approach-intro h2{font-size:46px;margin-top:15px}.approach-intro>p:last-child{font-size:12px;max-width:100%;margin-top:20px}.principles{padding-top:0}.principles article{padding-block:23px;gap:19px}.principles h3{font-size:24px}.principles p{font-size:12px;max-width:100%}.principle-number{line-height:30px}.about-section{grid-template-columns:1fr;gap:45px;padding-block:60px}.about-note{width:78%;max-width:330px;margin:15px auto 0;padding:43px 30px 28px;aspect-ratio:1.05/1}.about-note>p{font-size:33px}.about-copy h2{font-size:45px;margin-top:15px}.about-copy>p:not(.eyebrow){font-size:13px;max-width:100%;margin-top:20px}.contact-section{padding-block:49px}.contact-inner{grid-template-columns:1fr;gap:25px}.contact-inner h2{font-size:40px;margin-top:17px}.contact-inner>div>p:not(.eyebrow){font-size:12px;margin-top:20px}.contact-email{font-size:26px;letter-spacing:-.6px}.contact-button-row{flex-direction:row;gap:23px;align-items:center;margin-top:24px}.contact-note{font-size:9px!important}.contact-actions{padding-top:0}.footer-inner{flex-wrap:wrap;justify-content:space-between;gap:24px 18px}.footer-inner .brand img{width:135px}.footer-inner>p{font-size:9px;text-align:right}.footer-inner>p>span{font-size:7px}.footer-links{width:100%;border-top:1px solid var(--line);padding-top:22px;justify-content:space-between;font-size:11px}.site-footer{padding-block:25px 30px}.simple-nav{gap:18px;font-size:11px}.legal-main{padding-block:35px 60px}.breadcrumbs{font-size:10px;margin-bottom:25px}.page-title{font-size:39px;letter-spacing:-1px}.lead{font-size:14px}.prose p,.prose li{font-size:13px}.prose h2{font-size:18px}.contact-card{padding:23px}dialog{padding:42px 25px 28px}dialog h2{font-size:32px}.dialog-actions>.btn{width:100%}}
@media(max-width:380px){.container{width:calc(100% - 32px)}.hero h1{font-size:66px;letter-spacing:-3.5px}.hero-actions{gap:18px}.hero-actions .button{padding-inline:18px;font-size:12px;gap:17px}.hero-actions .text-link{font-size:10px}.project-filters button{font-size:9px;padding:8px 9px}.contact-email{font-size:23px}.contact-button-row{gap:16px}.footer-inner>p>span{display:none}.hero-art figcaption{padding-inline:15px;font-size:9px}.art-topline{padding-inline:17px;font-size:7px}.sales-window{min-width:360px;right:-32px}.game-visual{height:320px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.coffee-stream,.coffee-bean{opacity:0!important}.coffee-fill{opacity:1!important}.coffee-steam{opacity:.55!important}}
@media print{.site-header{position:static}.main-nav,.menu-toggle,.project-toolbar,.replay-button,.copy-email,.project-open,.contact-button-row,dialog{display:none!important}.container{width:95%}.hero{grid-template-columns:1fr 1fr;gap:25px;padding-block:30px}.hero h1{font-size:65px}.projects-section,.about-section{padding-block:30px}.project-card{break-inside:avoid}.contact-section{background:#e9ede1;color:var(--ink)}.contact-inner h2 em,.contact-email,.contact-inner>div>p{color:var(--ink)!important}.site-footer{padding-block:20px}body{font-size:12px}}