@import url("./tokens.css");

* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; }
body {
  background: radial-gradient(circle at 12% 6%, var(--color-accent-soft), transparent 34rem), radial-gradient(circle at 90% 0%, color-mix(in oklch, var(--color-accent-2), transparent 66%), transparent 30rem), var(--color-paper);
  color: var(--color-ink); font-family: var(--font-body); font-size: var(--text-base); line-height: 1.6;
}
a { color: inherit; }
.legal-nav { position: sticky; top: 0; z-index: 2; border-bottom: var(--rule-hair) solid var(--color-line); background: color-mix(in oklch, var(--color-paper), transparent 12%); backdrop-filter: blur(18px); }
.legal-nav__inner, .legal-main, .legal-footer { width: min(100% - 2rem, 60rem); margin-inline: auto; }
.legal-nav__inner { display: flex; flex-wrap: wrap; gap: 1rem 1.5rem; align-items: center; justify-content: space-between; padding-block: 0.9rem; }
.legal-brand { color: var(--color-accent); font-family: var(--font-mono); font-weight: 700; text-decoration: none; }
.legal-nav__links, .legal-footer__links { display: flex; flex-wrap: wrap; gap: 1rem; font-family: var(--font-mono); font-size: 0.875rem; }
.legal-nav__links a:hover, .legal-nav__links a[aria-current="page"] { color: var(--color-accent); }
.legal-main { padding-block: 4rem 5rem; }
.legal-kicker, .legal-updated { color: var(--color-muted); font-family: var(--font-mono); font-size: 0.875rem; }
h1, h2, h3 { font-family: var(--font-display); line-height: 1; text-wrap: balance; }
h1 { max-width: 12ch; margin: 1rem 0 1.25rem; font-size: clamp(3rem, 9vw, 6.5rem); letter-spacing: -0.055em; text-transform: uppercase; }
h2 { margin-top: 3rem; font-size: clamp(1.8rem, 4vw, 2.75rem); }
h3 { margin-top: 2rem; font-size: 1.25rem; }
.legal-intro { max-width: 46rem; color: color-mix(in oklch, var(--color-ink), var(--color-muted) 28%); font-family: var(--font-serif); font-size: clamp(1.15rem, 2vw, 1.45rem); }
.legal-card { margin-block: 2rem; border: var(--rule-hair) solid var(--color-line); border-radius: var(--radius-lg); background: var(--color-glass); box-shadow: var(--shadow-panel); padding: clamp(1.25rem, 4vw, 2rem); }
.legal-card h2:first-child { margin-top: 0; }
li + li { margin-top: 0.5rem; }
dt { margin-top: 1rem; font-weight: 800; }
dd { margin: 0.2rem 0 0; color: var(--color-muted); }
.legal-footer { border-top: var(--rule-hair) solid var(--color-line); padding-block: 1.5rem 3rem; color: var(--color-muted); font-size: 0.9rem; }
.legal-footer__links { margin-bottom: 1rem; }
@media (max-width: 40rem) { .legal-main { padding-block: 2.5rem 3.5rem; } .legal-nav__inner, .legal-main, .legal-footer { width: min(100% - 1.5rem, 60rem); } }