/* =========================================================
   MERCENARY PLANET — ASH & STEEL
   Artizense Gaming · Design System
   Electric Amber · Obsidian Black · Ivory White · Thin Gold
   ========================================================= */

@property --ang { syntax: '<angle>'; initial-value: 0deg; inherits: false; }

:root{
  --void:#030303;
  --obsidian:#0a0806;
  --char:#14100b;
  --ember:#2a1a06;
  --amber:#ffb000;
  --amber-hot:#ffc93c;
  --amber-deep:#e07b00;
  --gold:#d6a84e;
  --gold-soft:rgba(214,168,78,.38);
  --gold-faint:rgba(214,168,78,.14);
  --ivory:#f6f1e7;
  --mist:rgba(246,241,231,.66);
  --dim:rgba(246,241,231,.42);
  --glass:rgba(18,13,7,.55);
  --line:1px solid var(--gold-soft);

  --f-display:'Michroma','Orbitron',system-ui,sans-serif;
  --f-body:'Manrope','Segoe UI',system-ui,sans-serif;
  --f-hud:'Chakra Petch','Rajdhani',ui-monospace,monospace;

  --ease:cubic-bezier(.19,1,.22,1);
  --gutter:clamp(16px,4vw,64px);
  --max:1360px;
  --nav-h:84px;
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
html,body{overflow-x:clip}
body{
  font-family:var(--f-body);
  color:var(--ivory);
  background:var(--void);
  line-height:1.65;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
::selection{background:var(--amber);color:#000}
::-webkit-scrollbar{width:8px}
::-webkit-scrollbar-track{background:#000}
::-webkit-scrollbar-thumb{background:linear-gradient(var(--amber-deep),var(--gold));border-radius:8px}

/* ---------- Ambient page background: black + amber ---------- */
.ambient{position:fixed;inset:0;z-index:-2;pointer-events:none;
  background:
    radial-gradient(1200px 700px at 85% -10%, rgba(255,150,0,.20), transparent 60%),
    radial-gradient(900px 600px at -10% 40%, rgba(224,123,0,.14), transparent 60%),
    radial-gradient(1000px 800px at 60% 120%, rgba(255,176,0,.12), transparent 60%),
    linear-gradient(180deg,#050403 0%,#0b0805 45%,#060403 100%);
}
.ambient::after{content:'';position:absolute;inset:0;opacity:.07;
  background-image:
    linear-gradient(var(--gold) 1px,transparent 1px),
    linear-gradient(90deg,var(--gold) 1px,transparent 1px);
  background-size:88px 88px;
  mask-image:radial-gradient(ellipse at 50% 30%,#000 10%,transparent 75%);
}
.grain{position:fixed;inset:-50%;z-index:-1;pointer-events:none;opacity:.05;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  animation:grain 1.2s steps(6) infinite}
@keyframes grain{0%{transform:translate(0,0)}25%{transform:translate(-3%,2%)}50%{transform:translate(2%,-3%)}75%{transform:translate(-2%,-1%)}100%{transform:translate(1%,3%)}}
#embers{position:fixed;inset:0;z-index:-1;pointer-events:none}

/* ---------- Preloader ---------- */
.preloader{position:fixed;inset:0;z-index:9999;background:#030201;display:grid;place-items:center;transition:opacity .9s var(--ease),visibility .9s}
.preloader.done{opacity:0;visibility:hidden;pointer-events:none}
.preloader__core{display:grid;justify-items:center;gap:22px}
.preloader__core img{width:110px;filter:drop-shadow(0 0 30px rgba(255,160,0,.5));animation:breathe 2.4s ease-in-out infinite}
.preloader__bar{width:220px;height:1px;background:var(--gold-faint);position:relative;overflow:hidden}
.preloader__bar i{position:absolute;inset:0;background:linear-gradient(90deg,transparent,var(--amber),transparent);transform:translateX(-100%);animation:sweepX 1.4s var(--ease) infinite}
.preloader__txt{font-family:var(--f-hud);letter-spacing:.5em;font-size:11px;color:var(--gold);text-transform:uppercase}
@keyframes breathe{50%{transform:scale(1.06);filter:drop-shadow(0 0 50px rgba(255,176,0,.8))}}
@keyframes sweepX{to{transform:translateX(100%)}}

/* ---------- Cursor ---------- */
.cursor,.cursor-dot{position:fixed;top:0;left:0;pointer-events:none;z-index:9998;border-radius:50%;transform:translate(-50%,-50%)}
.cursor{width:38px;height:38px;border:1px solid var(--gold);transition:width .35s var(--ease),height .35s var(--ease),background .35s,border-color .35s;mix-blend-mode:difference}
.cursor-dot{width:5px;height:5px;background:var(--amber)}
.cursor.hover{width:74px;height:74px;background:rgba(255,176,0,.12);border-color:var(--amber)}
@media (hover:none),(pointer:coarse){.cursor,.cursor-dot{display:none}}

/* ---------- Navigation ---------- */
.nav{position:fixed;top:0;left:0;right:0;z-index:100;height:var(--nav-h);display:flex;align-items:center;
  padding:0 var(--gutter);transition:background .5s,height .5s var(--ease),backdrop-filter .5s}
.nav.scrolled{--nav-h:68px;background:rgba(5,4,3,.72);backdrop-filter:blur(18px) saturate(140%)}
.nav::after{content:'';position:absolute;left:0;right:0;bottom:0;height:1px;
  background:linear-gradient(90deg,transparent,var(--gold-soft) 20%,var(--amber) 50%,var(--gold-soft) 80%,transparent);
  background-size:200% 100%;animation:lineSweep 6s linear infinite;opacity:.0;transition:opacity .5s}
.nav.scrolled::after{opacity:1}
.nav__inner{max-width:var(--max);margin:auto;width:100%;display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand{display:flex;align-items:center;gap:12px;flex-shrink:0}
.brand img{width:44px;filter:drop-shadow(0 0 12px rgba(255,160,0,.45));transition:transform .8s var(--ease)}
.brand:hover img{transform:rotate(-12deg) scale(1.08)}
.brand__txt{font-family:var(--f-display);font-size:12px;letter-spacing:.28em;line-height:1.25}
.brand__txt small{display:block;font-family:var(--f-hud);font-size:9px;letter-spacing:.55em;color:var(--gold)}
.nav__links{display:flex;gap:4px;list-style:none}
.nav__links a{position:relative;display:block;padding:10px 16px;font-family:var(--f-hud);font-size:12.5px;font-weight:500;
  letter-spacing:.24em;text-transform:uppercase;color:var(--mist);transition:color .3s}
.nav__links a::before{content:'';position:absolute;left:16px;right:16px;bottom:4px;height:1px;
  background:linear-gradient(90deg,transparent,var(--amber),transparent);transform:scaleX(0);transition:transform .5s var(--ease)}
.nav__links a:hover,.nav__links a.active{color:var(--ivory)}
.nav__links a:hover::before,.nav__links a.active::before{transform:scaleX(1)}
.nav__links a.active{color:var(--amber)}
.nav__cta{flex-shrink:0}
.burger{display:none;width:44px;height:44px;position:relative;border:var(--line);border-radius:2px}
.burger span{position:absolute;left:11px;right:11px;height:1px;background:var(--ivory);transition:transform .4s var(--ease),opacity .3s}
.burger span:nth-child(1){top:16px}.burger span:nth-child(2){top:21.5px}.burger span:nth-child(3){top:27px}
.menu-open .burger span:nth-child(1){transform:translateY(5.5px) rotate(45deg)}
.menu-open .burger span:nth-child(2){opacity:0}
.menu-open .burger span:nth-child(3){transform:translateY(-5.5px) rotate(-45deg)}

@media (max-width:1180px){
  .nav__cta{display:none}
  .nav__links a{padding:10px 11px;letter-spacing:.18em}
}
@media (max-width:980px){
  .burger{display:block}
  .nav__links{position:fixed;inset:0;z-index:-1;flex-direction:column;justify-content:center;align-items:center;gap:6px;
    background:radial-gradient(circle at 50% 30%,rgba(255,150,0,.18),transparent 60%),rgba(3,3,2,.97);
    backdrop-filter:blur(20px);opacity:0;visibility:hidden;transition:opacity .5s var(--ease),visibility .5s}
  .menu-open .nav__links{opacity:1;visibility:visible}
  .nav__links li{transform:translateY(20px);opacity:0;transition:transform .6s var(--ease),opacity .6s}
  .menu-open .nav__links li{transform:none;opacity:1}
  .menu-open .nav__links li:nth-child(n){transition-delay:calc(var(--i,0) * 60ms)}
  .nav__links a{font-family:var(--f-display);font-size:22px;letter-spacing:.2em;padding:14px}
}

/* ---------- Buttons ---------- */
.btn{--c:var(--amber);position:relative;display:inline-flex;align-items:center;gap:14px;padding:16px 30px;
  font-family:var(--f-hud);font-weight:600;font-size:13px;letter-spacing:.28em;text-transform:uppercase;
  color:#0a0703;background:linear-gradient(135deg,var(--amber-hot),var(--amber) 45%,var(--amber-deep));
  clip-path:polygon(12px 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%,0 12px);
  transition:transform .4s var(--ease),box-shadow .4s;overflow:hidden;isolation:isolate}
.btn::after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.65) 50%,transparent 70%);
  transform:translateX(-120%);transition:transform .9s var(--ease)}
.btn:hover{transform:translateY(-2px);box-shadow:0 12px 40px rgba(255,160,0,.35)}
.btn:hover::after{transform:translateX(120%)}
.btn svg{width:16px;height:16px;transition:transform .4s var(--ease)}
.btn:hover svg{transform:translateX(4px)}
.btn--ghost{color:var(--ivory);background:rgba(255,176,0,.04);clip-path:none;border:1px solid transparent;
  border-image:linear-gradient(135deg,var(--gold),transparent 40%,transparent 60%,var(--gold)) 1}
.btn--ghost::after{background:linear-gradient(110deg,transparent 30%,rgba(255,176,0,.25) 50%,transparent 70%)}
.btn--ghost:hover{box-shadow:0 0 30px rgba(255,176,0,.15);color:var(--amber-hot)}
.btn--sm{padding:11px 20px;font-size:11px}

/* ---------- Gold sweeping lines ---------- */
@keyframes lineSweep{from{background-position:200% 0}to{background-position:-200% 0}}
.goldline{height:1px;width:100%;position:relative;
  background:linear-gradient(90deg,transparent,var(--gold-faint) 15%,var(--gold-soft) 50%,var(--gold-faint) 85%,transparent)}
.goldline::after{content:'';position:absolute;inset:-1px 0;
  background:linear-gradient(90deg,transparent 0%,transparent 40%,var(--amber-hot) 50%,transparent 60%,transparent 100%);
  background-size:250% 100%;animation:lineSweep 5s linear infinite;filter:drop-shadow(0 0 6px var(--amber))}

/* Frame: thin gold border with sweeping light traveling around */
.frame{position:relative;isolation:isolate}
.frame::before{content:'';position:absolute;inset:0;z-index:2;pointer-events:none;padding:1px;border-radius:inherit;
  background:conic-gradient(from var(--ang),var(--gold-faint) 0deg,var(--gold-soft) 60deg,var(--amber-hot) 90deg,var(--gold-soft) 120deg,var(--gold-faint) 180deg,var(--gold-faint) 240deg,var(--gold-soft) 300deg,var(--gold-faint) 360deg);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;
  animation:spin 7s linear infinite}
@keyframes spin{to{--ang:360deg}}
.corners{position:absolute;inset:-6px;pointer-events:none;z-index:3}
.corners i{position:absolute;width:14px;height:14px;border-color:var(--amber);border-style:solid;border-width:0}
.corners i:nth-child(1){top:0;left:0;border-top-width:1px;border-left-width:1px}
.corners i:nth-child(2){top:0;right:0;border-top-width:1px;border-right-width:1px}
.corners i:nth-child(3){bottom:0;left:0;border-bottom-width:1px;border-left-width:1px}
.corners i:nth-child(4){bottom:0;right:0;border-bottom-width:1px;border-right-width:1px}

/* ---------- Layout ---------- */
.wrap{max-width:var(--max);margin:0 auto;padding:0 var(--gutter)}
.section{position:relative;padding:clamp(80px,12vw,160px) 0}
.section--tight{padding:clamp(60px,8vw,100px) 0}
.grid{display:grid;gap:clamp(18px,2.4vw,32px)}
.g2{grid-template-columns:repeat(2,1fr)}
.g3{grid-template-columns:repeat(3,1fr)}
.g4{grid-template-columns:repeat(4,1fr)}
@media (max-width:1024px){.g4{grid-template-columns:repeat(2,1fr)}.g3{grid-template-columns:repeat(2,1fr)}}
@media (max-width:680px){.g2,.g3,.g4{grid-template-columns:1fr}}

/* ---------- Type ---------- */
.eyebrow{display:inline-flex;align-items:center;gap:14px;font-family:var(--f-hud);font-size:12px;font-weight:500;letter-spacing:.5em;
  text-transform:uppercase;color:var(--amber)}
.eyebrow::before{content:'';width:42px;height:1px;background:linear-gradient(90deg,transparent,var(--amber))}
.h-xl,.h-lg,.h-md,.h-sm{font-family:var(--f-display);font-weight:400;line-height:1.08;letter-spacing:.02em;text-transform:uppercase}
.h-xl{font-size:clamp(40px,7.2vw,112px)}
.h-lg{font-size:clamp(30px,4.6vw,66px)}
.h-md{font-size:clamp(22px,2.6vw,36px)}
.h-sm{font-size:clamp(15px,1.3vw,18px);letter-spacing:.12em}
.gold-text{background:linear-gradient(100deg,#fff5dc 0%,var(--amber-hot) 25%,var(--gold) 45%,#fff2cc 55%,var(--amber) 75%,var(--amber-deep) 100%);
  background-size:220% auto;-webkit-background-clip:text;background-clip:text;color:transparent;animation:shine 6s linear infinite}
@keyframes shine{to{background-position:-220% center}}
.lead{font-size:clamp(16px,1.25vw,19px);color:var(--mist);max-width:62ch;font-weight:300}
.muted{color:var(--dim)}
.hud{font-family:var(--f-hud);letter-spacing:.24em;text-transform:uppercase;font-size:11px;color:var(--gold)}
.sec-head{display:grid;gap:22px;margin-bottom:clamp(40px,6vw,80px)}
.sec-head--center{justify-items:center;text-align:center}
.sec-head--center .lead{margin:0 auto}
.sec-head--split{grid-template-columns:1.2fr 1fr;align-items:end;gap:40px}
@media (max-width:860px){.sec-head--split{grid-template-columns:1fr}}

/* ---------- Hero (shared) ---------- */
.hero{position:relative;min-height:100vh;min-height:100svh;display:flex;align-items:center;overflow:hidden;padding:calc(var(--nav-h) + 40px) 0 90px;perspective:1400px}
.hero__bg{position:absolute;inset:-4%;z-index:-2;background-size:cover;background-position:center;opacity:.55;transform:scale(1.08);will-change:transform}
.hero__bg::after{content:'';position:absolute;inset:0;
  background:linear-gradient(90deg,#030201 8%,rgba(3,2,1,.72) 42%,rgba(3,2,1,.25) 70%,rgba(3,2,1,.6)),
             linear-gradient(0deg,#050403 2%,transparent 40%),
             radial-gradient(circle at 70% 40%,rgba(255,150,0,.22),transparent 55%)}
.hero__canvas{position:absolute;inset:0;z-index:-1;width:100%;height:100%}
.hero__content{position:relative;z-index:2;max-width:760px;display:grid;gap:28px}
.hero__title{font-family:var(--f-display);text-transform:uppercase;font-size:clamp(38px,7vw,104px);line-height:1.02;letter-spacing:.01em}
.hero__title .line{display:block;overflow:hidden}
.hero__title .line>span{display:inline-block;transform:translateY(110%);animation:rise 1.4s var(--ease) forwards}
.hero__title .line:nth-child(2)>span{animation-delay:.12s}
.hero__title .line:nth-child(3)>span{animation-delay:.24s}
@keyframes rise{to{transform:none}}
.hero__actions{display:flex;flex-wrap:wrap;gap:16px}
.hero__meta{display:flex;flex-wrap:wrap;gap:34px;padding-top:26px;border-top:1px solid var(--gold-faint)}
.hero__meta div{display:grid;gap:4px}
.hero__meta b{font-family:var(--f-display);font-weight:400;font-size:20px;color:var(--ivory)}
.scroll-hint{position:absolute;left:50%;bottom:26px;transform:translateX(-50%);display:grid;justify-items:center;gap:10px;z-index:3}
/* heroes with a Scroll hint keep its strip clear: content always ends above it */
@media (min-width:681px){.hero:has(> .scroll-hint){padding-bottom:max(90px,calc(26px + 92px + 24px))}}
.scroll-hint i{width:1px;height:54px;background:linear-gradient(var(--amber),transparent);position:relative;overflow:hidden}
.scroll-hint i::after{content:'';position:absolute;left:0;top:-30%;width:1px;height:30%;background:#fff;animation:drip 2s var(--ease) infinite}
@keyframes drip{to{top:110%}}
.hero__side{position:absolute;right:var(--gutter);top:50%;transform:translateY(-50%);display:grid;gap:18px;z-index:3;writing-mode:vertical-rl}
@media (max-width:860px){.hero__side{display:none}}

/* 3D layered stage for hero art */
.stage{position:absolute;right:0;bottom:0;top:0;width:58%;z-index:1;transform-style:preserve-3d;pointer-events:none}
.stage .layer{position:absolute;will-change:transform;transition:transform .2s linear}
@media (max-width:980px){.stage{width:100%;opacity:.45}}

/* Page hero (inner pages) */
.phero{min-height:88vh}
.phero .hero__content{max-width:720px}

/* ---------- Reveal ---------- */
[data-reveal]{opacity:0;transform:translateY(40px);transition:opacity 1.2s var(--ease),transform 1.2s var(--ease)}
[data-reveal="left"]{transform:translateX(-50px)}
[data-reveal="right"]{transform:translateX(50px)}
[data-reveal="zoom"]{transform:scale(.92)}
[data-reveal].in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001s!important;animation-iteration-count:1!important;transition-duration:.001s!important}
  [data-reveal]{opacity:1;transform:none}
}

/* ---------- Cards ---------- */
.card{position:relative;background:linear-gradient(160deg,rgba(40,26,8,.55),rgba(10,8,5,.75));border-radius:4px;overflow:hidden;
  transform-style:preserve-3d;transition:transform .6s var(--ease),box-shadow .6s var(--ease)}
.card:hover{box-shadow:0 30px 80px -20px rgba(255,150,0,.28)}
.card__media{position:relative;overflow:hidden;aspect-ratio:16/10}
.card__media img{width:100%;height:100%;object-fit:cover;transition:transform 1.4s var(--ease),filter 1s}
.card:hover .card__media img{transform:scale(1.07)}
.card__media::after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,rgba(8,6,3,.95),transparent 55%)}
.card__body{padding:26px 28px 30px;display:grid;gap:12px}
.card__glare{position:absolute;inset:0;pointer-events:none;z-index:4;opacity:0;transition:opacity .4s;
  background:radial-gradient(circle at var(--gx,50%) var(--gy,50%),rgba(255,210,120,.22),transparent 45%)}
.card:hover .card__glare{opacity:1}
[data-tilt]{transform-style:preserve-3d;will-change:transform}
[data-tilt] .pop{transform:translateZ(40px)}

.feature{padding:38px 32px;display:grid;gap:18px;align-content:start;background:linear-gradient(170deg,rgba(255,176,0,.06),rgba(10,8,5,.6));border-radius:4px}
.feature__icon{width:58px;height:58px;display:grid;place-items:center;border:1px solid var(--gold-soft);border-radius:50%;position:relative}
.feature__icon::after{content:'';position:absolute;inset:-7px;border-radius:50%;border:1px dashed var(--gold-faint);animation:rot 22s linear infinite}
.feature__icon svg{width:24px;height:24px;stroke:var(--amber);fill:none;stroke-width:1.4}
@keyframes rot{to{transform:rotate(360deg)}}
.feature p{color:var(--mist);font-size:15px}
.num{font-family:var(--f-hud);font-size:12px;letter-spacing:.3em;color:var(--gold)}

/* ---------- Split / showcase ---------- */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,6vw,100px);align-items:center}
.split--rev>:first-child{order:2}
@media (max-width:900px){.split{grid-template-columns:1fr}.split--rev>:first-child{order:0}}
.showcase{position:relative;border-radius:4px;overflow:hidden;aspect-ratio:4/3;background:#0b0805}
.showcase img{width:100%;height:100%;object-fit:cover}
.showcase--contain img{object-fit:contain;padding:6%}
.showcase .tag{position:absolute;left:20px;bottom:18px;z-index:3}
/* World gallery (game page): one fixed 4:5 frame — every image, big or small, wide or tall, is
   cropped to fill it the same way; arrows under the text step through, with a slide + scan wipe. */
.wgal{position:relative;aspect-ratio:4/5;align-self:center;border-radius:4px;overflow:hidden;background:#0b0805;outline:none}
.wgal:focus-visible{box-shadow:0 0 0 1px var(--amber)}
.wgal__track{position:absolute;inset:0}
.wgal__track img{position:absolute;inset:0;width:100%!important;height:100%!important;object-fit:cover!important;object-position:center 40%!important;padding:0!important;
  opacity:0;transform:translateX(6%) scale(1.04);transition:opacity .6s var(--ease),transform .9s var(--ease);will-change:opacity,transform}
.wgal__track img.back{transform:translateX(-6%) scale(1.04)}
.wgal__track img.on{opacity:1;transform:none}
.wgal__track img.whole{object-fit:contain!important;object-position:center!important}
.wgal__bg{position:absolute;inset:-30px;background-size:cover;background-position:center;filter:blur(22px) brightness(.62) saturate(1.15);opacity:0;transition:opacity .6s var(--ease)}
.wgal__bg.show{opacity:1}
/* thin glowing bracket on the right half of the frame: top (mid → corner), right side, bottom (corner → mid) */
.wgal__edges{position:absolute;inset:0;z-index:4;pointer-events:none}
.wgal__edges i{position:absolute;overflow:hidden}
.wgal__edges .t,.wgal__edges .b{left:50%;right:0;height:1.5px;background:linear-gradient(90deg,transparent,rgba(255,176,0,.55) 45%,rgba(255,190,70,.85));box-shadow:0 0 8px rgba(255,150,0,.45)}
.wgal__edges .t{top:0}.wgal__edges .b{bottom:0;background:linear-gradient(90deg,transparent,rgba(255,176,0,.55) 45%,rgba(255,190,70,.85))}
.wgal__edges .r{top:0;bottom:0;right:0;width:1.5px;background:rgba(255,190,70,.85);box-shadow:0 0 8px rgba(255,150,0,.45)}
.wgal__edges i::before{content:'';position:absolute;will-change:transform}
.wgal__edges .t::before,.wgal__edges .b::before{top:0;bottom:0;left:0;width:30%;background:linear-gradient(90deg,transparent,#fff3cf,transparent);transform:translateX(-110%)}
.wgal__edges .r::before{left:0;right:0;top:0;height:22%;background:linear-gradient(180deg,transparent,#fff3cf,transparent);transform:translateY(-110%)}
/* one soft spark travels mid → corner → down → corner → mid, then rests */
.wgal__edges .t::before{animation:wgT 7s linear infinite}
.wgal__edges .r::before{animation:wgR 7s linear infinite}
.wgal__edges .b::before{animation:wgB 7s linear infinite}
@keyframes wgT{0%{transform:translateX(-110%)}22%,100%{transform:translateX(340%)}}
@keyframes wgR{0%,18%{transform:translateY(-110%)}52%,100%{transform:translateY(460%)}}
@keyframes wgB{0%,48%{transform:translateX(340%)}70%,100%{transform:translateX(-110%)}}
@media (prefers-reduced-motion:reduce){.wgal__edges i::before{animation:none;opacity:0}}.wgal::before{content:'';position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(180deg,transparent 70%,rgba(5,4,3,.55))}
.wgal__count{position:absolute;right:16px;bottom:14px;z-index:3;font-size:11px;letter-spacing:.24em;color:var(--mist);background:rgba(5,4,3,.6);padding:6px 10px;backdrop-filter:blur(4px)}
.wgal__count b{color:var(--amber-hot);font-weight:600}
.wgal-nav{display:flex;align-items:center;gap:18px;margin-top:10px}
.wgal-nav__bar{flex:1;max-width:220px;height:2px;background:var(--gold-faint);position:relative;overflow:hidden}
.wgal-nav__bar i{position:absolute;left:0;top:0;bottom:0;width:20%;background:linear-gradient(90deg,var(--amber-deep),var(--amber-hot));box-shadow:0 0 10px var(--amber);transition:width .6s var(--ease)}
.wgal-btn{position:relative;width:76px;height:46px;display:grid;place-items:center;color:var(--amber);background:linear-gradient(135deg,rgba(40,26,8,.85),rgba(8,6,3,.9));border:1px solid var(--gold-soft);
  clip-path:polygon(12px 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%,0 12px);transition:background .25s,border-color .25s,color .25s,box-shadow .25s}
.wgal-btn svg{width:44px;height:22px;fill:none;stroke:currentColor;stroke-linecap:square;stroke-linejoin:miter}
.wgal-btn .a{stroke-width:2.2}.wgal-btn .l{stroke-width:1.4}.wgal-btn .t{stroke-width:1;opacity:.55;transition:transform .3s var(--ease),opacity .3s}
.wgal-btn:hover,.wgal-btn:focus-visible{color:#fff3cf;background:rgba(255,176,0,.18);border-color:var(--amber);box-shadow:0 0 22px rgba(255,170,0,.35);outline:none}
.wgal-btn:hover .t{opacity:1;transform:translateX(-4px)}
.wgal-btn--next:hover .t{transform:translateX(4px)}
.wgal-btn:active{transform:scale(.96)}
/* phones/tablets: text first, then the image with its arrows right under it */
@media (max-width:900px){
  .split:has(> .wgal){gap:24px}
  .split:has(> .wgal)>.grid{display:contents}
  .split:has(> .wgal)>.wgal{order:5;margin-top:8px}
  .split:has(> .wgal) .wgal-nav{order:6;margin-top:0}
}
@media (max-width:900px){.wgal{aspect-ratio:4/5;max-height:72vh;width:100%}.wgal-nav{justify-content:space-between}.wgal-nav__bar{max-width:none}}
@media (prefers-reduced-motion:reduce){.wgal__track img{transition:opacity .2s;transform:none!important}}

.stat-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1px;background:var(--gold-faint);border:1px solid var(--gold-faint)}
.stat{background:#070504;padding:34px 26px;display:grid;gap:8px}
.stat b{font-family:var(--f-display);font-weight:400;font-size:clamp(28px,3.6vw,48px);line-height:1}
.list-check{list-style:none;display:grid;gap:14px}
.list-check li{display:flex;gap:14px;align-items:flex-start;color:var(--mist)}
.list-check li::before{content:'';flex:0 0 8px;height:8px;margin-top:9px;transform:rotate(45deg);border:1px solid var(--amber);box-shadow:0 0 10px var(--amber)}

/* ---------- Marquee ---------- */
.marquee{overflow:hidden;border-block:1px solid var(--gold-faint);padding:26px 0;position:relative;background:rgba(0,0,0,.35)}
.marquee__track{display:flex;gap:60px;width:max-content;animation:marq 38s linear infinite}
.marquee span{font-family:var(--f-display);font-size:clamp(20px,2.6vw,34px);text-transform:uppercase;white-space:nowrap;color:transparent;-webkit-text-stroke:1px var(--gold-soft)}
.marquee span.fill{color:var(--ivory);-webkit-text-stroke:0}
.marquee em{font-style:normal;color:var(--amber);align-self:center;font-size:18px}
@keyframes marq{to{transform:translateX(-50%)}}

/* ---------- Tabs / chips ---------- */
.tabs{display:flex;flex-wrap:wrap;gap:10px}
.chip{padding:10px 20px;font-family:var(--f-hud);font-size:12px;letter-spacing:.24em;text-transform:uppercase;border:1px solid var(--gold-faint);color:var(--mist);transition:all .35s var(--ease)}
.chip:hover{border-color:var(--gold);color:var(--ivory)}
.chip.active{border-color:var(--amber);color:#0a0703;background:var(--amber)}

/* ---------- Stat bars ---------- */
.bars{display:grid;gap:16px}
.bar{display:grid;gap:8px}
.bar__top{display:flex;justify-content:space-between;font-family:var(--f-hud);font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--mist)}
.bar__track{height:3px;background:rgba(255,255,255,.07);position:relative;overflow:hidden}
.bar__fill{position:absolute;inset:0;right:auto;width:0;background:linear-gradient(90deg,var(--amber-deep),var(--amber-hot));box-shadow:0 0 12px var(--amber);transition:width 1.6s var(--ease)}

/* ---------- Arsenal viewer ---------- */
/* Arsenal: one fixed-size block for every weapon. The preview stage is a fixed height, the info row
   always holds a one-line name and a three-line description, and the buttons share the full height. */
.arsenal{display:grid;grid-template-columns:clamp(240px,24vw,320px) minmax(0,1fr);gap:clamp(20px,2.6vw,40px);align-items:stretch}
.arsenal__list{display:grid;gap:8px;grid-auto-rows:minmax(0,1fr);align-content:stretch;contain:size} /* the preview sets the height; the buttons share it */
.arsenal__item{display:flex;justify-content:space-between;align-items:center;padding:18px 22px;border:1px solid var(--gold-faint);text-align:left;transition:all .4s var(--ease);position:relative;overflow:hidden}
.arsenal__item span{font-family:var(--f-display);font-size:13px;letter-spacing:.14em;text-transform:uppercase}
.arsenal__item small{font-family:var(--f-hud);color:var(--dim);letter-spacing:.2em;font-size:10px}
.arsenal__item::before{content:'';position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--amber);transform:scaleY(0);transition:transform .5s var(--ease)}
.arsenal__item:hover{background:rgba(255,176,0,.05);border-color:var(--gold-soft)}
.arsenal__item.active{background:linear-gradient(90deg,rgba(255,176,0,.14),transparent);border-color:var(--gold)}
.arsenal__item.active::before{transform:scaleY(1)}
.arsenal__view{position:relative;border-radius:4px;overflow:hidden;background:
  radial-gradient(circle at 50% 55%,rgba(255,150,0,.22),transparent 55%),linear-gradient(180deg,#0d0905,#050302);display:grid;grid-template-rows:var(--ar-stage,clamp(300px,30vw,420px)) auto;perspective:1200px}
/* Tile wall behind the weapon: dark tiles with fine seams; amber light sweeps along a few tile edges
   (each <i> is one edge, x/y/length in tiles). Only a small comet moves (transform only, no repaints). */
.arsenal__grid{--c:84px;position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none;background-color:#07080b;
  background-image:
    radial-gradient(ellipse 60% 55% at 50% 55%,rgba(255,150,0,.16),transparent 70%),
    linear-gradient(rgba(150,165,190,.13) 1px,transparent 1px),linear-gradient(90deg,rgba(150,165,190,.13) 1px,transparent 1px),
    linear-gradient(rgba(150,165,190,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(150,165,190,.05) 1px,transparent 1px),
    linear-gradient(135deg,rgba(255,255,255,.025),rgba(0,0,0,.25));
  background-size:100% 100%,var(--c) var(--c),var(--c) var(--c),calc(var(--c) / 4) calc(var(--c) / 4),calc(var(--c) / 4) calc(var(--c) / 4),var(--c) var(--c);
  background-position:0 0}
.arsenal__grid::after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 85% 80% at 50% 50%,transparent 55%,rgba(3,3,4,.75))}
.arsenal__grid i{position:absolute;left:calc(var(--x) * var(--c));top:calc(var(--y) * var(--c));overflow:hidden;
  background:rgba(255,176,0,.22);box-shadow:0 0 6px rgba(255,150,0,.25)}
.arsenal__grid i.h{width:calc(var(--l) * var(--c));height:2px;margin-top:-1px}
.arsenal__grid i.v{height:calc(var(--l) * var(--c));width:2px;margin-left:-1px}
.arsenal__grid i::before{content:'';position:absolute;inset:0;will-change:transform;
  box-shadow:0 0 8px 1px rgba(255,170,0,.9),0 0 18px 3px rgba(255,140,0,.45)}
.arsenal__grid i.h::before{width:45%;background:linear-gradient(90deg,transparent,#ffb000 35%,#fff3cf 50%,#ffb000 65%,transparent);transform:translateX(-100%);animation:edgeSweepX 4.2s var(--d,0s) linear infinite}
.arsenal__grid i.v::before{height:45%;background:linear-gradient(180deg,transparent,#ffb000 35%,#fff3cf 50%,#ffb000 65%,transparent);transform:translateY(-100%);animation:edgeSweepY 4.2s var(--d,0s) linear infinite}
@keyframes edgeSweepX{0%{transform:translateX(-100%)}55%,100%{transform:translateX(225%)}}
@keyframes edgeSweepY{0%{transform:translateY(-100%)}55%,100%{transform:translateY(225%)}}
@media (max-width:980px){.arsenal__grid{--c:56px}}
@media (prefers-reduced-motion:reduce){.arsenal__grid i::before{animation:none;opacity:0}.arsenal__grid i{background:rgba(255,176,0,.6)}}
.arsenal__img{position:relative;z-index:2;min-height:0}
/* every weapon is fitted into the same box, whatever its image proportions */
.arsenal__img img{position:absolute;top:var(--ar-pady,8%);left:var(--ar-padx,7%);width:calc(100% - 2 * var(--ar-padx,7%));height:calc(100% - 2 * var(--ar-pady,8%));max-width:none;object-fit:contain;
  filter:drop-shadow(0 30px 40px rgba(0,0,0,.8)) drop-shadow(0 0 30px rgba(255,150,0,.2));
  animation:float 6s ease-in-out infinite;transition:opacity .5s,transform .8s var(--ease)}
.arsenal__img img.swap{opacity:0;transform:translateX(40px) rotateY(-30deg)}
@keyframes float{50%{translate:0 -14px}}
.arsenal__info{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(20px,2.4vw,34px);align-items:center;padding:clamp(20px,2vw,28px) clamp(20px,2.6vw,34px);border-top:1px solid var(--gold-faint);background:rgba(5,4,3,.6);backdrop-filter:blur(10px)}
.arsenal__info [data-a-name]{font-size:clamp(20px,2.1vw,34px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.arsenal__info [data-a-class]{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.arsenal__info [data-a-desc]{--lh:1.6;--lines:3;line-height:var(--lh);font-size:clamp(13px,1.05vw,15.5px);height:calc(var(--lines) * 1em * var(--lh));margin:0;
  display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:var(--lines);overflow:hidden}
/* narrow desktops: the class label drops under the name instead of squeezing it */
@media (min-width:981px) and (max-width:1240px){.arsenal__item{flex-direction:column;align-items:flex-start;justify-content:center;gap:4px;padding:10px 18px}}
/* Tablets and phones: the buttons stay beside the preview and stats, everything scaled down */
@media (max-width:980px){
  .arsenal{grid-template-columns:minmax(0,34%) minmax(0,1fr);gap:10px}
  .arsenal__list{grid-template-columns:1fr;gap:6px}
  .arsenal__item{padding:6px 12px;gap:6px;min-height:0}
  .arsenal__item span{font-size:clamp(10px,1.7vw,13px);letter-spacing:.08em;line-height:1.3}
  .arsenal__item small{font-size:clamp(8px,1.2vw,10px);letter-spacing:.14em}
  .arsenal__view{--ar-stage:clamp(150px,30vw,280px);--ar-padx:6%;--ar-pady:6%}
  .arsenal__info{grid-template-columns:1fr;gap:12px;padding:14px 16px}
  .arsenal__info>.grid{gap:6px!important}
  .arsenal__info .hud{font-size:9px;letter-spacing:.18em}
  .arsenal__info [data-a-name]{font-size:clamp(14px,2.6vw,22px)}
  .arsenal__info [data-a-desc]{font-size:clamp(11.5px,1.7vw,14px);--lh:1.5}
  .arsenal__info .bars{gap:8px}.arsenal__info .bar{gap:5px}
  .arsenal__info .bar__top{font-size:9px;letter-spacing:.14em}
}
@media (max-width:600px){
  .arsenal{grid-template-columns:minmax(0,31%) minmax(0,1fr);gap:8px}
  .arsenal__list{gap:5px}
  .arsenal__item{padding:4px 8px;justify-content:flex-start}
  .arsenal__item small{display:none}
  .arsenal__item span{font-size:9.5px;letter-spacing:.06em;overflow-wrap:anywhere}
  .arsenal__item::before{width:2px}
  .arsenal__info{padding:12px}
  .arsenal__info [data-a-desc]{font-size:11px;--lines:4}
  .arsenal__info .bar__top{font-size:8.5px;letter-spacing:.1em}
}

/* ---------- 3D box ---------- */
.box3d{width:260px;height:370px;position:relative;transform-style:preserve-3d;animation:boxspin 16s linear infinite;margin:auto}
.box3d:hover{animation-play-state:paused}
.box3d__f{position:absolute;inset:0;backface-visibility:hidden;background-size:cover;background-position:center;box-shadow:0 0 0 1px var(--gold-soft) inset}
.box3d__f--front{transform:translateZ(22px)}
.box3d__f--back{transform:rotateY(180deg) translateZ(22px);background:linear-gradient(160deg,#1a1207,#060403)}
.box3d__f--l,.box3d__f--r{width:44px;left:108px;background:linear-gradient(180deg,#1d1409,#0a0704);display:grid;place-items:center}
.box3d__f--l{transform:rotateY(-90deg) translateZ(130px)}
.box3d__f--r{transform:rotateY(90deg) translateZ(130px)}
.box3d__f--l span,.box3d__f--r span{writing-mode:vertical-rl;font-family:var(--f-display);font-size:13px;letter-spacing:.35em;color:var(--gold)}
@keyframes boxspin{from{transform:rotateX(-8deg) rotateY(0)}to{transform:rotateX(-8deg) rotateY(360deg)}}
.box-stage{perspective:1100px;padding:40px 0;position:relative}
.box-stage::after{content:'';position:absolute;left:50%;bottom:0;width:260px;height:40px;transform:translateX(-50%);border-radius:50%;background:radial-gradient(rgba(255,150,0,.45),transparent 70%);filter:blur(10px)}

/* ---------- Character carousel (3D ring) ---------- */
.ring-stage{position:relative;height:640px;perspective:1800px;overflow:hidden}
.ring{position:absolute;left:50%;top:44%;width:0;height:0;transform-style:preserve-3d;transition:transform 1.2s var(--ease)}
.ring__item{position:absolute;width:300px;height:460px;left:-150px;top:-230px;transform-style:preserve-3d;transition:filter .8s,opacity .8s;cursor:pointer}
.ring__item .card{height:100%;display:flex;flex-direction:column}
.ring__item .card__media{flex:1;aspect-ratio:auto;background:radial-gradient(circle at 50% 70%,rgba(255,150,0,.3),transparent 60%),#0b0805}
.ring__item .card__media img{object-fit:contain;object-position:bottom}
.ring__item:not(.front){filter:brightness(.4) saturate(.6)}
.ring-ctrl{position:absolute;left:50%;bottom:20px;transform:translateX(-50%);display:flex;gap:14px;z-index:5;align-items:center}
.icon-btn{width:52px;height:52px;display:grid;place-items:center;border:1px solid var(--gold-soft);border-radius:50%;transition:all .35s var(--ease)}
.icon-btn:hover{border-color:var(--amber);background:rgba(255,176,0,.1);box-shadow:0 0 24px rgba(255,176,0,.3)}
.icon-btn svg{width:18px;height:18px;stroke:var(--ivory);fill:none;stroke-width:1.5}
@media (max-width:680px){.ring-stage{height:560px}.ring__item{width:230px;height:380px;left:-115px;top:-190px}}

/* ---------- Character dossier ---------- */
.dossier{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(30px,5vw,80px);align-items:center}
.dossier__art{position:relative;min-height:600px;display:grid;place-items:end center}
.dossier__art::before{content:'';position:absolute;inset:10% 5% 0;border-radius:50% 50% 0 0;background:radial-gradient(circle at 50% 80%,rgba(255,150,0,.35),transparent 60%)}
.dossier__art img{position:relative;max-height:640px;object-fit:contain;filter:drop-shadow(0 40px 60px rgba(0,0,0,.8))}
.dossier__art--plain::before,.lineup--plain::before{display:none} /* home Dr. Priya + game squad lineup: on the page background, no glow panel */
.dossier__ring{position:absolute;left:50%;bottom:0;width:80%;aspect-ratio:1;transform:translateX(-50%) rotateX(75deg);border:1px solid var(--gold-soft);border-radius:50%;animation:rot 30s linear infinite}
@media (max-width:900px){.dossier{grid-template-columns:1fr}.dossier__art{min-height:440px}.dossier__art img{max-height:460px}}

/* ---------- Timeline ---------- */
.timeline{position:relative;display:grid;gap:60px;padding-left:60px}
.timeline::before{content:'';position:absolute;left:14px;top:0;bottom:0;width:1px;background:linear-gradient(var(--amber),var(--gold-faint) 60%,transparent)}
.tl{position:relative;display:grid;gap:10px}
.tl::before{content:'';position:absolute;left:-52px;top:6px;width:13px;height:13px;transform:rotate(45deg);border:1px solid var(--amber);background:#050403;box-shadow:0 0 16px var(--amber)}
.tl .hud{color:var(--amber)}
.tl p{color:var(--mist);max-width:60ch}

/* ---------- Gallery ---------- */
.gallery{columns:3 320px;column-gap:18px}
.gallery__item{break-inside:avoid;margin-bottom:18px;position:relative;overflow:hidden;border-radius:3px;cursor:zoom-in;transition:opacity .5s,transform .5s var(--ease)}
.gallery__item img{width:100%;transition:transform 1.2s var(--ease),filter .6s}
.gallery__item:hover img{transform:scale(1.06);filter:brightness(1.1)}
.gallery__item figcaption{position:absolute;left:0;right:0;bottom:0;padding:40px 20px 16px;background:linear-gradient(0deg,rgba(0,0,0,.9),transparent);
  display:flex;justify-content:space-between;align-items:end;transform:translateY(100%);transition:transform .6s var(--ease)}
.gallery__item:hover figcaption{transform:none}
.gallery__item.hide{display:none}
.lightbox{position:fixed;inset:0;z-index:500;background:rgba(3,2,1,.94);backdrop-filter:blur(16px);display:grid;place-items:center;padding:5vw;opacity:0;visibility:hidden;transition:all .5s var(--ease)}
.lightbox.open{opacity:1;visibility:visible}
.lightbox img{max-height:84vh;max-width:90vw;object-fit:contain;box-shadow:0 0 0 1px var(--gold-soft),0 40px 120px rgba(255,140,0,.2);transform:scale(.94);transition:transform .6s var(--ease)}
.lightbox.open img{transform:none}
.lightbox__close{position:absolute;top:24px;right:24px}
.lightbox__cap{position:absolute;bottom:24px;left:0;right:0;text-align:center}

/* Video / trailer */
.trailer{position:relative;aspect-ratio:21/9;border-radius:4px;overflow:hidden;display:grid;place-items:center;cursor:pointer}
.trailer img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1.6s var(--ease)}
.trailer:hover img{transform:scale(1.04)}
.trailer::after{content:'';position:absolute;inset:0;background:radial-gradient(circle,transparent 20%,rgba(0,0,0,.7))}
.play{position:relative;z-index:2;width:118px;height:118px;border-radius:50%;display:grid;place-items:center;border:1px solid var(--amber);background:rgba(255,176,0,.1);backdrop-filter:blur(6px)}
.play::before,.play::after{content:'';position:absolute;inset:-14px;border-radius:50%;border:1px solid var(--gold-soft);animation:pulse 2.6s var(--ease) infinite}
.play::after{animation-delay:1.3s}
.play svg{width:30px;fill:var(--amber);margin-left:6px}
@keyframes pulse{from{transform:scale(.85);opacity:1}to{transform:scale(1.5);opacity:0}}
@media (max-width:680px){.trailer{aspect-ratio:16/10}.play{width:84px;height:84px}}

/* ---------- News ---------- */
.news-feature{display:grid;grid-template-columns:1.4fr 1fr;min-height:520px;border-radius:4px;overflow:hidden}
.news-feature__img{position:relative;overflow:hidden}
.news-feature__img img{width:100%;height:100%;object-fit:cover;transition:transform 1.6s var(--ease)}
.news-feature:hover .news-feature__img img{transform:scale(1.05)}
.news-feature__body{padding:clamp(28px,4vw,60px);display:grid;gap:20px;align-content:center;background:linear-gradient(160deg,rgba(255,176,0,.08),rgba(8,6,3,.95))}
@media (max-width:900px){.news-feature{grid-template-columns:1fr}.news-feature__img{aspect-ratio:16/9}}
.meta{display:flex;gap:18px;flex-wrap:wrap;align-items:center}
/* News cards: one fixed order on every card — category, date, title, excerpt, author, Read — and equal
   heights in a row with the author + Read lined up at the bottom. */
.card--post{display:flex;flex-direction:column}
.card--post .card__body{flex:1;display:flex;flex-direction:column;align-items:flex-start;gap:12px}
.card--post .meta{flex-direction:column;align-items:flex-start;gap:14px;margin-bottom:4px}
.card--post .card__by{margin-top:auto;padding-top:6px}
.card--post .read{margin-top:2px}
.card__foot{align-self:stretch;display:flex;justify-content:space-between;align-items:center;gap:12px}
.post-views{display:inline-flex;gap:7px;align-items:center;white-space:nowrap}
.post-views svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.6}
.news-feature .card__foot{margin-top:4px}
.pill{padding:5px 12px;border:1px solid var(--amber);color:var(--amber);font-family:var(--f-hud);font-size:10.5px;letter-spacing:.24em;text-transform:uppercase}
.read{display:inline-flex;gap:10px;align-items:center;font-family:var(--f-hud);letter-spacing:.24em;font-size:12px;text-transform:uppercase;color:var(--amber)}
.read svg{width:14px;stroke:currentColor;fill:none;stroke-width:1.6;transition:transform .4s var(--ease)}
.card:hover .read svg,.news-feature:hover .read svg{transform:translateX(6px)}

/* ---------- Store ---------- */
.product .card__media{aspect-ratio:1/1;background:radial-gradient(circle at 50% 60%,rgba(255,150,0,.22),transparent 60%),linear-gradient(180deg,#120c06,#060403)}
.product .card__media::after{display:none}
.product .card__media img{object-fit:contain;padding:9%;filter:drop-shadow(0 24px 30px rgba(0,0,0,.7))}
.product .card__media.cover img{object-fit:cover;padding:0}
.price{font-family:var(--f-display);font-size:22px}
.price s{font-size:14px;color:var(--dim);margin-left:10px}
.product__foot{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:6px}
.badge{position:absolute;top:16px;left:16px;z-index:5;padding:6px 12px;background:var(--amber);color:#000;font-family:var(--f-hud);font-weight:600;font-size:10px;letter-spacing:.24em;text-transform:uppercase}
.edition{display:grid;gap:22px;padding:40px 34px;border-radius:4px;background:linear-gradient(170deg,rgba(255,176,0,.07),rgba(8,6,3,.9))}
.edition--hot{background:linear-gradient(170deg,rgba(255,176,0,.2),rgba(20,12,4,.95))}
.cart-btn{position:relative}
.cart-count{position:absolute;top:-6px;right:-6px;min-width:20px;height:20px;border-radius:10px;background:var(--amber);color:#000;font-size:11px;font-weight:700;display:grid;place-items:center;padding:0 5px;transform:scale(0);transition:transform .4s var(--ease)}
.cart-count.show{transform:scale(1)}
.drawer{position:fixed;top:0;right:0;bottom:0;width:min(440px,100vw);z-index:400;background:linear-gradient(180deg,#0e0a05,#050302);border-left:1px solid var(--gold-soft);
  transform:translateX(100%);transition:transform .7s var(--ease);display:grid;grid-template-rows:auto 1fr auto}
.drawer.open{transform:none}
.drawer__head,.drawer__foot{padding:26px 28px;border-bottom:1px solid var(--gold-faint);display:flex;justify-content:space-between;align-items:center}
.drawer__foot{border-top:1px solid var(--gold-faint);border-bottom:0;display:grid;gap:18px}
.drawer__items{overflow:auto;padding:10px 28px}
.citem{display:grid;grid-template-columns:70px 1fr auto;gap:16px;align-items:center;padding:16px 0;border-bottom:1px solid var(--gold-faint)}
.citem img{width:70px;height:70px;object-fit:contain;background:#120c06}
.scrim{position:fixed;inset:0;z-index:399;background:rgba(0,0,0,.6);opacity:0;visibility:hidden;transition:all .5s}
.scrim.open{opacity:1;visibility:visible}
.toast{position:fixed;left:50%;bottom:30px;z-index:600;transform:translate(-50%,140%);padding:16px 26px;background:#0e0a05;border:1px solid var(--amber);font-family:var(--f-hud);letter-spacing:.2em;font-size:12px;text-transform:uppercase;transition:transform .6s var(--ease)}
.toast.show{transform:translate(-50%,0)}

/* ---------- Community ---------- */
.social{display:grid;gap:16px;padding:34px 30px;border-radius:4px;background:rgba(10,8,5,.7);transition:transform .5s var(--ease),background .5s}
.social:hover{transform:translateY(-6px);background:rgba(255,176,0,.07)}
.social svg{width:34px;height:34px;fill:var(--amber)}
.event{display:grid;grid-template-columns:110px 1fr auto;gap:30px;align-items:center;padding:30px 0;border-bottom:1px solid var(--gold-faint);transition:padding .5s var(--ease)}
.event:hover{padding-left:16px}
/* Mobile-menu hover, shared: amber bar grows on the left edge, amber wash fades right, text brightens.
   Used by the desktop nav links, community event rows and wishlist rows (Games + Merch). */
.event,.wl-row{position:relative;transition:padding .5s var(--ease),background .3s,color .3s}
.event::after,.wl-row::after{content:'';position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--amber);transform:scaleY(0);transition:transform .3s var(--ease);pointer-events:none}
.event:hover,.event:focus-within,.wl-row:hover,.wl-row:focus-within{background:linear-gradient(90deg,rgba(255,176,0,.12),transparent 80%)}
.event:hover::after,.event:focus-within::after,.wl-row:hover::after,.wl-row:focus-within::after{transform:scaleY(1)}
.event:hover h3 a{color:#fff}
.event:hover .event__date b{color:var(--amber-hot)}
.wl-row{padding-left:0}
.wl-row:hover{padding-left:12px}
.wl-row:hover .h-sm{color:#fff}
@media (hover:hover){
  .nav__links a::after{content:'';position:absolute;left:4px;top:8px;bottom:8px;width:2px;background:var(--amber);transform:scaleY(0);transition:transform .3s var(--ease)}
  .nav__links a{transition:color .3s,background .3s}
  .nav__links a:hover,.nav__links a:focus-visible{background:linear-gradient(90deg,rgba(255,176,0,.12),transparent 85%);color:#fff;outline:none}
  .nav__links a:hover::after,.nav__links a:focus-visible::after{transform:scaleY(1)}
}
/* About "The team behind": the side line sits flush with the right edge of the cards */
.sec-head__end{justify-self:end;text-align:right;margin-left:auto}
.event__date{display:grid;text-align:center;border:1px solid var(--gold-soft);padding:14px 0}
.event__date b{font-family:var(--f-display);font-size:30px;font-weight:400;line-height:1;color:var(--amber)}
@media (max-width:680px){.event{grid-template-columns:80px 1fr}.event .btn{grid-column:1/-1;justify-self:start}}

/* ---------- Forms ---------- */
.field{display:grid;gap:8px}
.field label{font-family:var(--f-hud);font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:var(--gold)}
.input{width:100%;padding:16px 18px;background:rgba(255,255,255,.02);border:1px solid var(--gold-faint);color:var(--ivory);font:inherit;outline:none;transition:border-color .3s,box-shadow .3s}
.input:focus{border-color:var(--amber);box-shadow:0 0 0 4px rgba(255,176,0,.08)}
textarea.input{min-height:140px;resize:vertical}
.inline-form{display:flex;gap:0;max-width:560px;width:100%}
.inline-form .input{flex:1}
@media (max-width:560px){.inline-form{flex-direction:column;gap:12px}}

/* ---------- CTA band ---------- */
.cta-band{position:relative;overflow:hidden;border-radius:4px;padding:clamp(50px,8vw,110px) clamp(24px,6vw,90px);display:grid;gap:28px;justify-items:start;
  background-size:cover;background-position:center;isolation:isolate}
.cta-band::after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(100deg,rgba(5,4,3,.96) 30%,rgba(5,4,3,.4))}
.cta-band--center{justify-items:center;text-align:center}
.cta-band{background-position:center 18%}
.cta-band--center::after{background:radial-gradient(circle at 50% 50%,rgba(255,150,0,.22),rgba(5,4,3,.92) 60%)}

/* ---------- Footer ---------- */
.footer{position:relative;padding:100px 0 40px;margin-top:60px;background:linear-gradient(180deg,transparent,rgba(255,150,0,.05))}
.footer__top{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:50px;padding-bottom:60px}
.footer h4{font-family:var(--f-hud);font-weight:500;font-size:12px;letter-spacing:.34em;text-transform:uppercase;color:var(--gold);margin-bottom:22px}
.footer ul{list-style:none;display:grid;gap:12px}
.footer ul a{color:var(--mist);transition:color .3s,padding .4s var(--ease)}
.footer ul a:hover{color:var(--amber);padding-left:6px}
.footer__bottom{display:flex;justify-content:space-between;flex-wrap:wrap;gap:20px;padding-top:30px;font-size:13px;color:var(--dim)}
.footer__mega{font-family:var(--f-display);font-size:clamp(40px,11vw,170px);line-height:.9;text-transform:uppercase;text-align:center;
  color:transparent;-webkit-text-stroke:1px rgba(214,168,78,.22);padding:40px 0 20px;user-select:none;letter-spacing:.02em}
.socials{display:flex;gap:10px;margin-top:24px}
.socials a{width:42px;height:42px;display:grid;place-items:center;border:1px solid var(--gold-faint);border-radius:50%;transition:all .35s var(--ease)}
.socials a:hover{border-color:var(--amber);background:rgba(255,176,0,.1)}
.socials svg{width:16px;height:16px;fill:var(--ivory)}
@media (max-width:900px){.footer__top{grid-template-columns:1fr 1fr}.footer__top>:first-child{grid-column:1/-1}}

/* ---------- Utilities ---------- */
.center{text-align:center}
.mt-s{margin-top:18px}.mt-m{margin-top:36px}.mt-l{margin-top:64px}
.flex{display:flex;gap:16px;flex-wrap:wrap;align-items:center}
.between{justify-content:space-between}
.glow-orb{position:absolute;width:600px;height:600px;border-radius:50%;background:radial-gradient(rgba(255,150,0,.18),transparent 65%);filter:blur(20px);pointer-events:none;z-index:-1}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
select.input{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--amber) 50%),linear-gradient(-45deg,transparent 50%,var(--amber) 50%);background-position:calc(100% - 22px) 50%,calc(100% - 16px) 50%;background-size:6px 6px;background-repeat:no-repeat}
select.input option{background:#0e0a05;color:var(--ivory)}

main{overflow-x:clip}
.section,.hero{overflow-x:clip}
@media (max-width:1180px){.nav .nav__cta{display:none}}
@media (max-width:980px){.stage{opacity:.28}.hero__canvas{opacity:.7}}
@media (max-width:680px){.scroll-hint{display:none}.eyebrow{letter-spacing:.32em}.hero__meta{gap:22px}}
.stage{transform-style:flat}.stage .layer{max-width:none}
/* Home hero brand lockup */
.hero-brand{display:flex;align-items:center;gap:clamp(12px,2vw,28px);margin:0;opacity:0;transform:translateY(30px) scale(.96);animation:brandIn 1.6s var(--ease) .3s forwards}
.hero-brand__emblem{width:clamp(110px,13vw,220px);flex-shrink:0;filter:drop-shadow(0 0 30px rgba(255,140,0,.45)) drop-shadow(0 20px 30px rgba(0,0,0,.8));animation:emblemGlow 4s ease-in-out infinite}
.hero-brand__title{width:clamp(220px,32vw,560px);filter:drop-shadow(0 10px 30px rgba(0,0,0,.9)) drop-shadow(0 0 22px rgba(255,140,0,.25))}
@keyframes brandIn{to{opacity:1;transform:none}}
@keyframes emblemGlow{50%{filter:drop-shadow(0 0 55px rgba(255,160,0,.75)) drop-shadow(0 20px 30px rgba(0,0,0,.8));transform:scale(1.03)}}
@media (max-width:680px){.hero-brand{flex-direction:column;align-items:flex-start}.hero-brand__title{width:min(100%,380px)}}

/* ===== Full-image framing: never crop artwork inside boxes ===== */
.card__media,.showcase,.trailer,.news-feature__img{background:#070504}
.card__media img,.showcase img,.trailer img,.news-feature__img img,.product .card__media.cover img{object-fit:contain!important;object-position:center!important;padding:0}
.fitbg{position:relative;isolation:isolate}
.fitbg::before{content:'';position:absolute;inset:-30px;z-index:-1;background:var(--fit) center/cover no-repeat;filter:blur(26px) brightness(.45) saturate(1.2);transform:scale(1.1)}
.card__media>img,.trailer>img,.news-feature__img>img{position:relative;z-index:0}
.trailer>img{position:absolute}
.showcase{aspect-ratio:auto}
.showcase img{height:auto}
.showcase--contain img{padding:6%}
.product .card__media img{padding:9%}
.product .card__media.cover img{padding:4%}
.card:hover .card__media img{transform:scale(1.03)}
.box3d__f--l{left:108px}
.split .hero__title{font-size:clamp(32px,4.6vw,72px)}.split .hero__content{min-width:0}
.edition{display:flex;flex-direction:column;gap:22px}.edition>.btn{margin-top:auto;justify-content:center}.edition>img{height:220px;width:100%;object-fit:contain}
.edition>img{margin:0 auto!important}
.event__date{padding:14px 6px}.event__date b{white-space:nowrap;font-size:clamp(22px,2.2vw,30px)}

/* ===== Neon triangle cursor (mouse/trackpad only) =====
   Plain CSS cursor images: no script, never lags the pointer. Hotspot is the triangle's tip (7,6).
   Links and buttons get the brighter "hot" version; text fields keep the text caret. */
.cursor,.cursor-dot{display:none!important}
@media (hover:hover) and (pointer:fine){
  html{cursor:url(../img/cursor-neon.png) 7 6,auto;cursor:-webkit-image-set(url(../img/cursor-neon.png) 1x,url(../img/cursor-neon@2x.png) 2x) 7 6,auto;cursor:image-set(url(../img/cursor-neon.png) 1x,url(../img/cursor-neon@2x.png) 2x) 7 6,auto}
  a,button,[role=button],[role=tab],select,summary,label[for],.chip,[data-yt],[data-tilt] a,.trailer,.gallery__item,.ring__item,.lb-nav,
  .cr-disc__card .read,.cr-filters .chip,.cr-job__head,.cr-copy,.cr-trait .read,.cr-join-card .read,.cr-modal__close,.cr-file,.cr-file::file-selector-button,.wl-check,.wl-sort .input{
    cursor:url(../img/cursor-neon-hot.png) 7 6,pointer!important;cursor:-webkit-image-set(url(../img/cursor-neon-hot.png) 1x,url(../img/cursor-neon-hot@2x.png) 2x) 7 6,pointer!important;cursor:image-set(url(../img/cursor-neon-hot.png) 1x,url(../img/cursor-neon-hot@2x.png) 2x) 7 6,pointer!important}
  input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]):not([type=submit]):not([type=button]),textarea,[contenteditable=true]{cursor:text!important}
  :disabled,[aria-disabled=true]{cursor:not-allowed!important}
}
.event__date{min-width:0;overflow:hidden}
.event__date b.range{font-size:18px;letter-spacing:-.02em}
@media (max-width:680px){.event__date b.range{font-size:14px}}

/* ===== Sonar pulse behind brand emblem (1.8s wave + 5s pause) ===== */
.brand{position:relative;isolation:isolate}
.brand img{position:relative;z-index:1}
.brand::before,.brand::after{content:'';position:absolute;left:22px;top:50%;width:44px;height:44px;margin:-22px 0 0 -22px;border-radius:50%;
  border:1.5px solid var(--amber);box-shadow:0 0 12px rgba(255,170,0,.6),inset 0 0 10px rgba(255,170,0,.35);
  opacity:0;transform:scale(.6);z-index:0;pointer-events:none;animation:sonar 6.8s cubic-bezier(.2,.6,.3,1) infinite}
.brand::after{animation-delay:.35s;border-color:var(--gold);border-width:1px}
@keyframes sonar{
  0%{opacity:0;transform:scale(.6)}
  3%{opacity:.95}
  26%{opacity:0;transform:scale(3.2)}
  100%{opacity:0;transform:scale(3.2)}
}
.footer .brand::before,.footer .brand::after{animation-delay:3.4s}
.footer .brand::after{animation-delay:3.75s}
@media (prefers-reduced-motion:reduce){.brand::before,.brand::after{display:none}}

/* ===== Character dossier slider ===== */
.dslider{display:grid;gap:28px}
.dslider__bar{display:flex;justify-content:space-between;align-items:center;gap:20px;padding-bottom:18px;border-bottom:1px solid var(--gold-faint)}
.dslider__nav{display:flex;align-items:center;gap:14px}
.dslider__count{font-variant-numeric:tabular-nums;margin-right:8px}
.dslider__count b{color:var(--amber);font-weight:600}
.tri-btn{width:56px;height:56px;display:grid;place-items:center;border:1px solid var(--gold-soft);background:rgba(255,176,0,.04);
  clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px);transition:background .35s var(--ease),border-color .35s,transform .35s var(--ease)}
.tri-btn svg{width:22px;height:22px;fill:none;stroke:var(--amber);stroke-width:1.8;stroke-linejoin:round;transition:fill .3s,transform .35s var(--ease);filter:drop-shadow(0 0 6px rgba(255,170,0,.5))}
.tri-btn:hover{background:rgba(255,176,0,.12);border-color:var(--amber)}
.tri-btn:hover svg{fill:rgba(255,176,0,.35)}
.tri-btn[data-dprev]:hover svg{transform:translateX(-3px)}.tri-btn[data-dnext]:hover svg{transform:translateX(3px)}
.tri-btn:active{transform:scale(.94)}
.tri-btn:focus-visible,.ddot:focus-visible{outline:1px solid var(--amber);outline-offset:3px}
.dslider__stage{display:grid}
.dslide{grid-area:1/1;display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(30px,5vw,80px);align-items:center;visibility:hidden;pointer-events:none}
.dslide.active{visibility:visible;pointer-events:auto}
.dslide__text{display:grid;gap:26px;opacity:0;transform:translateX(-40px);transition:opacity .6s var(--ease),transform .8s var(--ease)}
.dslide .dossier__art{opacity:0;transform:translateX(60px) scale(.96);transition:opacity .7s var(--ease),transform .9s var(--ease)}
.dslide.active .dslide__text{opacity:1;transform:none;transition-delay:.12s}
.dslide.active .dossier__art{opacity:1;transform:none}
.dslide.leaving .dslide__text{opacity:0;transform:translateX(40px);transition-duration:.35s}
.dslide.leaving .dossier__art{opacity:0;transform:translateX(-60px) scale(.96);transition-duration:.4s}
.dslide.rev .dslide__text{transform:translateX(40px)}.dslide.rev .dossier__art{transform:translateX(-60px) scale(.96)}
.dslide.active.rev .dslide__text,.dslide.active.rev .dossier__art{transform:none}
.dslide--threat .dossier__art::before{background:radial-gradient(circle at 50% 80%,rgba(255,80,20,.32),transparent 60%)}
.dslide--threat .bar__fill{background:linear-gradient(90deg,#b8320f,#ff7a3d);box-shadow:0 0 12px rgba(255,90,30,.7)}
.dslider__dots{display:flex;justify-content:center;gap:10px}
.ddot{width:28px;height:3px;background:rgba(255,255,255,.15);transition:background .3s,width .4s var(--ease)}
.ddot.active{background:var(--amber);width:52px;box-shadow:0 0 10px var(--amber)}
.ddot:hover{background:var(--gold)}
@media (max-width:900px){.dslide{grid-template-columns:1fr}.dslide .dossier__art{order:-1}}
@media (max-width:560px){.tri-btn{width:46px;height:46px}.dslider__bar>.hud{display:none}.dslider__bar{justify-content:flex-end}}

/* ===== Responsive polish: phones, Android, iPad ===== */
/* 3-up rows: keep 3 columns on tablets, avoid 2+1 orphans */
@media (max-width:1024px){.g3{grid-template-columns:repeat(3,1fr)}}
@media (max-width:760px){.g3{grid-template-columns:repeat(2,1fr)}.g3>:last-child:nth-child(odd){grid-column:1/-1}}
@media (max-width:600px){.g3{grid-template-columns:1fr}.g3>:last-child:nth-child(odd){grid-column:auto}}
@media (min-width:681px) and (max-width:1024px){
  .edition{padding:28px 20px;gap:18px}.edition .h-md{font-size:22px}.edition>img{height:170px}
  .card__body{padding:20px 18px 22px}
  .feature{padding:28px 22px}
  .hero__content{max-width:640px}
}
/* Arsenal selector */
/* Stat tiles */
@media (max-width:600px){.stat{padding:22px 14px}.stat b{font-size:clamp(22px,7vw,30px)}.stat-row{grid-template-columns:repeat(2,1fr)}.stat-row[style*="repeat(3"]{grid-template-columns:repeat(3,1fr)!important}.stat-row[style*="repeat(3"] b{font-size:20px!important}.stat .hud{font-size:9.5px;letter-spacing:.16em}}
/* Typography and spacing on phones */
@media (max-width:600px){
  :root{--nav-h:72px}
  .section{padding:72px 0}.section--tight{padding:48px 0}
  .sec-head{margin-bottom:36px;gap:16px}
  .h-lg{font-size:clamp(26px,8vw,40px)}
  .hero{padding-bottom:60px}.hero__content{gap:20px}
  .hero__actions{gap:12px}.hero__actions .btn{flex:1 1 auto;justify-content:center}
  .hero__meta{gap:18px 26px}
  .btn{padding:14px 22px;letter-spacing:.22em}
  .edition{padding:28px 22px}
  .cta-band{padding:44px 22px}.cta-band .btn{align-self:stretch;justify-content:center}
  .inline-form .btn{justify-content:center}
  .tabs{gap:8px}.chip{padding:9px 14px;font-size:11px;letter-spacing:.18em}
  .flex.between{gap:22px}
  .timeline{padding-left:44px}.tl::before{left:-37px}.timeline::before{left:12px}
  .footer{padding-top:64px}.footer__top{gap:36px}
  .dossier__art{min-height:380px}.dossier__art img{max-height:400px}
  .event{gap:18px}
  .news-feature__body{gap:16px}
  .product__foot{flex-wrap:wrap}
}
@media (max-width:380px){.hero-brand__emblem{width:96px}.brand__txt{font-size:10.5px}.brand img{width:38px}}
/* Touch devices: show hover-only info */
@media (hover:none){.gallery__item figcaption{transform:none}.card__glare{display:none}}
/* Tablet landscape nav fit */
@media (min-width:981px) and (max-width:1180px){.nav__links a{padding:10px 9px;font-size:11.5px;letter-spacing:.16em}.brand__txt{font-size:11px}}
/* Drawer / lightbox on phones */
@media (max-width:600px){.drawer__head,.drawer__foot{padding:20px}.drawer__items{padding:6px 20px}.lightbox{padding:16px}.lightbox img{max-width:100%;max-height:78vh}}
/* Ring carousel sizing */
@media (max-width:420px){.ring-stage{height:520px}.ring__item{width:210px;height:340px;left:-105px;top:-170px}}
/* iPad landscape / small laptop: keep hero text clear of the art */
@media (min-width:981px) and (max-width:1280px){
  .hero .hero__content{max-width:min(50%,560px)}
  .stage{width:52%}
  .hero-brand__title{width:clamp(220px,28vw,420px)}
}
/* Edition badge sits in flow on tablets/phones so it never covers the label */
@media (max-width:1024px){.edition .badge{position:static;order:-1;align-self:flex-start;margin-bottom:-6px}}
/* Toast on phones: top of screen, never over buttons */
@media (max-width:600px){.toast{bottom:auto;top:calc(var(--nav-h) + 12px);transform:translate(-50%,-200%);max-width:calc(100vw - 32px);text-align:center}.toast.show{transform:translate(-50%,0)}}
@media (min-width:981px) and (max-width:1280px){.stage img.layer--hyena{right:0!important;height:44%!important;bottom:-2%!important}.stage img.layer--sanjay{right:24%!important}}
@media (max-width:1024px){.edition .badge{position:absolute;top:0;right:0;order:0;margin:0;font-size:8.5px;padding:5px 9px;letter-spacing:.18em}}

/* ===== The Creator (Game page) ===== */
.creator__grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(36px,6vw,96px);align-items:center}
.creator__art{position:relative;display:grid;place-items:center;perspective:1200px}
.creator__art::before{content:'';position:absolute;inset:8% 4%;border-radius:50%;background:radial-gradient(circle,rgba(255,150,0,.28),transparent 65%);filter:blur(30px);z-index:-1}
.creator__card{width:min(100%,440px);border-radius:18px;overflow:hidden;box-shadow:0 40px 90px -20px rgba(0,0,0,.9),0 0 60px rgba(255,140,0,.18);animation:float 7s ease-in-out infinite}
.creator__card img{width:100%;height:auto;display:block}
.creator__card .corners{inset:-8px}
.creator__text{display:grid;gap:24px;min-width:0}
.creator__roles{display:flex;flex-wrap:wrap;gap:8px}
.creator__quote{margin:0;padding:6px 0 6px 22px;border-left:1px solid var(--amber);font-size:clamp(16px,1.3vw,19px);line-height:1.7;color:var(--ivory);font-weight:400;max-width:60ch;position:relative}
.creator__quote::before{content:'';position:absolute;left:-4px;top:0;width:7px;height:7px;transform:rotate(45deg);background:var(--amber);box-shadow:0 0 10px var(--amber)}
.creator__meta{display:flex;flex-wrap:wrap;gap:18px 40px;padding-top:22px;border-top:1px solid var(--gold-faint)}
.creator__meta div{display:grid;gap:6px}
.creator__meta b{font-family:var(--f-display);font-weight:400;font-size:14px;letter-spacing:.06em}
@media (max-width:900px){.creator__grid{grid-template-columns:1fr}.creator__card{width:min(100%,380px)}}
@media (max-width:600px){.creator__card{width:min(100%,320px)}.creator__quote{padding-left:18px}}
/* Squad lineup (Game > Build your legend) */
.lineup{position:relative;display:grid;place-items:end center;min-height:420px;perspective:1200px}
.lineup::before{content:'';position:absolute;inset:12% 6% 0;border-radius:50% 50% 0 0;background:radial-gradient(circle at 50% 78%,rgba(255,150,0,.34),transparent 62%);z-index:0}
.lineup img{position:relative;z-index:1;width:min(100%,560px);height:auto;filter:drop-shadow(0 34px 44px rgba(0,0,0,.85)) drop-shadow(0 0 26px rgba(255,150,0,.18))}
.lineup .dossier__ring{width:92%;bottom:-2%}
@media (max-width:600px){.lineup{min-height:0}.lineup img{width:min(100%,380px)}}
/* ATV (Game > Vehicles) */
.vehicle-stage{position:relative;display:grid;place-items:center;min-height:380px}
.vehicle-stage::before{content:'';position:absolute;inset:15% 4% 2%;border-radius:50%;background:radial-gradient(circle at 50% 70%,rgba(255,150,0,.32),transparent 62%);filter:blur(10px);z-index:0}
.vehicle-stage img{position:relative;z-index:1;width:min(100%,620px);height:auto;filter:drop-shadow(0 36px 40px rgba(0,0,0,.85)) drop-shadow(0 0 24px rgba(255,150,0,.15));animation:float 7s ease-in-out infinite}
.vehicle-stage .dossier__ring{width:86%;bottom:4%}
@media (max-width:600px){.vehicle-stage{min-height:0}.vehicle-stage img{width:100%}}
/* Home hero meta: longer values */
.hero__meta{gap:22px 36px}
.hero__meta b{font-size:clamp(15px,1.4vw,19px);white-space:nowrap}
@media (max-width:600px){.hero__meta{display:grid;grid-template-columns:1fr 1fr;gap:18px 20px}.hero__meta b{white-space:normal;font-size:15px}}
/* About: investor contact */
.co-link{color:inherit;transition:opacity .3s}.co-link:hover{opacity:.85}
.contact-split>*{min-width:0}
.contact-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:var(--gold-faint);border:1px solid var(--gold-faint)}
.contact-card{display:grid;gap:8px;align-content:start;padding:20px 22px;background:#080604}
.contact-card a,.contact-card b{font-family:var(--f-display);font-weight:400;font-size:clamp(13px,1.15vw,16px);letter-spacing:.03em;color:var(--ivory);overflow-wrap:anywhere}
.contact-card a{color:var(--amber-hot)}.contact-card a:hover{text-decoration:underline}
.socials--center{justify-content:center;width:100%;margin-top:6px}
@media (max-width:900px){.contact-split{gap:48px}}
@media (max-width:560px){.contact-cards{grid-template-columns:1fr}.contact-card{padding:16px 18px}.contact-split form.edition{padding:24px 18px}.contact-split .btn[type=submit]{justify-self:stretch!important;justify-content:center}}
/* Editions: price to be announced */
.price--tba{display:grid;gap:6px;font-family:var(--f-display);font-size:clamp(14px,1.2vw,16px);letter-spacing:.04em;line-height:1.4;color:var(--amber-hot);padding:12px 14px;border:1px dashed var(--gold-soft);background:rgba(255,176,0,.05)}
.price--tba .hud{font-size:10px}
[data-wish].wished{background:linear-gradient(135deg,#3a2a0e,#241807);color:var(--amber-hot);box-shadow:inset 0 0 0 1px var(--amber)}

/* ===== Wishlist flow ===== */
.wl-btn svg{fill:none;stroke:var(--ivory);stroke-width:1.5;stroke-linejoin:round}
.wl-btn:hover svg{stroke:var(--amber)}
.wl-count.pop{animation:wlPop .6s var(--ease)}
@keyframes wlPop{40%{transform:scale(1.6)}}
.wl-modal{position:fixed;inset:0;z-index:650;display:grid;place-items:center;padding:16px;background:rgba(3,2,1,.78);backdrop-filter:blur(10px);opacity:0;transition:opacity .3s var(--ease)}
.wl-modal.open{opacity:1}
.wl-modal[hidden]{display:none}
.wl-modal__card{position:relative;width:min(100%,460px);max-height:calc(100vh - 32px);overflow:auto;display:grid;gap:18px;padding:34px 30px 30px;border-radius:6px;
  background:linear-gradient(165deg,rgba(60,38,10,.96),rgba(10,7,4,.98) 55%);box-shadow:0 40px 100px rgba(0,0,0,.8),0 0 60px rgba(255,140,0,.12);transform:translateY(18px) scale(.97);transition:transform .45s var(--ease)}
.wl-modal.open .wl-modal__card{transform:none}
.wl-modal__close{position:absolute;top:14px;right:14px;width:38px;height:38px;z-index:3}
.wl-modal .eyebrow{font-size:10.5px;letter-spacing:.34em}
.wl-modal .eyebrow b{font-weight:600;color:var(--ivory)}
.wl-modal .h-md{font-size:clamp(20px,5vw,26px);padding-right:30px}
.wl-modal p{font-size:14.5px;line-height:1.6}
.wl-modal .input{font-size:16px}
.wl-modal .input.bad{border-color:#ff6a3d;box-shadow:0 0 0 3px rgba(255,90,40,.12)}
.wl-err{min-height:0;color:#ff8a5c;font-size:12px}
.wl-err:empty{display:none}
.wl-check{display:flex;gap:12px;align-items:flex-start;cursor:pointer;font-size:14px;color:var(--mist);line-height:1.5}
.wl-check input{position:absolute;opacity:0;width:1px;height:1px}
.wl-box{flex:0 0 18px;height:18px;margin-top:2px;border:1px solid var(--gold);display:grid;place-items:center;transition:background .25s}
.wl-box::after{content:'';width:9px;height:5px;border-left:2px solid #0a0703;border-bottom:2px solid #0a0703;transform:rotate(-45deg) translateY(-1px);opacity:0}
.wl-check input:checked+.wl-box{background:var(--amber);border-color:var(--amber)}
.wl-check input:checked+.wl-box::after{opacity:1}
.wl-check input:focus-visible+.wl-box{outline:1px solid var(--amber);outline-offset:3px}
.wl-item{padding:18px 0;border-bottom:1px solid var(--gold-faint);display:grid;gap:12px}
.wl-item__top{display:flex;justify-content:space-between;align-items:center;gap:12px}
.wl-meta{display:grid;grid-template-columns:auto 1fr;gap:6px 16px;margin:0;font-size:13.5px}
.wl-meta dt{font-family:var(--f-hud);font-size:10.5px;letter-spacing:.24em;text-transform:uppercase;color:var(--gold);padding-top:2px}
.wl-meta dd{margin:0;color:var(--ivory);overflow-wrap:anywhere}
@media (max-width:600px){.wl-modal__card{padding:28px 20px 22px;gap:16px}.nav .wl-btn,.nav .cart-btn{width:40px!important;height:40px!important}}
.wl-modal .eyebrow{flex-wrap:wrap;gap:6px 14px;padding-right:48px}@media (max-width:600px){.wl-modal .eyebrow::before{display:none}.wl-modal .eyebrow{letter-spacing:.24em}}
.wl-modal .btn .heart{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linejoin:round}

/* Heart toggle (editions + merch): outline = not saved, filled = saved */
.wish-btn{justify-content:center;gap:10px}
.wish-btn .heart{width:17px;height:17px;flex:0 0 auto;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linejoin:round;transition:fill .25s,transform .3s var(--ease)}
.btn.wish-btn:hover svg{transform:scale(1.15)}
.wish-btn.wished .heart{fill:currentColor}
.heart.beat{animation:wlBeat .5s var(--ease)}
@keyframes wlBeat{30%{transform:scale(1.35)}60%{transform:scale(.92)}}
.product__foot .wish-btn{gap:8px}
.product__foot .wish-btn .heart{width:14px;height:14px}

/* Wishlist drawer: Games / Merch tabs, sort, clear all */
.wl-drawer{grid-template-rows:auto auto auto 1fr auto}
.wl-drawer>.drawer__items{grid-row:4}.wl-drawer>.drawer__foot{grid-row:5}
.wl-drawer[inert]{visibility:hidden;transition:transform .7s var(--ease),visibility 0s .7s}
.wl-drawer.open{visibility:visible;transition:transform .7s var(--ease)}
.wl-tabs{display:grid;grid-template-columns:1fr 1fr;border-bottom:1px solid var(--gold-faint)}
.wl-tab{padding:16px 10px;font-family:var(--f-hud);font-size:12px;letter-spacing:.24em;text-transform:uppercase;color:var(--mist);border-bottom:2px solid transparent;display:flex;justify-content:center;align-items:center;gap:10px;transition:color .3s,border-color .3s}
.wl-tab:hover{color:var(--ivory)}
.wl-tab.active{color:var(--amber-hot);border-bottom-color:var(--amber)}
.wl-tab:focus-visible{outline:1px solid var(--amber);outline-offset:-4px}
.wl-tab i{font-style:normal;font-size:10px;min-width:20px;height:20px;padding:0 5px;display:inline-grid;place-items:center;border-radius:10px;background:rgba(255,176,0,.14);color:var(--amber-hot);letter-spacing:0}
.wl-tools{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 28px;border-bottom:1px solid var(--gold-faint)}
.wl-tools[hidden],.wl-who[hidden]{display:none}
.wl-sort{display:flex;align-items:center;gap:10px}
.wl-sort .hud{font-size:10px}
.wl-sort .input{width:auto;padding:8px 12px;font-size:13px;background:#0e0a05;cursor:pointer}
.wl-clear,.wl-link{font-family:var(--f-hud);font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--mist);text-decoration:underline;text-underline-offset:4px;padding:8px 0;transition:color .25s}
.wl-clear:hover,.wl-link:hover{color:var(--amber-hot)}
.wl-clear.armed{color:#ff8a5c}
.wl-row__ph{width:70px;height:70px;display:grid;place-items:center;background:#120c06}
.wl-row__ph .heart,.wl-empty .heart{width:26px;height:26px;fill:none;stroke:var(--gold);stroke-width:1.4}
.wl-empty{display:grid;justify-items:center;gap:16px;text-align:center;padding:48px 10px}
.wl-empty p{margin:0;max-width:30ch;font-size:14px}
.wl-who{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:6px 14px;font-size:13px}
.wl-who b{color:var(--ivory);font-weight:500}
@media (max-width:600px){.wl-tools{padding:10px 20px}.wl-drawer .drawer__head,.wl-drawer .drawer__foot{padding:20px}.wl-drawer .drawer__items{padding:6px 20px}}

/* Merch section heading: title and "Your Merch Wishlist (N)" share one row (badge on the right), filter chips below */
.merch-head{display:grid;gap:18px;margin-bottom:40px}
.merch-head__row{display:flex;align-items:center;justify-content:space-between;gap:16px 24px;flex-wrap:wrap}
.merch-head__row .h-lg{margin:0}
.merch-head .tabs{margin-top:6px}
@media (min-width:761px){.merch-head__row .wl-merch-badge{padding:14px 24px;font-size:12.5px;gap:12px}.merch-head__row .wl-merch-badge svg{width:18px;height:18px}}
/* Merch section: "Your Merch Wishlist (N)" */
.wl-merch-badge{justify-self:start;display:inline-flex;align-items:center;gap:10px;padding:9px 16px;border:1px solid var(--gold-soft);font-family:var(--f-hud);font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--ivory);transition:border-color .3s,color .3s,background .3s}
.wl-merch-badge:hover{border-color:var(--amber);color:var(--amber-hot);background:rgba(255,176,0,.06)}
.wl-merch-badge svg{width:15px;height:15px;fill:none;stroke:var(--amber);stroke-width:1.8;stroke-linejoin:round}
.wl-merch-badge b{color:var(--amber-hot);display:inline-block;letter-spacing:0}
.wl-merch-badge b::before{content:'(';color:var(--ivory)}.wl-merch-badge b::after{content:')';color:var(--ivory)}
.wl-merch-badge b.pop{animation:wlPop .6s var(--ease)}

/* ===== Hero: total wishlists counter ===== */
.hero__actions{align-items:center}
.wl-counter{display:grid;gap:2px;padding-left:26px;margin-left:6px;border-left:1px solid var(--gold-soft);min-width:0}
.wl-counter__label{display:flex;align-items:center;gap:8px;font-size:10.5px;letter-spacing:.3em;white-space:nowrap}
.live-dot{width:7px;height:7px;border-radius:50%;background:#ff4b2b;box-shadow:0 0 0 0 rgba(255,75,43,.7);animation:liveDot 1.8s ease-out infinite;flex-shrink:0}
@keyframes liveDot{0%{box-shadow:0 0 0 0 rgba(255,75,43,.7)}70%{box-shadow:0 0 0 9px rgba(255,75,43,0)}100%{box-shadow:0 0 0 0 rgba(255,75,43,0)}}
.wl-counter__num{font-family:var(--f-display);font-weight:400;font-size:clamp(30px,3.4vw,48px);line-height:1.05;letter-spacing:.02em;font-variant-numeric:tabular-nums;
  background:linear-gradient(100deg,#fff5dc,var(--amber-hot) 40%,var(--amber) 70%,var(--amber-deep));-webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 0 18px rgba(255,160,0,.35))}
.wl-counter__num.bump{animation:wlBump .9s var(--ease)}
@keyframes wlBump{30%{transform:scale(1.12);filter:drop-shadow(0 0 30px rgba(255,190,60,.9))}}
/* Home hero stats row (under the buttons): Total Wishlists + the IGDC countdown, side by side */
.hero__stats{flex-basis:100%;display:flex;flex-wrap:wrap;align-items:flex-end;gap:18px 34px;margin-top:6px}
.hero__stats .wl-counter{margin-left:0}
.hero__stats .igdc-cd{margin-left:0}
/* Home hero: countdown to IGDC — amber dot-matrix LED panel (unlit "88" segments behind the lit digits) */
.igdc-cd{display:grid;gap:8px;padding-left:26px;margin-left:6px;border-left:1px solid var(--gold-soft);min-width:0;color:inherit;text-decoration:none}
.igdc-cd[hidden]{display:none}
.igdc-cd__label{display:flex;align-items:center;gap:8px;font-size:10.5px;letter-spacing:.3em;white-space:nowrap;transition:color .3s}
.igdc-cd:hover .igdc-cd__label{color:var(--amber-hot)}
.igdc-cd__panel{position:relative;display:inline-flex;align-items:flex-start;gap:2px;padding:8px 10px 6px;border-radius:4px;overflow:hidden;
  background:radial-gradient(120% 140% at 50% 0%,rgba(255,120,0,.10),transparent 60%),linear-gradient(180deg,#0d0a07,#050403);
  border:1px solid rgba(255,140,0,.28);box-shadow:inset 0 0 18px rgba(0,0,0,.9),0 0 22px rgba(255,120,0,.12);transition:border-color .3s,box-shadow .3s}
.igdc-cd:hover .igdc-cd__panel{border-color:rgba(255,160,0,.6);box-shadow:inset 0 0 18px rgba(0,0,0,.9),0 0 30px rgba(255,130,0,.28)}
.igdc-cd__panel::after{content:'';position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(180deg,rgba(0,0,0,.28) 0 1px,transparent 1px 3px)}
.igdc-cd__seg{display:grid;justify-items:center;gap:2px}
.igdc-cd__seg b,.igdc-cd__sep{font-family:'Doto',ui-monospace,monospace;font-weight:800;font-size:clamp(22px,1.95vw,29px);line-height:1;letter-spacing:.02em;font-variant-numeric:tabular-nums}
.igdc-cd__seg b{position:relative;color:#ff9a1f;text-shadow:0 0 6px rgba(255,130,0,.95),0 0 16px rgba(255,100,0,.55)}
.igdc-cd__seg b::before{content:attr(data-ghost);position:absolute;inset:0;color:rgba(255,120,0,.09);text-shadow:none;z-index:-1}
.igdc-cd__seg small{font-family:var(--f-hud);font-size:7.5px;letter-spacing:.2em;text-transform:uppercase;color:rgba(255,170,80,.6)}
.igdc-cd__sep{font-style:normal;color:#ff9a1f;text-shadow:0 0 6px rgba(255,130,0,.9);animation:cdBlink 1s steps(2) infinite}
@keyframes cdBlink{50%{opacity:.25}}
.igdc-cd.is-live .igdc-cd__seg b{animation:cdBlink 1.2s steps(2) infinite}
@media (prefers-reduced-motion:reduce){.igdc-cd__sep{animation:none}}
/* the panel fills the width main.js gives the countdown; digits scale with it */
@media (min-width:601px){
  .igdc-cd{container-type:inline-size;box-sizing:border-box}
  .igdc-cd__panel{display:flex;justify-content:space-between;width:100%;box-sizing:border-box}
  @supports (width:1cqi){.igdc-cd__seg b,.igdc-cd__sep{font-size:clamp(16px,12.6cqi,36px)}}
}
@media (max-width:600px){.igdc-cd{flex-basis:100%;padding:16px 0 0;margin:4px 0 0;border-left:0;border-top:1px solid var(--gold-faint);justify-items:start}.igdc-cd__seg b,.igdc-cd__sep{font-size:30px}}
@media (max-width:600px){.wl-counter{flex-basis:100%;padding:16px 0 0;margin:4px 0 0;border-left:0;border-top:1px solid var(--gold-faint);justify-items:start}.wl-counter__num{font-size:36px}}
@media (min-width:601px) and (max-width:1280px){.wl-counter__num{font-size:clamp(28px,3.2vw,40px)}}

/* ===== Trailer player ===== */
.player{position:fixed;inset:0;z-index:680;display:grid;place-items:center;padding:clamp(12px,4vw,56px);background:rgba(2,1,0,.9);backdrop-filter:blur(14px);opacity:0;transition:opacity .35s var(--ease)}
.player.open{opacity:1}
.player[hidden]{display:none}
.player__box{position:relative;width:min(100%,1180px,calc((100vh - 160px) * 16 / 9));display:grid;gap:0;border-radius:6px;overflow:visible;background:#000;
  box-shadow:0 0 0 1px var(--gold-soft),0 50px 140px rgba(0,0,0,.9),0 0 90px rgba(255,140,0,.18);transform:scale(.94) translateY(16px);transition:transform .5s var(--ease)}
.player.open .player__box{transform:none}
.player__screen{position:relative;aspect-ratio:16/9;width:100%;background:#000;border-radius:6px 6px 0 0;overflow:hidden}
.player__screen iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.player__bar{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;padding:14px 18px;background:linear-gradient(90deg,rgba(40,26,8,.9),rgba(8,6,3,.95));border-radius:0 0 6px 6px}
.player__bar .read svg{width:14px;stroke:currentColor;fill:none;stroke-width:1.6}
.player__close{position:absolute;top:-56px;right:0;width:44px;height:44px;background:rgba(10,7,4,.8)}
.player__fallback{position:absolute;inset:0;display:grid;place-items:center;align-content:center;gap:18px;color:var(--ivory)}
.player__fallback img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.55}
.player__fallback .play,.player__fallback b{position:relative;z-index:1}
.player__fallback b{font-family:var(--f-hud);letter-spacing:.3em;text-transform:uppercase;font-size:12px}
[data-yt]{cursor:pointer}
[data-yt]:focus-visible{outline:1px solid var(--amber);outline-offset:4px}
@media (max-width:600px){.player{padding:12px}.player__close{top:-52px}.player__bar{padding:12px 14px}.player__bar .hud{font-size:9.5px;letter-spacing:.16em}}
/* Merch: pricing to be announced */
.price--soon{font-family:var(--f-hud);font-size:11px;letter-spacing:.14em;text-transform:uppercase;line-height:1.5;color:var(--amber-hot);flex:1 1 140px;min-width:0}
.product__foot{flex-wrap:wrap;align-items:center;gap:12px}
.product__foot .btn--sm{white-space:nowrap}
.cart-count.pop{animation:wlPop .6s var(--ease)}
.sw-btn svg{fill:none;stroke:var(--ivory);stroke-width:1.5;stroke-linejoin:round;stroke-linecap:round}
.sw-btn:hover svg{stroke:var(--amber)}
.sw-who{padding:16px 28px;border-bottom:1px solid var(--gold-faint);background:rgba(255,176,0,.04)}
.product .btn--sm.wished{background:linear-gradient(135deg,#3a2a0e,#241807);color:var(--amber-hot);box-shadow:inset 0 0 0 1px var(--amber)}
@media (max-width:600px){.sw-who{padding:14px 20px}.nav .sw-btn{width:40px!important;height:40px!important}.nav .flex{gap:8px!important}}
@media (max-width:380px){.nav .icon-btn.cart-btn{width:36px!important;height:36px!important}}
.sw-drawer{display:flex;flex-direction:column}.sw-drawer .drawer__items{flex:1 1 auto;min-height:0}
/* About hero: statue background */
.hero__bg--statue{opacity:.95;background-position:62% 35%}
.hero__bg--statue::after{background:linear-gradient(90deg,#030201 0%,rgba(3,2,1,.85) 30%,rgba(3,2,1,.25) 58%,rgba(3,2,1,.35) 100%),linear-gradient(0deg,#050403 2%,transparent 35%),radial-gradient(circle at 62% 30%,rgba(255,150,0,.12),transparent 50%)}
@media (max-width:900px){.hero__bg--statue{background-position:70% 30%;opacity:.6}}
.hero__bg--statue{background-position:64% 0%;inset:0 -4% -4% -4%}
@media (max-width:900px){.hero__bg--statue{background-position:48% 0%;opacity:.55}}
/* About: mission section background */
.mission-bg{isolation:isolate;overflow:hidden;min-height:min(92vh,860px);display:flex;align-items:center}
.mission-bg>.wrap{width:100%}
.mission-bg__img{position:absolute;inset:0;z-index:-1;background-size:cover;background-position:65% 50%}
.mission-bg__img::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#050403 0%,rgba(5,4,3,.9) 32%,rgba(5,4,3,.35) 62%,rgba(5,4,3,.2) 100%),linear-gradient(180deg,#050403 0%,transparent 16%,transparent 84%,#050403 100%)}
.mission-bg .split{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
@media (max-width:900px){.mission-bg{min-height:0}.mission-bg .split{grid-template-columns:1fr}.mission-bg__img{background-position:70% 50%;opacity:.55}.mission-bg__img::after{background:linear-gradient(180deg,#050403 0%,rgba(5,4,3,.7) 20%,rgba(5,4,3,.75) 80%,#050403 100%)}}

/* ===== No-overlap guarantee: columns never grow past their track; big headings auto-fit ===== */
.split>*,.grid>*,.dossier>*,.creator__grid>*,.dslide>*,.sec-head>*,.hero__content,.hero__content>*,.creator__text>*,.contact-split>*>*{min-width:0}
.hero__title,.h-xl,.h-lg,.h-md{max-width:100%;overflow-wrap:normal}
.hero .split .hero__content{max-width:none}
.fit-pending{visibility:hidden}
.dslide__text>*,.dslider>*,.dslider__stage>*{min-width:0}
.hero-brand{max-width:100%}.hero-brand__title{min-width:0;flex:0 1 auto;max-width:calc(100% - 140px)}
@media (max-width:680px){.hero-brand__title{max-width:100%}}
.hero__title .line>span{white-space:nowrap}
.hero__title .line{white-space:normal}
.contact-card a,.contact-card b{font-family:var(--f-body);font-weight:500;font-size:clamp(15px,1.15vw,17px);letter-spacing:.01em;overflow-wrap:normal;word-break:normal}
.contact-cards{grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr))}

/* ---------- IGDC expo invitation popup ---------- */
.expo-modal{overflow-y:auto;place-items:start center;padding:32px 16px}
.expo-modal .expo-card{width:min(100%,1040px);max-height:none;overflow:visible;display:block;padding:0;margin:auto}
.expo-card__poster{position:relative;background:#000;border-bottom:1px solid rgba(212,175,55,.28);aspect-ratio:16/9;overflow:hidden;border-radius:6px 6px 0 0}
.expo-card__poster img{display:block;width:100%;height:100%;object-fit:cover}
.expo-card__poster::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:linear-gradient(90deg,transparent,#ffcf4a,transparent);animation:expoSweep 3.2s linear infinite}
@keyframes expoSweep{0%{transform:translateX(-100%)}100%{transform:translateX(100%)}}
.expo-card__body{display:grid;grid-template-columns:1.1fr 1fr;gap:34px;padding:34px 34px 32px}
.expo-info,.expo-action{min-width:0;display:grid;gap:16px;align-content:start}
.expo-action{padding-left:34px;border-left:1px solid rgba(212,175,55,.22)}
.expo-action__label{color:var(--gold-2,#f5c451)}
.expo-modal .wl-modal__close{background:rgba(8,6,3,.7);backdrop-filter:blur(6px)}
.expo-modal .h-md{padding-right:0}
.expo-facts{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.expo-facts li{display:grid;gap:4px;align-content:start;padding:10px 12px;border:1px solid rgba(212,175,55,.28);border-radius:4px;background:rgba(255,176,0,.05);min-width:0}
.expo-facts b{font-family:var(--font-body,inherit);font-weight:600;font-size:14px;color:var(--ivory);overflow-wrap:anywhere}
.expo-invite{font-size:14px;line-height:1.6;color:var(--gold-2,#f5c451);border-left:2px solid var(--amber,#ffb000);padding-left:12px;margin:0}
.expo-form{display:grid;gap:14px}
.expo-done{display:grid;gap:14px;justify-items:start;padding:8px 0}
.expo-done[hidden],.expo-form[hidden]{display:none}
.expo-done__badge{width:54px;height:54px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#ffcf4a,#ff9d00);box-shadow:0 0 30px rgba(255,170,0,.45)}
.expo-done__badge svg{width:26px;height:26px;fill:none;stroke:#140c02;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
@media (max-width:860px){.expo-card__body{grid-template-columns:1fr;gap:26px;padding:24px 20px 22px}.expo-action{padding-left:0;border-left:0;padding-top:22px;border-top:1px solid rgba(212,175,55,.22)}.expo-modal{padding:16px 12px}}
@media (max-width:460px){.expo-facts{grid-template-columns:1fr}}

/* ---------- Community channel cards: 5 across, no orphans ---------- */
.socials-grid{display:grid;gap:22px;grid-template-columns:repeat(5,minmax(0,1fr))}
.socials-grid .social{min-width:0;padding:30px 24px;display:flex;flex-direction:column;gap:16px;container-type:inline-size}
.socials-grid .social .h-sm{font-size:clamp(13px,9.6cqi,20px);white-space:nowrap}
.socials-grid .social .read{margin-top:auto;white-space:nowrap}
@media (max-width:1199px){.socials-grid{grid-template-columns:repeat(6,minmax(0,1fr))}.socials-grid .social{grid-column:span 2}.socials-grid .social:nth-child(4),.socials-grid .social:nth-child(5){grid-column:span 3}}
@media (max-width:760px){.socials-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.socials-grid .social,.socials-grid .social:nth-child(4){grid-column:span 1}.socials-grid .social:nth-child(5){grid-column:1/-1}.socials-grid .social{padding:24px 20px}}
@media (max-width:440px){.socials-grid{grid-template-columns:1fr}.socials-grid .social:nth-child(n){grid-column:auto}}

/* Particles float above every image and section (below nav, popups and cursor) */
#embers{z-index:90!important;mix-blend-mode:screen}

/* ---------- Seamless edges: full-bleed images dissolve into the page (no visible seams) ---------- */
.hero__bg,.hero__bg--statue{
  -webkit-mask-image:linear-gradient(180deg,#000 0%,#000 48%,rgba(0,0,0,.55) 70%,transparent 88%);
          mask-image:linear-gradient(180deg,#000 0%,#000 48%,rgba(0,0,0,.55) 70%,transparent 88%)}
.hero__bg::after{background:linear-gradient(90deg,rgba(3,2,1,.92) 6%,rgba(3,2,1,.65) 40%,rgba(3,2,1,.2) 70%,rgba(3,2,1,.45)),radial-gradient(circle at 70% 40%,rgba(255,150,0,.22),transparent 55%)}
.hero__bg--statue::after{background:linear-gradient(90deg,rgba(3,2,1,.95) 0%,rgba(3,2,1,.8) 30%,rgba(3,2,1,.22) 58%,rgba(3,2,1,.3) 100%),radial-gradient(circle at 62% 30%,rgba(255,150,0,.12),transparent 50%)}
.hero__canvas{-webkit-mask-image:linear-gradient(180deg,#000 72%,transparent 100%);mask-image:linear-gradient(180deg,#000 72%,transparent 100%)}
/* About hero: the statue starts below the nav bar (head never cut) and the text block sits lower.
   The parallax zoom grows downward (origin at the top) so it can't push the image back under the bar. */
.phero--about{align-items:flex-start;padding-top:calc(var(--nav-h) + 130px)}
.phero--about .hero__bg--statue{top:calc(var(--nav-h) + 14px);bottom:-4%;background-position:64% 0;transform-origin:50% 0;
  -webkit-mask-image:linear-gradient(180deg,transparent 0,#000 36px,#000 48%,rgba(0,0,0,.55) 70%,transparent 88%);
          mask-image:linear-gradient(180deg,transparent 0,#000 36px,#000 48%,rgba(0,0,0,.55) 70%,transparent 88%)}
@media (max-width:900px){.phero--about{padding-top:calc(var(--nav-h) + 170px)}.phero--about .hero__bg--statue{top:calc(var(--nav-h) + 8px);background-position:48% 0}}
.mission-bg__img{
  -webkit-mask-image:linear-gradient(180deg,transparent 0%,#000 18%,#000 80%,transparent 100%),linear-gradient(90deg,transparent 0%,#000 30%);
          mask-image:linear-gradient(180deg,transparent 0%,#000 18%,#000 80%,transparent 100%),linear-gradient(90deg,transparent 0%,#000 30%);
  -webkit-mask-composite:source-in;mask-composite:intersect}
.mission-bg__img::after{background:linear-gradient(90deg,rgba(5,4,3,.85) 0%,rgba(5,4,3,.7) 32%,rgba(5,4,3,.3) 62%,rgba(5,4,3,.15) 100%)}
@media (max-width:900px){.mission-bg__img::after{background:rgba(5,4,3,.6)}.mission-bg__img{-webkit-mask-image:linear-gradient(180deg,transparent 0%,#000 15%,#000 85%,transparent 100%);mask-image:linear-gradient(180deg,transparent 0%,#000 15%,#000 85%,transparent 100%)}}
.hero .stage{-webkit-mask-image:linear-gradient(180deg,#000 72%,transparent 99%);mask-image:linear-gradient(180deg,#000 72%,transparent 99%)}
.hero__bg--news{opacity:.8;background-position:55% 30%}
@media (max-width:900px){.hero__bg--news{opacity:.55;background-position:52% 30%}}

/* ---------- Filter tabs (News, Store, Media) ---------- */
[data-cat].hide{display:none!important}
[data-cat].flt-in{animation:fltIn .45s var(--ease) both}
@keyframes fltIn{from{opacity:0;transform:translateY(14px) scale(.98)}to{opacity:1;transform:none}}
.flt-empty{grid-column:1/-1;text-align:center;padding:50px 0}

/* ---------- Lightbox navigation ---------- */
.lightbox img{touch-action:pan-y;user-select:none;-webkit-user-drag:none}
.lb-nav{position:absolute;top:50%;transform:translateY(-50%);width:54px;height:54px;display:grid;place-items:center;cursor:pointer;color:var(--amber,#ffb000);
  background:linear-gradient(135deg,rgba(40,26,8,.85),rgba(8,6,3,.9));border:1px solid rgba(212,175,55,.5);
  clip-path:polygon(12px 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%,0 12px);transition:background .25s,border-color .25s,transform .25s}
.lb-nav svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.lb-nav:hover{background:rgba(255,176,0,.18);border-color:var(--amber,#ffb000)}
.lb-nav--prev{left:clamp(10px,3vw,40px)}.lb-nav--next{right:clamp(10px,3vw,40px)}
.lb-nav--prev:hover{transform:translate(-3px,-50%)}.lb-nav--next:hover{transform:translate(3px,-50%)}
.lb-count{position:absolute;top:30px;left:50%;transform:translateX(-50%);letter-spacing:.3em;color:rgba(245,230,200,.7)}
.lb-count b{color:var(--amber,#ffb000);font-weight:600}
.lightbox.lb-single .lb-nav,.lightbox.lb-single .lb-count{display:none}
@media (max-width:760px){.lb-nav{width:42px;height:42px;top:auto;bottom:70px;transform:none}.lb-nav--prev:hover,.lb-nav--next:hover{transform:none}.lb-nav--prev{left:calc(50% - 56px)}.lb-nav--next{right:calc(50% - 56px)}.lb-count{top:34px}.lightbox__cap{bottom:28px}}
@media (max-width:760px){
  .lightbox{padding:76px 14px 96px}
  .lightbox img{max-height:calc(100vh - 190px);max-height:calc(100svh - 190px);max-width:100%}
  .lightbox__close{top:14px;right:14px}
  .lb-count{top:30px}
  .lb-nav{bottom:22px}.lb-nav--prev{left:16px}.lb-nav--next{right:16px}
  .lightbox__cap{bottom:34px;left:70px;right:70px}
}

/* ================= Sci-fi HUD mobile / tablet menu ================= */
.hudm{position:fixed;inset:0;z-index:98;display:none;flex-direction:column;padding:calc(var(--nav-h,76px) + 14px) 22px 22px;overflow-y:auto;overscroll-behavior:contain;
  background:#030201;clip-path:circle(0% at calc(100% - 44px) 38px);transition:clip-path .75s cubic-bezier(.7,0,.2,1),visibility 0s .75s;visibility:hidden}
@media (max-width:980px){
  .hudm{display:flex}
  .nav__links{display:none!important}
  .menu-open .hudm{clip-path:circle(150% at calc(100% - 44px) 38px);visibility:visible;transition:clip-path .8s cubic-bezier(.7,0,.2,1)}
}
.hudm__bg{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.hudm__glow{position:absolute;inset:0;background:radial-gradient(60% 45% at 50% 38%,rgba(255,150,0,.22),transparent 70%),radial-gradient(40% 30% at 100% 100%,rgba(255,120,0,.12),transparent 70%)}
.hudm__grid{position:absolute;inset:0;background-image:linear-gradient(rgba(212,175,55,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(212,175,55,.07) 1px,transparent 1px);background-size:34px 34px;
  -webkit-mask-image:radial-gradient(ellipse at 50% 40%,#000 30%,transparent 80%);mask-image:radial-gradient(ellipse at 50% 40%,#000 30%,transparent 80%)}
.hudm__scan{position:absolute;left:0;right:0;height:120px;top:-120px;background:linear-gradient(180deg,transparent,rgba(255,190,70,.09) 80%,rgba(255,210,120,.35) 99%,transparent);animation:hudScan 4.5s linear infinite}
@keyframes hudScan{to{transform:translateY(calc(100vh + 240px))}}
.hudm__radar{position:absolute;left:50%;top:44%;width:min(118vw,620px);transform:translate(-50%,-50%);pointer-events:none;opacity:.55}
.hudm__radar circle{fill:none}
.hudm__radar .r1{stroke:rgba(212,175,55,.22);stroke-width:1}
.hudm__radar .r2{stroke:rgba(212,175,55,.12);stroke-width:1;stroke-dasharray:2 6}
.hudm__radar .r3{stroke:rgba(255,176,0,.35);stroke-width:1}
.hudm__radar .dash{stroke:rgba(255,176,0,.45);stroke-width:1.5;stroke-dasharray:40 18 4 18}
.hudm__radar .axis{stroke:rgba(212,175,55,.1);stroke-width:1}
.hudm__radar .cone{fill:url(#none);fill:rgba(255,160,0,.07)}
.hudm__radar .spin,.hudm__radar .spin2{transform-origin:200px 200px}
.hudm__radar .spin{animation:hudSpin 22s linear infinite}
.hudm__radar .spin2{animation:hudSpin 5s linear infinite}
@keyframes hudSpin{to{transform:rotate(360deg)}}
.hudm__c{position:absolute;width:26px;height:26px;border:0 solid var(--amber,#ffb000);opacity:0;transition:opacity .4s .5s,transform .6s .5s cubic-bezier(.2,.8,.2,1)}
.hudm__c--tl{top:calc(var(--nav-h,76px) + 4px);left:10px;border-width:1.5px 0 0 1.5px;transform:translate(-10px,-10px)}
.hudm__c--tr{top:calc(var(--nav-h,76px) + 4px);right:10px;border-width:1.5px 1.5px 0 0;transform:translate(10px,-10px)}
.hudm__c--bl{bottom:10px;left:10px;border-width:0 0 1.5px 1.5px;transform:translate(-10px,10px)}
.hudm__c--br{bottom:10px;right:10px;border-width:0 1.5px 1.5px 0;transform:translate(10px,10px)}
.menu-open .hudm__c{opacity:.9;transform:none}
.hudm__top{position:relative;display:flex;justify-content:space-between;align-items:center;font-family:var(--f-hud,monospace);font-size:10px;letter-spacing:.3em;color:rgba(245,230,200,.6);
  padding:8px 6px 12px;border-bottom:1px solid rgba(212,175,55,.2)}
.hudm__live{display:flex;align-items:center;gap:8px;color:var(--amber,#ffb000)}
.hudm__live i{width:7px;height:7px;border-radius:50%;background:#ff5a2a;box-shadow:0 0 10px #ff5a2a;animation:hudBlink 1.2s steps(2) infinite}
@keyframes hudBlink{50%{opacity:.2}}
.hudm__nav{position:relative;flex:1;display:flex;align-items:center;padding:18px 0}
.hudm__list{list-style:none;margin:0 auto;padding:0;width:100%;max-width:560px;counter-reset:h}
.hudm__list li{opacity:0;transform:translateX(-26px);transition:opacity .45s,transform .55s cubic-bezier(.2,.8,.2,1)}
.menu-open .hudm__list li{opacity:1;transform:none;transition-delay:calc(.28s + var(--i) * 65ms)}
.hudm__list a{position:relative;display:grid;grid-template-columns:34px 1fr auto;align-items:center;gap:10px;padding:12px 14px;margin:3px 0;color:rgba(245,236,220,.78);
  font-family:var(--f-display);font-size:clamp(17px,5vw,24px);letter-spacing:.16em;text-transform:uppercase;border:1px solid transparent;transition:color .25s,background .25s,border-color .25s}
.hudm__list a .n{font-family:var(--f-hud,monospace);font-size:10px;letter-spacing:.2em;color:rgba(212,175,55,.7)}
.hudm__list a .tag{font-family:var(--f-hud,monospace);font-size:9px;letter-spacing:.24em;color:rgba(245,230,200,.35);white-space:nowrap}
.hudm__list a::before{content:'';position:absolute;left:0;right:0;bottom:-2px;height:1px;background:linear-gradient(90deg,rgba(212,175,55,.35),rgba(212,175,55,.05) 70%,transparent);transform-origin:left;transform:scaleX(0);transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.menu-open .hudm__list a::before{transform:scaleX(1);transition-delay:calc(.4s + var(--i) * 65ms)}
.hudm__list a::after{content:'';position:absolute;left:0;top:0;bottom:0;width:2px;background:var(--amber,#ffb000);transform:scaleY(0);transition:transform .3s}
.hudm__list a:hover,.hudm__list a:focus-visible{color:#fff;background:linear-gradient(90deg,rgba(255,176,0,.12),transparent 80%);outline:none}
.hudm__list a:hover::after,.hudm__list a:focus-visible::after{transform:scaleY(1)}
.hudm__list a.on{color:var(--amber,#ffb000);border-color:rgba(255,176,0,.4);background:linear-gradient(90deg,rgba(255,176,0,.14),rgba(255,176,0,.02));
  clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,12px 100%,0 calc(100% - 12px))}
.hudm__list a.on::after{transform:scaleY(1)}
.hudm__list a.on .tag{color:var(--amber,#ffb000)}
.hudm__list a.on .tag::before{content:'◆ ';animation:hudBlink 1.4s steps(2) infinite}
.hudm__foot{position:relative;display:grid;gap:16px;padding-top:16px;border-top:1px solid rgba(212,175,55,.2);opacity:0;transform:translateY(16px);transition:opacity .5s,transform .6s}
.menu-open .hudm__foot{opacity:1;transform:none;transition-delay:.75s}
.hudm__cta{justify-content:center}
.hudm__row{display:flex;justify-content:space-between;align-items:center;gap:12px}
.hudm__row .socials{margin:0}
.hudm__sig{display:flex;align-items:flex-end;gap:3px;height:18px}
.hudm__sig i{width:4px;background:var(--amber,#ffb000);animation:hudSig 1.1s ease-in-out infinite}
.hudm__sig i:nth-child(1){height:30%;animation-delay:0s}.hudm__sig i:nth-child(2){height:50%;animation-delay:.12s}.hudm__sig i:nth-child(3){height:70%;animation-delay:.24s}.hudm__sig i:nth-child(4){height:85%;animation-delay:.36s}.hudm__sig i:nth-child(5){height:100%;animation-delay:.48s}
@keyframes hudSig{50%{opacity:.25}}
.hudm__meta{display:flex;justify-content:space-between;gap:10px;font-family:var(--f-hud,monospace);font-size:9px;letter-spacing:.25em;color:rgba(245,230,200,.4)}
@media (max-height:640px){.hudm__list a{padding:8px 12px;font-size:16px}.hudm__radar{opacity:.3}}
@media (min-width:600px) and (max-width:980px){.hudm{padding-left:48px;padding-right:48px}.hudm__list a{padding:16px 18px}}
@media (prefers-reduced-motion:reduce){.hudm__scan,.hudm__radar .spin,.hudm__radar .spin2{animation:none}}
/* keep nav icons + burger on one row on phones */
@media (max-width:980px){.nav__inner{flex-wrap:nowrap}.nav__inner>.flex{flex-wrap:nowrap;flex-shrink:0;gap:8px!important}}
@media (max-width:480px){.nav__inner>.flex{gap:6px!important}.nav .wl-btn,.nav .sw-btn,.nav .cart-btn{width:36px!important;height:36px!important}.nav .burger{width:40px;height:40px}.nav .burger span{left:10px;right:10px}.nav .burger span:nth-child(1){top:14px}.nav .burger span:nth-child(2){top:19.5px}.nav .burger span:nth-child(3){top:25px}.brand__txt{font-size:10px}.brand img{width:40px;height:40px}}
@media (max-width:374px){.brand__txt{display:none}}
/* HUD menu on phones: tags only for the current page */
@media (max-width:520px){.hudm__list a{grid-template-columns:26px 1fr auto;padding:11px 10px}.hudm__list a:not(.on) .tag{display:none}.hudm__list a.on .tag{font-size:8px;letter-spacing:.18em}}
.hero__bg--atv{opacity:.8;background-position:40% 45%;-webkit-mask-image:linear-gradient(180deg,transparent 6%,#000 28%,#000 50%,rgba(0,0,0,.45) 70%,transparent 88%),linear-gradient(90deg,transparent 6%,#000 24%,#000 76%,transparent 94%);-webkit-mask-composite:source-in;mask-image:linear-gradient(180deg,transparent 6%,#000 28%,#000 50%,rgba(0,0,0,.45) 70%,transparent 88%),linear-gradient(90deg,transparent 6%,#000 24%,#000 76%,transparent 94%);mask-composite:intersect}
@media (max-width:900px){.hero__bg--atv{opacity:.55;background-position:30% 45%}}

/* =========================================================
   CAREERS
   ========================================================= */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.cr-hl{color:var(--ivory);font-weight:500}
.cr-hero .hero__content{max-width:780px}
.cr-hero .lead+.lead{margin-top:-10px}
.cr-quick{display:grid;grid-template-columns:repeat(4,auto);justify-content:start;gap:clamp(22px,4vw,56px);padding-top:26px;border-top:1px solid var(--gold-faint)}
.cr-quick div{display:grid;gap:6px}
.cr-quick b{font-family:var(--f-display);font-weight:400;font-size:clamp(20px,2.2vw,30px);color:var(--ivory);line-height:1}
@media (max-width:600px){.cr-quick{grid-template-columns:repeat(2,1fr);gap:20px}}

/* What we're building */
.cr-build .card__media{aspect-ratio:4/3}
.cr-build .card__body p{font-size:14.5px;line-height:1.6}

/* Disciplines */
.cr-disc{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,290px),1fr));gap:clamp(16px,2vw,24px)}
.cr-disc__card{display:flex;flex-direction:column;gap:16px;padding:30px 28px;border-radius:4px;background:linear-gradient(170deg,rgba(255,176,0,.06),rgba(10,8,5,.65));transition:transform .5s var(--ease),box-shadow .5s var(--ease)}
.cr-disc__card:hover{transform:translateY(-4px);box-shadow:0 26px 60px -24px rgba(255,150,0,.35)}
.cr-disc__card .read{margin-top:auto;padding-top:6px;background:none;border:0;cursor:pointer;text-align:left}
.cr-disc__card .read:hover svg,.cr-trait .read:hover svg,.cr-join-card .read:hover svg{transform:translateX(6px)}
.cr-tags{list-style:none;display:flex;flex-wrap:wrap;gap:8px}
.cr-tags li{padding:6px 11px;font-size:13px;color:var(--mist);border:1px solid var(--gold-faint);background:rgba(255,176,0,.03);border-radius:2px}
.cr-tags--lg li{padding:9px 15px;font-size:14px}

/* Positions: filters */
.cr-filters{display:grid;gap:18px;margin-bottom:28px}
.cr-filters .chip{cursor:pointer;background:none;display:inline-flex;align-items:center;gap:10px}
.cr-filters .chip.active{background:var(--amber)}
.cr-filters .chip i{font-style:normal;font-size:10px;min-width:20px;height:20px;padding:0 5px;display:inline-grid;place-items:center;border-radius:10px;background:rgba(255,176,0,.14);color:var(--amber-hot);letter-spacing:0}
.cr-filters .chip.active i{background:rgba(0,0,0,.2);color:#0a0703}
.cr-filters__row{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.cr-search{position:relative;flex:1 1 320px}
.cr-search svg{position:absolute;left:16px;top:50%;width:18px;height:18px;transform:translateY(-50%);stroke:var(--gold);fill:none;stroke-width:1.6;pointer-events:none}
.cr-search .input{padding-left:46px}
.cr-type{flex:0 0 220px}
.cr-results{margin-left:auto;color:var(--mist)}
@media (max-width:600px){.cr-type{flex:1 1 100%}.cr-results{margin-left:0}}

/* Positions: job cards */
.cr-jobs{display:grid;gap:14px}
.cr-job{border-radius:4px;background:linear-gradient(170deg,rgba(255,176,0,.05),rgba(10,8,5,.7));transition:background .4s,box-shadow .4s;scroll-margin-top:calc(var(--nav-h) + 20px)}
.cr-job[hidden]{display:none}
.cr-job:hover,.cr-job.open{background:linear-gradient(170deg,rgba(255,176,0,.1),rgba(12,9,5,.85))}
.cr-job.open{box-shadow:0 30px 80px -30px rgba(255,150,0,.3)}
.cr-job__head{width:100%;display:grid;grid-template-columns:auto 1fr auto;gap:clamp(14px,2.4vw,30px);align-items:center;padding:clamp(20px,2.4vw,30px) clamp(18px,2.6vw,34px);background:none;border:0;color:inherit;text-align:left;cursor:pointer;font:inherit}
.cr-job__idx{font-family:var(--f-hud);font-size:12px;letter-spacing:.3em;color:var(--gold)}
.cr-job__main{display:grid;gap:10px;min-width:0}
.cr-job__title{font-family:var(--f-display);font-size:clamp(15px,1.5vw,21px);letter-spacing:.06em;text-transform:uppercase;color:var(--ivory);transition:color .3s}
.cr-job__head:hover .cr-job__title,.cr-job.open .cr-job__title{color:var(--amber-hot)}
.cr-job__meta{display:flex;flex-wrap:wrap;gap:8px 20px;font-family:var(--f-hud);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--mist)}
.cr-job__meta span{display:inline-flex;align-items:center;gap:7px}
.cr-job__meta svg,.cr-copy svg{width:14px;height:14px;stroke:var(--gold);fill:none;stroke-width:1.6}
.cr-job__toggle{position:relative;width:42px;height:42px;border:1px solid var(--gold-soft);border-radius:50%;transition:all .4s var(--ease)}
.cr-job__toggle::before,.cr-job__toggle::after{content:'';position:absolute;left:50%;top:50%;width:14px;height:1px;background:var(--amber);transform:translate(-50%,-50%);transition:transform .4s var(--ease)}
.cr-job__toggle::after{transform:translate(-50%,-50%) rotate(90deg)}
.cr-job.open .cr-job__toggle{border-color:var(--amber);background:rgba(255,176,0,.1);box-shadow:0 0 22px rgba(255,176,0,.25)}
.cr-job.open .cr-job__toggle::after{transform:translate(-50%,-50%) rotate(0)}
.cr-job__head:focus-visible{outline:1px solid var(--amber);outline-offset:-1px}
.cr-job__body{padding:0 clamp(18px,2.6vw,34px) clamp(24px,3vw,36px);animation:crIn .5s var(--ease)}
@keyframes crIn{from{opacity:0;transform:translateY(-8px)}}
.cr-job__grid{display:grid;grid-template-columns:1fr 1.35fr;gap:clamp(24px,4vw,56px);padding-top:clamp(20px,2.4vw,28px);border-top:1px solid var(--gold-faint)}
.cr-job__about{display:grid;gap:14px;align-content:start}
.cr-job__about p{color:var(--mist);line-height:1.7}
.cr-job__facts{display:grid;gap:1px;margin-top:8px;background:var(--gold-faint);border:1px solid var(--gold-faint)}
.cr-job__facts div{display:flex;justify-content:space-between;gap:16px;padding:12px 16px;background:#080604}
.cr-job__facts dt{font-family:var(--f-hud);font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--gold)}
.cr-job__facts dd{color:var(--ivory);text-align:right}
.cr-job__lists{display:grid;gap:24px}
.cr-job__lists>div{display:grid;gap:14px}
.cr-job__lists .list-check{gap:10px}
.cr-job__lists .list-check li{font-size:15px;line-height:1.55}
.cr-nice li::before{border-style:dashed;box-shadow:none}
.cr-job__actions{display:flex;flex-wrap:wrap;gap:14px;align-items:center;margin-top:clamp(24px,3vw,34px)}
.cr-copy{gap:10px;cursor:pointer}
@media (max-width:860px){.cr-job__grid{grid-template-columns:1fr}}
@media (max-width:560px){.cr-job__head{grid-template-columns:1fr auto}.cr-job__idx{display:none}.cr-job__toggle{width:36px;height:36px}.cr-job__actions .btn{flex:1 1 100%;justify-content:center}}
.cr-empty{display:grid;gap:14px;justify-items:start;padding:34px;border-radius:4px;background:rgba(10,8,5,.6)}
.cr-empty[hidden]{display:none}

/* Bands */
.cr-band,.cr-final{background-size:cover;background-position:center}
.cr-band .lead{max-width:68ch}
.cr-final{justify-items:center}
.cr-final__lines{font-family:var(--f-display);font-size:clamp(15px,1.6vw,22px);line-height:1.7;letter-spacing:.06em;text-transform:uppercase;color:var(--mist)}
.cr-mailnote a{color:var(--amber-hot)}.cr-mailnote a:hover{text-decoration:underline}

/* Traits */
.cr-traits{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--gold-faint);border:1px solid var(--gold-faint)}
.cr-trait{display:grid;gap:12px;align-content:start;padding:clamp(24px,2.6vw,36px);background:#070504;transition:background .4s}
.cr-trait:hover{background:#0f0b06}
.cr-trait p{color:var(--mist);font-size:15px;line-height:1.6}
.cr-trait p b{color:var(--ivory);font-weight:500}
.cr-trait--you{background:linear-gradient(170deg,rgba(255,176,0,.18),rgba(10,8,5,.9))}
.cr-trait .read,.cr-join-card .read{background:none;border:0;padding:0;cursor:pointer;justify-self:start}
@media (max-width:1024px){.cr-traits{grid-template-columns:repeat(2,1fr)}}
@media (max-width:520px){.cr-traits{grid-template-columns:1fr}}

/* Culture image */
.cr-shot{position:relative;border-radius:4px}
.cr-shot img{display:block;width:100%;height:auto;border-radius:4px}

/* People */
.cr-join-card{display:flex;flex-direction:column}
.cr-join-card__art{aspect-ratio:2/3;display:grid;place-items:center;background:radial-gradient(circle at 50% 45%,rgba(255,176,0,.16),transparent 60%),repeating-linear-gradient(0deg,rgba(214,168,78,.06) 0 1px,transparent 1px 28px),repeating-linear-gradient(90deg,rgba(214,168,78,.06) 0 1px,transparent 1px 28px),#070504}
.cr-join-card__art span{width:96px;height:96px;display:grid;place-items:center;border:1px dashed var(--gold-soft);border-radius:50%;font-family:var(--f-display);font-size:40px;color:var(--amber);box-shadow:0 0 40px rgba(255,176,0,.15);animation:crPulse 3.2s ease-in-out infinite}
@keyframes crPulse{50%{box-shadow:0 0 70px rgba(255,176,0,.35);transform:scale(1.05)}}
@media (max-width:1024px) and (min-width:761px){.cr-people{grid-template-columns:repeat(3,1fr)}}

/* Students */
.cr-share{display:grid;gap:22px;padding:clamp(28px,3.4vw,44px);border-radius:4px;background:linear-gradient(170deg,rgba(255,176,0,.08),rgba(10,8,5,.75))}

/* Process */
.cr-steps{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(14px,2vw,24px);counter-reset:none}
.cr-step{position:relative;display:grid;gap:14px;align-content:start;padding:34px 28px;border-radius:4px;background:linear-gradient(170deg,rgba(255,176,0,.06),rgba(10,8,5,.65))}
.cr-step__n{font-family:var(--f-display);font-size:clamp(34px,3.4vw,48px);line-height:1;background:linear-gradient(180deg,var(--amber-hot),rgba(224,123,0,.25));-webkit-background-clip:text;background-clip:text;color:transparent}
.cr-step p{color:var(--mist);font-size:15px;line-height:1.6}
.cr-step:not(:last-child)::after{content:'';position:absolute;top:52px;right:calc(-1 * clamp(14px,2vw,24px));width:clamp(14px,2vw,24px);height:1px;background:linear-gradient(90deg,var(--amber),transparent)}
@media (max-width:1024px){.cr-steps{grid-template-columns:repeat(2,1fr)}.cr-step::after{display:none}}
@media (max-width:560px){.cr-steps{grid-template-columns:1fr}}

/* Signature */
.cr-sign{padding:0}
.cr-sign__inner{display:grid;justify-items:center;gap:12px;padding-top:clamp(36px,4vw,56px);text-align:center}
.cr-sign__inner .h-sm{color:var(--amber-hot)}
.cr-sign__inner b{color:var(--ivory);font-weight:500}

/* Application modal */
body.cr-lock{overflow:hidden}
.cr-modal{position:fixed;inset:0;z-index:700;display:grid;place-items:center;padding:16px;background:rgba(3,2,1,.8);backdrop-filter:blur(10px);opacity:0;transition:opacity .3s var(--ease);overscroll-behavior:contain}
.cr-modal[hidden]{display:none}
.cr-modal.open{opacity:1}
.cr-modal__card{position:relative;width:min(100%,760px);max-height:calc(100vh - 32px);max-height:calc(100dvh - 32px);overflow:auto;padding:clamp(26px,3.6vw,44px);border-radius:6px;
  border:1px solid var(--gold-soft);background:linear-gradient(165deg,rgba(60,38,10,.97),rgba(10,7,4,.99) 50%);box-shadow:0 40px 100px rgba(0,0,0,.8),0 0 60px rgba(255,140,0,.12);transform:translateY(18px) scale(.98);transition:transform .45s var(--ease)}
.cr-modal.open .cr-modal__card{transform:none}
.cr-modal__close{position:absolute;top:14px;right:14px;width:40px;height:40px;z-index:3;background:rgba(0,0,0,.3);cursor:pointer}
.cr-modal form{display:grid;gap:22px}
.cr-modal form[hidden]{display:none}
.cr-form .field{align-content:start}
.cr-modal__head{display:grid;gap:12px;padding-right:44px}
.cr-modal__head .eyebrow{font-size:10.5px;letter-spacing:.34em}
.cr-modal .h-md{font-size:clamp(19px,3vw,26px)}
.cr-modal p{font-size:14px;line-height:1.6}
.cr-form{display:grid;grid-template-columns:1fr 1fr;gap:16px 18px}
.cr-span{grid-column:1/-1}
.cr-modal .input{font-size:15px;padding:13px 15px}
.cr-modal textarea.input{min-height:130px}
.cr-modal .input.bad{border-color:#ff6a3d;box-shadow:0 0 0 3px rgba(255,90,40,.12)}
.cr-modal optgroup{background:#0e0a05;color:var(--gold);font-style:normal}
.cr-req{color:var(--amber);font-weight:600}
.cr-err{color:#ff8a5c;font-size:12.5px}
.cr-err:empty{display:none}
.cr-row{display:flex;justify-content:space-between;gap:12px}
.cr-count{margin-left:auto;font-size:10px;color:var(--dim)}
.cr-file{padding:10px 12px;cursor:pointer}
.cr-file::file-selector-button{margin-right:14px;padding:8px 14px;border:1px solid var(--gold-soft);background:rgba(255,176,0,.08);color:var(--amber-hot);font-family:var(--f-hud);font-size:11px;letter-spacing:.2em;text-transform:uppercase;cursor:pointer}
.cr-hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.cr-mailhint{padding:12px 16px;border-left:2px solid var(--amber);background:rgba(255,176,0,.06)}
.cr-modal__foot{display:flex;justify-content:flex-end;gap:12px;flex-wrap:wrap}
.cr-modal .btn.busy{pointer-events:none;opacity:.7}
.cr-modal .btn.busy svg{animation:crSpin 1s linear infinite}
@keyframes crSpin{to{transform:rotate(360deg)}}
.cr-done{display:grid;justify-items:center;gap:18px;padding:20px 0 6px;text-align:center}
.cr-done[hidden]{display:none}
.cr-done__icon{width:76px;height:76px;display:grid;place-items:center;border:1px solid var(--amber);border-radius:50%;box-shadow:0 0 40px rgba(255,176,0,.3)}
.cr-done__icon svg{width:34px;height:34px;stroke:var(--amber);fill:none;stroke-width:1.8}
.cr-done .h-md{outline:none}
.cr-done p{max-width:52ch}
@media (max-width:600px){.cr-form{grid-template-columns:1fr}.cr-modal__foot .btn{flex:1 1 auto;justify-content:center}}

/* ==========================================================================
   Wix-powered surfaces — forms (js/mp-forms.js), events (js/mp-events.js),
   news (js/mp-blog.js), store catalog (js/mp-store.js)
   ========================================================================== */
.wf{display:grid;gap:20px}
.wf--grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.wf--grid>.wf-wide,.wf--grid>.wf-formerr,.wf--grid>.wf-actions,.wf--grid>.wf-step{grid-column:1/-1}
.wf textarea.input{min-height:140px;resize:vertical}
.wf .field>label .cr-req,.wf legend .cr-req{margin-left:2px}
.wf-req{color:var(--mist);text-transform:none;letter-spacing:0}
.wf-help{font-size:12.5px}
.wf-set{border:0;margin:0;padding:0;display:grid;gap:12px;min-width:0}
.wf-set legend{font-family:var(--f-hud);font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:var(--gold);margin-bottom:12px}
.wf-opts{display:flex;flex-wrap:wrap;gap:12px 24px}
.wf-opt{align-items:center}
.wl-box.wf-round{border-radius:50%}
.wl-box.wf-round::after{width:8px;height:8px;border:0;border-radius:50%;background:#0a0703;transform:none}
.wf-other{max-width:320px}
.wf-actions{display:flex;flex-wrap:wrap;gap:14px;align-items:center}
.wf-step{color:var(--amber)}
.input.bad,.input[aria-invalid]{border-color:#ff8a5c}
.wf.is-busy .btn[type=submit]{opacity:.6;pointer-events:none}
.wf--inline{gap:0;align-items:flex-start}
.wf--inline>.field{flex:1;gap:6px}
.wf--inline>.wf-actions{flex:none}
.wf--inline>.wf-formerr{flex-basis:100%;margin-top:8px}
.wf-host .inline-form{flex-wrap:wrap}
.wf-done{display:grid;gap:12px;justify-items:start;padding:8px 0;outline:none}
.wf-done__badge{width:40px;height:40px;border:1px solid var(--amber);transform:rotate(45deg);display:grid;place-items:center;box-shadow:0 0 24px rgba(255,176,0,.25)}
.wf-done__badge::after{content:'';width:12px;height:7px;border-left:2px solid var(--amber);border-bottom:2px solid var(--amber);transform:rotate(-90deg) translate(1px,-1px)}
.wf-done__msg p{margin:0;color:var(--ivory)}
.wf-done__msg p+p{margin-top:8px;color:var(--mist)}
.cta-band .wf-done,.cta-band--center .wf-done{justify-items:center;text-align:center}

/* skeletons */
@keyframes mpPulse{0%,100%{opacity:.35}50%{opacity:.7}}
.wf-skel{display:grid;gap:14px}
.wf-skel i,.card--skel i,.ev-skel i{display:block;height:46px;background:rgba(214,168,78,.08);border:1px solid var(--gold-faint);animation:mpPulse 1.6s ease-in-out infinite}
.wf-skel i:first-child{width:60%}
.wf-skel--inline{grid-template-columns:1fr 160px;max-width:560px;width:100%}
.wf-skel--inline i:first-child{width:auto}
.card--skel .card__media{background:rgba(214,168,78,.06);animation:mpPulse 1.6s ease-in-out infinite}
.card--skel .card__body{display:grid;gap:12px;padding:24px}
.card--skel i{height:14px}
.ev-skel .grid i{height:16px}
.news-feature.wf-skel{display:grid;padding:40px;min-height:360px;align-content:end}
.card__ph{width:100%;height:100%;background:radial-gradient(circle at 50% 70%,rgba(255,150,0,.18),#0b0805 70%)}
.clamp3{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}

/* store editions description (from the Wix product description) */
.ed-desc{display:grid;gap:10px;color:var(--mist)}
.ed-desc p{margin:0;line-height:1.75}
.ed-desc p:first-child{font-family:var(--f-hud);font-size:12px;letter-spacing:.3em;text-transform:uppercase;color:var(--gold)}
.edition--hot .ed-desc p:first-child{color:var(--amber)}
.edition.wf-skel{min-height:420px;align-content:end}

/* events */
.event h3 a{color:inherit}
.event h3 a:hover{color:var(--amber)}
.ev-when{color:var(--mist);font-size:11px}
.ev-split{align-items:start;gap:clamp(30px,5vw,70px)}
.ev-media img{width:100%;height:100%;object-fit:cover;max-height:60vh}
.ev-facts{grid-template-columns:repeat(2,minmax(0,1fr))}
.ev-facts small{display:block;margin-top:4px;line-height:1.5}
.ev-reg{gap:18px}
.ev-rsvp-card .btn{justify-self:start}

/* RSVP popup (js/mp-events.js openRsvpModal): the page blurs behind it; sticky header with an
   always-reachable 44px close button; on phones the whole form fits on one screen. */
.ev-modal{position:fixed;inset:0;z-index:700;display:grid;place-items:center;padding:16px;background:rgba(3,2,1,.55);
  -webkit-backdrop-filter:blur(12px) saturate(120%);backdrop-filter:blur(12px) saturate(120%);opacity:0;transition:opacity .28s var(--ease)}
.ev-modal.open{opacity:1}
.ev-modal__card{position:relative;width:min(100%,520px);max-height:calc(100vh - 32px);max-height:calc(100dvh - 32px);display:grid;grid-template-rows:auto minmax(0,1fr);
  border-radius:6px;overflow:hidden;background:linear-gradient(165deg,rgba(60,38,10,.97),rgba(10,7,4,.99) 55%);
  box-shadow:0 40px 100px rgba(0,0,0,.8),0 0 60px rgba(255,140,0,.12);transform:translateY(16px) scale(.97);transition:transform .35s var(--ease)}
.ev-modal.open .ev-modal__card{transform:none}
.ev-modal__head{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;padding:22px 20px 16px 26px;border-bottom:1px solid var(--gold-faint);background:rgba(20,13,5,.6)}
.ev-modal__titles{display:grid;gap:7px;min-width:0}
.ev-modal__titles .eyebrow{font-size:10.5px;letter-spacing:.3em}
.ev-modal__titles .h-sm{margin:0;font-size:clamp(15px,1.4vw,18px);line-height:1.3;letter-spacing:.06em}
.ev-modal__when{font-size:10px;letter-spacing:.14em;line-height:1.5}
.ev-modal__close{flex:0 0 44px;width:44px;height:44px;margin:-4px -2px 0 0;background:rgba(0,0,0,.35)}
.ev-modal__close svg{width:18px;height:18px}
.ev-modal__body{overflow:auto;overscroll-behavior:contain;padding:20px 26px 26px}
.ev-modal .ev-reg{padding:0;background:none;border:0;gap:14px}
.ev-modal .ev-reg.frame::before{display:none}
.ev-modal form.ev-reg>.eyebrow{display:none}
.ev-modal form.ev-reg{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.ev-modal form.ev-reg>*{grid-column:1/-1}
.ev-modal form.ev-reg>.field:nth-of-type(1),.ev-modal form.ev-reg>.field:nth-of-type(2){grid-column:auto} /* first + last name side by side */
.ev-modal .field{gap:6px;min-width:0}
.ev-modal .field label{font-size:10px;letter-spacing:.22em}
.ev-modal .input{font-size:16px;padding:12px 14px}
.ev-modal .wf-actions{gap:10px}
.ev-modal .wf-actions .btn{flex:1 1 100%;justify-content:center}
.ev-modal .wl-err:empty{display:none}
@media (max-width:600px){
  .ev-modal{padding:10px}
  .ev-modal__card{max-height:calc(100vh - 20px);max-height:calc(100dvh - 20px)}
  .ev-modal__head{padding:16px 12px 12px 18px}
  .ev-modal__body{padding:16px 18px 20px}
  .ev-modal form.ev-reg{gap:12px}
}
.ev-about{display:grid;gap:16px;color:var(--mist);line-height:1.8}
.ev-about p{margin:0}
.ev-map{width:100%;aspect-ratio:16/10;border:0}
.ev-tiers{display:grid;gap:12px}
.ev-tier{padding:18px;display:grid;gap:12px;border:1px solid var(--gold-faint)}
.ev-tier__row,.ev-tier__opt{display:flex;justify-content:space-between;gap:16px;align-items:flex-start}
.ev-tier__opt{border-top:1px solid var(--gold-faint);padding-top:12px}
.ev-tier small{display:block}
.ev-step{display:flex;align-items:center;gap:10px}
.ev-step .icon-btn{width:36px;height:36px;font-size:18px}
.ev-step .icon-btn:disabled{opacity:.35}
.ev-step [data-qty]{min-width:20px;text-align:center;font-variant-numeric:tabular-nums}
.ev-totals{display:grid;gap:6px;margin:0;color:var(--mist)}
.ev-totals>div{display:flex;justify-content:space-between;gap:16px}
.ev-totals dd{margin:0;font-variant-numeric:tabular-nums}
.ev-total{color:var(--ivory);font-weight:600}

/* news article */
.post-hero .hero__bg{opacity:.45}
.post-wrap{max-width:860px;display:grid;gap:34px}
.post-cover{aspect-ratio:16/9;margin:0}
.post-cover img{width:100%;height:100%;object-fit:cover}
.post-body{font-size:17px;line-height:1.85;color:var(--mist)}
.post-body::after{content:'';display:block;clear:both}
.post-body p,.post-body ul,.post-body ol{margin:0 0 20px}
.post-body ul,.post-body ol{padding-left:1.4em}
.post-body li{margin-bottom:8px}
.post-body h2,.post-body h3,.post-body h4{font-family:var(--f-display);font-weight:400;text-transform:uppercase;letter-spacing:.06em;line-height:1.25;color:var(--gold);margin:44px 0 16px}
.post-body h2{font-size:clamp(17px,1.6vw,21px)}
.post-body h3,.post-body h4{font-size:clamp(15px,1.3vw,17px)}
.post-body>:first-child{margin-top:0}
.post-body em{color:var(--ivory)}
.post-body a{color:var(--amber);text-decoration:underline;text-underline-offset:3px}
.post-body blockquote{clear:both;margin:36px 0;padding:6px 0 6px 24px;border-left:2px solid var(--gold);font-style:italic;font-size:19px;color:var(--ivory)}
.post-body blockquote p{margin:0}
.post-body hr{border:0;border-top:1px solid var(--gold-faint);margin:36px 0}
.post-fig{margin:6px 0 28px}
.post-fig a{display:block;border:1px solid var(--gold-soft);background:#070504;transition:border-color .3s}
.post-fig a:hover{border-color:var(--gold)}
.post-fig img{display:block;width:100%;height:auto}
.post-fig figcaption{margin-top:10px;font-size:10px;line-height:1.6;letter-spacing:.18em}
.post-fig--right{float:right;width:50%;margin:6px 0 20px 32px}
.post-fig--left{float:left;width:50%;margin:6px 32px 20px 0}
@media (max-width:760px){.post-fig--right,.post-fig--left{float:none;width:auto;margin:6px 0 28px}}
.post-gal{clear:both;display:grid;gap:12px;margin:6px 0 28px}
.post-gal__row{display:flex;gap:12px;align-items:flex-start}
.post-gal__item{flex:1 1 0;min-width:0;margin:0}
.post-gal__item a{display:block;border:1px solid var(--gold-soft);background:#070504;transition:border-color .3s}
.post-gal__item a:hover{border-color:var(--gold)}
.post-gal__item img{display:block;width:100%;height:auto}
.post-gal__item figcaption{margin-top:10px;font-size:10px;line-height:1.6;letter-spacing:.18em}
@media (max-width:560px){.post-gal,.post-gal__row{gap:8px}.post-gal__item figcaption{font-size:9px;letter-spacing:.12em}}
.post-table{clear:both;margin:6px 0 28px;overflow-x:auto;border:1px solid var(--gold-soft);background:rgba(7,5,4,.6)}
.post-table table{width:100%;border-collapse:collapse;font-size:15px;line-height:1.5}
.post-table th,.post-table td{padding:12px 18px;text-align:left;vertical-align:top;border-bottom:1px solid var(--gold-faint)}
.post-table tr:last-child td{border-bottom:0}
.post-table th{font-family:var(--f-display);font-weight:400;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);background:rgba(255,170,40,.05)}
.post-table td:first-child{color:var(--ivory);white-space:nowrap}
.post-table p{margin:0}
@media (max-width:560px){.post-table th,.post-table td{padding:10px 12px}.post-table table{font-size:14px}}
.post-foot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:20px;align-items:center;padding-top:26px;border-top:1px solid var(--gold-faint)}
.post-engage{display:flex;gap:16px;align-items:center}
.post-like svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6}
.post-like.is-on svg{fill:var(--amber);stroke:var(--amber)}

@media (max-width:760px){
  .wf--grid{grid-template-columns:1fr}
  .wf--inline{flex-wrap:wrap}
  .wf--inline>.wf-actions{flex-basis:100%}
  .wf--inline>.wf-actions .btn{width:100%;justify-content:center}
  .ev-media img{max-height:45vh}
  .ev-facts{grid-template-columns:1fr}
  .wf-skel--inline{grid-template-columns:1fr}
}

/* Inline YouTube playback inside a .trailer frame (data-yt-inline) */
.trailer.is-playing{cursor:default;background:#000}
.trailer.is-playing::after,.trailer.is-playing>.play,.trailer.is-playing>img{display:none}
.trailer.is-playing iframe{position:absolute;inset:0;width:100%;height:100%;border:0;z-index:3}

/* Video frames sit in front of the ember particles (#embers is z-index 90),
   but stay under the mobile menu (98) and nav (100). */
.trailer{z-index:91}

/* While a video is fullscreen (main.js sets html.fx-off): drop the full-viewport effect layers
   and freeze CSS animations behind it, so the GPU spends every frame on the video. */
html.fx-off #embers,html.fx-off .grain,html.fx-off .ambient{display:none!important}
/* Sections scrolled out of view (main.js): looping animations freeze until they come back */
.is-offscreen,.is-offscreen *,.is-offscreen *::before,.is-offscreen *::after{animation-play-state:paused!important}
/* Phones/tablets (main.js sets html.fx-lite): no full-page blending under the embers, still grain */
html.fx-lite #embers{mix-blend-mode:normal}
html.fx-lite .grain{animation:none}
/* …and no per-frame repaints from the travelling border highlight and gold-text shimmer (both stay, static) */
html.fx-lite .frame::before,html.fx-lite :not(.line)>.gold-text{animation:none} /* a hero title's gold line keeps its rise-in reveal */
/* The mobile menu's radar/scanner/signal loops only run while the menu is open */
body:not(.menu-open) .hudm *,body:not(.menu-open) .hudm *::before,body:not(.menu-open) .hudm *::after{animation-play-state:paused!important}
html.fx-off *,html.fx-off *::before,html.fx-off *::after{animation-play-state:paused!important}

/* Soft page switch (js/mp-router.js): dim the outgoing page while the next one loads */
html.mp-nav main{opacity:.55;transition:opacity .2s}


/* News — featured story carousel (js/mp-blog.js): fits one screen, ‹ › arrows step through posts */
.nf{position:relative}
.nf .news-feature{min-height:0;height:clamp(360px,calc(100vh - var(--nav-h,76px) - 150px),580px)}
.nf .news-feature__img{min-height:0}
.nf .news-feature__body{display:flex;flex-direction:column;justify-content:center;gap:16px;min-height:0;overflow:hidden;padding:clamp(24px,3.4vw,52px);padding-bottom:96px}
.nf__title{font-size:clamp(22px,2.3vw,36px)!important;line-height:1.12;margin:0}
/* Titles are sized from their own box, not the viewport, so a long single word ("KRISHNAMOORTHY",
   ~14em wide in the display face) still fits; break-word only kicks in if even that can't fit. */
.nf .news-feature__body,.post-hero .hero__content{container-type:inline-size}
@supports (width:1cqi){.nf__title{font-size:min(clamp(22px,2.3vw,36px),6.8cqi)!important}.post-hero .h-lg{font-size:min(clamp(30px,4.6vw,66px),6.8cqi)}}
.nf__title,.post-hero .h-lg,.card .h-sm{overflow-wrap:break-word}
.nf__excerpt{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;font-size:clamp(14px,1.05vw,16px);margin:0}
.nf__nav{position:absolute;right:clamp(20px,3vw,44px);bottom:26px;z-index:6;display:flex;align-items:center;gap:14px}
.nf__btn{width:46px;height:46px;background:rgba(10,7,3,.78);color:var(--amber);backdrop-filter:blur(4px)}
.nf__btn:hover{border-color:var(--amber);box-shadow:0 0 22px rgba(255,170,0,.35)}
.nf__btn svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.nf__count{color:var(--mist);min-width:62px;text-align:center}
@keyframes nfInR{from{opacity:0;transform:translateX(28px)}to{opacity:1;transform:none}}
@keyframes nfInL{from{opacity:0;transform:translateX(-28px)}to{opacity:1;transform:none}}
.nf--next .news-feature__img img,.nf--next .news-feature__body>*{animation:nfInR .5s var(--ease) both}
.nf--prev .news-feature__img img,.nf--prev .news-feature__body>*{animation:nfInL .5s var(--ease) both}
@media (max-width:900px){
  .nf .news-feature{height:auto}
  .nf .news-feature__img{aspect-ratio:16/10;max-height:44vh}
  .nf .news-feature__body{padding-bottom:28px}
  .nf__nav{position:static;justify-content:center;margin-top:16px}
}

/* Hero art: sized by the stage's height AND width (container units), so a figure can never be
   wider than its stage — no cut-off hyena on tall/portrait screens (iPad Pro portrait etc.),
   and the layers re-fit by themselves on every orientation change. */
.stage .layer{transition:none!important}
@supports (height:1cqh){
  .hero .stage{container-type:size}
  .stage img.layer--hyena{height:min(54cqh,76cqw)!important;right:12%!important}
  .stage img.layer--sanjay{height:min(84cqh,190cqw)!important}
  .stage img.layer--freya{height:min(80cqh,220cqw)!important}
  @media (min-width:981px) and (max-width:1280px){
    .stage img.layer--hyena{height:min(44cqh,86cqw)!important;right:0!important}
  }
}

/* Store titles always fit their card: edition and merch names wrap inside the card, never past its edges */
#editionsgrid .edition{min-width:0;overflow:hidden}
#editionsgrid .edition .h-md{font-size:clamp(18px,2vw,28px)!important;line-height:1.15;overflow-wrap:anywhere;hyphens:auto;max-width:100%}
#merchgrid .card{min-width:0}
/* Merch cards: one layout for every card — category, title, then the price note and wishlist button
   anchored to the bottom, so they line up across a row however many lines a title takes. */
#merchgrid .card{display:flex;flex-direction:column}
#merchgrid .card__body{flex:1;display:flex;flex-direction:column;align-items:stretch;gap:14px}
#merchgrid .card__body>.hud{margin-bottom:2px}
#merchgrid .product__foot{margin-top:auto;padding-top:8px;flex-direction:column;align-items:flex-start;gap:18px}
#merchgrid .product__foot .price--soon{flex:none;width:100%}
#merchgrid .card .h-sm{overflow-wrap:anywhere;hyphens:auto;max-width:100%}
@media (min-width:981px) and (max-width:1280px){#editionsgrid .edition .h-md{font-size:clamp(17px,1.9vw,24px)!important}}

/* Phones: emblem and title logo side by side; between the story text and the buttons a three-layer
   squad on its own (no text over it), against the right edge: Hyena in front, Dr. Sanjay behind it,
   Freya at the back. The stage copies of those three are hidden on phones (only Lord Kael stays faint). */
.hero-squad-m{display:none}
@media (max-width:600px){
  .hero-brand{flex-direction:row!important;align-items:center;gap:12px}
  .hero-brand__emblem{width:clamp(78px,24vw,104px)!important}
  .hero-brand__title{flex:1 1 0;width:auto!important;max-width:none!important;min-width:0}
  .stage img.layer--hyena,.stage img.layer--sanjay,.stage img.layer--freya{display:none}
  .hero-squad-m{display:block;position:relative;height:clamp(330px,100vw,430px);margin:-4px calc(50% - 50vw) -8px 0;pointer-events:none}
  .hero-squad-m img{position:absolute;bottom:0;height:auto}
  .hero-squad-m .sq-freya{right:-3%;height:100%;filter:brightness(.62) drop-shadow(0 20px 30px rgba(0,0,0,.9))}
  .hero-squad-m .sq-sanjay{right:24%;height:94%;filter:brightness(.8) drop-shadow(0 24px 34px rgba(0,0,0,.92)) drop-shadow(0 0 22px rgba(255,150,0,.18))}
  .hero-squad-m .sq-hyena{right:6%;width:min(78%,330px);filter:drop-shadow(0 30px 40px rgba(0,0,0,.95)) drop-shadow(0 0 30px rgba(255,90,20,.25))}
}/* the faint Lord Kael silhouette behind the group stays inside the stage too */
@supports (height:1cqh){.stage img.layer--kael{right:0!important;height:min(66cqh,200cqw)!important}}


/* ===== Character dossiers: one-screen layout on every device =====
   Text left, art right at every size and orientation; the whole block (label, stage, control deck)
   is sized to the visible viewport under the nav. Type scales off the stage's own box (cq units),
   and as a last resort the text column scrolls inside itself rather than spilling. */
#dossiers{height:calc(100vh - var(--nav-h));height:calc(100svh - var(--nav-h));min-height:300px;padding:clamp(8px,2.2svh,34px) 0;scroll-margin-top:var(--nav-h)}
#dossiers>.wrap{height:100%}
#dossiers .dslider{height:100%;grid-template-rows:auto minmax(0,1fr) auto;gap:clamp(6px,1.6svh,22px)}
#dossiers .dslider__bar{padding-bottom:clamp(4px,1svh,14px)}
#dossiers .dslider__stage{min-height:0;container-type:size}
#dossiers .dslide{height:100%;min-height:0;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(10px,3cqw,80px);align-items:center}
#dossiers .dslide__text{max-height:100%;overflow-y:auto;scrollbar-width:none;gap:clamp(6px,2.6cqh,26px);align-content:center}
#dossiers .dslide__text::-webkit-scrollbar{display:none}
#dossiers .dslide__text .eyebrow{font-size:clamp(9px,min(1.1cqw,2.4cqh),12px);letter-spacing:.32em;flex-wrap:wrap;row-gap:4px}
#dossiers .dslide__text .h-lg{font-size:clamp(13px,min(3.2cqw,9cqh),66px);line-height:1.06;overflow-wrap:break-word}
#dossiers .dslide__text .lead{font-size:clamp(10.5px,min(1.35cqw,3.1cqh),19px);line-height:1.5}
#dossiers .dslide__text .bars{gap:clamp(5px,1.8cqh,16px)}
#dossiers .dslide__text .bar{gap:clamp(3px,.9cqh,8px)}
#dossiers .dslide__text .bar__top{font-size:clamp(9px,min(.95cqw,2.2cqh),12px);letter-spacing:.16em}
#dossiers .dslide .dossier__art{height:100%;min-height:0;place-items:end center}
#dossiers .dslide .dossier__art img{max-height:100%;max-width:100%;height:auto;width:auto}
/* narrow stage (phones in portrait): give the words more room than the art */
@container (max-width:620px){
  #dossiers .dslide{grid-template-columns:minmax(0,1.35fr) minmax(0,.65fr)}
  #dossiers .dslide__text .h-lg{font-size:clamp(12px,min(4cqw,9cqh),40px)}
  #dossiers .dslide__text .lead{font-size:clamp(10.5px,min(2.7cqw,3.1cqh),15px)}
  #dossiers .dslide__text .eyebrow::before{display:none}
}
/* very short viewports (phones in landscape): drop the label row, tighten the deck */
@media (max-height:520px){
  #dossiers .dslider__bar{display:none}
  #dossiers .dslider{grid-template-rows:minmax(0,1fr) auto}
}

/* Control deck: angled sci-fi buttons around a dossier readout, bottom-left under the text column */
.dslider__deck{display:flex;align-items:stretch;gap:clamp(8px,1.2vw,14px);justify-self:start;max-width:100%}
.dk-btn{--c:var(--amber);position:relative;flex:none;width:clamp(48px,6vw,72px);height:clamp(36px,6svh,50px);display:grid;place-items:center;
  background:linear-gradient(180deg,rgba(255,176,0,.16),rgba(255,120,0,.04));
  clip-path:polygon(14px 0,100% 0,100% calc(100% - 14px),calc(100% - 14px) 100%,0 100%,0 14px);
  transition:background .3s,transform .2s var(--ease),filter .3s;overflow:hidden;isolation:isolate}
.dk-btn--next{clip-path:polygon(0 0,calc(100% - 14px) 0,100% 14px,100% 100%,14px 100%,0 calc(100% - 14px))}
/* hairline frame that follows the cut corners */
.dk-btn::before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(135deg,var(--c),rgba(255,176,0,.25) 40%,rgba(255,176,0,.25) 60%,var(--c));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;padding:1px;clip-path:inherit}
/* light sweep */
.dk-btn::after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(100deg,transparent 30%,rgba(255,210,120,.35) 50%,transparent 70%);transform:translateX(-120%);transition:transform .6s var(--ease)}
.dk-btn svg{width:clamp(16px,2vw,22px);height:clamp(16px,2vw,22px);fill:none;stroke:var(--amber-hot);stroke-width:1.9;stroke-linecap:square;filter:drop-shadow(0 0 5px rgba(255,170,0,.8));transition:transform .35s var(--ease)}
.dk-btn:hover{background:linear-gradient(180deg,rgba(255,176,0,.3),rgba(255,120,0,.08));filter:drop-shadow(0 0 10px rgba(255,160,0,.45))}
.dk-btn:hover::after{transform:translateX(120%)}
.dk-btn--prev:hover svg{transform:translateX(-3px)}.dk-btn--next:hover svg{transform:translateX(3px)}
.dk-btn:active{transform:scale(.95)}
.dk-btn:focus-visible{outline:none;filter:drop-shadow(0 0 0 1px var(--amber)) drop-shadow(0 0 10px var(--amber))}
.dk-readout{position:relative;display:grid;grid-template-columns:auto auto;align-items:center;column-gap:14px;row-gap:5px;padding:0 clamp(12px,1.6vw,20px);
  min-width:0;border-top:1px solid rgba(255,176,0,.35);border-bottom:1px solid rgba(255,176,0,.35);
  background:repeating-linear-gradient(0deg,rgba(255,176,0,.035) 0 1px,transparent 1px 3px),rgba(10,7,3,.55)}
.dk-readout::before,.dk-readout::after{content:'';position:absolute;top:-1px;bottom:-1px;width:6px;border:1px solid var(--amber)}
.dk-readout::before{left:0;border-right:0}.dk-readout::after{right:0;border-left:0}
.dk-readout__label{font-family:var(--f-hud);font-size:clamp(8.5px,1.6svh,10.5px);letter-spacing:.38em;text-transform:uppercase;color:var(--gold)}
.dk-readout__count{font-family:var(--f-hud);font-size:clamp(12px,2.4svh,15px);letter-spacing:.14em;color:var(--mist);font-variant-numeric:tabular-nums;justify-self:end}
.dk-readout__count b{color:var(--amber-hot);font-weight:600;text-shadow:0 0 10px rgba(255,170,0,.7)}
.dk-readout__count i{font-style:normal;opacity:.45;margin:0 5px}
.dk-readout .dslider__dots{grid-column:1/-1;justify-content:flex-start;gap:4px}
.dk-readout .ddot{width:clamp(10px,1.6vw,18px);height:3px;clip-path:polygon(2px 0,100% 0,calc(100% - 2px) 100%,0 100%)}
.dk-readout .ddot.active{width:clamp(18px,2.8vw,32px)}
@media (max-height:520px){.dk-readout{row-gap:3px}.dk-readout__label{display:none}}
#dossiers .dslide .dossier__art{order:0}
#dossiers .dossier__ring,#dossiers .dossier__art::before{display:none}
#dossiers .dslider__stage{grid-template-rows:minmax(0,1fr)}
#dossiers .dslide .dossier__art{height:100cqh;max-height:100cqh}
#dossiers .dslide .dossier__art img{max-height:calc(100cqh - 4px)}
#dossiers{min-height:240px}
#dossiers .dslide .dossier__art img{max-height:calc(100cqh - 4px)!important}
/* every figure fills the full stage height, so wide art (Kael's outstretched arm) scales like the rest */
#dossiers .dslide .dossier__art img{height:calc(100cqh - 4px);width:100%;object-fit:contain;object-position:50% 100%}
/* wide art (Hyena-Z4): spans the whole slide behind the text, bottom-right, top level with the title */
/* text keeps the left 48%, the art stays in the right half (bleeding 18% off the edge) so they never overlap */
#dossiers .dslide--wide .dslide__text{grid-area:1/1;position:relative;z-index:1;max-width:48cqw;text-shadow:0 1px 6px rgba(0,0,0,.85)}
#dossiers .dslide--wide .dossier__art{grid-area:1/1/2/3;z-index:0;place-items:end end;overflow:hidden}
#dossiers .dslide--wide .dossier__art img{height:min(88cqh,64cqw);width:auto;max-width:none;object-fit:fill;transform:translateX(18%)}
/* Sci-fi half frame: a cut-corner hairline that glows on the right edge and fades out along the
   top and bottom toward the middle. The ring is an even-odd polygon so it scales with the stage;
   the glow lives on the wrapper because clip-path would cut a filter on the same element. */
#dossiers .dslider__stage{position:relative}
.dframe{position:absolute;inset:-6px -6px -6px 25%;pointer-events:none;z-index:3;filter:drop-shadow(0 0 4px rgba(255,170,0,.9)) drop-shadow(0 0 14px rgba(255,120,0,.55));animation:dframe-pulse 4s ease-in-out infinite}
.dframe::before{content:'';position:absolute;inset:0;
  background:linear-gradient(90deg,transparent 0%,rgba(255,176,0,.25) 35%,rgba(255,190,60,.85) 80%,#ffd27a 100%);
  clip-path:polygon(evenodd,
    0 0,calc(100% - 22px) 0,100% 22px,100% calc(100% - 22px),calc(100% - 22px) 100%,0 100%,0 0,
    0 1.5px,calc(100% - 22.6px) 1.5px,calc(100% - 1.5px) 22.6px,calc(100% - 1.5px) calc(100% - 22.6px),calc(100% - 22.6px) calc(100% - 1.5px),0 calc(100% - 1.5px))}
/* brighter accent ticks on the two cut corners */
.dframe::after{content:'';position:absolute;inset:0;
  background:linear-gradient(#ffd27a,#ffd27a) right 0 top 30px/3px 18% no-repeat,linear-gradient(#ffd27a,#ffd27a) right 0 bottom 30px/3px 18% no-repeat}
@keyframes dframe-pulse{50%{filter:drop-shadow(0 0 6px rgba(255,170,0,1)) drop-shadow(0 0 22px rgba(255,120,0,.7))}}
@media (prefers-reduced-motion:reduce){.dframe{animation:none}}
/* phones: the robot fills the frame from the title line down, starting a quarter in and running off the right edge, behind the text */
@container (max-width:620px){
  #dossiers .dslide--wide .dossier__art{place-items:end start}
  #dossiers .dslide--wide .dossier__art img{height:92cqh;margin-left:24cqw;transform:none}
  #dossiers .dslide--flush .dossier__art{place-items:end end}
  #dossiers .dslide--flush .dossier__art img{margin-left:0}
}
/* flush art (Viper): already cropped at its right side, so it sits on the right edge with no bleed,
   its top level with the title */
#dossiers .dslide--flush .dossier__art img{height:92cqh;transform:none}
/* broad art (Cancer, Striker): a landscape creature, sized by width and anchored bottom-right.
   --ar is the image's width/height, set on the slide, so each creature sizes from its own shape. */
#dossiers .dslide--broad{--ar:1.425}
#dossiers .dslide--broad .dossier__art{place-items:end end}
#dossiers .dslide--broad .dossier__art img{width:min(56cqw,calc(79cqh * var(--ar)));height:auto;transform:none}
/* tablets: as large as fits, top toward the title, still the whole creature */
@container (min-width:621px) and (max-width:1000px){
  #dossiers .dslide--broad .dossier__art img{width:min(100cqw,calc(88cqh * var(--ar)));height:auto}
}
/* phones: only the front (left) half, scaled up to the title line, cut off at the right edge */
@container (max-width:620px){
  #dossiers .dslide--broad .dossier__art{place-items:end start}
  #dossiers .dslide--broad .dossier__art img{height:88cqh;width:auto;margin-left:calc(100cqw - 44cqh * var(--ar))}
}
/* front-half art (Blood Hound), same treatment as Cancer: tablets show the whole creature up to the
   title line on the right edge; phones show only its front (head) half, cut off at the right edge */
@container (min-width:621px) and (max-width:1000px){
  #dossiers .dslide--front .dossier__art img{height:88cqh;width:auto}
}
@container (max-width:620px){
  #dossiers .dslide--front .dossier__art{place-items:end start}
  #dossiers .dslide--front .dossier__art img{height:88cqh;width:auto;margin-left:calc(100cqw - 37cqh)}
}
/* phones: keep the deck clear of the floating OST player in the bottom-right corner */
@media (max-width:700px){
  #dossiers .dslider__deck{max-width:calc(100% - 128px);gap:6px}
  #dossiers .dk-btn{width:42px;height:36px}
  #dossiers .dk-readout{padding:0 10px;column-gap:8px;flex:1 1 auto}
  #dossiers .dk-readout__label{display:none}
  #dossiers .dk-readout__count{justify-self:start;font-size:12px}
  #dossiers .dk-readout .ddot{width:7px}#dossiers .dk-readout .ddot.active{width:14px}
  /* one frame: the deck sits inside the stage under the stats, the text column narrows so the art
     gets real width; the empty last row keeps the art clear of the OST player */
  #dossiers .dslider{grid-template-rows:auto minmax(0,1fr) 36px}
  #dossiers .dslider__stage{grid-area:2/1}
  #dossiers .dslide{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:8px}
  #dossiers .dslide__text{padding-bottom:48px}
  #dossiers .dslider__deck{grid-area:2/1;align-self:end;justify-self:start;z-index:2;width:calc((100% - 8px)*1.1/2);max-width:none}
  #dossiers .dk-btn{width:34px}
  #dossiers .dk-readout{padding:0 6px}
}
@media (max-width:700px) and (max-height:520px){#dossiers .dslider{grid-template-rows:minmax(0,1fr) 0px}#dossiers .dslider__stage,#dossiers .dslider__deck{grid-area:1/1}}
.vcard{margin:0;display:grid;gap:14px;align-content:start}.vcard figcaption{line-height:1.6}

/* ===== Privacy & IP notice (privacy.html) ===== */
.legal-hero .h-lg{max-width:18ch}
.legal-meta{color:var(--mist);letter-spacing:.18em;font-size:10.5px}
.legal{display:grid;grid-template-columns:240px minmax(0,1fr);gap:clamp(30px,5vw,70px);align-items:start}
.legal-toc{position:sticky;top:calc(var(--nav-h) + 24px);display:grid;gap:12px;padding:22px 22px 18px;border-radius:4px;background:linear-gradient(170deg,rgba(255,176,0,.05),rgba(8,6,3,.85))}
.legal-toc ol{margin:0;padding-left:20px;display:grid;gap:8px;color:var(--gold)}
.legal-toc a{color:var(--mist);font-size:14px;line-height:1.4;transition:color .25s}
.legal-toc a:hover{color:var(--amber-hot)}
.legal-body{max-width:76ch;min-width:0;font-size:16px;line-height:1.75;color:var(--mist)}
.legal-body h2{font-family:var(--f-display);font-weight:400;font-size:clamp(20px,2vw,26px);letter-spacing:.06em;text-transform:uppercase;color:var(--amber);
  border-bottom:1px solid var(--gold-faint);padding-bottom:12px;margin:56px 0 18px;scroll-margin-top:calc(var(--nav-h) + 20px)}
.legal-body h2:first-child{margin-top:0}
.legal-body h3{font-family:var(--f-hud);font-size:15px;letter-spacing:.1em;text-transform:uppercase;color:var(--ivory);margin:32px 0 10px;scroll-margin-top:calc(var(--nav-h) + 20px)}
.legal-body p{margin:0 0 14px}
.legal-body strong{color:var(--ivory);font-weight:600}
.legal-body ul{margin:0 0 16px;padding-left:22px}
.legal-body li{margin-bottom:6px}
.legal-body li::marker{color:var(--amber)}
.legal-body a{color:var(--amber-hot);text-decoration:underline;text-underline-offset:3px}
.legal-table{overflow-x:auto;margin:12px 0 16px;border:1px solid var(--gold-faint);border-radius:4px}
.legal-table table{width:100%;border-collapse:collapse;font-size:14.5px}
.legal-table table:has(th:nth-child(3)){min-width:520px}
.legal-table th,.legal-table td{text-align:left;padding:12px 14px;border-bottom:1px solid var(--gold-faint);vertical-align:top}
.legal-table tr:last-child td{border-bottom:0}
.legal-table th{font-family:var(--f-hud);font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);background:rgba(255,176,0,.05)}
.legal-table td:first-child{color:var(--ivory)}
.legal-callout{background:rgba(255,176,0,.06);border-left:2px solid var(--amber);padding:16px 20px;margin:16px 0 8px}
.legal-contact{display:grid;grid-template-columns:auto 1fr;gap:10px 22px;margin:12px 0 16px;padding:20px 22px;border-radius:4px;background:rgba(8,6,3,.6)}
.legal-contact dt{font-family:var(--f-hud);font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);padding-top:4px}
.legal-contact dd{margin:0;color:var(--ivory);overflow-wrap:anywhere}
.legal-fine{margin-top:48px!important;font-size:13px;color:var(--dim)}
.footer__bottom a{color:inherit;text-decoration:underline;text-underline-offset:3px}
.footer__bottom a:hover{color:var(--amber-hot)}
@media (max-width:900px){.legal{grid-template-columns:minmax(0,1fr)}.legal-toc{position:static}}
@media (max-width:600px){.legal-contact{grid-template-columns:1fr;gap:4px}.legal-contact dd{margin-bottom:10px}.legal-body{font-size:15px}}

/* Footer: Investment Inquiries block (under the brand) */
.footer__invest{display:grid;gap:10px;max-width:40ch;margin-top:18px;font-size:14px;line-height:1.6}
.footer__invest h4{margin:0;font-family:var(--f-hud);font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--amber)}
.footer__invest p{margin:0}
.footer__invest dl{display:grid;grid-template-columns:auto 1fr;gap:4px 14px;margin:2px 0}
.footer__invest dt{font-family:var(--f-hud);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);padding-top:3px;white-space:nowrap}
.footer__invest dd{margin:0;color:var(--ivory)}
.footer__invest a{color:var(--amber-hot)}
.footer__invest a:hover{text-decoration:underline;text-underline-offset:3px}
@media (max-width:480px){.footer__invest dl{grid-template-columns:1fr;gap:0}.footer__invest dd{margin-bottom:6px}}

/* Home Dispatch banner: the full poster (uncropped, lorry included) beside the sign-up column */
.cta-poster{position:relative;display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);align-items:stretch;border-radius:4px;overflow:hidden;
  background:linear-gradient(90deg,#0a0705,#050403)}
.cta-poster__art{display:block;width:100%;height:auto;aspect-ratio:1448/972;object-fit:contain}
.cta-poster__art{-webkit-mask-image:linear-gradient(90deg,#000 86%,transparent);mask-image:linear-gradient(90deg,#000 86%,transparent)}
.cta-poster__body{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:20px;padding:clamp(28px,3.5vw,56px) clamp(24px,3.5vw,56px) clamp(28px,3.5vw,56px) clamp(10px,1.5vw,24px)}
.cta-poster__body .lead{margin:0;max-width:34ch}
.cta-poster__body .wf-host{width:100%}
.cta-poster__body .wf--inline{flex-direction:column;align-items:stretch}
.cta-poster__body .wf--inline .btn{justify-content:center}
@media (max-width:900px){
  .cta-poster{grid-template-columns:1fr}
  .cta-poster__art{-webkit-mask-image:linear-gradient(180deg,#000 85%,transparent);mask-image:linear-gradient(180deg,#000 85%,transparent)}
  .cta-poster__body{padding:6px 22px 30px;align-items:stretch;text-align:left}
  .cta-poster__body .lead{max-width:none}
}

/* ===== Phones & tablets: keep GPU memory low (fixes iOS Safari "page reloads by itself") =====
   will-change on a big element forces a GPU layer, and every element painted above it then needs its
   own layer too ("layer explosion", ~570 MB on a 3x iPhone for the home page). On touch screens these
   elements don't animate (no parallax, no tilt), so the hints only cost memory. */
@media (hover:none),(max-width:900px){
  .hero__bg,.stage .layer,[data-tilt],.wgal__track img,.arsenal__grid i::before,.wgal__edges i::before{will-change:auto}
  [data-tilt]{transform-style:flat}
  .glow-orb,.grain{display:none}
  .stage{transform-style:flat}
  /* masks are rendered full-size off-screen by Safari: swap the hero fades for one plain gradient */
  .hero__bg,.hero__bg--statue,.hero .stage,.hero__canvas,.mission-bg__img,.hudm__grid{-webkit-mask-image:none!important;mask-image:none!important}
  .hero::after{content:'';position:absolute;left:0;right:0;bottom:0;height:28%;z-index:0;pointer-events:none;background:linear-gradient(180deg,transparent,#050403)}
  .hero-brand__emblem{animation:none}
  /* the fixed ambient glow pushed the whole page into an extra full-height layer: on phones it sits at the top and scrolls */
  .ambient{position:absolute;height:100vh;height:100lvh}
  .ambient::after{-webkit-mask-image:none;mask-image:none;opacity:.04}
}

/* ===== Sneak Peek: in-game shots viewer (home, under the marquee) =====
   Frame + toolbar + thumbnail rail sized so the whole viewer fits one screen: the frame's width is
   capped by the viewport height (16:9), never below a readable minimum. */
.shots-sec{--shot-w:min(100%,max(520px,calc((100svh - 400px) * 16 / 9)));position:relative;padding:clamp(48px,7vw,96px) 0}
/* the title is always exactly as wide as the viewer: one line, font size from the head's width
   ("SNEAK PEEK: IN GAME DEVELOPMENT SHOTS" in Michroma is 33.09em wide at .02em tracking → 100cqi/33.6) */
.shots-head{width:var(--shot-w);margin:0 auto clamp(20px,3vw,36px);container-type:inline-size}
.shots-head .h-lg{font-size:2.97cqi;letter-spacing:.02em;white-space:nowrap;line-height:1.1}
.shotv{position:relative;width:var(--shot-w);margin:0 auto;display:grid;gap:12px;outline:none}
.shotv__frame{position:relative;aspect-ratio:16/9;background:#050403;box-shadow:0 30px 80px rgba(0,0,0,.6),0 0 60px rgba(255,150,0,.06)}
/* sweeping outline: a faint full border plus two light streaks running round it */
.shotv__sweep{position:absolute;inset:-1px;width:calc(100% + 2px);height:calc(100% + 2px);overflow:visible;pointer-events:none;z-index:4;filter:drop-shadow(0 0 6px rgba(255,176,0,.75))}
.shotv__sweep rect{fill:none}
.shotv__sweep .base{stroke:var(--gold-soft);stroke-width:1}
.shotv__sweep .run{stroke:var(--amber-hot);stroke-width:2;stroke-linecap:round;stroke-dasharray:110 890;animation:shotSweep 7s linear infinite}
.shotv__sweep .run--b{animation-delay:-3.5s;stroke:var(--amber)}
@keyframes shotSweep{from{stroke-dashoffset:1000}to{stroke-dashoffset:0}}
.shotv__c{position:absolute;width:22px;height:22px;z-index:5;pointer-events:none;border:2px solid var(--amber)}
.shotv__c--tl{top:-6px;left:-6px;border-right:0;border-bottom:0}
.shotv__c--tr{top:-6px;right:-6px;border-left:0;border-bottom:0}
.shotv__c--bl{bottom:-6px;left:-6px;border-right:0;border-top:0}
.shotv__c--br{bottom:-6px;right:-6px;border-left:0;border-top:0}
.shotv__view{position:absolute;inset:0;overflow:hidden;touch-action:pan-y;cursor:zoom-in;user-select:none;-webkit-user-select:none}
.shotv.is-zoomed .shotv__view{touch-action:none;cursor:grab}
.shotv.is-zoomed .shotv__view:active{cursor:grabbing}
.shotv__view img{width:100%;height:100%;object-fit:contain;transform-origin:50% 50%;will-change:transform;-webkit-user-drag:none;
  transition:opacity .28s var(--ease),filter .28s var(--ease)}
.shotv.is-swap .shotv__view img{opacity:0;filter:blur(6px) brightness(1.6)}
.shotv.is-dragging .shotv__view img{transition:none}
/* scanline sweep on each new shot */
.shotv__scan{position:absolute;inset:0;pointer-events:none;z-index:2;background:repeating-linear-gradient(0deg,rgba(0,0,0,.18) 0 1px,transparent 1px 3px);opacity:.35}
.shotv__scan::after{content:'';position:absolute;left:0;right:0;height:18%;top:-18%;background:linear-gradient(180deg,transparent,rgba(255,176,0,.16),transparent)}
.shotv.is-swap .shotv__scan::after{animation:none}
.shotv:not(.is-swap) .shotv__scan::after{animation:shotScan .9s var(--ease) 1}
@keyframes shotScan{from{top:-18%}to{top:100%}}
.shotv__hud{position:absolute;left:0;right:0;top:0;z-index:3;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 16px;pointer-events:none;
  background:linear-gradient(180deg,rgba(0,0,0,.6),transparent)}
.shotv__hud span{display:inline-flex;align-items:center;gap:8px}
.shotv__hud b{color:var(--amber-hot);font-weight:600}
.shotv__side{position:absolute;top:50%;z-index:6;width:48px;height:76px;margin-top:-38px;display:grid;place-items:center;color:var(--ivory);
  background:rgba(8,6,3,.55);border:1px solid var(--gold-soft);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
  clip-path:polygon(0 12px,12px 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%);opacity:.75;transition:opacity .3s,background .3s,color .3s,border-color .3s}
.shotv__side--prev{left:14px}.shotv__side--next{right:14px}
.shotv__side:hover,.shotv__side:focus-visible{opacity:1;color:var(--amber-hot);border-color:var(--amber);background:rgba(255,176,0,.12)}
.shotv__side svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8}
.shotv.is-zoomed .shotv__side{opacity:0;pointer-events:none}
.shotv__progress{position:absolute;left:0;right:0;bottom:0;height:2px;z-index:6;background:rgba(255,176,0,.12);pointer-events:none}
.shotv__progress i{display:block;height:100%;background:linear-gradient(90deg,var(--amber-deep),var(--amber-hot));transform:scaleX(0);transform-origin:0 50%;box-shadow:0 0 10px var(--amber)}
/* toolbar */
.shotv__bar{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 10px;border:1px solid var(--gold-faint);
  background:linear-gradient(90deg,rgba(255,176,0,.05),rgba(10,8,6,.7) 30%,rgba(10,8,6,.7) 70%,rgba(255,176,0,.05))}
.shotv__grp{display:flex;align-items:center;gap:6px}
.shotv__btn{width:40px;height:40px;display:grid;place-items:center;color:var(--ivory);border:1px solid var(--gold-soft);background:rgba(255,176,0,.03);
  clip-path:polygon(0 8px,8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%);transition:color .25s,background .25s,border-color .25s}
.shotv__btn:hover,.shotv__btn:focus-visible{color:var(--amber-hot);border-color:var(--amber);background:rgba(255,176,0,.14)}
.shotv__btn:focus-visible,.shotv__side:focus-visible,.shotv__thumb:focus-visible{outline:2px solid var(--amber-hot);outline-offset:2px}
.shotv__btn svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.shotv__btn:disabled{opacity:.35}
.shotv__btn .i-pause,.shotv.is-playing .shotv__btn .i-play,.shotv__btn .i-exit,.shotv.is-full .shotv__btn .i-enter{display:none}
.shotv.is-playing .shotv__btn .i-pause,.shotv.is-full .shotv__btn .i-exit{display:block}
.shotv__count{font-family:var(--f-display);font-size:clamp(13px,1.3vw,17px);letter-spacing:.12em;color:var(--ivory);white-space:nowrap}
.shotv__count b{color:var(--amber-hot);font-weight:400}
.shotv__count small{color:var(--dim);font-size:.75em}
.shotv__zoom{min-width:52px;text-align:center;font-family:var(--f-hud);font-size:12px;letter-spacing:.12em;color:var(--gold)}
/* thumbnail rail */
.shotv__thumbs{position:relative;display:flex;gap:8px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity;padding:4px 2px 8px;
  scrollbar-width:thin;scrollbar-color:var(--gold-soft) transparent;-webkit-mask-image:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent);mask-image:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent)}
.shotv__thumb{position:relative;flex:0 0 auto;width:clamp(84px,9vw,118px);aspect-ratio:16/9;scroll-snap-align:center;border:1px solid var(--gold-faint);opacity:.5;
  transition:opacity .3s,border-color .3s,transform .3s var(--ease);overflow:hidden}
.shotv__thumb img{width:100%;height:100%;object-fit:cover;background:var(--char)}
.shotv__thumb span{position:absolute;left:4px;bottom:3px;font-family:var(--f-hud);font-size:9px;letter-spacing:.1em;color:var(--ivory);text-shadow:0 1px 3px #000}
.shotv__thumb:hover{opacity:.85}
.shotv__thumb[aria-current="true"]{opacity:1;border-color:var(--amber);box-shadow:inset 0 0 0 1px var(--amber),0 0 14px rgba(255,176,0,.35)}
/* fullscreen (native, or a fixed overlay where element fullscreen is unavailable, e.g. iPhone) */
html.shotv-lock{overflow:hidden}
.shotv.is-full{position:fixed;inset:0;z-index:2000;width:auto;margin:0;padding:clamp(10px,2vw,24px);background:#030201;
  grid-template-rows:minmax(0,1fr) auto auto;align-content:stretch}
.shotv.is-full .shotv__frame{aspect-ratio:auto;min-height:0}
.shotv.is-full .shotv__c{display:none}
.shotv:fullscreen{width:100%;max-width:none}
@media (max-width:760px){
  .shots-sec{--shot-w:100%}
  .shotv{gap:10px}
  .shotv__side{display:none}
  .shotv__hud{padding:8px 10px;font-size:9px}
  .shotv__hud .hide-sm,.shotv__zoom,.shotv [data-shotv-act="zout"],.shotv [data-shotv-act="zin"]{display:none}
  .shotv__bar{padding:6px}
  .shotv__btn{width:38px;height:38px}
  .shotv__c{width:16px;height:16px}
}
@media (max-width:380px){.shotv__grp{gap:4px}.shotv__btn{width:34px;height:34px}}
/* phones on their side: let the shot take the screen height */
@media (max-height:500px) and (orientation:landscape){.shots-sec{--shot-w:min(100%,calc((100svh - 120px) * 16 / 9))}.shotv__thumbs{display:none}}
@media (prefers-reduced-motion:reduce){
  .shotv__sweep .run{animation:none;stroke-dasharray:none;opacity:.25}
  .shotv__scan::after{display:none}
  .shotv__view img{transition:none}
}