/* Base */
*,*::before,*::after{box-sizing:border-box}
html:focus-within{scroll-behavior:smooth}
body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Inter,Roboto,Arial,sans-serif;line-height:1.5;background:#0b0c0f;color:#e8ecf1}
img{max-width:100%;display:block}
a{color:#b7d7ff;text-decoration:none} a:hover{text-decoration:underline}
:root{
  --bg-1:#0b0c0f; --bg-2:#151922;
  --card:#0f1217; --card-b:#1b2230;
  --ink:#e8ecf1; --muted:#9aa6b2;
  --ring:#2b3342;
  --primary-1:#ffb457; --primary-2:#ffa63b;
  --glow:0 0 34px rgba(255,170,70,.35);
}
.container{width:min(1100px,92vw);margin-inline:auto}
.section{padding:64px 0}
.subtle{color:var(--muted);margin-top:-6px}

/* Top notice */
.notice{background:linear-gradient(90deg,#f7b045,#ffd36a);color:#1b1b1b;text-align:center;padding:.6rem 1rem;border-bottom:1px solid #e6c07a}
.notice a{color:#1b1b1b;font-weight:650}

/* Header */
.site-header{position:sticky;top:0;z-index:50;display:flex;align-items:center;justify-content:space-between;padding:10px 16px;background:linear-gradient(180deg,rgba(15,18,23,.85),rgba(15,18,23,.6));backdrop-filter:saturate(140%) blur(8px);border-bottom:1px solid #151a22}
.brand{font-weight:800;color:#eaf1f9;letter-spacing:.3px}
.menu-btn{background:#202633;color:#cfe3ff;border:1px solid #2b3342;padding:.5rem .8rem;border-radius:999px}
.site-nav{display:flex;gap:18px}
.site-nav a{color:#cfe3ff}
@media (max-width:860px){
  .site-nav{display:none;position:absolute;right:16px;top:54px;background:#151922;border:1px solid #2b3342;border-radius:12px;padding:12px}
  .site-nav.open{display:flex;flex-direction:column}
}

/* Hero */
.hero{min-height:68svh;display:grid;place-items:end;background-size:cover;background-position:center;position:relative}
.hero::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(11,12,15,.65),rgba(11,12,15,.9))}
.hero-inner{position:relative;padding:56px 16px 24px;width:min(1100px,92vw);margin-inline:auto}
.typewrap{font-size:clamp(28px,6vw,44px);line-height:1.15;margin:0 0 14px;font-weight:850;letter-spacing:.2px}
.type-fixed{display:inline-block;min-width:40ch}
.typewriter{display:inline-block;border-right:2px solid #ffd36a;white-space:nowrap;overflow:hidden}
.lead{color:#d7dde4;margin:.3rem 0 1rem;max-width:60ch}
.trust{color:#aab7c5;margin:.25rem 0 0;max-width:70ch}
.cta-row{display:flex;gap:12px;margin:16px 0 4px}

/* Buttons */
.btn{display:inline-flex;align-items:center;gap:.5rem;padding:.85rem 1.1rem;border-radius:999px;border:1px solid #2b3342}
.btn-primary{background:linear-gradient(90deg,var(--primary-1),var(--primary-2));color:#171717;box-shadow:var(--glow)}
.btn-ghost{color:#dfe8f4;background:transparent}
.glitch{position:relative}
.glitch::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:var(--glow);opacity:0;transition:opacity .25s}
.glitch:hover::after{opacity:1}

/* Grids / Cards */
.grid{display:grid;gap:16px;grid-template-columns:repeat(3,minmax(0,1fr))}
.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}
@media (max-width:900px){.grid,.grid-2{grid-template-columns:1fr}}
.card{background:linear-gradient(180deg,var(--card),#0c1016);border:1px solid var(--card-b);border-radius:16px;padding:18px}
.card h3{margin:0 0 6px}
.card p{margin:.25rem 0 .25rem}
.card ul{padding-left:18px;margin:.4rem 0 0}

/* Pricing */
.price{font-size:1.6rem;font-weight:800;margin:.1rem 0}
.muted{color:var(--muted)}

/* Footer */
.site-footer{border-top:1px solid #151a22;background:#0b0c0f;padding:36px 0 72px}
.brand-foot{font-weight:800}

/* Sticky SMS bubble */
.sticky-text{position:fixed;bottom:14px;left:50%;transform:translateX(-50%);background:#161c22;border:1px solid #273040;border-radius:999px;padding:.7rem 1rem;color:#dfe8f4;display:flex;gap:.6rem;align-items:center;box-shadow:0 8px 28px rgba(0,0,0,.35);z-index:60}
.sticky-text .dot{width:9px;height:9px;background:#ffbf66;border-radius:50%;box-shadow:0 0 10px #ffbf66}

/* Reveal animations */
.reveal{opacity:0;transform:translateY(16px);transition:opacity .6s ease,transform .6s ease}
.reveal.show{opacity:1;transform:none}

/* A11y */
.skip-link{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
.skip-link:focus{left:10px;top:10px;width:auto;height:auto;background:#fff;color:#000;padding:.4rem .6rem;border-radius:6px}

@media (prefers-reduced-motion:reduce){
  .reveal{opacity:1;transform:none}
  .typewriter{border-right:none}
}