:root{
      --bg: #0b0b0b;           /* black */
      --bg-soft: #111;         /* near-black */
      --primary: #c40000;      /* red */
      --primary-700:#9f0000;   /* darker red */
      --text: #eee;            /* light text */
      --muted:#bbb;            /* silver */
      --card:#181818;          /* dark card */
      --border:#2a2a2a;        /* subtle border */
      --focus: #c0c0c0;        /* silver */
      --ok: #23c55e;           /* green for success */
      --warn:#eab308;          /* amber */
    }
    h1{
      margin: 0 auto;
      text-align: center;
    }
    h4{
      margin: 0 auto;
      text-align: center;
    }
    h4 strong{
      text-decoration: underline;
      font-size: 20px;
      color: red;
    }
    *{box-sizing:border-box}
    html,body{margin:0;height:100%;background:var(--bg);color:var(--text);font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji";}
    a{color:inherit;text-decoration:none}
    img{max-width:100%;display:block}

    /* Layout */
    .container{max-width:1120px;margin-inline:auto;padding:0 1.25rem}
    header{position:sticky;top:0;z-index:40;background:rgba(11,11,11,.8);backdrop-filter:saturate(140%) blur(8px);border-bottom:1px solid var(--border)}
    .nav{display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:.75rem 0}
    .brand{display:flex;align-items:center;gap:.75rem;font-weight:700;letter-spacing:.3px}
    .logo{width:40px;height:40px;border-radius:10px;background:linear-gradient(135deg,var(--primary),var(--primary-700));display:grid;place-items:center;color:#fff;font-weight:900}
    .navlinks{display:flex;gap:1rem;align-items:center}
    .btn{display:inline-flex;align-items:center;justify-content:center;padding:.8rem 1.1rem;border-radius:14px;border:1px solid var(--border);background:var(--card);font-weight:600;transition:.18s transform ease, .18s background ease, .18s border-color ease}
    .btn:hover{transform:translateY(-1px);border-color:var(--primary)}
    .btn.primary{background:linear-gradient(135deg,var(--primary),var(--primary-700));border-color:transparent}
    .btn.ghost{background:transparent}

    /* Hero */
    .hero{position:relative;overflow:hidden;border-bottom:1px solid var(--border);background:
      radial-gradient(1200px 400px at 60% -10%, rgba(196,0,0,.18), transparent 60%),
      radial-gradient(700px 280px at 10% 10%, rgba(192,192,192,.14), transparent 60%),
      var(--bg-soft);
    }
    .hero .wrap{display:grid;grid-template-columns:1.1fr .9fr;gap:2rem;align-items:center;padding:4.5rem 0}
    .kicker{color:var(--muted);text-transform:uppercase;font-size:.8rem;letter-spacing:.12em}
    h1{font-size:clamp(1.9rem, 2.6vw + 1rem, 3.25rem);line-height:1.12;margin:.4rem 0 .75rem}
    .lead{color:#ddd;font-size:1.1rem;max-width:54ch}
    .badges{display:flex;flex-wrap:wrap;gap:.6rem;margin:1rem 0 1.5rem}
    .badge{font-size:.82rem;color:var(--muted);border:1px dashed var(--border);padding:.4rem .6rem;border-radius:999px}

    .hero-card{background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02));border:1px solid var(--border);border-radius:20px;padding:1.25rem}
    .statgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:.6rem;margin-top:.75rem}
    .stat{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:1rem}
    .stat span{display:block}
    .stat .num{font-size:1.5rem;font-weight:800}
    .stat .label{color:var(--muted);font-size:.85rem}
    .helper{color:var(--muted);font-size:.85rem;margin-top:.8rem}

    /* Value Props */
    .section{padding:3.25rem 0;border-bottom:1px solid var(--border)}
    .grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
    .card{background:var(--card);border:1px solid var(--border);border-radius:18px;padding:1.2rem}
    .card h3{margin:.1rem 0 .4rem;font-size:1.1rem}
    .card p{color:#d6d6d6;font-size:.98rem}
     /* Commercial band */
.band.commercial{
  background:linear-gradient(90deg, rgba(196,0,0,.12), rgba(192,192,192,.10));
}
.band .chips{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.75rem}
.band .chip{
  font-size:.82rem;color:var(--muted);
  border:1px dashed var(--border);
  padding:.35rem .6rem;border-radius:999px;
}

    /* Process */
    .stepgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}
    .step{border:1px dashed var(--border);border-radius:16px;padding:1rem;background:linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.01))}
    .step .idx{width:28px;height:28px;border-radius:999px;background:var(--primary);display:grid;place-items:center;font-weight:800}
    .step h4{margin:.5rem 0 .25rem}
    .step p{color:#d6d6d6}

    /* CTA + Form */
    .cta{display:grid;grid-template-columns:1.2fr .8fr;gap:1rem;align-items:start}
    form{display:grid;gap:.8rem}
    label{font-size:.9rem;color:var(--muted)}
    input, select, textarea{width:100%;padding:.8rem .9rem;border-radius:12px;border:1px solid var(--border);background:#121212;color:var(--text)}
    textarea{min-height:120px}
    .form-row{display:grid;grid-template-columns:1fr 1fr;gap:.8rem}
    .msg{display:none;margin-top:.5rem;font-size:.95rem}
    .msg.ok{color:var(--ok)}
    .msg.err{color:var(--primary)}

    /* FAQ */
    details{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:1rem}
    summary{cursor:pointer;font-weight:600}
    details p{color:#d6d6d6;margin:.6rem 0 0}

    /* Footer — keep consistent across project */
    footer{background:#222;color:#eee;text-align:center;padding:2rem;border-top:1px solid var(--border)}
    footer a{text-decoration:underline}

    /* Responsive */
    @media (max-width: 980px){
      .hero .wrap{grid-template-columns:1fr}
      .grid-3{grid-template-columns:1fr}
      .stepgrid{grid-template-columns:1fr 1fr}
      .cta{grid-template-columns:1fr}
      .form-row{grid-template-columns:1fr}
    }
    @media (max-width: 520px){
      .stepgrid{grid-template-columns:1fr}
      /* extra side padding for the first hero text block on small screens */
      .hero .wrap > div:first-child { padding-left: 1rem; padding-right: 1rem; }
      /* extra side padding for the retail text on small screens */
      .band .wrap > div:first-child { padding-left: 1rem; padding-right: 1rem; }
    }

    /* Mobile Nav */
    .mobile-toggle{display:none;appearance:none;border:1px solid var(--border);background:var(--card);color:var(--text);border-radius:12px;padding:.65rem .8rem;line-height:1;font-weight:700}
    .mobile-toggle:focus{outline:2px solid var(--focus);outline-offset:2px}
    .mobile-menu{position:fixed;inset:0 0 auto 0;top:56px;
      background:rgba(11,11,11,.98);border-top:1px solid var(--border);display:none}
    .mobile-menu.open{display:block}
    .mobile-menu .menu{display:grid;gap:.5rem;padding:1rem}
    .mobile-menu a{display:block;padding:.9rem 1rem;border:1px solid var(--border);border-radius:12px;background:var(--card)}

    @media (max-width: 980px){
      .navlinks{display:none}
      .mobile-toggle{display:inline-flex}
    }

    /* Retail band */
    .band{background:linear-gradient(90deg, rgba(192,192,192,.12), rgba(196,0,0,.10));border-top:1px solid var(--border);border-bottom:1px solid var(--border)}
    .band .wrap{display:grid;grid-template-columns:1.2fr .8fr;gap:1rem;align-items:center;padding:1.4rem 0}
    .band h3{margin:.2rem 0 .3rem;font-size:1.25rem}
    .band p{color:#d6d6d6;margin:0}
    .band .actions{display:flex;gap:.6rem;flex-wrap:wrap}
    @media (max-width: 860px){.band .wrap{grid-template-columns:1fr}}