/* FORJA — landing page
   Layout concept: a night forge. One dark olive ground, full-bleed bands separated by ruler rails,
   phones float on the rails; headlines are condensed uppercase, labels are monospace stamps. */
:root{
  --bg:#0a0b09; --bg-2:#0f110e; --bg-3:#151914; --bg-4:#1b201a;
  --line:#242c1e; --line-2:#36422c;
  --fg:#f1eee4; --fg-2:#b9bfae; --muted:#7f886f;
  --olive:#8ea26f; --olive-2:#6b7f55; --olive-3:#3d4a32; --olive-4:#1d2419;
  --ember:#f29b3c; --gold:#f5c66a; --ember-deep:#8a3b16;
  --font-display:"Barlow Condensed","Arial Narrow","Roboto Condensed",Impact,sans-serif;
  --font-body:"Barlow",system-ui,"Segoe UI",Roboto,sans-serif;
  --font-mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --gutter-l:max(16px, env(safe-area-inset-left, 0px));
  --gutter-r:max(16px, env(safe-area-inset-right, 0px));
  --container:1180px;
  --radius:14px;
  color-scheme:dark;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
section[id],article[id]{scroll-margin-top:80px}
body{
  margin:0;background:var(--bg);color:var(--fg);
  font-family:var(--font-body);font-size:17px;line-height:1.55;
  overflow-x:hidden;
}
img,video,svg{max-width:100%;display:block}
a{color:inherit}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
::selection{background:var(--olive-2);color:var(--fg)}
h1,h2,h3{font-family:var(--font-display);text-transform:uppercase;line-height:.94;margin:0;text-wrap:balance;letter-spacing:-.005em}
p{margin:0}
.container{width:100%;max-width:var(--container);margin-inline:auto;padding-left:var(--gutter-l);padding-right:var(--gutter-r)}
.grain{position:fixed;inset:0;pointer-events:none;z-index:40;opacity:.07;mix-blend-mode:screen;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .9 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
  background-size:160px 160px}

/* ---------- utilities ---------- */
.eyebrow{font-family:var(--font-mono);font-size:.74rem;letter-spacing:.2em;text-transform:uppercase;color:var(--olive);display:inline-flex;align-items:center;gap:.6em}
.stamp{display:inline-block;font-family:var(--font-mono);font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:var(--olive);
  border:1.5px solid var(--olive-3);padding:.45em .9em;border-radius:4px;transform:rotate(-1.6deg);box-shadow:0 0 0 1px rgba(0,0,0,.4) inset;background:rgba(10,11,9,.55)}
.stamp.hot{color:var(--gold);border-color:#5a4423}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.6em;font-family:var(--font-display);font-weight:700;text-transform:uppercase;letter-spacing:.06em;
  font-size:1.15rem;line-height:1;padding:1em 1.6em;border-radius:12px;text-decoration:none;transition:transform .2s ease,box-shadow .2s ease,background .2s;white-space:nowrap}
.btn-primary{background:linear-gradient(180deg,#9ab07a,#67794f);color:#0c0f0a;box-shadow:0 10px 30px -10px rgba(142,162,111,.55),0 0 0 1px #4d5c3e inset}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 16px 36px -12px rgba(142,162,111,.7),0 0 0 1px #5e7050 inset}
.btn-ghost{color:var(--fg);box-shadow:0 0 0 1.5px var(--line-2) inset;background:rgba(15,17,14,.6)}
.btn-ghost:hover{box-shadow:0 0 0 1.5px var(--olive) inset;transform:translateY(-2px)}
.btn svg{width:1.15em;height:1.15em;flex:none}
.btn.is-soon{background:var(--bg-3);color:var(--fg-2);box-shadow:0 0 0 1.5px var(--line-2) inset;cursor:default}
.btn.is-soon:hover{transform:none;box-shadow:0 0 0 1.5px var(--line-2) inset}
.btn.is-soon svg{display:none}
.rail{height:1px;background:
  repeating-linear-gradient(90deg,var(--line-2) 0 1px,transparent 1px 24px) 0 0/100% 100%;position:relative}
.rail::after{content:"";position:absolute;left:0;right:0;top:-5px;height:1px;background:var(--line);opacity:.6}
.muted{color:var(--muted)}
.hidden-rtl{display:none}
[data-lang-only]{display:none}
html[lang="ro"] [data-lang-only="ro"],html[lang="en"] [data-lang-only="en"]{display:revert}

/* ---------- nav ---------- */
.nav{position:sticky;top:env(safe-area-inset-top,0px);z-index:30;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  background:linear-gradient(180deg,rgba(10,11,9,.92),rgba(10,11,9,.72));border-bottom:1px solid var(--line)}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:31;background:var(--bg)}
.nav-inner{display:flex;align-items:center;gap:1rem;min-height:66px}
.brand{display:inline-flex;align-items:center;gap:.6rem;text-decoration:none;font-family:var(--font-display);font-weight:800;font-size:1.5rem;letter-spacing:.08em}
.brand .logo{width:30px;height:36px}
.nav-links{display:flex;gap:1.6rem;margin-left:auto;font-family:var(--font-mono);font-size:.76rem;letter-spacing:.14em;text-transform:uppercase}
.nav-links a{text-decoration:none;color:var(--fg-2);padding:.4em 0;border-bottom:1px solid transparent}
.nav-links a:hover{color:var(--fg);border-color:var(--olive)}
.lang{display:inline-flex;border:1px solid var(--line-2);border-radius:8px;overflow:hidden;font-family:var(--font-mono);font-size:.72rem;letter-spacing:.12em}
.lang button{padding:.5em .75em;color:var(--muted)}
.lang button[aria-pressed="true"]{background:var(--olive-4);color:var(--fg)}
.nav .btn{font-size:.95rem;padding:.75em 1.1em}
.nav-cta-mobile{display:none}
@media (max-width:860px){
  .nav-links{display:none}
  .nav .btn-primary{display:none}
  .nav-cta-mobile{display:inline-flex}
}

/* ---------- hero ---------- */
.hero{position:relative;overflow:hidden;isolation:isolate;padding-block:clamp(2.5rem,6vw,5rem) clamp(2rem,5vw,4rem)}
.hero-canvas,.hero-video{position:absolute;inset:0;width:100%;height:100%;z-index:-2}
.hero-video{object-fit:cover;opacity:0;transition:opacity 1.2s ease;z-index:-3}
.hero-video.on{opacity:.38}
.hero::after{content:"";position:absolute;inset:auto 0 0 0;height:160px;background:linear-gradient(180deg,transparent,var(--bg));z-index:-1;pointer-events:none}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(1.5rem,4vw,4rem);align-items:center}
.hero-copy{min-width:0;display:flex;flex-direction:column;gap:1.4rem;align-items:flex-start}
.hero h1{font-size:clamp(3.2rem,7.4vw,7rem);font-weight:800;letter-spacing:-.01em}
.hero h1 .accent{color:var(--olive);position:relative;display:inline-block}
.hero h1 .ember{background:linear-gradient(90deg,var(--gold),var(--ember) 60%,#d9743a);-webkit-background-clip:text;background-clip:text;color:transparent}
.lead{font-size:clamp(1.05rem,1.6vw,1.3rem);color:var(--fg-2);max-width:34em;line-height:1.5}
.cta-row{display:flex;flex-wrap:wrap;gap:.8rem;align-items:center}
.hero-note{font-family:var(--font-mono);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--fg-2);text-shadow:0 1px 8px rgba(0,0,0,.8)}
.hero-stage{position:relative;min-width:0;display:flex;justify-content:center;align-items:center;padding-block:1.5rem;padding-left:8%}
.mascot{position:absolute;width:clamp(120px,14vw,180px);bottom:-10px;left:-6%;z-index:3;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:.3rem;filter:drop-shadow(0 14px 24px rgba(0,0,0,.6));transform-origin:50% 100%;animation:mascot-bob 5s ease-in-out infinite}
.mascot .doll{width:100%}
.hero-rank{display:inline-flex;align-items:center;gap:.4em;font-family:var(--font-mono);font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);background:rgba(10,11,9,.75);border:1px solid #5a4423;border-radius:4px;padding:.35em .7em;white-space:nowrap}
.hero-rank svg{width:14px;height:14px}
.hero-rank.tick{animation:rank-tick .5s cubic-bezier(.2,.8,.2,1)}
@keyframes rank-tick{0%{transform:translateY(6px) scale(.9);opacity:0}100%{transform:none;opacity:1}}
@keyframes mascot-bob{0%,100%{transform:translateY(0) rotate(-3deg)}50%{transform:translateY(-8px) rotate(2deg)}}
.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;margin-top:clamp(2rem,5vw,4rem)}
.stat{background:rgba(15,17,14,.85);padding:1.1rem 1.2rem;display:flex;flex-direction:column;gap:.2rem;min-width:0}
.stat b{font-family:var(--font-display);font-size:2.2rem;font-weight:700;line-height:1;color:var(--fg);font-variant-numeric:tabular-nums}
.stat span{font-family:var(--font-mono);font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
@media (max-width:900px){
  .hero-grid{grid-template-columns:1fr}
  .hero-stage{order:2;padding-top:0}
  .stats{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* ---------- phone (CSS 3D) ---------- */
.scene{perspective:1400px;perspective-origin:50% 40%}
.phone{--ry:0deg;--rx:0deg;--tz:0px;--ty:0px;position:relative;width:min(300px,70vw);aspect-ratio:540/1084;margin:0 auto;
  transform-style:preserve-3d;transform:translateY(var(--ty)) rotateY(var(--ry)) rotateX(var(--rx)) translateZ(var(--tz));transition:transform .12s linear;will-change:transform}
.phone.lg{width:min(320px,74vw)}
.phone.sm{width:min(270px,64vw)}
.phone-layer{position:absolute;inset:0;border-radius:11.5%/5.7%;background:#0d100c;transform:translateZ(-18px);box-shadow:0 0 0 1px #2a3125}
.phone-layer.mid{transform:translateZ(-9px);background:#141813}
.phone-body{position:absolute;inset:0;border-radius:11.5%/5.7%;background:linear-gradient(160deg,#242a21,#0f120e 55%,#1b201a);
  box-shadow:0 0 0 1px #3a4431,0 30px 60px -20px rgba(0,0,0,.9),0 0 80px -20px rgba(142,162,111,.35);transform:translateZ(0);overflow:hidden}
.phone-body::before{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 2px rgba(255,255,255,.05),inset 0 1px 0 rgba(255,255,255,.14)}
.phone-screen{position:absolute;inset:2.6% 3.6%;border-radius:8.5%/4.3%;overflow:hidden;background:#0a0a0a}
.phone-screen video,.phone-screen img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.phone-screen img{z-index:1;transition:opacity .4s}
.phone-screen.playing img{opacity:0}
.phone-notch{position:absolute;top:4.2%;left:50%;width:7.5%;aspect-ratio:1;transform:translateX(-50%);border-radius:50%;background:#050605;box-shadow:0 0 0 2px rgba(255,255,255,.03);z-index:2}
.phone-gloss{position:absolute;inset:0;border-radius:inherit;background:linear-gradient(115deg,rgba(255,255,255,.14) 0%,rgba(255,255,255,.03) 28%,transparent 45%,transparent 70%,rgba(255,255,255,.04));pointer-events:none;z-index:3;transform:translateZ(1px)}
.phone-btn{position:absolute;right:-1.6%;width:1.6%;height:9%;top:22%;background:#2b332a;border-radius:0 2px 2px 0;transform:translateZ(-6px)}
.phone-btn.b2{top:34%;height:6%;right:auto;left:-1.6%;border-radius:2px 0 0 2px}
.phone-btn.b3{top:42%;height:6%;right:auto;left:-1.6%;border-radius:2px 0 0 2px}
.phone-shadow{position:absolute;left:10%;right:10%;bottom:-9%;height:10%;border-radius:50%;background:radial-gradient(closest-side,rgba(0,0,0,.75),transparent);filter:blur(6px);transform:translateZ(-40px)}
@media (prefers-reduced-motion:reduce){.phone{transition:none}.mascot{animation:none}}

/* ---------- marquee ---------- */
.marquee{border-block:1px solid var(--line);background:var(--bg-2);overflow:hidden;padding-block:.9rem}
.marquee-track{display:flex;gap:3rem;width:max-content;animation:marquee 70s linear infinite;font-family:var(--font-display);font-size:1.35rem;text-transform:uppercase;letter-spacing:.02em;color:var(--fg-2);white-space:nowrap}
.marquee-track span{display:inline-flex;align-items:center;gap:3rem}
.marquee-track i{font-style:normal;color:var(--ember);font-size:.9em}
.marquee:hover .marquee-track{animation-play-state:paused}
@keyframes marquee{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.marquee-track{animation:none;width:auto;flex-wrap:wrap;white-space:normal}}

/* ---------- sections ---------- */
.section{padding-block:clamp(3.5rem,8vw,7rem)}
.section-head{display:flex;flex-direction:column;gap:1rem;align-items:flex-start;max-width:46rem;margin-bottom:clamp(2rem,5vw,3.5rem)}
.section-head h2{font-size:clamp(2.4rem,5.6vw,4.6rem);font-weight:700}
.section-head p{color:var(--fg-2);font-size:1.1rem;max-width:36em}

/* ---------- modules ---------- */
.module{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(2rem,5vw,5rem);align-items:center;padding-block:clamp(2.5rem,6vw,5rem);position:relative}
.module + .module{border-top:1px solid var(--line)}
.module:nth-child(even) .module-stage{order:-1}
.module-copy{min-width:0;display:flex;flex-direction:column;gap:1.2rem;align-items:flex-start}
.module-copy h3{font-size:clamp(2.1rem,4.4vw,3.6rem);font-weight:700}
.module-copy p{color:var(--fg-2);max-width:32em;font-size:1.08rem}
.chips{display:flex;flex-wrap:wrap;gap:.5rem}
.chip{font-family:var(--font-mono);font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--fg-2);border:1px solid var(--line-2);padding:.5em .8em;border-radius:6px;background:var(--bg-2)}
.chip.cmd{font-family:var(--font-body);text-transform:none;letter-spacing:0;font-size:.92rem;color:var(--olive);border-color:var(--olive-3);background:var(--olive-4);display:inline-flex;align-items:center;gap:.45em}
.chip.cmd::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--olive);box-shadow:0 0 8px var(--olive)}
.mission-tag{display:inline-flex;align-items:center;gap:.6em;font-family:var(--font-mono);font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;color:var(--gold)}
.mission-tag::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--gold);box-shadow:0 0 12px var(--gold)}
.module-stage{position:relative;min-width:0;display:grid;place-items:center;padding-block:1rem}
.module-stage::before{content:attr(data-word);position:absolute;inset:0;display:grid;place-items:center;font-family:var(--font-display);font-weight:800;text-transform:uppercase;font-size:clamp(4.5rem,11vw,10.5rem);line-height:1;letter-spacing:.02em;color:transparent;-webkit-text-stroke:1px rgba(142,162,111,.32);pointer-events:none;z-index:0;white-space:nowrap;overflow:hidden;user-select:none}
.module-stage.has-video::before{display:none}
.module-stage .people{position:absolute;inset:4% 0;border-radius:var(--radius);z-index:0}
.module-stage .scene{position:relative;z-index:1}
.module-num{position:absolute;top:0;left:0;font-family:var(--font-mono);font-size:.72rem;letter-spacing:.2em;color:var(--muted)}
@media (max-width:900px){
  .module{grid-template-columns:1fr}
  .module:nth-child(even) .module-stage{order:0}
}

/* ---------- people video slots (fallback = quote poster) ---------- */
.people{position:relative;overflow:hidden;border-radius:var(--radius);background:var(--bg-3);border:1px solid var(--line);aspect-ratio:16/10;min-height:220px}
.people video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .9s}
.people.has-video video{opacity:1}
.people.has-video .poster{opacity:0}
.people .poster{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;gap:.6rem;padding:1.4rem;transition:opacity .6s;
  background:radial-gradient(120% 90% at 20% 0%,rgba(142,162,111,.18),transparent 60%),radial-gradient(90% 70% at 100% 100%,rgba(242,155,60,.14),transparent 60%),linear-gradient(180deg,#121510,#0b0d0a)}
.people .poster::before{content:"";position:absolute;inset:0;background-image:
  repeating-linear-gradient(0deg,transparent 0 23px,rgba(255,255,255,.035) 23px 24px),repeating-linear-gradient(90deg,transparent 0 23px,rgba(255,255,255,.035) 23px 24px)}
.people .poster q{font-family:var(--font-display);font-size:clamp(1rem,1.35vw,1.45rem);text-transform:uppercase;line-height:1.02;color:var(--fg);quotes:"„" "”";position:relative;text-wrap:balance}
.people .poster small{font-family:var(--font-mono);font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:var(--olive);position:relative}
.people .play{position:absolute;top:1rem;right:1rem;width:40px;height:40px;border-radius:50%;border:1px solid var(--line-2);display:grid;place-items:center;color:var(--fg-2);background:rgba(10,11,9,.6)}
.module-stage .people{aspect-ratio:auto;min-height:0;opacity:.9}
.module-stage .people .poster{display:none}
.module-stage .people:not(.has-video){background:transparent;border-color:transparent}

/* ---------- field (people grid) ---------- */
.field-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem}
.field-grid .people{aspect-ratio:9/13;min-height:0}
@media (max-width:1000px){.field-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.field-grid{grid-template-columns:1fr 1fr;gap:.6rem}.field-grid .people{aspect-ratio:4/5}.people .poster{padding:.9rem;gap:.4rem}.people .poster q{font-size:1rem}}

/* ---------- missions ---------- */
.missions{background:var(--bg-2);border-block:1px solid var(--line)}
.missions-layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:clamp(1.5rem,4vw,3rem);align-items:start}
.mission-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(188px,1fr));gap:.6rem}
.mission{display:flex;align-items:center;gap:.8rem;padding:.9rem 1rem;border:1px solid var(--line-2);border-radius:12px;background:var(--bg-3);text-align:left;transition:transform .15s,border-color .2s,background .2s;min-width:0}
.mission:hover{transform:translateY(-2px);border-color:var(--olive-2)}
.mission .ic{width:38px;height:38px;border-radius:10px;border:1px solid var(--line-2);display:grid;place-items:center;flex:none;color:var(--olive);background:var(--bg-2)}
.mission .ic svg{width:20px;height:20px}
.mission b{display:block;font-family:var(--font-body);font-weight:600;font-size:.95rem;line-height:1.1}
.mission>span:last-child{min-width:0}
.mission small{font-family:var(--font-mono);font-size:.68rem;letter-spacing:.1em;color:var(--gold)}
.mission[aria-pressed="true"]{background:var(--olive-4);border-color:var(--olive)}
.mission[aria-pressed="true"] .ic{background:var(--olive);color:#0b0d08;border-color:var(--olive)}
.report{position:sticky;top:90px;border:1px solid var(--line-2);border-radius:var(--radius);background:var(--bg-3);padding:1.3rem;display:flex;flex-direction:column;gap:1rem}
.report .big{font-family:var(--font-display);font-size:3.4rem;font-weight:700;line-height:1;font-variant-numeric:tabular-nums}
.report .big small{font-size:1rem;font-family:var(--font-mono);letter-spacing:.14em;color:var(--muted);margin-left:.4em;font-weight:400}
.bar{height:8px;border-radius:99px;background:var(--bg);border:1px solid var(--line);overflow:hidden}
.bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--olive-2),var(--olive));transition:width .6s cubic-bezier(.2,.8,.2,1)}
.report-row{display:flex;justify-content:space-between;gap:1rem;font-family:var(--font-mono);font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
@media (max-width:900px){.missions-layout{grid-template-columns:1fr}.report{position:static}}

/* ---------- doll (Casca paper-doll) ---------- */
.doll{display:block;width:100%;height:auto;overflow:visible}
.doll.pop{animation:doll-pop .55s cubic-bezier(.2,.9,.2,1.2)}
@keyframes doll-pop{0%{transform:scale(.94) translateY(6px)}60%{transform:scale(1.03) translateY(-4px)}100%{transform:none}}
.report-doll{width:96px;align-self:center;filter:drop-shadow(0 8px 14px rgba(0,0,0,.6))}

/* ---------- cazarma ---------- */
.cazarma{background:
  radial-gradient(60% 50% at 50% 0%,rgba(142,162,111,.10),transparent 70%),var(--bg)}
.cz-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(1.5rem,4vw,3.5rem);align-items:start}
.cz-stage{min-width:0;border:1px solid var(--line-2);border-radius:var(--radius);background:linear-gradient(180deg,var(--bg-3),var(--bg-2));padding:1.2rem;display:flex;flex-direction:column;gap:1rem;position:relative;overflow:hidden}
.cz-stage::before{content:"";position:absolute;inset:0;background-image:repeating-linear-gradient(0deg,transparent 0 23px,rgba(255,255,255,.03) 23px 24px),repeating-linear-gradient(90deg,transparent 0 23px,rgba(255,255,255,.03) 23px 24px);pointer-events:none}
.cz-stage-top{display:flex;justify-content:space-between;align-items:center;gap:1rem;position:relative}
.cz-step{font-family:var(--font-mono);font-size:.7rem;letter-spacing:.14em;color:var(--muted)}
.cz-doll-wrap{position:relative;display:grid;place-items:center;padding:.5rem 2.6rem 0}
.cz-doll-wrap .doll{width:min(360px,100%);filter:drop-shadow(0 24px 30px rgba(0,0,0,.65))}
.cz-doll-wrap::after{content:"";position:absolute;left:18%;right:18%;bottom:-8px;height:22px;border-radius:50%;background:radial-gradient(closest-side,rgba(0,0,0,.75),transparent);filter:blur(4px)}
.cz-arrow{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:44px;border-radius:50%;border:1px solid var(--line-2);background:rgba(15,17,14,.85);color:var(--fg-2);display:grid;place-items:center;transition:border-color .2s,color .2s}
.cz-arrow svg{width:20px;height:20px}.cz-arrow:hover{border-color:var(--olive);color:var(--fg)}.cz-arrow:disabled{opacity:.25;cursor:default}
.cz-arrow.prev{left:0}.cz-arrow.next{right:0}
.cz-promo{position:absolute;top:8%;left:50%;transform:translate(-50%,-10px) rotate(-6deg);opacity:0;pointer-events:none;font-family:var(--font-mono);font-size:.78rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);border:2px solid var(--gold);padding:.5em 1em;border-radius:4px;background:rgba(10,11,9,.85);box-shadow:0 0 30px -6px rgba(245,198,106,.6);white-space:nowrap;max-width:95%;overflow:hidden;text-overflow:ellipsis}
.cz-promo.on{animation:promo 1.8s cubic-bezier(.2,.9,.2,1) forwards}
@keyframes promo{0%{opacity:0;transform:translate(-50%,-10px) rotate(-6deg) scale(1.4)}18%{opacity:1;transform:translate(-50%,0) rotate(-6deg) scale(1)}80%{opacity:1}100%{opacity:0;transform:translate(-50%,-6px) rotate(-6deg)}}
.cz-plinth{display:flex;align-items:center;gap:1rem;border-top:1px solid var(--line);padding-top:1rem;position:relative}
.cz-insig{width:56px;height:56px;border-radius:50%;border:1px solid var(--olive);background:radial-gradient(circle at 50% 35%,var(--olive-4),var(--bg-2));display:grid;place-items:center;color:var(--gold);box-shadow:0 0 24px -6px var(--olive);flex:none}
.cz-insig svg{width:30px;height:30px}
.cz-plinth b{display:block;font-family:var(--font-display);text-transform:uppercase;font-size:2rem;font-weight:700;line-height:1}
.cz-plinth small{font-family:var(--font-mono);font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.cz-unlocks{display:flex;flex-direction:column;gap:.5rem;position:relative}
.cz-chip{cursor:pointer;transition:border-color .2s,color .2s,background .2s}
.cz-chip:hover{border-color:var(--olive);color:var(--fg)}
.cz-chip.on{background:var(--olive-4);border-color:var(--olive);color:var(--fg)}
.cz-ladder-col{min-width:0}
.cz-ladder{list-style:none;margin:0;padding:0;max-width:100%;display:flex;flex-direction:column;gap:.2rem;position:relative}
.cz-ladder::before{content:"";position:absolute;left:21px;top:16px;bottom:16px;width:2px;background:var(--line-2)}
.cz-rung button{width:100%;display:grid;grid-template-columns:44px 1fr auto;align-items:center;gap:.8rem;padding:.3rem .7rem .3rem 0;border-radius:10px;text-align:left;color:var(--fg-2);transition:background .2s,color .2s;position:relative}
.cz-rung .ri{width:44px;height:44px;border-radius:50%;border:1px solid var(--line-2);background:var(--bg-2);display:grid;place-items:center;color:var(--muted);position:relative;z-index:1}
.cz-rung .ri svg{width:22px;height:22px}
.cz-rung .rn{font-family:var(--font-display);text-transform:uppercase;font-size:1.25rem;font-weight:700;line-height:1}
.cz-rung .rp{font-family:var(--font-mono);font-size:.68rem;letter-spacing:.12em;color:var(--muted);font-variant-numeric:tabular-nums}
.cz-rung button:hover{background:var(--bg-3);color:var(--fg)}
.cz-rung.done .ri{border-color:var(--olive-2);color:var(--olive);background:var(--olive-4)}
.cz-rung.now button{background:var(--olive-4);color:var(--fg)}
.cz-rung.now .ri{border-color:var(--olive);color:var(--gold);box-shadow:0 0 20px -4px var(--olive)}
.cz-rung.now .rp{color:var(--olive)}
.cz-pace{font-family:var(--font-mono);font-size:.72rem;letter-spacing:.08em;color:var(--muted);margin-top:1rem;line-height:1.6}
.cz-wardrobe{margin-top:clamp(2rem,5vw,3.5rem);border-top:1px solid var(--line);padding-top:1.5rem}
.cz-wardrobe-head{display:flex;flex-wrap:wrap;gap:1rem;align-items:center;justify-content:space-between;margin-bottom:1rem}
.cz-wardrobe-head .eyebrow b{color:var(--fg);font-weight:600}
.cz-tabs{display:flex;flex-wrap:wrap;gap:.4rem}
.cz-tabs button{font-family:var(--font-mono);font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);border:1px solid var(--line-2);border-radius:6px;padding:.5em .8em;transition:all .2s}
.cz-tabs button i{font-style:normal;color:var(--olive);margin-left:.3em}
.cz-tabs button:hover{color:var(--fg);border-color:var(--olive-2)}
.cz-tabs button[aria-selected="true"]{background:var(--olive-4);color:var(--fg);border-color:var(--olive)}
.cz-tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:.7rem}
.cz-tile{position:relative;border:1px solid var(--line-2);border-radius:12px;background:var(--bg-3);padding:.6rem .6rem .8rem;display:flex;flex-direction:column;align-items:center;gap:.4rem;text-align:center;transition:transform .15s,border-color .2s,background .2s;min-width:0}
.cz-tile .doll{width:100%;aspect-ratio:4/3;height:auto;border-radius:8px;background:var(--bg-2);overflow:hidden}
.cz-tile b{font-family:var(--font-body);font-weight:600;font-size:.92rem;line-height:1.15;text-wrap:balance}
.cz-tile small{font-family:var(--font-mono);font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.cz-tile:hover{transform:translateY(-2px);border-color:var(--olive-2)}
.cz-tile.on{border-color:var(--olive);background:var(--olive-4)}.cz-tile.on small{color:var(--olive)}
.cz-tile.locked .doll{opacity:.38;filter:grayscale(.6)}.cz-tile.locked b{color:var(--fg-2)}.cz-tile.locked small{color:var(--gold)}
.cz-tile .lock{position:absolute;top:.5rem;right:.5rem;width:26px;height:26px;border-radius:50%;background:rgba(10,11,9,.8);border:1px solid var(--line-2);display:grid;place-items:center;color:var(--fg-2)}
.cz-tile .lock svg{width:14px;height:14px}
.cz-hint{font-size:.9rem;margin-top:1rem}
@media (max-width:900px){
  .cz-grid{grid-template-columns:minmax(0,1fr)}
  .cz-ladder{flex-direction:row;overflow-x:auto;gap:.5rem;padding-bottom:.5rem;scrollbar-width:none;scroll-snap-type:x proximity}
  .cz-ladder::-webkit-scrollbar{display:none}
  .cz-ladder::before{display:none}
  .cz-rung{flex:0 0 auto;scroll-snap-align:center}
  .cz-rung button{grid-template-columns:36px auto;gap:.5rem;padding:.4rem .7rem .4rem .4rem;border:1px solid var(--line-2);background:var(--bg-2)}
  .cz-rung .ri{width:36px;height:36px}.cz-rung .ri svg{width:18px;height:18px}
  .cz-rung .rn{font-size:1.05rem}.cz-rung .rp{display:none}
  .cz-tiles{grid-template-columns:repeat(auto-fill,minmax(120px,1fr))}
  .cz-doll-wrap{padding-inline:2.2rem}
}
@media (prefers-reduced-motion:reduce){.doll.pop,.cz-promo.on,.hero-rank.tick{animation:none}.cz-promo.on{opacity:1}}

eight:66px;border-radius:50%;border:1px solid var(--line-2);background:radial-gradient(circle at 50% 35%,var(--olive-4),var(--bg-2));display:grid;place-items:center;color:var(--olive);margin-block:.6rem .2rem}
/* ---------- download ---------- */
.download{position:relative;overflow:hidden;background:
  radial-gradient(60% 80% at 50% 110%,rgba(242,155,60,.22),transparent 60%),var(--bg-2);border-top:1px solid var(--line)}
