@import url("design-system/tokens.css");

@font-face{font-family:"Inter Tight";src:url("assets/fonts/inter-tight-regular.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Inter Tight";src:url("assets/fonts/inter-tight-medium.woff2") format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:"Instrument Serif";src:url("assets/fonts/instrument-serif-regular.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Instrument Serif";src:url("assets/fonts/instrument-serif-italic.woff2") format("woff2");font-style:italic;font-display:swap}
@font-face{font-family:"Oxygen Mono";src:url("assets/fonts/oxygen-mono-regular.woff2") format("woff2");font-weight:400;font-display:swap}

*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--ds-portfolio-ink)}
body{margin:0;background:var(--ds-portfolio-ink);color:var(--ds-portfolio-pearl);font-family:var(--ds-portfolio-text-font);font-size:var(--ds-portfolio-body-size);line-height:var(--ds-portfolio-body-leading);overflow-x:hidden}
button,input,a{font:inherit}
button,a{touch-action:manipulation}
a{color:inherit;text-decoration:none}
img,video{display:block;max-width:100%}
button{color:inherit}
::selection{background:var(--ds-portfolio-signal);color:var(--ds-portfolio-ink)}
:focus-visible{outline:var(--ds-portfolio-focus-width) solid var(--ds-portfolio-signal);outline-offset:var(--ds-portfolio-focus-offset)}

.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link{position:fixed;z-index:100;top:var(--ds-portfolio-grid-gap);left:var(--ds-portfolio-grid-gap);padding:.7rem 1rem;background:var(--ds-laura-white);color:var(--ds-laura-ink);transform:translateY(-160%);transition:transform var(--ds-motion-fast) var(--ds-portfolio-ease-signature)}
.skip-link:focus{transform:translateY(0)}

.site-header{position:fixed;z-index:50;top:0;left:0;right:0;display:flex;align-items:center;justify-content:space-between;min-height:3.7rem;padding:0 var(--ds-portfolio-gutter);border-bottom:1px solid rgba(var(--ds-portfolio-bone-rgb),.12);background:rgba(var(--ds-portfolio-ink-rgb),.82);backdrop-filter:blur(18px)}
.wordmark,.header-status{display:flex;align-items:center;gap:.72rem;margin:0;font-family:var(--ds-portfolio-mono-font);font-size:var(--ds-portfolio-meta-size);letter-spacing:var(--ds-portfolio-meta-tracking)}
.wordmark span:first-child{color:var(--ds-portfolio-signal)}
.wordmark-rule{width:2.4rem;height:1px;background:var(--ds-portfolio-line)}
.header-status{color:var(--ds-portfolio-muted)}
.scene{position:relative;min-height:100svh;padding:clamp(6.5rem,10vw,9rem) max(var(--ds-portfolio-gutter),5vw) var(--ds-portfolio-scene-space);overflow:hidden}
.tone-light,.tone-paper{background:var(--ds-portfolio-bone);color:var(--ds-portfolio-ink)}
.tone-paper{background:var(--ds-portfolio-bone)}
.scene-index{position:absolute;top:5.4rem;left:var(--ds-portfolio-gutter);font-family:var(--ds-portfolio-mono-font);font-size:var(--ds-portfolio-meta-size);letter-spacing:var(--ds-portfolio-meta-tracking);color:var(--ds-portfolio-muted)}
.tone-light .scene-index,.tone-paper .scene-index{color:var(--ds-portfolio-light-muted)}
.eyebrow{margin:0 0 1rem;font-family:var(--ds-portfolio-mono-font);font-size:var(--ds-portfolio-meta-size);letter-spacing:.08em;line-height:1.4;text-transform:uppercase;color:var(--ds-portfolio-signal)}
.tone-light .eyebrow,.tone-paper .eyebrow{color:var(--ds-portfolio-ember-on-light)}
h1,h2,h3,h4,p{margin-top:0}
h1,h2{margin-bottom:1.4rem;font-weight:500;letter-spacing:var(--ds-portfolio-proposal-title-tracking);line-height:var(--ds-portfolio-proposal-title-leading)}
h1{max-width:12ch;font-size:clamp(4.5rem,9.7vw,10rem)}
h2{font-size:var(--ds-portfolio-proposal-type-display)}
h3{font-size:var(--ds-portfolio-proposal-type-row);line-height:1.05;font-weight:500;letter-spacing:-.02em}
h4{font-size:1.2rem;font-weight:500}
h1 em,h2 em{font-family:var(--ds-portfolio-display-font);font-weight:400;color:var(--ds-portfolio-signal)}
.tone-light h1 em,.tone-light h2 em,.tone-paper h1 em,.tone-paper h2 em{color:var(--ds-portfolio-ember-on-light)}
.scene-recognition h2,.scene-direction h2,.scene-proof h2,.scene-carousel h2,.scene-concept h2,.scene-collaboration h2{font-size:var(--ds-portfolio-proposal-type-section)}
.scene-film h2,.scene-casting h2,.scene-finish h2{font-size:var(--ds-portfolio-proposal-type-impact)}
.lead{font-size:clamp(1.45rem,2.2vw,2.25rem);line-height:1.22;letter-spacing:-.025em}
.text-link,.source-link{display:inline-flex;align-items:center;gap:.75rem;border-bottom:1px solid currentColor;padding-bottom:.3rem;font-family:var(--ds-portfolio-mono-font);font-size:.7rem;letter-spacing:.04em;text-transform:uppercase}
.text-link span,.source-link span{transition:transform var(--ds-motion-fast)}
.text-link:hover span,.source-link:hover span{transform:translate(.2rem,-.15rem)}

