
:root{
  --bg:#0b1215;
  --panel:#0e161a;
  --text:#dde6ea;
  --muted:#a9bcc6;
  --teal:#36d7b7;
  --card:#0f181c;
  --ring:rgba(54,215,183,.25);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:radial-gradient(1200px 800px at 10% -10%, rgba(54,215,183,.08), transparent), var(--bg);color:var(--text);font:400 17px/1.55 ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";}
a{color:var(--teal);text-decoration:none}
.container{max-width:1120px;margin:0 auto;padding:28px 20px}
.header{display:flex;align-items:center;gap:14px}
.header img{height:28px;width:auto;display:block}
.underline{height:4px;width:140px;background:var(--teal);border-radius:8px;margin:18px 0 8px}
.hero{padding:20px 0 18px}
h1{font-size:44px;line-height:1.1;margin:10px 0 12px;letter-spacing:-.01em}
.sub{font-size:20px;color:var(--muted);max-width:800px}
.btnrow{display:flex;flex-wrap:wrap;gap:14px;margin:26px 0 6px}
.btn{display:inline-flex;align-items:center;gap:10px;padding:14px 18px;border-radius:14px;border:1px solid rgba(200,240,235,.14);background:linear-gradient(180deg, rgba(54,215,183,.15), rgba(54,215,183,.05));color:#dff;box-shadow:0 0 0 8px var(--ring);transition:transform .12s ease, box-shadow .12s ease}
.btn.dark{background:#121b1f;color:var(--text);box-shadow:none}
.btn:hover{transform:translateY(-1px) scale(1.01)}
.grid{display:grid;grid-template-columns:repeat(12,1fr);gap:18px;margin:34px 0}
.card{grid-column:span 12;background:var(--card);border-radius:18px;border:1px solid rgba(200,240,235,.12);padding:22px 20px}
.card h2{margin:0 0 12px;font-size:24px}
.card ul{margin:8px 0 0 20px}
.kicker{display:inline-block;padding:7px 12px;border-radius:999px;border:1px solid rgba(200,240,235,.18);color:#bfe;opacity:.9;margin:8px 0 18px}
.footer{margin:34px 0 22px;color:#8da3ad;font-size:14px;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
@media (min-width:760px){
  h1{font-size:64px}
  .grid .card{grid-column:span 6}
  .grid .card.full{grid-column:span 12}
}
.small{font-size:14px;color:#9fb2ba}
.logoMark{display:flex;align-items:center;gap:12px}
.logoMark b{font-weight:700}
/* Demo checkout mock */
.mock{display:flex;align-items:flex-start;gap:16px;margin:4px 0 0}
.mock .tick{height:28px;width:28px;border-radius:50%;background:linear-gradient(180deg,var(--teal),#15b89b);display:inline-flex;align-items:center;justify-content:center;color:#003a30;font-weight:900}
.mock p{margin:6px 0 0;color:var(--muted)}
