/* Tokens */
:root{
  --ink:#0b0b0b; --ink-2:#1f2937; --bg:#ffffff; --bg-alt:#f7fafc;
  --blue-600:#2563eb; --blue-700:#1d4ed8; --blue-100:#dbeafe;
  --card:#ffffff; --border:#e5e7eb; --shadow:0 20px 50px rgba(0,0,0,.07), 0 6px 16px rgba(0,0,0,.06);
}

/* Base */
*{box-sizing:border-box} html,body{margin:0;padding:0}
body{font-family:Inter, ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;color:var(--ink);background:var(--bg)}
img{max-width:100%;display:block} a{color:var(--ink);text-decoration:none}
.container{max-width:1120px;margin:0 auto;padding:1rem}
.skip{position:absolute;left:-9999px;top:auto}.skip:focus{left:1rem;top:1rem;background:#fff;padding:.5rem .75rem;border-radius:.5rem;z-index:1000}

/* Header */
.site-header{position:sticky;top:0;background:rgba(255,255,255,.92);backdrop-filter:saturate(150%) blur(6px);border-bottom:1px solid var(--border);z-index:40}
.header-inner{display:flex;align-items:center;justify-content:space-between}
.brand{display:flex;align-items:center;gap:.6rem}
.logo{height:36px;width:auto}
.brand-text{font-weight:900;letter-spacing:.2px}
.nav a{font-weight:700;margin-left:1rem;opacity:.9}.nav a:hover{opacity:1}
.nav-toggle{display:none;background:transparent;border:0;gap:4px;flex-direction:column}
.nav-toggle span{width:22px;height:2px;background:var(--ink);display:block;border-radius:1px}

/* Hero */
.hero{padding:5.5rem 0 3rem;background:linear-gradient(180deg,#f8fbff 0%,#ffffff 100%)}
.hero-inner{display:grid;grid-template-columns:1.2fr .8fr;gap:1.2rem;align-items:center}
.hero-copy h1{font-size:clamp(2.5rem,4.5vw,3.2rem);line-height:1.1;margin:.2rem 0 .6rem}
.lead{font-size:1.18rem;color:var(--ink-2);margin:.2rem 0 1rem}
.cta-row{display:flex;gap:.8rem;align-items:center;flex-wrap:wrap;margin:.4rem 0 .2rem}
.meta{font-size:.9rem;color:var(--ink-2)}
.trust{display:flex;gap:1rem;list-style:none;padding:0;margin:1rem 0 0;color:var(--ink-2);flex-wrap:wrap}
.trust li{display:flex;gap:.4rem;align-items:center}
.hero-card{background:var(--card);border:1px solid var(--border);border-radius:18px;padding:1rem;box-shadow:var(--shadow);display:grid;grid-template-columns:1fr;gap:.75rem}
.stat{background:var(--blue-100);border:1px solid #bfd7ff;border-radius:14px;padding:.75rem 1rem}
.stat strong{font-size:1.2rem}

/* Sections */
.section{padding:3rem 0}.section.alt{background:var(--bg-alt)}
h2{font-size:clamp(2rem,3.2vw,2.4rem);margin:.2rem 0 1rem}

/* Cards */
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1rem}
.card{background:#fff;border:1px solid var(--border);border-radius:16px;padding:1rem;box-shadow:0 6px 18px rgba(0,0,0,.05)}
.card h3{margin:.2rem 0 .4rem}

/* Why */
.why-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1rem}
.why-item{background:#fff;border:1px solid var(--border);border-radius:16px;padding:1rem;box-shadow:0 6px 18px rgba(0,0,0,.05)}
.why-item h3{margin:.2rem 0 .4rem}

/* FAQ */
details{background:#fff;border:1px solid var(--border);border-radius:14px;padding:.8rem 1rem;margin:.6rem 0;box-shadow:0 4px 12px rgba(0,0,0,.04)}
summary{cursor:pointer;font-weight:800}

/* CTA */
.cta{background:linear-gradient(180deg,#ffffff 0%,#f8fbff 100%)}
.cta-panel{background:#fff;border:1px solid var(--border);border-radius:20px;padding:1.5rem;box-shadow:var(--shadow);text-align:center}
.tiny-note{font-size:.9rem;color:var(--ink-2)}

/* Buttons */
.btn{display:inline-block;font-weight:900;letter-spacing:.2px;padding:1rem 1.4rem;border-radius:999px;border:1px solid var(--blue-700);box-shadow:0 10px 24px rgba(37,99,235,.18);text-align:center}
.btn-primary{background:var(--blue-600);color:#fff;border-color:var(--blue-700)}
.btn-primary:hover{filter:brightness(1.05);transform:translateY(-1px);transition:.15s ease}
.btn-secondary{background:#e6efff;color:var(--ink);border-color:#cddfff}
.btn-secondary:hover{filter:brightness(1.03);transform:translateY(-1px);transition:.15s ease}

/* Footer (slim) */
.site-footer{border-top:1px solid var(--border);padding:1.2rem 0}
.foot{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.foot-nav a{margin-right:1rem;font-weight:700;opacity:.9}.foot-nav a:hover{opacity:1}

/* Responsive */
@media (max-width: 860px){
  .hero-inner{grid-template-columns:1fr}
  .nav-toggle{display:flex}
  .nav{position:absolute;top:64px;right:1rem;background:#fff;border:1px solid var(--border);border-radius:12px;box-shadow:0 12px 24px rgba(0,0,0,.08);padding:.5rem .75rem;display:none;flex-direction:column}
  .nav a{margin:.3rem .25rem}
  .nav.open{display:flex}
  .mobile-hint{display:none}
}