/* Themen- und Personenseiten (gebaut von i18n/seo_seiten.py).
   Nur hier eingebunden - chronik.css, recht.css und sprache.css bleiben unberuehrt.
   Leitbild: Schlagzeile. Der Beleg steht gross und im Wortlaut, die Signalfarbe
   markiert nur das Zitat selbst; Datum, Funktion und Fundstelle stehen klein
   darunter. Alles funktioniert ohne JavaScript. */

/* Seit 30.10.2026 auf den Vatersorgen-Design-Standard umgestellt (Abschnitt
   "Standard-Abgleich" am Ende). Signalfarben kommen aus den Standardmarken
   von chronik.css (--krit, --gut); keine eigenen Rot-/Gruentoene mehr. */
:root{
  --rot:var(--krit); --rot-flaeche:color-mix(in srgb,var(--krit) 9%,transparent);
  --rot-mark:color-mix(in srgb,var(--krit) 40%,transparent);
  --gut-flaeche:color-mix(in srgb,var(--gut) 9%,transparent);
  --gut-mark:color-mix(in srgb,var(--gut) 35%,transparent);
  --schlag-font:var(--font-u);
}

/* ---------- Grundgeruest (vorher Inline-Style im Kopf) ---------- */
.recht{padding-bottom:20px}
.recht h2{margin:34px 0 14px;overflow-wrap:break-word;hyphens:auto}
.recht h1{overflow-wrap:break-word;hyphens:auto}
.recht-hero.thema{padding-top:clamp(28px,4vw,52px)}
.recht-hero h1.gross{max-width:20ch;font-size:clamp(36px,5.4vw,74px)}
.recht-hero h1.gross em{display:block}
.recht-hero.thema .lede{margin-top:16px}
/* Ohne Hauptnavigation (schmal) gehoert der Darstellungsschalter an den rechten Rand */
@media (max-width:720px){ header.top #theme{margin-left:auto} }

.akt{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.akt li{padding:16px 18px;border:1px solid var(--line);border-radius:var(--r-s);
  background:var(--surface-1);line-height:1.62}
.akt time{display:block;font-size:12px;font-weight:700;letter-spacing:.06em;color:var(--ink-3);margin-bottom:4px}
/* Breit: Datum als eigene Spalte, der Text laeuft rechts davon */
@media (min-width:860px){
  .abschnitt .akt li{display:grid;grid-template-columns:118px 1fr;column-gap:20px;padding:18px 22px}
  .abschnitt .akt li > *{grid-column:2}
  .abschnitt .akt li > time{grid-column:1;grid-row:1 / span 4;margin:2px 0 0;font-size:13px;color:var(--rot)}
}
.akt blockquote{margin:10px 0 0;padding:2px 0 2px 14px;border-left:3px solid var(--accent);
  color:var(--ink);font-family:var(--font-d);font-size:clamp(16px,1.6vw,18.5px);line-height:1.45}
.akt .az{margin-top:8px;font-size:12px;color:var(--ink-3)}
.akt .az a{color:var(--accent-2)}

.pers{list-style:none;padding:0;display:grid;gap:8px;grid-template-columns:repeat(auto-fill,minmax(min(260px,100%),1fr))}
.pers a{display:block;padding:12px 14px;border:1px solid var(--line);border-radius:var(--r-s);
  text-decoration:none;background:var(--surface-1);color:var(--ink);font-weight:600}
.pers a:hover{border-color:var(--line-2)}
.pers a small{display:block;color:var(--ink-3);font-weight:400}
.pers a.lob{border-color:var(--gut);box-shadow:inset 4px 0 0 var(--gut)}
.pers a.lob small b{color:var(--gut);font-weight:700}

/* ---------- Sprungleiste ---------- */
.sprung{display:flex;flex-wrap:wrap;gap:6px;margin:22px 0 4px;padding:0;list-style:none}
.sprung a{display:inline-block;padding:6px 12px;border-radius:999px;border:1px solid var(--line-2);
  font-size:12.5px;color:var(--ink-2);background:var(--surface-1)}
.sprung a:hover{color:var(--ink);border-color:var(--rot)}

/* ---------- Schlagzeilen-Banner ---------- */
.schlag-kopf{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;margin:46px 0 6px}
.schlag-kopf h2{margin:0}
.schlag-kopf p{color:var(--ink-3);font-size:13.5px;max-width:60ch}
.schlaege{display:grid;gap:18px;margin-top:18px;grid-template-columns:repeat(2,minmax(0,1fr))}
.schlaege > *{grid-column:1 / -1}
.schlaege > .halb{grid-column:auto}
@media (max-width:980px){ .schlaege > .halb{grid-column:1 / -1} }

.schlag{position:relative;overflow:hidden;border-radius:var(--r);
  background:var(--surface-1);border:1px solid var(--line);
  padding:clamp(20px,3.6vw,44px) clamp(18px,4vw,52px) clamp(18px,3vw,30px) clamp(24px,4.4vw,60px)}
.schlag::before{content:"";position:absolute;left:0;top:0;bottom:0;width:clamp(6px,.8vw,10px);background:var(--rot)}
.schlag .nr{position:absolute;right:clamp(10px,2.4vw,28px);top:clamp(2px,.6vw,8px);
  font:900 clamp(56px,11vw,150px)/1 var(--schlag-font);letter-spacing:-.06em;
  color:transparent;-webkit-text-stroke:2px var(--rot-mark);pointer-events:none;user-select:none}
.schlag-marke{display:inline-block;background:var(--rot);color:#fff;
  font:800 11.5px/1 var(--schlag-font);letter-spacing:.14em;text-transform:uppercase;
  padding:7px 10px 6px;border-radius:3px;margin-bottom:clamp(12px,1.6vw,18px)}
.schlag-marke.leise{background:transparent;color:var(--ink-3);box-shadow:inset 0 0 0 1px var(--line-2)}
.schlag-zitat{margin:0;position:relative;font-family:var(--schlag-font);font-weight:900;
  font-size:clamp(29px,5.4vw,70px);line-height:1.04;letter-spacing:-.035em;color:var(--ink);
  max-width:21ch;overflow-wrap:break-word;hyphens:manual}
/* Lange Zitate eine Stufe kleiner, damit sie nicht ueber fuenf Zeilen laufen */
.schlag-zitat.lang-zitat{font-size:clamp(27px,4.3vw,58px);max-width:26ch}
.schlag.halb .schlag-zitat{font-size:clamp(29px,3.7vw,56px)}
.schlag.halb .nr{font-size:clamp(48px,6.4vw,96px);opacity:.8}
.schlag-zitat span{background:linear-gradient(transparent 60%,var(--rot-mark) 60%,var(--rot-mark) 93%,transparent 93%);
  -webkit-box-decoration-break:clone;box-decoration-break:clone;padding:0 .06em}
.schlag-zitat q{quotes:"„" "“"}
.schlag-meta{margin-top:clamp(14px,2vw,22px);display:block;
  font-size:12.5px;color:var(--ink-3);line-height:1.5;max-width:90ch}
.schlag-meta > *{white-space:normal}
.schlag-meta > * + *::before{content:"·";margin:0 9px;color:var(--line-2)}
.schlag-meta time{font-weight:700;color:var(--ink-2);letter-spacing:.04em}
.schlag-meta b{color:var(--ink-2);font-weight:650}
.schlag-fund{margin-top:4px;font-size:12.5px;color:var(--ink-3);line-height:1.5}
.schlag-fund b{color:var(--ink-2);font-weight:650}
.schlag-fund .ungek{display:inline-block;margin-left:10px;padding:1px 7px;border-radius:4px;
  font-size:10.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  color:var(--ink-2);box-shadow:inset 0 0 0 1px var(--line-2)}
.schlag-mehr{display:inline-block;margin-top:14px;font-size:13px;font-weight:600;color:var(--accent-2)}
.schlag-mehr:hover{color:var(--rot)}
.schlag-wortlaut{margin-top:10px;font-size:13.5px;color:var(--ink-2);line-height:1.6;max-width:78ch}
.schlag-wortlaut i{font-family:var(--font-d);font-size:14.5px;color:var(--ink)}
.schlag-wortlaut .lbl{font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  color:var(--ink-3);margin-right:8px}
.schlag-folge{margin-top:12px;padding:10px 12px;border-radius:var(--r-s);background:var(--rot-flaeche);
  font-size:13px;color:var(--ink-2);max-width:78ch}

/* Gegenueberstellung vorher / nachher */
.schlag.gegen .gegen-grid{display:grid;grid-template-columns:1fr auto 1fr;gap:clamp(14px,2.6vw,36px);align-items:start}
.schlag.gegen .schlag-zitat{font-size:clamp(26px,3.7vw,52px);max-width:none}
.schlag.gegen .vorher .schlag-zitat{color:var(--ink-2)}
.schlag.gegen .vorher .schlag-zitat span{background:none}
.gegen-pfeil{align-self:center;font:900 clamp(30px,4vw,56px)/1 var(--schlag-font);color:var(--rot)}
.gegen-dazwischen{margin-top:clamp(16px,2.4vw,26px);padding:12px 14px;border-radius:var(--r-s);
  border:1px dashed var(--rot);background:var(--rot-flaeche);font-size:14px;color:var(--ink);
  font-weight:600;max-width:90ch}
@media (max-width:760px){
  .schlag.gegen .gegen-grid{grid-template-columns:1fr;gap:10px}
  .gegen-pfeil{transform:rotate(90deg);justify-self:start;margin-left:6px}
}

/* ---------- Positiver Beleg (Umgangsbegleiter) ---------- */
.schlag.lob::before{background:var(--gut)}
.schlag.lob .schlag-marke{background:var(--gut)}
.schlag.lob .schlag-zitat span{background:linear-gradient(transparent 60%,var(--gut-mark) 60%,var(--gut-mark) 93%,transparent 93%)}
.schlag.lob .nr{-webkit-text-stroke-color:var(--gut-mark)}
.lob-liste{list-style:none;margin:16px 0 0;padding:0;display:grid;gap:10px;
  grid-template-columns:repeat(auto-fit,minmax(min(320px,100%),1fr))}
.lob-liste li{padding:14px 16px;border-radius:var(--r-s);background:var(--gut-flaeche);
  border:1px solid var(--line)}
.lob-liste blockquote{font-family:var(--font-d);font-size:clamp(16.5px,1.7vw,19px);line-height:1.45;color:var(--ink)}
.lob-liste small{display:block;margin-top:6px;font-size:12px;color:var(--ink-3)}
.erinnerung{margin-top:16px;padding:14px 16px;border-radius:var(--r-s);border:1px dashed var(--line-2);
  font-size:14px;color:var(--ink-2);line-height:1.65}
.erinnerung .lbl{display:inline-block;margin-bottom:6px;font-size:11px;font-weight:700;letter-spacing:.1em;
  text-transform:uppercase;color:var(--gold)}

/* ---------- Abschnitte der Chronik ---------- */
.abschnitt{scroll-margin-top:76px}
.abschnitt > h2{position:relative;padding-top:18px}
.abschnitt > h2::before{content:"";position:absolute;left:0;top:0;width:54px;height:4px;background:var(--rot);border-radius:2px}
.abschnitt .rtext{font-size:15px;max-width:78ch}
.abschnitt .rtext strong{color:var(--ink)}

/* ---------- Meinung ---------- */
.meinung{margin-top:44px;padding:clamp(20px,3.4vw,40px);border-radius:var(--r);
  border:2px dashed var(--gold);background:rgba(232,200,119,.06)}
:root[data-theme="light"] .meinung{background:rgba(154,107,0,.05)}
.meinung-marke{display:inline-block;padding:7px 12px 6px;border-radius:999px;background:var(--gold);
  color:#1a1526;font:800 11.5px/1 var(--schlag-font);letter-spacing:.14em;text-transform:uppercase}
:root[data-theme="light"] .meinung-marke{color:#fff}
.meinung h2{margin:14px 0 14px;font-family:var(--schlag-font);font-weight:900;letter-spacing:-.03em;
  font-size:clamp(32px,5.4vw,66px);line-height:1.02}
.meinung p{font-size:15.5px;color:var(--ink-2);line-height:1.7;max-width:74ch;margin-bottom:12px}
.meinung p.fest{color:var(--ink);font-weight:600}
.meinung h3{margin:20px 0 10px;font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--gold)}
.forderungen{list-style:none;padding:0;margin:0;display:grid;gap:10px;
  grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr))}
.forderungen li{position:relative;padding:14px 16px 14px 46px;border-radius:var(--r-s);background:var(--surface-1);
  border:1px solid var(--line);font-size:14.5px;color:var(--ink);line-height:1.55}
.forderungen li::before{content:"!";position:absolute;left:14px;top:13px;width:22px;height:22px;border-radius:50%;
  display:grid;place-items:center;background:var(--gold);color:#1a1526;font:900 13px/1 var(--schlag-font)}

/* ---------- Querverweis Thema <-> Person ---------- */
.thema-link{display:block;margin-top:26px;padding:16px 18px;border-radius:var(--r-s);
  border:1px solid var(--line-2);background:var(--surface-1);color:var(--ink);text-decoration:none}
.thema-link:hover{border-color:var(--rot)}
.thema-link small{display:block;font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--rot);font-weight:700;margin-bottom:4px}
.thema-link b{font-family:var(--font-d);font-weight:400;font-size:clamp(19px,2vw,24px)}

/* ---------- Lichtblick in der Uebersicht ---------- */
.lichtblick{margin-top:28px;padding:0}

@media (max-width:520px){
  .akt li{padding:14px 14px}
  .schlag-meta{display:block;font-size:12px}
  .schlag-meta > *{display:block}
  .schlag-meta > * + *::before{content:none}
  .schlag-fund .ungek{margin:4px 0 0;display:table}
}
/* ================= Runde 5: gestraffte Themenseite ================= */
:root{ --vater:var(--s1); --vater-flaeche:color-mix(in srgb,var(--s1) 9%,transparent); }

/* Link ins passwortgeschuetzte Archiv */
.dok-a{white-space:normal}
.dok-a .schloss{display:inline-block;vertical-align:-1px;margin-right:4px}

/* Aufmacher: der Gespraechswunsch-Banner allein oben */
.aufmacher-wrap{margin-top:30px}
.schlag.aufmacher{border-color:var(--rot-mark)}
.aufmacher-titel{margin:0 0 clamp(14px,2vw,22px) !important;font-family:var(--schlag-font);font-weight:900;
  font-size:clamp(22px,3vw,36px);line-height:1.1;letter-spacing:-.02em;color:var(--ink);max-width:30ch}

/* ---------- Faktenleiste "Die Peaks" ---------- */
.leiste{margin-top:46px;scroll-margin-top:76px}
.leiste-kopf{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;margin-bottom:18px}
.leiste-kopf h2{margin:0 !important;font-family:var(--schlag-font);font-weight:900;letter-spacing:-.03em;
  font-size:clamp(30px,4.6vw,56px);line-height:1}
.leiste-kopf p{color:var(--ink-3);font-size:13.5px;max-width:60ch}
.peaks{list-style:none;margin:0;padding:0}
.peak{--farbe:var(--rot);display:grid;grid-template-columns:clamp(74px,13vw,170px) 22px minmax(0,1fr);
  column-gap:clamp(8px,1.4vw,16px);align-items:stretch}
.peak-vater{--farbe:var(--vater)}
.peak-gericht{--farbe:var(--ink-3)}
.peak-stille{--farbe:var(--line-2)}
.peak-kind{--farbe:var(--rot)}
.peak-einsicht{--farbe:var(--gold)}
.peak-zeit{text-align:right;padding-top:10px;min-width:0}
.peak-jahr{display:block;font:900 clamp(22px,3.4vw,44px)/1 var(--schlag-font);letter-spacing:-.04em;color:var(--ink);
  overflow-wrap:anywhere}
.peak-zeit time,.peak-zeitraum{display:block;margin-top:5px;font-size:12px;font-weight:700;letter-spacing:.04em;color:var(--ink-3)}
.peak-schiene{position:relative}
.peak-schiene::before{content:"";position:absolute;left:50%;top:0;bottom:0;width:2px;margin-left:-1px;background:var(--line-2)}
.peak:first-child .peak-schiene::before{top:16px}
.peak:last-child .peak-schiene::before{bottom:calc(100% - 22px)}
.peak-schiene::after{content:"";position:absolute;left:50%;top:14px;width:16px;height:16px;margin-left:-8px;border-radius:50%;
  background:var(--farbe);box-shadow:0 0 0 4px var(--plane)}
.peak-stille .peak-schiene::before{background:none;border-left:2px dashed var(--ink-3);width:0}
.peak-stille .peak-schiene::after{background:var(--plane);border:2px dashed var(--ink-3);width:12px;height:12px;margin-left:-8px}
.peak-luecke{--farbe:var(--ink-3)}
.peak-luecke .peak-schiene::after{background:var(--plane);border:3px solid var(--ink-3);width:10px;height:10px;margin-left:-8px}
.peak-luecke .peak-marke{color:var(--ink-3)}
.peak-einsicht .peak-schiene::after{width:22px;height:22px;margin-left:-11px;top:11px;box-shadow:0 0 0 4px var(--plane),0 0 18px var(--gold)}
.peak-inhalt{min-width:0;margin:0 0 12px;padding:11px 16px 12px;border:1px solid var(--line);border-left:4px solid var(--farbe);
  border-radius:0 var(--r-s) var(--r-s) 0;background:var(--surface-1)}
.peak-inhalt p{margin:0;font-size:15.5px;line-height:1.5;color:var(--ink);font-weight:600}
.peak-marke{display:inline-block;margin-bottom:5px;font:800 10.5px/1 var(--schlag-font);letter-spacing:.14em;
  text-transform:uppercase;color:var(--farbe)}
.peak-gericht .peak-marke,.peak-stille .peak-marke{color:var(--ink-3)}
.peak-inhalt blockquote{margin:7px 0 0;padding:0 0 0 12px;border-left:2px solid var(--farbe);
  font-family:var(--font-d);font-size:clamp(15.5px,1.6vw,18px);line-height:1.4;color:var(--ink-2)}
.peak-beleg{margin-top:6px;font-size:12px;color:var(--ink-3);line-height:1.5}
.peak-beleg a{color:var(--accent-2)}
.peak-vater .peak-inhalt{background:var(--vater-flaeche)}
.peak-stille .peak-inhalt{background:transparent;border-style:dashed;border-left-style:dashed}
.peak-stille .peak-inhalt p{font-weight:500;font-style:italic;color:var(--ink-2)}
.peak-kind .peak-inhalt{background:var(--rot-flaeche)}
.peak-amt .peak-inhalt blockquote{color:var(--ink);font-weight:600}
.peak-einsicht .peak-inhalt{background:rgba(232,200,119,.10);border-color:var(--gold)}
:root[data-theme="light"] .peak-einsicht .peak-inhalt{background:rgba(154,107,0,.07)}
.peak-einsicht .peak-inhalt p{font-size:17px}

/* ---------- ERSTE Akteneinsicht ---------- */
.erste{margin-top:40px;scroll-margin-top:76px;position:relative;overflow:hidden;border-radius:var(--r);
  border:2px solid var(--gold);background:rgba(232,200,119,.07);
  display:grid;grid-template-columns:auto minmax(0,1fr);gap:clamp(18px,3.6vw,48px);
  padding:clamp(20px,3.6vw,46px)}
:root[data-theme="light"] .erste{background:rgba(154,107,0,.05)}
.erste-zahl{display:flex;flex-direction:column;align-items:center;text-align:center;min-width:0}
.erste-n{font:900 clamp(120px,19vw,250px)/.82 var(--schlag-font);letter-spacing:-.06em;color:var(--gold)}
.erste-e{margin-top:6px;font:900 clamp(20px,2.6vw,34px)/1 var(--schlag-font);letter-spacing:.06em;
  text-transform:uppercase;color:var(--gold)}
.erste-zahl small{display:block;margin-top:10px;max-width:22ch;font-size:12px;line-height:1.4;color:var(--ink-3)}
.erste-marke{display:inline-block;padding:7px 12px 6px;border-radius:999px;background:var(--gold);color:#1a1526;
  font:800 11.5px/1 var(--schlag-font);letter-spacing:.14em;text-transform:uppercase}
:root[data-theme="light"] .erste-marke{color:#fff}
.erste h2{margin:14px 0 16px !important;font-family:var(--schlag-font);font-weight:900;letter-spacing:-.03em;
  font-size:clamp(28px,4.4vw,56px);line-height:1.04}
.erste-wort{text-transform:uppercase;color:var(--gold);
  background:linear-gradient(transparent 62%,rgba(232,200,119,.30) 62%,rgba(232,200,119,.30) 94%,transparent 94%)}
.erste-daten{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.erste-daten li{display:grid;grid-template-columns:92px minmax(0,1fr);gap:12px;font-size:14px;line-height:1.5;color:var(--ink-2)}
.erste-daten time{font-weight:800;color:var(--ink);letter-spacing:.03em}
.erste-daten li:last-child{color:var(--ink);font-weight:700}
.erste-daten .dok-a{font-size:12px;font-weight:400;color:var(--accent-2);margin-left:4px}
.erste-einordnung{margin-top:18px;padding:14px 16px;border-radius:var(--r-s);border:2px dashed var(--gold);background:var(--surface-1)}
.erste-einordnung .lbl{display:inline-block;margin-bottom:6px;font-size:11px;font-weight:800;letter-spacing:.12em;
  text-transform:uppercase;color:var(--gold)}
.erste-einordnung p{margin:0;font-size:15.5px;line-height:1.6;color:var(--ink)}
.erste-hinweis{margin-top:10px;font-size:12.5px;color:var(--ink-3);line-height:1.5;max-width:80ch}
@media (max-width:760px){
  .erste{grid-template-columns:1fr}
  .erste-zahl{flex-direction:row;align-items:baseline;justify-content:flex-start;flex-wrap:wrap;gap:10px;text-align:left}
  .erste-n{font-size:108px}
  .erste-zahl small{flex-basis:100%;max-width:none;margin-top:0}
  .erste-daten li{grid-template-columns:1fr;gap:0}
}

/* ---------- Vergleich in zwei Zeilen ---------- */
.vergleich-kurz{margin-top:30px;padding:14px 18px;border-radius:var(--r-s);border:1px solid var(--line);
  border-left:5px solid var(--gut);background:var(--gut-flaeche);scroll-margin-top:76px}
.vergleich-kurz h2{margin:0 0 4px !important;font-size:11.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--gut)}
.vergleich-kurz p{margin:0;font-size:15px;line-height:1.55;color:var(--ink-2)}
.vergleich-kurz q{quotes:none;font-family:var(--font-d);font-size:17px;color:var(--ink);font-weight:600}
.vergleich-kurz .az{margin-top:6px;font-size:12px;color:var(--ink-3)}
.vergleich-kurz .az a{color:var(--accent-2)}

@media (max-width:520px){
  .peak{grid-template-columns:62px 16px minmax(0,1fr);column-gap:8px}
  .peak-jahr{font-size:20px}
  .peak-zeit time,.peak-zeitraum{font-size:10.5px;letter-spacing:0}
  .peak-inhalt{padding:9px 11px 10px}
  .peak-inhalt p{font-size:14.5px}
  .peak-schiene::after{width:12px;height:12px;margin-left:-6px}
  .peak-einsicht .peak-schiene::after{width:16px;height:16px;margin-left:-8px}
}
@media print{
  .schlag,.meinung,.erste,.peak{break-inside:avoid}
  .schlag .nr{display:none}
}

/* ======================= Standard-Abgleich 30.10.2026 =======================
   Vatersorgen-Design-Standard (server/app/admin/dash/dashboard.css): Karten
   eine Ebene mit Rand --linie und --schatten, Vorzeilen schlicht (13 px,
   Versalien, --tinte-3, ohne Plakette), Serif nur fuer Ueberschriften und
   woertliche Zitate, Zahlen in der Grundschrift, Gold nur fuer <em>. Die
   Schlagzeilen-Optik (Schwarzschrift 900, Textmarker, Konturziffern, rote und
   gruene Plaketten) ist damit abgeloest; Aufbau und Markup bleiben gleich.
   Vorher-Stand: themen.css.vor-design-2026-10-30. */

/* Belegte Handlungen, Personenkacheln, Sprungleiste */
.akt li{border-radius:var(--r-k);background:var(--karte);border-color:var(--linie);box-shadow:var(--schatten)}
.akt time{font-weight:600;letter-spacing:.04em}
@media (min-width:860px){ .abschnitt .akt li > time{color:var(--tinte-3)} }
.pers a{border-radius:var(--r-k);background:var(--karte);border-color:var(--linie);box-shadow:var(--schatten);
  transition:transform .18s ease,border-color .18s ease}
.pers a:hover{border-color:var(--linie-2);color:var(--tinte);transform:translateY(-2px)}
.pers a.lob{border-color:var(--linie);box-shadow:var(--schatten)}
.pers a.lob small b{color:var(--akzent-2);font-weight:600}
.sprung a{padding:5px 11px;border-color:var(--linie-2);font-weight:550;color:var(--tinte-2);background:transparent}
.sprung a:hover{color:var(--tinte);border-color:var(--linie-2);background:var(--linie)}

/* Zitatkarte (vorher Schlagzeilen-Banner): Karte, Akzentlinie links, Serif-Zitat */
.schlag{border-radius:var(--r);background:var(--karte);border:1px solid var(--linie);box-shadow:var(--schatten);
  padding:clamp(20px,3vw,34px) clamp(20px,3.4vw,40px) clamp(18px,2.6vw,28px) clamp(22px,3.6vw,44px)}
.schlag::before{width:3px;background:var(--akzent)}
.schlag.lob::before{background:var(--akzent)}
.schlag.aufmacher{border-color:var(--linie)}
.schlag .nr,.schlag.halb .nr{font:600 clamp(28px,3.2vw,40px)/1 var(--font-u);letter-spacing:-.025em;
  color:var(--linie-2);-webkit-text-stroke:0;opacity:1;top:clamp(14px,2vw,22px);right:clamp(16px,2.4vw,28px)}
.schlag-marke,.schlag-marke.leise,.schlag.lob .schlag-marke{display:block;background:none;box-shadow:none;
  padding:0;border-radius:0;color:var(--tinte-3);font:600 13px/1.4 var(--font-u);letter-spacing:.07em;
  text-transform:uppercase;margin-bottom:14px}
.schlag-zitat{font-family:var(--font-d);font-weight:400;font-size:clamp(24px,3.2vw,38px);line-height:1.22;
  letter-spacing:-.015em;color:var(--tinte);max-width:30ch}
.schlag-zitat.lang-zitat{font-size:clamp(21px,2.6vw,31px);max-width:40ch}
.schlag.halb .schlag-zitat{font-size:clamp(22px,2.4vw,30px)}
.schlag.gegen .schlag-zitat{font-size:clamp(21px,2.4vw,30px)}
.schlag-zitat span,.schlag.lob .schlag-zitat span{background:none;padding:0}
.schlag-meta time{font-weight:600}
.schlag-fund .ungek{box-shadow:none;background:var(--linie);color:var(--tinte-2);border-radius:999px;
  font-weight:600;letter-spacing:.06em;padding:2px 8px}
.schlag-mehr:hover{color:var(--gold)}
.schlag-wortlaut .lbl{font-weight:600;letter-spacing:.07em}
.schlag-folge{background:var(--karte-2);border:1px solid var(--linie);border-radius:12px;color:var(--tinte-2)}
.gegen-pfeil{font:600 clamp(24px,3vw,36px)/1 var(--font-u);color:var(--tinte-3)}
.gegen-dazwischen{border:1px solid var(--linie);border-radius:12px;background:var(--karte-2);
  color:var(--tinte);font-weight:600}
.aufmacher-titel{font-family:var(--font-d);font-weight:400;font-size:clamp(22px,2.6vw,30px);
  line-height:1.2;letter-spacing:-.015em}
.lob-liste li{background:var(--karte-2);border-radius:12px}
.erinnerung{border:1px solid var(--linie);border-radius:12px;background:var(--karte-2)}
.erinnerung .lbl{font-size:12px;font-weight:600;letter-spacing:.07em;color:var(--tinte-3)}
.thema-link{border-radius:var(--r);border-color:var(--linie);background:var(--karte);box-shadow:var(--schatten)}
.thema-link:hover{border-color:var(--linie-2)}
.thema-link small{font-size:13px;letter-spacing:.07em;color:var(--tinte-3);font-weight:600}
.abschnitt > h2{padding-top:0}
.abschnitt > h2::before{content:none}
.schlag-kopf h2,.leiste-kopf h2{font-family:var(--font-d);font-weight:400;letter-spacing:-.018em;
  font-size:clamp(28px,3.4vw,42px);line-height:1.08}

/* Faktenleiste */
.peak-einsicht{--farbe:var(--akzent-2)}
.peak-jahr{font:600 clamp(20px,2.4vw,30px)/1.08 var(--font-u);letter-spacing:-.025em}
.peak-zeit time,.peak-zeitraum{font-weight:600}
.peak-inhalt,.peak-vater .peak-inhalt,.peak-kind .peak-inhalt,.peak-einsicht .peak-inhalt,
:root[data-theme="light"] .peak-einsicht .peak-inhalt{background:var(--karte);border-color:var(--linie);
  border-left:3px solid var(--farbe);border-radius:0 var(--r-k) var(--r-k) 0;box-shadow:var(--schatten)}
.peak-stille .peak-inhalt{background:transparent;box-shadow:none}
.peak-marke{font:600 12px/1.3 var(--font-u);letter-spacing:.07em}
.peak-einsicht .peak-schiene::after{box-shadow:0 0 0 4px var(--plane),0 0 12px var(--akzent-2)}
.peak-einsicht .peak-inhalt p{font-size:16px}

/* Erste Akteneinsicht: Karte, Zahl in der Grundschrift */
.erste,:root[data-theme="light"] .erste{border:1px solid var(--linie);background:var(--karte);box-shadow:var(--schatten)}
.erste-n{font:600 clamp(80px,11vw,140px)/.9 var(--font-u);letter-spacing:-.05em;color:var(--tinte)}
.erste-e{font:600 clamp(15px,1.6vw,18px)/1.2 var(--font-u);letter-spacing:.07em;color:var(--tinte-2)}
.erste-marke,:root[data-theme="light"] .erste-marke{display:block;background:none;padding:0;border-radius:0;
  color:var(--tinte-3);font:600 13px/1.4 var(--font-u);letter-spacing:.07em;text-transform:uppercase}
.erste h2{font-family:var(--font-d);font-weight:400;letter-spacing:-.018em;font-size:clamp(28px,3.4vw,42px);line-height:1.08}
.erste-wort{text-transform:none;color:inherit;background:none}
.erste-daten time{font-weight:650}
.erste-einordnung{border:1px solid var(--linie);border-radius:var(--r-k);background:var(--karte-2)}
.erste-einordnung .lbl{font-size:12px;font-weight:600;letter-spacing:.07em;color:var(--tinte-3)}
@media (max-width:760px){ .erste-n{font-size:84px} }

/* Vergleich */
.vergleich-kurz{position:relative;overflow:hidden;border:1px solid var(--linie);border-radius:var(--r-k);
  background:var(--karte);box-shadow:var(--schatten);padding:16px 18px 16px 21px}
.vergleich-kurz::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--akzent)}
.vergleich-kurz h2{font-family:var(--font-u);font-size:13px;font-weight:600;letter-spacing:.07em;color:var(--tinte-3)}
.vergleich-kurz q{font-weight:400}

/* Meinung des Vaters: gekennzeichnet durch Vorzeile und Akzentlinie, nicht durch Gold */
.meinung,:root[data-theme="light"] .meinung{position:relative;overflow:hidden;border:1px solid var(--linie);
  background:var(--karte);box-shadow:var(--schatten)}
.meinung::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--akzent)}
.meinung-marke,:root[data-theme="light"] .meinung-marke{display:block;background:none;padding:0;border-radius:0;
  color:var(--tinte-3);font:600 13px/1.4 var(--font-u);letter-spacing:.07em;text-transform:uppercase}
.meinung h2{font-family:var(--font-d);font-weight:400;letter-spacing:-.018em;font-size:clamp(28px,3.4vw,42px);line-height:1.08}
.meinung h3{font-size:13px;font-weight:600;letter-spacing:.07em;color:var(--tinte-3)}
.forderungen li{background:var(--karte-2);border-radius:12px}
.forderungen li::before{background:var(--akzent);color:#fff;font:700 13px/1 var(--font-u)}
.recht-hero h1.gross{font-size:clamp(34px,5.2vw,58px)}
.peak-amt .peak-inhalt blockquote{font-weight:400}