.reveal{opacity:0;transform:translateY(1.6rem);transition:opacity var(--ds-motion-slow) var(--ds-portfolio-ease-signature),transform var(--ds-motion-slow) var(--ds-portfolio-ease-signature)}
.reveal.is-visible{opacity:1;transform:none}

.scene-opening{display:flex;flex-direction:column;justify-content:flex-end;min-height:100svh;padding-bottom:3rem}
.opening-atmosphere{position:absolute;inset:0;background:radial-gradient(circle at 76% 28%,rgba(var(--ds-portfolio-signal-rgb),.16),transparent 32%),radial-gradient(circle at 68% 72%,rgba(var(--ds-portfolio-iris-rgb),.15),transparent 35%),linear-gradient(135deg,var(--ds-portfolio-ink),var(--ds-portfolio-surface));opacity:.9}
.opening-atmosphere:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 49.8%,rgba(var(--ds-portfolio-bone-rgb),.07) 50%,transparent 50.2%);background-size:12.5% 100%;mask-image:linear-gradient(to bottom,transparent,black 25%,black 72%,transparent)}
.opening-copy,.opening-footer{position:relative;z-index:1}
.opening-copy{margin-top:auto}
.opening-deck{max-width:38ch;font-size:clamp(1.15rem,1.5vw,1.45rem);color:var(--ds-portfolio-muted)}
.opening-footer{display:flex;align-items:flex-end;justify-content:space-between;margin-top:4rem;padding-top:1.2rem;border-top:1px solid var(--ds-portfolio-line);font-family:var(--ds-portfolio-mono-font);font-size:.7rem;color:var(--ds-portfolio-muted)}
.opening-footer p{margin:0}

.scene-recognition{display:flex;align-items:center}
.recognition-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(22rem,.8fr);gap:clamp(3rem,9vw,10rem);width:100%;align-items:start}
.recognition-grid h2{max-width:9ch}
.recognition-copy{padding-top:4rem;max-width:42rem}
.recognition-copy p:not(.lead){max-width:48ch;color:var(--ds-portfolio-light-muted)}
.source-link{margin-top:2rem}
.recognition-insight{margin-top:2.4rem!important;padding-top:1.1rem;border-top:1px solid rgba(var(--ds-portfolio-ink-rgb),.22);font-size:.92rem}
.recognition-insight span,.caption-principle span{display:block;margin-bottom:.5rem;font-family:var(--ds-portfolio-mono-font);font-size:.58rem;letter-spacing:.07em;color:var(--ds-portfolio-ember-on-light)}

.scene-film{min-height:120svh;background:linear-gradient(180deg,var(--ds-portfolio-ink),var(--ds-portfolio-surface))}
.film-layout{display:grid;grid-template-columns:minmax(18rem,.72fr) minmax(22rem,1.25fr);gap:clamp(2.5rem,8vw,9rem);align-items:start;max-width:94rem;margin:0 auto}
.film-copy{position:sticky;top:8rem;padding-top:8vh}
.film-copy h2{max-width:8ch}
.film-copy>p:not(.eyebrow){max-width:36ch;color:var(--ds-portfolio-muted)}
.film-byline{margin-top:1.4rem!important;padding-left:1rem;border-left:1px solid var(--ds-portfolio-signal);font-size:.86rem;color:var(--ds-portfolio-pearl)!important}
.micro-list{list-style:none;padding:0;margin:2.5rem 0 0;border-top:1px solid var(--ds-portfolio-line)}
.micro-list li{display:grid;grid-template-columns:2.2rem 1fr;gap:1rem;padding:1rem 0;border-bottom:1px solid var(--ds-portfolio-line);color:var(--ds-portfolio-muted)}
.micro-list li span{font-family:var(--ds-portfolio-mono-font);font-size:.65rem;color:var(--ds-portfolio-signal)}
.reel-stage{justify-self:center;width:min(100%,32rem)}
.reel-frame{position:relative;aspect-ratio:9/16;background:var(--ds-bg-deep);overflow:hidden;box-shadow:var(--ds-shadow-card)}
.reel-frame video{width:100%;height:100%;object-fit:cover}
.stage-toggle{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.75rem;border:0;background:rgba(var(--ds-portfolio-ink-rgb),.2);font-family:var(--ds-portfolio-mono-font);font-size:.67rem;letter-spacing:.08em;cursor:pointer;transition:opacity var(--ds-motion-fast)}
.stage-toggle.is-hidden{opacity:0;pointer-events:none}
.stage-icon{display:grid;place-items:center;width:4.3rem;height:4.3rem;padding-left:.25rem;border:1px solid rgba(var(--ds-portfolio-bone-rgb),.65);border-radius:50%;background:rgba(var(--ds-portfolio-ink-rgb),.25);font-size:1.1rem;backdrop-filter:blur(10px)}
.reel-status{position:absolute;top:1rem;left:1rem;display:flex;align-items:center;gap:.5rem;padding:.42rem .62rem;background:rgba(var(--ds-portfolio-ink-rgb),.72);font-family:var(--ds-portfolio-mono-font);font-size:.58rem;letter-spacing:.06em}
.status-mark{display:block;width:1rem;height:1px;background:var(--ds-portfolio-signal);box-shadow:0 0 .75rem rgba(var(--ds-portfolio-signal-rgb),.45)}
.video-controls{display:grid;grid-template-columns:auto 1fr auto auto;gap:.8rem;align-items:center;padding:.85rem 0;border-bottom:1px solid var(--ds-portfolio-line)}
.video-controls button,.outline-button{border:1px solid var(--ds-portfolio-line);background:transparent;padding:.5rem .72rem;font-family:var(--ds-portfolio-mono-font);font-size:.62rem;letter-spacing:.04em;text-transform:uppercase;cursor:pointer}
.video-controls time{font-family:var(--ds-portfolio-mono-font);font-size:.6rem;color:var(--ds-portfolio-muted)}
input[type="range"]{width:100%;accent-color:var(--ds-portfolio-signal);cursor:pointer}
.more-cue{display:flex;align-items:center;gap:.7rem;margin:1rem 0 0;font-family:var(--ds-portfolio-mono-font);font-size:.6rem;letter-spacing:.055em;color:var(--ds-portfolio-muted)}
.more-cue span{color:var(--ds-portfolio-signal)}
.more-cue b{margin-left:auto;animation:nudge 1.8s var(--ds-portfolio-ease-signature) infinite}

