/* Shared look for the app's static pages (pricing, help, guides, privacy,
   terms): the same type and colours as the app and www.trapstats.app
   (Archivo + IBM Plex Mono, #ff6b00 on #14140f). Each page keeps its own
   inline <style> for its layout; this file loads after it, so it wins
   where they overlap. The --bg-void/--accent-clay/... names are the
   pages' original variables, kept as aliases. */
:root{
  --bg:#14140f; --bg-2:#0f0f0d; --surface:#1d1f18; --surface-2:#262820; --border:#383b30;
  --text:#f2efe6; --text-2:#b3b2a6; --text-3:#9a9a8e;
  --orange:#ff6b00; --orange-hover:#e05500; --orange-text:#ff8a3d; --gold:#d4b87a;
  --hit:#4ade80; --miss:#f87171;
  --bg-void:var(--bg); --bg-panel:var(--surface); --bg-panel-raised:var(--surface-2); --line:var(--border);
  --accent-clay:var(--orange-text); --accent-brass:var(--gold);
  --text-primary:var(--text); --text-muted:var(--text-2);
  --good:var(--hit); --bad:var(--miss);
}
html,body{background:var(--bg)}
body{font-family:'Archivo',system-ui,sans-serif;color:var(--text);-webkit-font-smoothing:antialiased}
a{color:var(--orange-text)}
h1{font-family:'Archivo',sans-serif;font-weight:900;font-style:italic;text-transform:uppercase;letter-spacing:-.01em;line-height:1.05}
h2,h3{font-family:'Archivo',sans-serif}
p,li{font-size:16px}
.back{display:none}
.footer-nav{display:none}

/* Header */
.site-head{position:sticky;top:0;z-index:20;background:rgba(15,15,13,.9);backdrop-filter:blur(10px);border-bottom:1px solid var(--border)}
.site-head .in{max-width:1160px;margin:0 auto;padding:0 20px;height:64px;display:flex;align-items:center;gap:22px}
.site-head .brand img{height:40px;width:auto;display:block}
.site-head nav{display:flex;gap:20px;margin-left:auto;align-items:center}
.site-head nav a{color:var(--text-2);text-decoration:none;font-weight:600;font-size:15px;white-space:nowrap}
.site-head nav a:hover,.site-head nav a[aria-current="page"]{color:var(--text)}
.site-head .cta{background:var(--orange);color:#fff !important;padding:9px 16px;border-radius:9px;font-weight:700}
.site-head .cta:hover{background:var(--orange-hover)}
@media (max-width:640px){.site-head nav a.opt{display:none}.site-head .brand img{height:34px}}

/* Footer */
.site-foot{border-top:1px solid var(--border);margin-top:64px;padding:32px 20px;color:var(--text-3);font-size:14px}
.site-foot .in{max-width:1160px;margin:0 auto;display:flex;flex-wrap:wrap;gap:14px 26px;align-items:center;justify-content:space-between}
.site-foot nav{display:flex;flex-wrap:wrap;gap:16px}
.site-foot a{color:var(--text-2);text-decoration:none}
.site-foot a:hover{color:var(--text)}