/* -------------------  GLOBAL THEME  ------------------- */
:root{
    /* Brand palette */
    --c-primary:#457bff;
    --c-accent:#36d399;
    --c-neutral:#1f2937;
    --c-bg:#ffffff;
    --c-bg-alt:#f8fafc;
    --c-border:#e2e8f0;
  
    /* Radii & shadows */
    --radius-m:.5rem;
    --radius-xl:1rem;
    --shadow-m:0 4px 12px rgba(0,0,0,.05);
  
    /* Typography scale */
    --f-h1:clamp(2.2rem,5vw+1rem,3.5rem);
    --f-h2:clamp(1.6rem,4vw+.5rem,2.4rem);
    --f-h3:clamp(1.25rem,3vw+.4rem,1.5rem);
  }
  
  /* Dark mode (bonus) */
  @media(prefers-color-scheme:dark){
    :root{
      --c-bg:#0f172a;
      --c-bg-alt:#1e293b;
      --c-neutral:#e2e8f0;
      --c-border:#334155;
    }
  }
  
  *{box-sizing:border-box;margin:0;padding:0}
  body{
    font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
    color:var(--c-neutral);
    background:var(--c-bg);
    line-height:1.55;
  }
  
  /* Links */
  a{color:inherit;text-decoration:none}
  a:hover{color:var(--c-primary)}
  
  /* Containers & grids */
  .container{max-width:1040px;margin:0 auto;padding:0 20px}
  .two-col{display:grid;gap:24px}
  .cards{display:grid;gap:16px;margin-top:16px}
  @media(min-width:860px){
    .two-col{grid-template-columns:1fr 1fr}
    .cards{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
  }
  
  /* -------------------  NAV BAR  ------------------- */
  .nav{
    position:sticky;top:0;z-index:10;
    background:rgba(255,255,255,.72);
    backdrop-filter:saturate(180%) blur(10px);
    border-bottom:1px solid var(--c-border);
    transition:background .3s ease,box-shadow .3s ease;
  }
  @media(prefers-color-scheme:dark){
    .nav{background:rgba(15,23,42,.72)}
  }
  .nav.scrolled{box-shadow:0 1px 4px rgba(0,0,0,.06);}
  .nav .container{display:flex;align-items:center;justify-content:space-between;height:60px}
  .nav .brand{font-weight:800}
  .nav a{margin-left:16px}
  .nav .cta{
    padding:8px 12px;border:1px solid #94a3b8;border-radius:var(--radius-m);
    transition:background .2s, color .2s;
  }
  .nav .cta.solid{background:var(--c-primary);color:#fff;border-color:var(--c-primary)}
  .nav .cta.flash{animation:pulse 1.2s ease-out 1}
  @keyframes pulse{
    0%{transform:scale(1)}
    50%{transform:scale(1.07)}
    100%{transform:scale(1)}
  }
  
  /* -------------------  HERO  ------------------- */
  .hero{padding:100px 0 60px;background:linear-gradient(180deg,var(--c-bg-alt),transparent)}
  .hero h1{font-size:var(--f-h1);line-height:1.1;margin-bottom:12px}
  .hero .sub{font-size:18px;color:#475569;max-width:680px}
  .cta-row{margin:24px 0}
  .btn{
    display:inline-block;padding:12px 16px;border:1px solid var(--c-border);
    border-radius:var(--radius-xl);font-weight:500;transition:background .2s,color .2s,transform .15s;
  }
  .btn:hover{transform:translateY(-2px);box-shadow:var(--shadow-m)}
  .btn.primary{background:var(--c-primary);color:#fff;border-color:var(--c-primary)}
  
  /* -------------------  SECTIONS  ------------------- */
  .section{padding:64px 0}
  .section.alt{background:var(--c-bg-alt)}
  /* Headings: add space before, none after */
  h2{font-size:var(--f-h2);margin:16px 0 0}
  h3{font-size:var(--f-h3);margin:12px 0 0}

  /* Remove top margin on content immediately after a heading */
  h2 + p, h2 + ul, h2 + ol,
  h3 + p, h3 + ul, h3 + ol { margin-top: 0 }

  /* Avoid leading space when a heading is the first child in a section */
  .section .container h2:first-child,
  .section .container h3:first-child { margin-top: 0 }
  .lead{font-size:1.125rem;color:#475569;max-width:760px;margin-bottom:24px}
  
  /* Cards */
  .card{
    border:1px solid var(--c-border);
    border-radius:var(--radius-xl);
    padding:24px 20px;background:var(--c-bg);
    transition:transform .2s ease,box-shadow .2s ease;
  }
  .card:hover{
    transform:translateY(-4px);
    box-shadow:var(--shadow-m);
  }
  
  /* Steps list */
  .steps{counter-reset:step;list-style:none;padding-left:0}
  .steps li{margin:18px 0;display:flex;gap:12px;align-items:flex-start}
  
  /* Icons inside steps */
  .steps i{margin-top:3px;color:var(--c-primary)}
  
  /* Stat highlight */
  .stat{color:var(--c-primary);font-weight:600;font-size:1.1em;letter-spacing:.4px}
  
  /* Tiny footnote */
  .tiny{font-size:12px;color:#64748b;margin-top:8px}
  
  /* -------------------  FOOTER  ------------------- */
  .footer{
    padding:32px 0;border-top:1px solid var(--c-border);
    font-size:14px;color:#475569;background:var(--c-bg)
  }
  .footer .container{
    display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:8px
  }
  
  /* -------------------  MOTION PREFERENCES  ------------------- */
  @media(prefers-reduced-motion:reduce){
    *,*::before,*::after{animation:none!important;transition:none!important}
  }
  
  /* Proof bar */
  .proof-bar{background:linear-gradient(90deg,#eef2ff,transparent);padding:10px 0;border-top:1px solid var(--c-border);border-bottom:1px solid var(--c-border)}
  .proof-bar .container{display:flex;gap:12px;flex-wrap:wrap;align-items:center;justify-content:center}
  .pill{display:flex;gap:8px;align-items:center;padding:8px 12px;border:1px solid var(--c-border);border-radius:999px;background:#fff}

  /* Logos strip */
  .logos{padding:24px 0;background:var(--c-bg)}
  .logo-row{display:flex;gap:24px;flex-wrap:wrap;align-items:center;justify-content:center;opacity:.9}
  .logo-row img{height:28px;filter:grayscale(100%);opacity:.8;transition:filter .2s,opacity .2s}
  .logo-row img:hover{opacity:1;filter:none}

  /* Product mock */
  .product{padding:40px 0}
  .mock{border:1px solid var(--c-border);border-radius:16px;padding:8px;background:var(--c-bg);box-shadow:var(--shadow-m)}
  .mock img{display:block;width:100%;height:auto;border-radius:12px}

  /* Assurance strip */
  .assurance{padding:20px 0;border-top:1px solid var(--c-border);border-bottom:1px solid var(--c-border);background:var(--c-bg)}
  .assurance .container{display:flex;gap:16px;flex-wrap:wrap;justify-content:center}
  .assure-item{display:flex;gap:8px;align-items:center;padding:8px 12px;border:1px dashed var(--c-border);border-radius:999px;color:#475569}
  .assure-item i{color:var(--c-primary)}

  /* Pilot banner */
  .banner{background:linear-gradient(90deg,#e0f2fe,#eef2ff);border-bottom:1px solid var(--c-border);font-size:14px}
  .banner .container{display:flex;justify-content:center;align-items:center;padding:8px 0;gap:8px}
  .banner a{color:var(--c-primary);text-decoration:underline}

  /* Skip link and focus */
  .skip-link{position:absolute;left:-999px;top:auto;width:1px;height:1px;overflow:hidden}
  .skip-link:focus{position:static;width:auto;height:auto;padding:8px 12px;background:var(--c-primary);color:#fff;border-radius:8px}
  :focus-visible{outline:2px solid var(--c-accent);outline-offset:2px}

  /* Reveal animation */
  .pre-reveal{opacity:0;transform:translateY(12px);transition:opacity .5s ease,transform .5s ease}
  .reveal{opacity:1;transform:none}
  @media(prefers-reduced-motion:reduce){.pre-reveal{opacity:1;transform:none;transition:none}}

  /* Highlight policy/terms links */
  .policy-link{color:var(--c-primary);text-decoration:underline}
  .policy-link:hover{text-decoration-thickness:2px}