.scene-direction{padding-top:10rem}
.direction-head{max-width:72rem;margin:0 auto 4rem}
.direction-head h2{max-width:12ch}
.direction-intent{max-width:56ch;margin:2rem 0 0;color:var(--ds-portfolio-light-muted)}
.decision-trace{display:grid;grid-template-columns:1fr;max-width:92rem;margin:0 auto;padding:0;list-style:none;border-top:1px solid rgba(var(--ds-portfolio-ink-rgb),.3);border-left:1px solid rgba(var(--ds-portfolio-ink-rgb),.3)}
.decision-trace li{display:grid;grid-template-columns:2.8rem minmax(0,1fr) auto;gap:1rem;min-height:10rem;padding:1.35rem;border-right:1px solid rgba(var(--ds-portfolio-ink-rgb),.3);border-bottom:1px solid rgba(var(--ds-portfolio-ink-rgb),.3)}
.decision-trace li>span,.decision-trace small{font-family:var(--ds-portfolio-mono-font);font-size:.58rem;letter-spacing:.06em;color:var(--ds-portfolio-ember-on-light)}
.decision-trace b{display:block;font-size:clamp(1.18rem,1.7vw,1.65rem);font-weight:500;line-height:1.05}
.decision-trace p{max-width:28ch;margin:.65rem 0 0;font-size:.84rem;line-height:1.45;color:var(--ds-portfolio-light-muted)}
.decision-trace small{align-self:end;text-align:right}

.scene-casting{display:grid;grid-template-columns:minmax(18rem,.7fr) minmax(0,1.3fr);gap:clamp(3rem,7vw,8rem);align-items:center;background:var(--ds-laura-deep)}
.casting-copy h2{max-width:10ch}
.casting-copy p:not(.eyebrow){max-width:38ch;color:var(--ds-portfolio-muted)}
.caption-principle{margin-top:2rem!important;padding:1rem 0 0;border-top:1px solid var(--ds-portfolio-line);font-size:.82rem!important;color:var(--ds-portfolio-muted)!important}
.caption-principle span{color:var(--ds-portfolio-signal)}
.story-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--ds-portfolio-grid-gap);align-items:end}
.story-strip figure{margin:0}
.story-strip figure:nth-child(2){transform:translateY(4rem)}
.story-image{position:relative;aspect-ratio:9/14;overflow:hidden;background:var(--ds-bg-deep);border:1px solid rgba(var(--ds-portfolio-bone-rgb),.13)}
.story-image:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(var(--ds-portfolio-ink-rgb),.04) 25%,rgba(var(--ds-portfolio-ink-rgb),.74) 100%);pointer-events:none}
.story-image img{width:100%;height:100%;object-fit:cover;object-position:center;transition:transform var(--ds-motion-slow) var(--ds-portfolio-ease-signature),filter var(--ds-motion-slow)}
.story-image-call img{filter:saturate(.78)}
.story-image-door img{filter:saturate(.68) sepia(.08)}
.story-image-distance img{filter:saturate(.58)}
.story-image:hover img{transform:scale(1.035)}
.story-image span,.story-image b{position:absolute;z-index:1;font-family:var(--ds-portfolio-mono-font);font-size:.58rem;letter-spacing:.06em;color:var(--ds-portfolio-signal)}
.story-image span{top:1rem;left:1rem}
.story-image b{right:1rem;bottom:1rem;font-weight:400;text-align:right;color:var(--ds-portfolio-pearl)}
.story-strip figcaption{padding:1rem 0}
.story-strip figcaption b,.story-strip figcaption small{display:block}
.story-strip figcaption b{font-weight:500;font-size:1.15rem}
.story-strip figcaption small{margin-top:.25rem;color:var(--ds-portfolio-muted)}

