/* Reduziertes Stylesheet für Impressum und Datenschutz.
   Nutzt dieselben Farb- und Schrift-Tokens wie die Startseite. */

:root{
  --paper:#f7f0e4;
  --paper-deep:#ece0cb;
  --surface:#fffbf3;
  --ink:#241812;
  --ink-soft:#655244;
  --ink-faint:#8f7c6a;
  --accent:#a3223f;
  --accent-ink:#fff8ee;
  --line:rgba(36,24,18,0.14);
  --line-strong:rgba(36,24,18,0.26);
  --inv-bg:#241812;
  --inv-fg:#f7f0e4;
  --inv-fg-soft:rgba(247,240,228,0.78);
  --inv-line:rgba(255,255,255,0.16);
  --f-d:'Bricolage Grotesque','Segoe UI',sans-serif;
  --f-b:'Figtree',system-ui,-apple-system,'Segoe UI',sans-serif;
  --r:18px;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --paper:#191110;
    --paper-deep:#221715;
    --surface:#241a17;
    --ink:#f7ecdd;
    --ink-soft:#c5b0a0;
    --ink-faint:#8d7869;
    --accent:#e5637c;
    --accent-ink:#191110;
    --line:rgba(247,236,221,0.14);
    --line-strong:rgba(247,236,221,0.26);
    --inv-bg:#0e0908;
    --inv-fg:#f7ecdd;
    --inv-fg-soft:rgba(247,236,221,0.78);
    --inv-line:rgba(255,255,255,0.13);
  }
}

*{box-sizing:border-box;}
body{
  margin:0; background:var(--paper); color:var(--ink);
  font-family:var(--f-b); font-size:16.5px; line-height:1.7;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3{ font-family:var(--f-d); font-weight:800; margin:0; line-height:1.12; letter-spacing:-0.015em; }
p,ul,ol{ margin:0 0 1.05em; }
ul,ol{ padding-left:1.3em; }
li{ margin-bottom:0.35em; }
a{ color:var(--accent); text-underline-offset:3px; }
strong{ font-weight:700; }

.wrap{ max-width:820px; margin:0 auto; padding-inline:clamp(20px,5vw,40px); }

/* Kopf ------------------------------------------------------------------- */
.nav{ background:var(--inv-bg); color:var(--inv-fg); padding-block:20px; }
.nav .wrap{ max-width:1180px; display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap; }
.logo{ display:inline-flex; align-items:center; gap:11px; color:inherit; text-decoration:none;
  font-family:var(--f-d); font-weight:800; letter-spacing:0.06em; font-size:1rem; }
.logo svg{ width:26px; height:26px; flex:none; }
.logo small{ display:block; font-family:var(--f-b); font-weight:500; font-size:0.72rem;
  letter-spacing:0.02em; color:var(--inv-fg-soft); }
.back{ color:var(--inv-fg-soft); text-decoration:none; font-weight:600; font-size:0.92rem;
  border:1px solid var(--inv-line); border-radius:999px; padding:0.6em 1.2em; }
.back:hover{ background:var(--inv-fg); color:var(--inv-bg); border-color:var(--inv-fg); }

/* Inhalt ----------------------------------------------------------------- */
main{ padding-block:clamp(48px,7vw,84px); }
.eyebrow{ display:block; font-size:0.78rem; font-weight:800; letter-spacing:0.16em;
  text-transform:uppercase; color:var(--accent); margin-bottom:14px; }
h1{ font-size:clamp(2rem,5vw,2.9rem); margin-bottom:0.7em; }
h2{ font-size:clamp(1.25rem,2.6vw,1.55rem); margin:2.4em 0 0.7em; padding-top:1.6em;
  border-top:1px solid var(--line); }
h2:first-of-type{ border-top:0; padding-top:0; margin-top:1.6em; }
h3{ font-size:1.03rem; font-weight:700; margin:1.7em 0 0.5em; }
.lede{ font-size:1.08rem; color:var(--ink-soft); margin-bottom:2em; }

/* Hinweis-Kasten für auszufüllende Stellen ------------------------------- */
.todo{ background:var(--surface); border:1px dashed var(--line-strong); border-left:4px solid var(--accent);
  border-radius:var(--r); padding:18px 22px; margin:1.6em 0; font-size:0.95rem; color:var(--ink-soft); }
.todo b{ color:var(--ink); }
mark{ background:rgba(163,34,63,0.14); color:inherit; padding:0.1em 0.35em;
  border-radius:5px; font-weight:600; }
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]) mark{ background:rgba(229,99,124,0.2); }
}

/* Definitionsliste ------------------------------------------------------- */
dl.data{ margin:0 0 1.6em; }
dl.data > div{ display:grid; grid-template-columns:190px 1fr; gap:10px 24px;
  padding:14px 0; border-bottom:1px solid var(--line); }
dl.data dt{ font-weight:700; color:var(--ink-faint); font-size:0.86rem;
  letter-spacing:0.06em; text-transform:uppercase; }
dl.data dd{ margin:0; }
@media (max-width:620px){ dl.data > div{ grid-template-columns:1fr; gap:4px; } }

/* Fuß -------------------------------------------------------------------- */
footer{ background:var(--inv-bg); color:var(--inv-fg-soft); padding-block:34px; font-size:0.9rem; }
footer .wrap{ max-width:1180px; display:flex; gap:16px 28px; flex-wrap:wrap; justify-content:space-between; }
footer a{ color:var(--inv-fg); text-decoration:none; }
footer a:hover{ text-decoration:underline; }
footer ul{ display:flex; gap:20px; list-style:none; margin:0; padding:0; flex-wrap:wrap; }