/* ===========================================================
   FIGHT APP — The Digital Home of Fight Sports
   Design system + components. No build step.
   =========================================================== */

:root{
  /* ---- color (OKLCH, never pure #000/#fff; neutrals tinted warm toward red) ---- */
  --bg:        oklch(0.145 0.012 25);
  --bg-1:      oklch(0.185 0.014 25);
  --bg-2:      oklch(0.225 0.016 26);
  --ink:       oklch(0.965 0.004 250);
  --ink-2:     oklch(0.85 0.006 250);
  --muted:     oklch(0.66 0.012 255);
  --line:      oklch(1 0 0 / 0.09);
  --line-2:    oklch(1 0 0 / 0.14);
  --accent:    oklch(0.585 0.238 27);
  --accent-2:  oklch(0.67 0.225 30);
  --accent-deep: oklch(0.40 0.17 27);
  --metal-1:   oklch(0.99 0.002 250);
  --metal-2:   oklch(0.70 0.006 258);

  /* ---- type ---- */
  --font-display: "Anton", system-ui, "Segoe UI", sans-serif;
  --font-cond: "Saira Condensed", system-ui, sans-serif;
  --font-body: "Inter", system-ui, -apple-system, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, "SF Mono", monospace;
  --step-hero: clamp(2.4rem, 0.6rem + 6.4vw, 6.4rem);
  --step-h2:   clamp(2.1rem, 1rem + 4.6vw, 4.4rem);
  --step-h3:   clamp(1.5rem, 1.1rem + 1.7vw, 2.1rem);
  --step-lead: clamp(1.05rem, 0.95rem + 0.55vw, 1.3rem);

  /* ---- layout / motion ---- */
  --container: 1240px;
  --gut: clamp(1.1rem, 4vw, 2.4rem);
  --section-y: clamp(3rem, 5.5vw, 5.5rem);
  --r: 14px; --r-lg: 22px; --r-pill: 999px;
  --ease: cubic-bezier(.16,1,.3,1);
  --ease-impact: cubic-bezier(.2,.9,.1,1);
  --nav-h: 76px;
}

