/* Premium layer: loaded last on every page. Refines the older style/commerce/launch layers. */
:root{--ease:cubic-bezier(.2,.7,.2,1);--line:#ffffff1a;--card:#171d17;--card-hi:#1d241d;--radius:12px}
html{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
::selection{background:var(--yellow);color:var(--ink)}

/* Header: sticky glass bar */
header{position:sticky!important;top:0;z-index:50!important;height:70px!important;background:#121512cc!important;backdrop-filter:blur(14px) saturate(1.3);-webkit-backdrop-filter:blur(14px) saturate(1.3);border-bottom:1px solid var(--line);transition:box-shadow .3s var(--ease),background .3s}
header.scrolled{box-shadow:0 10px 30px #0006;background:#101310e6!important}
nav{align-items:center}
nav a{position:relative;transition:color .2s;line-height:1.2}
nav a:not(.nav-course):after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:1px;background:var(--yellow);transform:scaleX(0);transform-origin:left;transition:transform .3s var(--ease)}
nav a:hover:after{transform:scaleX(1)}
.nav-course{background:var(--yellow);color:var(--ink)!important;padding:8px 16px;border-radius:999px;font-weight:600;transition:transform .3s var(--ease),box-shadow .3s var(--ease)}
.nav-course:hover{transform:translateY(-1px);box-shadow:0 8px 22px #edbb2940}
@media(max-width:600px){.nav-course{padding:5px 12px}}
.languages button{transition:color .2s}
.languages button[aria-pressed=true]{color:var(--yellow)}
html{scroll-padding-top:80px}
@media(max-width:600px){header{height:auto!important;min-height:0!important;padding:10px 5% 0!important;row-gap:0!important}header nav{order:3;width:100%;justify-content:space-between;gap:10px!important;padding:9px 0 10px;margin-top:8px;border-top:1px solid var(--line);overflow-x:auto;scrollbar-width:none}html{scroll-padding-top:120px}}

/* Buttons */
.button{border-radius:8px;position:relative;overflow:hidden;transition:transform .35s var(--ease),box-shadow .35s var(--ease),background .2s}
.button:hover{transform:translateY(-2px);box-shadow:0 12px 28px #0005}
.button.yellow:hover{box-shadow:0 12px 30px #edbb2938}
.button:after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,#ffffff40 50%,transparent 70%);transform:translateX(-120%);transition:transform .7s var(--ease);pointer-events:none}
.button:hover:after{transform:translateX(120%)}

/* Hero: slow cinematic drift */
.hero-art{animation:hero-drift 18s ease-in-out infinite alternate}
@keyframes hero-drift{from{transform:scale(1.02)}to{transform:scale(1.08) translateX(-1%)}}
/* The poster is drawn 929px wide (auto 1650px tall). Size the layer to the picture so the fade hits its real edges. */
@media(min-width:901px){.hero-art{right:auto;width:min(64%,929px);left:calc(36% + max(0px,(64% - 929px) / 2));-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 24%,#000 76%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 24%,#000 76%,transparent 100%)}}

/* Readability: lift the smallest body copy */
.offer p,.offer li{font-size:13.5px!important;line-height:1.7!important}
.person p{font-size:13px!important;line-height:1.55}
.offer-note p{font-size:11px!important}

/* Offer cards: one system, equal heights */
.offer-grid{gap:22px!important;align-items:stretch}
.offer{position:relative;border:1px solid var(--line)!important;border-radius:var(--radius);background:linear-gradient(180deg,var(--card-hi),var(--card))!important;overflow:hidden;display:flex!important;flex-direction:column;box-shadow:0 1px 0 #ffffff0d inset,0 20px 40px #0004;transition:transform .45s var(--ease),border-color .3s,box-shadow .45s var(--ease)}
.offer:hover{transform:translateY(-6px);border-color:#edbb2966!important;box-shadow:0 1px 0 #ffffff12 inset,0 28px 60px #0007}
.offer.featured{border-color:#edbb29a6!important;box-shadow:0 0 0 1px #edbb2933,0 24px 60px #edbb2914}
.offer-art,.offer-art.scene-art{aspect-ratio:16/10!important;height:auto!important;min-height:0!important;padding:0!important;flex:none;position:relative;overflow:hidden;background:#0d110d}
.offer-art img{width:100%!important;height:100%!important;object-fit:cover!important;display:block;transition:transform .8s var(--ease)}
.offer:hover .offer-art img{transform:scale(1.05)}
.offer-art:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,#0d110dcc);pointer-events:none}
.example-tag{z-index:1;left:14px!important;right:auto!important;bottom:12px!important;border-radius:999px;padding:6px 11px!important;background:#0d110dd9!important;backdrop-filter:blur(6px);border:1px solid var(--line);font-size:9px!important;letter-spacing:1px!important}
.offer-badge{position:absolute;top:14px;left:14px;z-index:2;background:var(--yellow);color:var(--ink);font:600 9px 'IBM Plex Mono',monospace;letter-spacing:1.4px;padding:6px 11px;border-radius:999px}
.offer-body{display:flex!important;flex-direction:column;flex:1;padding:26px!important}
.offer-body>small{order:1}
.offer-body>h3{order:2;font-size:34px!important;line-height:1;margin:12px 0 14px!important}
.offer-body>.price{order:3;margin:0 0 14px!important;font-size:46px!important;line-height:1;display:flex;align-items:baseline;gap:8px}
.offer-body>.price [data-price]{font:700 1em 'Barlow Condensed',sans-serif!important;color:var(--paper)!important;letter-spacing:-.5px}
.offer-body>p{order:4;margin:0 0 14px}
.offer-body>ul{order:5;list-style:none;padding:0!important;margin:0 0 24px!important;display:grid;gap:7px}
.offer-body>ul li{padding-left:22px;position:relative}
.offer-body>ul li:before{content:"✓";position:absolute;left:0;color:var(--yellow);font-weight:700}
.offer-body>.button{order:6;margin-top:auto!important;justify-content:space-between}
@media(max-width:900px){.offer-grid{grid-template-columns:1fr!important}.offer{display:flex!important}}

/* Season / archive cards */
.season-file{border-radius:var(--radius);overflow:hidden;transition:transform .45s var(--ease),border-color .3s,box-shadow .45s var(--ease)}
a.season-file:hover{transform:translateY(-6px);box-shadow:0 26px 50px #0007}
.season-file img,.season-file .sealed-poster,.season-file .folder-stack{transition:transform .8s var(--ease)}
a.season-file:hover .season-poster{transform:scale(1.03)}

/* Cast: uniform portraits */
.cast{gap:22px!important}
.person{transition:transform .45s var(--ease)}
.portrait{height:auto!important;aspect-ratio:4/5;border-radius:var(--radius);background:#b9b9b4!important;filter:saturate(.75)!important;box-shadow:0 18px 40px #0005;transition:filter .4s,transform .45s var(--ease),box-shadow .45s var(--ease)!important}
.portrait img{position:static!important;width:100%!important;height:100%!important;max-width:100%!important;object-fit:cover;object-position:50% 0;transition:transform .8s var(--ease)}
.person:hover .portrait{filter:saturate(1)!important;transform:translateY(-6px)!important;box-shadow:0 28px 50px #0007}
.person:hover .portrait img{transform:scale(1.04)}
.portrait:after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 1px #00000014;pointer-events:none}
@media(max-width:600px){.cast{gap:24px 14px!important}}

/* Ledger, timer, paper blocks */
.timer div{border-radius:10px}
.house-clock{border-radius:10px}
.bar-stack i{border-radius:1px}
.knows-list li{transition:transform .3s var(--ease)}
.knows-list li:hover{transform:translateX(4px)}
details summary{transition:color .2s}
details summary:hover{color:var(--yellow)}

/* Course page */
.academy-visual{border-radius:6px}
#course-waitlist{border-radius:var(--radius)}
#course-waitlist input:not([type=checkbox]),#course-waitlist select,#course-waitlist textarea{border-radius:8px}
.module-outcome{border-radius:8px}
.academy-zero{display:grid;grid-template-columns:.8fr 1.2fr;gap:60px;align-items:center;border-bottom:1px solid var(--line)}
.academy-zero h2{color:var(--paper)}
.zero-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.zero-grid article{background:linear-gradient(180deg,var(--card-hi),var(--card));border:1px solid var(--line);border-radius:var(--radius);padding:22px;transition:transform .45s var(--ease),border-color .3s}
.zero-grid article:hover{transform:translateY(-5px);border-color:#edbb2966}
.zero-grid span{font:800 40px/1 'Barlow Condensed',sans-serif;color:var(--yellow)}
.zero-grid h3{font-size:24px;margin:12px 0 8px}
.zero-grid p{font-size:13.5px;line-height:1.65;color:#bdbdb1;margin:0}
@media(max-width:900px){.academy-zero{grid-template-columns:1fr;gap:30px}.zero-grid{grid-template-columns:1fr}}

/* Scroll reveal (motion class is set in route.js; motion.js adds .in) */
.motion .reveal{opacity:0;transform:translateY(22px);transition:opacity .8s var(--ease),transform .8s var(--ease);transition-delay:var(--d,0s)}
.motion .reveal.in,.motion-done .reveal{opacity:1;transform:none}
.motion .hero-copy>*{animation:rise .9s var(--ease) both}
.motion .hero-copy>*:nth-child(2){animation-delay:.08s}.motion .hero-copy>*:nth-child(3){animation-delay:.16s}.motion .hero-copy>*:nth-child(4){animation-delay:.24s}.motion .hero-copy>*:nth-child(5){animation-delay:.32s}.motion .hero-copy>*:nth-child(6){animation-delay:.4s}
@keyframes rise{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.hero-art{animation:none}.motion .reveal{opacity:1;transform:none;transition:none}.motion .hero-copy>*{animation:none}.button:after{display:none}}

/* Direct-send forms (forms.js) */
.hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;opacity:0}
.form-result{grid-column:1/-1;margin:10px 0 0;font:12px/1.6 'IBM Plex Mono',monospace;min-height:1em}
.form-result.ok{background:#1f6b3a;color:#f2fff5;padding:12px 14px;border-radius:8px}
.form-result.err{background:#7a2318;color:#fff2ef;padding:12px 14px;border-radius:8px}
button[type=submit]:disabled{opacity:.6;cursor:wait}

/* Arrow icons (route.js swaps ↗ ↓ → ← ↳ text for these) */
.ico{width:1em;height:1em;flex:none;display:inline-block;vertical-align:-.14em;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;transition:transform .3s var(--ease)}
a:hover .ico-ne,button:hover .ico-ne{transform:translate(2px,-2px)}
.button .ico{width:1.15em;height:1.15em}
.offer-note>span .ico{width:40px;height:40px;stroke-width:1.6}

/* Footer credit */
footer .credit{font:10px 'IBM Plex Mono',monospace;letter-spacing:1px;color:var(--muted);margin:0}
footer .credit a{color:var(--yellow);font-weight:500;letter-spacing:2px;display:inline-flex;align-items:center;gap:4px;border-bottom:1px solid transparent;transition:border-color .2s}
footer .credit a:hover{border-color:var(--yellow)}