/* ===========================================================================
   Anisa product funnel — shared styles.
   Motif inherited from the live atlasintelligenceai.com index.html.
   No Three.js, no grain filter. These pages load fast on a phone.
   =========================================================================== */

*{margin:0;padding:0;box-sizing:border-box}

:root{
  --bg:#05060c; --ink:#eef1fb; --muted:#9aa3bd; --gold:#ffce8a; --gold-soft:#e7b878;
  --cyan:#36e0ff; --violet:#9b6cff;
  /* WhatsApp-dark, for the phone mockup */
  --wa-screen:#0b141a; --wa-in:#202c33; --wa-out:#005c4b; --wa-text:#e9edef;
}

html{scroll-behavior:smooth}
html,body{height:100%}
body{
  background:radial-gradient(120% 120% at 72% 38%, #0b1228 0%, #070a16 42%, #04050b 100%) no-repeat;
  background-color:#04050b;
  color:var(--ink); font-family:'Manrope',system-ui,sans-serif; overflow-x:hidden;
  -webkit-font-smoothing:antialiased; line-height:1.5;
}

/* ── shared accent treatment ── */
.accent, .gold-em, em.gold{
  font-style:italic; font-family:'Space Grotesk',sans-serif; font-weight:300; padding-right:.14em;
  -webkit-box-decoration-break:clone; box-decoration-break:clone;
  background:linear-gradient(100deg,var(--gold) 10%,#fff3dc 60%,var(--gold-soft));
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent}

/* ── nav (from index.html) ── */
nav{position:fixed; top:0; left:0; right:0; z-index:15; display:flex; align-items:center; justify-content:space-between;
  padding:22px clamp(22px,5vw,64px); transition:background .4s ease, border-color .4s ease;
  border-bottom:1px solid transparent}
nav.scrolled{background:rgba(6,8,16,.72); backdrop-filter:blur(14px); border-bottom:1px solid rgba(255,255,255,.06)}
.brand{display:flex; align-items:center; gap:12px; font-family:'Space Grotesk',sans-serif; letter-spacing:.02em; text-decoration:none; color:var(--ink)}
.brand .mark{width:26px;height:26px;border-radius:50%;
  background:radial-gradient(circle at 35% 30%, #cfe6ff, #4f7bff 45%, #6a3cff 75%, #2a1a55);
  box-shadow:0 0 18px rgba(95,140,255,.6), inset 0 0 8px rgba(255,255,255,.5)}
.brand b{font-weight:500; font-size:15px; letter-spacing:.16em; text-transform:uppercase}
.brand b span{color:var(--gold)}
.navlinks{display:flex; align-items:center; gap:30px}
.navlinks a{color:var(--muted); text-decoration:none; font-size:14px; letter-spacing:.02em; transition:color .25s}
.navlinks a:hover{color:var(--ink)}
.navlinks a.active{color:var(--ink)}

.btn{display:inline-block; text-decoration:none; line-height:1; font-family:'Space Grotesk',sans-serif; font-size:13.5px; letter-spacing:.04em; cursor:pointer;
  padding:11px 20px; border-radius:100px; border:1px solid rgba(255,255,255,.16); background:transparent;
  color:var(--ink); transition:all .3s ease}
.btn:hover{border-color:var(--gold); color:var(--gold); box-shadow:0 0 24px rgba(255,206,138,.18)}
.btn-solid{background:linear-gradient(180deg,#fff3dc,#f0cf92); color:#1a1408; border:none; font-weight:600; box-shadow:0 0 22px rgba(255,206,138,.20)}
.btn-solid:hover{box-shadow:0 0 34px rgba(255,206,138,.5); color:#1a1408; transform:translateY(-1px)}
/* nav buttons must keep their button text color, not inherit the muted nav-link color */
.navlinks a.btn{color:var(--ink)}
.navlinks a.btn:hover{color:var(--gold)}
.navlinks a.btn-solid,.navlinks a.btn-solid:hover{color:#1a1408}
/* flagship nav item (Meet Anisa) gets a faint attracting glow */
.navlinks a.nf,.mobile-menu a.nf{color:var(--gold-soft)}
.navlinks a.nf{text-shadow:0 0 10px rgba(255,206,138,.45); animation:nfGlow 3.4s ease-in-out infinite}
.navlinks a.nf:hover{color:var(--gold)}
@keyframes nfGlow{0%,100%{text-shadow:0 0 6px rgba(255,206,138,.28)}50%{text-shadow:0 0 16px rgba(255,206,138,.72)}}

/* ── mobile menu (from index.html) ── */
.hamburger{display:none; width:42px; height:42px; border:1px solid rgba(255,255,255,.16); border-radius:12px;
  background:rgba(255,255,255,.03); cursor:pointer; position:relative; z-index:21}
.hamburger span{position:absolute; left:11px; width:20px; height:2px; background:var(--ink); transition:transform .3s ease, opacity .3s ease}
.hamburger span:nth-child(1){top:14px}
.hamburger span:nth-child(2){top:20px}
.hamburger span:nth-child(3){top:26px}
body.menu-open{overflow:hidden}
body.menu-open .hamburger span:nth-child(1){transform:translateY(6px) rotate(45deg)}
body.menu-open .hamburger span:nth-child(2){opacity:0}
body.menu-open .hamburger span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
.mobile-menu{position:fixed; inset:0; z-index:20; background:rgba(5,6,12,.97); backdrop-filter:blur(16px);
  display:flex; flex-direction:column; justify-content:center; gap:6px; padding:0 34px; opacity:0; pointer-events:none; transition:opacity .35s ease}
body.menu-open .mobile-menu{opacity:1; pointer-events:auto}
.mobile-menu a{color:var(--ink); text-decoration:none; font-family:'Space Grotesk',sans-serif; font-weight:300;
  font-size:1.8rem; letter-spacing:-.01em; padding:13px 0; border-bottom:1px solid rgba(255,255,255,.06)}
.mobile-menu a.cta{color:var(--gold); border:none; margin-top:20px}

/* ── layout ── */
.wrap{position:relative; z-index:3}
main{position:relative; z-index:3}
.section{position:relative; max-width:1160px; margin:0 auto; padding:clamp(64px,10vh,120px) clamp(22px,5vw,64px)}
.section.tight{padding-top:clamp(30px,5vh,60px)}
.sec-head{margin-bottom:clamp(34px,5vh,58px); max-width:820px}
.eyebrow{display:inline-flex; align-items:center; gap:12px; font-family:'Space Grotesk',sans-serif;
  font-size:12.5px; letter-spacing:.42em; text-transform:uppercase; color:var(--gold-soft); margin-bottom:22px}
.eyebrow::before{content:""; width:34px; height:1px; background:linear-gradient(90deg,var(--gold-soft),transparent)}
.eyebrow.center{justify-content:center}
.eyebrow.center::before{display:none}

h1{font-family:'Space Grotesk',sans-serif; font-weight:400; font-size:clamp(2.4rem,6vw,4.4rem);
  line-height:1.04; letter-spacing:-.018em; margin-bottom:22px}
h2{font-family:'Space Grotesk',sans-serif; font-weight:300; font-size:clamp(1.9rem,4.2vw,3.2rem);
  line-height:1.12; letter-spacing:-.015em}
.sec-head h2{margin-top:14px}
.lede{font-size:clamp(1rem,1.35vw,1.18rem); line-height:1.7; color:var(--muted); max-width:36em; font-weight:300}
.intro-line{color:var(--muted); font-weight:300; margin-top:18px; font-size:1.06rem; line-height:1.7; max-width:52ch}
.section > p.lede{margin-top:0}

/* reveal on scroll */
.reveal{opacity:0; transform:translateY(24px); transition:opacity .9s ease, transform .9s cubic-bezier(.2,.7,.2,1)}
.reveal.in{opacity:1; transform:none}

/* ── hero (two column) ── */
.a-hero{max-width:1160px; margin:0 auto; padding:clamp(120px,17vh,180px) clamp(22px,5vw,64px) clamp(50px,8vh,90px);
  display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(34px,5vw,72px); align-items:center}
.a-hero .lede{margin-bottom:34px}
.a-hero .cta-row{display:flex; gap:14px; align-items:center; flex-wrap:wrap}
.a-hero .cta-row .btn{padding:14px 26px; font-size:14.5px}
.hero-sub{max-width:640px}
.hero-sub h1{font-size:clamp(2.2rem,5vw,3.6rem)}

/* ── generic cards + grids ── */
.grid{display:grid; gap:18px}
.grid-3{grid-template-columns:repeat(auto-fit,minmax(258px,1fr))}
.grid-4{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.grid-5{grid-template-columns:repeat(auto-fit,minmax(214px,1fr))}
.card{background:rgba(255,255,255,.022); border:1px solid rgba(255,255,255,.07);
  border-radius:18px; padding:28px 26px; transition:transform .4s ease, border-color .4s ease, background .4s ease}
.card:hover{transform:translateY(-4px); border-color:rgba(255,206,138,.4); background:rgba(255,255,255,.04)}
.card h3{font-family:'Space Grotesk',sans-serif; font-weight:400; font-size:1.24rem; margin-bottom:9px; letter-spacing:-.01em}
.card p{color:var(--muted); font-weight:300; line-height:1.6; font-size:.97rem}
.card .idx{font-family:'Space Grotesk',sans-serif; font-size:13px; letter-spacing:.24em; color:var(--gold-soft); opacity:.85; display:block; margin-bottom:12px}

/* proof / portfolio cards */
.proof-url{color:var(--gold-soft); font-size:.8rem; letter-spacing:.04em; margin:2px 0 12px}
.proof-live{display:inline-flex; align-items:center; gap:9px; margin-top:16px; font-family:'Space Grotesk',sans-serif;
  font-size:11.5px; letter-spacing:.12em; text-transform:uppercase; color:#86d9ad}
.proof-live::before{content:""; width:7px; height:7px; border-radius:50%; background:#43e08f; box-shadow:0 0 10px #43e08f}
.proof-soon{display:inline-flex; align-items:center; gap:9px; margin-top:16px; font-family:'Space Grotesk',sans-serif;
  font-size:11.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--gold-soft)}
.proof-soon::before{content:""; width:7px; height:7px; border-radius:50%; background:var(--gold-soft); box-shadow:0 0 10px rgba(255,206,138,.6)}

/* feature rows (meet Anisa) */
.frow{display:grid; grid-template-columns:minmax(220px,.8fr) 1.2fr; gap:14px 34px; padding:24px 0; border-bottom:1px solid rgba(255,255,255,.07)}
.frow:first-of-type{border-top:1px solid rgba(255,255,255,.07)}
.frow h3{font-family:'Space Grotesk',sans-serif; font-weight:400; font-size:1.22rem; letter-spacing:-.01em; line-height:1.25}
.frow p{color:var(--muted); font-weight:300; line-height:1.65; font-size:1.02rem}

/* steps row */
.step-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(214px,1fr)); gap:18px}
.step{position:relative; padding:30px 26px; border-radius:18px; border:1px solid rgba(255,255,255,.07);
  background:rgba(255,255,255,.022); transition:transform .4s ease, border-color .4s ease, background .4s ease}
.step:hover{transform:translateY(-4px); border-color:rgba(255,206,138,.4); background:rgba(255,255,255,.04)}
.step .num{display:block; font-family:'Space Grotesk',sans-serif; font-weight:300; font-size:2.3rem; line-height:1;
  background:linear-gradient(100deg,var(--gold) 10%,#fff3dc 60%,var(--gold-soft));
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent}
.step .lbl{display:block; font-family:'Space Grotesk',sans-serif; font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:var(--gold-soft); margin-bottom:12px}
.step h3{font-family:'Space Grotesk',sans-serif; font-weight:400; font-size:1.16rem; margin:12px 0 9px; letter-spacing:-.01em}
.step p{color:var(--muted); font-weight:300; line-height:1.6; font-size:.96rem}

/* ── the walls / trust strip ── */
.walls{background:linear-gradient(180deg, rgba(255,206,138,.05), rgba(255,206,138,0));
  border-top:1px solid rgba(255,206,138,.14); border-bottom:1px solid rgba(255,206,138,.14)}
.walls h2 .accent, .walls h2 em{}
.wall-body{max-width:60ch; color:#c4ccde; font-weight:300; line-height:1.8; font-size:1.08rem; margin-top:6px}
.trust{display:grid; grid-template-columns:repeat(4,1fr); gap:22px; margin-top:clamp(34px,5vh,54px);
  border-top:1px solid rgba(255,255,255,.08); border-bottom:1px solid rgba(255,255,255,.08); padding:clamp(28px,4vh,42px) 0}
.trust .fig{text-align:center}
.trust .big{font-family:'Space Grotesk',sans-serif; font-weight:300; font-size:clamp(1.7rem,3.2vw,2.7rem); letter-spacing:-.02em; line-height:1;
  background:linear-gradient(100deg,var(--gold) 10%,#fff3dc 60%,var(--gold-soft)); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent}
.trust .lbl{color:var(--muted); font-size:.84rem; font-weight:300; margin-top:9px; letter-spacing:.02em}
.walls .note{margin-top:26px; color:var(--muted); font-weight:300}
.walls .note a{color:var(--gold-soft); text-decoration:none}
.walls .note a:hover{color:var(--gold)}
.small-card-row{display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:16px; margin-top:26px}
.small-card{background:rgba(255,255,255,.022); border:1px solid rgba(255,255,255,.07); border-radius:14px; padding:20px 22px}
.small-card h4{font-family:'Space Grotesk',sans-serif; font-weight:500; font-size:1.02rem; margin-bottom:7px}
.small-card p{color:var(--muted); font-weight:300; font-size:.94rem; line-height:1.55}

/* ── the WhatsApp phone mockup (signature component) ── */
.phone{width:100%; max-width:340px; margin:0 auto; background:#111b21; border-radius:32px; padding:11px;
  border:1px solid rgba(255,255,255,.10); box-shadow:0 30px 80px rgba(0,0,0,.5), 0 0 0 1px rgba(255,255,255,.02) inset}
.phone .pbar{display:flex; align-items:center; gap:11px; padding:10px 12px 12px; border-top-left-radius:22px; border-top-right-radius:22px;
  background:#1f2c33}
.phone .pav{width:34px; height:34px; border-radius:50%; flex:0 0 34px;
  background:radial-gradient(circle at 35% 30%, #cfe6ff, #4f7bff 45%, #6a3cff 75%, #2a1a55)}
.phone .pname{font-family:'Space Grotesk',sans-serif; font-size:.92rem; color:#e9edef; line-height:1.2}
.phone .pstat{font-size:.7rem; color:#8aa0aa; margin-top:2px}
.phone .screen{background:var(--wa-screen); border-bottom-left-radius:22px; border-bottom-right-radius:22px;
  padding:16px 12px; display:flex; flex-direction:column; gap:7px; min-height:220px;
  background-image:linear-gradient(rgba(11,20,26,.94),rgba(11,20,26,.94))}
.bubble{max-width:82%; padding:7px 10px 5px; border-radius:9px; font-size:.88rem; line-height:1.4; color:var(--wa-text); position:relative;
  box-shadow:0 1px 1px rgba(0,0,0,.18); word-wrap:break-word}
.bubble.in{background:var(--wa-in); align-self:flex-start; border-top-left-radius:2px}
.bubble.out{background:var(--wa-out); align-self:flex-end; border-top-right-radius:2px}
.bubble .ts{display:block; text-align:right; font-size:.62rem; color:rgba(233,237,239,.55); margin-top:3px; letter-spacing:.02em}
.phone-cap{max-width:340px; margin:0 auto 12px; color:var(--muted); font-weight:300; font-size:.92rem; line-height:1.5; text-align:center}

/* ── hero device frame (a real phone body, scoped to the Anisa hero only) ── */
.device{position:relative; width:100%; max-width:326px; margin:0 auto; text-align:left;
  background:linear-gradient(155deg,#242935 0%,#0b0d12 58%); border-radius:46px; padding:12px;
  border:1px solid rgba(255,255,255,.06);
  box-shadow:0 50px 90px -24px rgba(0,0,0,.8), inset 0 0 0 2px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.14)}
.device::before{content:""; position:absolute; left:1px; top:102px; width:3px; height:32px; border-radius:3px;
  background:linear-gradient(#4b5262,#20252e); box-shadow:0 44px 0 #262c37}
.device::after{content:""; position:absolute; right:1px; top:138px; width:3px; height:56px; border-radius:3px;
  background:linear-gradient(#4b5262,#20252e)}
.dev-inner{position:relative; background:#0b141a; border-radius:35px; overflow:hidden}
.dev-inner::before{content:""; position:absolute; top:0; left:50%; transform:translateX(-50%); width:86px; height:22px;
  background:#05060c; border-radius:0 0 14px 14px; z-index:5}
.dev-cam{position:absolute; top:7px; left:50%; transform:translateX(-50%); width:8px; height:8px; border-radius:50%;
  background:#0a0f16; box-shadow:inset 0 0 0 2px #1c232c, inset 1px 1px 1px rgba(80,120,255,.5); z-index:6}
.dev-status{display:flex; justify-content:space-between; align-items:center; padding:6px 17px 5px; background:#1f2c33;
  font-family:'Space Grotesk',sans-serif; font-size:.67rem; color:#cfd6dd; letter-spacing:.02em}
.dev-left,.dev-right{display:flex; align-items:center; gap:6px}
.dev-carrier{font-size:.5rem; letter-spacing:.03em; opacity:.85; white-space:nowrap}
.dev-ico{display:block; flex:0 0 auto}
.dev-batt{position:relative; width:22px; height:11px; border:1px solid rgba(207,214,221,.8); border-radius:2.5px}
.dev-batt::before{content:""; position:absolute; top:1.5px; left:1.5px; bottom:1.5px; right:6px; background:#cfd6dd; border-radius:1px}
.dev-batt::after{content:""; position:absolute; top:3px; right:-3px; width:2px; height:5px; background:rgba(207,214,221,.8); border-radius:0 1px 1px 0}
.dev-home{position:absolute; left:50%; bottom:6px; transform:translateX(-50%); width:116px; height:4px; border-radius:3px;
  background:rgba(255,255,255,.34); z-index:6}
.device .phone{max-width:none; margin:0; border:none; border-radius:0; padding:0; background:transparent; box-shadow:none}
.device .phone .pbar{border-radius:0}
.device .phone .screen{border-radius:0; min-height:308px; padding-bottom:24px}
.device .pstat{display:inline-flex; align-items:center; gap:6px}
.device .pstat::before{content:""; width:7px; height:7px; border-radius:50%; background:#00d95f; flex:0 0 auto;
  box-shadow:0 0 0 0 rgba(0,217,95,.5); animation:onlinePulse 2.2s ease-out infinite}
@keyframes onlinePulse{0%{box-shadow:0 0 0 0 rgba(0,217,95,.5)} 70%{box-shadow:0 0 0 8px rgba(0,217,95,0)} 100%{box-shadow:0 0 0 0 rgba(0,217,95,0)}}

/* ── interactive "talk to her" demo (demo.html) ── */
.try{max-width:360px; margin:0 auto}
.try-picks{display:flex; gap:8px; justify-content:center; flex-wrap:wrap; margin-bottom:20px}
.try-pick{font-family:'Space Grotesk',sans-serif; font-size:.85rem; color:var(--muted);
  background:rgba(255,255,255,.03); border:1px solid rgba(255,255,255,.10); border-radius:999px;
  padding:9px 16px; cursor:pointer; transition:color .2s, border-color .2s, background .2s}
.try-pick:hover{color:var(--ink); border-color:rgba(255,206,138,.45)}
.try-pick.on{color:#0c0e13; background:linear-gradient(180deg,#fff3dc,#f0cf92); border-color:transparent; font-weight:600}
.device-live .screen{height:clamp(348px,50vh,440px); min-height:0; overflow-y:auto; scroll-behavior:smooth; scrollbar-width:none; -ms-overflow-style:none}
.device-live .screen::-webkit-scrollbar{width:0; height:0; display:none}
.device-live .wa-note{align-self:center; max-width:90%; text-align:center; font-size:.68rem; line-height:1.4;
  color:#e6d9a8; background:rgba(90,74,28,.42); border-radius:8px; padding:6px 12px; margin:2px 0 3px}
.device-live .wa-day{align-self:center; font-size:.64rem; letter-spacing:.05em; color:#cfd6dd;
  background:#1f2c33; border-radius:8px; padding:3px 12px; margin:3px 0 7px}
.wa-compose{display:flex; align-items:center; gap:8px; padding:9px 10px 15px; background:#1f2c33}
.wa-compose input{flex:1 1 auto; min-width:0; background:#2a3942; border:none; border-radius:999px;
  padding:10px 15px; color:#e9edef; font-family:'Manrope',sans-serif; font-size:.9rem; outline:none}
.wa-compose input::placeholder{color:#8aa0aa}
.wa-send{flex:0 0 38px; width:38px; height:38px; border:none; border-radius:50%; cursor:pointer;
  background:#00a884; color:#0b141a; display:flex; align-items:center; justify-content:center; transition:background .15s}
.wa-send:hover{background:#02c39a}
.bubble.typing{display:inline-flex; gap:5px; align-items:center; padding:11px 13px}
.bubble.typing span{width:6px; height:6px; border-radius:50%; background:#8aa0aa; animation:typedot 1s infinite}
.bubble.typing span:nth-child(2){animation-delay:.16s}
.bubble.typing span:nth-child(3){animation-delay:.32s}
@keyframes typedot{0%,60%,100%{opacity:.3; transform:translateY(0)} 30%{opacity:.9; transform:translateY(-3px)}}
.try-note{max-width:340px; margin:16px auto 0; text-align:center; color:var(--muted); font-weight:300; font-size:.9rem; line-height:1.55}

/* email mockup (demo, for the multi-channel example) */
.email{width:100%; max-width:340px; margin:0 auto; background:#0e1522; border:1px solid rgba(255,255,255,.10); border-radius:16px; overflow:hidden; text-align:left; box-shadow:0 20px 60px rgba(0,0,0,.4)}
.email .ehead{padding:14px 16px; border-bottom:1px solid rgba(255,255,255,.08); background:rgba(255,255,255,.02)}
.email .erow{font-size:.8rem; color:var(--muted); margin-bottom:2px}
.email .erow b{color:var(--ink); font-weight:500}
.email .esubj{font-family:'Space Grotesk',sans-serif; color:var(--ink); font-size:.98rem; margin-top:8px}
.email .ebody{padding:15px 16px; color:#c4ccde; font-weight:300; font-size:.86rem; line-height:1.6}
.email .ereply{margin-top:14px; padding-top:14px; border-top:1px solid rgba(255,255,255,.08); color:#e9edef}
.email .efrom{color:var(--gold-soft); font-size:.74rem; font-family:'Space Grotesk',sans-serif; letter-spacing:.06em; text-transform:uppercase; margin-bottom:6px}

/* ── pricing ── */
.cur-toggle{display:inline-flex; border:1px solid rgba(255,255,255,.14); border-radius:100px; overflow:hidden; margin-left:auto}
.cur-btn{background:transparent; border:none; color:var(--muted); font-family:'Space Grotesk',sans-serif; font-size:12.5px; letter-spacing:.08em;
  padding:8px 16px; cursor:pointer; transition:all .25s}
.cur-btn.on{background:linear-gradient(180deg,#fff3dc,#f0cf92); color:#1a1408}
.price-head{display:flex; align-items:center; gap:18px; flex-wrap:wrap; margin-bottom:clamp(30px,4vh,46px)}
.price-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(266px,1fr)); gap:18px; align-items:stretch}
.price-card{display:flex; flex-direction:column; background:rgba(255,255,255,.022); border:1px solid rgba(255,255,255,.07);
  border-radius:18px; padding:32px 28px; position:relative; transition:transform .4s ease, border-color .4s ease, background .4s ease}
.price-card:hover{transform:translateY(-4px); border-color:rgba(255,206,138,.4)}
.price-card.feat{border-color:rgba(255,206,138,.5); background:rgba(255,206,138,.045)}
.badge{position:absolute; top:-12px; left:28px; background:linear-gradient(180deg,#fff3dc,#f0cf92); color:#1a1408;
  font-family:'Space Grotesk',sans-serif; font-size:11px; letter-spacing:.12em; text-transform:uppercase; padding:5px 13px; border-radius:100px}
.tier{font-family:'Space Grotesk',sans-serif; font-size:13px; letter-spacing:.18em; text-transform:uppercase; color:var(--muted)}
.tier-tag{color:var(--gold-soft); font-weight:300; font-size:.98rem; margin-top:8px; font-style:italic; font-family:'Space Grotesk',sans-serif}
.setup{font-family:'Space Grotesk',sans-serif; font-weight:400; font-size:1.9rem; margin:16px 0 2px; letter-spacing:-.02em}
.permo{color:var(--muted); font-weight:300; font-size:1rem}
.feat .setup{color:var(--gold)}
.scr-sub{display:block; font-size:.82rem; color:var(--muted); font-weight:300; margin-top:3px; letter-spacing:.01em; opacity:.9}
.plist{list-style:none; margin:22px 0 26px; display:flex; flex-direction:column; gap:11px}
.plist li{color:#c4ccde; font-weight:300; font-size:.95rem; display:flex; gap:11px; align-items:flex-start; line-height:1.4}
.plist li::before{content:"✦"; color:var(--gold-soft); font-size:.78rem; margin-top:3px}
.price-foot{color:var(--muted); font-weight:300; font-size:.9rem; margin:0 0 22px; line-height:1.5}
.price-card .btn{margin-top:auto; width:100%; text-align:center}

.founding{background:linear-gradient(180deg, rgba(255,206,138,.06), rgba(255,206,138,.02));
  border:1px solid rgba(255,206,138,.4); border-radius:18px; padding:32px 30px; margin-top:24px}
.founding h2{font-size:clamp(1.5rem,3vw,2.1rem); margin-bottom:14px}
.founding p{color:#c4ccde; font-weight:300; line-height:1.75; max-width:64ch; font-size:1.04rem}

.termlist{list-style:none; display:flex; flex-direction:column; gap:14px; max-width:70ch}
.termlist li{display:flex; gap:13px; align-items:flex-start; color:#c4ccde; font-weight:300; line-height:1.55; font-size:1.02rem}
.termlist li::before{content:"✦"; color:var(--gold-soft); font-size:.8rem; margin-top:5px}

/* ── onboarding: numbered blocks + timeline ── */
.numblock{display:grid; grid-template-columns:auto 1fr; gap:0 22px; padding:22px 0; border-bottom:1px solid rgba(255,255,255,.07)}
.numblock:first-of-type{border-top:1px solid rgba(255,255,255,.07)}
.numblock .n{font-family:'Space Grotesk',sans-serif; font-weight:300; font-size:1.9rem; line-height:1;
  background:linear-gradient(100deg,var(--gold) 10%,#fff3dc 60%,var(--gold-soft)); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent}
.numblock h3{font-family:'Space Grotesk',sans-serif; font-weight:400; font-size:1.2rem; letter-spacing:-.01em; margin-bottom:8px}
.numblock p{color:var(--muted); font-weight:300; line-height:1.65; font-size:1.02rem}
.numblock .body{grid-column:2}

.timeline{position:relative; margin:0; padding-left:6px}
.tl-item{position:relative; padding:0 0 26px 30px; border-left:1px solid rgba(255,255,255,.12)}
.tl-item:last-child{border-left-color:transparent}
.tl-item::before{content:""; position:absolute; left:-6px; top:3px; width:11px; height:11px; border-radius:50%;
  background:var(--gold-soft); box-shadow:0 0 12px rgba(255,206,138,.5)}
.tl-item .day{font-family:'Space Grotesk',sans-serif; font-size:12px; letter-spacing:.16em; text-transform:uppercase; color:var(--gold-soft); margin-bottom:8px}
.tl-item p{color:#c4ccde; font-weight:300; line-height:1.65; font-size:1.02rem; max-width:60ch}

.rowlist{list-style:none; display:flex; flex-direction:column; gap:16px; max-width:64ch}
.rowlist li{display:flex; gap:13px; align-items:flex-start; color:#c4ccde; font-weight:300; line-height:1.6; font-size:1.04rem}
.rowlist li::before{content:"✦"; color:var(--gold-soft); font-size:.82rem; margin-top:5px}

/* ── FAQ (from index.html) ── */
.faq-list{max-width:820px; border-top:1px solid rgba(255,255,255,.08)}
.faq-item{border-bottom:1px solid rgba(255,255,255,.08)}
.faq-q{width:100%; text-align:left; background:none; border:none; color:var(--ink); cursor:pointer;
  font-family:'Space Grotesk',sans-serif; font-weight:400; font-size:clamp(1rem,2.2vw,1.14rem); letter-spacing:-.01em;
  padding:22px 4px; display:flex; justify-content:space-between; gap:20px; align-items:center}
.faq-q .pl{position:relative; width:16px; height:16px; flex:0 0 16px}
.faq-q .pl::before,.faq-q .pl::after{content:""; position:absolute; background:var(--gold-soft); transition:transform .3s ease, opacity .3s ease}
.faq-q .pl::before{top:7px; left:0; width:16px; height:2px}
.faq-q .pl::after{left:7px; top:0; width:2px; height:16px}
.faq-item.open .pl::after{transform:scaleY(0)}
.faq-a{max-height:0; overflow:hidden; transition:max-height .4s ease}
.faq-a p{color:var(--muted); font-weight:300; line-height:1.72; font-size:1rem; padding:0 4px 24px; max-width:70ch}
.faq-item.open .faq-a{max-height:420px}

/* ── pricing teaser (compact tiles on landing) ── */
.mini-price{display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:16px}
.mini-tier{background:rgba(255,255,255,.022); border:1px solid rgba(255,255,255,.07); border-radius:16px; padding:24px 24px; text-align:center}
.mini-tier.feat{border-color:rgba(255,206,138,.45); background:rgba(255,206,138,.04)}
.mini-tier .tier{display:block; margin-bottom:12px}
.mini-tier .setup{font-size:1.5rem; margin:0}
.mini-tier .permo{display:block; margin-top:4px}

/* ── forms (from index.html) ── */
.form-card{background:rgba(255,255,255,.025); border:1px solid rgba(255,255,255,.08); border-radius:20px; padding:clamp(24px,4vw,34px)}
.form-group{margin-bottom:30px}
.form-group > h3{font-family:'Space Grotesk',sans-serif; font-weight:500; font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:var(--gold-soft); margin-bottom:18px; padding-bottom:10px; border-bottom:1px solid rgba(255,255,255,.08)}
.field{margin-bottom:16px}
.field label{display:block; font-family:'Space Grotesk',sans-serif; font-size:12px; letter-spacing:.08em; text-transform:uppercase; color:var(--muted); margin-bottom:8px}
.field input,.field textarea,.field select{width:100%; background:rgba(0,0,0,.25); border:1px solid rgba(255,255,255,.1); border-radius:12px;
  color:var(--ink); font-family:'Manrope',sans-serif; font-size:.98rem; padding:13px 15px; transition:border-color .25s, background .25s}
.field select{appearance:none; -webkit-appearance:none; cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%239aa3bd' stroke-width='1.6' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 15px center; padding-right:38px}
.field option{background:#0b1020; color:var(--ink)}
.field input:focus,.field textarea:focus,.field select:focus{outline:none; border-color:rgba(255,206,138,.55); background:rgba(0,0,0,.35)}
.field textarea{resize:vertical; min-height:104px}
.hp{position:absolute !important; left:-9999px; width:1px; height:1px; overflow:hidden}
.consent{display:flex; gap:11px; align-items:flex-start; color:var(--muted); font-size:.9rem; font-weight:300; line-height:1.5; margin:6px 0 22px}
.consent input{margin-top:3px; accent-color:#d9cdb6}
.consent a{color:var(--gold-soft); text-decoration:none}
.captcha-row{margin:0 0 20px}
.captcha-row .g-recaptcha{transform-origin:0 0}
@media (max-width:360px){ .captcha-row .g-recaptcha{transform:scale(.86)} }
.form-card .btn-solid{width:100%; text-align:center; padding:15px; font-size:14.5px}
.form-note{margin-top:16px; color:var(--muted); font-weight:300; font-size:.92rem}
.form-note a{color:var(--gold-soft); text-decoration:none}
.form-msg{margin-top:16px; font-size:.95rem; font-weight:300; display:none}
.form-msg.show{display:block}
.form-msg.ok{color:#86d9ad}
.form-msg.err{color:#ff9a9a}

/* ── final CTA ── */
.final{text-align:center; padding:clamp(70px,12vh,130px) clamp(22px,6vw,64px) 60px; max-width:900px; margin:0 auto}
.final h2{font-size:clamp(2rem,5vw,3.4rem); margin-bottom:14px}
.final p{color:var(--muted); font-weight:300; font-size:1.1rem; margin-bottom:32px}
.final .cta-row{display:flex; gap:14px; justify-content:center; flex-wrap:wrap}

/* ── footer (from index.html) ── */
.foot-grid{position:relative; z-index:3; background:#04050b; border-top:1px solid rgba(255,255,255,.07);
  display:grid; grid-template-columns:1.5fr 1fr 1fr; gap:34px; max-width:1160px; margin:60px auto 0; padding:56px clamp(22px,5vw,64px) 28px}
.foot-grid .fcol h4{font-family:'Space Grotesk',sans-serif; font-size:12px; letter-spacing:.16em; text-transform:uppercase; color:var(--muted); margin-bottom:16px; font-weight:500}
.foot-grid .fcol a{display:block; color:#aeb7cf; text-decoration:none; font-size:.94rem; font-weight:300; margin-bottom:11px; transition:color .25s}
.foot-grid .fcol a:hover{color:var(--ink)}
.foot-grid .fabout{color:var(--muted); font-weight:300; line-height:1.7; font-size:.94rem; max-width:36ch; margin-top:16px}
footer.legal-bar{border-top:1px solid rgba(255,255,255,.06); padding:26px clamp(22px,5vw,64px); display:flex; align-items:center;
  justify-content:space-between; gap:18px; flex-wrap:wrap; color:var(--muted); font-size:13px; position:relative; z-index:3; background:#04050b}
footer.legal-bar .ai-wink{font-family:'Space Grotesk',sans-serif; letter-spacing:.03em}
footer.legal-bar .ai-wink b{color:var(--gold-soft); font-weight:500}

/* ── demo/video slot + waitlist ── */
.slot{max-width:340px; margin:0 auto; background:#0b141a; border:1px solid rgba(255,255,255,.1); border-radius:24px;
  min-height:360px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:14px; text-align:center; padding:34px 26px}
.slot .glyph{width:56px; height:56px; border-radius:50%; border:1px solid rgba(255,206,138,.4); display:flex; align-items:center; justify-content:center; color:var(--gold-soft)}
.slot p{color:var(--muted); font-weight:300; font-size:.95rem; line-height:1.5}
.waitlist{max-width:460px; margin-left:auto; margin-right:auto}
.hidden{display:none !important}

/* ── responsive ── */
@media (max-width:860px){
  .navlinks a{display:none}
  .hamburger{display:block}
  .navlinks .btn-solid{display:none}
  .a-hero{grid-template-columns:1fr; gap:34px; padding-top:120px}
  .a-hero .phone-wrap{order:2}
  .frow{grid-template-columns:1fr; gap:6px}
}
@media (max-width:760px){
  .trust{grid-template-columns:1fr 1fr; gap:24px 14px}
  .foot-grid{grid-template-columns:1fr 1fr}
  .foot-grid .fcol.fbrand{grid-column:1/-1}
  .price-head .cur-toggle{margin-left:0}
}
@media (max-width:600px){
  nav{padding:16px 20px}
  .brand b{font-size:13px; letter-spacing:.13em}
  .brand .mark{width:22px; height:22px}
  h1{font-size:clamp(2rem,10vw,2.7rem)}
  .a-hero .cta-row .btn{flex:1 1 100%; text-align:center}
  .foot-grid{grid-template-columns:1fr}
  .numblock{grid-template-columns:1fr; gap:8px}
  .numblock .body{grid-column:1}
  footer.legal-bar{flex-direction:column; align-items:flex-start; gap:10px}
}
