/* ═══════════════════════════════════════════════
   DESIGN TOKENS — CINEMATIC VOID
═══════════════════════════════════════════════ */
:root {
  --void:          #0B1220;
  --void2:         #0d1628;
  --glass:         rgba(255,255,255,0.028);
  --glass-border:  rgba(255,255,255,0.07);
  --fire:          #FF6A1A;
  --fire-glow:     rgba(255,106,26,0.25);
  --fire-deep:     rgba(255,106,26,0.06);
  --white:         #FFFFFF;
  --white-dim:     rgba(255,255,255,0.42);
  --muted:         #9499A1;
  --hero-grad-a:   #2a1a3e;
  --hero-grad-b:   #0d0f1e;
  --font:          'Inter', sans-serif;
}

/* ═══ RESET ════════════════════════════════════ */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  font-family: var(--font);
  font-weight: 400;
  background: var(--void);
  color: var(--white);
  overflow-x: clip;
  -webkit-font-smoothing: antialiased;
}
a { text-decoration: none; color: inherit; }

/* ═══ NOISE GRAIN ══════════════════════════════ */
body::after {
  content: '';
  position: fixed; inset: 0; z-index: 999;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)' opacity='0.035'/%3E%3C/svg%3E");
  pointer-events: none; opacity: 0.5;
}

/* ═══ CUSTOM CURSOR ════════════════════════════ */
html { cursor: auto; }
#c-dot {
  position: fixed; z-index: 9999; pointer-events: none;
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--fire); transform: translate(-50%,-50%);
  mix-blend-mode: screen;
}
#c-ring {
  position: fixed; z-index: 9998; pointer-events: none;
  width: 30px; height: 30px; border-radius: 50%;
  border: 1px solid rgba(255,106,26,0.35);
  transform: translate(-50%,-50%);
  transition: width .25s, height .25s, border-color .25s;
}

/* ═══ NAV ══════════════════════════════════════ */
nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 200;
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 3rem; height: 68px;
  background: linear-gradient(180deg, rgba(5,5,7,0.92) 0%, transparent 100%);
}
a.nav-logo { display: flex; align-items: center; gap: 0.6rem; text-decoration: none; }
.nav-logo img { height: 32px; width: auto; opacity: 1; transition: opacity .3s; }
.nav-logo img:hover { opacity: 1; }
.nav-logo__text {
  font-family: var(--font); font-size: 1.05rem; font-weight: 800;
  letter-spacing: -0.02em; color: var(--white);
}

/* Nav center links */
.nav-center {
  display: flex; align-items: center; gap: 2.2rem;
}
/* CHANGE 2: Inter 500, wide tracking, muted gray */
.nav-center a {
  font-family: var(--font);
  font-size: 0.72rem; font-weight: 500;
  letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--muted); transition: color 0.2s;
}
.nav-center a:hover { color: var(--white); }

.nav-r { display: flex; gap: .75rem; align-items: center; }