.scene-proof{min-height:auto}
.proof-intro{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:end;max-width:90rem;margin:0 auto 3rem}
.proof-intro h2{max-width:10ch;margin-bottom:0}
.proof-intro>p{max-width:38ch;color:var(--ds-portfolio-light-muted)}
.proof-ledger{display:grid;grid-template-columns:repeat(3,1fr);max-width:90rem;margin:0 auto clamp(2.5rem,5vw,5rem);padding:0;list-style:none;border-top:1px solid rgba(var(--ds-portfolio-ink-rgb),.3);border-bottom:1px solid rgba(var(--ds-portfolio-ink-rgb),.3)}
.proof-ledger li{display:grid;grid-template-columns:1.9rem 1fr;gap:.75rem;min-height:5.8rem;padding:1rem 1.2rem 1rem 0;border-right:1px solid rgba(var(--ds-portfolio-ink-rgb),.2)}
.proof-ledger li+li{padding-left:1.2rem}
.proof-ledger li:last-child{border-right:0}
.proof-ledger span{font-family:var(--ds-portfolio-mono-font);font-size:.62rem;color:var(--ds-portfolio-ember-on-light)}
.proof-ledger b,.proof-ledger small{display:block}
.proof-ledger b{font-size:.95rem;font-weight:500;line-height:1.1}
.proof-ledger small{max-width:26ch;margin-top:.35rem;font-size:.72rem;line-height:1.35;color:var(--ds-portfolio-light-muted)}
.proof-deck{max-width:90rem;margin:0 auto;border-top:1px solid rgba(var(--ds-portfolio-ink-rgb),.3);border-bottom:1px solid rgba(var(--ds-portfolio-ink-rgb),.3)}
.proof-panel{min-height:0;padding:clamp(2rem,5vw,5rem) 0;background:transparent;box-shadow:none}
.proof-panel+.proof-panel{border-top:1px solid rgba(var(--ds-portfolio-ink-rgb),.3)}
.compare-lab{display:grid;grid-template-columns:minmax(15rem,.7fr) minmax(16rem,.56fr);grid-template-rows:auto auto auto;gap:1rem clamp(2.5rem,7vw,7rem);align-items:start}
.compare-toolbar{position:sticky;top:7rem;grid-row:1/4;display:flex;flex-direction:column;align-items:flex-start;gap:2rem}
.compare-toolbar h3,.audio-head h3,.atmosphere-copy h3{margin:0;font-size:clamp(2rem,3.5vw,4rem)}
.compare-toolbar h3 em,.audio-head h3 em,.atmosphere-copy h3 em{font-family:inherit;font-style:normal;color:inherit}
.proof-metric{margin:0;padding-left:1rem;border-left:2px solid var(--ds-portfolio-ember);font-family:var(--ds-portfolio-mono-font);font-size:.6rem;letter-spacing:.05em;line-height:1.65;color:var(--ds-portfolio-light-muted)}
.compare-stage{position:relative;grid-column:2;aspect-ratio:9/16;width:min(100%,32rem,40.5svh);justify-self:center;overflow:hidden;border:1px solid rgba(var(--ds-portfolio-ink-rgb),.32);background:var(--ds-laura-deep);box-shadow:none;cursor:ew-resize;touch-action:none}
.compare-stage video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.after-clip{position:absolute;inset:0;overflow:hidden;clip-path:inset(0 calc(100% - var(--split)) 0 0)}
.compare-label{position:absolute;top:1rem;padding:.45rem .65rem;background:rgba(var(--ds-portfolio-ink-rgb),.72);color:var(--ds-portfolio-pearl);font-family:var(--ds-portfolio-mono-font);font-size:.58rem;letter-spacing:.07em}
.label-before{right:1rem}.label-after{left:1rem}
.compare-divider{position:absolute;top:0;bottom:0;left:var(--split);width:1px;background:var(--ds-laura-white);transform:translateX(-50%);pointer-events:none}
.compare-divider i{position:absolute;top:50%;left:50%;width:3rem;height:3rem;border-radius:50%;background:var(--ds-laura-white);box-shadow:var(--ds-shadow-card);transform:translate(-50%,-50%)}
.compare-divider i:after{content:"↔";position:absolute;inset:0;display:grid;place-items:center;color:var(--ds-laura-ink);font-family:var(--ds-portfolio-mono-font)}
.compare-range{grid-column:2;display:grid;grid-template-columns:auto 1fr;gap:1.5rem;align-items:center;margin-top:1rem;font-family:var(--ds-portfolio-mono-font);font-size:.65rem;color:var(--ds-portfolio-light-muted)}
.compare-range input{accent-color:var(--ds-portfolio-ember)}
.proof-note{grid-column:2;margin:.7rem 0 0;font-size:.76rem;color:var(--ds-portfolio-light-muted)}
.audio-lab{display:grid;grid-template-columns:.72fr 1.28fr;gap:5rem;align-items:center;min-height:28rem}
.audio-head p:not(.eyebrow){max-width:38ch;color:var(--ds-portfolio-light-muted)}
.audio-evidence,.music-evidence{max-width:37ch!important;margin:1.75rem 0 0!important;padding-left:.9rem;border-left:2px solid var(--ds-portfolio-ember);font-family:var(--ds-portfolio-mono-font);font-size:.6rem!important;letter-spacing:.055em;line-height:1.65!important;color:var(--ds-portfolio-ember-on-light)!important}
.audio-console{padding:1.25rem;border-top:1px solid rgba(var(--ds-portfolio-ink-rgb),.28);border-bottom:1px solid rgba(var(--ds-portfolio-ink-rgb),.28);background:transparent;box-shadow:none}
.audio-switch{display:flex;gap:.4rem;padding-bottom:1.2rem;border-bottom:1px solid rgba(var(--ds-portfolio-ink-rgb),.13)}
.audio-choice{display:inline-flex;align-items:center;gap:.6rem;border:1px solid rgba(var(--ds-portfolio-ink-rgb),.24);padding:.55rem .65rem;background:transparent;color:var(--ds-portfolio-light-muted);font-family:var(--ds-portfolio-mono-font);font-size:.6rem;letter-spacing:.06em;text-transform:uppercase;cursor:pointer;transition:all var(--ds-motion-fast)}
.audio-choice span{display:grid;place-items:center;width:1.25rem;height:1.25rem;border-radius:50%;background:var(--ds-portfolio-bone);font-size:.55rem}
.audio-choice:hover,.audio-choice[aria-selected="true"]{border-color:var(--ds-portfolio-ember-on-light);background:rgba(var(--ds-portfolio-ember-rgb),.08);color:var(--ds-portfolio-ink)}
.audio-now{display:grid;grid-template-columns:3.4rem 1fr auto;gap:1rem;align-items:center;padding:1.5rem 0 1rem}
.audio-play{display:grid;place-items:center;width:3.3rem;height:3.3rem;border:0;border-radius:50%;background:var(--ds-portfolio-ink);color:var(--ds-portfolio-bone);cursor:pointer;transition:transform var(--ds-motion-fast),background var(--ds-motion-fast)}
.audio-play:hover{background:var(--ds-portfolio-ember);transform:scale(1.04)}
.audio-play-icon{padding-left:.15rem;font-size:.8rem}
.audio-now .eyebrow{margin-bottom:.3rem}
.audio-now h4{margin:0;font-size:1.35rem}
.audio-now p:not(.eyebrow){margin:.2rem 0 0;font-size:.82rem;color:var(--ds-portfolio-light-muted)}
.audio-status{padding:.35rem .45rem;background:rgba(var(--ds-portfolio-ember-rgb),.08);font-family:var(--ds-portfolio-mono-font);font-size:.56rem;letter-spacing:.06em;color:var(--ds-portfolio-ember-on-light)}
.audio-wave{display:grid;grid-template-columns:repeat(16,1fr);align-items:center;gap:.28rem;height:4.4rem;padding:0 .2rem;border-top:1px solid rgba(var(--ds-portfolio-ink-rgb),.1);border-bottom:1px solid rgba(var(--ds-portfolio-ink-rgb),.1)}
.audio-wave i{display:block;height:24%;background:var(--ds-portfolio-ember);opacity:.55;transform-origin:center;transition:height var(--ds-motion-base)}
.audio-wave i:nth-child(2n){height:48%}.audio-wave i:nth-child(3n){height:70%}.audio-wave i:nth-child(5n){height:34%}.audio-wave i:nth-child(7n){height:88%}
.audio-console.is-playing .audio-wave i{animation:audio-wave .9s var(--ds-portfolio-ease-signature) infinite alternate}
.audio-console.is-playing .audio-wave i:nth-child(2n){animation-delay:-.22s}.audio-console.is-playing .audio-wave i:nth-child(3n){animation-delay:-.47s}.audio-console.is-playing .audio-wave i:nth-child(5n){animation-delay:-.7s}
.audio-scrub{display:grid;grid-template-columns:3rem 1fr 3rem;gap:.75rem;align-items:center;padding-top:1rem}
.audio-scrub time{font-family:var(--ds-portfolio-mono-font);font-size:.58rem;color:var(--ds-portfolio-light-muted)}
.audio-scrub time:last-child{text-align:right}
.audio-note{margin:1rem 0 0;font-size:.76rem;color:var(--ds-portfolio-light-muted)}
.audio-console audio,.music-console audio{display:none}
.atmosphere-lab{display:grid;grid-template-columns:.82fr 1.18fr;gap:clamp(3rem,8vw,9rem);align-items:center;min-height:28rem}
.atmosphere-copy>p:not(.eyebrow){max-width:35ch;color:var(--ds-portfolio-light-muted)}
.atmosphere-evidence{display:grid;gap:2.2rem;align-content:center}
.atmosphere-evidence .music-console{max-width:none;margin-top:0}
.finish-specimen>p{margin:0 0 .7rem;font-family:var(--ds-portfolio-mono-font);font-size:.58rem;letter-spacing:.07em;color:var(--ds-portfolio-ember-on-light)}
.music-console{display:grid;grid-template-columns:3.3rem 1fr;gap:.7rem 1rem;align-items:center;max-width:34rem;margin-top:2.2rem;padding:1.2rem 0;border-top:1px solid rgba(var(--ds-portfolio-ink-rgb),.28);border-bottom:1px solid rgba(var(--ds-portfolio-ink-rgb),.28);background:transparent}
.music-copy{display:grid;grid-template-columns:1fr auto;gap:.1rem 1rem;align-items:center}
.music-copy .eyebrow{margin:0;grid-column:1/-1}
.music-copy b{font-size:1rem;font-weight:500}
.music-copy small{font-family:var(--ds-portfolio-mono-font);font-size:.56rem;color:var(--ds-portfolio-ember-on-light)}
.music-console input{grid-column:1/-1}
.finish-card{position:relative;display:flex;flex-direction:column;justify-content:center;min-height:18rem;padding:clamp(1.5rem,4vw,4rem);overflow:hidden;border-top:1px solid rgba(var(--ds-portfolio-ink-rgb),.3);border-bottom:1px solid rgba(var(--ds-portfolio-ink-rgb),.3);background:transparent;color:var(--ds-portfolio-ink);text-align:center;box-shadow:none}
.finish-card:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,transparent 48%,rgba(var(--ds-portfolio-ember-rgb),.06) 48% 52%,transparent 52%);pointer-events:none}
.finish-card>*{position:relative;z-index:1}
.finish-card>span,.finish-card p,.finish-card small{font-family:var(--ds-portfolio-mono-font);font-size:.6rem;letter-spacing:.07em;color:var(--ds-portfolio-light-muted)}
.finish-card i{width:3.5rem;height:1px;margin:1rem auto;background:var(--ds-portfolio-ember)}
.finish-card h4{margin:1rem 0;font-size:clamp(2.25rem,4.3vw,5rem);line-height:.9;letter-spacing:var(--ds-portfolio-proposal-impact-tracking)}
.finish-card h4 em{font-family:var(--ds-portfolio-display-font);font-weight:400;color:var(--ds-portfolio-ember-on-light)}
.finish-card p{margin:0}
.finish-card small{display:inline-block;margin:2rem auto .9rem;padding:.4rem .55rem;border:1px solid rgba(var(--ds-portfolio-ink-rgb),.18)}
.finish-card>b{font-family:var(--ds-portfolio-mono-font);font-size:.7rem;letter-spacing:.1em}

