/* Spherical film wall — self-contained, responsive and independent of WebGL. */
.sphere-work{position:relative;z-index:13;padding:110px 5vw 85px;isolation:isolate;overflow:hidden;border-block:1px solid #ffffff20;scroll-margin-top:65px}
.sphere-work::before{content:"";position:absolute;inset:0;background:#04090e;z-index:-1}
.sphere-heading{position:relative;z-index:2;max-width:1400px;margin:auto;pointer-events:none}.sphere-eyebrow{font:10px/1.5 'JetBrains Mono',monospace!important;letter-spacing:.19em;color:#82d7dd!important;margin:0 0 22px}.sphere-heading h2{font-size:clamp(40px,5.9vw,84px)!important;margin:0!important}.sphere-heading em{color:#83cbd4;font-style:normal}.sphere-heading>p:last-child{font-size:14px;margin:20px 0 0}
.sphere-stage{--radius:330px;--tile-w:185px;--tile-h:183px;height:760px;position:relative;cursor:grab;touch-action:pan-y;user-select:none;margin-top:-12px}.sphere-stage:active{cursor:grabbing}.sphere-aura{position:absolute;inset:2% 10%;border-radius:50%;background:radial-gradient(ellipse,#0e2935 0%,#07121c 48%,transparent 70%);pointer-events:none}.sphere-camera{position:absolute;inset:0;perspective:1400px;pointer-events:none}.sphere-orbit{position:absolute;left:50%;top:50%;width:0;height:0;transform-style:preserve-3d;will-change:transform}.sphere-tile{position:absolute;left:calc(var(--tile-w) / -2);top:calc(var(--tile-h) / -2);width:var(--tile-w);height:var(--tile-h);padding:0;border:1px solid #aecdd54a;background:#081018;border-radius:8px;overflow:hidden;transform:rotateY(var(--lon)) rotateX(var(--lat)) translateZ(var(--radius));backface-visibility:hidden;pointer-events:auto;cursor:pointer;color:#fff;box-shadow:0 8px 20px #0005}.sphere-tile img{display:block;width:100%;height:100%;object-fit:cover;pointer-events:none;transition:filter .25s}.sphere-tile span{position:absolute;bottom:0;left:0;right:0;display:flex;gap:10px;align-items:center;text-align:left;padding:25px 12px 12px;background:linear-gradient(transparent,#000c);font:500 12px/1.2 Inter,sans-serif}.sphere-tile i{font-style:normal;font-size:10px}.sphere-tile:hover{border-color:#b0f3ff}.sphere-coordinate{position:absolute;left:0;bottom:18px;font:10px 'JetBrains Mono',monospace;letter-spacing:.1em;color:#7196a6;pointer-events:none}.sphere-work :focus-visible,.film-dialog :focus-visible{outline:2px solid #95eeff;outline-offset:3px}.work-hero-link{display:inline-block;color:#9ce3e9!important;font-size:13px;margin-top:24px;padding:14px 0;border-bottom:1px solid #36636e;text-decoration:none}
.film-dialog{box-sizing:border-box;position:fixed;inset:0;width:100%;height:100dvh;max-width:none;max-height:none;margin:0;padding:24px 5vw;background:#050c12;color:#fff;border:0;overflow:auto;overscroll-behavior:contain}.film-dialog::backdrop{background:#050c12}.film-dialog header{display:flex;justify-content:space-between;align-items:center;gap:20px;margin:0 0 22px}.film-dialog header p{font:10px monospace;color:#80c9d2;text-transform:uppercase;letter-spacing:.12em}.film-dialog h2{font:400 clamp(24px,4vw,40px) 'Space Grotesk',sans-serif;margin:6px 0}.film-dialog video{display:block;width:100%;height:calc(100dvh - 220px);min-height:220px;object-fit:contain;background:#000}.film-dialog footer{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:20px}.film-dialog footer span{font:12px monospace;color:#a6bdc8}
/* The header blend mode affected its entire mobile menu, even opaque pixels. */
@media(max-width:760px){.site-header{mix-blend-mode:normal!important;background:#060d16!important;border:1px solid #28404e!important}.site-header nav,.site-header nav.is-open{background:#091522!important;opacity:1!important;isolation:isolate;border:1px solid #35505f!important;box-shadow:0 20px 60px #000b!important;max-height:calc(100dvh - 110px);overflow-y:auto}.site-header nav a{color:#e1edf4!important}.site-header nav a:hover,.site-header nav a.active{background:#163241!important;color:#fff!important}.menu-toggle{min-width:44px;min-height:44px}.sphere-work{padding:80px 6vw 55px}.sphere-heading h2{font-size:clamp(35px,8.5vw,55px)!important;line-height:1.06!important}.sphere-heading>p:last-child{font-size:12px}.sphere-eyebrow{font-size:9px!important}.sphere-stage{--radius:clamp(120px,37vw,210px);--tile-w:calc(var(--radius) * .56);--tile-h:calc(var(--radius) * .55);height:clamp(350px,100vw,540px);margin:10px -6vw 0}.sphere-camera{perspective:1000px}.sphere-tile span{font-size:9px;padding:20px 7px 8px;gap:6px}.sphere-coordinate{left:6vw;font-size:9px}.sphere-pause{flex:1}.film-dialog{padding:16px 5vw}.film-dialog footer button{font-size:11px;padding:10px}.film-dialog header{margin-bottom:18px}}
@media(prefers-reduced-motion:reduce){.sphere-tile img{transition:none}}
@media(max-width:760px){body.work-is-visible .floating-controls{top:90px;bottom:auto;right:15px}body.work-is-visible .floating-controls .page-progress{display:none}}

/* Cinematic first arrival, with no visible video titles or catalogue strip. */
.sphere-camera{opacity:0;transform:translate3d(0,100px,0) scale(.52) rotate(-12deg);transform-origin:50% 55%;transition:transform 2.1s cubic-bezier(.16,1,.3,1),opacity 1.1s ease;will-change:transform,opacity}
.sphere-stage.is-revealed .sphere-camera{opacity:1;transform:translate3d(0,0,0) scale(1) rotate(0deg)}
.sphere-aura{opacity:0;transition:opacity 2s ease}
.sphere-stage.is-revealed .sphere-aura{opacity:1}
.sphere-tile .sphere-play{inset:auto 10px 10px auto;width:28px;height:28px;padding:0;display:grid;place-items:center;border:1px solid #ffffff65;border-radius:50%;background:#040d1490;font:10px Inter,sans-serif}
.sphere-stage:focus-visible{outline:1px solid #82d7dd;outline-offset:8px}
.film-dialog header{justify-content:flex-end}
.visually-hidden{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip-path:inset(50%)!important;white-space:nowrap!important;border:0!important}
@media(prefers-reduced-motion:reduce){.sphere-camera,.sphere-aura{transition:none!important}.sphere-camera{opacity:1;transform:none}}
.motion-off .sphere-camera{transition:none!important;opacity:1;transform:none}
.motion-off .sphere-aura{transition:none!important;opacity:1}
.film-dialog button{min-height:44px;min-width:44px;padding:10px 16px;border:1px solid #ffffff40;background:#07111b;color:#fff;font:12px Inter,sans-serif;cursor:pointer}.film-dialog button:hover{background:#163343}