/* ─── TOKENS ─────────────────────────────────────────────────────── */
:root {
  --blue:    #1b59f8;
  --blue-lt: #4d7ff9;
  --purple:  #7c3aed;
  --pink:    #ec4492;
  --orange:  #fc8e44;
  --green:   #00c48c;
  --amber:   #f59e0b;

  --bg:      #f6f8ff;
  --white:   #ffffff;
  --border:  #e0e6f8;
  --ink:     #0f1728;
  --navy:    #0d1630;
  --muted:   #5a6a8a;
  --subtle:  #8c9bb4;
  --off:     #eef2ff;

  --dark:    #080c18;
  --dark-2:  #0e1528;
  --dark-3:  #151f38;
  --bd:      rgba(255,255,255,0.07);

  --font-d: "Inter", system-ui, sans-serif;
  --font-b: "Inter", system-ui, sans-serif;

  --r:    12px;
  --r-lg: 18px;
  --r-xl: 24px;
  --r-2:  32px;

  --gutter: clamp(16px,4vw,32px);
  --sy:     clamp(80px,10vw,120px);

  --sh-sm:   0 4px 24px rgba(13,22,48,0.07);
  --sh-card: 0 8px 40px rgba(13,22,48,0.08), 0 1px 4px rgba(0,0,0,0.04);
  --sh-blue: 0 0 0 1px rgba(27,89,248,0.18), 0 12px 40px rgba(27,89,248,0.18);
  --sh-glow: 0 0 80px rgba(27,89,248,0.28), 0 0 160px rgba(27,89,248,0.1);
}

/* ─── RESET ──────────────────────────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box}
*{margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--font-b);font-size:17px;line-height:1.65;color:var(--ink);background:var(--bg);-webkit-font-smoothing:antialiased}
img,svg{display:block;max-width:100%}
a{color:var(--blue);text-decoration:none}
a:hover{text-decoration:underline}
button{font:inherit;cursor:pointer;border:0;background:none}
input{font:inherit}
s{opacity:0.5;font-weight:400}
h1,h2,h3,h4{font-family:var(--font-d);line-height:1.08;letter-spacing:-0.03em;font-weight:800}
h1{font-size:clamp(3rem,6.5vw,5.4rem);color:var(--navy);font-weight:900}
h2{font-size:clamp(1.9rem,3.5vw,2.8rem);color:var(--navy)}
h3{font-size:1.15rem;font-weight:700;color:var(--navy)}
h4{font-size:0.72rem;font-weight:700;text-transform:uppercase;letter-spacing:0.1em}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}

/* ─── LAYOUT ─────────────────────────────────────────────────────── */
.container{width:100%;max-width:1180px;margin:0 auto;padding:0 var(--gutter)}
.section-head{text-align:center;max-width:660px;margin:0 auto 56px}
.section-head h2{margin-bottom:12px}
.section-head__sub{color:var(--muted);font-size:1.05rem}

.eyebrow{
  display:inline-block;
  font-size:0.72rem;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;
  padding:5px 14px;border-radius:999px;margin-bottom:16px;
  color:var(--blue);background:rgba(27,89,248,0.08);border:1px solid rgba(27,89,248,0.15);
}
.eyebrow--light{color:rgba(255,255,255,0.75);background:rgba(255,255,255,0.1);border-color:rgba(255,255,255,0.18)}

