/* VibeAudit legal pages — shared styles (matches landing page design system) */
@font-face {
  font-family: 'Space Grotesk';
  src: url('fonts/space-grotesk-var.woff2') format('woff2-variations');
  font-weight: 300 700; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Inter';
  src: url('fonts/inter-var.woff2') format('woff2-variations');
  font-weight: 100 900; font-style: normal; font-display: swap;
}
:root {
  --bg: #0b0e14; --bg-soft: #11151f; --card: rgba(255,255,255,.04);
  --border: rgba(255,255,255,.09); --text: #e8ecf4; --muted: #9aa4b8;
  --accent: #5eead4; --accent-2: #818cf8; --danger: #fb7185;
  --radius: 20px; --shadow: 0 20px 60px rgba(0,0,0,.35);
}
@media (prefers-color-scheme: light) {
  :root {
    --bg: #f7f9fc; --bg-soft: #eef2f8; --card: rgba(255,255,255,.75);
    --border: rgba(15,23,42,.10); --text: #0f172a; --muted: #55607a;
    --shadow: 0 18px 50px rgba(15,23,42,.08);
  }
}
* { margin: 0; padding: 0; box-sizing: border-box; }
body {
  font-family: 'Inter', -apple-system, "Segoe UI", "Helvetica Neue", Arial, sans-serif;
  background: var(--bg); color: var(--text); line-height: 1.7;
  -webkit-font-smoothing: antialiased;
}
h1, h2, h3, .kicker { font-family: 'Space Grotesk', 'Inter', -apple-system, sans-serif; }
.wrap { max-width: 820px; margin: 0 auto; padding: 0 24px; }
header { padding: 72px 0 40px; }
.kicker {
  display: inline-block; font-size: .8rem; letter-spacing: .22em; text-transform: uppercase;
  color: var(--accent); border: 1px solid var(--border); border-radius: 999px;
  padding: 6px 16px; margin-bottom: 20px;
}
h1 { font-size: clamp(1.9rem, 4vw, 2.8rem); line-height: 1.2; letter-spacing: -.02em; }
.meta { color: var(--muted); font-size: .9rem; margin-top: 12px; }
main section { padding: 0 0 36px; }
h2 { font-size: 1.25rem; margin: 28px 0 10px; }
p, li { color: var(--text); font-size: .97rem; }
.muted { color: var(--muted); }
ul { padding-left: 22px; margin: 8px 0; }
li { margin: 6px 0; }
a { color: var(--accent); }
.note {
  background: var(--card); border: 1px solid var(--border); border-radius: 14px;
  padding: 16px 20px; margin: 22px 0; font-size: .88rem; color: var(--muted);
}
footer {
  padding: 40px 0 60px; text-align: center; color: var(--muted); font-size: .85rem;
  border-top: 1px solid var(--border); margin-top: 24px;
}
footer nav { margin-bottom: 14px; }
footer nav a { margin: 0 10px; text-decoration: none; }
.ph { color: var(--danger); }
@media (prefers-reduced-motion: reduce) { * { transition: none !important; } }