/* Entry 02 — black preload, one headline, one object, one continuous surface. */
:root{--paper:#090a09}
body.opening-active{overflow:hidden}body.opening-active>header,body.opening-active>main,body.opening-active>footer{visibility:hidden}
.header{border:0;height:98px}.header nav{opacity:.74}.brand-wordmark{filter:brightness(1.4)}
.rig-experience{height:340svh;position:relative;background:var(--paper)}
.rig-sticky{position:sticky;top:0;height:100svh;min-height:680px;overflow:hidden;background:radial-gradient(ellipse at 50% 62%,#141714 0,transparent 48%),var(--paper)}
.landing-headline{position:absolute;z-index:3;top:15%;left:var(--pad);right:var(--pad);text-align:center;pointer-events:none;will-change:transform,opacity}
.landing-headline .eyebrow{justify-content:center;font-size:8px;letter-spacing:.15em;color:#a1a69d}
.landing-headline h1{font-family:var(--typeface),monospace;font-size:clamp(50px,5.7vw,88px);font-weight:400;line-height:1.1;letter-spacing:-.075em;margin:24px 0 0}.landing-headline h1 span{color:#c4c9c0}
#rig-canvas{position:absolute;inset:0;width:100%;height:100%;z-index:2;pointer-events:none}
.assembly-caption{position:absolute;top:12%;left:0;width:100%;z-index:3;text-align:center;opacity:0;pointer-events:none;will-change:transform,opacity}.assembly-caption .eyebrow{justify-content:center;font-size:8px;letter-spacing:.13em;color:#8c9584}.assembly-caption p{font-size:clamp(25px,3.2vw,46px);line-height:1.2;letter-spacing:-.055em;margin-top:18px}
.rig-bottom{position:absolute;z-index:4;bottom:32px;left:var(--pad);right:var(--pad);display:grid;grid-template-columns:1fr 1fr 1fr;align-items:end;gap:24px;font-size:8px;color:#a6ac9f}
.rig-stage{display:flex;flex-direction:column;gap:10px;font-size:8px;letter-spacing:.08em}.rig-study-link{font-size:8px;letter-spacing:0;color:#737b6d;width:max-content;padding:4px 0}.rig-study-link:hover{color:#e5e8e3}.rig-scroll{justify-self:center;display:flex;align-items:center;gap:18px;font-size:8px;letter-spacing:.08em}.rig-scroll span{font-size:20px}.rig-bottom .motion-toggle{justify-self:end;font-size:8px;color:#939b8b}.rig-bottom .motion-toggle span{border-color:#343c2e}
.rig-loading{position:absolute;top:63%;left:0;width:100%;text-align:center;font-size:10px;color:#939b8b}.rig-scroll-progress{position:absolute;bottom:0;left:var(--pad);right:var(--pad);height:1px;background:transparent}.rig-scroll-progress span{height:100%;display:block;background:#8b9a77;width:0;opacity:.5}
/* The loader is a black screen. Its logo never appears behind page copy. */
.opening{position:fixed;inset:0;background:#000;z-index:1000;clip-path:none;opacity:1;transition:opacity .38s .12s;pointer-events:auto}.opening::before{display:none}.opening.is-ready{clip-path:none;opacity:0;pointer-events:none;transition:opacity .38s .12s}
#loader-emblem{position:absolute;inset:0;width:100%;height:100%;transition:none;transform:none;pointer-events:none}
.preload-bottom{position:absolute;left:var(--pad);right:var(--pad);bottom:max(28px,env(safe-area-inset-bottom));font-family:var(--typeface),monospace}
.preload-status{display:flex;justify-content:space-between;align-items:center;color:#b0b5ad;font-size:8px;letter-spacing:.08em;margin-bottom:15px}.opening-progress{position:relative;inset:auto;height:1px;background:#242724}.opening-progress span{height:1px;background:#d8dfd0;transition:width .2s ease}.opening.is-ready .opening-progress{opacity:1}
#skip-opening{display:block;background:none;font-size:8px;color:#90998a;margin:17px 0 0 auto;padding:8px 0}.opening.is-ready #skip-opening{visibility:hidden}.opening.is-ready .preload-status{opacity:.6}
#type-preview-intro{margin-top:23px}.study-links{display:flex;gap:25px;flex-wrap:wrap}
@media(min-width:1700px){.rig-sticky{max-height:1200px}.landing-headline{top:15%}}
@media(max-width:750px){.header{height:82px}.header nav{display:none}.rig-experience{height:320svh}.rig-sticky{min-height:620px}.landing-headline{top:17%;left:24px;right:24px}.landing-headline .eyebrow{font-size:6px;letter-spacing:.09em}.landing-headline h1{font-size:clamp(38px,10.6vw,62px);line-height:1.17;margin-top:20px;letter-spacing:-.065em}.assembly-caption{top:12%}.assembly-caption .eyebrow{font-size:6px}.assembly-caption p{font-size:28px;margin-top:16px}.rig-bottom{bottom:24px;left:24px;right:24px;grid-template-columns:1fr auto;gap:15px}.rig-stage{font-size:6px;gap:7px}.rig-study-link{font-size:7px}.rig-scroll{justify-self:end;font-size:6px;gap:9px}.rig-scroll span{font-size:18px}.rig-bottom .motion-toggle{position:absolute;right:0;bottom:48px;font-size:0}.rig-bottom .motion-toggle span{font-size:10px;width:26px;height:26px;display:grid;place-items:center;padding:0}.rig-scroll-progress{left:24px;right:24px}.preload-status{font-size:7px}.preload-bottom{left:24px;right:24px;bottom:max(24px,env(safe-area-inset-bottom))}.rig-loading{font-size:9px}.hero-bottom{display:none}}
@media(max-height:700px){.landing-headline{top:17%}.landing-headline h1{font-size:clamp(35px,8.8vw,58px);margin-top:14px}.rig-sticky{min-height:560px}}
@media(prefers-reduced-motion:reduce){.rig-experience{height:180svh}.opening,.opening.is-ready{transition:opacity .12s}}

/* Film stills lead the project view; supporting detail follows. */
#project-dialog{width:min(1040px,calc(100% - 32px));padding:0;max-height:92svh;border-radius:0}#project-dialog .dialog-close{background:#080b08a8;border-radius:50%;color:#fff;top:16px;right:16px}.project-dialog-media{position:relative;aspect-ratio:16/9;max-height:56svh;overflow:hidden}.project-dialog-media img{width:100%;height:100%;object-fit:cover}.project-dialog-media>span{position:absolute;bottom:18px;left:28px;color:#fff;font-size:8px;letter-spacing:.09em;text-shadow:0 1px 8px #000}.project-dialog-copy{padding:35px 42px 42px}.project-dialog-copy h2{margin:18px 0 20px}.project-dialog-copy p{max-width:760px}.project-dialog-copy ul{display:flex;gap:25px;margin:24px 0 30px}.project-dialog-copy li{flex:1;font-size:10px;line-height:1.8}.project-dialog-copy li:before{display:none}.project-dialog-copy .eyebrow{font-size:8px}.project-media{border-radius:0}.project img{transition:transform .8s cubic-bezier(.2,.7,.2,1),filter .5s}
@media(max-width:650px){.project-dialog-copy{padding:25px 24px 32px}.project-dialog-copy h2{font-size:27px}.project-dialog-copy p{font-size:12px}.project-dialog-copy ul{display:block;margin:15px 0 25px}.project-dialog-copy li{padding:9px 0}.project-dialog-media{aspect-ratio:1.25}.project-dialog-media>span{left:20px;font-size:6px}.project-dialog-copy .pill-button{font-size:10px}}

/* One persistent logo canvas: the background clears without swapping emblems. */
html{scrollbar-gutter:stable}
.opening{background:transparent;transition:none}
.opening::before{content:"";display:block;position:absolute;inset:0;background:#000;opacity:1;transition:opacity .65s ease}
.opening.is-ready{opacity:1;transition:none}
.opening.is-landing::before,.opening.is-ready::before{opacity:0}
.opening.is-landing .preload-bottom,.opening.is-ready .preload-bottom{opacity:0;transition:opacity .3s}
#loader-emblem,.opening.is-ready #loader-emblem{opacity:1;transition:none}
#loader-emblem.landed{z-index:2;position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
body.opening-settled>header,body.opening-settled>main,body.opening-settled>footer{visibility:visible}
@media(prefers-reduced-motion:reduce){.opening::before{transition:none}}

/* Header, title and centred emblem each retain their own vertical space. */
.rig-sticky{min-height:0;max-height:none}
.landing-headline{top:120px}
.landing-headline h1{font-size:clamp(38px,4.7vw,68px);line-height:1.12;margin-top:16px;white-space:nowrap;letter-spacing:-.065em}
.header{gap:24px}
.header .logo,.header-actions{flex-shrink:0}
@media(max-width:1000px){.header nav{display:none}}
@media(max-width:750px){
 .header{gap:12px}
 .header .logo,.header .brand-wordmark{width:132px}
 .header .brand-wordmark{height:38px;mask-size:132px auto;mask-position:0 -59px}
 .header .contact-link{gap:10px;padding:11px 13px;white-space:nowrap}
 .landing-headline{top:100px;left:24px;right:24px}
 .landing-headline h1{font-size:clamp(24px,7.2vw,48px);margin-top:12px}
}
@media(min-width:751px) and (max-height:800px){
 .landing-headline{top:116px}
 .landing-headline h1{font-size:clamp(30px,4vw,44px);margin-top:12px}
}
@media(min-width:751px) and (max-height:650px){
 .header{height:72px}
 .landing-headline{top:88px}
 .landing-headline h1{font-size:36px;margin-top:8px}
}
@media(max-height:560px){
 .header{height:62px}
 .landing-headline{top:76px}
 .landing-headline .eyebrow{display:none}
 .landing-headline h1{font-size:clamp(22px,3.8vw,30px);margin-top:0}
}

/* The complete rig opens into an actual SkySurf film, with no hard section cut. */
.rig-experience{height:460svh}
.rig-film{position:absolute;z-index:3;top:50%;left:50%;width:min(88%,1200px);opacity:var(--film-reveal,0);visibility:hidden;transform:translate(-50%,-50%);will-change:opacity;pointer-events:none}
.rig-film:not([inert]){pointer-events:auto}
.rig-film-screen{display:block;width:100%;position:relative;padding:0;background:#090a09;aspect-ratio:910/512;overflow:hidden;text-align:left;clip-path:var(--film-aperture,ellipse(0px 0px));will-change:clip-path}
.rig-film-screen video{width:100%;height:100%;object-fit:contain;display:block}
.rig-film-play{position:absolute;left:24px;bottom:22px;color:#fff;font-size:11px;padding:10px 14px;background:#090a09a6;border-radius:28px;backdrop-filter:blur(4px)}
.rig-film-meta{position:absolute;top:calc(100% + 20px);left:0;right:0;display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:8px;letter-spacing:.08em;color:#b1b8aa}
[data-preview-start]{background:none;color:#e5e8e3;font-size:10px;padding:10px 0;min-height:44px;letter-spacing:0}
@media(max-width:750px){.rig-experience{height:440svh}.rig-film{width:calc(100% - 32px)}.rig-film-play{font-size:10px;left:12px;bottom:12px;padding:9px 12px}.rig-film-meta{top:calc(100% + 10px);font-size:7px}}
@media(max-height:560px){.rig-film{width:min(72%,calc(118svh));}.rig-film-meta{top:calc(100% + 8px)}}
@media(prefers-reduced-motion:reduce){.rig-experience{height:180svh}.rig-film{display:none}}

.rig-film-play,.rig-film-meta{opacity:var(--film-ui,0)}
.rig-stage,.rig-scroll{opacity:calc(1 - var(--film-reveal,0))}
/* Preserve the canvas aspect ratio even during a mobile viewport/lifecycle change. */
#loader-emblem,#rig-canvas{object-fit:contain;object-position:center}

/* The optical reveal becomes the first reference, with context already attached. */
.rig-film{width:min(88%,1200px,calc((100svh - 220px) * 910 / 512))}
.rig-film-heading{position:absolute;bottom:calc(100% + 22px);left:0;right:0;opacity:var(--film-context,0);pointer-events:none}
.rig-film-heading .eyebrow{font-size:9px;letter-spacing:.1em;color:#a9b29f;margin-bottom:10px}
.rig-film-heading h2{width:max-content;max-width:100%;position:relative;isolation:isolate;font-size:clamp(32px,4.5vw,62px);line-height:1.1;letter-spacing:-.065em}
.rig-film-meta{opacity:var(--film-context,0);align-items:flex-start;line-height:1.6;letter-spacing:0}
.rig-film-credits{display:grid;gap:5px;min-width:0}.rig-film-credits strong{font-size:13px;font-weight:400;color:#d5ddd0}.rig-film-credits>span{font-size:10px;color:#a3ad9b}
.rig-bottom .motion-toggle{opacity:calc(1 - var(--film-reveal,0))}
.rig-film-active .rig-experience{margin-bottom:calc(-1 * var(--rig-tail-space,0px))}
@media(max-width:750px){.rig-film{width:min(calc(100% - 32px),calc((100svh - 190px) * 910 / 512))}.rig-film-heading{bottom:calc(100% + 16px)}.rig-film-heading .eyebrow{font-size:8px;margin-bottom:8px}.rig-film-heading h2{font-size:clamp(28px,8vw,38px)}.rig-film-credits strong{font-size:12px}.rig-film-credits>span{font-size:9px}}