.scene-carousel{min-height:auto;padding-bottom:clamp(7rem,10vw,11rem)}
.carousel-intro{display:grid;grid-template-columns:1.1fr .9fr;gap:6rem;align-items:end;max-width:96rem;margin:0 auto 3.5rem}
.carousel-intro h2{max-width:11ch;margin-bottom:0}
.carousel-intro>p{max-width:36ch;margin:0;color:var(--ds-portfolio-light-muted)}
.carousel-track{display:grid;grid-template-columns:repeat(7,minmax(10rem,1fr));gap:var(--ds-portfolio-grid-gap);max-width:96rem;margin:0 auto;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:1rem}
.carousel-track article{display:flex;flex-direction:column;justify-content:space-between;aspect-ratio:4/5;min-width:10rem;padding:1rem;border:1px solid rgba(var(--ds-portfolio-ink-rgb),.3);background:var(--ds-portfolio-bone);scroll-snap-align:start}
.carousel-track span{font-family:var(--ds-portfolio-mono-font);font-size:.58rem;letter-spacing:.07em;color:var(--ds-portfolio-ember-on-light)}
.carousel-track b{display:block;font-size:clamp(1.3rem,1.8vw,1.8rem);font-weight:500;line-height:1.02}
.carousel-track p{margin:0;color:var(--ds-portfolio-light-muted);font-size:.78rem;line-height:1.35}

