/* Gemeinsame Gestaltung für Impressum, Datenschutz und Lizenzen – gleiche Farben wie die Startseite */
:root {
  --bg: #ffffff; --surf: #f2f2f2; --line: #d9d9d9; --fg: #111111; --muted: #5c5c5c; --mark: #fff3b0;
  --lg1: #48484d; --lg2: #8e8e93; --lg3: #c7c7cc; color-scheme: light;
}
@media (prefers-color-scheme: dark) { :root {
  --bg: #141416; --surf: #1e1f22; --line: #34353a; --fg: #f3f3f3; --muted: #a3a3a3; --mark: #5a4a10;
  --lg1: #8e8e93; --lg2: #5c5c61; --lg3: #38383c; color-scheme: dark } }
* { box-sizing: border-box }
body { margin: 0; background: var(--bg); color: var(--fg); font: 16px/1.6 "Manrope", "Segoe UI", system-ui, sans-serif }
a { color: inherit }
.wrap { max-width: 760px; margin: 0 auto; padding: 0 16px }
header { border-bottom: 1px solid var(--line) }
header .wrap { display: flex; align-items: center; gap: 10px; padding-block: 14px }
.brand { display: flex; align-items: center; gap: 10px; text-decoration: none; font-weight: 800; font-size: 20px; letter-spacing: -0.03em }
.brand svg { width: 30px; height: 30px }
header nav { margin-left: auto; display: flex; gap: 18px; font-size: 14px; font-weight: 600; color: var(--muted) }
header nav a { text-decoration: none } header nav a:hover, header nav a[aria-current] { color: var(--fg) }
main { padding-block: 32px 56px }
h1 { font-size: clamp(28px, 5vw, 38px); line-height: 1.15; letter-spacing: -0.02em; margin: 0 0 6px }
h2 { font-size: 20px; margin: 34px 0 8px; letter-spacing: -0.01em }
h3 { font-size: 17px; margin: 22px 0 6px }
p, li { color: var(--fg) } .muted { color: var(--muted); font-size: 14px }
ul { padding-left: 1.2em }
.karte { background: var(--surf); border-radius: 16px; padding: 18px 20px; margin-top: 14px }
mark { background: var(--mark); color: inherit; padding: 0 3px; border-radius: 4px }
pre { white-space: pre-wrap; font: 13px/1.5 "JetBrains Mono", ui-monospace, monospace; background: var(--surf); padding: 16px; border-radius: 12px; overflow-wrap: anywhere }
footer { border-top: 1px solid var(--line); color: var(--muted); font-size: 14px }
footer .wrap { display: flex; flex-wrap: wrap; gap: 12px 22px; padding-block: 24px 40px }
@media (max-width: 560px) { header nav { gap: 12px; font-size: 13px } }
