@font-face{font-family:Naddara;src:url(assets/naddara-sans.woff);font-display:swap}
:root{color-scheme:light;--ink:#171c20;--muted:#66717a;--edge:clamp(24px,3.8vw,64px)}
*{box-sizing:border-box}html{scrollbar-width:thin;scrollbar-color:#8599a63d #f9fafb}html,body{margin:0;min-height:100%;background:#f9fafb;color:var(--ink)}body{font-family:Naddara,Arial,sans-serif;overflow-x:hidden}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;border:0;background:none;cursor:pointer}button:disabled{cursor:default}button:focus-visible,a:focus-visible{outline:1px solid #324653;outline-offset:6px}button:focus:not(:focus-visible){outline:none}
.backdrop{position:fixed;inset:-2%;z-index:0;background:radial-gradient(ellipse at 50% 75%,#f1f4f6 5%,#c5cfd6 67%,#b0bec9 100%);pointer-events:none;will-change:opacity}.backdrop::after{content:'';position:absolute;inset:0;background:url(assets/silver-studio.webp) center/cover no-repeat;opacity:.45}
header{position:fixed;z-index:20;inset:0 0 auto;display:grid;grid-template-columns:1fr auto 1fr;align-items:start;padding:28px var(--edge);pointer-events:none}header>*{pointer-events:auto}.logo{grid-column:3;grid-row:1;justify-self:end;position:relative;isolation:isolate}.logo::before{content:"";position:absolute;inset:-8px -12px;z-index:-1;background:radial-gradient(ellipse,#ffffff80,transparent 72%);filter:blur(6px);pointer-events:none}.logo img{display:block;width:clamp(104px,10vw,152px);height:auto}.descriptor{grid-column:2;grid-row:1;font-size:11px;line-height:1.5;letter-spacing:3px;white-space:nowrap;margin:2px 0 0}nav{grid-column:1;grid-row:1;display:flex;align-items:center;gap:10px;font-size:11px;line-height:1;letter-spacing:.8px}nav button{padding:4px 0;opacity:.45}nav button[aria-pressed=true]{opacity:1}nav span{opacity:.3}
.scroll-track{height:210svh;position:relative}.hero{position:fixed;inset:0;height:100svh;min-height:540px;z-index:2;overflow:hidden}.stage{position:absolute;inset:0;container-type:size;transform:translateY(36px)}#volume-canvas,.poster{position:absolute;inset:0;display:block;width:100%;height:100%;pointer-events:none}.poster{inset:auto;left:50%;top:50%;width:min(100cqh,111.3636cqw);height:auto;transform:translate(-50%,-50%)}.ready .poster{visibility:hidden}
.signature{position:absolute;left:var(--edge);bottom:40px;text-align:left;max-width:36%;z-index:5;will-change:opacity}.signature p{font-size:12px;font-weight:400;letter-spacing:2.4px;line-height:1.5;margin:0}.signature small{display:block;margin-top:8px;font-size:10px;letter-spacing:3px}
.discover{font-size:11px;line-height:1.5;margin-top:20px;padding:0 0 4px;border-bottom:1px solid #3b4b554d;transition:border-color .2s}.discover:hover{border-color:#1a242c}.controls{position:absolute;right:var(--edge);bottom:40px;z-index:5}#pause{display:grid;place-items:center;font-size:16px;width:36px;height:36px;border:1px solid #43566444;border-radius:50%;padding:0;transition:border-color .2s}#pause:hover{border-color:#1a242c}.scroll-progress{position:absolute;left:50%;bottom:40px;width:120px;height:1px;background:#8c9aa542;transform:translateX(-50%);pointer-events:none}.scroll-progress span{display:block;height:100%;background:#253a48;transform:scaleX(0);transform-origin:left}
.agency{position:fixed;inset:0;z-index:4;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;padding:clamp(160px,18vh,220px) max(var(--edge),12vw) 80px;opacity:0;pointer-events:none;will-change:opacity,transform}.agency.visible{pointer-events:auto}.agency h2{font-family:Georgia,'Times New Roman',serif;font-size:clamp(40px,5.5vw,80px);font-weight:400;letter-spacing:-2.4px;line-height:1.06;max-width:800px;margin:24px 0}.agency p{max-width:500px;font-size:16px;line-height:1.8;margin:0}.eyebrow{font-size:11px;letter-spacing:1.2px}.agency button{font-size:11px;margin-top:32px;padding:8px 0;border-bottom:1px solid #45576255}.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.skip{position:fixed;top:-100px;z-index:30}.skip:focus{top:12px;left:16px;background:white;padding:12px}
.effervescence{position:fixed;inset:0;pointer-events:none;overflow:hidden;z-index:1}.bubble{position:absolute;bottom:-24px;width:var(--size);height:var(--size);left:var(--x);border:1px solid #708b9b44;border-radius:50%;background:radial-gradient(circle at 30% 25%,#ffffffbb 0 12%,#c9dbe417 35%,transparent 65%);box-shadow:inset -.4px -.6px .7px #8da3b22b;animation:rise var(--time) linear var(--delay) infinite;opacity:0}.paused .bubble{animation-play-state:paused}@keyframes rise{0%{transform:translate3d(0,12px,0) scale(.55);opacity:0}12%{opacity:.32}75%{opacity:.24}100%{transform:translate3d(var(--drift),-110vh,0) scale(1.1);opacity:0}}
.noscript-case{position:fixed;left:50%;top:50%;height:min(90vh,100vw);width:auto;max-width:110vw;transform:translate(-50%,-50%);pointer-events:none}
@media(max-width:700px){header{padding-top:24px;grid-template-columns:1fr 1fr}.logo{grid-column:2}.logo img{width:104px}.descriptor{grid-column:1;grid-row:2;font-size:10px;letter-spacing:1.3px;margin-top:20px}.stage{transform:translateY(8px)}.signature{max-width:80%;bottom:32px}.signature p{font-size:11px;letter-spacing:2px}.signature small{font-size:10px;margin-top:8px}.discover{margin-top:20px;font-size:11px}.controls{bottom:32px}.scroll-progress{bottom:20px;width:88px}.agency{padding:160px var(--edge) 80px}.agency h2{font-size:44px;letter-spacing:-1.6px}.agency p{font-size:15px}.bubble:nth-child(n+7){display:none}}
@media(max-height:650px) and (min-width:701px){.logo img{width:104px}.signature p{font-size:11px}.signature{bottom:24px}.signature small{margin-top:8px}.discover{margin-top:12px}.controls{bottom:24px}.stage{inset:24px 0 40px;transform:translateY(24px)}.agency h2{font-size:44px}.agency{padding-top:120px}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.bubble{display:none}}

.asset-credits{display:block;width:fit-content;font-size:11px;color:#566570;margin:24px 0 12px;text-decoration:underline;text-underline-offset:3px}

/* Broad reflected illumination, with no visible beam or hard spotlight edge. */
.studio-light{position:fixed;inset:0;z-index:1;pointer-events:none;overflow:hidden;opacity:.14;will-change:opacity}
.studio-light__source{position:absolute;left:48%;top:18%;width:min(74vw,1060px);height:60vh;transform:translate(-50%,-50%);background:radial-gradient(ellipse,#ffffffb3 0%,#ffffff5c 26%,#f5faff26 49%,#f5faff08 64%,transparent 79%);filter:blur(44px);opacity:var(--warmth,.7)}
.studio-light__wash{position:absolute;left:49%;top:58%;width:min(92vw,1320px);height:80vh;transform:translate(-50%,-50%);background:radial-gradient(ellipse,#ffffff38 0%,#f8fcff1c 35%,transparent 73%);filter:blur(58px)}
.studio-arrival{position:absolute;pointer-events:none;z-index:1;max-width:none;will-change:transform}#volume-canvas{z-index:2}
.studio-decoder{position:absolute;width:1px;height:1px;left:0;bottom:0;opacity:0;pointer-events:none;clip-path:inset(50%)}
@media(max-width:700px){.studio-light__source{top:27%;width:130vw;height:49vh;filter:blur(34px)}.studio-light__wash{top:55%;width:140vw;height:64vh;filter:blur(42px)}}

/* A fine, directional paper relief; the spotlight still crosses its surface. */
.studio-material{position:fixed;inset:-24px;z-index:1;pointer-events:none;background:url(assets/paper-relief.webp) repeat;background-size:480px 480px;mix-blend-mode:multiply;opacity:.52;will-change:opacity}
.poster-static{display:none}
@media(prefers-reduced-motion:reduce){.poster-entry{display:none}.poster-static{display:block}}

.agency-contact{display:block;width:fit-content;margin-top:28px;color:var(--ink);font-size:13px;line-height:1.5;text-underline-offset:5px}.agency-contact:hover{text-decoration-thickness:2px}