/* ---------------- reset ---------------- */
*,*::before,*::after{ box-sizing:border-box; }
*{ margin:0; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
html:focus-within{ scroll-behavior:smooth; }
body{
  background:var(--bg); color:var(--ink);
  font-family:var(--font-body); font-size:clamp(1rem,0.97rem+0.15vw,1.06rem);
  line-height:1.6; font-weight:400;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img,video,svg{ display:block; max-width:100%; }
img,video{ height:auto; }
a{ color:inherit; text-decoration:none; }
button{ font:inherit; color:inherit; background:none; border:0; cursor:pointer; }
ul,ol{ list-style:none; padding:0; }
input,select{ font:inherit; color:inherit; }
:focus-visible{ outline:2px solid var(--accent-2); outline-offset:3px; border-radius:4px; }
::selection{ background:var(--accent); color:#fff; }

/* ---------------- overlays ---------------- */
.grain{
  position:fixed; inset:0; z-index:9000; pointer-events:none; opacity:.05; mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.82' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
.scroll-progress{ position:fixed; top:0; left:0; right:0; height:3px; z-index:8000; background:transparent; }
.scroll-progress span{ display:block; height:100%; width:0; background:linear-gradient(90deg,var(--accent),var(--accent-2)); box-shadow:0 0 12px var(--accent); transform-origin:left; }
.skip-link{ position:fixed; top:-60px; left:12px; z-index:10000; background:var(--accent); color:#fff; padding:.6rem 1rem; border-radius:8px; transition:top .2s; }
.skip-link:focus{ top:12px; }

/* ---------------- utilities ---------------- */
.container{ width:100%; max-width:var(--container); margin-inline:auto; padding-inline:var(--gut); }
.section{ padding-block:var(--section-y); position:relative; scroll-margin-top:calc(var(--nav-h) + 8px); }
#hero{ scroll-margin-top:0; }
.kicker{
  font-family:var(--font-cond); text-transform:uppercase; letter-spacing:.28em;
  font-size:.82rem; font-weight:700; color:var(--accent-2);
  display:inline-flex; align-items:center; gap:.7rem; margin-bottom:1.1rem;
}
.kicker::before{ content:""; width:26px; height:2px; background:var(--accent); display:inline-block; }
.accent{ color:var(--accent); }
.section__title{
  font-family:var(--font-display); font-weight:400; text-transform:uppercase;
  font-size:var(--step-h2); line-height:1.05; letter-spacing:.005em; max-width:18ch;
}
.section__lead{ color:var(--muted); font-size:var(--step-lead); max-width:52ch; margin-top:1.2rem; }

/* ---------------- buttons ---------------- */
.btn{
  --pad-y:.95rem; --pad-x:1.6rem;
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  font-family:var(--font-cond); font-weight:700; text-transform:uppercase; letter-spacing:.06em;
  padding:var(--pad-y) var(--pad-x); border-radius:var(--r-pill); position:relative;
  transition:transform .22s var(--ease), box-shadow .22s var(--ease), filter .2s, background .2s, color .2s;
  will-change:transform;
}
.btn--sm{ --pad-y:.6rem; --pad-x:1.1rem; font-size:.82rem; }
.btn--lg{ --pad-y:1.1rem; --pad-x:2.1rem; font-size:1.02rem; }
.btn--primary{ background:var(--accent); color:#fff; box-shadow:0 8px 26px -10px var(--accent); }
.btn--primary:hover{ transform:translateY(-2px); filter:brightness(1.08); box-shadow:0 14px 36px -8px var(--accent); }
.btn--ghost{ border:1px solid var(--line-2); color:var(--ink); background:oklch(1 0 0 / 0.02); }
.btn--ghost:hover{ border-color:var(--accent); color:#fff; transform:translateY(-2px); box-shadow:0 0 0 1px var(--accent), 0 14px 30px -16px var(--accent); }

/* ---------------- nav ---------------- */
.nav{ position:fixed; top:0; left:0; right:0; z-index:7000; transition:background .3s, backdrop-filter .3s, border-color .3s; border-bottom:1px solid transparent; }
.nav.is-scrolled{ background:oklch(0.13 0.012 25 / 0.78); backdrop-filter:blur(14px); border-bottom-color:var(--line); }
.nav__inner{ height:var(--nav-h); display:flex; align-items:center; gap:1.4rem; max-width:var(--container); margin-inline:auto; padding-inline:var(--gut); }
.nav__brand img{ height:42px; width:auto; }
.nav__links{ display:flex; gap:1.7rem; margin-left:auto; }
.nav__links a{ font-family:var(--font-cond); text-transform:uppercase; letter-spacing:.1em; font-weight:600; font-size:.92rem; color:var(--ink-2); position:relative; padding-block:.3rem; }
.nav__links a::after{ content:""; position:absolute; left:0; bottom:0; height:2px; width:0; background:var(--accent); transition:width .25s var(--ease); }
.nav__links a:hover{ color:#fff; } .nav__links a:hover::after{ width:100%; }
.nav__actions{ display:flex; align-items:center; gap:1rem; margin-left:1rem; }
.langswitch{ display:flex; align-items:center; gap:.35rem; font-family:var(--font-mono); font-size:.8rem; color:var(--muted); }
.langswitch button{ color:var(--muted); padding:.2rem; transition:color .2s; }
.langswitch button.is-active{ color:var(--ink); font-weight:600; }
.langswitch button:hover{ color:var(--accent-2); }
.nav__burger{ display:none; flex-direction:column; gap:5px; padding:.5rem; }
.nav__burger span{ width:24px; height:2px; background:var(--ink); transition:.25s var(--ease); }
.nav__burger[aria-expanded="true"] span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.nav__burger[aria-expanded="true"] span:nth-child(2){ opacity:0; }
.nav__burger[aria-expanded="true"] span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }
.mobilemenu{ display:none; flex-direction:column; gap:.4rem; padding:1rem var(--gut) 1.6rem; background:oklch(0.12 0.012 25 / 0.97); backdrop-filter:blur(14px); border-bottom:1px solid var(--line); }
.mobilemenu a{ font-family:var(--font-cond); text-transform:uppercase; letter-spacing:.08em; padding:.7rem 0; border-bottom:1px solid var(--line); }
.mobilemenu a.btn{ border:0; margin-top:.6rem; justify-content:center; }

/* ---------------- hero ---------------- */
.hero{ position:relative; min-height:100svh; display:flex; align-items:center; overflow:hidden;
  background:radial-gradient(120% 90% at 70% 10%, oklch(0.30 0.10 27 / .5), transparent 55%), var(--bg); }
.hero__media{ position:absolute; inset:0; z-index:0; }
.hero__video{ width:100%; height:100%; object-fit:cover; opacity:.62; }
.hero__fighterwrap{ position:absolute; inset:0; z-index:2; pointer-events:none; }
.hero__glow{ position:absolute; right:13%; bottom:0; width:46%; height:92%; background:radial-gradient(48% 54% at 54% 40%, oklch(0.58 0.23 27 / .62), transparent 66%); filter:blur(12px); }
.hero__fighter{ position:absolute; right:clamp(6rem,14vw,15rem); bottom:0; height:92%; width:auto; object-fit:contain; object-position:bottom; filter:contrast(1.05) drop-shadow(0 26px 46px rgba(0,0,0,.55)); -webkit-mask-image:linear-gradient(to bottom,#000 95%,transparent); mask-image:linear-gradient(to bottom,#000 95%,transparent); }
.hero__scrim{ position:absolute; inset:0; z-index:1; pointer-events:none;
  background:
    linear-gradient(to top, var(--bg) 2%, oklch(0.145 0.012 25 / .45) 38%, transparent 72%),
    linear-gradient(to right, var(--bg) 0%, oklch(0.145 0.012 25 / .55) 30%, transparent 62%),
    radial-gradient(90% 70% at 18% 92%, oklch(0.30 0.12 27 / .35), transparent 60%); }
.hero__content{ position:relative; z-index:3; padding-bottom:clamp(3.5rem,8vh,7rem); padding-top:calc(var(--nav-h) + 2rem); }
.hero__title{ font-family:var(--font-display); text-transform:uppercase; font-weight:400; font-size:var(--step-hero); line-height:1.05; letter-spacing:.004em; margin:.4rem 0 1.3rem; text-wrap:balance; }
.hero__title .line{ display:block; }
.line--metal{ background:linear-gradient(180deg,var(--metal-1) 8%,var(--metal-2) 96%); -webkit-background-clip:text; background-clip:text; color:transparent; filter:drop-shadow(0 2px 1px oklch(0 0 0 /.5)); }
.hero__sub{ font-family:var(--font-cond); text-transform:uppercase; font-weight:600; letter-spacing:.02em; font-size:clamp(1rem,.86rem+.6vw,1.35rem); color:var(--ink); max-width:38ch; }
.hero__perks{ display:flex; flex-direction:column; gap:.55rem; margin-top:1.6rem; }
.hero__perks li{ position:relative; padding-left:1.5rem; font-family:var(--font-cond); text-transform:uppercase; letter-spacing:.06em; font-size:.92rem; color:var(--ink-2); }
.hero__perks li::before{ content:""; position:absolute; left:0; top:.42em; width:9px; height:9px; background:var(--accent); clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%); }
.hero__cta{ display:flex; flex-wrap:wrap; gap:1rem; margin-top:2rem; }
.hero__progress{ height:6px; border-radius:99px; background:var(--bg-2); overflow:hidden; margin-top:1.8rem; border:1px solid var(--line); max-width:420px; }
.hero__progress span{ display:block; height:100%; width:0; background:linear-gradient(90deg,var(--accent-deep),var(--accent),var(--accent-2)); box-shadow:0 0 12px var(--accent); transition:width 1.6s var(--ease); }
.hero__countdown{ display:flex; gap:clamp(.5rem,1.5vw,.9rem); margin-top:1.5rem; flex-wrap:wrap; }
.hero__countdown div{ display:flex; flex-direction:column; align-items:center; min-width:58px; padding:.5rem .55rem .45rem; background:oklch(0.1 0.01 25 / .62); border:1px solid var(--line); border-radius:12px; -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); }
.hero__countdown strong{ font-family:var(--font-mono); font-weight:600; font-size:1.35rem; line-height:1; color:var(--ink); font-variant-numeric:tabular-nums; }
.hero__countdown span{ font-family:var(--font-cond); text-transform:uppercase; letter-spacing:.14em; font-size:.58rem; color:var(--muted); margin-top:.34rem; }
/* ===== hero v2 — 1:1 with neues hero.jpeg ===== */
.hero__title{ margin:.3rem 0 .85rem; }
.hero__title .line.accent{ color:var(--accent); -webkit-text-fill-color:var(--accent); }
.hero__rule{ display:block; width:64px; height:4px; background:var(--accent); margin:0 0 1.2rem; }
.hero__features{ display:flex; flex-wrap:wrap; gap:clamp(1.1rem,2.6vw,2.4rem); margin:1.4rem 0 1.5rem; padding:0; list-style:none; }
.hero__features li{ display:flex; flex-direction:column; gap:.45rem; min-width:88px; }
.hero__feat-ico{ width:30px; height:30px; color:var(--accent); }
.hero__feat-ico svg{ width:100%; height:100%; display:block; }
.hero__features b{ font-family:var(--font-cond); text-transform:uppercase; letter-spacing:.04em; font-size:.92rem; font-weight:700; color:var(--ink); line-height:1; }
.hero__features em{ font-style:normal; font-family:var(--font-cond); text-transform:uppercase; letter-spacing:.05em; font-size:.72rem; color:var(--muted); line-height:1; }
.hero__founder{ color:var(--ink-2); font-size:1.04rem; line-height:1.5; max-width:33ch; margin:0 0 1.15rem; }
.hero__perks--check{ display:flex; flex-direction:column; gap:.6rem; margin:0 0 1.6rem; }
.hero__perks--check li{ padding-left:2rem; font-size:.86rem; letter-spacing:.05em; color:var(--ink-2); }
.hero__perks--check li::before{ content:"✓"; left:0; top:50%; transform:translateY(-50%); width:1.2rem; height:1.2rem; border-radius:50%; background:transparent; border:1.5px solid var(--accent); color:var(--accent); display:grid; place-items:center; font-size:.66rem; clip-path:none; }
[dir="rtl"] .hero__perks--check li{ padding-left:0; padding-right:2rem; }
.hero__quote{ position:absolute; top:calc(var(--nav-h) + 1.7rem); right:max(2.4vw,calc((100vw - var(--container))/2)); z-index:4; max-width:230px; margin:0; padding-left:1.9rem; text-align:left; }
.hero__quote::before{ content:"\201D"; position:absolute; left:-.1rem; top:1.3rem; font-family:var(--font-display); font-size:2.6rem; line-height:0; color:var(--accent); }
.hero__quote blockquote{ margin:0; font-style:italic; font-family:var(--font-cond); font-weight:600; text-transform:uppercase; letter-spacing:.01em; font-size:1.32rem; line-height:1.28; color:var(--ink); }
.hero__quote figcaption{ margin-top:.75rem; font-family:var(--font-cond); font-weight:700; text-transform:uppercase; letter-spacing:.12em; font-size:.74rem; color:var(--accent); }
[dir="rtl"] .hero__quote{ right:auto; left:max(2.4vw,calc((100vw - var(--container))/2)); padding-left:0; padding-right:1.7rem; text-align:right; }
[dir="rtl"] .hero__quote::before{ left:auto; right:-.1rem; }
@media (max-width:1100px){ .hero__quote{ display:none; } }
.hero .kicker::before{ display:none; }
.hero .hero__scroll{ display:none; }
@keyframes pulse{ 0%{ box-shadow:0 0 0 0 oklch(0.585 0.238 27 / .6);} 70%{ box-shadow:0 0 0 10px transparent;} 100%{ box-shadow:0 0 0 0 transparent;} }
.hero__scroll{ position:absolute; left:50%; bottom:1.4rem; transform:translateX(-50%); z-index:3; display:flex; flex-direction:column; align-items:center; gap:.5rem; font-family:var(--font-cond); text-transform:uppercase; letter-spacing:.2em; font-size:.7rem; color:var(--muted); }
.hero__scroll i{ width:1px; height:34px; background:linear-gradient(var(--accent),transparent); animation:scrolldown 1.8s var(--ease) infinite; }
@keyframes scrolldown{ 0%{ transform:scaleY(0); transform-origin:top;} 45%{ transform:scaleY(1); transform-origin:top;} 55%{ transform:scaleY(1); transform-origin:bottom;} 100%{ transform:scaleY(0); transform-origin:bottom;} }

/* ---------------- trust strip ---------------- */

/* ---------------- problem ---------------- */
.problem__grid{ display:grid; grid-template-columns:1fr auto 1fr; gap:clamp(1.4rem,4vw,3rem); align-items:center; margin-top:clamp(1.8rem,4vw,3rem); }
.chaos{ display:flex; flex-direction:column; gap:.7rem; }
.chaos li{ position:relative; }
.chaos li span{ display:inline-block; font-family:var(--font-mono); font-size:.92rem; color:var(--ink-2); background:var(--bg-1); border:1px solid var(--line); border-radius:10px; padding:.7rem 1rem; transform:rotate(var(--rot,-1deg)); }
.chaos li:nth-child(even) span{ --rot:1.2deg; margin-left:auto; }
.chaos li:nth-child(3) span{ --rot:-2deg; }
.chaos li span::before{ content:"✕"; color:var(--accent); margin-right:.5rem; font-weight:700; }
.problem__note{ color:var(--muted); margin-top:1.2rem; font-size:.95rem; }
.octa-badge{ width:clamp(64px,9vw,104px); aspect-ratio:1; display:grid; place-items:center; background:var(--accent); color:#fff; font-family:var(--font-display); font-size:clamp(1.1rem,2.5vw,1.6rem); clip-path:polygon(29% 0,71% 0,100% 29%,100% 71%,71% 100%,29% 100%,0 71%,0 29%); box-shadow:0 0 40px -6px var(--accent); }
.problem__fix{ text-align:center; }
.problem__phone{ width:min(240px,70%); margin:0 auto 1.2rem; border-radius:26px; overflow:hidden; border:1px solid var(--line-2); box-shadow:0 30px 60px -24px #000, 0 0 50px -20px var(--accent); background:var(--bg-1); aspect-ratio:9/19; }
.problem__phone.is-empty{ display:grid; place-items:center; }
.problem__phone img{ width:100%; height:100%; object-fit:cover; object-position:top; }
.problem__fixnote{ color:var(--ink-2); } .problem__fixnote strong{ font-family:var(--font-display); font-size:1.4rem; color:var(--ink); letter-spacing:.02em; }

/* ---------------- platform (why / what we do) ---------------- */
.platform__grid{ display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(1.5rem,3.5vw,3.5rem); align-items:center; }
.platform__lead{ color:var(--muted); font-size:var(--step-lead); max-width:48ch; margin-top:1.1rem; }
.platform__points{ display:flex; flex-direction:column; gap:1rem; margin-top:1.6rem; }
.platform__points li{ position:relative; padding-left:1.5rem; color:var(--muted); max-width:54ch; }
.platform__points li::before{ content:""; position:absolute; left:0; top:.5em; width:9px; height:9px; background:var(--accent); clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%); }
.platform__points strong{ color:var(--ink); font-weight:600; }

/* ---------------- inside / showcases ---------------- */
.inside .section__title{ margin-bottom:clamp(1.4rem,3vw,2.4rem); }
.show{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(1.5rem,3vw,3.2rem); align-items:center; padding-block:clamp(1.6rem,3vw,2.8rem); border-top:1px solid var(--line); }
.show--rev .show__text{ order:2; }
.show__no{ font-family:var(--font-mono); color:var(--accent-2); font-size:.9rem; letter-spacing:.1em; }
.show__text h3{ font-family:var(--font-display); text-transform:uppercase; font-size:var(--step-h3); line-height:1.05; margin:.5rem 0 1rem; letter-spacing:.01em; }
.show__text p{ color:var(--muted); max-width:42ch; }
.show__link{ display:inline-block; margin-top:1.4rem; font-family:var(--font-cond); font-weight:700; text-transform:uppercase; letter-spacing:.08em; color:var(--ink); border-bottom:2px solid var(--accent); padding-bottom:3px; transition:color .2s, gap .2s; }
.show__link:hover{ color:var(--accent); }
.phones{ display:flex; justify-content:center; align-items:flex-end; gap:0; perspective:1200px; }
.phone{ width:clamp(120px,21vw,180px); aspect-ratio:9/19.3; border-radius:24px; overflow:hidden; border:1px solid var(--line-2); background:var(--bg-1); box-shadow:0 26px 50px -22px #000; flex:0 0 auto; transition:transform .5s var(--ease), box-shadow .4s; }
.phone img{ width:100%; height:100%; object-fit:cover; object-position:top; }
.phones .phone:nth-child(1){ transform:translateX(22%) rotate(-5deg) scale(.9); z-index:1; }
.phones .phone:nth-child(2){ z-index:3; box-shadow:0 36px 60px -22px #000, 0 0 50px -22px var(--accent); }
.phones .phone:nth-child(3){ transform:translateX(-22%) rotate(5deg) scale(.9); z-index:1; }
.phones:hover .phone:nth-child(1){ transform:translateX(8%) rotate(-7deg) scale(.92); }
.phones:hover .phone:nth-child(3){ transform:translateX(-8%) rotate(7deg) scale(.92); }
.phones .phone:only-child{ transform:none; }
/* coach hologram showcase — blended into the section, not boxed */
.show__media{ display:flex; justify-content:center; align-items:center; }
.coachshot{ position:relative; margin:0; width:100%; max-width:580px; }
.coachshot__halo{ position:absolute; inset:-16% -10% -8% -6%; z-index:0; background:radial-gradient(56% 58% at 56% 46%, oklch(0.52 0.21 27 /.62), transparent 70%); filter:blur(46px); pointer-events:none; }
.coachshot img{ position:relative; z-index:1; display:block; width:100%; height:auto;
  -webkit-mask-image:linear-gradient(to right, transparent 0, #000 11%, #000 89%, transparent 100%), linear-gradient(to bottom, transparent 0, #000 8%, #000 90%, transparent 100%);
  -webkit-mask-composite:source-in;
  mask-image:linear-gradient(to right, transparent 0, #000 11%, #000 89%, transparent 100%), linear-gradient(to bottom, transparent 0, #000 8%, #000 90%, transparent 100%);
  mask-composite:intersect; }

/* ---------------- why / kerim ---------------- */
.why{ background:linear-gradient(180deg,var(--bg),oklch(0.12 0.012 25)); }
.why__grid{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(1.5rem,3vw,3rem); align-items:center; }
.why__play{ position:relative; width:100%; border-radius:var(--r-lg); overflow:hidden; aspect-ratio:4/5; border:1px solid var(--line-2); box-shadow:0 40px 80px -30px #000; background:radial-gradient(58% 56% at 50% 40%, oklch(0.24 0.06 27 / .95), oklch(0.12 0.012 25)); }
.why__play img{ width:100%; height:100%; object-fit:cover; object-position:top; filter:contrast(1.06); transition:transform .6s var(--ease); }
.why__play:hover img{ transform:scale(1.04); }
.why__play::after{ content:""; position:absolute; inset:0; background:radial-gradient(60% 60% at 50% 40%, transparent, oklch(0.1 0.01 25 / .55)); }
.why__playicon{ position:absolute; inset:0; margin:auto; width:84px; height:84px; display:grid; place-items:center; background:var(--accent); color:#fff; border-radius:50%; font-size:1.6rem; padding-left:6px; z-index:2; box-shadow:0 0 50px -6px var(--accent); transition:transform .3s var(--ease-impact); }
.why__play:hover .why__playicon{ transform:scale(1.1); }
.why__quote{ font-family:var(--font-display); text-transform:uppercase; font-size:clamp(2rem,1rem+4vw,3.6rem); line-height:1.05; margin:1rem 0 1.6rem; }
.why__quote span{ display:block; }
.why__body{ color:var(--muted); max-width:46ch; font-size:1.05rem; }
.why__sign{ margin-top:1.8rem; font-family:var(--font-cond); letter-spacing:.04em; }
.why__sign strong{ font-size:1.2rem; text-transform:uppercase; letter-spacing:.06em; }
.why__sign span{ color:var(--muted); }
.why__creds{ display:flex; flex-wrap:wrap; gap:.6rem; margin-top:1.4rem; }
.why__creds li{ font-family:var(--font-cond); text-transform:uppercase; letter-spacing:.08em; font-size:.74rem; font-weight:700; color:var(--ink-2); border:1px solid oklch(0.45 0.13 27 / .45); border-radius:6px; padding:.45rem .8rem; }

/* ---------------- ecosystem ---------------- */
.eco{ text-align:center; }
.eco .kicker{ justify-content:center; } .eco .section__title, .eco .section__lead{ margin-inline:auto; }
.eco .section__title{ max-width:22ch; }
.eco__stage{ position:relative; width:min(660px,90vw); aspect-ratio:1; margin:clamp(1.4rem,3vw,2.4rem) auto 0; }
.eco__cage{ position:absolute; inset:0; width:100%; height:100%; overflow:visible; }
.eco__cage polygon{ fill:none; stroke:oklch(0.52 0.17 27 / .5); stroke-width:.6; filter:drop-shadow(0 0 5px oklch(0.55 0.22 27 / .4)); }
.eco__hub{ position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:40%; aspect-ratio:1.6/1; display:grid; place-items:center; z-index:3; }
.eco__hub img{ width:100%; filter:drop-shadow(0 0 30px oklch(0.585 0.238 27 / .5)); }
.eco__hub::before{ content:""; position:absolute; inset:-30% ; background:radial-gradient(circle,oklch(0.585 0.238 27 / .28),transparent 60%); z-index:-1; }
.eco__nodes li{ position:absolute; left:calc(50% + cos(calc(var(--i)*45deg - 90deg)) * 44%); top:calc(50% + sin(calc(var(--i)*45deg - 90deg)) * 44%); transform:translate(-50%,-50%); }
.eco__node{ display:inline-grid; place-items:center; min-width:96px; padding:.7rem .9rem; font-family:var(--font-cond); font-weight:700; text-transform:uppercase; letter-spacing:.06em; font-size:.85rem; background:oklch(0.18 0.02 26 / .96); border:1px solid oklch(0.48 0.14 27 / .5); border-radius:6px; color:var(--ink); transition:.25s var(--ease); cursor:pointer; }
.eco__node:hover, .eco__node:focus-visible, .eco__node.is-active{ border-color:var(--accent); color:#fff; box-shadow:0 0 26px -6px var(--accent); transform:translateY(-3px); background:oklch(0.2 0.045 27 / .96); outline:none; }
.eco__detail{ max-width:580px; margin:clamp(1.5rem,4vw,2.5rem) auto 0; text-align:center; min-height:108px; }
.eco__detail-title{ font-family:var(--font-display); text-transform:uppercase; font-size:1.5rem; color:var(--accent-2); letter-spacing:.02em; }
.eco__detail-points{ display:flex; flex-wrap:wrap; justify-content:center; gap:.55rem 1rem; margin-top:1rem; }
.eco__detail-points li{ position:relative; padding-left:1.1rem; color:var(--ink-2); font-size:.95rem; }
.eco__detail-points li::before{ content:""; position:absolute; left:0; top:.5em; width:7px; height:7px; background:var(--accent); clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%); }
.eco__emblem{ position:relative; width:min(230px,52vw); aspect-ratio:1; margin:clamp(1.4rem,3.5vw,2.2rem) auto; display:grid; place-items:center; }
.eco__emblem-cage{ position:absolute; inset:0; width:100%; height:100%; }
.eco__emblem-cage polygon{ fill:none; stroke:oklch(0.52 0.17 27 / .6); stroke-width:1; filter:drop-shadow(0 0 8px oklch(0.55 0.22 27 / .5)); }
.eco__emblem::before{ content:""; position:absolute; inset:8%; background:radial-gradient(circle, oklch(0.585 0.238 27 / .3), transparent 65%); }
.eco__emblem img{ position:relative; width:64%; filter:drop-shadow(0 0 22px oklch(0.585 0.238 27 / .5)); }
.eco__grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(.8rem,2vw,1.2rem); margin-top:clamp(1.2rem,3vw,2rem); text-align:left; }
.eco__card{ background:linear-gradient(180deg,var(--bg-1),oklch(0.16 0.012 25)); border:1px solid var(--line); border-left:3px solid var(--accent); border-radius:var(--r); padding:1.3rem 1.2rem; transition:.3s var(--ease); }
.eco__card:hover{ border-color:var(--accent); transform:translateY(-4px); box-shadow:0 20px 40px -28px #000, 0 0 30px -24px var(--accent); }
.eco__card-title{ font-family:var(--font-display); text-transform:uppercase; font-size:1.15rem; letter-spacing:.02em; margin-bottom:.75rem; }
.eco__card-points{ display:flex; flex-direction:column; gap:.42rem; }
.eco__card-points li{ position:relative; padding-left:1rem; color:var(--muted); font-size:.86rem; line-height:1.4; }
.eco__card-points li::before{ content:""; position:absolute; left:0; top:.5em; width:6px; height:6px; background:var(--accent); clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%); }

/* ---------------- founding program ---------------- */
.program__title{ font-family:var(--font-display); text-transform:uppercase; font-size:clamp(2.4rem,1rem+6vw,6rem); line-height:1.05; letter-spacing:.01em; }
.program__cap{ font-family:var(--font-cond); text-transform:uppercase; letter-spacing:.12em; font-weight:800; font-size:clamp(1rem,2.5vw,1.4rem); margin-top:.8rem; }
.counter{ margin:clamp(2rem,4vw,3rem) 0; max-width:520px; }
.counter__row{ display:flex; align-items:baseline; gap:.8rem; }
.counter__num{ font-family:var(--font-mono); font-weight:600; font-size:clamp(2rem,5vw,3rem); color:var(--ink); font-variant-numeric:tabular-nums; }
.counter__max{ font-family:var(--font-cond); text-transform:uppercase; letter-spacing:.1em; color:var(--muted); font-size:.9rem; }
.counter__bar{ height:8px; border-radius:99px; background:var(--bg-2); overflow:hidden; margin-top:.9rem; border:1px solid var(--line); }
.counter__bar span{ display:block; height:100%; width:0; background:linear-gradient(90deg,var(--accent-deep),var(--accent),var(--accent-2)); box-shadow:0 0 16px var(--accent); transition:width 1.6s var(--ease); }
.tiers{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(1rem,2.5vw,1.6rem); margin-top:clamp(1.5rem,4vw,2.5rem); }
.tier{ background:linear-gradient(180deg,var(--bg-1),oklch(0.16 0.012 25)); border:1px solid var(--line); border-radius:var(--r-lg); padding:clamp(1.2rem,2.5vw,1.8rem); display:flex; flex-direction:column; transition:transform .4s var(--ease), border-color .3s, box-shadow .4s; }
.tier:hover{ transform:translateY(-6px); border-color:var(--accent); box-shadow:0 30px 60px -30px #000, 0 0 40px -24px var(--accent); }
.tier__head{ display:flex; flex-direction:column; gap:.2rem; margin-bottom:1.1rem; }
.tier__rank{ font-family:var(--font-display); text-transform:uppercase; font-size:1.7rem; letter-spacing:.02em; }
.tier__tag{ font-family:var(--font-cond); text-transform:uppercase; letter-spacing:.1em; color:var(--accent-2); font-weight:700; font-size:.85rem; }
.tier__media{ aspect-ratio:4/3; border-radius:var(--r); overflow:hidden; background:var(--bg-2); margin-bottom:1.1rem; display:grid; place-items:center; }
.tier__media img{ width:100%; height:100%; object-fit:cover; filter:brightness(1.12) contrast(1.05); }
.tier__media.is-empty img{ display:none; }
.tier__media--badge, .tier__media--num{ background:radial-gradient(circle at 50% 45%, oklch(0.22 0.04 27), var(--bg-2)); }
.tier__media--badge img{ object-fit:contain; filter:none; width:100%; height:100%; }
.badge-octa{ width:120px; aspect-ratio:1; display:grid; place-items:center; background:var(--bg); border:2px solid var(--accent); color:var(--ink); font-family:var(--font-display); font-size:2.4rem; clip-path:polygon(29% 0,71% 0,100% 29%,100% 71%,71% 100%,29% 100%,0 71%,0 29%); box-shadow:0 0 40px -10px var(--accent); }
.bignum{ font-family:var(--font-mono); font-weight:600; font-size:clamp(2rem,5vw,3rem); color:var(--accent-2); text-shadow:0 2px 18px rgba(0,0,0,.55); }
.tier__list{ display:flex; flex-direction:column; gap:.55rem; margin-bottom:1.1rem; }
.tier__list li{ position:relative; padding-left:1.4rem; color:var(--ink-2); font-size:.96rem; }
.tier__list li::before{ content:""; position:absolute; left:0; top:.55em; width:7px; height:7px; background:var(--accent); clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%); }
.tier__foot{ margin-top:auto; color:var(--muted); font-size:.86rem; border-top:1px solid var(--line); padding-top:1rem; }

/* ---------------- founder wall ---------------- */
.wall .section__title{ display:flex; align-items:center; gap:1rem; flex-wrap:wrap; }
.wall__live{ font-family:var(--font-mono); font-size:.7rem; color:var(--accent); letter-spacing:.1em; display:inline-flex; align-items:center; gap:.3rem; }
.wall__live::first-letter{ animation:pulse 2s infinite; }
.wall__count{ font-family:var(--font-cond); text-transform:uppercase; letter-spacing:.08em; color:var(--muted); margin-top:1rem; }
.wall__count .count{ font-family:var(--font-mono); color:var(--ink); font-size:1.4rem; }
.marquee{ overflow:hidden; margin-top:clamp(1.5rem,4vw,2.5rem); -webkit-mask:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent); mask:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent); }
.marquee__track{ display:flex; gap:14px; width:max-content; animation:marquee 55s linear infinite; }
.marquee:hover .marquee__track{ animation-play-state:paused; }
@keyframes marquee{ to{ transform:translateX(-50%); } }
.fcard{ display:flex; align-items:center; gap:.7rem; padding:.7rem 1.1rem; background:var(--bg-1); border:1px solid var(--line); border-radius:12px; white-space:nowrap; }
.fcard__num{ font-family:var(--font-mono); font-weight:600; color:var(--accent-2); font-size:.92rem; }
.fcard__name{ font-weight:600; }
.fcard__flag{ font-size:1.1rem; }
.fcard__country{ color:var(--muted); font-size:.85rem; }

/* ---------------- roadmap ---------------- */
.timeline{ display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(1rem,2.5vw,1.6rem); margin-top:clamp(1.8rem,4vw,2.6rem); counter-reset:rm; }
.timeline li{ position:relative; padding-top:2.2rem; border-top:2px solid var(--line); }
.timeline li::before{ content:""; position:absolute; top:-7px; left:0; width:12px; height:12px; background:var(--accent); clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%); box-shadow:0 0 16px var(--accent); }
.timeline__year{ font-family:var(--font-mono); color:var(--accent-2); font-weight:600; font-size:1.1rem; }
.timeline__tag{ display:inline-block; font-family:var(--font-cond); text-transform:uppercase; letter-spacing:.14em; font-size:.62rem; font-weight:700; color:var(--accent-2); border:1px solid oklch(0.45 0.13 27 / .5); border-radius:5px; padding:.2rem .5rem; margin-bottom:.7rem; }
.timeline li h3{ font-family:var(--font-display); text-transform:uppercase; font-size:1.4rem; margin:.5rem 0 .6rem; line-height:1; }
.timeline li p{ color:var(--muted); font-size:.92rem; }

/* ---------------- partners ---------------- */
.partners__cats{ display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(1rem,2.5vw,1.5rem); margin:clamp(1.8rem,4vw,2.6rem) 0; }
.pcat{ background:oklch(0.17 0.014 25 / .82); backdrop-filter:blur(5px); border:1px solid var(--line); border-radius:var(--r); padding:1.6rem 1.5rem 1.9rem; min-height:152px; transition:.3s var(--ease); }
.pcat:hover{ border-color:var(--accent); transform:translateY(-4px); }
.pcat h3{ font-family:var(--font-cond); font-weight:800; text-transform:uppercase; letter-spacing:.05em; font-size:1.15rem; margin-bottom:.5rem; }
.pcat h3 em{ font-style:normal; font-size:.62rem; color:var(--accent); letter-spacing:.15em; vertical-align:middle; margin-left:.4rem; border:1px solid var(--accent); padding:.1rem .35rem; border-radius:5px; }
.pcat p{ color:var(--muted); font-size:.92rem; }

/* ---------------- join / final CTA ---------------- */
.join{ position:relative; overflow:hidden; text-align:center; background:oklch(0.12 0.012 25); }
.join__bg{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:.5; z-index:0; }
.join__scrim{ position:absolute; inset:0; z-index:1; background:radial-gradient(80% 80% at 50% 50%, transparent, oklch(0.1 0.01 25 / .85)); }
.join__inner{ position:relative; z-index:2; }
.join .kicker{ justify-content:center; }
.join__title{ font-family:var(--font-display); text-transform:uppercase; font-size:clamp(2.6rem,1rem+7vw,6.5rem); line-height:1.05; letter-spacing:.01em; }
.join__lead{ color:var(--ink-2); font-size:var(--step-lead); margin:1.2rem auto 0; max-width:46ch; }
.countdown{ display:flex; justify-content:center; gap:clamp(.6rem,2vw,1.4rem); margin:2rem 0; }
.countdown div{ display:flex; flex-direction:column; min-width:clamp(64px,16vw,90px); padding:1rem .6rem; background:oklch(0.1 0.01 25 / .6); border:1px solid var(--line); border-radius:var(--r); backdrop-filter:blur(6px); }
.countdown strong{ font-family:var(--font-mono); font-weight:600; font-size:clamp(1.6rem,5vw,2.4rem); color:var(--ink); font-variant-numeric:tabular-nums; text-shadow:0 2px 22px rgba(0,0,0,.75); }
.countdown span{ font-family:var(--font-cond); text-transform:uppercase; letter-spacing:.15em; font-size:.68rem; color:var(--muted); margin-top:.3rem; }
.join__form{ max-width:480px; margin:0 auto; text-align:left; display:flex; flex-direction:column; gap:1rem; }
.field{ display:flex; flex-direction:column; gap:.4rem; }
.field label{ font-family:var(--font-cond); text-transform:uppercase; letter-spacing:.1em; font-size:.78rem; color:var(--muted); }
.field input, .field select{ background:oklch(0.1 0.01 25 / .8); border:1px solid var(--line-2); border-radius:12px; padding:.9rem 1.1rem; color:var(--ink); transition:border-color .2s, box-shadow .2s; width:100%; }
.field input:focus, .field select:focus{ outline:none; border-color:var(--accent); box-shadow:0 0 0 3px oklch(0.585 0.238 27 / .25); }
.field input::placeholder{ color:oklch(0.62 0.012 255); }
.field input.invalid, .field select.invalid{ border-color:var(--accent); }
.join__form .btn{ margin-top:.5rem; }
.join__fine{ text-align:center; color:var(--muted); font-size:.8rem; }
.form__error{ text-align:center; color:var(--accent-2); font-size:.85rem; font-weight:500; }

/* ---------------- footer ---------------- */
.footer{ border-top:1px solid var(--line); padding-block:clamp(2.5rem,5vw,4rem) 2rem; background:oklch(0.115 0.01 25); }
.footer__inner{ display:grid; grid-template-columns:1.4fr 1fr 1.2fr; gap:2rem; align-items:start; }
.footer__brand img{ height:54px; width:auto; margin-bottom:1rem; }
.footer__claim{ font-family:var(--font-cond); text-transform:uppercase; letter-spacing:.08em; color:var(--ink-2); }
.footer__powered{ color:var(--muted); font-size:.85rem; margin-top:.5rem; }
.footer__nav{ display:flex; flex-direction:column; gap:.6rem; }
.footer__nav a{ font-family:var(--font-cond); text-transform:uppercase; letter-spacing:.06em; color:var(--ink-2); }
.footer__nav a:hover{ color:var(--accent); }
.footer__legal{ display:flex; flex-direction:column; gap:1rem; }
.footer__social{ display:flex; gap:.6rem; }
.footer__social a{ width:40px; height:40px; display:grid; place-items:center; border:1px solid var(--line); border-radius:50%; font-family:var(--font-cond); font-weight:700; font-size:.8rem; transition:.2s; }
.footer__social a:hover{ border-color:var(--accent); color:var(--accent); }
.footer__legal nav{ display:flex; gap:1.2rem; flex-wrap:wrap; }
.footer__legal nav a{ color:var(--muted); font-size:.85rem; }
.footer__legal nav a:hover{ color:var(--ink); }
.footer__copy{ color:var(--muted); font-size:.8rem; font-family:var(--font-mono); }

/* ---------------- modals / toast ---------------- */
.lightbox, .reveal-card{ position:fixed; inset:0; z-index:9500; display:grid; place-items:center; padding:var(--gut); background:oklch(0.08 0.01 25 / .9); backdrop-filter:blur(8px); opacity:0; animation:fade .3s var(--ease) forwards; }
.lightbox[hidden], .reveal-card[hidden]{ display:none; }
@keyframes fade{ to{ opacity:1; } }
.lightbox__inner{ width:min(960px,100%); aspect-ratio:16/9; border-radius:var(--r-lg); overflow:hidden; border:1px solid var(--line-2); box-shadow:0 40px 100px -30px #000; }
.lightbox__inner video{ width:100%; height:100%; object-fit:cover; background:#000; }
.lightbox__close{ position:absolute; top:1.2rem; right:1.4rem; width:46px; height:46px; border-radius:50%; background:var(--bg-1); border:1px solid var(--line-2); font-size:1.1rem; z-index:2; transition:.2s; }
.lightbox__close:hover{ border-color:var(--accent); color:var(--accent); transform:rotate(90deg); }
.reveal-card__inner{ position:relative; width:min(460px,100%); text-align:center; background:linear-gradient(180deg,var(--bg-1),var(--bg)); border:1px solid var(--accent); border-radius:var(--r-lg); padding:clamp(2rem,5vw,3rem); box-shadow:0 0 80px -20px var(--accent); }
.reveal-card__kick{ font-family:var(--font-cond); text-transform:uppercase; letter-spacing:.2em; color:var(--accent); font-size:.8rem; }
.reveal-card__num{ font-family:var(--font-mono); font-weight:600; font-size:clamp(3rem,12vw,5rem); margin:.6rem 0; font-variant-numeric:tabular-nums; background:linear-gradient(180deg,var(--metal-1),var(--metal-2)); -webkit-background-clip:text; background-clip:text; color:transparent; filter:drop-shadow(0 0 26px oklch(0.585 0.238 27 / .55)); }
.reveal-card__name{ font-family:var(--font-cond); text-transform:uppercase; letter-spacing:.06em; font-size:1.1rem; }
.reveal-card__sub{ color:var(--muted); font-size:.9rem; margin:.8rem 0 1.6rem; }
/* partner contact drawer — slides out */
.drawer{ position:fixed; inset:0; z-index:9500; visibility:hidden; display:grid; place-items:center; padding:clamp(1rem,4vh,3rem); }
.drawer.is-open{ visibility:visible; }
.drawer__backdrop{ position:absolute; inset:0; background:oklch(0.06 0.01 25 / .62); -webkit-backdrop-filter:blur(0); backdrop-filter:blur(0); opacity:0; transition:opacity .28s cubic-bezier(.22,1,.36,1), backdrop-filter .28s cubic-bezier(.22,1,.36,1); }
.drawer.is-open .drawer__backdrop{ opacity:1; -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); }
.drawer__panel{ position:relative; width:min(560px,100%); max-height:92vh; background:linear-gradient(180deg,var(--bg-1),var(--bg)); border:1px solid oklch(0.5 0.16 25 /.5); border-radius:var(--r-lg); box-shadow:0 40px 100px -30px #000, 0 0 90px -38px var(--accent); padding:clamp(1.8rem,4vw,2.8rem); overflow-y:auto; transform:scale(.94); opacity:0; transition:transform .3s cubic-bezier(.22,1,.36,1), opacity .26s cubic-bezier(.22,1,.36,1); }
.drawer.is-open .drawer__panel{ transform:scale(1); opacity:1; }
.drawer__x{ position:absolute; top:1.1rem; right:1.2rem; width:44px; height:44px; border-radius:50%; background:var(--bg-1); border:1px solid var(--line-2); font-size:1.05rem; color:var(--ink); z-index:2; transition:.2s; }
.drawer__x:hover{ border-color:var(--accent); color:var(--accent); transform:rotate(90deg); }
.pform-card__title{ font-family:var(--font-display); text-transform:uppercase; font-weight:400; font-size:clamp(1.7rem,1.2rem+2vw,2.5rem); line-height:1.05; margin:.5rem 0 .4rem; }
.pform-card__sub{ color:var(--muted); font-size:.95rem; line-height:1.45; margin:0 0 1.1rem; max-width:42ch; }
.pform{ display:flex; flex-direction:column; gap:.85rem; }
.pform[hidden]{ display:none; }
.drawer .field{ opacity:0; transform:translateY(8px); transition:opacity .4s cubic-bezier(.22,1,.36,1), transform .4s cubic-bezier(.22,1,.36,1); transition-delay:calc(130ms + var(--i,0) * 45ms); }
.drawer.is-open .field{ opacity:1; transform:translateY(0); }
.field__opt{ color:var(--muted); text-transform:none; letter-spacing:0; font-size:.72rem; }
.field textarea{ background:oklch(0.1 0.01 25 / .8); border:1px solid var(--line-2); border-radius:12px; padding:.7rem 1.1rem; color:inherit; font:inherit; width:100%; resize:vertical; min-height:2.4rem; line-height:1.45; transition:border-color .18s, box-shadow .18s, background .18s; }
.field textarea:focus{ outline:none; border-color:var(--accent); background:oklch(0.12 0.012 25); box-shadow:0 0 0 3px oklch(0.585 0.238 27 / .25); }
.field textarea::placeholder{ color:oklch(0.55 0.012 255); }
.field textarea.invalid{ border-color:var(--accent); }
.pform select{ -webkit-appearance:none; appearance:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' stroke='%238a8a90' stroke-width='1.6' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 1.1rem center; padding-right:2.7rem; cursor:pointer; }
.pform select option{ background:var(--bg-1); color:var(--ink); }
.drawer .field input, .drawer .field select, .drawer .field textarea{ border-color:oklch(1 0 0 / .14); }
.drawer .field label{ color:var(--ink-2); }
.pform__submit{ position:relative; overflow:hidden; width:100%; margin-top:.3rem; opacity:0; transition:opacity .4s cubic-bezier(.22,1,.36,1), transform .18s var(--ease), box-shadow .18s var(--ease); transition-delay:calc(130ms + 6 * 45ms); }
.drawer.is-open .pform__submit{ opacity:1; }
.pform__submit:hover{ transform:translateY(-1px); box-shadow:0 12px 30px oklch(0.585 0.238 27 / .35); }
.pform__submit:active{ transform:translateY(0); }
.pform__submit.is-loading{ color:transparent; pointer-events:none; }
.pform__submit.is-loading::after{ content:""; position:absolute; inset:0; margin:auto; width:18px; height:18px; border-radius:50%; border:2px solid rgba(255,255,255,.35); border-top-color:#fff; animation:spin .6s linear infinite; }
@keyframes spin{ to{ transform:rotate(360deg); } }
.pform [data-pform-error]{ margin:.2rem 0 0; }
.pform-card__ok{ text-align:center; padding:1.4rem 0 .4rem; }
.pform-card__ok h3{ font-family:var(--font-cond); text-transform:uppercase; letter-spacing:.04em; font-size:1.35rem; margin:.9rem 0 .3rem; }
.pform-card__ok p{ color:var(--muted); margin:0 0 1.5rem; }
.pform-card__check{ width:58px; height:58px; margin:0 auto; border-radius:50%; display:grid; place-items:center; font-size:1.7rem; color:#fff; background:var(--accent); box-shadow:0 0 30px -4px var(--accent); transform:scale(0); animation:popcheck .45s cubic-bezier(.22,1,.36,1) .1s forwards; }
@keyframes popcheck{ to{ transform:scale(1); } }
[dir="rtl"] .drawer__x{ right:auto; left:1.2rem; }
[dir="rtl"] .pform select{ background-position:left 1.1rem center; padding-right:1.1rem; padding-left:2.7rem; }
@media (prefers-reduced-motion:reduce){ .drawer__panel,.drawer__backdrop,.field,.pform__submit,.pform-card__check{ transition-duration:.01ms; animation-duration:.01ms; transform:none; } }
/* founding-fighter signup modal (reuses .drawer) */
.join-modal__title{ font-family:var(--font-display); text-transform:uppercase; font-weight:400; font-size:clamp(1.7rem,1.2rem+2vw,2.4rem); line-height:1.05; margin:.3rem 0 .5rem; padding-right:2.4rem; }
.join-modal__title .accent{ color:var(--accent); }
.join-modal__lead{ color:var(--muted); font-size:.95rem; line-height:1.45; margin:0 0 1.2rem; max-width:44ch; }
.countdown--modal{ margin:0 0 1.4rem; gap:.5rem; justify-content:flex-start; }
.countdown--modal div{ min-width:0; flex:1; padding:.55rem .4rem; border-radius:12px; }
.countdown--modal strong{ font-size:1.45rem; }
.countdown--modal span{ font-size:.58rem; letter-spacing:.1em; }
[dir="rtl"] .join-modal__title{ padding-right:0; padding-left:2.4rem; }
/* partner section CTA — B2B, prominent + red */
.partners__badge{ display:inline-block; font-family:var(--font-cond); text-transform:uppercase; letter-spacing:.12em; font-size:.74rem; font-weight:700; color:#fff; background:var(--accent); padding:.42rem .95rem; border-radius:99px; box-shadow:0 0 26px -6px var(--accent); margin-bottom:1rem; }
.partners__cta{ margin-top:clamp(1.8rem,4vw,2.8rem); display:flex; flex-direction:column; align-items:flex-start; gap:1.15rem; }
.partners__cta-line{ font-family:var(--font-cond); text-transform:uppercase; letter-spacing:.03em; font-size:clamp(1.05rem,.9rem+.7vw,1.5rem); line-height:1.15; color:var(--ink); max-width:30ch; }
.partners__btn{ font-size:1.05rem; padding:1.1rem 2.8rem; box-shadow:0 0 46px -8px var(--accent); }
.partners__btn:hover{ box-shadow:0 14px 50px -8px var(--accent); }
[dir="rtl"] .partners__cta{ align-items:flex-end; }
/* daily routines section (Tag 1/2/3 video previews + 60-day track) */
.rtrack{ max-width:540px; margin:1.7rem 0 .2rem; }
.rtrack__row{ display:flex; justify-content:space-between; font-family:var(--font-cond); text-transform:uppercase; letter-spacing:.08em; font-size:.72rem; color:var(--muted); margin-bottom:.45rem; }
.rtrack__bar{ position:relative; height:7px; border-radius:99px; background:var(--bg-2); border:1px solid var(--line); display:flex; }
.rtrack__bar i{ flex:0 0 9%; height:100%; background:linear-gradient(90deg,var(--accent-deep),var(--accent)); border-radius:99px; box-shadow:0 0 12px var(--accent); }
.rtrack__dot{ position:absolute; left:9%; top:50%; transform:translate(-50%,-50%); width:14px; height:14px; border-radius:50%; background:var(--accent); box-shadow:0 0 14px var(--accent); border:2px solid var(--bg-1); }
.rail{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(.8rem,2vw,1.2rem); margin-top:1.7rem; }
.rcard{ position:relative; aspect-ratio:1; border-radius:16px; overflow:hidden; border:1px solid var(--line-2); box-shadow:0 26px 54px -26px #000; background:#000; }
.rcard>img{ width:100%; height:100%; object-fit:cover; }
.rcard__grad{ position:absolute; inset:0; background:linear-gradient(to top, oklch(0.05 0.01 25/.94) 4%, oklch(0.05 0.01 25/.5) 26%, transparent 52%); }
.rcard__day{ position:absolute; top:.7rem; left:.7rem; font-family:var(--font-cond); font-weight:700; text-transform:uppercase; letter-spacing:.07em; font-size:.72rem; color:#fff; background:var(--accent); padding:.26rem .6rem; border-radius:99px; box-shadow:0 0 16px -4px var(--accent); }
.rcard__dur{ position:absolute; top:.7rem; right:.7rem; font-family:var(--font-mono); font-size:.62rem; color:#fff; background:oklch(0 0 0/.5); padding:.18rem .42rem; border-radius:6px; }
.rcard__play{ position:absolute; top:46%; left:50%; transform:translate(-50%,-50%); width:54px; height:54px; border-radius:50%; background:oklch(1 0 0/.14); -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); border:1px solid oklch(1 0 0/.45); display:grid; place-items:center; }
.rcard__play svg{ width:20px; height:20px; fill:#fff; margin-left:3px; }
@media (max-width:760px){ .rail{ grid-template-columns:1fr; max-width:340px; margin-inline:auto; } }
[dir="rtl"] .rcard__day{ left:auto; right:.7rem; }
[dir="rtl"] .rcard__dur{ right:auto; left:.7rem; }
[dir="rtl"] .rtrack__dot{ left:auto; right:9%; transform:translate(50%,-50%); }
/* routines embedded in the Fight Camp showcase media column */
.routine-embed{ width:100%; }
.routine-embed .rtrack{ max-width:none; margin:0 0 1.05rem; }
.routine-embed .rail{ margin-top:0; }
/* Weight Control — stacked: text + subtext on top, Bodycheck scene + app screens below */
.show--stack{ display:block; }
.show--stack .show__text p{ max-width:60ch; }
.wc__compose{ margin-top:clamp(1.8rem,3.5vw,2.8rem); display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:clamp(1rem,3vw,2.4rem); align-items:center; }
.wc__scene{ width:100%; max-width:470px; justify-self:center; }
/* app screens as a fanned phone trio (real device frames), right of the scene */
.wc__fan{ display:flex; justify-content:center; align-items:center; width:100%; max-width:490px; margin-inline:auto; transform:translateY(10px); }
.wc__phone{ position:relative; flex:0 0 auto; width:32%; aspect-ratio:9/19.3; background:#0d0a0b; border:1px solid var(--line-2); border-radius:26px; padding:7px; box-shadow:0 36px 70px -26px #000, 0 10px 26px -10px #000, 0 0 58px -38px var(--accent); transition:transform .45s var(--ease); }
.wc__phone::before{ content:""; position:absolute; top:11px; left:50%; transform:translateX(-50%); width:34%; height:6px; border-radius:99px; background:#000; z-index:4; }
.wc__phone img{ display:block; width:100%; height:100%; object-fit:cover; object-position:top; border-radius:20px; }
.wc__phone:nth-child(1){ transform:rotate(-6deg) translateY(10px); margin-right:-5%; z-index:1; }
.wc__phone:nth-child(2){ z-index:3; transform:translateY(-6px) scale(1.06); }
.wc__phone:nth-child(3){ transform:rotate(6deg) translateY(10px); margin-left:-5%; z-index:2; }
.wc__fan:hover .wc__phone:nth-child(1){ transform:rotate(-9deg) translate(-7%,8px); }
.wc__fan:hover .wc__phone:nth-child(3){ transform:rotate(9deg) translate(7%,8px); }
[dir="rtl"] .wc__phone:nth-child(1){ margin-right:0; margin-left:-5%; transform:rotate(6deg) translateY(10px); }
[dir="rtl"] .wc__phone:nth-child(3){ margin-left:0; margin-right:-5%; transform:rotate(-6deg) translateY(10px); }
[dir="rtl"] .wc__fan:hover .wc__phone:nth-child(1){ transform:rotate(9deg) translate(7%,8px); }
[dir="rtl"] .wc__fan:hover .wc__phone:nth-child(3){ transform:rotate(-9deg) translate(-7%,8px); }
@media (max-width:760px){
  .wc__compose{ grid-template-columns:1fr; gap:clamp(1.6rem,5vw,2.4rem); }
  .wc__scene{ max-width:430px; }
  .wc__fan{ max-width:400px; transform:none; }
  .wc__phone{ width:31%; }
}
.toast{ position:fixed; left:1.2rem; bottom:1.2rem; z-index:9600; display:flex; align-items:center; gap:.6rem; background:var(--bg-1); border:1px solid var(--line-2); border-left:3px solid var(--accent); border-radius:12px; padding:.8rem 1.1rem; font-size:.9rem; box-shadow:0 20px 40px -20px #000; transform:translateY(150%); transition:transform .5s var(--ease); max-width:min(320px,86vw); }
.toast.is-show{ transform:translateY(0); }
.toast[hidden]{ display:flex; }

/* ---------------- reveal animation ---------------- */
.reveal{ opacity:0; transform:translateY(38px); transition:opacity .7s var(--ease), transform .7s var(--ease); }
.reveal.is-in{ opacity:1; transform:none; }

/* ---------------- atmospheric section backgrounds ---------------- */
.section--photo{ isolation:isolate; }
.section--photo::before{ content:""; position:absolute; inset:0; z-index:-2; background-size:cover; background-position:center; opacity:.5; }
.section--photo::after{ content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(var(--bg), oklch(0.145 0.012 25 / .5) 32%, oklch(0.145 0.012 25 / .5) 68%, var(--bg)), radial-gradient(125% 120% at 50% 50%, transparent 28%, var(--bg) 92%); }
#partners.section--photo::before{ background-image:url(../assets/img/gym.webp); }
#wall.section--photo::before{ background-image:url(../assets/img/arena.webp); background-position:center 38%; }

/* hero founding tier carries the most weight */
.tiers > article:first-child{ border-color:oklch(0.5 0.18 27 / .55); box-shadow:0 24px 50px -34px #000, 0 0 60px -34px var(--accent); }

/* ---------------- responsive ---------------- */
@media (min-width:861px){ .hero__content > *{ max-width:64%; } }
@media (max-width:1024px){
  .footer__inner{ grid-template-columns:1fr 1fr; }
  .timeline, .partners__cats, .eco__grid{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:860px){
  .nav__links{ display:none; }
  .nav__burger{ display:flex; }
  .nav.is-open .mobilemenu{ display:flex; }
  .nav__actions .btn--sm{ display:none; }
  .show{ grid-template-columns:1fr; gap:2rem; }
  .show--rev .show__text{ order:0; }
  .why__grid{ grid-template-columns:1fr; }
  .why__media{ max-width:420px; margin-inline:auto; order:-1; }
  .platform__grid{ grid-template-columns:1fr; }
  .platform__media{ max-width:440px; margin-inline:auto; }
  .tiers{ grid-template-columns:1fr; max-width:420px; margin-inline:auto; }
}
@media (max-width:560px){
  .timeline, .partners__cats, .footer__inner, .eco__grid{ grid-template-columns:1fr; }
  .hero__fighterwrap{ opacity:.5; } .hero__fighter{ height:72%; right:-18%; }
  .phones{ gap:0; } .phone{ width:34vw; }
}

/* ---------------- reduced motion ---------------- */
@media (prefers-reduced-motion: reduce){
  *{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important; }
  .reveal{ opacity:1; transform:none; }
  .marquee__track{ animation:none; }
}

/* ---------------- Arabic + RTL ---------------- */
html[lang="ar"]{ --font-display:"Cairo", system-ui, sans-serif; --font-cond:"Cairo", system-ui, sans-serif; --font-body:"Cairo", system-ui, sans-serif; --font-mono:"Cairo", ui-monospace, monospace; }
html[lang="ar"] .hero__title{ font-weight:900; line-height:1.12; }
html[lang="ar"] .section__title, html[lang="ar"] .program__title, html[lang="ar"] .join__title, html[lang="ar"] .why__quote, html[lang="ar"] .tier__rank, html[lang="ar"] .show__text h3, html[lang="ar"] .timeline li h3, html[lang="ar"] .eco__card-title, html[lang="ar"] .problem__fixnote strong{ font-weight:800; line-height:1.25; }
[dir="rtl"] .hero__title .line, [dir="rtl"] .why__quote span{ transform:none; }
[dir="rtl"] .hero__fighter{ right:auto; left:clamp(6rem,14vw,15rem); }
[dir="rtl"] .hero__glow{ right:auto; left:13%; }
[dir="rtl"] .hero__perks li, [dir="rtl"] .platform__points li{ padding-left:0; padding-right:1.5rem; }
[dir="rtl"] .tier__list li{ padding-left:0; padding-right:1.4rem; }
[dir="rtl"] .eco__card-points li{ padding-left:0; padding-right:1rem; }
[dir="rtl"] .eco__detail-points li{ padding-left:0; padding-right:1.1rem; }
[dir="rtl"] .hero__perks li::before, [dir="rtl"] .platform__points li::before, [dir="rtl"] .tier__list li::before, [dir="rtl"] .eco__card-points li::before, [dir="rtl"] .eco__detail-points li::before, [dir="rtl"] .timeline li::before{ left:auto; right:0; }
[dir="rtl"] .eco__card{ border-left:0; border-right:3px solid var(--accent); }
[dir="rtl"] .toast{ left:auto; right:1.2rem; border-left:0; border-right:3px solid var(--accent); }
[dir="rtl"] .skip-link{ left:auto; right:12px; }
[dir="rtl"] .kicker::before{ margin-right:0; }