.download-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:clamp(2rem,5vw,4rem);align-items:center}
.download h2{font-size:clamp(2.6rem,6vw,5.2rem);font-weight:800}
.download .lead{margin-top:1rem}
.steps{display:grid;gap:.8rem;margin-top:1.5rem;counter-reset:s}
.step-item{display:grid;grid-template-columns:34px 1fr;gap:.9rem;align-items:start;padding:.9rem 1rem;border:1px solid var(--line);border-radius:12px;background:rgba(15,17,14,.7)}
.step-item::before{counter-increment:s;content:counter(s,decimal-leading-zero);font-family:var(--font-mono);color:var(--gold);font-size:.8rem;letter-spacing:.1em;padding-top:.25em}
.step-item b{display:block;font-weight:600}
.step-item span{color:var(--fg-2);font-size:.95rem}
.qr-card{border:1px solid var(--line-2);border-radius:var(--radius);background:var(--bg-3);padding:1.3rem;display:flex;flex-direction:column;align-items:center;gap:.9rem;text-align:center;max-width:360px;margin-inline:auto}
.qr-card .qr{width:200px;height:200px;background:#f1eee4;border-radius:10px;padding:10px}
.qr-card .qr svg{width:100%;height:100%;display:block}
.qr-card small{font-family:var(--font-mono);font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);word-break:break-all}
@media (max-width:900px){.download-grid{grid-template-columns:1fr}}

/* ---------- footer ---------- */
.footer{border-top:1px solid var(--line);padding-block:2.5rem;font-family:var(--font-mono);font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.footer-inner{display:flex;flex-wrap:wrap;gap:1rem 2rem;align-items:center;justify-content:space-between}
.footer a{text-decoration:none;color:var(--fg-2)}
.footer a:hover{color:var(--fg)}
.footer .brand{font-size:1.2rem;color:var(--fg)}

/* ---------- reveal ---------- */
.js .reveal{transition:opacity .9s cubic-bezier(.2,.7,.2,1),transform .9s cubic-bezier(.2,.7,.2,1)}
.js .reveal.pre{transform:translateY(32px)}
.js .reveal.in{transform:none}
@media (prefers-reduced-motion:reduce){.js .reveal{transition:none}.js .reveal.pre{transform:none}}