@font-face{font-family:Space Grotesk;src:url('../fonts/space-grotesk.ttf') format('truetype');font-style:normal;font-weight:300 700;font-display:swap}
:root{--accent:#ff6500;--paper:#fffaf0;--ease-out:cubic-bezier(.23,1,.32,1)}
html{scroll-behavior:smooth;scrollbar-color:#8e6850 #181817;scroll-padding-top:24px}
body{overflow-x:clip}::selection{background:var(--accent);color:#181817}
.wrap{width:calc(100% - 96px);max-width:1480px}
header{padding:24px 0}header a{display:flex;align-items:center;min-height:44px}
.skip{position:fixed;left:20px;top:15px;z-index:100;background:var(--accent);color:#181817;padding:14px 20px;transform:translateY(-150%)}.skip:focus{transform:none}
.hero{position:relative;padding:40px 0 34px;display:grid;grid-template-columns:1.65fr 1fr;column-gap:48px;align-items:end}
.hero>.eyebrow{grid-column:1/-1;margin-bottom:16px}.hero h1{font-family:Space Grotesk,Arial,sans-serif;font-weight:700;font-size:clamp(52px,6.6vw,104px);letter-spacing:-.04em;line-height:.98;margin:0;max-width:100%;text-wrap:balance}.hero h1 span{color:var(--accent)}
.hero p{font-size:17px;line-height:1.65;max-width:40ch;margin:0 0 3px;color:#c2beb6}
.film-index{display:flex;align-items:center;gap:12px 32px;grid-column:1/-1;margin-top:28px;padding-top:18px;border-top:1px solid #ffffff26;flex-wrap:wrap}
.film-index a{display:inline-flex;align-items:center;gap:10px;min-height:44px;font-size:13px;text-decoration:none}.film-index span{color:#ff6500;font:12px monospace;font-variant-numeric:tabular-nums}.film-index a:hover{text-decoration:underline;text-decoration-color:var(--accent)}
.featurehead{padding:24px 0 20px}.featurehead h2{font-family:Space Grotesk,Arial,sans-serif;font-size:clamp(30px,3.4vw,54px);letter-spacing:-.04em;line-height:1.08;margin-top:8px}.featurehead p{max-width:29ch;text-align:right;line-height:1.5}.featurehead .eyebrow{font-size:10px;letter-spacing:.16em}
.depth-stage{perspective:1500px;position:relative;isolation:isolate}.depth-surface{transform-origin:50% 40%;box-shadow:0 30px 60px -22px #000b;backface-visibility:hidden}
.session-feature{margin-top:60px;padding-top:36px}.story{gap:48px;padding:30px 0 18px;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr)}.story p{max-width:65ch}.specs{color:#c2beb6}.specs a{min-height:44px;padding:8px 0;margin-top:8px}
.expand{min-height:44px;transition:background 160ms ease,transform 160ms var(--ease-out)}.expand:hover{background:#302c27}.expand:active{transform:scale(.97)}
footer{margin-top:72px;padding:32px 0}
/* Playback and fullscreen always use a stable, flat viewing plane. */
body:has(.expanded) .depth-surface,body:has(:fullscreen) .depth-surface{transform:none!important;box-shadow:none}.depth-stage:has(.expanded),.depth-stage:has(:fullscreen){perspective:none;isolation:auto}.depth-surface:has(.expanded),.depth-surface:has(:fullscreen){backface-visibility:visible}
@media(max-width:1000px){.hero{grid-template-columns:1fr;gap:20px}.hero>.eyebrow{margin:0}.hero p{max-width:60ch}.hero h1{font-size:clamp(52px,9vw,86px)}.film-index{margin-top:4px;gap:6px 25px}}
@media(max-width:650px){.wrap{width:calc(100% - 32px)}header{padding:12px 0}.hero{padding:28px 0 20px;gap:18px}.hero h1{font-size:clamp(36px,9.4vw,58px);letter-spacing:-.04em}.hero p{font-size:15px;line-height:1.55}.hero>.eyebrow{font-size:10px}.film-index{display:grid;grid-template-columns:1fr;gap:0;margin-top:0;padding-top:12px}.film-index a{font-size:12px;min-height:36px}.featurehead{padding:18px 0 16px}.featurehead h2{font-size:32px}.featurehead p{text-align:left;max-width:none;margin:10px 0 0;font-size:12px}.story{grid-template-columns:1fr;gap:20px;padding:22px 0 8px}.story p{font-size:15px;line-height:1.65}.session-feature{margin-top:42px;padding-top:24px}.depth-surface{box-shadow:0 16px 30px -12px #000b}footer{margin-top:48px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.depth-surface{transform:none!important;opacity:1!important}.expand{transition:none}}

/* Header uses the full-resolution approved silhouette, with true brand colours. */
header>a:first-child{flex-shrink:0;padding:5px 0;line-height:0}
.header-logo{display:block;width:210px;height:auto;overflow:visible}
@media(max-width:650px){.header-logo{width:172px}header{gap:24px;padding:18px 0}}
