@import url('https://fonts.googleapis.com/css2?family=Archivo:wght@300;400;500;600;700;800&family=IBM+Plex+Mono:wght@500;600&display=swap');

/* ===== Farbfundament Daniel Marx — Primitives & Semantics ===== */
:root {
  --n-50:#FBFCFD; --n-100:#F0F3F6; --n-200:#E3E7EC; --n-300:#C2C9D4; --n-400:#A3ADBC;
  --n-500:#8B94A3; --n-600:#5C6878; --n-700:#414B5A; --n-800:#2C374A; --n-900:#16233B; --n-950:#0D1626;
  --b-50:#EFF5FB; --b-100:#C9DEEE; --b-200:#A5C8E2; --b-300:#7FAED2; --b-400:#5B8FBF;
  --b-500:#3E6FA6; --b-600:#33598A; --b-700:#29466E; --b-800:#1F3553; --b-900:#16253A;

  --dm-bg:var(--n-50); --dm-surface:var(--n-100);
  --dm-border:var(--n-200); --dm-border-strong:var(--n-300);
  --dm-text-primary:var(--n-900); --dm-text-secondary:var(--n-700); --dm-text-muted:var(--n-600);
  --dm-accent:var(--b-500); --dm-accent-on-subtle:var(--b-700); --dm-focus-ring:var(--b-500);
}
:root[data-theme="dark"] {
  --dm-bg:var(--n-950); --dm-surface:var(--n-900);
  --dm-border:var(--n-800); --dm-border-strong:var(--n-700);
  --dm-text-primary:var(--n-50); --dm-text-secondary:var(--n-300); --dm-text-muted:var(--n-500);
  --dm-accent:var(--b-300); --dm-accent-on-subtle:var(--b-300); --dm-focus-ring:var(--b-300);
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --dm-bg:var(--n-950); --dm-surface:var(--n-900);
    --dm-border:var(--n-800); --dm-border-strong:var(--n-700);
    --dm-text-primary:var(--n-50); --dm-text-secondary:var(--n-300); --dm-text-muted:var(--n-500);
    --dm-accent:var(--b-300); --dm-accent-on-subtle:var(--b-300); --dm-focus-ring:var(--b-300);
  }
}
:root {
  --paper: var(--dm-bg); --surface: var(--dm-surface);
  --ink: var(--dm-text-primary); --ink-soft: var(--dm-text-secondary); --ink-faint: var(--dm-text-muted);
  --line: var(--dm-border); --line-strong: var(--dm-border-strong);
  --accent: var(--dm-accent-on-subtle); --accent-fill: var(--dm-accent); --focus: var(--dm-focus-ring);
  --serif: 'Archivo', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --mono: 'IBM Plex Mono', ui-monospace, 'SFMono-Regular', Menlo, monospace;
}

* { box-sizing: border-box; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: var(--serif); font-size: 1.0625rem; line-height: 1.62; -webkit-font-smoothing: antialiased; }
a { color: var(--accent); }
:focus-visible { outline: 2px solid var(--focus); outline-offset: 2px; border-radius: 1px; }

.wrap { max-width: 760px; margin: 0 auto; padding-inline: clamp(1.25rem, 5vw, 2rem); }

.topbar { border-bottom: 1px solid var(--line); position: sticky; top: 0; background: color-mix(in srgb, var(--paper) 90%, transparent); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.topbar .inner { display: flex; align-items: center; justify-content: space-between; height: 64px; }
.brand { font-weight: 800; letter-spacing: -0.01em; text-decoration: none; color: var(--ink); font-size: 1.02rem; }
.brand .dot { color: var(--accent-fill); }
.back { font-size: 0.92rem; color: var(--ink-soft); text-decoration: none; }
.back:hover { color: var(--ink); }

main.legal { padding-block: clamp(2.5rem, 6vw, 4.5rem); }
.legal h1 { font-size: clamp(1.9rem, 4vw, 2.6rem); font-weight: 800; letter-spacing: -0.02em; line-height: 1.1; margin: 0 0 2rem; text-wrap: balance; }
.legal h2 { font-size: 1.18rem; font-weight: 700; letter-spacing: -0.01em; margin: 2.2rem 0 0.5rem; }
.legal p { margin: 0 0 1rem; color: var(--ink-soft); max-width: 68ch; }
.legal p.block { white-space: pre-line; }
.legal strong { color: var(--ink); font-weight: 600; }
.legal .eyebrow { font-family: var(--mono); font-size: 0.72rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--accent); margin: 0 0 0.8rem; display: block; }

footer.legal-foot { border-top: 1px solid var(--line); padding-block: 2rem; margin-top: 3rem; }
.legal-foot .inner { display: flex; gap: 1.5rem; flex-wrap: wrap; align-items: center; font-size: 0.85rem; color: var(--ink-faint); }
.legal-foot a { color: var(--ink-faint); text-decoration: none; }
.legal-foot a:hover { color: var(--ink); }
