/* =============================================================
   LeadVault — marketing layer (app.css ke upar)

   Teen rules jo zupichat.com ke teardown se aaye hain:
   1. BAND ALTERNATION — page ek lambi safed scroll nahi. Dark sections par
      cards safed rehte hain, isliye wo "bahar se roshan" lagte hain.
   2. GLASS SIRF CHROME PAR — nav aur floating pill. Baaki sab near-opaque
      layered white hai. 28 cards par backdrop-filter perf bhi khata hai aur
      jab har surface frosted ho to frost material lagna band ho jaata hai.
   3. HOVER ME MOVEMENT NAHI — card uthta nahi, uski shadow gehri hoti hai aur
      border garm. Flicker-proof, aur reduced-motion me bhi zinda rehta hai.
   ============================================================= */

.wrap{max-width:1180px;margin:0 auto;padding:0 var(--s3)}
.narrow{max-width:860px;margin:0 auto}

/* ---------- announcement ---------- */
.announce{background:linear-gradient(100deg,var(--ink-dk),var(--brand));color:rgba(255,255,255,.88);
  font-size:var(--f-xs);text-align:center;padding:10px var(--s2);position:relative;z-index:40;
  letter-spacing:.005em}
.announce b{color:#fff} .announce a{color:var(--accent-2);text-decoration:underline;text-underline-offset:3px}

/* ---------- nav — yahan glass CHAHIYE ---------- */
.topbar{position:sticky;top:0;z-index:30;padding:12px 0;
  background:rgba(255,255,255,.72);-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur);
  box-shadow:0 1px 0 rgba(255,255,255,.7),0 1px 2px rgba(5,40,36,.04);
  transition:box-shadow var(--d-base) var(--e-soft),background var(--d-base) var(--e-soft)}
.topbar.stuck{background:rgba(255,255,255,.88);
  box-shadow:0 1px 0 rgba(5,40,36,.06),0 8px 28px rgba(5,40,36,.09)}
.topbar .wrap{display:flex;align-items:center;gap:20px}
.topbar .brandmark{margin:0}
.topnav{display:flex;gap:2px;margin-left:var(--s2);flex:1}
.topnav a{display:inline-flex;align-items:center;min-height:44px;padding:0 14px;border-radius:10px;
  font-size:var(--f-sm);font-weight:560;color:var(--body);position:relative;
  transition:color var(--d-fast) var(--e-soft),background var(--d-fast) var(--e-soft)}
.topnav a:hover{background:rgba(6,78,74,.06);color:var(--ink)}
.topnav a:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.topnav a.on{color:var(--ink);font-weight:650}
.topnav a.on::after{content:"";position:absolute;left:14px;right:14px;bottom:4px;height:2px;border-radius:2px;
  background:linear-gradient(90deg,var(--accent),var(--brand-2))}
.topacts{display:flex;gap:10px;flex:0 0 auto}
.burger{display:none}

/* ---------- SECTION GROUNDS ---------- */
.sec{padding:var(--s12) 0;position:relative}
.sec.tight{padding:var(--s8) 0}

