/* OA Motion — agency foundation and component styles. */

/* move-motion.css */
.make-it-move h2{line-height:1.12}
.move-anchor{display:inline-block;vertical-align:bottom}
.move-word{position:relative;display:inline-flex;vertical-align:bottom;isolation:isolate}
.move-letter{display:block;position:relative;overflow:clip;height:1.12em}
.move-reel{display:block}.move-reel>span{display:block;height:1.12em;line-height:1.12}
.move-word:before{content:attr(data-text);position:absolute;inset:0;line-height:1.12;color:transparent;-webkit-text-stroke:1px var(--keyword-ink,#080808);opacity:var(--trail-opacity,0);transform:translate3d(var(--trail-x,0em),0,0);z-index:-1;pointer-events:none}
.work-intro .move-word,.simulations .move-word{--keyword-ink:#afff41;color:var(--lime)}
.work-intro h2,.simulation-intro h2,.contact h2{line-height:1.12}
.move-running .move-reel,.move-running .move-letter{will-change:transform}
.motion-paused .move-letter,.motion-paused .move-reel{transform:none!important}.motion-paused .move-word:before{opacity:0}
@media(prefers-reduced-motion:reduce){.move-letter,.move-reel{transform:none!important}.move-word:before{display:none}}


/* comparison.css */
.work-intro{display:block;padding:var(--section-space) var(--wide-gutter) 40px}.work-intro h2{font-size:var(--type-section);line-height:1.06}
.comparison-track{height:180svh;position:relative}.comparison-pin{position:sticky;top:9svh;height:82svh;display:grid;place-items:center;padding:20px var(--gutter)}
.render-comparison{position:relative;width:min(100%,calc((82svh - 170px)*16/9));max-width:1120px;margin:0;--reveal:50%}
.comparison-frame{position:relative;aspect-ratio:16/9;isolation:isolate;background:#171717;overflow:hidden}
.comparison-fallback,.comparison-canvas,.comparison-fallback img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none;user-select:none}.comparison-final-poster{clip-path:inset(0 calc(100% - var(--reveal)) 0 0)}
.comparison-canvas{opacity:0}.comparison-canvas.is-ready{opacity:1}.comparison-video{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.comparison-label{position:absolute;z-index:2;top:20px;color:#fff;background:#080808d9;padding:8px 11px;font:var(--type-label) 'DM Mono',monospace;letter-spacing:-.02em;pointer-events:none}.comparison-label-final{left:20px;opacity:var(--final-label-opacity,1)}.comparison-label-clay{right:20px;opacity:var(--clay-label-opacity,1)}
.comparison-divider{position:absolute;z-index:2;inset:0 auto 0 var(--reveal);width:1px;background:#fff;box-shadow:0 0 3px #0008;pointer-events:none;opacity:var(--divider-opacity,1)}.comparison-divider>span{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:grid;place-items:center;width:48px;height:48px;border:1px solid #ffffffa6;border-radius:50%;background:#080808df;color:white}.comparison-divider svg{width:24px;height:24px}
.comparison-range{appearance:none;-webkit-appearance:none;position:absolute;z-index:3;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:ew-resize;touch-action:pan-y}.comparison-range::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:1px;height:48px}.comparison-range::-moz-range-thumb{width:1px;height:48px;border:0}.comparison-frame:has(.comparison-range:focus-visible){outline:3px solid var(--lime);outline-offset:5px}
.render-comparison figcaption{position:absolute;top:100%;inset-inline:0;display:flex;justify-content:space-between;align-items:start;gap:24px;padding-top:20px;font-size:14px;line-height:1.4}.render-comparison figcaption h2{font-size:15px;font-weight:500;letter-spacing:-.02em;margin-bottom:4px}.render-comparison figcaption p{color:#c8c8c2}#comparison-help{text-align:right;font-size:12px}
@media(max-width:700px){.work-intro{padding:60px var(--gutter) 32px;display:block}.work-intro h2{font-size:var(--type-section)}.work-intro>p{margin-top:24px;font-size:18px;padding:0}.work-intro>p br{display:none}.comparison-track{height:150svh}.comparison-pin{top:19svh;height:62svh;padding:20px var(--gutter)}.render-comparison{width:min(100%,calc((100svh - 210px)*16/9));max-width:none}.comparison-label{top:12px;padding:6px 8px;font-size:var(--type-label)}.comparison-label-final{left:12px}.comparison-label-clay{right:12px}.comparison-divider>span{width:40px;height:40px}.comparison-divider svg{width:21px;height:21px}.render-comparison figcaption{padding:18px 0 0;font-size:12px;gap:12px}.render-comparison figcaption h2{font-size:14px}#comparison-help{font-size:var(--type-label)}.film-showcase .project-context{padding-top:30px}}
@media(prefers-reduced-motion:reduce){.comparison-track{height:auto}.comparison-pin{position:relative;top:auto;height:auto;padding-block:25px 45px}.render-comparison{width:100%}.render-comparison figcaption{position:static}}



/* style.css */
@font-face{font-family:DM;src:url('assets/dm-sans-400.ttf')}@font-face{font-family:DM;src:url('assets/dm-sans-500.ttf');font-weight:500}
:root{--lime:#afff41;--ink:#090909;--muted:#a6a7a1;--edge:32px;--gutter:32px;--type-label:12px;--section:clamp(80px,8vw,128px)}*{box-sizing:border-box}html{scroll-behavior:auto}body{margin:0;background:var(--ink);color:#f2f2ed;font-family:DM,Arial,sans-serif;-webkit-font-smoothing:antialiased}h1,h2,h3,p,figure,blockquote{margin:0}h1,h2,h3{font-weight:400}a{color:inherit;text-underline-offset:5px}button{font:inherit}img,video{max-width:100%;display:block}.measure{width:calc(100% - var(--edge)*2);max-width:1200px;margin-inline:auto}.skip{position:absolute;top:-100px;z-index:50}.skip:focus{top:24px;left:24px}.brand{position:absolute;z-index:3;left:max(var(--edge),calc((100% - 1200px)/2));right:max(var(--edge),calc((100% - 1200px)/2));top:32px;display:flex;align-items:center;justify-content:space-between}.brand img{width:126px;height:auto;filter:brightness(0) invert(1)}.brand span{font-size:13px}.hero{position:relative;height:100svh;min-height:680px;max-height:1400px;isolation:isolate;overflow:clip}.hero-film,.hero-shade{position:absolute;inset:0;height:100%;width:100%;object-fit:cover;z-index:-2}.hero-shade{z-index:-1;background:linear-gradient(180deg,#0002,#0005 65%,#000c)}.hero-copy{height:100%;position:relative}.hero h1{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip-path:inset(50%)}.hero-artwork{position:absolute;left:50%;top:44%;transform:translate(-50%,-50%);width:min(1440px,calc(100vw - 32px));aspect-ratio:16/9;pointer-events:none}.hero-ae-poster,.hero-ae-canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}.hero-ae-canvas{opacity:0}.hero-ae-playing .hero-ae-canvas{opacity:1}.hero-ae-playing .hero-ae-poster{opacity:0}.hero-ae-video{display:none}.hero-artwork-failed .hero-artwork{display:none}.hero-artwork-failed h1{position:static;clip-path:none;width:auto;height:auto;font-size:100px;padding-top:25svh}.hero-meta{position:absolute;bottom:12%;inset-inline:0;display:flex;justify-content:space-between;align-items:end;gap:32px}.hero-meta p{font-size:20px;line-height:1.5}.hero-meta>span{font-size:12px;display:flex;gap:32px;align-items:center}.hero-meta>span>span{font-size:30px}.manifesto{padding-block:var(--section)}.manifesto h2{font-size:clamp(44px,6.6vw,96px);line-height:1.15;letter-spacing:-.05em}.marked-word{position:relative;display:inline-block;isolation:isolate}.idea-image{position:absolute;inset:-12% -8%;width:116%;max-width:none;height:124%;z-index:-1}.read-word{display:inline-block}.intro-bottom{margin-top:64px;display:grid;grid-template-columns:1fr 1fr;gap:48px;border-top:1px solid #ffffff26;padding-top:24px;font-size:16px;line-height:1.5}.intro-bottom>span{color:var(--lime)}.intro-bottom p{max-width:440px;color:var(--muted)}.move-band{background:var(--lime);color:var(--ink);min-height:56svh;display:grid;align-items:center;padding:80px 0;overflow:clip}.move-band h2{text-align:center;font-size:clamp(54px,9vw,128px);letter-spacing:-.055em;white-space:nowrap}.move-word{letter-spacing:-.055em}.move-word:before{letter-spacing:inherit}.chapter{padding-block:var(--section)}.chapter-head{display:grid;grid-template-columns:1.5fr 1fr;gap:64px;align-items:end;margin-bottom:64px}.eyebrow{font-size:12px;color:var(--muted);display:block;line-height:1.4}.chapter-head .eyebrow{margin-bottom:24px}.chapter-head h2{font-size:clamp(48px,6.3vw,88px);line-height:1.05;letter-spacing:-.05em}.chapter-head>p{font-size:18px;line-height:1.55;color:var(--muted);padding-bottom:8px}.tv .chapter-head h2,.ooh .chapter-head h2{font-size:clamp(88px,13vw,192px);line-height:.9}.media{position:relative;overflow:hidden;background:#121312}.media video{width:100%;height:100%;object-fit:cover}.portrait{aspect-ratio:9/16}.landscape{aspect-ratio:16/9}figcaption{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding-top:20px;font-size:13px;line-height:1.5}figcaption h3{font-size:14px;font-weight:500}figcaption>span{color:var(--muted)}.social-wall{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.social-wall .media{aspect-ratio:auto;height:min(88svh,calc((100vw - 24px)*16/27))}.social-wall figcaption{display:block;padding:24px;text-align:center}.social-wall figcaption>span{display:block;margin-top:4px}.social-wall figure:first-child figcaption{padding-left:max(24px,calc((100vw - 1200px)/2));text-align:left}.social-wall figure:last-child figcaption{padding-right:max(24px,calc((100vw - 1200px)/2));text-align:right}.film{background:#111211}.film-pair{display:grid;grid-template-columns:minmax(0,1.8fr) minmax(0,.75fr);gap:80px;align-items:center}.film-action .media{max-height:430px}.film-action video{object-fit:contain}.film-breath{width:100%;max-width:300px;justify-self:end}.film-breath figcaption{display:block}.film-breath figcaption>span{display:block;margin-top:4px}.film-note{font-size:clamp(28px,3.5vw,44px);line-height:1.2;letter-spacing:-.03em;margin-top:48px;max-width:520px}.screen .media{aspect-ratio:auto;height:min(88svh,calc(100vw * 9/16))}.tv-screen video{object-fit:contain;background:#050505}.screen figcaption{padding-top:24px}.tv-pair{display:grid;grid-template-columns:1fr 1fr;gap:32px;margin-top:72px}.ooh{background:#111211}.ooh-detail{display:grid;grid-template-columns:1fr 1.3fr;gap:120px;align-items:center;padding-block:112px}.ooh-detail figure{width:100%;max-width:340px}.ooh-detail h3{font-size:clamp(40px,5.2vw,72px);line-height:1.05;letter-spacing:-.045em;margin-top:24px}.ooh-detail>div>p{font-size:18px;line-height:1.6;color:var(--muted);margin-top:32px}.comparison-intro h3{font-size:clamp(38px,5vw,68px);letter-spacing:-.04em;line-height:1.1;margin-top:24px}.comparison-track{height:160svh}.comparison-pin{top:5svh;height:90svh;padding:24px var(--edge)}.render-comparison{width:min(100%,calc((90svh - 144px)*16/9));max-width:1680px}.render-comparison .comparison-caption{max-width:1200px;margin-inline:auto;left:0;right:0}.render-comparison .comparison-label{font-family:DM,Arial,sans-serif;letter-spacing:0;font-size:12px}.render-comparison figcaption h2{letter-spacing:0}.reference{display:grid;grid-template-columns:1fr 1.5fr;gap:64px;align-items:center;border-top:1px solid #ffffff26;margin-top:64px;padding-top:64px}.reference h3{font-size:36px;line-height:1.15;letter-spacing:-.03em;margin-top:20px}.reference p{font-size:17px;line-height:1.55;color:var(--muted);margin-top:20px;max-width:340px}.reference .reference-credit{font-size:12px;color:#d7d7cf}.reference-player iframe{width:100%;aspect-ratio:16/9;border:0;background:#161616;display:block}.reference-player>a{display:inline-block;font-size:12px;color:var(--muted);margin-top:16px}.services{padding-block:var(--section)}.services-intro{display:grid;grid-template-columns:1.4fr 1fr;gap:24px 72px;align-items:end;margin-bottom:64px}.services-intro .eyebrow{grid-column:1/-1}.services h2{font-size:clamp(42px,5.5vw,76px);line-height:1.05;letter-spacing:-.05em}.services-intro>p{font-size:18px;line-height:1.6;color:var(--muted)}.service-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px 64px}.service-grid article{border-top:1px solid #ffffff30;padding-top:24px}.service-grid h3{font-size:25px;letter-spacing:-.025em}.service-grid p{font-size:17px;color:var(--muted);line-height:1.55;margin-top:12px;max-width:430px}.ai-notes{border-top:1px solid #ffffff30;padding-top:32px;display:grid;grid-template-columns:1fr 1fr;gap:64px;margin-top:64px}.ai-notes h3{font-size:17px;font-weight:500}.ai-notes p{font-size:15px;line-height:1.6;color:var(--muted);margin-top:12px;max-width:450px}.ai-notes .ai-quote{color:#e3e4db}.testimonials{background:#eeeee9;color:var(--ink);padding:var(--section) 0}.testimonials h2{font-size:clamp(44px,5.2vw,72px);line-height:1.1;letter-spacing:-.04em;margin-bottom:72px}.quotes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px}.quote{display:flex;flex-direction:column;border-top:1px solid #0003;padding-top:32px}.client-logo{height:60px;display:flex;align-items:center;margin-bottom:32px}.client-logo img{max-width:166px;max-height:60px}.quote blockquote{font-size:clamp(25px,2.2vw,32px);line-height:1.3;letter-spacing:-.025em;margin-bottom:32px}.quote figcaption{display:block;margin-top:auto;padding-top:0;font-size:13px}.quote figcaption strong{font-weight:500;display:block}.quote figcaption span{display:block;color:#64665f;margin-top:4px}.contact{background:var(--lime);color:var(--ink);padding:104px 0 80px;overflow:clip}.contact>.measure>p{font-size:20px;line-height:1.5;text-align:center}.contact h2{font-size:clamp(72px,13vw,176px);letter-spacing:-.055em;text-align:center;margin:56px 0 80px;white-space:nowrap}.contact-details{border-top:1px solid #0003;padding-top:28px;display:flex;justify-content:space-between;gap:32px;font-size:16px}.contact-details>div{display:grid;gap:8px}.contact-details a{text-decoration:none}.contact-details a:hover{text-decoration:underline}.motion-toggle{position:fixed;bottom:20px;left:20px;border:1px solid #ffffff40;background:#111e;color:#fff;z-index:10;font-size:11px;padding:12px;cursor:pointer}.preview-note{position:fixed;bottom:20px;right:20px;background:#111e;color:#b9bab3;font-size:11px;padding:12px;z-index:10}a:focus-visible,button:focus-visible{outline:2px solid #82bc36;outline-offset:5px}.word-mask{display:inline-block;overflow:clip;vertical-align:top;padding-bottom:.12em;margin-bottom:-.12em}.motion-word{display:inline-block}
@media(max-width:800px){:root{--edge:24px;--gutter:24px;--section:80px}.brand{top:24px}.hero{min-height:600px}.hero-artwork{width:110vw;top:42%}.hero-meta{bottom:12%;display:block}.hero-meta p{font-size:17px}.hero-meta>span{margin-top:32px}.manifesto h2{font-size:clamp(42px,7.4vw,60px)}.intro-bottom{grid-template-columns:1fr;gap:16px;margin-top:40px}.move-band{min-height:40svh;padding:64px 0}.chapter-head,.services-intro{grid-template-columns:1fr;gap:24px;margin-bottom:40px}.chapter-head .eyebrow{margin-bottom:20px}.chapter-head>p{padding:0}.social-wall{gap:8px}.social-wall figcaption{padding:16px;font-size:11px}.social-wall figcaption h3{font-size:13px}.social-wall figure:first-child figcaption{padding-left:24px}.social-wall figure:last-child figcaption{padding-right:24px}.film-pair{gap:32px;grid-template-columns:1.5fr 1fr}.film-pair figcaption{display:block}.film-pair figcaption>span{display:block;margin-top:4px}.film-note{font-size:30px;margin-top:32px}.tv-pair{margin-top:48px;gap:24px}.tv-pair figcaption{display:block}.tv-pair figcaption>span{display:block;margin-top:4px}.ooh-detail{gap:48px;padding-block:80px}.ooh-detail>div>p br{display:none}.reference{grid-template-columns:1fr;gap:32px;margin-top:64px;padding-top:40px}.reference p{max-width:560px}.service-grid,.ai-notes{gap:32px}.quotes{gap:24px}.quote blockquote{font-size:24px}.testimonials h2{margin-bottom:48px}.contact{padding-block:80px}.contact-details{flex-direction:column}.contact-details a{overflow-wrap:anywhere}}
@media(max-width:520px){.hero-artwork{width:110vw}.hero-meta{bottom:10%}.manifesto h2{font-size:42px}.move-band h2{font-size:clamp(42px,11.5vw,60px)}.chapter-head h2{font-size:44px}.tv .chapter-head h2,.ooh .chapter-head h2{font-size:112px}.social-wall{grid-template-columns:1fr 1fr;gap:32px 8px}.social-wall figure:first-child{grid-column:1/-1}.social-wall .media{height:auto;aspect-ratio:9/16}.social-wall figure:first-child .media{aspect-ratio:4/5}.social-wall figure:first-child video{object-position:center 42%}.social-wall figure:first-child figcaption{display:flex;text-align:left;padding-right:24px;align-items:baseline}.social-wall figure:nth-child(2) figcaption{text-align:left;padding-left:24px}.social-wall figure:last-child figcaption{text-align:right}.film-pair{gap:40px;grid-template-columns:1fr}.film-note{font-size:32px;margin-top:28px}.film-breath{max-width:240px;justify-self:end}.screen .media{height:auto;aspect-ratio:16/9}.screen figcaption{display:block;padding-top:20px}.screen figcaption>span{display:block;margin-top:4px}.tv-pair{grid-template-columns:1fr;gap:32px}.ooh-detail{grid-template-columns:1fr;gap:40px}.ooh-detail figure{max-width:260px}.ooh-detail>div{padding-left:16px}.comparison-track{height:125svh}.comparison-pin{top:12svh;height:75svh;padding-inline:0}.render-comparison{width:100%}.render-comparison .comparison-caption{padding-inline:24px;font-size:12px}.render-comparison figcaption h2{font-size:13px}.comparison-intro h3{font-size:40px}.reference{margin-top:32px}.service-grid,.ai-notes{grid-template-columns:1fr}.service-grid{gap:28px}.service-grid h3{font-size:23px}.quotes{grid-template-columns:1fr;gap:40px}.quote{padding-top:24px}.client-logo{margin-bottom:24px}.quote blockquote{font-size:30px;margin-bottom:24px}.contact>.measure>p{font-size:17px}.contact h2{font-size:clamp(60px,17vw,88px);margin-block:40px 56px}.preview-note{display:none}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.comparison-track{height:auto}.comparison-pin{position:relative;top:auto;height:auto;padding-block:32px}.render-comparison .comparison-caption{position:static}.word-mask .motion-word{transform:none!important}}

html.lenis{scroll-behavior:auto!important}.social-comparison .comparison-track{height:140svh}.social-wall{grid-template-columns:1fr 1fr;gap:12px}.social-wall .media{height:88svh}.social-detail{max-width:880px;display:grid;grid-template-columns:1fr 1fr;gap:72px;margin-top:96px}.social-detail figcaption{display:block}.social-detail figcaption>span{display:block;margin-top:4px}.social-wall figure:last-child figcaption{text-align:right}.social-comparison{margin-bottom:64px}
@media(max-width:800px){.social-detail{gap:32px;margin-top:64px}.social-wall figcaption h3{font-size:14px}.social-wall figcaption{font-size:12px}.social-wall .media{height:72svh}.social-comparison{margin-bottom:32px}}
@media(max-width:520px){.social-wall{grid-template-columns:1fr;gap:32px}.social-wall figure:first-child{grid-column:auto}.social-wall .media{height:auto;aspect-ratio:4/5}.social-wall figcaption,.social-wall figure:last-child figcaption{display:flex;text-align:left;padding:16px 24px;gap:12px}.social-wall figcaption>span{margin-top:0;text-align:right}.social-detail{gap:16px}.social-detail figcaption h3{font-size:13px}.social-detail figcaption{font-size:11px}.social-comparison .comparison-track{height:120svh}}
@media(prefers-reduced-motion:reduce){.social-comparison .comparison-track{height:auto}}


/* refinements-v3.css */
/* Third pass: full native frames, one compact film strip and a scroll-led Social header. */
.move-band{min-height:70svh;padding-block:104px}.move-band h2{font-size:clamp(60px,9.6vw,136px)}
.social{padding-top:0}.social-header-track{height:180svh}.social-header-pin{top:0;height:100svh;padding:0;display:block;overflow:clip;background:#090909;isolation:isolate}.social-header-title{position:absolute;inset:8svh 0 auto;z-index:4;pointer-events:none}.social-header-title .eyebrow{margin-bottom:24px}.social-header-title>div{display:grid;grid-template-columns:1.5fr 1fr;gap:64px;align-items:end}.social-header-title h2{font-size:clamp(52px,7.3vw,104px);line-height:1;letter-spacing:-.05em}.social-header-title p{font-size:18px;line-height:1.5;color:#c7c8c1;padding-bottom:8px}.social-header-pin .render-comparison{position:absolute;top:50%;left:0;width:100%;max-width:none;transform:translateY(-50%) scale(.78);transform-origin:50% 50%}.social-header-pin .comparison-frame{aspect-ratio:16/9;width:100%}.social-header-pin .comparison-frame:after{content:"";position:absolute;inset:70% 0 0;pointer-events:none;background:linear-gradient(transparent,#0009)}.social-header-pin .comparison-caption{position:absolute;top:auto;bottom:24px;max-width:1200px;z-index:4;padding:0;pointer-events:none}.social-header-pin .comparison-caption h2{font-size:15px}.social-header-pin .comparison-caption p{color:#ddd}.rail-heading{display:flex;justify-content:space-between;align-items:center;gap:24px;padding-block:48px 32px}.rail-heading>p{font-size:24px;letter-spacing:-.025em}.rail-heading>span{display:flex;gap:32px;font-size:12px;color:var(--muted)}.rail-count{font-variant-numeric:tabular-nums;min-width:46px;color:#eee}.project-rail{--rail-height:clamp(380px,69svh,760px);display:flex;gap:28px;overflow-x:auto;overflow-y:hidden;padding:0 max(var(--edge),calc((100% - 1200px)/2)) 24px;scroll-padding-inline:max(var(--edge),calc((100% - 1200px)/2));scroll-snap-type:x proximity;scrollbar-width:thin;scrollbar-color:#696b62 #1b1c19;cursor:grab;overscroll-behavior-x:contain;touch-action:pan-x pan-y}.project-rail.dragging{cursor:grabbing;scroll-snap-type:none;user-select:none}.project-card{flex:0 0 auto;width:calc(var(--rail-height)*9/16);scroll-snap-align:center}.project-card .media{height:var(--rail-height);aspect-ratio:9/16}.project-card video{object-fit:contain!important;transform:none!important;user-select:none;-webkit-user-drag:none}.project-card figcaption{display:block}.project-card figcaption>span{display:block;margin-top:4px}.project-card:focus-visible{outline:2px solid var(--lime);outline-offset:6px}.tv-screen .media{height:auto;aspect-ratio:16/9}.tv-screen video,.samsung-project video{object-fit:contain}.samsung-project .media{aspect-ratio:16/9;height:auto;background:#080808}
@media(min-width:2200px){.social-header-pin .render-comparison{width:min(100%,calc(96svh * 16/9));left:50%;margin-left:calc(min(100vw,96svh * 16/9)/-2)}}
@media(max-width:800px){.move-band{min-height:56svh;padding-block:80px}.social-header-title{top:7svh}.social-header-title>div{grid-template-columns:1fr;gap:24px}.social-header-title h2{font-size:clamp(48px,8vw,68px)}.social-header-title p{font-size:16px}.social-header-title p br{display:none}.project-rail{gap:20px}.rail-heading>p{font-size:21px}.rail-heading>span{gap:16px}.social-header-pin .comparison-caption{bottom:16px}.social-header-pin .comparison-caption h2{font-size:13px}}
@media(max-width:520px){.move-band{min-height:54svh;padding-block:88px}.move-band h2{font-size:clamp(46px,12vw,64px)}.social-header-track{height:135svh}.social-header-pin{height:82svh}.social-header-title{top:6svh}.social-header-title h2{font-size:48px}.social-header-title .eyebrow{margin-bottom:20px}.social-header-title>div{gap:20px}.social-header-pin .comparison-caption{bottom:12px;width:calc(100% - 32px);padding:0;font-size:11px}.social-header-pin .comparison-caption h2{font-size:12px}.social-header-pin #comparison-help{font-size:10px}.social-header-pin .comparison-label{font-size:10px}.social-header-pin .comparison-divider>span{width:36px;height:36px}.rail-heading{display:block;padding-block:32px 24px}.rail-heading>p{font-size:22px}.rail-heading>span{justify-content:space-between;margin-top:16px}.project-rail{--rail-height:60svh;gap:16px}.project-card figcaption{font-size:12px}.project-card figcaption h3{font-size:14px}}
@media(prefers-reduced-motion:reduce){.social-header-track{height:auto}.social-header-pin{height:auto;padding-top:56px;overflow:visible}.social-header-title{position:static;padding-bottom:40px}.social-header-pin .render-comparison{position:relative;top:auto;left:auto;width:100%;margin:0;transform:none!important}.social-header-pin .comparison-caption{position:static;width:calc(100% - 48px);padding-top:20px}.social-header-pin .comparison-caption p{font-size:12px}.social-header-pin .comparison-frame{aspect-ratio:16/9}}

.social-header-title{text-shadow:0 2px 24px #0009}.social-header-title p{color:#eee}@media(max-width:520px){.social-header-track{height:105svh}.social-header-pin{height:62svh}}

@media(max-width:520px){.social-header-title p{display:none}}


/* media-layout.css */
/* Secondary films share deliberate edges and native aspect ratios. */
.film-pair{grid-template-columns:minmax(0,256fr) minmax(0,81fr);gap:32px;align-items:start}
.film-action .media{max-height:none;aspect-ratio:16/9}
.film-breath{max-width:none;width:100%;justify-self:stretch}
.film-pair video,.ooh-detail video,.tv-pair video{object-fit:contain}
.film-pair figcaption{display:block;padding-top:20px}
.film-pair figcaption>span{display:block;margin-top:4px}
.film-note{display:none}
.tv-pair{width:100%;max-width:none;gap:16px;margin-top:64px}
.tv-pair .media{height:auto;aspect-ratio:16/9}
.tv-pair figcaption{display:block;padding-inline:32px}
.tv-pair figcaption>span{display:block;margin-top:4px}
.tv-pair figure:first-child figcaption{padding-left:max(var(--edge),calc((100vw - 1200px)/2))}
.tv-pair figure:last-child figcaption{padding-right:max(var(--edge),calc((100vw - 1200px)/2))}
.ooh-detail{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:64px;padding-block:80px;align-items:center}
.ooh-detail figure{width:min(100%,calc(76svh * 9/16));max-width:420px;justify-self:center}
.ooh-detail figure figcaption h3{font-size:14px;line-height:1.4;letter-spacing:0;margin:0}
.ooh-detail>div{max-width:440px;padding:0}
.reference{grid-template-columns:1fr;gap:32px;margin-top:0;padding-top:48px}
.reference-copy{display:grid;grid-template-columns:1fr 1fr;gap:16px 64px;align-items:start}
.reference-copy .eyebrow{grid-column:1/-1}
.reference-copy h3{grid-row:2/4;margin:0;font-size:clamp(36px,4.6vw,64px)}
.reference-copy p{max-width:480px;margin:0}
.reference-player iframe{aspect-ratio:16/9}
@media(max-width:800px){
 .film-pair{gap:24px}
 .tv-pair{gap:12px;margin-top:48px}
 .tv-pair figcaption{padding-inline:24px}
 .ooh-detail{gap:40px;padding-block:64px}
 .reference-copy{gap:16px 32px}
}
@media(max-width:520px){
 .film-pair{grid-template-columns:1fr;gap:40px}
 .film-breath{width:100%;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;align-items:end}
 .film-breath figcaption{padding-bottom:4px}
 .film-breath figcaption h3{font-size:20px;line-height:1.2}
 .tv-pair{grid-template-columns:1fr;gap:32px}
 .tv-pair figcaption{padding-inline:24px}
 .ooh-detail{grid-template-columns:1fr;gap:32px;padding-block:56px}
 .ooh-detail figure{width:100%;max-width:none;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:24px;align-items:end}
 .ooh-detail figure figcaption{display:block;padding-bottom:4px}
 .ooh-detail figure figcaption h3{font-size:24px}
 .ooh-detail figure figcaption>span{display:block;margin-top:8px}
 .ooh-detail>div{border-top:1px solid #ffffff26;padding-top:24px}
 .ooh-detail h3{font-size:36px;margin-top:16px}
 .ooh-detail>div>p{font-size:16px;margin-top:20px}
 .reference{padding-top:32px;gap:24px}
 .reference-copy{display:block}
 .reference-copy h3{margin-top:16px;font-size:36px}
 .reference-copy p{margin-top:16px}
}

.tatcha-final-screen{margin-bottom:64px}.tatcha-final-screen .media{height:auto;aspect-ratio:16/9}.tatcha-final-screen video{object-fit:contain}@media(max-width:520px){.tatcha-final-screen{margin-bottom:40px}}


/* Studio-wide rhythm, agency texture and supporting work hierarchy. */
/* Preserve the agency's DM Sans, black/lime/paper panels and measured typography. */
:root{--section:clamp(72px,7.2vw,112px);--display:clamp(54px,7.3vw,108px);--paper:#eeeee9}
body{background:#090909}main{overflow:clip}::selection{background:#afff41;color:#090909}
.brand{z-index:5}.brand img{width:120px}
.hero-artwork{width:min(1200px,calc(100% - 48px));top:45%}
.hero-meta{bottom:9%;justify-content:center;text-align:center}.hero-meta p{font-size:18px}.hero-meta>span{display:none}
.grain-lime,.grain-grey{position:relative;isolation:isolate}
.grain-lime:before,.grain-grey:before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:url('assets/procedural-grain.svg') repeat;opacity:.16}
.grain-grey:before{opacity:.12}
.move-band{min-height:54svh;padding-block:88px}.move-band h2{font-size:var(--display);line-height:1.12}
.manifesto{padding-block:clamp(96px,12vw,176px)}
.manifesto h2{max-width:1040px;margin-inline:auto;text-align:center;font-size:clamp(44px,6.3vw,88px);line-height:1.12}
.intro-bottom{margin-top:56px;max-width:1040px;margin-inline:auto}
.testimonials h2{font-size:clamp(40px,4.4vw,64px);margin-bottom:56px}
.quote blockquote{font-size:clamp(24px,2.15vw,30px)}
.chapter-head{gap:48px;margin-bottom:48px}
.chapter-head h2,.services h2{font-size:var(--display)}
.tv .chapter-head h2,.ooh .chapter-head h2{font-size:clamp(96px,11vw,152px)}
.chapter-head>p{max-width:360px;font-size:18px}
.social-header-track{height:165svh}
.social-header-title h2{font-size:var(--display)}
.social-header-title>div{gap:48px}
.social-header-title p{max-width:320px;text-shadow:0 1px 12px #000}
.social-header-pin .comparison-caption{bottom:28px}
.rail-heading{padding-block:48px 28px}.rail-heading>p{font-size:22px}
.project-rail{--rail-height:clamp(360px,65svh,680px);gap:24px}
.project-rail{scrollbar-width:none}.project-rail::-webkit-scrollbar{display:none}
.project-card figcaption{padding-top:16px}
.film-pair{gap:32px;align-items:start}
.film,.ooh{background:#101110}
.screen figcaption{padding-top:20px}
.tv-pair{width:calc(100% - var(--edge)*2);max-width:1200px;gap:32px;margin-top:56px}
.tv-pair figcaption,.tv-pair figure:first-child figcaption,.tv-pair figure:last-child figcaption{padding-inline:0}
.tatcha-final-screen{margin-bottom:56px}
.ooh-support{display:grid;grid-template-columns:minmax(0,256fr) minmax(0,81fr);gap:32px;align-items:start;margin-top:0}
.ooh-support .media{height:auto}.ooh-support .landscape{aspect-ratio:16/9}.ooh-support .portrait{aspect-ratio:9/16}
.ooh-support video{object-fit:contain}
.ooh-support figcaption{display:block;padding-top:16px}.ooh-support figcaption>span{display:block;margin-top:4px}
.reference{grid-template-columns:1fr 1.2fr;gap:64px;margin-top:64px;padding-top:40px}
.reference-copy{display:block}.reference-copy h3{font-size:36px;line-height:1.1;margin-top:16px}
.reference-copy p{font-size:16px;margin-top:20px;max-width:360px}.reference-copy .reference-credit{font-size:12px;margin-top:16px}
.service-grid{gap:32px 64px}.service-grid h3{font-size:24px}
.service-grid article{padding-top:24px}
.contact h2{font-size:var(--display);margin-block:48px 64px}
.contact{padding-block:96px 72px}
.motion-toggle{bottom:16px;left:16px;padding:10px 12px;font-size:11px;background:#111d;backdrop-filter:blur(6px)}
@media(min-width:1800px){.project-rail{padding-inline:max(var(--edge),calc((100% - 1500px)/2));scroll-padding-inline:max(var(--edge),calc((100% - 1500px)/2))}}
@media(max-width:800px){
 :root{--display:clamp(48px,8vw,72px);--section:80px}
 .hero-artwork{width:calc(100% - 32px)}.hero-meta p{font-size:17px}
 .move-band{min-height:48svh;padding-block:72px}
 .intro-bottom{gap:20px;margin-top:40px}.manifesto{padding-block:96px}
 .chapter-head{gap:24px;margin-bottom:40px}
 .social-header-title>div{gap:24px}
 .tv-pair{gap:24px;margin-top:40px}
 .ooh-support{gap:24px}
 .reference{grid-template-columns:1fr;gap:28px;margin-top:48px}
 .reference-copy{display:grid;grid-template-columns:1fr 1fr;gap:16px 24px}
 .reference-copy .eyebrow{grid-column:1/-1}.reference-copy h3{margin:0;grid-row:2/4}
 .reference-copy p{margin:0}
}
@media(max-width:520px){
 :root{--display:48px;--section:64px}
 .brand{top:24px}.brand img{width:108px}
 .hero{height:90svh;min-height:560px}.hero-artwork{width:calc(100% - 16px);top:44%}
 .hero-meta{bottom:10%}.hero-meta p{font-size:16px}
 .move-band{min-height:42svh;padding-block:64px}.move-band h2{font-size:clamp(38px,11.4vw,56px)}
 .manifesto{padding-block:80px}.manifesto h2{font-size:40px;line-height:1.15}
 .intro-bottom{font-size:15px;margin-top:32px}
 .testimonials h2{font-size:36px;margin-bottom:40px}.quotes{gap:32px}.quote blockquote{font-size:27px}
 .social-header-track{height:108svh}.social-header-pin{height:68svh}
 .social-header-title{top:5svh}.social-header-title h2{font-size:44px}
 .social-header-pin .comparison-caption{bottom:12px}
 .rail-heading{padding-block:28px 24px}.rail-heading>p{font-size:22px}
 .project-rail{--rail-height:59svh;gap:16px;padding-bottom:16px}
 .film-pair{gap:32px}.film-breath{grid-template-columns:1.15fr 1fr}
 .tv .chapter-head h2,.ooh .chapter-head h2{font-size:100px}
 .tv-pair{grid-template-columns:1fr;gap:32px}.tv-pair figcaption{padding-inline:0}
 .tatcha-final-screen{margin-bottom:36px}
 .ooh-support{grid-template-columns:1fr;gap:32px}
 .murad-support{display:grid;grid-template-columns:1.15fr 1fr;gap:24px;align-items:end}
 .murad-support figcaption{padding-bottom:4px}.murad-support figcaption h3{font-size:22px}
 .reference{margin-top:40px;padding-top:32px}.reference-copy{display:block}.reference-copy h3{margin-top:16px}
 .reference-copy p{margin-top:16px}.reference-copy .reference-credit{margin-top:12px}
 .services h2{font-size:44px}.services-intro{margin-bottom:40px}
 .service-grid h3{font-size:22px}.service-grid p{font-size:16px}.ai-notes{gap:28px;margin-top:40px}
 .contact{padding-block:72px 64px}.contact h2{font-size:clamp(56px,17vw,80px);margin-block:40px 48px}
 .motion-toggle{font-size:10px;bottom:12px;left:12px}
}
@media(prefers-reduced-motion:reduce){
 .social-header-track{height:auto}.social-header-pin{height:auto}
 .social-header-title{position:static}.social-header-pin .comparison-caption{position:static}
}