/* Lang toggle */
.lang-wrap {
  display: flex; gap: 2px;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 6px; padding: 2px;
}
.lang-btn {
  padding: 0.28rem 0.6rem; border: none; border-radius: 4px;
  font-family: var(--font); font-size: 0.72rem; font-weight: 600;
  cursor: pointer; transition: all 0.2s;
}
.lang-btn.active { background: #FF6A1A; color: #000; }
.lang-btn:not(.active) { background: transparent; color: var(--muted); }

.btn-ghost {
  background: none; border: 1px solid rgba(255,255,255,0.09);
  color: var(--white-dim); padding: .52rem 1.3rem; border-radius: 100px;
  font-family: var(--font); font-size: .82rem; font-weight: 500;
  letter-spacing: .04em; transition: all .3s; cursor: pointer;
}
.btn-ghost:hover { border-color: rgba(255,106,26,.6); color: var(--white); background: rgba(255,106,26,.1); }

.btn-fire {
  background: var(--fire); color: #000; border: none;
  padding: .52rem 1.4rem; border-radius: 100px;
  font-family: var(--font); font-size: .82rem; font-weight: 700;
  letter-spacing: .04em;
  transition: all .3s; cursor: pointer;
}
.btn-fire:hover { background: #E65C0F !important; }
.btn-fire:active { background: #CC520D !important; }
.btn-dashboard {
  display: none; background: transparent; color: var(--fire);
  border: 1px solid rgba(255,106,26,0.35);
  padding: .52rem 1.3rem; border-radius: 100px;
  font-family: var(--font); font-size: .82rem; font-weight: 600;
  cursor: pointer; transition: background 0.2s, border-color 0.2s, color 0.2s; text-decoration: none;
}
.btn-dashboard:hover { background: #FF6A1A; color: #000; border-color: #FF6A1A; }
.btn-dashboard:active { background: #CC520D; border-color: #CC520D; color: #000; }

/* ═══════════════════════════════════════════════
   HERO — INFINITE VOID
═══════════════════════════════════════════════ */
.hero {
  position: relative;
  min-height: 100vh;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  overflow: hidden;
  background: radial-gradient(ellipse at 55% 35%, var(--hero-grad-a) 0%, var(--hero-grad-b) 55%, var(--void) 100%);
  padding: 64px 0 0;
  text-align: center;
}
.hero-fox {
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  height: 85vh;
  max-height: 660px;
  width: auto;
  object-fit: contain;
  object-position: bottom center;
  z-index: 2;
  pointer-events: none;
}
.hero-oval-wrap {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 1;
  text-align: center;
}
.hero-oval-svg {
  max-width: 95vw;
  display: block;
  margin: 0 auto;
  overflow: visible;
}
.hero-content {
  position: relative;
  z-index: 3;
  text-align: center;
  width: 100%;
  padding: 0 4vw;
}
.hero-content .hero-cta-wrap {
  justify-content: center;
  margin-top: 1.2rem;
}
.hero-ambient {
  position: absolute; inset: 0; pointer-events: none;
  background:
    radial-gradient(ellipse 70% 55% at 50% 52%, rgba(255,106,26,.055) 0%, transparent 68%),
    radial-gradient(ellipse 40% 30% at 50% 30%, rgba(255,106,26,.03) 0%, transparent 60%);
  animation: amb 7s ease-in-out infinite;
}
@keyframes amb { 0%,100%{opacity:.7;transform:scale(1);} 50%{opacity:1;transform:scale(1.08);} }
.scan { display: none; }
@keyframes scan-move { 0%{top:25%;opacity:0;} 8%{opacity:1;} 50%{top:75%;opacity:.3;} 92%{opacity:0;} 100%{top:25%;opacity:0;} }

.hero-inner { position: relative; z-index: 2; max-width: 820px; width: 100%; text-align: center; margin: 0 auto; }

.eyebrow {
  display: inline-flex; align-items: center; gap: .65rem;
  margin-bottom: 3.2rem;
  opacity: 0; animation: up 1.1s .25s cubic-bezier(.16,1,.3,1) forwards;
}
.ey-line { width: 28px; height: 1px; background: var(--fire); box-shadow: 0 0 8px var(--fire); }
/* CHANGE 2: Inter 500, wide tracking, muted gray */
.ey-text {
  font-family: var(--font); font-size: .68rem; font-weight: 500;
  letter-spacing: .22em; text-transform: uppercase; color: var(--fire);
}

/* CHANGE 2: Inter 800, tight letter-spacing for cinematic impact */
.hero-h1 {
  font-family: var(--font);
  font-size: 104px;
  font-weight: 900;
  letter-spacing: -0.03em;
  line-height: 0.95;
  color: var(--white);
  margin: 0.5em 0 0.25em 0;
  white-space: nowrap;
  display: block;
  width: 100%;
  text-align: center;
  opacity: 0;
  animation: up 1.3s .4s cubic-bezier(.16,1,.3,1) forwards;
}
.fire-outline {
  color: transparent; -webkit-text-stroke: 1px rgba(255,106,26,.4);
  position: relative; display: inline-block;
  white-space: nowrap;
}
.fire-outline::after {
  content: attr(data-t); position: absolute; left: 0; top: 0;
  color: var(--fire); -webkit-text-stroke: 0;
  clip-path: inset(0 100% 0 0);
  animation: fill-text 2.4s 1.2s cubic-bezier(.16,1,.3,1) forwards;
  white-space: nowrap;
}
@keyframes fill-text { to { clip-path: inset(0 0% 0 0); } }

.hero-sub {
  font-family: var(--font);
  font-size: 17px;
  font-weight: 400;
  color: var(--white);
  line-height: 1.6;
  white-space: nowrap;
  display: block;
  width: 690px;
  max-width: 100%;
  text-align: center;
  margin: 0 auto;
  opacity: 0.7;
}

/* CHANGE 3: "Get Started Free" replaces input line */
.hero-cta-wrap {
  display: flex; flex-direction: column; align-items: center; gap: 1.2rem;
  opacity: 0; animation: up 1.1s .85s cubic-bezier(.16,1,.3,1) forwards;
}
.btn-hero-primary {
  display: inline-flex; align-items: center; gap: 0.65rem;
  padding: 1.1rem 3rem;
  background: var(--fire); color: #000; border: none; border-radius: 100px;
  font-family: var(--font); font-size: .95rem; font-weight: 800;
  letter-spacing: .07em; text-transform: uppercase;
  cursor: pointer;
  
  transition: all .3s;
}
.btn-hero-primary:hover {
  
  transform: translateY(-2px) scale(1.02);
}
.hero-sub-cta {
  font-family: var(--font); font-size: .72rem; font-weight: 500;
  letter-spacing: .1em; text-transform: uppercase;
  color: rgba(255,255,255,.22); cursor: pointer;
  background: none; border: none; transition: color .25s;
}
.hero-sub-cta:hover { color: rgba(255,255,255,.5); }

/* Trust strip */
.hero-trust {
  margin-top: 4rem;
  display: flex; align-items: center; justify-content: center; gap: 2rem; flex-wrap: wrap;
  opacity: 0; animation: up 1s 1.1s cubic-bezier(.16,1,.3,1) forwards;
}
.trust-item {
  display: flex; align-items: center; gap: .5rem;
  font-family: var(--font); font-size: .68rem; font-weight: 500;
  letter-spacing: .1em; text-transform: uppercase; color: var(--muted);
}
.trust-dot { width: 4px; height: 4px; border-radius: 50%; background: var(--fire); }

@keyframes up {
  from { opacity:0; transform:translateY(32px); filter:blur(8px); }
  to   { opacity:1; transform:translateY(0); filter:blur(0); }
}

/* ═══ VEIN BRIDGE ═══════════════════════════════ */
.vein-bridge {
  position: relative; width: 100%; height: 180px;
  display: flex; justify-content: center; overflow: hidden;
}
.vein {
  position: absolute; left: 50%; transform: translateX(-50%);
  width: 1px; top: 0; bottom: 0;
  background: linear-gradient(180deg,
    transparent 0%, rgba(255,106,26,.12) 12%,
    rgba(255,106,26,.55) 50%, rgba(255,106,26,.12) 88%, transparent 100%);
  box-shadow: 0 0 14px rgba(255,106,26,.4);
  transform-origin: top center;
  transform: translateX(-50%) scaleY(0);
  transition: transform 1.4s cubic-bezier(.16,1,.3,1);
}
.vein.on { transform: translateX(-50%) scaleY(1); }
.vein-pulse {
  position: absolute; left: 50%; transform: translateX(-50%);
  width: 3px; height: 90px; border-radius: 100px;
  background: linear-gradient(180deg, transparent, rgba(255,106,26,.95), transparent);
  filter: blur(2px); animation: pulse-travel 3.2s linear infinite;
  box-shadow: 0 0 18px var(--fire); top: -90px;
}
@keyframes pulse-travel { from{top:-90px;opacity:0;} 8%{opacity:1;} 92%{opacity:1;} to{top:100%;opacity:0;} }

/* ═══════════════════════════════════════════════
   JOURNEY — 7 STEPS
═══════════════════════════════════════════════ */
.journey { padding: 4rem 2rem; max-width: 760px; margin: 0 auto; }
.j-header {
  text-align: center; margin-bottom: 8rem;
  opacity: 0; transform: translateY(28px);
  transition: opacity .9s ease, transform .9s ease;
}
.j-header.on { opacity: 1; transform: translateY(0); }

/* CHANGE 2: labels = Inter 500, wide tracking, muted gray */
.sec-tag {
  font-family: var(--font); font-size: .68rem; font-weight: 500;
  letter-spacing: .22em; text-transform: uppercase;
  color: var(--fire); margin-bottom: 1.4rem;
}
/* CHANGE 2: headlines = Inter 800, tight tracking */
.sec-h {
  font-family: var(--font);
  font-size: clamp(2rem, 5vw, 3.6rem);
  font-weight: 800; line-height: 1.06; letter-spacing: -.03em;
}

/* ═══ NEON PATH — final ══════════════════════════════
   Full-width centered steps. Each step is its own scene.
   Between steps: a neon connector line that fades from
   dark → bright orange → dark (appears right under text,
   ends right before the next number).
   Numbers: outlined, dim by default → ignite orange on .on
   Parallax via JS data-parallax on the glow layer.        */

.steps {
  max-width: 760px; margin: 0 auto;
  display: flex; flex-direction: column;
  align-items: center;
}

/* ── individual step ── */
.step {
  width: 100%; text-align: center;
  padding: 0.3rem 1rem;
  opacity: 0; transform: translateY(24px);
  transition: opacity .8s ease, transform .8s ease;
}
.step.on { opacity: 1; transform: translateY(0); }

/* ── neon connector between steps ── */
.step-connector {
  position: relative; flex: none;
  width: 1px; height: 200px;
  overflow: hidden;
  background: linear-gradient(180deg,
    transparent 0%, rgba(255,106,26,.12) 12%,
    rgba(255,106,26,.55) 50%, rgba(255,106,26,.12) 88%, transparent 100%);
  box-shadow: 0 0 14px rgba(255,106,26,.4);
}
.step-connector::after {
  content: '';
  position: absolute; left: 50%; transform: translateX(-50%);
  width: 3px; height: 90px; border-radius: 100px;
  background: linear-gradient(180deg, transparent, rgba(255,106,26,.95), transparent);
  filter: blur(2px);
  box-shadow: 0 0 18px var(--fire);
  animation: pulse-travel 3.2s linear infinite;
  top: -90px;
}

/* ── big outlined number ── */
.s-num {
  font-family: var(--font);
  font-size: clamp(5rem, 16vw, 9rem);
  font-weight: 800; line-height: .85; letter-spacing: -.04em;
  color: transparent;
  -webkit-text-stroke: 2px rgba(255,106,26,.22);
  transition: -webkit-text-stroke .7s ease, text-shadow .7s ease;
  pointer-events: none; user-select: none;
}
.step.on .s-num {
  -webkit-text-stroke: 2px #FF6A1A;
  text-shadow: 0 0 32px rgba(255,106,26,.4);
}

/* ── tag, title, description, chip ── */
.s-n {
  font-family: var(--font); font-size: .64rem; font-weight: 500;
  letter-spacing: .18em; text-transform: uppercase;
  color: var(--fire); margin: 1.4rem 0 .6rem;
}
.s-t {
  font-family: var(--font); font-size: 1.45rem; font-weight: 700;
  line-height: 1.12; letter-spacing: -.025em;
  color: var(--white); max-width: 700px; margin: 0 auto .85rem;
}
.s-d {
  font-family: var(--font); font-size: .88rem; font-weight: 400;
  color: var(--white-dim); line-height: 1.85;
  max-width: 750px; margin: 0 auto;
}
.s-chip {
  display: inline-block; margin-top: 1.3rem;
  padding: .32rem .9rem;
  background: rgba(255,106,26,.06);
  border: 1px solid rgba(255,106,26,.20);
  border-radius: 100px;
  font-family: var(--font); font-size: .66rem; font-weight: 500;
  letter-spacing: .12em; text-transform: uppercase;
  color: rgba(255,106,26,.70);
}

/* ═══════════════════════════════════════════════
   PRICING — MEMBERSHIP CARDS
═══════════════════════════════════════════════ */
.pricing { padding: 4rem 2rem; text-align: center; position: relative; overflow: hidden; }
.pricing::before {
  content: ''; position: absolute; top: 40%; left: 50%; transform: translate(-50%,-50%);
  width: 800px; height: 400px;
  background: radial-gradient(ellipse at center, rgba(255,106,26,.04) 0%, transparent 65%);
  pointer-events: none;
}
.p-header { margin-bottom: 3rem; }
.price-toggle-wrap { display: flex; justify-content: center; margin-bottom: 4rem; }
.price-toggle {
  display: flex; gap: 2px;
  background: rgba(255,255,255,.03); border: 1px solid rgba(255,255,255,.07);
  border-radius: 10px; padding: 3px;
}
.price-toggle button {
  padding: .5rem 1.6rem; border: none; border-radius: 8px;
  font-family: var(--font); font-size: .78rem; font-weight: 600;
  cursor: pointer; transition: all .2s; background: transparent; color: var(--muted);
}
.price-toggle button.active { background: #FF6A1A; color: #000; }
.price-annual-badge { color: var(--fire); font-size: 0.7rem; }
.pricing-extra-note {
  margin-top: 2.2rem;
  font-size: 0.75rem;
  color: rgba(255,255,255,0.16);
  font-weight: 400;
}

.cards {
  display: grid; grid-template-columns: repeat(3,1fr);
  gap: 1.25rem; max-width: 960px; margin: 0 auto;
}
.card {
  position: relative;
  background: var(--glass); border: 1px solid var(--glass-border);
  border-radius: 22px; padding: 2.6rem 2rem; text-align: left;
  backdrop-filter: blur(28px); -webkit-backdrop-filter: blur(28px);
  overflow: hidden;
  opacity: 0; transform: translateY(38px);
  transition: opacity .7s ease, transform .7s ease, box-shadow .4s;
  display: flex; flex-direction: column;
}
.card.on { opacity: 1; transform: translateY(0); }
.card:hover { box-shadow: 0 32px 80px rgba(0,0,0,.5); transform: translateY(-5px) !important; }
.card.featured {
  border-color: rgba(255,106,26,.35); background: rgba(255,106,26,.03);
}
.card.featured::before {
  content: ''; position: absolute; inset: 0; border-radius: 22px; pointer-events: none;
  box-shadow: none;
}
.sweep-beam {
  position: absolute; top: -60%; left: -120%;
  width: 55%; height: 220%;
  background: linear-gradient(90deg, transparent, rgba(255,106,26,.055), transparent);
  transform: skewX(-22deg); pointer-events: none;
}
.card.featured.swept .sweep-beam { animation: sweep 1.6s .5s ease forwards; }
@keyframes sweep { from{left:-120%;} to{left:180%;} }

.c-badge {
  position: absolute; top: -1px; left: 50%; transform: translateX(-50%);
  background: var(--fire); color: #000;
  font-family: var(--font); font-size: .6rem; font-weight: 700;
  letter-spacing: .1em; text-transform: uppercase;
  padding: .25rem .95rem; border-radius: 0 0 10px 10px;
}
/* CHANGE 2: tier label = Inter 500, wide tracking, muted */
.c-tier {
  font-family: var(--font); font-size: .65rem; font-weight: 500;
  letter-spacing: .18em; text-transform: uppercase;
  color: var(--white-dim); margin-bottom: 1.4rem;
}
/* CHANGE 2: price = Inter 800 */
.c-price {
  font-family: var(--font); font-size: 3rem; font-weight: 800;
  line-height: 1; letter-spacing: -.03em; margin-bottom: .3rem;
}
.c-price sup { font-size: 1.3rem; vertical-align: super; }
.c-price em { font-size: .95rem; font-weight: 400; color: var(--white-dim); font-style: normal; letter-spacing: 0; }
.c-desc {
  font-family: var(--font); font-size: .83rem; font-weight: 400;
  color: var(--white-dim); line-height: 1.72; margin: 1.1rem 0 1.8rem; min-height: 48px;
}
.c-div { height: 1px; background: rgba(255,255,255,.055); margin-bottom: 1.6rem; }
.c-feats { list-style: none; display: flex; flex-direction: column; gap: .78rem; margin-bottom: 2.1rem; }
.c-feats li {
  display: flex; align-items: flex-start; gap: .6rem;
  font-family: var(--font); font-size: .83rem; font-weight: 400; line-height: 1.5;
}
/* Locked = visible but grey/muted */
.c-feats li.lock { opacity: 1; color: rgba(255,255,255,0.28); }
.ck { color: var(--fire); flex-shrink: 0; font-size: .78rem; margin-top: 2px; }
.lk { color: rgba(255,255,255,.28); flex-shrink: 0; width: 18px; height: 18px; display:inline-flex; align-items:center; justify-content:center; margin-top: 2px; }
.extra-usage { border-top: 1px solid rgba(255,255,255,.05); padding-top: 1.1rem; margin-bottom: 1.4rem; }
.extra-label {
  font-family: var(--font); font-size: .62rem; font-weight: 500;
  letter-spacing: .15em; text-transform: uppercase; color: var(--muted); margin-bottom: .5rem;
}
.extra-item { font-family: var(--font); font-size: .8rem; color: var(--muted); padding: .15rem 0; }

.c-btn { margin-top: auto; width: 100%; padding: .88rem; border-radius: 12px; font-family: var(--font); font-size: .83rem; font-weight: 700; cursor: pointer; transition: all .35s; border: none; letter-spacing: .04em; }
.c-btn-fire { background: var(--fire); color: #000;  }
.c-btn-fire:hover { background: #E65C0F; transform: translateY(-1px); }
.c-btn-fire:active { background: #CC520D; }
.c-btn-outline { background: transparent; border: 1px solid rgba(255,255,255,.1); color: rgba(255,255,255,.45); }
.c-btn-outline:hover { border-color: rgba(255,255,255,.25); color: var(--white); }
.c-btn-amber { background: transparent; border: 1px solid rgba(255,106,26,.25); color: rgba(255,106,26,.65); }
.c-btn-amber:hover { background: rgba(255,106,26,.06); color: rgba(255,106,26,.95); }
.plan-note { font-family: var(--font); font-size: .68rem; color: rgba(255,255,255,.18); text-align: center; margin-top: .7rem; }

/* ═══ VOID CTA ══════════════════════════════════ */
.vcta { padding: 12rem 2rem 9rem; text-align: center; position: relative; }
.vcta-orb {
  position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);
  width: 520px; height: 520px; border-radius: 50%;
  background: radial-gradient(circle, rgba(255,106,26,.045) 0%, transparent 70%);
  pointer-events: none; animation: amb 7s ease-in-out infinite;
}
/* CHANGE 2: Inter 800 headline */
.vcta h2 {
  font-family: var(--font);
  font-size: clamp(2.4rem, 6vw, 5rem);
  font-weight: 800; line-height: 1.05; letter-spacing: -.03em;
  margin-bottom: 1.8rem; position: relative; z-index: 1;
}
.vcta p {
  font-family: var(--font); font-size: .98rem; font-weight: 400;
  color: var(--white-dim); margin-bottom: 3rem; position: relative; z-index: 1; line-height: 1.75;
}
.vcta-btns { display: flex; gap: 1rem; justify-content: center; flex-wrap: wrap; position: relative; z-index: 1; }
.btn-cta-fire {
  padding: 1.05rem 2.8rem; background: var(--fire); color: #000; border: none; border-radius: 8px;
  font-family: var(--font); font-size: .88rem; font-weight: 800; letter-spacing: .07em; text-transform: uppercase;
  cursor: pointer; transition: all .35s;
}
.btn-cta-fire:hover { background: #E65C0F; filter: none; }
.btn-cta-fire:active { background: #CC520D; }
.btn-cta-ghost {
  padding: 1.05rem 2.8rem; background: transparent; border: 1px solid rgba(255,255,255,.1);
  color: var(--white-dim); border-radius: 100px;
  font-family: var(--font); font-size: .88rem; font-weight: 500;
  cursor: pointer; transition: all .35s;
}
.btn-cta-ghost:hover { border-color: rgba(255,255,255,.28); color: var(--white); }

/* ═══ FOOTER ════════════════════════════════════ */
footer {
  border-top: 1px solid rgba(255,255,255,.045);
  padding: 2.4rem 3rem;
  display: flex; align-items: center; justify-content: space-between;
  flex-wrap: wrap; gap: 1rem; position: relative; z-index: 2;
}
.f-copy { font-family: var(--font); font-size: .76rem; font-weight: 400; color: rgba(255,255,255,.18); }
.f-links { display: flex; gap: 2rem; list-style: none; }
.f-links a { font-family: var(--font); font-size: .76rem; color: rgba(255,255,255,.18); transition: color .3s; }
.f-links a:hover { color: rgba(255,255,255,.45); }

/* ═══ AUTH MODAL ════════════════════════════════ */
.modal-overlay {
  display: none; position: fixed; inset: 0; z-index: 500;
  background: rgba(5,5,7,.88); backdrop-filter: blur(18px);
  align-items: center; justify-content: center;
}
.modal-overlay.active { display: flex; }
.modal {
  background: rgba(255,255,255,.028); border: 1px solid rgba(255,255,255,.08);
  border-radius: 22px; padding: 3rem 2.5rem;
  width: 100%; max-width: 390px; position: relative; backdrop-filter: blur(40px);
  box-shadow: 0 0 0 1px rgba(255,106,26,.1), 0 50px 100px rgba(0,0,0,.6);
  animation: m-up .4s cubic-bezier(.16,1,.3,1);
}
@keyframes m-up { from{opacity:0;transform:translateY(20px) scale(.97);} to{opacity:1;transform:none;} }
.modal-close {
  position: absolute; top: 1.25rem; right: 1.25rem;
  background: none; border: none; cursor: pointer;
  color: rgba(255,255,255,.22); font-size: 1rem; transition: color .2s;
}
.modal-close:hover { color: rgba(255,255,255,.65); }
/* CHANGE 2: modal headline = Inter 800 */
.modal h2 {
  font-family: var(--font); font-size: 1.5rem; font-weight: 800;
  letter-spacing: -.025em; margin-bottom: .4rem;
}
.subtitle { font-family: var(--font); font-size: .83rem; color: var(--white-dim); margin-bottom: 1.9rem; font-weight: 400; }
.form-group { margin-bottom: .88rem; }
/* CHANGE 2: form labels = Inter 500, wide tracking */
.form-group label {
  display: block; font-family: var(--font); font-size: .68rem; font-weight: 500;
  letter-spacing: .1em; text-transform: uppercase; color: rgba(255,255,255,.3); margin-bottom: .48rem;
}
.form-group input {
  width: 100%; padding: .78rem 1rem;
  background: rgba(255,255,255,.038); border: 1px solid rgba(255,255,255,.08);
  border-radius: 10px; font-family: var(--font); font-size: .88rem;
  color: var(--white); outline: none; font-weight: 400;
  transition: border-color .3s, box-shadow .3s;
}
.form-group input::placeholder { color: rgba(255,255,255,.16); }
.form-group input:focus { border-color: rgba(255,106,26,.4); box-shadow: 0 0 0 3px rgba(255,106,26,.1); }
.btn-modal-primary {
  width: 100%; padding: .88rem; background: var(--fire); color: #000;
  border: none; border-radius: 10px;
  font-family: var(--font); font-size: .88rem; font-weight: 700;
  cursor: pointer; margin-top: .4rem; transition: all .3s;
}
.btn-modal-primary:hover { background: #E65C0F; transform: translateY(-1px); }
.btn-modal-primary:active { background: #CC520D; }
.btn-google {
  display: flex; align-items: center; justify-content: center; gap: .7rem;
  width: 100%; padding: .78rem; background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.08); border-radius: 10px;
  font-family: var(--font); font-size: .83rem; color: rgba(255,255,255,.55);
  cursor: pointer; transition: all .3s; margin-bottom: .5rem;
}
.btn-google:hover { border-color: rgba(255,255,255,.2); color: var(--white); }
.form-divider {
  display: flex; align-items: center; gap: 1rem;
  margin: 1.2rem 0; color: rgba(255,255,255,.14); font-family: var(--font); font-size: .72rem;
}
.form-divider::before, .form-divider::after { content:''; flex:1; height:1px; background: rgba(255,255,255,.055); }
.form-error {
  display: none; padding: .7rem 1rem;
  background: rgba(248,113,113,.08); border: 1px solid rgba(248,113,113,.15);
  border-radius: 8px; color: #f87171; font-family: var(--font); font-size: .8rem; margin-bottom: .7rem;
}
.form-success {
  display: none; padding: .7rem 1rem;
  background: rgba(74,222,128,.08); border: 1px solid rgba(74,222,128,.15);
  border-radius: 8px; color: #4ade80; font-family: var(--font); font-size: .8rem; margin-bottom: .7rem;
}
.form-switch { text-align: center; margin-top: 1.4rem; font-family: var(--font); font-size: .8rem; color: rgba(255,255,255,.22); }
.form-switch a { color: var(--fire); }
#registerForm,#forgotForm,#resetForm { display: none; }

/* ═══ RESPONSIVE ════════════════════════════════ */
@media (max-width: 900px) {
  .cards { grid-template-columns: 1fr; max-width: 380px; }
  nav { padding: 0 1.4rem; }
  .nav-center { display: none; }
  footer { padding: 2rem 1.4rem; flex-direction: column; align-items: flex-start; }
}
@media (max-width: 600px) {
  html { cursor: auto; } a,button { cursor: auto !important; }
  #c-dot,#c-ring { display: none; }
  .s-num { font-size: clamp(3.8rem, 18vw, 5.5rem); }
  .step { padding: 0.3rem 0.5rem; }
  .step-connector { height: 140px; }
}


  #va-overlay{display:none;position:fixed;inset:0;z-index:2147483644;background:transparent;}
  #va-overlay.va-open{display:block;}
  #va-btn{all:unset!important;box-sizing:border-box!important;position:fixed!important;bottom:28px!important;right:28px!important;z-index:2147483647!important;display:inline-flex!important;align-items:center!important;gap:7px!important;background:#FFFFFF!important;color:#111111!important;padding:11px 18px!important;border-radius:999px!important;font-family:'Inter',sans-serif!important;font-size:14px!important;font-weight:600!important;cursor:pointer!important;line-height:1!important;white-space:nowrap!important;}
  #va-btn:hover{background:#F0F0F0!important;}
  #va-panel{display:none;position:fixed!important;bottom:84px!important;right:28px!important;z-index:2147483646!important;width:344px;max-width:calc(100vw - 40px);background:#0B1220;border:1px solid rgba(255,106,26,0.18);border-radius:16px;overflow:hidden;box-shadow:0 8px 48px rgba(0,0,0,0.65);flex-direction:column;}
  #va-panel.va-open{display:flex;}
  #va-header{display:flex;align-items:center;gap:10px;padding:13px 16px;background:#FF6A1A;}
  #va-header svg{flex-shrink:0;}
  #va-header-text{flex:1;min-width:0;}
  #va-title{font-family:'Inter',sans-serif;font-weight:700;font-size:0.95rem;color:#000;line-height:1.2;}
  #va-subtitle{font-family:'Inter',sans-serif;font-size:0.75rem;color:#000;opacity:0.6;margin-top:1px;}
  #va-close{all:unset;width:26px;height:26px;border-radius:50%;background:rgba(0,0,0,0.2);color:#000;display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:1.1rem;line-height:1;flex-shrink:0;}
  #va-close:hover{background:rgba(0,0,0,0.35);}
  #va-messages{flex:1;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:10px;max-height:340px;min-height:120px;background:#0B1220;}
  #va-messages::-webkit-scrollbar{width:3px;}
  #va-messages::-webkit-scrollbar-thumb{background:rgba(255,106,26,0.2);border-radius:3px;}
  .va-msg{display:flex;}.va-bot{justify-content:flex-start;}.va-user{justify-content:flex-end;}
  .va-bubble{max-width:88%;padding:9px 13px;border-radius:14px;font-family:'Inter',sans-serif;font-size:0.845rem;line-height:1.55;}
  .va-bot .va-bubble{background:#111827;border:1px solid rgba(255,106,26,0.12);border-bottom-left-radius:4px;color:#e2e8f0;}
  .va-user .va-bubble{background:rgba(255,106,26,0.15);border:1px solid rgba(255,106,26,0.28);border-bottom-right-radius:4px;color:#f1f5f9;}
  #va-chips{display:block;}
  .va-category{margin-bottom:10px;}.va-category-label{font-family:'Inter',sans-serif;font-size:0.68rem;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;color:rgba(255,106,26,0.6);margin-bottom:5px;padding-left:2px;}.va-chip{all:unset;box-sizing:border-box;display:flex;align-items:center;width:100%;padding:8px 12px;background:#1E293B;border:1px solid rgba(255,106,26,0.15);border-radius:8px;color:#9499A1;font-family:'Inter',sans-serif;font-size:0.82rem;font-weight:500;cursor:pointer;line-height:1.3;margin-bottom:5px;transition:all 0.15s;}.va-chip-arrow{margin-left:auto;opacity:0.4;font-size:0.75rem;}
  .va-chip:hover{border-color:#FF6A1A;color:#FF6A1A;background:rgba(255,106,26,0.06);}
  .va-typing .va-bubble{display:flex;gap:5px;align-items:center;padding:12px 14px;}
  .va-dot{width:7px;height:7px;border-radius:50%;background:#FF6A1A;animation:va-bounce 0.9s ease-in-out infinite;}
  .va-dot:nth-child(2){animation-delay:0.2s;}.va-dot:nth-child(3){animation-delay:0.4s;}
  @keyframes va-bounce{0%,60%,100%{transform:translateY(0);opacity:0.4;}30%{transform:translateY(-5px);opacity:1;}}
  .va-back-btn{all:unset;box-sizing:border-box;display:inline-flex;align-items:center;gap:5px;padding:5px 12px;background:#131318;border:1px solid rgba(255,106,26,0.25);border-radius:999px;color:#FF6A1A;font-family:'Inter',sans-serif;font-size:0.76rem;font-weight:500;cursor:pointer;}
  .va-back-btn:hover{border-color:#FF6A1A;}
  #va-input-row{display:flex;align-items:center;gap:8px;padding:10px 12px;border-top:1px solid rgba(255,106,26,0.1);background:#0B1220;}
  #va-input{all:unset;flex:1;background:#1E293B;border:1px solid rgba(255,106,26,0.15);border-radius:8px;padding:8px 12px;color:#f1f5f9;font-family:'Inter',sans-serif;font-size:0.84rem;box-sizing:border-box;}
  #va-input::placeholder{color:#4b5563;}
  #va-input:focus{border-color:rgba(255,106,26,0.45);outline:none;}
  #va-send{all:unset;padding:8px 14px;background:#FF6A1A;border-radius:8px;color:#000;font-family:'Inter',sans-serif;font-size:0.84rem;font-weight:700;cursor:pointer;white-space:nowrap;flex-shrink:0;}
  #va-send:hover{background:#E65C0F;}
  @media(max-width:420px){#va-btn{right:14px!important;bottom:14px!important;}#va-panel{right:10px!important;bottom:72px!important;width:calc(100vw - 20px);}}