.scene-finish{display:grid;grid-template-columns:1fr 1fr;gap:7vw;align-items:center;background:var(--ds-portfolio-surface)}
.finish-mark{aspect-ratio:1;display:grid;place-items:center;border:1px solid rgba(var(--ds-portfolio-bone-rgb),.16);background:radial-gradient(circle,rgba(var(--ds-portfolio-signal-rgb),.18),transparent 56%)}
.finish-mark img{width:62%;filter:brightness(0) invert(1);opacity:.74}
.finish-copy h2{max-width:10ch}
.finish-copy>p:not(.eyebrow){max-width:39ch;color:var(--ds-portfolio-muted)}

.scene-boundary{display:grid;align-content:center;justify-items:start;text-align:left}
.boundary-rule{position:absolute;top:0;left:0;right:0;height:1px;background:var(--ds-portfolio-ember)}
.boundary-copy{max-width:68rem;margin-left:clamp(0rem,10vw,10rem)}
.boundary-copy h2{max-width:14ch}
.boundary-copy>p:not(.eyebrow){max-width:54ch;color:var(--ds-portfolio-light-muted)}
.down-orbit{position:absolute;right:var(--ds-portfolio-gutter);bottom:var(--ds-portfolio-gutter);display:grid;place-items:center;width:7rem;height:2.8rem;border:1px solid rgba(var(--ds-portfolio-ink-rgb),.3);border-radius:0;font-family:var(--ds-portfolio-mono-font);font-size:.58rem;color:var(--ds-portfolio-ember-on-light)}
.down-orbit b{font-size:1.1rem}

