/* Shared stylesheet for the standalone legal/FAQ pages (terms.html,
   privacy.html, refunds.html, faq.html, methodology.html, glossary-*.html).
   These are served as real static files (not through the SPA) so search
   and AI crawlers can read them without executing JavaScript, so this file
   intentionally has no dependency on index.html's JS. Tokens copied from
   index.html's :root to keep the visual language consistent; fixed dark
   theme only (no light/dark toggle) to keep these pages simple. */

:root{
  --navy: #0a0a0e; --navy-1: #111117; --navy-2: #17171f; --navy-3: #1e1e28;
  --off-white: #efeff4; --muted: #8a8a97; --muted-2: #a9a9b7;
  --border: rgba(236,236,246,0.07); --border-2: rgba(236,236,246,0.14);
  --teal: #45d6be; --teal-dim: rgba(69,214,190,0.10);
  --font-display:'Instrument Sans',system-ui,sans-serif;
  --font-body:'Instrument Sans',system-ui,sans-serif;
  --font-mono:'IBM Plex Mono','Cascadia Mono',Consolas,monospace;
  --fs-xs:.76rem; --fs-sm:.84rem; --fs-md:.90rem; --fs-lg:1rem;
  --fs-xl:1.25rem; --fs-2xl:1.6rem; --fs-3xl:2.2rem;
  --r-sm:3px; --r-md:5px; --r-lg:8px;
}

*{box-sizing:border-box}
body{
  margin:0;background:var(--navy);color:var(--off-white);
  font-family:var(--font-body);line-height:1.6;font-size:var(--fs-md);
}
a{color:var(--teal);text-decoration:none}
a:hover{text-decoration:underline}

.legal-header{
  display:flex;align-items:center;justify-content:space-between;
  padding:20px 32px;border-bottom:1px solid var(--border);
}
.legal-logo{font-family:var(--font-display);font-weight:700;font-size:var(--fs-lg);letter-spacing:.12em;color:var(--off-white)}
.legal-logo span{color:var(--teal)}
.legal-header-nav{display:flex;gap:24px;align-items:center}
.legal-header-nav a{font-size:var(--fs-sm);color:var(--muted-2)}
.legal-header-nav a:hover{color:var(--off-white)}

.legal-main{max-width:720px;margin:0 auto;padding:56px 24px 80px}
.legal-eyebrow{font-size:var(--fs-xs);text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-family:var(--font-mono);margin-bottom:10px}
.legal-h1{font-family:var(--font-display);font-weight:700;font-size:var(--fs-3xl);margin:0 0 8px}
.legal-updated{font-size:var(--fs-sm);color:var(--muted);margin-bottom:40px}
.legal-main h2{font-family:var(--font-display);font-weight:600;font-size:var(--fs-xl);margin:40px 0 12px;color:var(--off-white)}
.legal-main h3{font-family:var(--font-display);font-weight:600;font-size:var(--fs-lg);margin:28px 0 10px;color:var(--off-white)}
.legal-main p{color:var(--muted-2);margin:0 0 16px}
.legal-main ul,.legal-main ol{color:var(--muted-2);margin:0 0 16px;padding-left:22px}
.legal-main li{margin-bottom:8px}
.legal-main strong{color:var(--off-white)}
.legal-note{
  background:var(--navy-1);border:1px solid var(--border);border-radius:var(--r-md);
  padding:16px 18px;font-size:var(--fs-sm);color:var(--muted-2);margin:24px 0;
}

.faq-item{border-bottom:1px solid var(--border);padding:20px 0}
.faq-item:first-child{border-top:1px solid var(--border)}
.faq-q{font-family:var(--font-display);font-weight:600;font-size:var(--fs-lg);color:var(--off-white);margin:0 0 8px}
.faq-a{color:var(--muted-2);margin:0}

.glossary-term-card{
  background:var(--navy-1);border:1px solid var(--border);border-radius:var(--r-lg);
  padding:24px 28px;margin-bottom:20px;
}
.glossary-links{display:flex;gap:16px;flex-wrap:wrap;margin-top:16px;font-size:var(--fs-sm)}

.legal-footer{
  padding:24px 32px;border-top:1px solid var(--border);
  display:flex;align-items:center;justify-content:space-between;
  font-size:var(--fs-xs);color:var(--muted);font-family:var(--font-mono);
  flex-wrap:wrap;gap:8px;
}
.legal-footer a{color:var(--muted-2)}

@media (max-width: 640px){
  .legal-header{padding:16px 20px}
  .legal-header-nav{gap:14px}
  .legal-main{padding:40px 20px 60px}
}