:root{
  color-scheme: dark;
  --bg:#0b0a0d; --panel:#17151a; --line:#2e2a31; --text:#f1ebe3; --mute:#a69d93;
  --flare:#ff4a1c; --sodium:#f4c12e;
  --display:"Big Shoulders Stencil Display", Impact, "Arial Narrow", sans-serif;
  --body:"Barlow Semi Condensed", "Arial Narrow", system-ui, sans-serif;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--text);font:17px/1.55 var(--body)}
a{color:var(--sodium)}
a:focus-visible,button:focus-visible{outline:2px solid var(--sodium);outline-offset:3px}
.wrap{max-width:980px;margin:0 auto;padding-inline:20px}
header.top{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-block:16px}
header.top a.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--text);font-family:var(--display);font-weight:900;font-size:26px;letter-spacing:.02em;text-transform:uppercase}
header.top img{width:40px;height:40px;border-radius:10px}
header.top nav{display:flex;gap:16px;font-size:15px}
header.top nav a{color:var(--mute);text-decoration:none}
header.top nav a:hover{color:var(--text)}
.hero{position:relative;border-radius:16px;overflow:hidden;background:#07080c}
.hero img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover}
.lead{max-width:62ch;font-size:20px;color:#d9d1c7;margin:24px 0 8px}
.stores{display:flex;flex-wrap:wrap;gap:10px;margin:18px 0 8px}
.store{display:inline-flex;flex-direction:column;border:1px solid var(--line);border-radius:12px;padding:10px 18px;background:var(--panel);min-width:190px}
.store small{color:var(--mute);font-size:12px;letter-spacing:.1em;text-transform:uppercase}
.store b{font-size:19px}
h1,h2{font-family:var(--display);font-weight:900;text-transform:uppercase;line-height:1;text-wrap:balance}
h1{font-size:clamp(38px,6vw,64px);margin:28px 0 0}
h2{font-size:30px;margin:44px 0 12px}
.features{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}
.feat{background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:16px}
.feat b{display:block;font-family:var(--display);font-size:22px;text-transform:uppercase;margin-bottom:4px}
.feat span{color:var(--mute);font-size:16px}
.doc{max-width:70ch}
.doc h2{font-size:24px;margin-top:32px}
.doc li{margin-bottom:6px}
.note{color:var(--mute);font-size:15px}
footer{margin-top:56px;padding-block:24px 36px;border-top:1px solid var(--line);color:var(--mute);font-size:14px;display:flex;flex-wrap:wrap;gap:8px 18px;justify-content:space-between}
footer a{color:var(--mute)}
@media (max-width:560px){ header.top nav{gap:12px;font-size:14px} .lead{font-size:18px} }