/* light section: halka 44px grid jo kinaare par maskse ghul jaata hai (flat colour nahi) */
.sec-light{background:#f4f8f6;position:relative;isolation:isolate}
.sec-light::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.5;
  background-image:linear-gradient(rgba(6,78,74,.055) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(6,78,74,.055) 1px,transparent 1px);
  background-size:44px 44px;
  -webkit-mask-image:radial-gradient(ellipse 85% 70% at 50% 45%,#000 35%,transparent 78%);
  mask-image:radial-gradient(ellipse 85% 70% at 50% 45%,#000 35%,transparent 78%)}

/* dark band: brand ink + teen radial aurora + grain. Andar ke cards safed rehte hain. */
.sec-dark{background:var(--ink-dk);color:rgba(255,255,255,.76);position:relative;isolation:isolate;overflow:hidden}
.sec-dark::before{content:"";position:absolute;inset:0;z-index:-2;pointer-events:none;background:
  radial-gradient(52% 58% at 12% 8%,rgba(19,185,129,.20),transparent 62%),
  radial-gradient(45% 50% at 88% 14%,rgba(10,109,99,.34),transparent 60%),
  radial-gradient(60% 55% at 50% 104%,rgba(216,164,58,.10),transparent 64%)}
/* film grain — flat kaala "sasta" lagta hai, grain usse material bana deta hai */
.sec-dark::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.055;
  mix-blend-mode:overlay;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E")}
.sec-dark h2,.sec-dark h3{color:#fff}
.sec-dark .sub{color:rgba(255,255,255,.62)}
.sec-dark .eyebrow{color:var(--accent-2)}

/* seam: dark band ke kinaare par halka arc, taaki section juda hua lage */
.seam-top{border-radius:var(--s5) var(--s5) 0 0}
.seam-bot{border-radius:0 0 var(--s5) var(--s5)}

/* ---------- section headers ---------- */
.eyebrow{display:block;text-align:center;font-family:var(--sans);font-size:var(--f-xs);font-weight:750;
  letter-spacing:.18em;text-transform:uppercase;color:var(--brand-2);margin-bottom:14px}
.sec h2{text-align:center;font-size:var(--f-h2);margin-bottom:14px}
.sec h2 em{font-style:normal;color:var(--accent-dk,#0a7d5c)}
.sec-dark h2 em{color:var(--accent-2)}
/* gradient-clip wala showy treatment ab SIRF hero par — 10 baar dohrane se emphasis khatam ho jaata hai */
.sec .sub{text-align:center;color:var(--muted);max-width:58ch;margin:0 auto var(--s6);
  font-size:var(--f-lede);line-height:1.62}
.sec-dark .sub{color:rgba(255,255,255,.64)}

/* ---------- hero ---------- */
.hero{padding:var(--s10) 0 var(--s8);text-align:center;position:relative}
.sec-dark.hero{padding-top:var(--s8)}
.pill{display:inline-flex;align-items:center;gap:9px;padding:8px 18px;border-radius:999px;
  font-size:var(--f-xs);font-weight:650;letter-spacing:.01em;margin-bottom:var(--s3);
  color:var(--accent-2);background:rgba(255,255,255,.07);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.16)}
.pill b{color:#fff}
.hero h1{font-size:var(--f-display);line-height:1.02;letter-spacing:-.035em;font-weight:500;
  max-width:17ch;margin:0 auto var(--s3);color:#fff}
.hero h1 em{font-style:normal;background:linear-gradient(118deg,var(--accent-2),var(--accent) 58%,#8fe3c4);
  -webkit-background-clip:text;background-clip:text;color:transparent}
.hero .lede{font-size:var(--f-lede);line-height:1.62;max-width:56ch;margin:0 auto var(--s5);
  color:rgba(255,255,255,.70)}
.cta{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;align-items:center}
.btn.lg{min-height:56px;padding:0 var(--s4);font-size:1.03rem;border-radius:15px}
.btn.white{background:#fff;color:var(--brand);box-shadow:0 1px 2px rgba(0,0,0,.14),0 8px 26px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.9)}
.btn.white:hover{filter:brightness(1.02)}
.link-cta{color:rgba(255,255,255,.8);font-size:var(--f-sm);font-weight:560;padding:10px 6px;
  border-bottom:1px solid rgba(255,255,255,.3);transition:color var(--d-fast),border-color var(--d-fast)}
.link-cta:hover{color:#fff;border-color:var(--accent-2)}
.link-cta:focus-visible{outline:2px solid var(--accent-2);outline-offset:3px}

/* trust meta row — avatars nahi, sach wali baatein */
.ticks{display:flex;gap:var(--s3);justify-content:center;flex-wrap:wrap;margin-top:var(--s5);
  font-size:var(--f-xs);color:rgba(255,255,255,.58)}
.ticks span{display:flex;align-items:center;gap:7px}
.ticks b{color:rgba(255,255,255,.85);font-weight:600}
.ticks svg{width:15px;height:15px;color:var(--accent-2);flex:none}

/* ---------- product window: tilted, grid se bahar nikalta hua ---------- */
.mock{margin:var(--s8) auto 0;max-width:1040px;border-radius:18px;overflow:hidden;
  background:#fff;box-shadow:var(--sh-lg),0 60px 120px rgba(0,0,0,.28);
  transform:perspective(1800px) rotateX(2.4deg);transform-origin:50% 0}
.mock .bar{display:flex;align-items:center;gap:7px;padding:11px 14px;background:#f2f6f4;
  border-bottom:1px solid rgba(5,40,36,.07)}
.mock .bar i{width:10px;height:10px;border-radius:50%;background:rgba(5,40,36,.15)}
.mock .bar span{margin-left:10px;font-size:11.5px;color:var(--muted);font-family:var(--sans)}
.mock .inner{background:#fff}
.mock .mk-head{display:flex;gap:10px;padding:var(--s2);border-bottom:1px solid rgba(5,40,36,.07);flex-wrap:wrap}
.mock .mk-k{flex:1 1 118px;padding:13px 15px;border-radius:12px;background:#f5f9f7;
  box-shadow:inset 0 0 0 1px rgba(5,40,36,.05)}
.mock .mk-k b{display:block;font-family:var(--serif);font-size:24px;font-weight:600;color:var(--ink);
  letter-spacing:-.025em;font-variant-numeric:tabular-nums;line-height:1.1}
.mock .mk-k span{font-size:11.5px;color:var(--muted)}
/* mobile par table apne frame me scroll kare — pehle overflow:hidden se Status column kat jaata tha */
.mock .scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
.mock table{font-size:13px;min-width:560px}
.mock th,.mock td{padding:11px var(--s2);white-space:nowrap}

/* ---------- CARDS: near-opaque, glass NAHI ---------- */
.card-s{background:#fff;border-radius:18px;box-shadow:var(--sh);
  box-shadow:var(--sh),inset 0 0 0 1px rgba(5,40,36,.055);
  transition:box-shadow var(--d-base) var(--e-soft)}
/* hover me kuch HILTA nahi — shadow gehri, border garm. reduced-motion me bhi chalu rehta hai. */
.card-s:hover{box-shadow:var(--sh-hov),inset 0 0 0 1px rgba(19,185,129,.34)}
.sec-dark .card-s{background:#fff}
.card-ink{background:rgba(255,255,255,.055);border-radius:18px;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);
  transition:box-shadow var(--d-base) var(--e-soft),background var(--d-base) var(--e-soft)}
.card-ink:hover{background:rgba(255,255,255,.085);box-shadow:inset 0 0 0 1px rgba(54,211,166,.34)}

/* ---------- icon tiles (SVG, currentColor) ---------- */
.ico{display:grid;place-items:center;width:46px;height:46px;border-radius:13px;flex:none;
  color:var(--brand-2);background:linear-gradient(145deg,rgba(19,185,129,.17),rgba(6,78,74,.08));
  box-shadow:inset 0 0 0 1px rgba(19,185,129,.18)}
.ico svg{width:21px;height:21px}
.sec-dark .ico{color:var(--accent-2);background:rgba(255,255,255,.07);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.14)}
.ico-sm{width:34px;height:34px;border-radius:10px}.ico-sm svg{width:17px;height:17px}

/* ---------- grids + bento ---------- */
.g3{display:grid;grid-template-columns:repeat(auto-fit,minmax(296px,1fr));gap:var(--s3)}
.g2{display:grid;grid-template-columns:repeat(auto-fit,minmax(360px,1fr));gap:var(--s3)}
/* bento: pehla card do column leta hai — saari baatein barabar nahi hoti */
.bento{display:grid;grid-template-columns:repeat(6,1fr);gap:var(--s3)}
.bento>*{grid-column:span 2}
.bento>.wide{grid-column:span 4}
.bento>.half{grid-column:span 3}
@media (max-width:980px){.bento{grid-template-columns:repeat(2,1fr)}.bento>*,.bento>.wide,.bento>.half{grid-column:span 2}}

.feat{padding:var(--s4)}
.feat .ico{margin-bottom:var(--s3)}
.feat h3{margin-bottom:10px}
.feat p{font-size:.95rem;line-height:1.65}
.sec-dark .feat p{color:rgba(255,255,255,.66)}
.feat.wide{display:grid;grid-template-columns:auto 1fr;gap:var(--s3);align-items:start}
.feat.wide .ico{margin-bottom:0}

/* ---------- steps ---------- */
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(224px,1fr));gap:var(--s3);counter-reset:s}
.step{padding:var(--s4) var(--s3);position:relative}
.step .num{counter-increment:s;font-family:var(--serif);font-size:15px;font-weight:650;color:var(--brand-2);
  display:inline-grid;place-items:center;width:30px;height:30px;border-radius:9px;margin-bottom:var(--s2);
  background:rgba(19,185,129,.14);box-shadow:inset 0 0 0 1px rgba(19,185,129,.2)}
.step .num::before{content:"0" counter(s)}
.sec-dark .step .num{color:var(--accent-2);background:rgba(255,255,255,.08);box-shadow:inset 0 0 0 1px rgba(255,255,255,.14)}
.step b{display:block;font-family:var(--serif);font-size:1.08rem;font-weight:600;color:var(--ink);margin-bottom:8px;letter-spacing:-.012em}
.sec-dark .step b{color:#fff}
.step p{font-size:.9rem;line-height:1.6}
.sec-dark .step p{color:rgba(255,255,255,.64)}

/* ---------- compare list (✓ / ✕) ---------- */
.cmp{list-style:none;display:grid;gap:11px}
.cmp li{display:grid;grid-template-columns:22px 1fr;gap:12px;align-items:start;font-size:.95rem;line-height:1.55}
.cmp svg{width:20px;height:20px;margin-top:1px}
.cmp .y{color:var(--accent)} .cmp .n{color:#c0594b}

/* ---------- terminal: yahi brand moment hai ---------- */
.term{border-radius:16px;overflow:hidden;background:#04110f;
  box-shadow:0 2px 6px rgba(0,0,0,.3),0 24px 60px rgba(0,0,0,.38),inset 0 0 0 1px rgba(255,255,255,.08)}
.term .bar{display:flex;align-items:center;gap:7px;padding:11px 14px;background:rgba(255,255,255,.05);
  border-bottom:1px solid rgba(255,255,255,.07)}
.term .bar i{width:9px;height:9px;border-radius:50%;background:rgba(255,255,255,.17)}
.term .bar span{margin-left:8px;font-size:11.5px;color:rgba(255,255,255,.42);font-family:var(--sans)}
.term .body{padding:var(--s3);font-family:ui-monospace,"SF Mono",Consolas,monospace;font-size:13.5px;
  line-height:2.05;color:rgba(255,255,255,.82)}
.term .k{color:rgba(255,255,255,.44)}
.term .ok{color:#4ade9f} .term .no{color:#f0836f} .term .hi{color:#fff;font-weight:600}
.term .rel{margin-top:14px;padding-top:14px;border-top:1px solid rgba(255,255,255,.1);font-size:14px}
.term .rel b{color:var(--accent-2);letter-spacing:.06em}

/* ---------- numbers ---------- */
.nums{display:grid;grid-template-columns:repeat(auto-fit,minmax(168px,1fr));gap:var(--s4);text-align:center}
.nums b{display:block;font-family:var(--serif);font-size:clamp(2.1rem,1.3rem + 2.6vw,3rem);font-weight:560;
  letter-spacing:-.03em;color:#fff;line-height:1.02;font-variant-numeric:tabular-nums}
.nums b em{font-style:normal;color:var(--accent-2)}
.nums span{display:block;font-size:var(--f-xs);margin-top:10px;color:rgba(255,255,255,.58);line-height:1.5}

/* ---------- testimonials / proof ---------- */
.quotes{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:var(--s3)}
.quote{padding:var(--s4);display:flex;flex-direction:column}
.quote p{font-family:var(--serif);font-size:1.06rem;line-height:1.62;color:var(--ink);flex:1;letter-spacing:-.008em}
.quote .by{display:flex;align-items:center;gap:13px;margin-top:var(--s3);padding-top:var(--s2);
  border-top:1px solid rgba(5,40,36,.08)}
.quote .av{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;font-weight:700;font-size:14px;
  color:#fff;background:linear-gradient(145deg,var(--brand-2),var(--brand));flex:none;font-family:var(--sans)}
.quote .by b{display:block;font-size:var(--f-sm);color:var(--ink)}
.quote .by span{font-size:var(--f-xs);color:var(--muted)}

/* ---------- pricing ---------- */
.plans{display:grid;grid-template-columns:repeat(auto-fit,minmax(296px,1fr));gap:var(--s3);align-items:stretch}
.plan{padding:var(--s4);display:flex;flex-direction:column;position:relative}
.plan.best{box-shadow:var(--sh-lg),inset 0 0 0 2px var(--accent)}
.plan.best:hover{box-shadow:var(--sh-hov),inset 0 0 0 2px var(--accent)}
.plan .tag{position:absolute;top:-12px;left:50%;transform:translateX(-50%);padding:5px 15px;border-radius:999px;
  font-size:11.5px;font-weight:700;letter-spacing:.04em;color:#04110f;white-space:nowrap;
  background:linear-gradient(145deg,var(--accent-2),var(--accent));box-shadow:0 4px 14px rgba(19,185,129,.4)}
.plan h3{margin-bottom:6px}
.plan .desc{font-size:var(--f-sm);color:var(--muted);margin-bottom:var(--s3);line-height:1.55;min-height:42px}
.plan .price{font-family:var(--serif);font-size:2.4rem;font-weight:560;letter-spacing:-.032em;color:var(--ink);line-height:1}
.plan .price small{font-family:var(--sans);font-size:.92rem;font-weight:500;color:var(--muted);letter-spacing:0}
.plan ul{list-style:none;margin:var(--s3) 0;flex:1;display:grid;gap:11px}
.plan li{display:grid;grid-template-columns:20px 1fr;gap:11px;align-items:start;font-size:.9rem;line-height:1.5}
.plan li svg{width:18px;height:18px;margin-top:1px;color:var(--accent)}
.plan li.no{color:var(--muted)} .plan li.no svg{color:var(--muted)}

/* ---------- FAQ ---------- */
.faq{display:grid;gap:10px;max-width:820px;margin:0 auto}
.faq details{padding:0 var(--s3);background:#fff;border-radius:14px;
  box-shadow:var(--sh),inset 0 0 0 1px rgba(5,40,36,.055);
  transition:box-shadow var(--d-base) var(--e-soft)}
.faq details:hover{box-shadow:var(--sh-hov),inset 0 0 0 1px rgba(19,185,129,.3)}
.faq details[open]{box-shadow:var(--sh-lg),inset 0 0 0 1px rgba(19,185,129,.26)}
.faq summary{list-style:none;cursor:pointer;padding:19px 0;font-family:var(--serif);font-size:1.05rem;
  font-weight:600;color:var(--ink);display:flex;align-items:center;justify-content:space-between;gap:var(--s2);
  letter-spacing:-.012em}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";flex:none;width:11px;height:11px;border-right:2px solid var(--accent);
  border-bottom:2px solid var(--accent);transform:rotate(45deg) translateY(-3px);
  transition:transform var(--d-base) var(--e-out)}
.faq details[open] summary::after{transform:rotate(225deg) translateY(-3px)}
.faq summary:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:8px}
.faq .ans{padding:0 0 20px;font-size:.95rem;line-height:1.7;color:var(--body);max-width:68ch}

/* ---------- final CTA ---------- */
.cta-band{padding:var(--s10) var(--s5);text-align:center;position:relative;z-index:1}
.cta-band h2{color:#fff;margin-bottom:14px;text-align:center}
.cta-band p{max-width:52ch;margin:0 auto var(--s4);line-height:1.65;color:rgba(255,255,255,.72)}
.cta-band .btn.ghost{background:rgba(255,255,255,.12);color:#fff;box-shadow:inset 0 0 0 1px rgba(255,255,255,.3)}
.cta-band .btn.ghost:hover{background:rgba(255,255,255,.2)}
.trust-row{display:flex;gap:var(--s3);justify-content:center;flex-wrap:wrap;margin-top:var(--s4);
  font-size:var(--f-xs);color:rgba(255,255,255,.55)}
.trust-row span{display:flex;align-items:center;gap:7px}
.trust-row svg{width:15px;height:15px;color:var(--accent-2)}

/* ---------- footer ---------- */
.foot-site{padding:var(--s10) 0 var(--s4);background:#f4f8f6;box-shadow:inset 0 1px 0 rgba(5,40,36,.07)}
.foot-grid{display:grid;grid-template-columns:1.7fr 1fr 1fr 1fr;gap:var(--s5);margin-bottom:var(--s6)}
.foot-grid h4{font-family:var(--sans);font-size:11.5px;font-weight:750;letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink);margin-bottom:var(--s2)}
.foot-grid a,.foot-grid p{display:block;font-size:var(--f-sm);color:var(--body);margin-bottom:10px;line-height:1.55}
.foot-grid a{transition:color var(--d-fast)} .foot-grid a:hover{color:var(--brand-2)}
.foot-grid a:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:4px}
.foot-bot{padding-top:var(--s3);border-top:1px solid rgba(5,40,36,.09);display:flex;justify-content:space-between;
  gap:var(--s2);flex-wrap:wrap;font-size:var(--f-xs);color:var(--muted)}

/* ---------- scroll reveal: FADE ONLY ----------
   zupichat ne 122 sliding elements isliye hataye the ki slide "sasta" lagta tha.
   Yahan sirf opacity — aur base state VISIBLE hai, motion sirf bonus. */
.rv{opacity:1}
@media (prefers-reduced-motion:no-preference){
  .rv{opacity:0;transition:opacity var(--d-slow) var(--e-soft)}
  .rv.in{opacity:1}
  .rv-s>*{opacity:0;transition:opacity var(--d-slow) var(--e-soft)}
  .rv-s.in>*{opacity:1}
  .rv-s.in>*:nth-child(1){transition-delay:0ms}
  .rv-s.in>*:nth-child(2){transition-delay:70ms}
  .rv-s.in>*:nth-child(3){transition-delay:140ms}
  .rv-s.in>*:nth-child(4){transition-delay:210ms}
  .rv-s.in>*:nth-child(5){transition-delay:280ms}
  .rv-s.in>*:nth-child(6){transition-delay:350ms}
}

/* ---------- mobile ---------- */
@media (max-width:980px){
  .split{grid-template-columns:1fr;gap:var(--s4)}
  .foot-grid{grid-template-columns:1fr 1fr;gap:var(--s4)}
}
@media (max-width:860px){
  .wrap{padding:0 18px}
  .topnav{display:none}
  .topnav.open{display:flex;position:absolute;top:100%;left:0;right:0;flex-direction:column;padding:12px 18px 18px;
    background:rgba(255,255,255,.97);-webkit-backdrop-filter:var(--blur);backdrop-filter:var(--blur);
    box-shadow:0 14px 30px rgba(5,40,36,.14)}
  .topnav.open a{min-height:46px;display:flex;align-items:center}
  .burger{display:inline-flex;align-items:center;justify-content:center;width:46px;height:46px;border-radius:13px;
    border:0;cursor:pointer;background:rgba(6,78,74,.07);color:var(--ink);font-size:19px;
    transition:background var(--d-fast)}
  .burger:hover{background:rgba(6,78,74,.12)}
  .burger:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
  .topbar .wrap{position:relative}
  .sec{padding:var(--s8) 0} .sec.tight{padding:var(--s6) 0}
  .hero{padding:var(--s6) 0 var(--s5)}
  .mock{transform:none;margin-top:var(--s5)}
  .cta-band{padding:var(--s8) var(--s3)}
  .foot-site{padding:var(--s8) 0 var(--s3)}
  .foot-grid{grid-template-columns:1fr}
  .ticks,.trust-row{gap:14px}
  .feat{padding:var(--s3)} .plan{padding:var(--s3)}
}