.scene-concept{padding-bottom:clamp(7rem,12vw,12rem)}
.concept-header{display:grid;grid-template-columns:1.15fr .85fr;gap:6rem;align-items:end;max-width:96rem;margin:0 auto 4rem}
.concept-header h2{max-width:10ch;margin-bottom:0}
.concept-summary p{max-width:39ch;color:var(--ds-portfolio-light-muted)}
.primary-button{display:inline-flex;align-items:center;justify-content:space-between;gap:2rem;min-width:18rem;margin-top:1rem;padding:1rem 1.1rem;background:var(--ds-portfolio-ink);color:var(--ds-portfolio-bone);font-family:var(--ds-portfolio-mono-font);font-size:.65rem;letter-spacing:.04em;text-transform:uppercase;transition:background var(--ds-motion-fast),color var(--ds-motion-fast),transform var(--ds-motion-fast)}
.primary-button:hover{background:var(--ds-portfolio-ember);transform:translateY(-.15rem)}
.browser-mockup{position:relative;max-width:96rem;margin:0 auto;border:1px solid rgba(var(--ds-portfolio-ink-rgb),.3);background:var(--ds-portfolio-bone);box-shadow:none}
.browser-bar{display:flex;align-items:center;gap:.45rem;height:3rem;padding:0 1rem;border-bottom:1px solid rgba(var(--ds-portfolio-ink-rgb),.2);background:var(--ds-portfolio-bone)}
.browser-bar i{width:.55rem;height:.55rem;border-radius:50%;background:var(--ds-portfolio-ember)}
.browser-bar i:nth-child(2){background:var(--ds-portfolio-signal)}
.browser-bar i:nth-child(3){background:var(--ds-portfolio-iris)}
.browser-bar span{margin-left:1rem;font-family:var(--ds-portfolio-mono-font);font-size:.58rem;color:var(--ds-portfolio-light-muted)}
.browser-screen{aspect-ratio:16/10;overflow:hidden;background:var(--ds-portfolio-bone)}
.browser-screen img{width:100%;height:100%;object-fit:cover;object-position:top}
.browser-phone{position:absolute;right:clamp(1rem,5vw,5rem);bottom:clamp(-6rem,-5vw,-2rem);width:clamp(10rem,19vw,17rem);padding:.45rem;border:1px solid var(--ds-portfolio-line);border-radius:1.7rem;background:var(--ds-bg-deep);box-shadow:var(--ds-shadow-card)}
.browser-phone:before{content:"";position:absolute;z-index:1;top:.62rem;left:50%;width:4rem;height:.28rem;border-radius:var(--ds-radius-md);background:var(--ds-portfolio-line);transform:translateX(-50%)}
.browser-phone img{width:100%;border-radius:1.3rem}
.concept-boundary{max-width:96rem;margin:5rem auto 0;font-family:var(--ds-portfolio-mono-font);font-size:.62rem;color:var(--ds-portfolio-light-muted)}

.scene-app{background:linear-gradient(135deg,var(--ds-portfolio-surface),var(--ds-portfolio-ink))}
.app-layout{display:grid;grid-template-columns:1fr minmax(19rem,.56fr);gap:9vw;align-items:center;max-width:86rem;margin:0 auto}
.app-copy h2{max-width:11ch}
.app-copy>p:not(.eyebrow):not(.guardrail){max-width:42ch;color:var(--ds-portfolio-muted)}
.app-copy .micro-list{max-width:38rem}
.guardrail{max-width:54ch;margin:2rem 0 0;padding-left:1rem;border-left:2px solid var(--ds-portfolio-ember);font-size:.82rem;color:var(--ds-portfolio-muted)}
.primary-button-light{background:var(--ds-portfolio-bone);color:var(--ds-portfolio-ink)}
.device-shell{position:relative;justify-self:center;width:min(100%,25rem);aspect-ratio:430/932;padding:.55rem;overflow:hidden;border:1px solid var(--ds-portfolio-line);border-radius:var(--ds-radius-lg);background:var(--ds-bg-deep);box-shadow:var(--ds-shadow-card)}
.device-shell>img{width:100%;height:100%;object-fit:cover;border-radius:calc(var(--ds-radius-lg) - .45rem)}
.device-speaker{position:absolute;z-index:2;top:1rem;left:50%;width:4.6rem;height:.28rem;border-radius:var(--ds-radius-md);background:var(--ds-portfolio-line);transform:translateX(-50%)}
.device-caption{position:absolute;z-index:2;right:1.15rem;bottom:1.1rem;padding:.35rem .45rem;background:rgba(var(--ds-portfolio-ink-rgb),.78);font-family:var(--ds-portfolio-mono-font);font-size:.52rem;letter-spacing:.06em;color:var(--ds-portfolio-pearl)}

.scene-collaboration{min-height:100svh;padding-bottom:2rem}
.collaboration-grid{display:grid;grid-template-columns:1fr .85fr;gap:8rem;max-width:94rem;margin:4rem auto 9rem}
.collaboration-grid h2{max-width:10ch}
.collaboration-copy>p:not(.lead){max-width:44ch;color:var(--ds-portfolio-light-muted)}
.next-steps{margin-top:3rem;border-top:1px solid rgba(var(--ds-portfolio-ink-rgb),.2)}
.next-steps span{display:grid;grid-template-columns:2.5rem 1fr;gap:1rem;padding:1rem 0;border-bottom:1px solid rgba(var(--ds-portfolio-ink-rgb),.2);font-family:var(--ds-portfolio-mono-font);font-size:.65rem;color:var(--ds-portfolio-ember-on-light)}
.next-steps b{font-family:var(--ds-portfolio-text-font);font-size:1rem;font-weight:500;color:var(--ds-portfolio-ink)}
.closing{display:grid;grid-template-columns:12rem 1fr auto;gap:2rem;align-items:end;max-width:94rem;margin:0 auto;padding-top:2rem;border-top:1px solid rgba(var(--ds-portfolio-ink-rgb),.2)}
.closing img{width:11rem}
.closing p{margin:0;font-family:var(--ds-portfolio-mono-font);font-size:.62rem;color:var(--ds-portfolio-light-muted)}
.closing .privacy-note{grid-column:1/-1;max-width:62ch;padding-top:.35rem;border-top:1px solid rgba(var(--ds-portfolio-ink-rgb),.12);color:var(--ds-portfolio-light-muted);line-height:1.6}