/* ─── BUTTONS ────────────────────────────────────────────────────── */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  font-weight:700;font-size:0.95rem;padding:14px 28px;
  border-radius:var(--r);letter-spacing:-0.01em;
  transition:transform .15s,box-shadow .2s,background .15s;
  white-space:nowrap;text-decoration:none;cursor:pointer;
}
.btn:hover{text-decoration:none;transform:translateY(-2px)}
.btn--primary{
  background:linear-gradient(135deg,#2563eb 0%,var(--blue) 50%,#4f46e5 100%);
  background-size:200% 200%;color:#fff;
  box-shadow:0 0 0 1px rgba(27,89,248,0.25),0 8px 32px rgba(27,89,248,0.35);
}
.btn--primary:hover{
  background-position:100% 100%;
  box-shadow:0 0 0 1px rgba(77,127,249,0.4),0 12px 48px rgba(27,89,248,0.5);
}
.btn--outline{color:var(--navy);background:#fff;border:1.5px solid var(--border);box-shadow:var(--sh-sm)}
.btn--outline:hover{border-color:var(--blue);color:var(--blue);box-shadow:0 4px 20px rgba(27,89,248,0.12)}
.btn--full{width:100%}
.btn--large{padding:17px 40px;font-size:1.05rem}
.btn--sm{padding:9px 18px;font-size:0.88rem}
.nav--pill .btn--sm{padding:9px 16px;font-size:0.84rem}

.dot-red{display:inline-block;width:7px;height:7px;border-radius:50%;background:#ff4545;box-shadow:0 0 0 0 rgba(255,69,69,0.5);animation:pulse 2s infinite}
.dot-green{display:inline-block;width:7px;height:7px;border-radius:50%;background:#00c48c;box-shadow:0 0 0 0 rgba(0,196,140,0.5);animation:pulse-green 2s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(255,69,69,0.5)}70%{box-shadow:0 0 0 8px rgba(255,69,69,0)}100%{box-shadow:0 0 0 0 rgba(255,69,69,0)}}
@keyframes pulse-green{0%{box-shadow:0 0 0 0 rgba(0,196,140,0.5)}70%{box-shadow:0 0 0 8px rgba(0,196,140,0)}100%{box-shadow:0 0 0 0 rgba(0,196,140,0)}}

/* ─── MODE SWITCHING ─────────────────────────────────────────────── */
/* launch-only hidden by default — no flash before JS runs */
.launch-only{display:none!important}
.mode-launch .launch-only{display:revert!important}
.mode-launch .wl-only    {display:none!important}

/* Launch mode hero CTA */
.launch-cta{display:flex;flex-direction:column;align-items:center;gap:10px;width:100%;max-width:520px}

/* ─── NAV ────────────────────────────────────────────────────────── */
.nav{
  position:sticky;top:0;z-index:50;
  background:rgba(246,248,255,0.85);
  backdrop-filter:saturate(180%) blur(20px);
  border-bottom:1px solid rgba(27,89,248,0.08);
  padding-top:0;padding-bottom:0;
  transition:background 0.45s ease, border-color 0.45s ease, padding 0.45s cubic-bezier(.4,0,.2,1);
}
.nav--pill{
  background:transparent!important;
  border-bottom-color:transparent!important;
  padding-top:10px;
  padding-bottom:10px;
}
.nav__inner{
  display:flex;align-items:center;justify-content:space-between;height:66px;
  transition:max-width 0.45s cubic-bezier(.4,0,.2,1), height 0.45s cubic-bezier(.4,0,.2,1), border-radius 0.45s cubic-bezier(.4,0,.2,1), background 0.45s ease, box-shadow 0.45s ease, padding 0.45s cubic-bezier(.4,0,.2,1);
}
.nav--pill .nav__inner{
  max-width:360px;
  height:52px;
  border-radius:999px;
  background:rgba(248,250,255,0.96);
  backdrop-filter:saturate(200%) blur(28px);
  box-shadow:0 0 0 1px rgba(27,89,248,0.10), 0 4px 24px rgba(13,22,48,0.08);
  padding:0 8px 0 14px;
}
.nav__brand{display:flex;align-items:center;gap:0}
.nav__wordmark{
  font-family:var(--font-d);
  font-size:17px;
  font-weight:800;
  letter-spacing:-0.03em;
  color:var(--navy);
  margin-left:10px;
  overflow:hidden;
  white-space:nowrap;
  max-width:140px;
  opacity:1;
  transition:opacity 0.25s ease, max-width 0.4s cubic-bezier(.4,0,.2,1), margin-left 0.4s cubic-bezier(.4,0,.2,1);
}
.nav--pill .nav__wordmark{opacity:0;max-width:0;margin-left:0}
.logo-svg{
  height:36px;width:auto;display:block;
  transition:height 0.45s cubic-bezier(.4,0,.2,1);
}
.nav--pill .logo-svg{height:32px}
.nav-btn--pill{display:none}
.nav-btn--full{display:inline-flex;align-items:center;gap:6px}
.nav--pill .nav-btn--full{display:none}
.nav--pill .nav-btn--pill{display:inline}
@keyframes logo-blink{0%,88%,100%{transform:scaleY(1)}93%{transform:scaleY(0.08)}}
.logo-eye-l,.logo-eye-r{transform-box:fill-box;transform-origin:center}
.logo-eye-l{animation:logo-blink 5s 0.8s infinite}
.logo-eye-r{animation:logo-blink 5s 0.86s infinite}
.nav__links{
  display:flex;gap:28px;font-weight:500;font-size:0.92rem;
  opacity:1;
  transition:opacity 0.25s ease, max-width 0.4s cubic-bezier(.4,0,.2,1);
  overflow:hidden;
}
.nav--pill .nav__links{opacity:0;pointer-events:none;max-width:0;gap:0}
.nav__links a{color:var(--muted);transition:color .15s}
.nav__links a:hover{color:var(--navy);text-decoration:none}
@media(max-width:700px){.nav__links{display:none}}

/* ─── HERO ───────────────────────────────────────────────────────── */
.hero{
  position:relative;
  padding:clamp(72px,9vw,110px) 0 0;
  background:var(--bg);
  overflow:hidden;
}

/* Background blobs */
.hero__bg{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.hero__orb{position:absolute;border-radius:50%;filter:blur(90px);will-change:transform}
.hero__orb--1{
  width:700px;height:700px;top:-200px;right:-120px;
  background:radial-gradient(circle,rgba(27,89,248,0.2) 0%,rgba(124,58,237,0.1) 50%,transparent 70%);
  animation:drift1 20s ease-in-out infinite alternate;
}
.hero__orb--2{
  width:600px;height:600px;bottom:-150px;left:-100px;
  background:radial-gradient(circle,rgba(252,142,68,0.15) 0%,rgba(236,68,146,0.08) 50%,transparent 70%);
  animation:drift2 16s ease-in-out infinite alternate;
}
.hero__orb--3{
  width:400px;height:400px;top:30%;left:35%;
  background:radial-gradient(circle,rgba(0,196,140,0.07) 0%,transparent 60%);
  animation:drift1 24s ease-in-out infinite alternate-reverse;
}
@keyframes drift1{0%{transform:translate(0,0) scale(1)}50%{transform:translate(40px,-30px) scale(1.08)}100%{transform:translate(-15px,15px) scale(0.97)}}
@keyframes drift2{0%{transform:translate(0,0)}50%{transform:translate(-30px,25px) scale(1.1)}100%{transform:translate(20px,-15px) scale(0.95)}}
.hero__grid{
  position:absolute;inset:0;
  background-image:radial-gradient(rgba(27,89,248,0.07) 1px,transparent 1px);
  background-size:32px 32px;
  mask-image:radial-gradient(ellipse 80% 70% at 50% 30%,black,transparent);
}
.hero__beam{
  position:absolute;top:0;left:50%;transform:translateX(-50%);
  width:1.5px;height:280px;
  background:linear-gradient(180deg,rgba(27,89,248,0.5) 0%,rgba(124,58,237,0.2) 60%,transparent 100%);
  pointer-events:none;
}
.hero__topline{
  position:absolute;top:0;left:0;right:0;height:2px;
  background:linear-gradient(90deg,transparent 0%,rgba(27,89,248,0.5) 25%,rgba(124,58,237,0.5) 50%,rgba(252,142,68,0.4) 75%,transparent 100%);
  pointer-events:none;
}

/* Hero content - stacked layout: text top, character below */
.hero__inner{
  position:relative;z-index:1;
  max-width:860px;margin:0 auto;
  display:flex;flex-direction:column;align-items:center;
  text-align:center;
  padding-bottom:clamp(48px,6vw,72px);
}
.hero__inner .hero__sub{text-align:center}
.hero__inner .social-proof{justify-content:center;margin-top:16px}
.hero__inner .waitlist,.hero__inner .launch-cta{align-items:center}
.hero__char-wrap{margin-top:clamp(24px,4vw,40px)}
.scarcity-pill{
  display:inline-flex;align-items:center;gap:9px;
  padding:7px 18px;border-radius:999px;margin-bottom:24px;
  background:rgba(255,255,255,0.8);
  border:1px solid rgba(27,89,248,0.15);
  backdrop-filter:blur(8px);
  font-size:0.82rem;color:var(--muted);
  box-shadow:0 2px 12px rgba(27,89,248,0.08);
}
.scarcity-pill strong{color:var(--navy)}

.hero h1{margin-bottom:20px;text-wrap:balance;color:var(--navy)}
.text-shine{
  background:linear-gradient(135deg,var(--blue) 0%,#6366f1 25%,var(--purple) 45%,var(--pink) 65%,var(--orange) 85%,#f59e0b 100%);
  background-size:300% 300%;
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
  animation:shine-shift 4s ease infinite alternate;
}
@keyframes shine-shift{0%{background-position:0% 50%}100%{background-position:100% 50%}}

.hero__sub{
  font-size:1.12rem;color:var(--muted);
  max-width:580px;margin-bottom:36px;line-height:1.75;text-wrap:balance;
}

/* Waitlist */
.waitlist{display:flex;flex-direction:column;gap:8px;width:100%;max-width:480px}
.waitlist__row{display:flex;gap:8px}
.waitlist input{
  flex:1;padding:15px 20px;border-radius:var(--r);
  border:1.5px solid var(--border);background:#fff;
  color:var(--ink);outline:none;font-size:1rem;
  transition:border-color .15s,box-shadow .15s;
  box-shadow:0 2px 8px rgba(13,22,48,0.04);
}
.waitlist input::placeholder{color:var(--subtle)}
.waitlist input:focus{border-color:var(--blue);box-shadow:0 0 0 4px rgba(27,89,248,0.12)}
.waitlist__note{font-size:0.82rem;color:var(--subtle)}
.waitlist__success{padding:18px 20px;background:rgba(0,196,140,0.06);border:1px solid rgba(0,196,140,0.2);border-radius:var(--r);color:var(--ink);font-size:0.95rem;line-height:1.6;text-align:left}
.waitlist__success strong{display:block;margin-bottom:4px;color:#00875a}
.waitlist__success a{color:#00875a;text-decoration:underline}
.waitlist.sent .waitlist__row,.waitlist.sent .waitlist__note{display:none}
@media(max-width:480px){.waitlist__row{flex-direction:column}}

/* ─── MAGNEETY CHARACTER ─────────────────────────────────────────── */
.hero__char-wrap{
  position:relative;
  width:min(420px,100%);height:500px;
  padding-top:80px;
  margin:0 auto;
  display:flex;align-items:center;justify-content:center;
  flex-shrink:0;
}

/* Orbit ring — visual dashed circle only, does NOT contain items */
.char-orbit-ring{
  position:absolute;inset:0;border-radius:50%;
  border:1.5px dashed rgba(27,89,248,0.18);
  animation:orbit-spin 24s linear infinite;
  pointer-events:none;
}
.char-orbit-ring::after{
  content:'';position:absolute;inset:22px;border-radius:50%;
  border:1px dashed rgba(124,58,237,0.09);
  animation:orbit-spin 16s linear infinite reverse;
}
@keyframes orbit-spin{to{transform:rotate(360deg)}}

/* Orbit items — zero-size anchors that travel around the ring */
.char-orbit-item{
  position:absolute;top:50%;left:50%;
  width:0;height:0;
  animation:orbit-travel 24s linear infinite;
  animation-delay:calc(var(--i) * -4.8s);
}
@keyframes orbit-travel{
  from{transform:rotate(0deg) translateX(185px) rotate(0deg)}
  to  {transform:rotate(360deg) translateX(185px) rotate(-360deg)}
}
/* The visible pill — centered on the anchor, always upright */
.coi-inner{
  position:absolute;
  transform:translate(-50%,-50%);
  display:flex;align-items:center;gap:6px;
  padding:7px 13px 7px 8px;border-radius:999px;
  background:rgba(255,255,255,0.92);
  border:1px solid rgba(27,89,248,0.12);
  backdrop-filter:blur(12px);
  font-size:0.75rem;font-weight:600;color:var(--ink);
  white-space:nowrap;
  box-shadow:0 4px 16px rgba(13,22,48,0.1);
}
.coi-icon{
  width:22px;height:22px;border-radius:6px;
  display:grid;place-items:center;
  color:#fff;font-size:0.68rem;font-weight:800;flex-shrink:0;
}

/* Sparkles */
.char-sparkle{
  position:absolute;color:var(--blue);font-size:1rem;pointer-events:none;
  animation:sparkle-float var(--dur,3s) ease-in-out infinite var(--delay,0s) alternate;
}
@keyframes sparkle-float{
  0%{transform:translate(0,0) scale(1) rotate(0deg);opacity:0.4}
  100%{transform:translate(var(--tx,8px),var(--ty,-12px)) scale(1.3) rotate(30deg);opacity:1}
}

/* ── Magneety character (human-like mascot) ── */
.magneety-char{
  position:relative;z-index:2;
  animation:char-float 3.4s ease-in-out infinite;
}
@keyframes char-float{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-18px)}
}
.char-glow{
  position:absolute;top:42%;left:50%;
  transform:translate(-50%,-50%);
  width:190px;height:190px;border-radius:50%;
  background:radial-gradient(circle,rgba(27,89,248,0.5) 0%,rgba(124,58,237,0.2) 45%,transparent 70%);
  animation:glow-pulse 3.4s ease-in-out infinite;
  pointer-events:none;filter:blur(5px);z-index:-1;
}
@keyframes glow-pulse{
  0%,100%{transform:translate(-50%,-50%) scale(1);opacity:0.7}
  50%{transform:translate(-50%,-50%) scale(1.3);opacity:1}
}
.char-figure{
  display:flex;flex-direction:column;align-items:center;
  filter:drop-shadow(0 16px 40px rgba(27,89,248,0.45));
}

/* Magnet hat (horseshoe) */
.char-hat{
  position:relative;width:46px;height:28px;
  margin-bottom:-4px;z-index:3;flex-shrink:0;
}
.char-hat__arc{
  position:absolute;top:0;left:0;right:0;bottom:9px;
  border:6px solid #4f46e5;
  border-radius:23px 23px 0 0;
  border-bottom:none;
}
.char-hat__tips{
  position:absolute;bottom:0;left:0;right:0;
  display:flex;justify-content:space-between;
}
.char-hat__tip{width:11px;height:10px;border-radius:0 0 5px 5px}
.char-hat__tip--l{background:#ef4444;box-shadow:0 3px 8px rgba(239,68,68,0.6)}
.char-hat__tip--r{background:#3b82f6;box-shadow:0 3px 8px rgba(59,130,246,0.6)}

/* Head */
.char-head{
  width:88px;height:88px;border-radius:50%;
  background:linear-gradient(160deg,#2563eb 0%,#1b59f8 55%,#3730a3 100%);
  border:2.5px solid rgba(255,255,255,0.28);
  box-shadow:inset 0 3px 0 rgba(255,255,255,0.28),inset 0 -3px 0 rgba(0,0,0,0.18);
  display:flex;flex-direction:column;align-items:center;
  justify-content:center;gap:7px;
  position:relative;overflow:hidden;
}
.char-head::before{
  content:'';position:absolute;top:7px;left:12px;right:12px;height:16px;
  background:rgba(255,255,255,0.1);border-radius:50%;pointer-events:none;
}
.char-eyes{display:flex;gap:15px;position:relative;z-index:1}
.char-eye{
  width:21px;height:21px;border-radius:50%;background:#fff;
  display:flex;align-items:center;justify-content:center;
  overflow:hidden;
  animation:eye-blink 5s ease-in-out infinite;
  box-shadow:0 2px 5px rgba(0,0,0,0.2);
}
.char-eye:nth-child(2){animation-delay:0.12s}
@keyframes eye-blink{
  0%,82%,100%{transform:scaleY(1)}
  86%,90%{transform:scaleY(0.06)}
}
.char-pupil{
  width:10px;height:10px;border-radius:50%;
  background:#1a2440;position:relative;
  animation:pupil-look 9s ease-in-out infinite;
}
@keyframes pupil-look{
  0%,40%,100%{transform:translate(0,0)}
  20%{transform:translate(2px,-1px)}
  60%{transform:translate(-2px,1px)}
  80%{transform:translate(1px,0)}
}
.char-pupil::after{
  content:'';position:absolute;top:2px;right:1px;
  width:4px;height:4px;border-radius:50%;background:#fff;opacity:0.85;
}
.char-face-bottom{
  display:flex;align-items:center;gap:5px;
  position:relative;z-index:1;
}
.char-cheek{
  width:11px;height:7px;border-radius:50%;
  background:rgba(255,140,180,0.5);
}
.char-mouth{
  width:20px;height:8px;
  border-bottom:2.5px solid rgba(255,255,255,0.7);
  border-left:2.5px solid transparent;border-right:2.5px solid transparent;
  border-radius:0 0 10px 10px;
}

/* Torso */
.char-torso{
  width:68px;height:52px;
  background:linear-gradient(180deg,#1b59f8 0%,#1236a0 100%);
  border-radius:12px 12px 20px 20px;
  border:2px solid rgba(255,255,255,0.15);border-top:none;
  display:flex;align-items:center;justify-content:center;
  position:relative;
}
.char-torso__badge{
  width:26px;height:26px;border-radius:50%;
  background:rgba(255,255,255,0.18);
  border:1.5px solid rgba(255,255,255,0.3);
  display:grid;place-items:center;
  color:#fff;font-weight:900;font-size:0.82rem;
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.25);
}
.char-arm{
  position:absolute;top:5px;
  width:13px;height:34px;
  background:linear-gradient(180deg,#1b59f8,#1236a0);
  border-radius:7px;
  border:2px solid rgba(255,255,255,0.12);
}
.char-arm--l{left:-13px;transform:rotate(12deg);transform-origin:top center}
.char-arm--r{right:-13px;transform:rotate(-12deg);transform-origin:top center}

/* Feet */
.char-feet{display:flex;gap:10px}
.char-foot{
  width:22px;height:12px;
  background:linear-gradient(180deg,#0e2a8a,#091f70);
  border-radius:0 0 9px 9px;
  border:2px solid rgba(255,255,255,0.1);border-top:none;
}

/* Shadow */
.char-shadow{
  width:60px;height:8px;
  background:radial-gradient(ellipse,rgba(27,89,248,0.28) 0%,transparent 70%);
  border-radius:50%;margin:5px auto 0;
  animation:shadow-scale 3.4s ease-in-out infinite;
}
@keyframes shadow-scale{
  0%,100%{transform:scale(1);opacity:0.6}
  50%{transform:scale(0.6);opacity:0.2}
}

/* Floating stat badges */
.hero-float-badge{
  position:absolute;
  display:flex;align-items:center;gap:8px;
  padding:10px 16px;border-radius:999px;
  background:rgba(255,255,255,0.9);
  border:1px solid rgba(27,89,248,0.12);
  backdrop-filter:blur(16px);
  box-shadow:0 8px 32px rgba(13,22,48,0.1);
  font-size:0.78rem;font-weight:600;color:var(--ink);
  white-space:nowrap;pointer-events:none;
  animation:badge-bob var(--bob-dur,4s) ease-in-out infinite var(--bob-delay,0s) alternate;
}
.hero-float-badge__num{font-weight:900;font-size:1.1rem;background:linear-gradient(135deg,var(--blue),var(--purple));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.hero-float-badge__label{color:var(--muted);font-weight:500}
.hero-float-badge--1{bottom:18%;left:-8px;--bob-dur:3.8s;--bob-delay:0s}
.hero-float-badge--2{top:12%;right:-10px;--bob-dur:4.5s;--bob-delay:1s}
@keyframes badge-bob{
  0%{transform:translateY(0)}
  100%{transform:translateY(-10px)}
}

@media(max-width:520px){
  .hero__char-wrap{width:300px;height:340px;padding-top:0}
  .char-orbit-item{display:none!important}
  .char-orbit-ring{border:none}
  .char-hat{display:none}
  .hero-float-badge{display:none}
}

/* ─── HERO APP FRAME ─────────────────────────────────────────────── */
.hero__app{position:relative;z-index:1;margin-top:clamp(32px,4vw,56px)}
.app-frame{
  border-radius:var(--r-xl) var(--r-xl) 0 0;overflow:hidden;
  border:1.5px solid rgba(27,89,248,0.15);border-bottom:none;
  box-shadow:0 0 0 1px rgba(255,255,255,0.8),0 -20px 80px rgba(27,89,248,0.14),0 -2px 0 rgba(27,89,248,0.1);
}
.app-frame__bar{
  display:flex;align-items:center;gap:6px;padding:10px 16px;
  background:#f1f5f9;border-bottom:1px solid var(--border);
}
.app-frame__bar span{width:10px;height:10px;border-radius:50%}
.app-frame__bar span:nth-child(1){background:#ff5f56}
.app-frame__bar span:nth-child(2){background:#ffbd2e}
.app-frame__bar span:nth-child(3){background:#27c93f}
.app-frame__url{margin-left:auto;font-size:0.74rem;color:var(--subtle)}

/* App shell */
.app-shell{display:grid;grid-template-columns:172px 1fr;background:#f0f2f7;min-height:420px}
.app-sidebar{background:#fff;border-right:1px solid #e4e9f2;display:flex;flex-direction:column;overflow:hidden}
.app-sidebar__brand{display:flex;align-items:center;gap:9px;padding:14px 14px 12px;border-bottom:1px solid #e4e9f2;flex-shrink:0}
.app-sidebar__mark{width:26px;height:26px;border-radius:7px;background:var(--blue);display:grid;place-items:center;color:#fff;font-weight:900;font-size:0.82rem;flex-shrink:0}
.app-sidebar__name{font-weight:800;font-size:0.82rem;color:#1a2440;letter-spacing:-0.01em}
.app-sidebar ul{list-style:none;padding:10px 8px;flex:1;display:flex;flex-direction:column;gap:1px}
.app-sidebar li{display:flex;align-items:center;gap:8px;padding:7px 10px;border-radius:7px;font-size:0.78rem;font-weight:500;color:#6b7a99;cursor:pointer;transition:background .12s,color .12s;white-space:nowrap}
.app-sidebar li:hover{background:#f4f6fb;color:#1a2440}
.app-sidebar li.active{background:#eef2ff;color:var(--blue);font-weight:600}
.app-sidebar__icon{width:15px;height:15px;flex-shrink:0;display:inline-block;opacity:0.5;vertical-align:middle;color:currentColor}
.app-sidebar li.active .app-sidebar__icon{opacity:1}
.app-soon{margin-left:auto;font-size:0.58rem;font-weight:700;padding:2px 5px;border-radius:4px;background:#fef3c7;color:#d97706}
.app-sidebar__footer{padding:10px 10px 12px;border-top:1px solid #e4e9f2;flex-shrink:0}
.app-user-row{display:flex;align-items:center;gap:8px}
.app-user-avatar{width:26px;height:26px;border-radius:50%;background:linear-gradient(135deg,var(--blue),var(--purple));display:grid;place-items:center;color:#fff;font-weight:700;font-size:0.67rem;flex-shrink:0}
.app-user-avatar--logo{background:transparent;overflow:hidden}
.app-user-avatar--logo img{border-radius:50%;width:100%;height:100%;object-fit:cover}
.app-user-info{display:flex;flex-direction:column;min-width:0}
.app-user-info span{font-size:0.74rem;font-weight:600;color:#1a2440;overflow:hidden;text-overflow:ellipsis}
.app-user-info small{font-size:0.63rem;color:#9aa5be}
.app-main{background:#f8f9fb;display:flex;flex-direction:column;overflow:hidden}
.app-topbar{display:flex;align-items:center;justify-content:space-between;padding:9px 14px;background:#fff;border-bottom:1px solid #e4e9f2;flex-shrink:0;gap:8px}
.app-topbar__left{display:flex;align-items:center;gap:8px;flex-shrink:0}
.app-lvl-badge{display:flex;align-items:center;gap:5px;background:linear-gradient(135deg,var(--blue),var(--purple));border-radius:8px;padding:3px 8px 3px 4px}
.app-lvl-num{width:18px;height:18px;border-radius:50%;background:rgba(255,255,255,0.25);color:#fff;font-size:0.63rem;font-weight:800;display:grid;place-items:center}
.app-lvl-label{color:#fff;font-size:0.65rem;font-weight:700}
.app-streak{display:flex;align-items:center;gap:3px;font-size:0.72rem;color:#6b7a99}
.app-streak strong{color:#ea580c;font-weight:700}
.app-topbar__search{display:flex;align-items:center;gap:6px;background:#f4f6fb;border:1px solid #e4e9f2;border-radius:7px;padding:5px 10px;flex:1;max-width:160px}
.app-topbar__search span{font-size:0.7rem;color:#9aa5be;flex:1}
.app-topbar__search kbd{font-size:0.6rem;color:#b0bdd6;font-family:inherit;background:#e4e9f2;border-radius:4px;padding:1px 4px}
.app-topbar__right{display:flex;align-items:center;gap:5px;flex-shrink:0}
.app-notif{width:28px;height:28px;border-radius:7px;background:#f4f6fb;border:1px solid #e4e9f2;display:grid;place-items:center;cursor:pointer;margin-left:2px}
.app-chip{font-size:0.67rem;font-weight:600;padding:4px 8px;border-radius:6px;background:#f0f2f7;color:#6b7a99;border:1px solid #e4e9f2;cursor:pointer;transition:all .15s}
.app-chip.active{background:var(--blue);color:#fff;border-color:var(--blue)}
.app-content{padding:13px 15px;display:flex;flex-direction:column;gap:10px;overflow:hidden}
.app-greeting strong{display:block;font-size:0.88rem;font-weight:700;color:#1a2440;margin-bottom:1px}
.app-greeting span{font-size:0.73rem;color:#9aa5be}
.app-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:7px}
.app-kpi{padding:11px 12px;border-radius:9px;background:#fff;border:1px solid #e4e9f2}
.app-kpi span{font-size:0.63rem;color:#9aa5be;text-transform:uppercase;letter-spacing:0.04em;display:block;margin-bottom:5px;font-weight:500}
.app-kpi strong{font-weight:800;font-size:1.05rem;color:#1a2440;display:block;margin-bottom:2px}
.app-kpi em{font-style:normal;font-size:0.63rem;font-weight:700}
.app-kpi--blue{border-top:2px solid var(--blue)}
.app-kpi--green{border-top:2px solid #00c48c}
.app-kpi--purple{border-top:2px solid var(--purple)}
.app-kpi--amber{border-top:2px solid var(--amber)}
.up{color:#00a878}
.neutral{color:#9aa5be}
.app-charts{display:grid;grid-template-columns:1.5fr 1fr;gap:8px}
.app-chart-main{background:#fff;border:1px solid #e4e9f2;border-radius:9px;padding:12px 13px}
.app-chart-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:9px}
.app-chart-header span{font-size:0.71rem;color:#9aa5be;font-weight:500}
.app-chart-tabs{display:flex;gap:3px}
.app-chart-tabs button{padding:3px 7px;border-radius:5px;font-size:0.64rem;font-weight:600;color:#9aa5be;cursor:pointer;transition:all .15s}
.app-chart-tabs button.active{background:#eef2ff;color:var(--blue)}
.chart-svg{width:100%;height:65px}
.chart-area{animation:chart-fill 1.2s ease forwards}
.chart-line{stroke-dasharray:600;stroke-dashoffset:600;animation:draw-line 1.4s ease .2s forwards}
.chart-dot{opacity:0;animation:fade-in 0.3s ease 1.5s forwards}
@keyframes draw-line{to{stroke-dashoffset:0}}
@keyframes chart-fill{from{opacity:0}to{opacity:1}}
@keyframes fade-in{to{opacity:1}}
.app-platform-breakdown{background:#fff;border:1px solid #e4e9f2;border-radius:9px;padding:12px 13px;display:flex;flex-direction:column;gap:8px}
.app-pb-title{font-size:0.63rem;font-weight:700;color:#9aa5be;text-transform:uppercase;letter-spacing:0.07em;margin-bottom:2px}
.app-pb-row{display:flex;align-items:center;gap:7px;font-size:0.7rem}
.app-pb-row span:first-child{width:60px;color:#6b7a99;flex-shrink:0;font-weight:500}
.app-pb-bar{flex:1;height:4px;background:#e4e9f2;border-radius:999px;overflow:hidden}
.app-pb-bar div{height:100%;background:var(--blue);border-radius:999px;animation:bar-grow 1s ease .5s both}
.app-pb-row span:last-child{font-weight:700;color:#1a2440;width:52px;text-align:right;font-size:0.67rem}
@keyframes bar-grow{from{width:0!important}to{}}
/* Connects with strip */
.app-connects{display:flex;align-items:center;gap:20px;padding:16px 0;flex-wrap:wrap}
.app-connects__label{font-size:0.75rem;font-weight:600;color:var(--subtle);white-space:nowrap}
.app-connects__logos{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.acp{display:flex;align-items:center;gap:5px;padding:4px 10px 4px 4px;border-radius:999px;background:#fff;border:1px solid var(--border);box-shadow:0 1px 4px rgba(13,22,48,0.05)}
.acp__icon{width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;overflow:hidden;color:#fff;font-size:0.58rem;font-weight:800;flex-shrink:0}
.acp__icon svg{width:16px;height:16px}
.acp__name{font-size:0.7rem;font-weight:600;color:var(--navy)}
.acp--soon{opacity:0.45}
.acp--soon .acp__name::after{content:" soon";font-size:0.62rem;font-weight:500;color:var(--subtle)}
.acp--more{background:transparent;border-color:transparent;box-shadow:none;padding:4px 6px}
.acp__more-text{font-size:0.7rem;font-weight:500;color:var(--subtle);white-space:nowrap}

/* Social proof strip */
.social-proof{
  display:flex;align-items:center;gap:14px;
  margin-top:20px;
}
.sp-avatars{display:flex}
.sp-avatar{
  width:32px;height:32px;border-radius:50%;
  display:grid;place-items:center;
  color:#fff;font-weight:700;font-size:0.75rem;
  border:2px solid var(--bg);
  margin-left:-8px;
}
.sp-avatars .sp-avatar:first-child{margin-left:0}
.sp-text{display:flex;flex-direction:column;gap:2px}
.sp-stars{color:#f59e0b;font-size:0.8rem;letter-spacing:1px;line-height:1}
.sp-text span{font-size:0.82rem;color:var(--muted)}
.sp-text strong{color:var(--navy)}
@media(max-width:860px){.app-kpis{grid-template-columns:repeat(2,1fr)}.app-charts{grid-template-columns:1fr}.app-platform-breakdown{display:none}}
@media(max-width:640px){.app-sidebar{display:none}.app-shell{grid-template-columns:1fr}}

/* ─── PAIN ───────────────────────────────────────────────────────── */
.pain{padding:var(--sy) 0;background:var(--bg);border-top:1px solid var(--border);position:relative;overflow:hidden}
.pain::before{
  content:'';position:absolute;top:-200px;right:-150px;
  width:500px;height:500px;border-radius:50%;
  background:radial-gradient(circle,rgba(236,68,146,0.06) 0%,transparent 60%);
  pointer-events:none;
}
.pain::after{
  content:'';position:absolute;bottom:-150px;left:-100px;
  width:400px;height:400px;border-radius:50%;
  background:radial-gradient(circle,rgba(252,142,68,0.06) 0%,transparent 60%);
  pointer-events:none;
}
.pain__label{text-align:center;font-size:0.75rem;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:0.12em;margin-bottom:36px}
.pain__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;max-width:1000px;margin:0 auto 44px}
.pain__card{
  padding:30px 28px 28px;border-radius:var(--r-xl);
  border:1px solid rgba(0,0,0,0.06);
  transition:transform .22s,box-shadow .22s;
}
.pain__card:hover{transform:translateY(-5px)}
.pain__card--pink{background:linear-gradient(140deg,#fff4f6,#ffe8f2);border-color:rgba(236,68,146,0.12)}
.pain__card--pink:hover{box-shadow:0 16px 50px rgba(236,68,146,0.14)}
.pain__card--amber{background:linear-gradient(140deg,#fff8ec,#fff2d4);border-color:rgba(252,142,68,0.15)}
.pain__card--amber:hover{box-shadow:0 16px 50px rgba(252,142,68,0.14)}
.pain__card--blue{background:linear-gradient(140deg,#f0f5ff,#eaefff);border-color:rgba(27,89,248,0.1)}
.pain__card--blue:hover{box-shadow:0 16px 50px rgba(27,89,248,0.1)}
.pain__card-icon{font-size:2rem;margin-bottom:14px;line-height:1}
.pain__card h3{font-size:1.08rem;margin-bottom:10px;color:var(--navy)}
.pain__card p{font-size:0.96rem;color:var(--muted);line-height:1.65}
.pain__cta-line{text-align:center;font-size:1.18rem;color:var(--navy);max-width:660px;margin:0 auto;font-weight:500;line-height:1.55}
.pain__cta-line strong{font-weight:800}
@media(max-width:780px){.pain__grid{grid-template-columns:1fr}}

/* ─── HOW IT WORKS ───────────────────────────────────────────────── */
.howit{padding:var(--sy) 0;background:var(--bg)}
.steps{
  display:grid;grid-template-columns:repeat(4,1fr);gap:20px;
}
.step{
  padding:28px 24px;border-radius:var(--r-xl);
  background:#fff;border:1.5px solid var(--border);
  position:relative;overflow:hidden;
  transition:transform .2s,box-shadow .2s;
}
.step:hover{transform:translateY(-4px);box-shadow:var(--sh-card)}
.step::before{
  content:'';position:absolute;top:0;left:0;right:0;height:3px;
  background:linear-gradient(90deg,var(--blue),var(--purple));
}
.step__num{
  font-size:0.65rem;font-weight:800;letter-spacing:0.12em;
  color:rgba(27,89,248,0.3);margin-bottom:12px;
}
.step__icon{font-size:1.8rem;margin-bottom:12px;line-height:1}
.step h3{font-size:1rem;margin-bottom:8px;color:var(--navy)}
.step p{font-size:0.88rem;color:var(--muted);line-height:1.6}
@media(max-width:860px){.steps{grid-template-columns:repeat(2,1fr)}}
@media(max-width:480px){.steps{grid-template-columns:1fr}}

/* ─── FEATURE SHOWCASES ──────────────────────────────────────────── */
.showcase{padding:var(--sy) 0;background:var(--bg);border-top:1px solid var(--border)}
.showcase--tinted{background:linear-gradient(160deg,#f4f7ff,#f9f5ff,#fff5fb)}
.showcase--dark{
  background:linear-gradient(160deg,#06091a 0%,#09112b 50%,#0b1335 100%);
  border-top:none;position:relative;overflow:hidden;
}
.showcase--dark::before{
  content:'';position:absolute;top:-100px;right:-100px;
  width:500px;height:500px;border-radius:50%;
  background:radial-gradient(circle,rgba(124,58,237,0.12) 0%,transparent 60%);
  pointer-events:none;
}
.showcase--dark::after{
  content:'';position:absolute;bottom:-100px;left:-100px;
  width:400px;height:400px;border-radius:50%;
  background:radial-gradient(circle,rgba(27,89,248,0.1) 0%,transparent 60%);
  pointer-events:none;
}
.showcase--dark h2{color:#fff}
.showcase--dark p{color:rgba(255,255,255,0.5)}

.showcase__inner{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,6vw,80px);align-items:center}
.showcase--flip .showcase__inner{direction:rtl}
.showcase--flip .showcase__inner>*{direction:ltr}
.showcase__copy h2{margin-bottom:14px}
.showcase__copy p{color:var(--muted);line-height:1.7;margin-bottom:20px}
.showcase__bullets{list-style:none;display:grid;gap:10px}
.showcase__bullets li{padding-left:24px;position:relative;font-size:0.95rem;color:var(--ink)}
.showcase__bullets li::before{content:"✓";position:absolute;left:0;color:var(--blue);font-weight:800}
.showcase__bullets--light li{color:rgba(255,255,255,0.7)}
.showcase__bullets--light li::before{color:var(--green)}
@media(max-width:860px){
  .showcase__inner{grid-template-columns:1fr;gap:36px}
  .showcase--flip .showcase__inner{direction:ltr}
}

/* ─── MOCK CARDS ─────────────────────────────────────────────────── */
.mock-card{
  background:#fff;border:1.5px solid var(--border);
  border-radius:var(--r-xl);overflow:hidden;
  box-shadow:0 12px 50px rgba(13,22,48,0.1),0 2px 8px rgba(0,0,0,0.04);
  transition:box-shadow .25s,transform .25s,border-color .25s;
}
.mock-card:hover{
  box-shadow:0 20px 70px rgba(13,22,48,0.12),0 0 0 1.5px rgba(27,89,248,0.2),0 0 40px rgba(27,89,248,0.06);
  transform:translateY(-5px);
  border-color:rgba(27,89,248,0.2);
}
.mock-card__header{
  padding:13px 17px;background:#f8fafc;border-bottom:1px solid var(--border);
  font-weight:600;font-size:0.85rem;color:var(--navy);
  display:flex;align-items:center;justify-content:space-between;gap:12px;
}
.mock-badge{font-size:0.7rem;padding:3px 10px;border-radius:999px;background:#eef2ff;color:var(--blue);font-weight:600;border:1px solid rgba(27,89,248,0.15)}

/* Dashboard mini */
.mock-kpis-mini{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;padding:13px}
.mk{padding:10px;border-radius:var(--r);background:#f7f9fc;border:1px solid #e4e9f2;text-align:center}
.mk span{font-size:0.63rem;color:#9aa5be;text-transform:uppercase;letter-spacing:0.04em;display:block;margin-bottom:4px;font-weight:500}
.mk strong{font-weight:800;font-size:0.9rem;color:#1a2440;display:block;margin-bottom:2px}
.mk em{font-style:normal;font-size:0.65rem;font-weight:700}
.chart-svg--sm{display:block;width:calc(100% - 26px);height:65px;margin:0 13px 7px}
.mock-breakdown{padding:9px 13px 13px;display:grid;gap:7px}
.mock-pb{display:flex;align-items:center;gap:8px;font-size:0.73rem}
.mock-pb span{width:60px;color:#9aa5be;flex-shrink:0;font-weight:500}
.mock-pb>div{flex:1;height:4px;background:#e4e9f2;border-radius:999px;overflow:hidden}
.mock-pb>div>div{height:100%;background:var(--blue);border-radius:999px;animation:bar-grow 1s ease .6s both}
.mock-pb b{font-weight:700;font-size:0.7rem;color:#1a2440;white-space:nowrap;width:48px;text-align:right}

/* AI mock */
.ai-message{padding:13px;display:grid;gap:8px}
.ai-msg{padding:12px 14px;border-radius:var(--r);font-size:0.84rem;line-height:1.55}
.ai-msg strong{display:block;font-size:0.74rem;font-weight:700;margin-bottom:5px}
.ai-msg--positive{background:#f0fdf8;border:1px solid rgba(0,196,140,0.25);color:#1a4d3a}
.ai-msg--positive strong{color:#00a878}
.ai-msg--warning{background:#fffbeb;border:1px solid rgba(245,158,11,0.3);color:#713f12}
.ai-msg--warning strong{color:#d97706}
.ai-msg--action{background:#eef2ff;border:1px solid rgba(27,89,248,0.2);color:#1e3a8a}
.ai-msg--action strong{color:var(--blue)}
.ai-action-btn{display:block;width:100%;margin-top:10px;padding:8px;border-radius:var(--r);background:var(--blue);color:#fff;font-weight:700;font-size:0.82rem;text-align:center;cursor:pointer;border:none}
.mock-chat{padding:11px 13px;border-top:1px solid #e4e9f2}
.mock-chat__input{padding:9px 13px;background:#f7f9fc;border:1px solid #e4e9f2;border-radius:var(--r);font-size:0.8rem;color:#9aa5be;font-style:italic}

/* Wizard mock */
.wizard-progress{display:flex;align-items:center;gap:10px;padding:11px 15px;background:#f8fafc;border-bottom:1px solid #e4e9f2}
.wizard-progress__bar{flex:1;height:4px;background:#e4e9f2;border-radius:999px;overflow:hidden}
.wizard-progress__bar div{height:100%;background:linear-gradient(90deg,var(--blue),var(--purple));border-radius:999px;animation:bar-grow 0.8s ease .3s both}
.wizard-progress span{font-size:0.7rem;color:#9aa5be;white-space:nowrap;font-weight:500}
.wizard-q{padding:14px 15px 9px;font-weight:700;color:#1a2440;font-size:0.93rem}
.wizard-options{padding:0 15px;display:grid;gap:7px;margin-bottom:10px}
.wizard-opt{padding:10px 13px;border-radius:var(--r);border:1px solid #e4e9f2;background:#f7f9fc;color:#6b7a99;font-size:0.84rem;cursor:pointer;transition:border-color .15s,background .15s}
.wizard-opt--selected{border-color:var(--blue);background:#eef2ff;color:var(--blue);font-weight:600}
.wizard-ai-note{margin:0 15px 10px;padding:10px 12px;background:#fffbeb;border:1px solid #fde68a;border-radius:var(--r);font-size:0.77rem;color:#713f12;line-height:1.4}
.wizard-nav{display:flex;justify-content:space-between;padding:0 15px 13px}
.wiz-back{color:#9aa5be;font-weight:600;font-size:0.82rem;padding:7px 13px}
.wiz-next{background:var(--blue);color:#fff;font-weight:700;font-size:0.82rem;padding:7px 15px;border-radius:var(--r)}
.ad-preview{margin:0 15px 15px;border-top:1px solid #e4e9f2;padding-top:12px}
.ad-preview__label{font-size:0.64rem;font-weight:700;color:#9aa5be;text-transform:uppercase;letter-spacing:0.08em;margin-bottom:8px}
.ad-preview__card{background:#fff;border-radius:var(--r);padding:12px;border:1px solid #e4e9f2;box-shadow:0 1px 3px rgba(0,0,0,0.05)}
.ad-preview__sp{font-size:0.7rem;color:#888;margin-bottom:3px}
.ad-preview__title{font-weight:700;color:#1a0dab;font-size:0.9rem;margin-bottom:2px}
.ad-preview__url{font-size:0.72rem;color:#006621;margin-bottom:4px}
.ad-preview__body{font-size:0.8rem;color:#4a4a4a;line-height:1.4}

/* Scheduler mock */
.sched-tabs{display:flex;gap:3px}
.sched-tabs button{padding:4px 9px;border-radius:6px;font-size:0.7rem;font-weight:600;color:#9aa5be;cursor:pointer;transition:all .15s}
.sched-tabs button.active{background:#eef2ff;color:var(--blue)}
.sched-compose{padding:6px 11px;border-radius:var(--r);background:var(--blue);color:#fff;font-weight:700;font-size:0.73rem;cursor:pointer}
.cal-grid{padding:10px 12px;border-bottom:1px solid #e4e9f2}
.cal-head{display:grid;grid-template-columns:repeat(7,1fr);gap:3px;margin-bottom:4px}
.cal-head span{font-size:0.61rem;font-weight:700;color:#9aa5be;text-align:center;text-transform:uppercase}
.cal-body{display:grid;grid-template-columns:repeat(7,1fr);gap:3px}
.cal-day{min-height:44px;border-radius:6px;background:#f7f9fc;border:1px solid #e4e9f2;padding:3px;display:flex;flex-direction:column;gap:3px}
.cal-post-chip{padding:3px 5px;border-radius:4px;font-weight:700;font-size:0.59rem;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cal-post-chip--draft{background:transparent;color:#9aa5be;border:1px dashed #d1d5e0}
.composer-sneak{padding:12px}
.composer-sneak__label{font-size:0.68rem;font-weight:700;color:#9aa5be;margin-bottom:7px}
.composer-sneak__text{font-size:0.82rem;color:#1a2440;line-height:1.5;padding:11px;background:#f7f9fc;border-radius:var(--r);border:1px solid #e4e9f2;margin-bottom:9px}
.composer-sneak__actions{display:flex;gap:7px}
.composer-sneak__actions button{padding:7px 12px;border-radius:var(--r);font-weight:700;font-size:0.76rem;cursor:pointer;background:#f1f3f9;color:#6b7a99;border:1px solid #e4e9f2}
.csa-approve{background:#f0fdf8!important;color:#00a878!important;border-color:rgba(0,200,140,0.25)!important}

/* Brand Brain mock */
.bb-section{padding:12px 15px;border-bottom:1px solid #e4e9f2}
.bb-section label{display:block;font-size:0.64rem;font-weight:700;color:#9aa5be;text-transform:uppercase;letter-spacing:0.07em;margin-bottom:8px}
.bb-tags{display:flex;flex-wrap:wrap;gap:7px}
.bb-tag{padding:5px 12px;border-radius:999px;font-size:0.77rem;font-weight:600;border:1px solid #e4e9f2;color:#6b7a99;cursor:pointer;background:#f7f9fc;transition:all .15s}
.bb-tag--on{background:#eef2ff;border-color:rgba(27,89,248,0.25);color:var(--blue)}
.bb-input{font-size:0.82rem;color:#1a2440;line-height:1.5;padding:10px 12px;background:#f7f9fc;border-radius:var(--r);border:1px solid #e4e9f2}
.bb-compare{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:12px 15px}
.bb-compare__label{font-size:0.68rem;font-weight:700;margin-bottom:7px}
.bb-compare__col:first-child .bb-compare__label{color:#e05252}
.bb-compare__col:last-child .bb-compare__label{color:#00a878}
.bb-compare__text{font-size:0.8rem;line-height:1.5;padding:10px;border-radius:var(--r)}
.bb-compare__text--bad{background:#fff5f5;border:1px solid rgba(192,57,43,0.15);color:#6b2020}
.bb-compare__text--good{background:#f0fdf8;border:1px solid rgba(0,196,140,0.2);color:#1a4d3a}

/* ─── VALUE ──────────────────────────────────────────────────────── */
.value{
  padding:var(--sy) 0;
  background:linear-gradient(160deg,#050814 0%,#080f24 40%,#06091e 100%);
  position:relative;overflow:hidden;
}
.value::before{
  content:'';position:absolute;
  top:-200px;left:50%;transform:translateX(-50%);
  width:700px;height:700px;border-radius:50%;
  background:radial-gradient(circle,rgba(27,89,248,0.08) 0%,rgba(124,58,237,0.05) 40%,transparent 60%);
  pointer-events:none;
}
.value__inner{max-width:720px;margin:0 auto}
.value h2{color:#fff;margin-bottom:32px;text-align:center}
.value__table{display:grid;gap:8px}
.value__row{display:flex;justify-content:space-between;align-items:center;padding:15px 20px;border-radius:var(--r);gap:16px}
.value__row--bad{background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.07);color:rgba(255,255,255,0.45);font-size:0.95rem}
.value__row--bad span:last-child{font-weight:700;color:rgba(255,90,90,0.7);white-space:nowrap}
.value__divider{text-align:center;font-weight:700;font-size:0.85rem;color:rgba(255,255,255,0.2);padding:8px 0;letter-spacing:0.06em}
.value__row--good{background:rgba(27,89,248,0.14);border:1.5px solid rgba(27,89,248,0.3);color:#fff;font-weight:600}
.value__price{font-weight:800;font-size:1.15rem;color:var(--green);white-space:nowrap}
@media(max-width:560px){.value__row{flex-direction:column;align-items:flex-start;gap:5px}}

/* ─── PRICING ────────────────────────────────────────────────────── */
.pricing{padding:var(--sy) 0;background:var(--bg);border-top:1px solid var(--border)}
.spots-bar{max-width:860px;margin:0 auto 32px}
.spots-bar__labels{display:flex;justify-content:space-between;font-size:0.88rem;color:var(--muted);margin-bottom:9px}
.urgent{color:#c0392b;font-weight:700}
.spots-bar__track{height:7px;background:#e0e6f8;border-radius:999px;overflow:hidden}
.spots-bar__fill{height:100%;background:linear-gradient(90deg,var(--blue),var(--purple));border-radius:999px}
.spots-bar--sm .spots-bar__track{height:4px}
.spots-bar--sm{max-width:none;margin:0 auto 10px}
.plans{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;max-width:860px;margin:0 auto}
.plan{position:relative;padding:36px;border-radius:var(--r-2);display:flex;flex-direction:column;transition:box-shadow .2s,transform .2s}
.plan{background:#fff;border:1.5px solid var(--border)}
.plan:hover{box-shadow:var(--sh-card);transform:translateY(-3px)}
.plan h3{font-size:1.5rem;margin-bottom:4px}
.plan__for{color:var(--muted);font-size:0.9rem;padding-bottom:18px;border-bottom:1px solid var(--border);margin-bottom:18px}
.plan__price-row{display:flex;align-items:baseline;gap:10px;margin-bottom:2px;flex-wrap:wrap}
.plan__amount{font-weight:900;font-size:2.8rem;color:var(--navy)}
.plan__period{color:var(--muted)}
.plan__was{font-size:0.8rem;color:var(--muted)}
.plan__vat{font-size:0.74rem;color:var(--subtle);margin-bottom:20px}
.plan__features{list-style:none;display:grid;gap:11px;flex-grow:1;margin-bottom:26px}
.plan__features li{padding-left:26px;position:relative;font-size:0.94rem}
.plan__features li::before{content:"✓";position:absolute;left:0;top:2px;width:17px;height:17px;border-radius:50%;background:rgba(27,89,248,0.1);color:var(--blue);font-size:0.62rem;font-weight:700;display:grid;place-items:center}
.plan--featured{background:var(--dark);border-color:rgba(27,89,248,0.35);box-shadow:var(--sh-blue)}
.plan--featured h3,.plan--featured .plan__amount{color:#fff}
.plan--featured .plan__for{color:rgba(255,255,255,0.38);border-color:rgba(255,255,255,0.07)}
.plan--featured .plan__period{color:rgba(255,255,255,0.38)}
.plan--featured .plan__was{color:rgba(255,255,255,0.3)}
.plan--featured .plan__vat{color:rgba(255,255,255,0.25)}
.plan--featured .plan__features li{color:rgba(255,255,255,0.8)}
.plan--featured .plan__features li::before{background:rgba(27,89,248,0.25);color:#7eb0ff}
.plan--featured:hover{box-shadow:var(--sh-glow)}
.plan__badge{position:absolute;top:-13px;left:50%;transform:translateX(-50%);background:linear-gradient(90deg,var(--blue),var(--purple),var(--pink));background-size:200% 200%;animation:shine-shift 4s ease infinite alternate;color:#fff;font-weight:700;font-size:0.68rem;padding:5px 16px;border-radius:999px;letter-spacing:0.06em;text-transform:uppercase;white-space:nowrap;box-shadow:0 4px 20px rgba(27,89,248,0.35)}
.plan__lock-note{margin-top:10px;font-size:0.78rem;color:rgba(255,255,255,0.3);text-align:center}
.plan__value-note{
  font-size:0.76rem;font-weight:700;color:var(--green);
  text-align:center;margin-bottom:12px;margin-top:-4px;
  letter-spacing:0.02em;
}
.plan--featured .plan__value-note{color:#6ee7b7}
.guarantee{display:flex;gap:18px;align-items:flex-start;max-width:860px;margin:28px auto 0;padding:22px 28px;border-radius:var(--r-xl);background:#fff;border:1px solid var(--border);box-shadow:var(--sh-sm)}
.guarantee span{font-size:1.8rem;flex-shrink:0}
.guarantee strong{display:block;color:var(--navy);margin-bottom:3px}
.guarantee div{font-size:0.94rem;color:var(--muted);line-height:1.6}

/* ─── THE MATH ───────────────────────────────────────────────────── */
.themath{
  padding:var(--sy) 0;
  background:linear-gradient(160deg,#fafbff,#f4f7ff);
  border-top:1px solid var(--border);
}
.math-grid{
  display:grid;grid-template-columns:1fr 1fr;
  gap:24px;max-width:940px;margin:0 auto 32px;
}
.math-col{
  border-radius:var(--r-xl);padding:32px 28px;
}
.math-col--bad{
  background:#fff;border:1.5px solid var(--border);
}
.math-col--good{
  background:linear-gradient(160deg,#eef2ff,#f0fdf8);
  border:2px solid rgba(27,89,248,0.2);
  box-shadow:var(--sh-blue);
}
.math-col__label{
  font-size:0.72rem;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;
  margin-bottom:20px;padding-bottom:14px;border-bottom:1px solid var(--border);
}
.math-col--bad .math-col__label{color:var(--subtle)}
.math-col--good .math-col__label{color:var(--blue);border-color:rgba(27,89,248,0.15)}
.math-items{display:grid;gap:12px}
.math-item{
  display:flex;justify-content:space-between;align-items:center;
  gap:12px;font-size:0.9rem;
}
.math-item__name{color:var(--muted);flex:1}
.math-item__cost{font-weight:700;white-space:nowrap;text-align:right}
.math-item__cost--bad{color:#c0392b}
.math-item__cost--good{color:#00875a}
.math-item__cost small{font-weight:400;font-size:0.78rem;opacity:0.7}
.math-item--total{
  margin-top:8px;padding-top:16px;border-top:1px solid var(--border);
}
.math-item--total .math-item__name{font-weight:700;color:var(--navy)}
.math-item--total .math-item__cost--bad{font-size:1rem}
.math-item--total .math-item__cost--good{font-size:1.15rem;color:var(--blue)}
.math-footnote{
  text-align:center;max-width:680px;margin:0 auto;
  font-size:1.05rem;color:var(--muted);line-height:1.65;
}
.math-footnote strong{color:var(--navy)}
@media(max-width:680px){
  .math-grid{grid-template-columns:1fr}
  .math-col{padding:24px 20px}
}
@media(max-width:700px){.plans{grid-template-columns:1fr}}

/* ─── FAQ ────────────────────────────────────────────────────────── */
.faq{padding:var(--sy) 0;background:var(--bg);border-top:1px solid var(--border)}
.faq__inner{max-width:740px;margin:0 auto}
.faq-list{display:grid;gap:10px}
.faq-list details{background:var(--bg);border:1.5px solid var(--border);border-radius:var(--r-xl);overflow:hidden;transition:border-color .2s,box-shadow .2s}
.faq-list details[open]{border-color:rgba(27,89,248,0.3);box-shadow:0 0 0 3px rgba(27,89,248,0.05)}
.faq-list summary{list-style:none;cursor:pointer;padding:20px 24px;font-weight:700;color:var(--navy);display:flex;align-items:center;justify-content:space-between;gap:16px;user-select:none}
.faq-list summary::-webkit-details-marker{display:none}
.faq-list summary::after{content:"+";flex-shrink:0;color:var(--blue);font-size:1.4rem;font-weight:300}
.faq-list details[open] summary::after{content:"–"}
.faq-list details p{padding:0 24px 20px;color:var(--muted);line-height:1.7}
.faq-list a{color:var(--blue)}

/* ─── FINAL CTA ──────────────────────────────────────────────────── */
.final-cta{
  padding:var(--sy) 0 calc(var(--sy) * 1.2);
  background:linear-gradient(160deg,#040714 0%,#070c20 40%,#080c1e 100%);
  position:relative;overflow:hidden;
}
.final-cta::before{
  content:'';position:absolute;
  top:-200px;left:50%;transform:translateX(-50%);
  width:900px;height:900px;border-radius:50%;
  background:radial-gradient(circle,rgba(27,89,248,0.12) 0%,rgba(124,58,237,0.06) 40%,transparent 60%);
  pointer-events:none;
}
.final-cta::after{
  content:'';position:absolute;
  bottom:-200px;left:50%;transform:translateX(-50%);
  width:600px;height:600px;border-radius:50%;
  background:radial-gradient(circle,rgba(252,142,68,0.06) 0%,transparent 60%);
  pointer-events:none;
}
.final-cta__inner{position:relative;z-index:1;max-width:640px;margin:0 auto;text-align:center}
.final-spots{margin-bottom:36px}
.final-spots p{font-size:0.85rem;color:rgba(255,255,255,0.4);margin-top:8px}
.final-spots strong{color:#ff8080}
.final-cta h2{color:#fff;margin-bottom:16px}
.final-cta p{color:rgba(255,255,255,0.45);font-size:1.04rem;max-width:520px;margin:0 auto 32px;line-height:1.7}
.final-cta .final-micro{font-size:0.78rem;color:rgba(255,255,255,0.25);margin-top:48px;line-height:1.5;white-space:nowrap}

/* ─── CHARACTER SCENES (repeat appearances) ──────────────────────── */
.char-scene{
  position:absolute;
  display:flex;flex-direction:column;align-items:center;gap:8px;
  pointer-events:none;z-index:0;
}

/* Pain section - top right, confused mini character */
.char-scene--pain{
  top:-20px;right:0;
  transform:scale(0.52);
  transform-origin:top right;
}
.char-scene__bubble{
  background:rgba(255,255,255,0.95);
  border:1px solid var(--border);
  border-radius:12px 12px 12px 2px;
  padding:8px 14px;
  font-size:0.78rem;font-weight:600;color:var(--navy);
  white-space:nowrap;
  box-shadow:0 4px 16px rgba(13,22,48,0.08);
  margin-top:-8px;
}

/* Final CTA - centered above content */
.char-scene--cta{
  position:relative;
  margin:0 auto 32px;
  transform:scale(0.7);
  transform-origin:center bottom;
  height:170px;
}

/* Expression variants */
.char-mouth--confused{
  width:18px;height:6px;
  border-top:2.5px solid rgba(255,255,255,0.7);
  border-left:2.5px solid transparent;border-right:2.5px solid transparent;
  border-radius:12px 12px 0 0;
  border-bottom:none;
}
.char-mouth--big{
  width:26px;height:12px;
  border-bottom:3px solid rgba(255,255,255,0.85);
  border-left:3px solid transparent;border-right:3px solid transparent;
  border-radius:0 0 14px 14px;
}

/* Arm poses */
.char-arm--shrug{transform:rotate(-30deg)!important;transform-origin:bottom center!important}
.char-arm--up{transform:rotate(-70deg)!important;transform-origin:bottom center!important}

/* Smaller glow for mini chars */
.char-glow--sm{width:120px!important;height:120px!important}

/* Celebrate glow */
.char-glow--celebrate{
  background:radial-gradient(circle,rgba(252,142,68,0.4) 0%,rgba(27,89,248,0.2) 45%,transparent 70%)!important;
}

/* Red glow (pain / overwhelmed) */
.char-glow--red{
  background:radial-gradient(circle,rgba(239,68,68,0.35) 0%,rgba(252,142,68,0.15) 50%,transparent 70%)!important;
}

/* ── Eyebrows ── */
.char-brows{
  display:flex;gap:20px;margin-bottom:2px;
  position:relative;z-index:2;
}
.char-brow--l,.char-brow--r{
  width:14px;height:3px;border-radius:3px;
  background:rgba(255,255,255,0.75);
}
/* Worried: inner ends angled down */
.char-brows--worried .char-brow--l{transform:rotate(18deg);transform-origin:right center}
.char-brows--worried .char-brow--r{transform:rotate(-18deg);transform-origin:left center}
/* Excited: both lifted and arched out */
.char-brows--excited .char-brow--l{transform:rotate(-12deg) translateY(-3px);transform-origin:right center}
.char-brows--excited .char-brow--r{transform:rotate(12deg) translateY(-3px);transform-origin:left center}

/* ── Eye states ── */
.char-eye--tired{transform:scaleY(0.5);animation:none!important}
.char-eyes--wide .char-eye{transform:scaleY(1.18)}

/* ── Cheek states ── */
.char-cheek--flush{
  background:rgba(255,80,140,0.65)!important;
  width:13px!important;height:9px!important;
}

/* ── Shadow states ── */
.char-shadow--sm{width:44px!important;height:6px!important}
.char-shadow--far{
  width:36px!important;height:4px!important;
  margin-top:28px!important;
  animation:shadow-far 0.8s ease-in-out infinite!important;
}
@keyframes shadow-far{
  0%,100%{transform:scale(0.7);opacity:0.15}
  50%  {transform:scale(1.1);opacity:0.3}
}

/* ── Torso states ── */
.char-torso--lean{
  border-radius:16px 8px 20px 24px;
}

/* ── Character animations (whole body) ── */
.char--slump{animation:char-slump 4s ease-in-out infinite}
@keyframes char-slump{
  0%,100%{transform:translateY(0) rotate(-4deg)}
  50%    {transform:translateY(5px) rotate(-6deg)}
}
.char--jump{animation:char-jump 0.8s ease-in-out infinite}
@keyframes char-jump{
  0%,100%{transform:translateY(0)}
  50%    {transform:translateY(-22px)}
}

/* ── Figure transforms ── */
.char-figure--lean{
  transform:rotate(-7deg);
  transform-origin:bottom center;
}
.char-figure--jump{transform-origin:bottom center}

/* ── Hat variants ── */
.char-hat--tilt{transform:rotate(-22deg) translateX(-3px)}
.char-hat--bounce{animation:hat-bounce 0.8s ease-in-out infinite}
@keyframes hat-bounce{
  0%,100%{transform:translateY(0) rotate(0deg)}
  50%    {transform:translateY(-5px) rotate(7deg)}
}

/* ── Arm poses ── */
.char-arm--headrest{
  top:-30px!important;
  transform:rotate(-82deg)!important;
  transform-origin:bottom center!important;
}
.char-arm--headrest-r{
  top:-30px!important;
  transform:rotate(82deg)!important;
  transform-origin:bottom center!important;
}
.char-arm--cheer-l{
  top:-28px!important;
  transform:rotate(-148deg)!important;
  transform-origin:bottom center!important;
}
.char-arm--cheer-r{
  top:-28px!important;
  transform:rotate(148deg)!important;
  transform-origin:bottom center!important;
}
.char-arm--wave{
  animation:arm-wave 0.7s ease-in-out infinite alternate;
  transform-origin:bottom center!important;
}
@keyframes arm-wave{
  from{transform:rotate(-60deg)}
  to  {transform:rotate(-100deg)}
}

/* ── Feet poses ── */
.char-feet--sit{gap:22px!important;margin-top:6px}
.char-foot--l-sit{transform:rotate(-25deg) translateY(5px);border-radius:0 0 4px 10px}
.char-foot--r-sit{transform:rotate(25deg) translateY(5px);border-radius:0 0 10px 4px}
.char-feet--jump{gap:18px!important;margin-top:-4px}
.char-foot--kick-l{transform:rotate(28deg) translateY(-6px)}
.char-foot--kick-r{transform:rotate(-28deg) translateY(-6px)}

/* ── Speech bubble variant ── */
.char-scene__bubble--red{
  background:#fff5f5;
  border:1px solid rgba(239,68,68,0.22);
  color:#c0392b;
}

/* ─── BILLING TOGGLE ─────────────────────────────────────────────── */
.billing-toggle{
  display:flex;align-items:center;justify-content:center;gap:14px;
  margin-bottom:32px;
}
.billing-toggle__label{font-size:0.92rem;font-weight:600;color:var(--muted);transition:color .2s}
.billing-toggle__label[data-for="monthly"].active,
.billing-toggle__label[data-for="yearly"].active{color:var(--navy)}
.billing-toggle__btn{
  position:relative;width:48px;height:26px;border-radius:999px;
  background:#e0e6f8;border:none;cursor:pointer;
  transition:background .2s;flex-shrink:0;
}
.billing-toggle__btn[aria-checked="true"]{background:var(--blue)}
.billing-toggle__knob{
  position:absolute;top:3px;left:3px;
  width:20px;height:20px;border-radius:50%;background:#fff;
  box-shadow:0 1px 4px rgba(0,0,0,0.2);
  transition:transform .2s cubic-bezier(.4,0,.2,1);
}
.billing-toggle__btn[aria-checked="true"] .billing-toggle__knob{transform:translateX(22px)}
.save-badge{
  display:inline-block;font-size:0.68rem;font-weight:700;
  padding:3px 9px;border-radius:999px;margin-left:6px;
  background:linear-gradient(135deg,var(--green),#00a878);color:#fff;
  vertical-align:middle;
}

/* ─── EXIT-INTENT POPUPS ─────────────────────────────────────────── */
.ei-overlay{
  position:fixed;inset:0;z-index:1000;
  display:flex;align-items:center;justify-content:center;
  background:rgba(8,12,24,0.55);
  backdrop-filter:blur(6px);
  animation:ei-fade-in .25s ease;
}
.ei-overlay[hidden]{display:none}
@keyframes ei-fade-in{from{opacity:0}to{opacity:1}}
.ei-card{
  position:relative;
  width:100%;max-width:460px;
  margin:16px;padding:40px 40px 32px;
  border-radius:var(--r-2);
  background:#fff;
  box-shadow:0 32px 80px rgba(8,12,24,0.25),0 0 0 1px rgba(27,89,248,0.08);
  text-align:center;
  animation:ei-slide-up .3s cubic-bezier(.34,1.56,.64,1);
}
@keyframes ei-slide-up{from{transform:translateY(32px);opacity:0}to{transform:none;opacity:1}}
.ei-card--urgent{border-top:3px solid var(--blue)}
.ei-close{
  position:absolute;top:14px;right:16px;
  font-size:1rem;color:var(--subtle);
  background:none;border:none;cursor:pointer;
  width:28px;height:28px;border-radius:50%;
  display:grid;place-items:center;
  transition:background .15s,color .15s;
}
.ei-close:hover{background:var(--off);color:var(--navy)}
.ei-emoji{font-size:2.6rem;margin-bottom:14px;line-height:1}
.ei-title{font-size:1.35rem;color:var(--navy);margin-bottom:10px}
.ei-sub{color:var(--muted);font-size:0.96rem;line-height:1.65;margin-bottom:20px}
.ei-price-row{
  display:flex;align-items:center;justify-content:center;gap:16px;
  margin-bottom:24px;
}
.ei-old{font-size:1rem;color:var(--subtle);text-decoration:line-through}
.ei-new{
  font-size:2rem;font-weight:900;color:var(--navy);
  background:linear-gradient(135deg,var(--blue),var(--purple));
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
}
.ei-new span{font-size:0.9rem;font-weight:600;-webkit-text-fill-color:initial;color:var(--muted)}
.ei-cta{margin-bottom:12px}
.ei-decline{
  display:block;width:100%;text-align:center;
  font-size:0.82rem;color:var(--subtle);
  background:none;border:none;cursor:pointer;
  padding:8px;transition:color .15s;
}
.ei-decline:hover{color:var(--muted)}

/* ─── REVEAL ─────────────────────────────────────────────────────── */
.reveal{opacity:0;transform:translateY(14px);transition:opacity .38s ease,transform .38s ease;will-change:opacity,transform}
.reveal.visible{opacity:1;transform:none}

/* ─── FOOTER ─────────────────────────────────────────────────────── */
.footer{background:var(--dark);border-top:1px solid var(--bd);padding:52px 0 24px}
.footer__inner{display:grid;grid-template-columns:1.2fr 2fr;gap:48px;padding-bottom:38px;border-bottom:1px solid var(--bd)}
.footer__brand img{height:24px;filter:brightness(0) invert(1)}
.footer__brand p{font-size:0.88rem;color:rgba(255,255,255,0.28);margin-top:12px}
.footer__cols{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.footer__cols h4{color:rgba(255,255,255,0.38);margin-bottom:14px}
.footer__cols ul{list-style:none;display:grid;gap:10px}
.footer__cols a{color:rgba(255,255,255,0.38);font-size:0.9rem;transition:color .15s}
.footer__cols a:hover{color:#fff;text-decoration:none}
.footer__legal{padding-top:22px;font-size:0.78rem;color:rgba(255,255,255,0.2);line-height:1.7}
.footer__legal a{color:rgba(255,255,255,0.35)}
@media(max-width:720px){.footer__inner{grid-template-columns:1fr}}
@media(max-width:460px){.footer__cols{grid-template-columns:repeat(2,1fr)}}

/* ─── MOBILE (comprehensive) ─────────────────────────────────────── */
/* Bottom nav - hidden by default, shown in mobile media query */
.app-bottom-nav{display:none}

@media(max-width:600px){
  /* Nav */
  .nav__inner{height:58px}
  .nav .nav-btn--full{display:none}
  .nav .nav-btn--pill{display:inline}

  /* Hero */
  .hero{padding-top:48px}
  .hero__inner{padding-bottom:0;text-align:center}
  .hero__char-wrap{width:260px;height:280px;padding-top:0;margin-top:16px;margin-bottom:0}
  .char-orbit-item{display:none!important}
  .char-orbit-ring{border:none}
  .hero-float-badge{display:none}
  .char-sparkle{display:none}
  h1{font-size:clamp(2.6rem,9vw,3.2rem)}
  .hero__sub{font-size:0.97rem;margin-bottom:28px}
  .waitlist{width:100%;max-width:100%}
  .waitlist__row{flex-direction:column;gap:10px}
  .waitlist__row input,.waitlist__row .btn{width:100%}
  .waitlist__note{text-align:center}
  .social-proof{flex-direction:row;flex-wrap:wrap;justify-content:center;gap:10px}
  .scarcity-pill{font-size:0.82rem;padding:8px 14px;white-space:nowrap}
  .scarcity-extra{display:none}

  /* App frame */
  .hero__app{overflow:hidden;margin-top:24px}
  .app-frame{border-radius:var(--r) var(--r) 0 0}
  .app-connects{gap:8px;padding:10px 0;justify-content:center}
  .app-connects__logos{display:flex;flex-wrap:wrap;justify-content:center;gap:8px}
  .acp__name{display:none}
  .acp{padding:5px;border-radius:50%}
  .acp--more{display:none}

  /* Stats */
  .stats__inner{display:grid;grid-template-columns:1fr 1fr}
  .stat__divider{display:none}
  .stat{border-bottom:1px solid var(--border);padding:12px 10px}
  .stat:nth-child(odd){border-right:1px solid var(--border)}
  .stat:nth-last-child(1),.stat:nth-last-child(2){border-bottom:none}
  .stat__num{font-size:1.5rem}
  .stat__label{font-size:0.76rem}

  /* Pain */
  .char-scene--pain{display:none}
  .pain__grid{grid-template-columns:1fr;gap:12px}
  .pain__card{padding:22px 20px}
  .pain__cta-line{font-size:1rem}

  /* Biz pills */
  .biz-pill{font-size:0.8rem;padding:8px 14px}

  /* Steps */
  .steps-v{grid-template-columns:1fr}
  .stepv{padding-bottom:28px}

  /* Showcases */
  .showcase__inner{grid-template-columns:1fr;gap:28px}
  .showcase--flip .showcase__inner{direction:ltr}
  .showcase__copy h2{font-size:1.7rem}
  .mock-kpis-mini{grid-template-columns:repeat(2,1fr)}

  /* Compare */
  .compare-head,.compare-row{grid-template-columns:1.4fr 1fr}
  .compare-cell--other:not(:first-of-type){display:none}
  .compare-cell{padding:12px 10px;font-size:0.82rem}
  .compare-cell--label{padding:12px 14px}

  /* Team */
  .team__inner--solo{grid-template-columns:1fr}
  .team__inner--solo .team__text{text-align:center}
  .team__inner--solo .eyebrow{display:block;text-align:center}
  .team-card--solo{max-width:100%}
  .team-card__links{justify-content:center}

  /* Billing */
  .billing-toggle{gap:10px}
  .plans{grid-template-columns:1fr;gap:16px}
  .plan{padding:28px 24px}

  /* Value */
  .value__row{flex-direction:column;align-items:flex-start;gap:4px;padding:12px 16px}

  /* FAQ */
  .faq-list summary{padding:16px 18px;font-size:0.95rem}

  /* Final CTA */
  .final-cta__inner{padding:0 28px}
  .final-cta h2{font-size:1.8rem}
  .btn--large{padding:15px 24px;font-size:0.95rem;width:100%;max-width:360px}
  .final-cta .final-micro{font-size:0.74rem;white-space:normal}

  /* Exit popups */
  .ei-card{padding:32px 24px 24px;margin:12px}
  .ei-title{font-size:1.15rem}

  /* Footer */
  .footer__cols{grid-template-columns:repeat(2,1fr)}
  .footer__legal{font-size:0.68rem;word-break:break-word}

  /* URL bar hide */
  .app-frame__url--hide{display:none}



  /* Spacing variables */
  --sy:clamp(48px,8vw,80px);
  --gutter:20px;

  /* Bottom nav (mobile app mockup) */
  .app-bottom-nav{display:flex;justify-content:space-around;align-items:center;padding:8px 4px;background:#fff;border-top:1px solid #e4e9f2;flex-shrink:0}
  .app-bn-item{display:flex;flex-direction:column;align-items:center;gap:2px;padding:4px 8px;border-radius:8px;color:#9aa5be;font-size:0.52rem;font-weight:600;cursor:pointer}
  .app-bn-item.active{color:var(--blue)}
  .app-shell{grid-template-columns:1fr}
  .app-sidebar{display:none}
}

/* ─── STATS ──────────────────────────────────────────────────────── */
.stats{
  padding:clamp(36px,5vw,60px) 0;
  background:#fff;
  border-top:1px solid var(--border);
  border-bottom:1px solid var(--border);
}
.stats__inner{
  display:flex;align-items:center;justify-content:center;
}
.stat{
  text-align:center;
  padding:16px clamp(20px,4vw,48px);
  flex:1;
}
.stat__num{
  display:block;
  font-size:clamp(1.6rem,2.8vw,2.6rem);
  font-weight:900;
  letter-spacing:-0.03em;
  line-height:1;
  margin-bottom:8px;
}
.stat__label{
  font-size:0.84rem;
  color:var(--muted);
  line-height:1.4;
  max-width:140px;
  margin:0 auto;
}
.stat__divider{
  width:1px;
  height:52px;
  background:var(--border);
  flex-shrink:0;
}
@media(max-width:700px){
  .stats__inner{display:grid;grid-template-columns:1fr 1fr;flex-wrap:wrap}
  .stat__divider{display:none}
  .stat{border-bottom:1px solid var(--border)}
  .stat:nth-child(odd){border-right:1px solid var(--border)}
  .stat:nth-last-child(1),.stat:nth-last-child(2){border-bottom:none}
}
@media(max-width:380px){
  .stats__inner{grid-template-columns:1fr}
  .stat:nth-child(odd){border-right:none}
  .stat:last-child{border-bottom:none}
}

/* ─── BUSINESS TYPES ─────────────────────────────────────────────── */
.biz-types{
  padding:var(--sy) 0;
  background:var(--bg);
  border-top:1px solid var(--border);
  overflow:hidden;
}
.biz-pills{
  display:flex;flex-wrap:wrap;gap:12px;
  justify-content:center;max-width:880px;margin:0 auto 0;
  position:relative;z-index:1;
  padding-bottom:clamp(48px,8vw,100px);
}
.biz-pill{
  display:inline-flex;align-items:center;gap:8px;
  padding:10px 20px;border-radius:999px;
  font-size:0.9rem;font-weight:600;
  cursor:default;
  transition:transform .18s,box-shadow .18s;
  border:1.5px solid transparent;
}
.biz-pill:hover{transform:translateY(-3px);box-shadow:0 8px 24px rgba(0,0,0,0.1)}
.biz-pill--blue{background:rgba(27,89,248,0.07);color:var(--blue);border-color:rgba(27,89,248,0.15)}
.biz-pill--pink{background:rgba(236,68,146,0.07);color:var(--pink);border-color:rgba(236,68,146,0.15)}
.biz-pill--green{background:rgba(0,196,140,0.07);color:#009966;border-color:rgba(0,196,140,0.2)}
.biz-pill--purple{background:rgba(124,58,237,0.07);color:var(--purple);border-color:rgba(124,58,237,0.15)}
.biz-pill--orange{background:rgba(252,142,68,0.08);color:#c05c00;border-color:rgba(252,142,68,0.2)}
/* ─── STEPS (vertical timeline) ──────────────────────────────────── */
.steps-v{
  display:grid;
  grid-template-columns:1fr 1fr;
  column-gap:clamp(40px,8vw,100px);
  max-width:900px;margin:0 auto;
}
.stepv{
  display:flex;gap:22px;padding-bottom:44px;
}
.stepv--last{padding-bottom:0}
.stepv__left{
  display:flex;flex-direction:column;align-items:center;
  flex-shrink:0;
}
.stepv__num{
  width:46px;height:46px;border-radius:50%;
  background:linear-gradient(135deg,var(--blue),var(--purple));
  color:#fff;font-weight:900;font-size:0.84rem;
  display:grid;place-items:center;
  box-shadow:0 4px 16px rgba(27,89,248,0.3);
  flex-shrink:0;letter-spacing:0.02em;
}
.stepv__line{
  width:2px;flex:1;margin-top:8px;
  background:linear-gradient(180deg,rgba(27,89,248,0.22),rgba(124,58,237,0.08));
  min-height:32px;
}
.stepv__right{padding-top:8px}
.stepv__icon{font-size:1.7rem;margin-bottom:10px;line-height:1}
.stepv__right h3{font-size:1.04rem;margin-bottom:8px;color:var(--navy)}
.stepv__right p{font-size:0.9rem;color:var(--muted);line-height:1.65}
@media(max-width:760px){
  .steps-v{grid-template-columns:1fr;column-gap:0}
  .stepv--last{padding-bottom:0}
}

/* ─── COMPARISON TABLE ───────────────────────────────────────────── */
.compare{
  padding:var(--sy) 0;
  background:var(--bg);
  border-top:1px solid var(--border);
}
.compare-table{
  width:100%;max-width:900px;margin:0 auto;
  border-radius:var(--r-xl);overflow:hidden;
  border:1.5px solid var(--border);
  box-shadow:var(--sh-card);
  background:#fff;
}
.compare-head{
  display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;
  background:#f8fafc;border-bottom:2px solid var(--border);
}
.compare-cell{
  padding:16px 18px;font-size:0.88rem;
  display:flex;flex-direction:column;justify-content:center;
}
.compare-cell--label{
  font-weight:600;color:var(--navy);
  padding:16px 24px;
}
.compare-cell--magneety{
  background:rgba(27,89,248,0.04);
  border-left:2px solid var(--blue);
  text-align:center;align-items:center;
}
.compare-cell--other{
  text-align:center;align-items:center;
  border-left:1px solid var(--border);
  color:var(--muted);
}
.compare-brand{
  display:flex;align-items:center;gap:7px;
  font-weight:700;color:var(--navy);margin-bottom:4px;font-size:0.88rem;
}
.compare-cell--other .compare-brand{
  font-weight:600;color:var(--muted);font-size:0.82rem;
  justify-content:center;
}
.compare-brand__mark{
  width:20px;height:20px;border-radius:5px;background:var(--blue);
  display:grid;place-items:center;color:#fff;font-weight:900;font-size:0.7rem;flex-shrink:0;
}
.compare-price{font-size:0.76rem;font-weight:600;color:var(--muted)}
.compare-price--bad{color:#c0392b}
.compare-row{
  display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;
  border-bottom:1px solid var(--border);
  transition:background .15s;
}
.compare-row:last-child{border-bottom:none}
.compare-row:hover{background:#f8fafc}
.compare-row .compare-cell--label{font-size:0.9rem;color:var(--navy);font-weight:500}
.compare-row .compare-cell--magneety{background:rgba(27,89,248,0.03)}
.cmp-yes{
  display:inline-flex;align-items:center;justify-content:center;
  width:26px;height:26px;border-radius:50%;
  background:rgba(0,196,140,0.12);
  color:#00875a;font-weight:900;font-size:0.85rem;
}
.cmp-no{
  display:inline-flex;align-items:center;justify-content:center;
  width:26px;height:26px;border-radius:50%;
  background:rgba(192,57,43,0.08);
  color:#c0392b;font-weight:900;font-size:0.85rem;
}
.cmp-partial{font-size:0.76rem;color:var(--subtle);font-weight:500}
.cmp-highlight{color:var(--blue);font-weight:700;font-size:0.9rem}
.cmp-bad-text{font-size:0.82rem;color:var(--subtle)}
.compare-cta{text-align:center;margin-top:36px}
@media(max-width:700px){
  .compare-head,.compare-row{grid-template-columns:1.5fr 1fr 1fr}
  .compare-head .compare-cell--other:last-child,
  .compare-row .compare-cell--other:last-child{display:none}
}
@media(max-width:480px){
  .compare-head,.compare-row{grid-template-columns:1.5fr 1fr}
  .compare-head .compare-cell--other,
  .compare-row .compare-cell--other{display:none}
  .compare-head .compare-cell--other:first-of-type,
  .compare-row .compare-cell--other:first-of-type{display:flex}
}

/* ─── TESTIMONIALS ───────────────────────────────────────────────── */
.testimonials{
  padding:var(--sy) 0;
  background:linear-gradient(160deg,#fafbff,#f6f8ff);
  border-top:1px solid var(--border);
}
.testi-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:20px;
}
.testi-card{
  background:#fff;border:1.5px solid var(--border);
  border-radius:var(--r-xl);padding:28px 24px;
  display:flex;flex-direction:column;gap:14px;
  transition:transform .2s,box-shadow .2s;
}
.testi-card:hover{transform:translateY(-4px);box-shadow:var(--sh-card)}
.testi-card--highlight{
  background:var(--dark);border-color:rgba(27,89,248,0.35);
  box-shadow:var(--sh-blue);
}
.testi-card--highlight p{color:rgba(255,255,255,0.72)!important}
.testi-card--highlight .testi-stars{color:#ffd700}
.testi-card--highlight strong{color:#fff!important}
.testi-card--highlight span{color:rgba(255,255,255,0.38)!important}
.testi-stars{color:#f59e0b;font-size:0.85rem;letter-spacing:2px}
.testi-aggregate{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:12px;font-size:0.88rem;color:var(--muted)}
.testi-aggregate .testi-stars{font-size:1rem;letter-spacing:3px}
.testi-card p{
  font-size:0.96rem;color:var(--ink);line-height:1.7;
  flex-grow:1;font-style:italic;
}
.testi-author{
  display:flex;align-items:center;gap:12px;margin-top:auto;
}
.testi-avatar{
  width:40px;height:40px;border-radius:50%;
  display:grid;place-items:center;
  color:#fff;font-weight:700;font-size:0.78rem;flex-shrink:0;
}
.testi-author strong{display:block;font-size:0.88rem;color:var(--navy)}
.testi-author span{font-size:0.76rem;color:var(--muted)}
@media(max-width:860px) and (min-width:601px){.testi-grid{grid-template-columns:repeat(2,1fr)}}

/* ─── TEAM ───────────────────────────────────────────────────────── */
.team{
  padding:var(--sy) 0;
  background:#fff;
  border-top:1px solid var(--border);
}
.team__inner{
  display:grid;grid-template-columns:1fr 1fr;
  gap:clamp(32px,6vw,80px);align-items:center;
}
.team__text .eyebrow{margin-bottom:20px}
.team__text h2{margin-bottom:22px}
.team__text p{
  font-size:1rem;color:var(--muted);line-height:1.75;margin-bottom:18px;
}
.team__text p:last-child{margin-bottom:0}
.team__cards{display:grid;gap:16px}
.team-card{
  padding:28px 24px;border-radius:var(--r-xl);
  background:var(--bg);border:1.5px solid var(--border);
}
.team-card__avatar{
  width:52px;height:52px;border-radius:50%;
  display:grid;place-items:center;
  color:#fff;font-weight:800;font-size:1.05rem;
  margin-bottom:14px;
}
.team-card strong{display:block;font-size:1.05rem;color:var(--navy);margin-bottom:4px}
.team-card span{font-size:0.8rem;color:var(--blue);font-weight:600;display:block;margin-bottom:10px}
.team-card p{font-size:0.88rem;color:var(--muted);line-height:1.6}
@media(max-width:760px){.team__inner{grid-template-columns:1fr}}

/* Solo team layout */
.team__inner--solo{grid-template-columns:1fr 1.1fr}
.team__solo-card{position:relative}
.team-card--solo{width:100%;max-width:360px}
.team-card__links{display:flex;gap:12px;margin-top:14px;flex-wrap:wrap}
.team-card__links a{font-size:0.82rem;color:var(--blue);font-weight:600;text-decoration:underline}
@media(max-width:760px){
  .team__inner--solo{grid-template-columns:1fr}
}

.waitlist__error{font-size:0.84rem;color:#c0392b;padding:0 2px}


/* ─── MOBILE OVERRIDES (must come after component styles) ──────── */
@media(max-width:600px){
  /* Testimonials - force single-row horizontal scroll */
  .testi-grid{
    display:flex!important;
    flex-wrap:nowrap!important;
    overflow-x:auto;
    gap:14px;
    scroll-snap-type:x mandatory;
    padding-bottom:12px;
    -webkit-overflow-scrolling:touch;
  }
  .testi-card{
    min-width:82vw;
    max-width:82vw;
    scroll-snap-align:start;
    flex-shrink:0;
  }

  /* Biz pills - smaller, no cut-off, no empty space */
  .biz-pills{
    padding-bottom:8px;
    max-height:none;
    overflow:visible;
  }
  .biz-pills::after{display:none}
  .biz-pill{
    font-size:0.74rem;
    padding:7px 13px;
    gap:6px;
  }
}