/* The work leads; display, reading and wayfinding have distinct roles.
   Space Grotesk, Geist Mono, white space and the responsive geometry are established brand choices. */
:root{
 --site-width:1280px;
 --pad:clamp(22px,4.2vw,54px);
 --signal:#d9ef9a;
 --line:rgba(23,25,22,.18);
 --type-display:clamp(5rem,9vw,10rem);
 --type-page-title:clamp(3.5rem,7.6vw,8.5rem);
 --type-section-title:clamp(2.5rem,4.9vw,5.5rem);
 --type-prose:clamp(1.1875rem,1.4vw,1.375rem);
 --space-cluster:1rem;
 --space-block:2rem;
 --space-section:clamp(3rem,6vw,6rem);
 --reading-measure:65ch;
}
html{scrollbar-color:#a7ada4 var(--paper)}
body>.site-header,body>main,body>.contact-strip,body>.site-footer{inline-size:100%;max-inline-size:var(--site-width);margin-inline:auto}
::selection{background:var(--signal);color:var(--ink)}
input,textarea{caret-color:var(--ink)}
h1,h2,h3,h4{text-wrap:balance;letter-spacing:-.04em}
h1{overflow-wrap:anywhere}
p{text-wrap:pretty}
.status-dot{box-shadow:none}
.mono,.section-label,.project-count,.project-facts{font-variant-numeric:tabular-nums}
.section-label,.eyebrow{letter-spacing:.015em}
.prose{font-size:var(--type-prose);line-height:1.65;letter-spacing:-.01em;max-inline-size:var(--reading-measure)}
.studio-story .prose,.lab-research .prose,.project-story__body.prose,.generic-page>.prose{max-inline-size:var(--reading-measure)}
.prose p{margin-block:0 1.15em}
.prose p+p{margin-top:0}
.prose h3{font-size:1.25em;line-height:1.25;margin-block:1.7em .7em}
.prose h3:first-child{margin-top:0}
.page-intro h1,.generic-page .page-intro h1,.project-intro h1,.studio-intro h1,.contact-page h1{font-size:var(--type-page-title);line-height:1.04;letter-spacing:-.04em;max-inline-size:15ch}
.page-intro__description,.project-subtitle{font-size:clamp(1.25rem,2.2vw,2rem);line-height:1.4;letter-spacing:-.015em;max-inline-size:48ch}
.page-intro{padding-block:var(--space-section) 3rem}
.project-intro{padding-block:3rem}
.project-intro h1{margin-top:2rem;overflow-wrap:anywhere;word-break:normal}
.project-intro__category{margin-top:1.5rem;font-size:.8125rem}
.project-subtitle{margin-top:var(--space-cluster)}
.workshop-format{margin-top:1.5rem;font-size:.875rem;line-height:1.6}
.language-switcher a{opacity:.72}
.text-link:hover{opacity:.8}
.home-opening{height:auto;min-height:clamp(620px,calc(88svh - 98px),940px);max-height:none;padding-top:3.5rem;padding-bottom:1.5rem}
.home-intro__title{font-size:var(--type-display);line-height:1.01;letter-spacing:-.04em;margin-top:0}
.home-intro__title>span{white-space:normal}
.home-intro__bottom{margin-top:clamp(2.5rem,6vh,5rem);padding-top:0;padding-bottom:1.5rem}
.home-intro__bottom p{max-inline-size:45ch;font-size:1.125rem;line-height:1.55;letter-spacing:-.01em}
.home-opening__baseline{padding-block:2rem .5rem;gap:2rem;font-size:.75rem}
.home .selected-section{padding-top:0}
.featured-project__bottom h2{font-size:clamp(4.5rem,8vw,8.5rem);letter-spacing:-.04em;line-height:1}
.featured-project__arrow{font-size:clamp(3.5rem,6vw,6rem)}
.project-card__caption{display:grid;grid-template-columns:minmax(0,1fr);gap:.5rem;padding-top:1.25rem;padding-bottom:0}
.project-card__caption h3{font-size:clamp(1.75rem,2.65vw,2.625rem);line-height:1.16;letter-spacing:-.035em}
.project-card__caption>.mono{max-width:none;text-align:left;font-size:.8125rem;line-height:1.5;color:#555c52}
.project-card__link:hover .project-card__caption h3{transform:none}
.home .project-grid--editorial{padding-top:4rem;row-gap:4.5rem}
.archive-link{padding-block:var(--space-section)}
.manifesto__main{gap:6vw;margin-top:2.5rem}
.manifesto h2{font-size:var(--type-section-title);line-height:1.12;letter-spacing:-.04em}
.manifesto__copy{max-width:38ch;font-size:1.1875rem;line-height:1.65}
.capability-list{margin-top:3rem;gap:.75rem}
.capability-list>span{font-size:.8125rem}
.home .lab-teaser{padding-block:var(--space-section);gap:7vw}
.lab-teaser__graphic{min-height:340px}
.lab__symbol{max-width:360px}
.lab-teaser__copy h2{font-size:var(--type-section-title);line-height:1.08;letter-spacing:-.04em;margin-top:0}
.lab-teaser__copy>p:not(.eyebrow){font-size:1.125rem;line-height:1.65;max-width:38ch}
.clients-section__intro h2{font-size:var(--type-section-title);line-height:1.12}
.clients-section>.section-heading{padding-top:1.5rem;padding-bottom:0}
.client-logos{margin-top:2.5rem}
.technologies-section{padding-block:0 var(--space-section)}
.technologies-section__intro{display:flex;align-items:end;justify-content:space-between;gap:2rem;border-top:1px solid var(--line);padding-top:2rem}
.technologies-section__intro h2{font-size:var(--type-section-title);line-height:1.12;letter-spacing:-.04em}
.technologies-section__intro p{font-size:1.0625rem;line-height:1.6;max-inline-size:32ch}
.technology-logos{list-style:none;margin:2.5rem 0 0;padding:0;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:1rem 1.5rem}
.technology-logo{min-inline-size:0}
.technology-logo>a,.technology-logo__content{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;min-block-size:138px;padding:1rem .5rem;text-align:center}
.technology-logo__mark{display:flex;align-items:center;justify-content:center;inline-size:100%;block-size:56px;transition:transform .25s ease-out}
.technology-logo__image{display:block;inline-size:112px;block-size:56px;max-inline-size:100%;object-fit:contain}
.technology-logo__name{font-size:.875rem;line-height:1.5;overflow-wrap:anywhere;text-wrap:balance}
.technology-logo>a:hover .technology-logo__mark,.technology-logo>a:focus-visible .technology-logo__mark{transform:translateY(-3px)}
.technology-logo>a:hover .technology-logo__name,.technology-logo>a:focus-visible .technology-logo__name{text-decoration:underline;text-underline-offset:5px}
@media(max-width:1000px){.technology-logos{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:600px){.technologies-section__intro{align-items:start;flex-direction:column;gap:1.5rem}.technology-logos{grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem 1rem}.technology-logo>a,.technology-logo__content{min-block-size:128px}.technologies-section__intro p{font-size:1rem}}
@media(prefers-reduced-motion:reduce){.technology-logo__mark{transition:none}.technology-logo>a:hover .technology-logo__mark,.technology-logo>a:focus-visible .technology-logo__mark{transform:none}}
.contact-strip{padding-block:var(--space-section) 3rem}
.contact-strip__link{margin-top:0;gap:var(--space-block)}
.contact-strip h2{font-size:clamp(3rem,6.6vw,7rem);line-height:1.05;letter-spacing:-.04em}
.contact-strip__arrow{font-size:clamp(4rem,7vw,7.5rem)}
.contact-strip__bottom{margin-top:var(--space-block)}
.footer-brand{font-size:clamp(4rem,7vw,7.5rem)}
.footer-top>p{font-size:1rem;line-height:1.6}
.footer-bottom{font-size:.8125rem;gap:1.5rem}
.project-story{align-items:start;column-gap:clamp(2rem,4vw,4rem);padding-block:var(--space-section)}
.project-facts dt{font-size:.75rem;line-height:1.6}
.project-facts dd{font-size:.875rem;line-height:1.65}
.project-facts>div{padding-block:1rem 1.5rem}
.next-project{background:transparent;padding-block:2rem 3.5rem}
.next-project h2{font-size:clamp(2.25rem,4.7vw,5rem);line-height:1.12;letter-spacing:-.04em}
.next-project>div>span{font-size:clamp(3rem,5vw,5rem)}
.studio-story{padding-block:var(--space-section)}
.services-intro,.service-row__body{max-inline-size:var(--reading-measure)}
.services-intro{margin-block:2rem 3rem}
.service-row summary{gap:2rem;padding-block:1.75rem}
.service-row summary h3{font-size:clamp(1.875rem,3.1vw,3.25rem);line-height:1.17;letter-spacing:-.035em}
.service-row__body{font-size:1.1875rem;line-height:1.65;margin-bottom:2.5rem}
.service-row__body h4{font-size:1.375rem;line-height:1.35;margin-bottom:1.25rem}
.process{background:transparent;color:var(--ink);border-top:1px solid var(--line);padding-block:var(--space-section)}
.process>h2{font-size:var(--type-section-title);line-height:1.12}
.process-grid h3,.workshop-row h3{font-size:clamp(1.75rem,2.7vw,2.75rem);line-height:1.2;letter-spacing:-.035em}
.process-grid p{font-size:1.0625rem;line-height:1.65}
.lab-research{gap:4vw;padding-bottom:var(--space-section)}
.lab-controls{background:#f0f5e5}
.lab-canvas{background:#101416;color:#e1eacb}
.lab-controls select{width:100%;margin-top:.75rem;padding:.75rem 2rem .75rem .75rem;border:1px solid var(--line);border-radius:0;background:transparent;color:var(--ink);font:500 1rem/1.5 var(--mono);cursor:pointer}
.lab-controls label{font-size:.9375rem}
.lab-controls__buttons{flex-wrap:wrap;justify-content:flex-start;gap:1rem 1.5rem}
.lab-controls__buttons .pill-link{font-size:1rem}
.lab-canvas__hint{font-size:.75rem;line-height:1.6}
.lab-controls h3{font-size:clamp(2.25rem,4vw,3.5rem);line-height:1.12;letter-spacing:-.04em}
.workshops__title{font-size:var(--type-section-title);line-height:1.12;letter-spacing:-.04em}
.contact-page h1{margin-top:0;max-inline-size:15ch;padding-right:.8em}
.contact-page h1>span{font-size:.7em;right:0;top:0;color:var(--ink)}
.contact-layout{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(2rem,5vw,5rem);margin-top:4rem;padding-top:2rem}
.contact-direct.prose{max-inline-size:38ch}
.contact-direct.prose p{font-size:1.1875rem;line-height:1.65}
.contact-email{font-size:clamp(1.375rem,2.1vw,2rem);letter-spacing:-.025em;overflow-wrap:anywhere}
.contact-form__note,.contact-form>[role=status],.copy-status{font-size:.8125rem;line-height:1.65}
.contact-form__trap{position:absolute;inline-size:1px;block-size:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.contact-form button:disabled{opacity:.65;cursor:wait}
.contact-form__note .text-link{font-size:inherit}
.game-player{background:#f5f7f1}
.game-card__heading h3{font-size:clamp(1.75rem,2.65vw,2.75rem);line-height:1.2;letter-spacing:-.035em}
.game-card__actions .text-link{font-size:.875rem}
/* Keep column spacing tied to the capped composition on ultrawide displays. */
@media(min-width:1280px){
 .manifesto__main{gap:76.8px}
 .home .lab-teaser{gap:89.6px}
 .lab-research{gap:51.2px}
 .project-grid{column-gap:67.84px}
 .studio-story{gap:89.6px}
 .workshop-single__content{gap:64px}
 .studio-intro__bottom>p{margin-right:89.6px}
 .generic-page>.prose{margin-right:102.4px}
 .footer-top>p{margin-right:76.8px}
}
.project-video__figure{margin:1.5rem 0 0}
.project-video__figure>iframe{display:block;width:100%;height:auto;aspect-ratio:16/9;border:0;background:var(--ink)}
.project-video__caption{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:.75rem 2rem;margin-top:1rem}
.project-video__caption>span{font-variant-numeric:tabular-nums}
@media(max-width:1100px){
 .contact-layout{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:3rem}
 .service-row__body,.services-intro{margin-left:3rem}
}
@media(max-width:960px){
 .desktop-nav{display:none}
 .menu-toggle{display:block;margin-left:0}
 .site-header{gap:1.5rem}
 .site-header .brand{margin-right:auto}
 .mobile-nav{inset:var(--header-height,98px) 0 0;overflow:auto;gap:2rem;overscroll-behavior:contain}
 .mobile-nav-list{list-style:none;margin:0;padding:0}
 .mobile-nav-list a{font-family:var(--mono);font-size:clamp(2rem,6vw,3.25rem);line-height:1.6;font-weight:500;letter-spacing:-.03em}
 .contact-layout{grid-template-columns:minmax(0,1fr);gap:3rem}
 .contact-direct.prose{max-inline-size:var(--reading-measure)}
 .contact-form{border-top:1px solid var(--line);padding-top:2rem}
}
@media(max-width:760px){
 :root{--pad:22px;--type-display:clamp(2.75rem,14.4vw,6.5rem);--type-page-title:clamp(2.75rem,10vw,4.5rem);--type-section-title:clamp(2rem,8vw,3rem);--type-prose:1.125rem}
 .site-header{gap:.875rem}
 .home-opening{height:auto;min-height:560px;max-height:none;padding-top:2.5rem}
 .home-intro__title{font-size:var(--type-display);line-height:1.03;letter-spacing:-.04em}
 .home-intro__bottom{margin-top:2.5rem;gap:1.5rem;padding-bottom:1rem}
 .home-intro__bottom p{font-size:1.0625rem;line-height:1.6}
 .home-opening__baseline{padding-top:2rem;gap:1rem;font-size:.75rem}
 .section-heading{gap:1.5rem;align-items:baseline}
 .section-heading>.mono:last-child{font-size:.75rem}
 .home .project-grid--editorial{padding-top:2.5rem;row-gap:3rem}
 .project-card__caption{display:grid;gap:.5rem}
 .project-card__caption h3{font-size:1.75rem}
 .project-card__caption>.mono{font-size:.8125rem;max-width:none;text-align:left}
 .featured-project__bottom h2{font-size:clamp(3.5rem,15vw,5.5rem)}
 .lab-teaser__graphic{min-height:240px}
 .lab__symbol{max-width:260px}
 .contact-strip h2{font-size:clamp(2.25rem,9vw,4rem)}
 .contact-strip__arrow{font-size:3.75rem}
 .contact-strip__bottom{gap:1.5rem}
 .footer-bottom{font-size:.75rem}
 .project-intro{padding-block:2rem}
 .project-intro h1{font-size:var(--type-page-title);margin-top:1.5rem}
 .project-subtitle{font-size:1.375rem;line-height:1.4}
 .project-facts dt{font-size:.75rem}.project-facts dd{font-size:.875rem}
 .service-row summary{gap:1rem;padding-block:1.5rem}
 .service-row summary h3{font-size:1.75rem}
 .service-row__body,.services-intro{margin-left:0}
 .service-row__body{font-size:1.125rem}
 .contact-page h1{font-size:var(--type-page-title);padding-right:0}
 .contact-page h1>span{position:static;font-size:.65em;margin-left:.15em}
 .contact-layout{margin-top:2.5rem;gap:2.5rem}
 .contact-direct.prose p{font-size:1.125rem}
 .contact-form__note,.contact-form>[role=status]{font-size:.8125rem}
 .archive-link{align-items:flex-start}
}
@media(prefers-reduced-motion:reduce){
 .game-player__icon{transition:none}
}
@media(max-width:360px){:root{--pad:17px}}
