/* Source-faithful media, a shared spacing rhythm, and proportionate editorial layouts. */
:root{--space-1:8px;--space-2:13px;--space-3:21px;--space-4:34px;--space-5:55px;--space-6:89px;--section-space:clamp(64px,7.4vw,120px);--surface-glass:#ffffffd6;color-scheme:light}
:root[data-theme=dark]{--bg:#171719;--paper:#202023;--bg-soft:#29292e;--ink:#f3f3f5;--muted:#b0b0ba;--line:#3b3b43;--accent:#ff9b58;--accent-soft:#ff9b58;--accent-tint:#3c2a20;--surface-glass:#202023da;color-scheme:dark}
body,nav,#work,#studio,#transformation,.exhibition-section{transition:background-color .4s var(--ease),color .3s var(--ease)}
nav{background:var(--surface-glass);border-color:var(--line)}nav.over-film{background:#1414167a;border-color:#ffffff14}
.lang-menu{background:var(--bg);color:var(--ink)}
.theme-toggle{width:44px;height:44px;display:grid;place-items:center;border:0;background:transparent;border-radius:50%;flex:none}
.theme-toggle:hover{background:var(--accent-tint);color:var(--accent)}.theme-toggle .icon{width:20px;height:20px}
.theme-sun,[data-theme=dark] .theme-moon{display:none}[data-theme=dark] .theme-sun{display:block}
[data-theme=dark] nav .brand-dark{display:none}[data-theme=dark] nav .brand-light{display:block}
[data-theme=dark] .nav-cta{background:#f3f3f5;color:#1d1d1f}[data-theme=dark] .studio-tabs button[aria-selected=true]{background:#35353b}
[data-theme=dark] .open-mark{color:#1d1d1f}[data-theme=dark] ::selection{background:#6f390c;color:#fff}
/* Contact and cinema remain high-contrast surfaces in either theme. */
#contact,.viewer{--paper:#f5f5f7}
#work{background:var(--bg);padding-block:clamp(48px,5vw,72px)}
#work .grid-head h2{font-size:clamp(36px,4vw,56px)}
#work .grid-head .section-label{margin-bottom:14px}
#work .grid-head .sub{font-size:15px}
#studio,#cast{padding-block:var(--section-space)}
.studio-panel{grid-template-columns:1.618fr 1fr;gap:clamp(34px,5.5vw,89px)}
.grid-head,.studio-heading{gap:var(--space-5);margin-bottom:var(--space-4)}
.grid-head .sub,.studio-heading p{line-height:1.618}.grid-head>div{flex:1.618}.grid-head>.sub{flex:1}
[data-reveal]{opacity:0;transform:translateY(12px);transition:opacity .65s var(--ease),transform .65s var(--ease)}[data-reveal].in{opacity:1;transform:none}
html[data-motion=off] [data-reveal]{opacity:1;transform:none}
.hero-films{background:var(--dark)}.hero-play{position:absolute;top:calc(var(--nav-height) + 21px);inset-inline-end:var(--pad-x);display:flex;gap:10px;align-items:center;min-height:44px;padding:10px 18px;border:1px solid #ffffff66;border-radius:100px;background:#171719b8;color:#fff;backdrop-filter:blur(14px);font-size:13px}
.exhibit-ambience{position:absolute;inset:0;z-index:-3;overflow:hidden;pointer-events:none;background:var(--paper)}
.exhibit-ambience img{position:absolute;inset:-15%;width:130%;height:130%;max-width:none;object-fit:cover;filter:blur(70px);opacity:0;transform:scale(1.1);transition:opacity .9s var(--ease);will-change:opacity}
.exhibit-ambience img.is-current{opacity:.46}
.exhibit-ambience::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,var(--paper),transparent 30%,transparent 65%,var(--paper)),color-mix(in srgb,var(--paper) 42%,transparent)}
[data-theme=dark] .exhibit-ambience img.is-current{opacity:.64}
.exhibition-section.has-webgl .exhibition-bottom{bottom:74px}
.exhibit-skip{position:absolute;bottom:16px;left:50%;transform:translateX(-50%);z-index:3;display:flex;align-items:center;gap:10px;min-height:44px;padding:8px 18px;border:1px solid var(--line);border-radius:100px;background:var(--surface-glass);color:var(--ink);text-decoration:none;font-size:12px;backdrop-filter:blur(12px);transition:background .25s,box-shadow .25s}
.exhibit-skip:hover{background:var(--bg);box-shadow:0 6px 22px #00000012}.exhibit-skip .icon{width:18px;height:18px}
.exhibition-section:not(.has-webgl) .exhibition-sticky,.exhibition-section.is-reduced .exhibition-sticky{padding-bottom:88px}
.exhibition-section.is-reduced .exhibit-ambience{display:none}
.exhibit-controls button{background:var(--surface-glass);color:var(--ink);border:1px solid var(--line)}
.exhibit-caption>button{font-weight:550}
.work-controls{display:flex;align-items:center;gap:var(--space-4);flex-wrap:wrap}.grid-density{display:flex;align-items:center;gap:12px;font-size:12px;color:var(--muted);min-height:44px}
.grid-density input{width:110px;min-width:80px;height:44px;accent-color:var(--accent);cursor:ew-resize}.grid-density output{font-size:11px;min-width:58px;font-variant-numeric:tabular-nums}
#work .work-grid{display:grid;grid-template-columns:repeat(var(--grid-columns,4),minmax(0,1fr));grid-auto-rows:auto;column-gap:16px;row-gap:20px;align-items:start;columns:initial}
#work .work-grid.is-masonry{grid-auto-rows:4px;row-gap:8px}
#work .cell{display:block;min-width:0;margin:0;align-self:start;grid-row-end:span var(--rows,1)}
#work .cell[hidden]{display:none}
#work .cell .cap{padding:10px 0 0;gap:3px}
#work .cap b{font-size:16px;line-height:1.35}
#work .cap i{font-size:11px;line-height:1.45}
#work .project-media,#work .project-open{border-radius:9px}
#work .work-tools{gap:12px;margin-bottom:21px}
#work .grid-head{margin-bottom:21px}
#work .filter{padding:9px 12px;font-size:12px}
#work .work-controls{gap:21px}
@media(max-width:599px){#work .work-grid{column-gap:12px}#work .cap b{font-size:14px}#work .cap i{font-size:10px}#work .cell .cap{padding-top:8px}#work .work-tools{gap:8px}#work .grid-head{margin-bottom:16px}}
#work[data-density=compact] .cap b{font-size:15px}#work[data-density=compact] .cap i{font-size:11px}
#transformation{display:grid;grid-template-columns:1fr 1.618fr;align-items:center;gap:clamp(34px,6vw,89px);padding:var(--section-space) var(--pad-x);background:linear-gradient(180deg,var(--paper),var(--bg) 34%);overflow:hidden}
.transform-copy{max-width:480px}.transform-copy h2{font-size:clamp(40px,3.7vw,60px);line-height:1.06}.transform-copy .sub{font-size:17px;line-height:1.618;max-width:34ch}
.direction-note{border-top:1px solid var(--line);padding-top:var(--space-3);margin-top:var(--space-4);margin-bottom:var(--space-4)}
.direction-number{font-size:11px;letter-spacing:.12em;color:var(--accent);font-variant-numeric:tabular-nums}.direction-note h3{font-family:var(--ff-sans);font-size:21px;line-height:1.4;letter-spacing:-.025em;margin-top:8px}.direction-note p{font-size:14px;color:var(--muted);margin-top:8px;max-width:32ch}
.transform-copy .cta{font-size:13px}.concept-note{font-size:11px;line-height:1.65;color:var(--muted);max-width:36ch;margin-top:var(--space-3)}
.comparison-figure{width:100%;max-width:560px;justify-self:center;margin:0}.comparison{position:relative;width:100%;aspect-ratio:1122/1402;border-radius:18px;overflow:hidden;isolation:isolate;background:var(--bg-soft);box-shadow:0 21px 55px #00000014;direction:ltr;touch-action:pan-y pinch-zoom}
.comparison img{width:100%;height:100%;object-fit:cover;user-select:none;pointer-events:none}.comparison-after{position:absolute;inset:0}.comparison-before{position:absolute;inset:0;clip-path:inset(0 calc(100% - var(--reveal)) 0 0)}
.comparison-labels{position:absolute;inset:18px 18px auto;display:flex;justify-content:space-between;gap:12px;pointer-events:none}.comparison-labels span{background:#202023cf;color:#fff;border:1px solid #ffffff30;padding:8px 12px;border-radius:100px;font-size:11px;backdrop-filter:blur(12px)}
.comparison-labels span:last-child{background:#fff;color:#1d1d1f}.comparison-divider{position:absolute;top:0;bottom:0;left:var(--reveal);width:2px;background:#fff;transform:translateX(-50%);pointer-events:none;box-shadow:0 0 10px #00000030}
.comparison-divider span{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:48px;height:48px;background:#fff;color:#171719;display:grid;place-items:center;border-radius:50%;box-shadow:0 3px 20px #00000025;font-size:22px}
#comparisonRange{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:ew-resize;direction:ltr;touch-action:pan-y pinch-zoom}
.comparison:focus-within{outline:3px solid var(--accent);outline-offset:6px}.comparison-figure figcaption{font-size:12px;color:var(--muted);text-align:center;line-height:1.6;margin-top:18px;max-width:46ch;margin-inline:auto}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(min-width:1600px){#transformation{grid-template-columns:1fr 1.618fr}.comparison-figure{max-width:640px}}
@media(max-width:1024px){.nav-right{gap:16px}#transformation{gap:34px}.transform-copy h2{font-size:44px}.work-controls{width:100%;justify-content:space-between}}
@media(max-width:767px){.nav-right{gap:6px}.nav-logo{width:112px}.theme-toggle{width:44px}.studio-panel{grid-template-columns:1fr;gap:34px}#transformation{grid-template-columns:1fr;gap:34px}.transform-copy{max-width:560px}.transform-copy h2{font-size:44px}.transform-copy .sub{max-width:40ch}.direction-note{margin-block:21px;padding-top:21px}.comparison-figure{max-width:480px}.grid-head{display:block}.grid-density{width:100%;justify-content:space-between}.grid-density input{flex:1;max-width:180px}.work-tools{gap:21px}.comparison-labels{inset:14px 14px auto}.comparison-labels span{padding:7px 10px;font-size:10px}.exhibition-section.has-webgl .exhibition-bottom{bottom:74px}.exhibit-ambience img{filter:blur(45px)}#work[data-density=compact] .cap b{font-size:14px;line-height:1.4}#work[data-density=compact] .cap{padding-top:10px}.comparison-divider span{width:44px;height:44px}}
@media(max-width:540px){.nav-logo{width:44px}.nav-logo .brand-horizontal,[data-theme=dark] nav .brand-horizontal{display:none}.nav-logo .brand-symbol{display:block}.nav-right{gap:4px}.nav-cta{padding-inline:13px}.theme-toggle{width:44px}.grid-head h2,.transform-copy h2{font-size:clamp(36px,10vw,48px)}}
@media(max-width:380px){.nav-right .lnk[data-go="9"]{display:none}}
@media(max-height:650px){.exhibition-section.has-webgl .exhibition-bottom{bottom:60px}.exhibit-skip{bottom:8px}.exhibition-section.has-webgl .exhibition-sticky{padding-top:18px}.exhibition-heading h2{font-size:22px}.exhibition-bottom .exhibit-caption>button{font-size:15px}}
@media(max-height:460px){.exhibition-section.has-webgl .exhibition-bottom{bottom:52px}.exhibit-skip{bottom:4px;min-height:44px}.exhibition-section.has-webgl .exhibition-sticky{padding-top:10px}.exhibition-heading h2{font-size:18px}}
@media(prefers-reduced-motion:reduce){body,nav,#work,#studio,#transformation,.exhibition-section,.exhibit-ambience img{transition:none}.hero-heading h1{animation:none!important}}
@media(prefers-reduced-motion:reduce){[data-reveal]{opacity:1;transform:none;transition:none}}