@keyframes nudge{0%,100%{transform:translateY(0)}50%{transform:translateY(.4rem)}}
@keyframes audio-wave{from{transform:scaleY(.45)}to{transform:scaleY(1.2)}}

@media (max-width:1050px){
  .film-layout,.recognition-grid,.scene-casting,.scene-finish,.audio-lab,.atmosphere-lab,.app-layout,.collaboration-grid{grid-template-columns:1fr}
  .compare-lab{grid-template-columns:minmax(15rem,.7fr) minmax(19rem,.55fr);gap:1rem 3rem}
  .film-copy{position:relative;top:auto;padding-top:0}
  .film-copy h2{max-width:11ch}
  .reel-stage{width:min(100%,28rem)}
  .story-strip{max-width:48rem}
  .proof-intro,.concept-header,.carousel-intro{grid-template-columns:1fr;gap:2rem}
  .decision-trace{grid-template-columns:1fr}
  .note-number,.craft-grid article>span{margin-bottom:3rem}
  .craft-grid{grid-template-columns:1fr}
  .craft-grid article{min-height:auto;border-right:0;border-bottom:1px solid rgba(var(--ds-portfolio-ink-rgb),.18)}
  .closing{grid-template-columns:10rem 1fr}
  .closing .text-link{grid-column:1/-1;justify-self:start}
}

@media (max-width:680px){
  .site-header{padding:0 1rem}.header-status{display:none}.wordmark-rule{width:1rem}.wordmark span:last-child{max-width:calc(100vw - 6rem);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .scene{padding-left:1rem;padding-right:1rem;padding-top:7.5rem}
  .scene-index{left:1rem;top:4.8rem}
  h1{font-size:clamp(3.7rem,18vw,6.3rem)}
  h2{font-size:clamp(3.1rem,14vw,5.2rem)}
  .opening-footer{align-items:start;gap:2rem}.opening-footer>p{max-width:12ch}
  .recognition-copy{padding-top:0}
  .reel-stage{width:min(100%,25rem)}
  .video-controls{grid-template-columns:auto 1fr auto}.video-controls time{display:none}
  .more-cue{align-items:flex-start}.more-cue span{max-width:18ch}
  .story-strip{grid-template-columns:repeat(3,76vw);overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:1rem}
  .story-strip figure{scroll-snap-align:start}.story-strip figure:nth-child(2){transform:none}
  .compare-toolbar{align-items:start;flex-direction:column}
  .compare-lab{display:block}
  .compare-toolbar{position:relative;top:auto;margin-bottom:2rem}
  .compare-stage{aspect-ratio:9/16;width:100%;max-height:none}
  .compare-range{grid-template-columns:1fr}
  .proof-ledger{grid-template-columns:1fr;margin-bottom:2.5rem}
  .proof-ledger li,.proof-ledger li+li{min-height:auto;padding:1rem 0;border-right:0;border-bottom:1px solid rgba(var(--ds-portfolio-ink-rgb),.2)}
  .proof-ledger li:last-child{border-bottom:0}
  .proof-panel{padding:2.5rem 0}
  .audio-now{grid-template-columns:3rem 1fr}.audio-status{display:none}
  .audio-scrub{grid-template-columns:2.6rem 1fr 2.6rem;gap:.5rem}
  .music-console{grid-template-columns:3rem 1fr}
  .atmosphere-lab{gap:2.5rem}
  .scene-finish{gap:3rem}
  .finish-mark{max-width:28rem}
  .down-orbit{position:relative;right:auto;bottom:auto;margin-top:3rem}
  .scene-boundary{display:flex;flex-direction:column;justify-content:center}
  .boundary-copy{margin-left:0}
  .concept-header{margin-bottom:2rem}.primary-button{min-width:0;width:100%}
  .browser-phone{position:relative;right:auto;bottom:auto;width:min(58%,15rem);margin:-3rem 1.3rem 1.3rem auto}
  .concept-boundary{margin-top:2rem}
  .device-shell{width:min(100%,24rem)}
  .decision-trace li{grid-template-columns:2rem 1fr;min-height:auto}.decision-trace small{grid-column:2;text-align:left}
  .carousel-track{grid-template-columns:repeat(7,72vw);margin-right:-1rem;padding-right:1rem}
  .collaboration-grid{gap:3rem;margin-bottom:5rem}
  .closing{grid-template-columns:1fr;align-items:start}.closing .text-link{grid-column:auto}.closing .privacy-note{grid-column:auto}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  .reveal{opacity:1;transform:none}
}