/* ═══════════════════════════════════════════════════════════
   legal.css — dunkles Design für impressum / datenschutz / agb.
   Restyled NUR das Aussehen der bestehenden Klassen; der
   rechtliche Text in den HTML-Dateien bleibt 100% unverändert.
   Wird nach dem alten Inline-<style> geladen und überschreibt es.
   ═══════════════════════════════════════════════════════════ */
:root {
  --navy-0:#05080F; --navy-1:#0A0F1C; --navy-2:#0D1B2E;
  --accent:#1D4ED8; --accent-glow:#60A5FA; --paper:#F2EFE6;
}
html { scroll-behavior: smooth; }
body {
  background: var(--navy-1) !important; color: var(--paper) !important;
  font-family: 'Inter Tight', system-ui, sans-serif !important;
  font-size: 16px; line-height: 1.7; -webkit-font-smoothing: antialiased;
}
.container { max-width: 880px; margin: 0 auto; padding: 0 28px; }

header {
  background: var(--navy-0) !important;
  border-bottom: 1px solid rgba(255,255,255,0.06);
  display: flex; align-items: center; justify-content: space-between; padding: 16px 28px !important;
}
.nav-logo img { display: none !important; }
.nav-logo-text {
  display: inline !important; font-family: 'Bricolage Grotesque', Georgia, sans-serif !important;
  color: var(--paper) !important; font-weight: 500 !important; font-size: 1.6rem !important; letter-spacing: -0.02em;
}
.nav-logo-text span { color: var(--accent-glow) !important; font-family: 'Fraunces', Georgia, serif !important; font-style: italic !important; }
header a.back, header .back {
  color: rgba(242,239,230,0.6) !important; font-family: 'JetBrains Mono', monospace !important;
  font-size: 12px !important; letter-spacing: .1em; text-transform: uppercase;
}
header a.back:hover, header .back:hover { color: var(--paper) !important; }

.hero {
  background: var(--navy-0) !important;
  border-bottom: 1px solid rgba(255,255,255,0.06) !important;
  padding: clamp(48px,8vh,80px) 0 !important;
}
.hero h1 {
  font-family: 'Bricolage Grotesque', Georgia, sans-serif !important; color: var(--paper) !important;
  font-size: clamp(2.2rem,5vw,3.4rem) !important; letter-spacing: -0.02em; line-height: 1.1;
}
.hero p { color: rgba(242,239,230,0.5) !important; }

.content { padding: clamp(48px,7vh,72px) 0 clamp(64px,10vh,100px) !important; }
.block {
  background: rgba(255,255,255,0.03) !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  border-radius: 16px !important; padding: 34px 38px !important; margin-bottom: 22px !important;
  box-shadow: none !important;
}
.block h2 {
  font-family: 'Bricolage Grotesque', Georgia, sans-serif !important; color: var(--paper) !important;
  border-bottom: 1px solid rgba(255,255,255,0.1) !important; padding-bottom: 16px; margin-bottom: 22px; font-size: 1.5rem;
}
.block h3 { color: var(--paper) !important; font-weight: 600; margin: 22px 0 8px; font-size: 1rem; }
.block p, .block li, .info-row span { color: rgba(242,239,230,0.65) !important; }
.block strong, .info-row strong { color: var(--paper) !important; }
.block a { color: var(--accent-glow) !important; text-decoration: none; }
.block a:hover { text-decoration: underline; }
.badge {
  display: inline-block; background: rgba(96,165,250,0.12) !important; color: var(--accent-glow) !important;
  border: 1px solid rgba(96,165,250,0.3); font-family: 'JetBrains Mono', monospace !important;
  font-size: .72rem !important; letter-spacing: .1em; text-transform: uppercase;
  padding: 5px 12px !important; border-radius: 999px !important; margin-bottom: 18px;
}

footer {
  background: var(--navy-0) !important; text-align: center; padding: 36px 28px !important;
  border-top: 1px solid rgba(255,255,255,0.05);
}
footer p { color: rgba(242,239,230,0.35) !important; font-size: .82rem; }
footer a { color: rgba(242,239,230,0.55) !important; margin: 0 12px; font-size: .82rem; text-decoration: none; }
footer a:hover { color: var(--paper) !important; }
.footer-links { margin-top: 12px; }

/* agb.html zus.: Inhaltsverzeichnis (.toc) */
.toc {
  background: rgba(255,255,255,0.03) !important; border: 1px solid rgba(255,255,255,0.08) !important;
  border-radius: 16px !important; box-shadow: none !important;
}
.toc a { color: var(--accent-glow) !important; }
.toc h2, .toc h3, .toc strong { color: var(--paper) !important; }
.toc p, .toc li, .toc span { color: rgba(242,239,230,0.65) !important; }