/* legal.css — shared stylesheet for /privacy.html, /terms.html, /delete-account.html.
   Shipped as a passthrough file (dist/legal.css) and referenced by each page via
   <link rel="stylesheet" href="/legal.css">. Token VALUES mirror contract/design/tokens.json;
   duplicated intentionally so legal pages stay decoupled from the landing style.css. */

:root {
  --bg:            #0A0F1E; /* navy background */
  --ink:          #E0E0E0; /* body base text */
  --gold:         #D4AF37; /* headings / links / accents */
  --text:         #C0C0C0; /* p, li */
  --text-strong:  #E8E8E8; /* text inside callout boxes */
  --text-muted:   #9E9E9E; /* .updated, .company */
  --text-dim:     #888888; /* .subtitle */
  --text-faint:   #666666; /* .last-updated */
  --crimson-bg:     rgba(192, 57, 43, 0.12);
  --crimson-border: rgba(192, 57, 43, 0.40);
  --gold-bg:        rgba(212, 175, 55, 0.08);
  --gold-border:    rgba(212, 175, 55, 0.25);
  --gold-rule:      rgba(212, 175, 55, 0.20);
  --panel:          rgba(255, 255, 255, 0.05);
  --font-display: 'Cinzel', Georgia, 'Times New Roman', serif;
  --font-body: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

/* Self-hosted Cinzel — replaces the old Google Fonts <link>/@import so legal pages
   make zero external requests. Same bundled subset the landing page uses. */
@font-face {
  font-family: 'Cinzel';
  font-style: normal;
  font-weight: 400 900;
  font-display: swap;
  src: url('/fonts/cinzel-subset.woff2') format('woff2');
}

* { margin: 0; padding: 0; box-sizing: border-box; }

body {
  background-color: var(--bg);
  color: var(--ink);
  font-family: var(--font-body);
  line-height: 1.7;
  padding: 40px 20px;
}

.container { max-width: 720px; margin: 0 auto; }

h1 {
  font-family: var(--font-display);
  color: var(--gold);
  font-size: 28px;
  margin-bottom: 8px;
  letter-spacing: 1px;
}

h2 {
  font-family: var(--font-display);
  color: var(--gold);
  font-size: 18px;
  margin-top: 32px;
  margin-bottom: 12px;
  letter-spacing: 0.5px;
}

p, li { color: var(--text); font-size: 15px; margin-bottom: 12px; }

ul { padding-left: 24px; margin-bottom: 12px; }
li { margin-bottom: 6px; }

a { color: var(--gold); text-decoration: none; }
a:hover { text-decoration: underline; }

/* terms.html + privacy.html */
.updated { color: var(--text-muted); font-size: 13px; margin-bottom: 32px; }
.company {
  color: var(--text-muted);
  font-size: 13px;
  margin-top: 40px;
  padding-top: 20px;
  border-top: 1px solid var(--gold-rule);
}

/* delete-account.html */
.subtitle { color: var(--text-dim); font-size: 13px; margin-bottom: 32px; }

.warning-box {
  background: var(--crimson-bg);
  border: 1px solid var(--crimson-border);
  border-radius: 12px;
  padding: 20px;
  margin: 24px 0;
}
.warning-box p { color: var(--text-strong); margin-bottom: 0; }

.steps-box {
  background: var(--gold-bg);
  border: 1px solid var(--gold-border);
  border-radius: 12px;
  padding: 20px;
  margin: 24px 0;
}
.steps-box ol { padding-left: 20px; margin-bottom: 0; }
.steps-box li { color: var(--text-strong); margin-bottom: 8px; }
.steps-box li:last-child { margin-bottom: 0; }

.contact-box {
  background: var(--panel);
  border: 1px solid var(--gold-border);
  border-radius: 12px;
  padding: 20px;
  margin: 24px 0;
}

/* replaces the two removed inline style="" attributes in delete-account.html */
.contact-email { margin-top: 8px; margin-bottom: 0; }
.last-updated  { margin-top: 40px; color: var(--text-faint); font-size: 12px; }