/* ============================================================================
   bavaria-v2.css · Substrat des Bavaria-Design-Systems v2
   Fassung 2.3 · 27.08.2026
   ============================================================================
   Aufbau dieser Datei, in dieser Reihenfolge:
     1 Tokens        Skalen und Farben, auf .bv2 gebunden
     2 Preflight     Schutzschicht gegen Theme und Bestand
     3 Full-Bleed    Gegenregel zu Astras Blocklayout
     4 Haertung      benannte Kollisionen
     5 Organe        die Inhaltsformen
     6 Responsiv

   Alles ist auf .bv2 gescoped. Diese Datei veraendert keine einzige Flaeche
   ausserhalb von .bv2 und ist damit neben dem Bestand betreibbar.
   ========================================================================== */

/* ============================================================================
   bavaria-v2.css · Substrat des Bavaria-Design-Systems v2
   ============================================================================
   Greenfield, 19.08.2026. Ersetzt bei Freigabe das gewachsene Stylesheet.

   PRINZIP
   Eine Typo-Skala, zwei Schriftfamilien, vier Tonflaechen, eine Abstands-
   skala. Organe (Inhaltsformen) mal Layout mal Ton ergeben die Sektionen.
   Kein Organ definiert eigene Schriftgroessen oder Farben, alles kommt aus
   den Tokens. Wer einen Wert braucht, der hier fehlt, ergaenzt die Skala,
   nie das Organ.

   REGELN AUS DER DESIGNSPRACHE
   R1 erst weglassen, dann abschwaechen, erst dann rahmen
   R2 Kontrast nach Funktion staffeln, nicht nach Verfuegbarkeit
   R4 Farbe ist Betonung: Periwinkle markiert genau eine Sache je Element
   R5 Bewegung nur als Antwort, unter 250ms, ease
   ========================================================================== */

.bv2{
  /* Schrift: zwei Familien, mehr gibt es nicht */
  --serif: Charter, "Iowan Old Style", "Palatino Linotype", Georgia, serif;
  --mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;

  /* Die Typo-Skala. Zehn Stufen, jede mit festem Job. */
  --t-nano: 11px;    /* Mono-Mikro: Quellen, Stempel. Gleiche Groesse wie label, leiser Ton. */
  --t-label: 12px;   /* Mono-Label: Eyebrows, Knoepfe, Tabellenkoepfe */
  --t-meta: 15px;    /* Karten-Fliesstext, Tabellenzellen */
  --t-body: 17.5px;  /* Fliesstext */
  --t-lead: clamp(19px, 1vw + 15px, 21px);
  --t-h3: clamp(21px, 1.2vw + 16px, 26px);
  --t-h2: clamp(31px, 2.4vw + 20px, 46px);
  --t-h1: clamp(40px, 3.6vw + 24px, 66px);
  --t-zahl: clamp(48px, 4vw + 28px, 78px);
  --t-display: clamp(58px, 5.5vw + 30px, 104px);

  /* Farbe: Tinte auf Papier, Creme auf Nacht, Periwinkle als Stimme */
  --ink: #0B1426;
  --ink-soft: #3A4157;
  --ink-mute: #666F82;           /* AA auf paper und soft */
  --line: #E4E7F0;
  --line-strong: #C7CCDC;
  --paper: #FFFFFF;
  --soft: #F6F7FB;
  --wash: #EEF0FA;
  --navy: #0B1426;
  --navy-hell: #131F3A;
  --peri: #5B6ABF;
  --peri-tief: #47549E;          /* Textsicher auf wash */
  --peri-hell: #8E9ADF;          /* Akzent auf dunkel */
  --peri-line: #D6DAF2;
  --cream: #F5F1E8;
  --auf-dunkel: rgba(245,241,232,.88);
  --auf-dunkel-meta: rgba(245,241,232,.55);
  --auf-dunkel-linie: rgba(245,241,232,.16);
  --auf-dunkel-zier: rgba(245,241,232,.30);

  /* Abstand: die einzige Skala */
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:24px;
  --s6:32px; --s7:48px; --s8:64px; --s9:96px; --s10:128px;
  --bahn-y: clamp(72px, 9vw, 124px);

  /* Masse */
  --breite: 1200px;
  --breite-breit: 1360px;
  --mass: 64ch;
  --radius: 8px;
  --radius-s: 5px;
  --pille: 999px;
  --schnell: 180ms ease;
}

/* ============================================================================
   PREFLIGHT · die Schutzschicht
   ============================================================================
   Warum das hier steht: Astra setzt 70 Element-Selektoren (h1 bis h6, a, p,
   table, td, th, ul, ol, em, img) und faerbt Ueberschriften ueber den
   Customizer hart. Das Substrat erbt Farbe und Schrift bewusst vom Ton der
   Bahn. Ohne Preflight gewinnt in jeder Vererbungsluecke das Theme, und auf
   dunklen Bahnen steht Navy auf Navy.

   Gemessen am 20.08.2026: 340 Paare aus Elementtyp und Eigenschaft, die
   heute nur das Theme bestimmt. Diese Schicht schliesst sie.
   Regel: Innerhalb von .bv2 entscheidet ausschliesslich dieses Stylesheet.
   ========================================================================== */

.bv2{box-sizing:border-box;background:var(--paper)}
.bv2 *,.bv2 *::before,.bv2 *::after{box-sizing:border-box}

/* Struktur: alles auf null, Schrift und Farbe erben */
.bv2 h1,
.bv2 h2,
.bv2 h3,
.bv2 h4,
.bv2 h5,
.bv2 h6,
.bv2 p,
.bv2 ul,
.bv2 ol,
.bv2 li,
.bv2 dl,
.bv2 dt,
.bv2 dd,
.bv2 table,
.bv2 thead,
.bv2 tbody,
.bv2 tfoot,
.bv2 tr,
.bv2 th,
.bv2 td,
.bv2 figure,
.bv2 figcaption,
.bv2 blockquote,
.bv2 section,
.bv2 article,
.bv2 aside,
.bv2 nav,
.bv2 header,
.bv2 footer,
.bv2 div,
.bv2 span,
.bv2 label,
.bv2 fieldset,
.bv2 legend,
.bv2 hr,
.bv2 address{
  margin:0;padding:0;border:0;outline:0;
  font:inherit;color:inherit;background:transparent;
  text-align:inherit;vertical-align:baseline;clear:none}

/* Listen tragen im Substrat nie Systempunkte */
.bv2 ul,.bv2 ol{list-style:none}

/* Betonung behaelt ihre Bedeutung, verliert nur die Theme-Abstaende */
.bv2 em,.bv2 i,.bv2 cite,.bv2 dfn{margin:0;padding:0;border:0;
  font:inherit;font-style:italic;color:inherit}
.bv2 strong,.bv2 b{margin:0;padding:0;border:0;
  font:inherit;font-weight:700;color:inherit}
.bv2 small{font-size:.85em}

/* Links: Farbe und Unterstreichung gehoeren dem Substrat, nicht dem Theme */
.bv2 a{color:inherit;text-decoration:none;background:transparent;
  border:0;outline:0}

/* Tabellen: Astra rahmt allseitig und haengt 1.5em Abstand an */
.bv2 table{border-collapse:separate;border-spacing:0;margin:0;
  border:0;width:auto}
.bv2 th,.bv2 td{border:0;padding:0;text-align:left;vertical-align:top;
  font:inherit;color:inherit}
.bv2 th{font-weight:inherit}

/* Medien */
.bv2 img,.bv2 svg,.bv2 video,.bv2 picture{display:block;max-width:100%;
  height:auto;border:0}
.bv2 svg{height:auto}

/* Bedienelemente */
.bv2 button,.bv2 input,.bv2 select,.bv2 textarea{font:inherit;color:inherit;
  margin:0;background:transparent;border:0}
.bv2 button{cursor:pointer}

/* ============================================================================
   FULL-BLEED-SCHUTZ
   ============================================================================
   Sobald der Seiteninhalt Blockmarkup traegt (und das muss er, sonst zerlegt
   wpautop jedes Inline-SVG), setzt Astra
   .entry-content[data-ast-blocks-layout] > * > * auf 1200px und zentriert.
   Das kappt jede Bahn. Hier zurueckgenommen, eine Klasse hoeher.
   ========================================================================== */
.ast-page-builder-template .entry-content[data-ast-blocks-layout] > .bv2,
.ast-page-builder-template .entry-content[data-ast-blocks-layout] > .bv2 > *,
.entry-content[data-ast-blocks-layout] > .bv2,
.entry-content[data-ast-blocks-layout] > .bv2 > *{max-width:none;
  margin-left:0;margin-right:0}

/* ============================================================================
   HAERTUNG gegen benannte Theme-Vorgaben
   ========================================================================== */
/* Astra faerbt h1 bis h6 ueber den Customizer. Farbe kommt vom Ton der Bahn. */
.bv2 h1,.bv2 h2,.bv2 h3,.bv2 h4,.bv2 h5,.bv2 h6{color:inherit}
/* wp-custom-css definiert .eyebrow, .hero-lead und .hero-meta ebenfalls.
   Drei Namenskollisionen, gemessen ueber 668 Bestandsklassen. */
.bv2 .hero-lead,.bv2 .lead,.bv2 .prosa p,.bv2 .antwort-folge p{font-style:normal}
.bv2 .antwort-satz em,.bv2 .kopf h2 em,.bv2 .kopf h1 em,.bv2 .o-hero h1 em,
.bv2 .faq-frage h3 em,.bv2 .o-cta h2 em{font-style:italic}



/* ====== Basis ====== */
.bv2 *{box-sizing:border-box}
.bv2{margin:0;background:var(--paper);color:var(--ink);
  font:400 var(--t-body)/1.68 var(--serif);
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
.bv2 h1,.bv2 h2,.bv2 h3,.bv2 h4{font-weight:400;margin:0;font-family:var(--serif);letter-spacing:-.02em}
.bv2 p{margin:0}
.bv2 a{color:inherit}
.bv2 img,.bv2 svg{display:block;max-width:100%}
.bv2 ::selection{background:var(--peri-line);color:var(--ink)}

/* ====== Toene: die vier Flaechen ====== */
.bv2 .bahn{padding-block:var(--bahn-y)}
/* Auf getoenten Flaechen sinkt der Kontrast: mute einen Schritt dunkler,
   Eyebrow auf die tiefe Peri-Stufe. Haelt AA per Konstruktion. */
.bv2 .bahn--soft{background:var(--soft);--ink-mute:#5E677B}
.bv2 .bahn--wash{background:var(--wash);--ink-mute:#59627A}
.bv2 .bahn--soft .eyebrow,.bv2 .bahn--wash .eyebrow{color:var(--peri-tief)}
.bv2 .bahn--dunkel{background:var(--navy);color:var(--auf-dunkel)}
.bv2 .ton-dunkel ::selection{background:var(--peri);color:var(--cream)}

/* ====== Container ====== */
.bv2 .inhalt{max-width:var(--breite);margin-inline:auto;
  padding-inline:clamp(20px,4vw,48px)}
.bv2 .inhalt--breit{max-width:var(--breite-breit)}
.bv2 .mass{max-width:var(--mass)}

/* ====== Eyebrow: die Mono-Stimme ====== */
.bv2 .eyebrow{display:inline-flex;align-items:center;gap:12px;margin:0;
  font:400 var(--t-label)/1.2 var(--mono);
  letter-spacing:.12em;text-transform:uppercase;color:var(--peri)}
.bv2 .eyebrow::before{content:"";width:22px;height:1px;background:currentColor;
  opacity:.65;flex:none}
.bv2 .ton-dunkel .eyebrow{color:var(--peri-hell)}
.bv2 .eyebrow--mitte{justify-content:center}
.bv2 .eyebrow--mitte::after{content:"";width:22px;height:1px;
  background:currentColor;opacity:.65;flex:none}

/* ====== Sektionskopf: immer gestapelt, nie halbleere Spalten ====== */
.bv2 .kopf{max-width:840px;margin:0 0 clamp(40px,5.5vw,72px)}
.bv2 .kopf h2{font-size:var(--t-h2);line-height:1.1;letter-spacing:-.018em;
  margin-top:var(--s4)}
.bv2 .kopf h2 em,.bv2 .kopf h1 em{font-style:italic;color:var(--peri)}
.bv2 .ton-dunkel .kopf h2 em{color:var(--peri-hell)}
.bv2 .kopf .lead{margin-top:var(--s5);font-size:var(--t-lead);line-height:1.55;
  color:var(--ink-soft);max-width:58ch}
.bv2 .ton-dunkel .kopf .lead{color:var(--auf-dunkel-meta)}
.bv2 .kopf--mitte{margin-inline:auto;text-align:center}
.bv2 .kopf--mitte .lead{margin-inline:auto}

/* ====== Fliesstext-Organe ====== */
.bv2 .prosa{max-width:var(--mass);font-size:var(--t-body);color:var(--ink-soft)}
.bv2 .prosa p + p{margin-top:var(--s5)}
.bv2 .prosa strong{font-weight:700}
.bv2 .ton-dunkel .prosa{color:var(--auf-dunkel)}

/* ====== Knoepfe ====== */
.bv2 .knopf{display:inline-flex;align-items:center;justify-content:center;
  gap:10px;min-height:50px;padding:0 24px;border-radius:3px;
  font:400 var(--t-label)/1 var(--mono);letter-spacing:.1em;
  text-transform:uppercase;text-decoration:none;white-space:nowrap;
  transition:background-color var(--schnell),border-color var(--schnell),
  color var(--schnell)}
.bv2 .knopf--primaer{background:var(--peri);color:#fff}
.bv2 .knopf--primaer:hover{background:var(--peri-tief)}
.bv2 .knopf--leise{border:1px solid var(--line-strong);color:var(--ink-soft);
  background:transparent}
.bv2 .knopf--leise:hover{border-color:var(--peri);color:var(--peri-tief)}
.bv2 .ton-dunkel .knopf--primaer{background:var(--cream);color:var(--navy)}
.bv2 .ton-dunkel .knopf--primaer:hover{background:#fff}
.bv2 .ton-dunkel .knopf--leise{border-color:var(--auf-dunkel-zier);
  color:var(--cream)}
.bv2 .ton-dunkel .knopf--leise:hover{border-color:var(--peri-hell);
  color:var(--peri-hell)}
.bv2 .knopf-reihe{display:flex;flex-wrap:wrap;gap:var(--s4);align-items:center}

/* Textlink mit Tap-Flaeche */
.bv2 .textlink{display:inline-flex;align-items:center;min-height:44px;gap:8px;
  font:400 var(--t-label)/1 var(--mono);letter-spacing:.08em;
  text-transform:uppercase;text-decoration:none;color:var(--peri-tief)}
.bv2 .textlink:hover{color:var(--peri)}
.bv2 .ton-dunkel .textlink{color:var(--peri-hell)}

/* ====== Karten: eine Anatomie fuer alle ====== */
.bv2 .raster{display:grid;gap:clamp(16px,1.8vw,26px)}
.bv2 .raster--2{grid-template-columns:repeat(2,1fr)}
.bv2 .raster--3{grid-template-columns:repeat(3,1fr)}
.bv2 .raster--4{grid-template-columns:repeat(4,1fr)}
.bv2 .karte{border:1px solid var(--line);border-radius:var(--radius);
  background:var(--paper);padding:clamp(22px,2.2vw,32px);
  display:flex;flex-direction:column;
  transition:border-color var(--schnell)}
.bv2 .karte:hover{border-color:var(--peri-line)}
.bv2 .ton-dunkel .karte{background:var(--navy-hell);
  border-color:var(--auf-dunkel-linie)}
.bv2 .knum{font:400 var(--t-nano)/1 var(--mono);letter-spacing:.12em;
  color:var(--peri-tief)}
.bv2 .ton-dunkel .knum{color:var(--peri-hell)}
.bv2 .karte h3{font-size:var(--t-h3);letter-spacing:-.012em;line-height:1.25;
  margin-top:var(--s3)}
.bv2 .karte p{margin-top:var(--s3);font-size:var(--t-meta);line-height:1.6;
  color:var(--ink-soft)}
.bv2 .ton-dunkel .karte p{color:var(--auf-dunkel-meta)}
.bv2 .kmeta{margin-top:auto;padding-top:var(--s4);
  border-top:1px solid var(--line);
  font:400 var(--t-nano)/1.6 var(--mono);letter-spacing:.09em;
  text-transform:uppercase;color:var(--ink-mute)}
.bv2 .ton-dunkel .kmeta{color:var(--auf-dunkel-meta)}

/* ====== Tabellen ====== */
.bv2 .tabelle-rahmen{border:1px solid var(--line);border-radius:var(--radius);
  overflow-x:auto;background:var(--paper)}
.bv2 table.tabelle{width:100%;border-collapse:separate;border-spacing:0}
.bv2 .tabelle th{font:400 var(--t-nano)/1.4 var(--mono);letter-spacing:.12em;
  text-transform:uppercase;color:var(--ink-mute);text-align:left;
  padding:16px 20px;border-bottom:1px solid var(--line-strong);
  background:var(--soft)}
.bv2 .tabelle td{padding:17px 20px;border-bottom:1px solid var(--line);
  font-size:var(--t-meta);line-height:1.55;color:var(--ink-soft);
  vertical-align:top}
.bv2 .tabelle tr:last-child td{border-bottom:0}
.bv2 .tabelle td:first-child{color:var(--ink);font-weight:700}

/* ============================================================
   ORGANE
   ============================================================ */

/* ------ o-hero ------ */
.bv2 .o-hero{position:relative;overflow:hidden}
.bv2 .o-hero--dunkel{background:
  radial-gradient(1100px 560px at 76% 8%,rgba(91,106,191,.30),transparent 62%),
  linear-gradient(178deg,#101B33 0%,var(--navy) 58%);color:var(--auf-dunkel)}
.bv2 .o-hero .hero-flaeche{padding-block:clamp(88px,10vw,148px) clamp(56px,7vw,96px)}
.bv2 .hero-raster{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);
  gap:clamp(40px,5vw,88px);align-items:center}
.bv2 .o-hero h1{font-size:var(--t-h1);line-height:1.06;letter-spacing:-.022em;
  margin-top:var(--s5)}
.bv2 .o-hero h1 em{font-style:italic;color:var(--peri)}
.bv2 .o-hero--dunkel h1 em{color:var(--peri-hell)}
.bv2 .hero-lead{margin-top:var(--s5);font-size:var(--t-lead);line-height:1.55;
  max-width:56ch;color:var(--ink-soft)}
.bv2 .o-hero--dunkel .hero-lead{color:var(--auf-dunkel-meta)}
.bv2 .hero-cta{margin-top:clamp(28px,3.4vw,40px)}
.bv2 .hero-meta{margin-top:clamp(28px,3.4vw,44px);
  font:400 var(--t-nano)/1.7 var(--mono);letter-spacing:.08em;
  text-transform:uppercase;color:var(--ink-mute)}
.bv2 .o-hero--dunkel .hero-meta{color:var(--auf-dunkel-meta)}
.bv2 .o-hero--licht .hero-raster{grid-template-columns:1fr;text-align:center}
.bv2 .o-hero--licht .hero-lead,.bv2 .o-hero--licht .kopf{margin-inline:auto}
.bv2 .o-hero--licht .knopf-reihe{justify-content:center}
.bv2 .o-hero--licht .hero-meta{text-align:center}

/* Paneel im Hero (Score, Beleg) */
.bv2 .paneel{border:1px solid var(--auf-dunkel-linie);border-radius:18px;
  background:rgba(255,255,255,.035);padding:clamp(22px,2.4vw,32px)}
.bv2 .paneel-label{font:400 var(--t-nano)/1.4 var(--mono);letter-spacing:.11em;
  text-transform:uppercase;color:var(--auf-dunkel-meta)}
.bv2 .paneel-zahl{display:flex;align-items:baseline;gap:10px;margin-top:var(--s3)}
.bv2 .paneel-zahl b{font-family:var(--serif);font-weight:400;
  font-size:clamp(56px,4.6vw + 30px,84px);line-height:.95;
  color:var(--peri-hell);letter-spacing:-.02em}
.bv2 .paneel-zahl span{font:400 var(--t-label)/1 var(--mono);
  color:var(--auf-dunkel-meta)}
.bv2 .paneel-fuss{margin-top:var(--s4);padding-top:var(--s4);
  border-top:1px solid var(--auf-dunkel-linie);
  font:400 var(--t-nano)/1.7 var(--mono);letter-spacing:.06em;
  text-transform:uppercase;color:var(--auf-dunkel-meta)}

/* Leise Brotkrumen im Hero-Fuss */
.bv2 .krumen{display:flex;justify-content:center;gap:12px;align-items:center;
  padding-block:var(--s4);font:400 var(--t-nano)/1 var(--mono);
  letter-spacing:.11em;text-transform:uppercase}
.bv2 .krumen a{text-decoration:none;color:rgba(245,241,232,.46);min-height:44px;
  display:inline-flex;align-items:center;
  transition:color var(--schnell)}
.bv2 .krumen a:hover{color:rgba(245,241,232,.8)}
.bv2 .krumen .aktiv{color:rgba(245,241,232,.58)}
.bv2 .krumen .trenner{color:rgba(139,151,222,.45)}
.bv2 .o-hero--licht .krumen a{color:var(--ink-mute)}
.bv2 .o-hero--licht .krumen .aktiv{color:var(--ink-soft)}
.bv2 .o-hero--licht .krumen .trenner{color:var(--peri-line)}

/* ------ o-leitfaden: Auf dieser Seite, mit Lesefortschritt ------ */
.bv2 .o-leitfaden{border-block:1px solid var(--line);background:var(--paper);
  position:relative}
.bv2 .leitfaden-reihe{display:flex;align-items:center;justify-content:center;
  gap:var(--s2) var(--s5);flex-wrap:wrap;padding-block:var(--s2)}
.bv2 .leitfaden-titel{font:400 var(--t-nano)/1 var(--mono);letter-spacing:.12em;
  text-transform:uppercase;color:var(--ink-mute);flex:none}
.bv2 .o-leitfaden a{display:inline-flex;align-items:center;justify-content:center;min-height:52px;min-width:44px;padding-inline:10px;
  font:400 var(--t-label)/1 var(--mono);letter-spacing:.06em;
  text-transform:uppercase;text-decoration:none;color:var(--ink-soft);
  white-space:nowrap;transition:color var(--schnell)}
.bv2 .o-leitfaden a:hover{color:var(--peri-tief)}

/* ------ o-trust: Kennzahlen-Leiste ------ */
.bv2 .o-trust{padding-block:0}
.bv2 .trust-reihe{display:grid;grid-template-columns:repeat(4,1fr);
  border-block:1px solid var(--line)}
.bv2 .o-trust .inhalt{padding-inline:clamp(20px,4vw,48px)}
.bv2 .trust-zelle{padding:clamp(28px,3vw,44px) clamp(20px,2.4vw,36px);
  border-left:1px solid var(--line)}
.bv2 .trust-zelle:first-child{border-left:0}
.bv2 .trust-zahl{font:400 var(--t-zahl)/0.95 var(--serif);letter-spacing:-.01em;color:var(--peri-tief);white-space:nowrap}
.bv2 .trust-zahl em{font-size:.55em;vertical-align:.12em}
.bv2 .trust-zahl em{font-style:normal;color:var(--peri)}
.bv2 .o-trust--dunkel .trust-zahl{color:var(--peri-hell)}
.bv2 .trust-text{margin-top:var(--s3);font-size:var(--t-meta);line-height:1.5;
  color:var(--ink-soft)}
.bv2 .trust-quelle{margin-top:var(--s4);font:400 var(--t-nano)/1.5 var(--mono);
  letter-spacing:.1em;text-transform:uppercase;color:var(--ink-mute)}
.bv2 .o-trust--dunkel{background:var(--navy);color:var(--auf-dunkel)}
.bv2 .o-trust--dunkel .trust-reihe{border-color:var(--auf-dunkel-linie)}
.bv2 .o-trust--dunkel .trust-zelle{border-color:var(--auf-dunkel-linie)}
.bv2 .o-trust--dunkel .trust-zahl em{color:var(--peri-hell)}
.bv2 .o-trust--dunkel .trust-text{color:var(--auf-dunkel-meta)}
.bv2 .o-trust--dunkel .trust-quelle{color:var(--auf-dunkel-meta)}

/* ------ o-antwort: Kurzantwort in der Rail ------
   Der zitierfaehige Satz steht als Kopf der Rail links, die Einordnung
   rechts in Lesebreite. Buendig mit allen anderen Rail-Organen, keine
   Sonderbreite und keine Zentrierung mehr. */
.bv2 .antwort-satz{font:400 var(--t-h2)/1.22 var(--serif);letter-spacing:-.016em;
  margin-top:var(--s4)}
.bv2 .antwort-satz em{font-style:italic;color:var(--peri)}
.bv2 .ton-dunkel .antwort-satz em{color:var(--peri-hell)}
.bv2 .antwort-folge{font-size:var(--t-body);line-height:1.68;color:var(--ink-soft);
  max-width:66ch}
.bv2 .ton-dunkel .antwort-folge{color:var(--auf-dunkel-meta)}
.bv2 .antwort-folge p + p{margin-top:var(--s4)}

/* ------ o-wow: die Grafikbuehne, immer volle Breite ------ */
.bv2 .o-wow{padding-block:clamp(56px,7vw,96px) 0}
.bv2 .o-wow .kopf{margin-bottom:clamp(32px,4vw,56px)}
.bv2 .wow-buehne{width:100%}
.bv2 .wow-buehne svg{width:100%;height:auto}
.bv2 .wow-fuss{display:grid;grid-template-columns:minmax(0,1fr) auto;
  gap:var(--s5);align-items:baseline;
  padding-block:clamp(20px,2.6vw,32px) clamp(48px,6vw,80px)}
.bv2 .wow-caption{font-size:var(--t-meta);font-style:italic;line-height:1.6;
  color:var(--auf-dunkel-meta);max-width:62ch}
.bv2 .bahn:not(.bahn--dunkel) .wow-caption{color:var(--ink-mute)}
.bv2 .wow-quelle{font:400 var(--t-nano)/1.5 var(--mono);letter-spacing:.1em;
  text-transform:uppercase;color:var(--auf-dunkel-meta);white-space:nowrap}
.bv2 .bahn:not(.bahn--dunkel) .wow-quelle{color:var(--ink-mute)}

/* ------ o-stat: eine Zahl, ein Moment ------ */
.bv2 .o-stat{background:
  radial-gradient(1000px 480px at 30% 50%,rgba(91,106,191,.22),transparent 65%),
  var(--navy)}
.bv2 .o-stat .inhalt{border-block:1px solid var(--auf-dunkel-linie);
  padding-block:clamp(40px,5vw,72px)}
.bv2 .o-stat .stat-reihe{display:flex;flex-direction:column;
  align-items:center;text-align:center;gap:clamp(20px,2.6vw,32px)}
.bv2 .stat-zahl{font:400 var(--t-display)/0.9 var(--serif);white-space:nowrap;
  letter-spacing:-.03em;color:var(--cream)}
.bv2 .stat-zahl em{font-style:normal;color:var(--peri-hell)}
.bv2 .stat-text{max-width:46ch}
.bv2 .stat-text .lead{font-size:var(--t-lead);line-height:1.5;
  color:var(--auf-dunkel)}
.bv2 .stat-quelle{margin-top:var(--s5);font:400 var(--t-nano)/1.6 var(--mono);
  letter-spacing:.1em;text-transform:uppercase;
  color:var(--auf-dunkel-meta)}

/* ------ o-zitat ------ */
.bv2 .o-zitat .inhalt{max-width:880px}
.bv2 .o-zitat blockquote{margin:0;font:italic 400 var(--t-h3)/1.42 var(--serif);
  letter-spacing:-.008em}
.bv2 .o-zitat blockquote::before{content:"";display:block;width:44px;height:2px;
  background:var(--peri);margin-bottom:var(--s6)}
.bv2 .zitat-wer{margin-top:var(--s6);display:flex;align-items:center;gap:14px}
.bv2 .zitat-wer .avatar,.bv2 .zitat-wer img{width:44px;height:44px;border-radius:50%;
  object-fit:cover;flex:none}
.bv2 .zitat-name{font:400 var(--t-label)/1.5 var(--mono);letter-spacing:.06em;
  text-transform:uppercase;color:var(--ink)}
.bv2 .zitat-rolle{font:400 var(--t-nano)/1.5 var(--mono);letter-spacing:.06em;
  text-transform:uppercase;color:var(--ink-mute)}
.bv2 .ton-dunkel .zitat-name{color:var(--cream)}
.bv2 .ton-dunkel .zitat-rolle{color:var(--auf-dunkel-meta)}

/* ------ o-schritte: Prozess mit Spur ------ */
.bv2 .schritte{list-style:none;margin:0;padding:0;max-width:900px}
.bv2 .schritt{position:relative;display:grid;
  grid-template-columns:84px minmax(0,1fr) auto;align-items:start;
  padding:0 0 clamp(32px,4.4vw,52px) 0}
.bv2 .schritt::before{content:"";position:absolute;left:26px;top:56px;bottom:6px;
  width:1px;background:var(--line-strong)}
.bv2 .schritt:last-child::before{display:none}
.bv2 .schritt-num{width:52px;height:52px;
  border:1px solid var(--line-strong);border-radius:50%;background:var(--paper);
  display:grid;place-items:center;
  font:400 var(--t-label)/1 var(--mono);color:var(--peri-tief)}
.bv2 .schritt h3{font-size:var(--t-h3);letter-spacing:-.012em;line-height:1.25}
.bv2 .schritt-dauer{justify-self:end;padding-top:14px;white-space:nowrap;
  font:400 var(--t-nano)/1 var(--mono);letter-spacing:.12em;
  text-transform:uppercase;color:var(--ink-mute)}
@media(max-width:640px){.bv2 .schritt{grid-template-columns:60px 1fr}
 .bv2 .schritt-num{width:40px;height:40px}
 .bv2 .schritt::before{left:20px;top:46px}
 .bv2 .schritt-dauer{grid-column:2;justify-self:start;padding-top:6px}}
.bv2 .schritt p{margin-top:var(--s3);max-width:56ch;font-size:var(--t-body);
  color:var(--ink-soft)}

/* ------ o-fit: passt, passt nicht (auch: ist, ist nicht) ------ */
.bv2 .fit-raster{display:grid;grid-template-columns:1fr 1fr;
  gap:clamp(24px,3vw,48px)}
.bv2 .fit-spalte{border-top:2px solid var(--peri);padding-top:var(--s5)}
.bv2 .fit-spalte--kontra{border-top-color:var(--line-strong)}
.bv2 .fit-titel{font:400 var(--t-label)/1.4 var(--mono);letter-spacing:.11em;
  text-transform:uppercase;color:var(--peri-tief)}
.bv2 .fit-spalte--kontra .fit-titel{color:var(--ink-mute)}
.bv2 .fit-spalte ul{list-style:none;margin:var(--s5) 0 0;padding:0}
.bv2 .fit-spalte li{position:relative;padding:10px 0 10px 34px;
  font-size:var(--t-body);color:var(--ink-soft);line-height:1.55}
.bv2 .fit-spalte li::before{position:absolute;left:0;top:10px;
  font:600 var(--t-meta)/1.5 var(--mono)}
.bv2 .fit-spalte:not(.fit-spalte--kontra) li::before{content:"✓";
  color:var(--peri)}
.bv2 .fit-spalte--kontra li::before{content:"✕";color:var(--ink-mute)}

/* ------ o-preise ------ */
.bv2 .preis-karte{position:relative;border-radius:var(--radius-s);
  border-top:2px solid var(--line-strong)}
.bv2 .preis-karte--akzent{border-top-color:var(--peri)}
.bv2 .preis-kopfzeile{display:flex;align-items:baseline;gap:12px}
.bv2 .preis-roem{font:400 var(--t-h3)/1 var(--serif);color:var(--peri)}
.bv2 .preis-dl{margin-top:var(--s4);border-top:1px solid var(--line)}
.bv2 .preis-dl > div{display:grid;grid-template-columns:96px 1fr;gap:var(--s4);
  padding-block:9px;border-bottom:1px solid var(--line)}
.bv2 .preis-dl dt{font:400 var(--t-nano)/1.6 var(--mono);letter-spacing:.09em;
  text-transform:uppercase;color:var(--ink-mute)}
.bv2 .preis-dl dd{margin:0;font-size:var(--t-meta);color:var(--ink-soft)}
.bv2 .preis-karte--akzent{border-color:var(--peri);
  background:linear-gradient(180deg,var(--wash),var(--paper) 46%)}
.bv2 .preis-badge{position:absolute;top:-12px;left:22px;
  background:var(--peri);color:#fff;border-radius:4px;
  padding:6px 14px;font:400 var(--t-nano)/1 var(--mono);
  letter-spacing:.12em;text-transform:uppercase}
.bv2 .preis-name{font:400 var(--t-label)/1.4 var(--mono);letter-spacing:.11em;
  text-transform:uppercase;color:var(--ink-mute)}
.bv2 .preis-wert{display:flex;align-items:baseline;gap:10px;
  margin-top:var(--s5)}
.bv2 .preis-praefix{font:400 var(--t-label)/1 var(--mono);
  letter-spacing:.1em;text-transform:uppercase;color:var(--ink-mute)}
.bv2 .preis-zahl{font:400 var(--t-h1)/0.95 var(--serif);
  letter-spacing:-.01em;color:var(--ink)}
.bv2 .preis-einheit{margin-top:var(--s2);
  font:400 var(--t-nano)/1.6 var(--mono);letter-spacing:.08em;
  text-transform:uppercase;color:var(--ink-mute)}
.bv2 .preis-karte h3{font-size:var(--t-h3);margin-top:var(--s5)}
.bv2 .preis-fuer{margin-top:var(--s2);font-size:var(--t-meta);color:var(--ink-mute);
  font-style:italic}
.bv2 .preis-karte ul{list-style:none;margin:var(--s4) 0 0;padding:0}
.bv2 .preis-karte ul li{position:relative;padding:7px 0 7px 26px;
  font-size:var(--t-meta);color:var(--ink-soft);line-height:1.5}
.bv2 .preis-karte ul li::before{content:"✓";position:absolute;left:0;top:7px;
  font:600 var(--t-meta)/1.5 var(--mono);color:var(--peri)}
/* Gleiche Kartenhoehe im Raster (Grid streckt), Knopf immer buendig unten */
.bv2 .preis-karte .preis-dl{margin-bottom:var(--s6)}
.bv2 .preis-karte .knopf{margin-top:auto;align-self:flex-start}
.bv2 .preis-fuss{margin-top:var(--s6);
  font:400 var(--t-nano)/1.7 var(--mono);letter-spacing:.06em;
  text-transform:uppercase;color:var(--ink-mute);text-align:center}

/* ------ o-faq: Index-Schiene links, Antworten rechts ------ */
.bv2 .faq-raster{display:grid;grid-template-columns:minmax(240px,320px) 1fr;
  gap:clamp(40px,6vw,96px);align-items:start}
.bv2 .faq-schiene{position:sticky;top:32px}
.bv2 .faq-index{position:relative;margin-top:var(--s6);
  border-left:1px solid var(--line);padding-left:0}
.bv2 .faq-spur{position:absolute;left:-1px;top:0;width:2px;height:100%;
  background:var(--peri);transform-origin:top;transform:scaleY(0)}
.bv2 .o-faq{view-timeline-name:--faq-lauf}
@supports not (animation-timeline: view()){
  .bv2 .faq-spur{transform:scaleY(1);opacity:.25}
}
@supports (animation-timeline: view()){
  .bv2 .faq-spur{animation:faq-fuellen linear both;
    animation-timeline:--faq-lauf;
    animation-range:contain 0% contain 100%}
}
@keyframes faq-fuellen{to{transform:scaleY(1)}}
.bv2 .faq-index a{display:flex;align-items:center;min-height:44px;
  padding-left:22px;font:400 var(--t-meta)/1.4 var(--serif);
  color:var(--ink-mute);text-decoration:none;
  transition:color var(--schnell)}
.bv2 .faq-index a:hover{color:var(--ink)}
.bv2 .faq-liste{margin:0}
.bv2 .faq-frage{border-top:1px solid var(--line);
  padding-block:clamp(24px,3vw,36px)}
.bv2 .faq-frage:last-child{border-bottom:1px solid var(--line)}
.bv2 .faq-frage h3{font-size:var(--t-h3);line-height:1.3;letter-spacing:-.01em}
.bv2 .faq-frage h3 em{font-style:italic;color:var(--peri)}
.bv2 .faq-frage p{margin-top:var(--s4);max-width:58ch;font-size:var(--t-body);
  line-height:1.65;color:var(--ink-soft)}

/* ------ o-engines: das Kern-Messfeld ------ */
.bv2 .engines-reihe{display:grid;grid-template-columns:repeat(4,1fr);
  border-block:1px solid var(--line)}
.bv2 .engine{padding:clamp(26px,3vw,40px) clamp(20px,2.4vw,32px);
  border-left:1px solid var(--line)}
.bv2 .engine:first-child{border-left:0}
.bv2 .engine-index{font:400 var(--t-nano)/1 var(--mono);letter-spacing:.12em;
  color:var(--peri-tief)}
.bv2 .engine-name{margin-top:var(--s3);font:400 var(--t-h3)/1.2 var(--serif);
  letter-spacing:-.01em}
.bv2 .engine p{margin-top:var(--s3);font-size:var(--t-meta);line-height:1.55;
  color:var(--ink-soft)}
.bv2 .engine .kmeta{padding-top:var(--s4)}

/* ------ o-zeitachse: Werdegang ------ */
.bv2 .zeitachse{list-style:none;margin:0;padding:0;max-width:760px}
.bv2 .zeit-punkt{position:relative;padding:0 0 clamp(28px,3.6vw,44px) 44px}
.bv2 .zeit-punkt::before{content:"";position:absolute;left:8px;top:22px;bottom:0;
  width:1px;background:var(--line-strong)}
.bv2 .zeit-punkt:last-child::before{display:none}
.bv2 .zeit-punkt::after{content:"";position:absolute;left:3px;top:8px;width:11px;
  height:11px;border-radius:50%;border:1px solid var(--line-strong);
  background:var(--paper)}
.bv2 .zeit-punkt--jetzt::after{background:var(--peri);border-color:var(--peri)}
.bv2 .zeit-datum{font:400 var(--t-nano)/1.6 var(--mono);letter-spacing:.12em;
  text-transform:uppercase;color:var(--ink-mute)}
.bv2 .zeit-punkt--jetzt .zeit-datum{color:var(--peri-tief)}
.bv2 .zeit-punkt h3{font-size:var(--t-lead);letter-spacing:-.008em;
  margin-top:var(--s1)}
.bv2 .zeit-punkt p{margin-top:var(--s2);font-size:var(--t-meta);
  color:var(--ink-soft);max-width:52ch}

/* ------ o-team ------ */
.bv2 .team-karte{align-items:flex-start}
.bv2 .team-karte .portraet{width:100%;aspect-ratio:4/5;object-fit:cover;
  border-radius:10px;filter:saturate(.92)}
.bv2 .team-karte .avatar{width:76px;height:76px;border-radius:50%}
.bv2 .team-karte h3{margin-top:var(--s5)}
.bv2 .team-rolle{margin-top:var(--s1);font:400 var(--t-nano)/1.5 var(--mono);
  letter-spacing:.12em;text-transform:uppercase;color:var(--peri-tief)}
.bv2 .team-karte p{margin-top:var(--s4)}

/* ------ o-autor: Byline und Pruefvermerk ------ */
.bv2 .o-autor .autor-zeile{display:flex;flex-wrap:wrap;align-items:center;
  gap:var(--s4) var(--s6);border-block:1px solid var(--line);
  padding-block:var(--s5)}
.bv2 .autor-person{display:flex;align-items:center;gap:12px}
.bv2 .autor-person .avatar,.bv2 .autor-person img{width:40px;height:40px;
  border-radius:50%;object-fit:cover}
.bv2 .autor-text{font:400 var(--t-nano)/1.6 var(--mono);letter-spacing:.08em;
  text-transform:uppercase;color:var(--ink-mute)}
.bv2 .autor-text b{color:var(--ink);font-weight:600}

/* ------ o-standort ------ */
.bv2 .standort-raster{display:grid;grid-template-columns:repeat(3,1fr);
  gap:clamp(24px,3vw,48px);border-top:1px solid var(--line);
  padding-top:clamp(28px,3.6vw,48px)}
.bv2 .standort-feld .fit-titel{color:var(--ink-mute)}
.bv2 .standort-feld p{margin-top:var(--s4);font-size:var(--t-body);
  line-height:1.7;color:var(--ink-soft)}
.bv2 .standort-feld b{color:var(--ink);font-weight:700}

/* ------ o-cases ------ */
.bv2 .case-vitrine{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);
  gap:clamp(24px,3vw,48px);align-items:stretch}
.bv2 .case-featured{border:1px solid var(--peri-line);border-radius:var(--radius);
  background:linear-gradient(165deg,var(--wash),var(--paper) 60%);
  padding:clamp(28px,3.2vw,48px);display:flex;flex-direction:column}
.bv2 .case-featured .verlauf{display:flex;align-items:baseline;gap:16px;
  margin-top:var(--s6)}
.bv2 .case-featured .verlauf b{font:400 var(--t-zahl)/0.95 var(--serif);
  letter-spacing:-.025em;font-weight:400}
.bv2 .case-featured .verlauf .pfeil{font:400 var(--t-h2)/1 var(--serif);
  color:var(--peri)}
.bv2 .case-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:var(--s5)}
.bv2 .case-chip{font:400 var(--t-nano)/1 var(--mono);letter-spacing:.08em;
  text-transform:uppercase;color:var(--ink-mute);
  border:1px solid var(--line);border-radius:7px;padding:7px 10px}
.bv2 .case-featured h3{font-size:var(--t-h3);margin-top:var(--s6)}
.bv2 .case-featured p{margin-top:var(--s3);font-size:var(--t-meta);
  color:var(--ink-soft);max-width:52ch}
.bv2 .case-stapel{display:grid;gap:clamp(16px,1.8vw,26px)}
.bv2 .case-stapel .karte{flex-direction:row;align-items:baseline;gap:var(--s5)}
.bv2 .case-stapel .karte > div:first-child{flex:1}
.bv2 .case-stapel .karte h3{font-size:var(--t-lead);margin:6px 0 0}
.bv2 .case-stapel .karte > div:last-child{flex:2}
.bv2 .case-stapel .karte p{margin:0}
.bv2 .case-ergebnis{margin-top:var(--s3) !important;
  font:400 var(--t-nano)/1.5 var(--mono) !important;letter-spacing:.08em;
  text-transform:uppercase;color:var(--ink-mute) !important}

/* ------ o-score: Snapshot-Karte ------ */
.bv2 .score-karte{max-width:560px}
.bv2 .score-kopf{display:flex;justify-content:space-between;align-items:baseline}
.bv2 .score-wert{display:flex;align-items:baseline;gap:8px;margin-top:var(--s4)}
.bv2 .score-wert b{font:400 var(--t-zahl)/0.95 var(--serif);font-weight:400;
  letter-spacing:-.025em}
.bv2 .score-wert span{font:400 var(--t-label)/1 var(--mono);
  color:var(--ink-mute)}
.bv2 .score-karte figure{margin:var(--s5) 0 0}
.bv2 .score-fuss{margin-top:var(--s4);padding-top:var(--s4);
  border-top:1px solid var(--line);
  font:400 var(--t-nano)/1.7 var(--mono);letter-spacing:.08em;
  text-transform:uppercase;color:var(--ink-mute)}

/* ------ o-hinweis: Haftungszeile ------ */
.bv2 .o-hinweis{padding-block:var(--s6)}
.bv2 .o-hinweis .inhalt{display:flex;justify-content:center}
.bv2 .o-hinweis p{font:400 var(--t-meta)/1.7 var(--serif);font-style:italic;
  color:var(--ink-mute);text-align:center;max-width:72ch}

/* ------ o-cta ------ */
.bv2 .o-cta{background:
  radial-gradient(900px 480px at 50% 120%,rgba(91,106,191,.35),transparent 65%),
  var(--navy);color:var(--auf-dunkel);text-align:center}
.bv2 .o-cta .inhalt{max-width:880px}
.bv2 .o-cta h2{font-size:var(--t-h2);line-height:1.1;letter-spacing:-.02em;
  margin-top:var(--s4)}
.bv2 .o-cta h2 em{font-style:italic;color:var(--peri-hell)}
.bv2 .o-cta .lead{margin:var(--s5) auto 0;max-width:52ch;
  font-size:var(--t-lead);line-height:1.55;color:var(--auf-dunkel-meta)}
.bv2 .o-cta .knopf-reihe{justify-content:center;margin-top:clamp(28px,4vw,44px)}
.bv2 .o-cta .cta-meta{margin-top:var(--s6);
  font:400 var(--t-nano)/1.7 var(--mono);letter-spacing:.1em;
  text-transform:uppercase;color:var(--auf-dunkel-meta)}

/* ------ Rail-Layout: Kopfspalte links, Inhalt rechts ------
   Das kanonische Muster des Bestands (R-LAYOUT-2), in v2 zurueckgeholt.
   Fuer Text-Organe, deren Inhalt schmaler ist als die Bahn: prosa,
   checkliste, quellen, glossar, zeitachse, schritte, score. Die Kopfspalte
   traegt Eyebrow UND Ueberschrift und haftet beim Scrollen. */
.bv2 .l-rail{display:grid;grid-template-columns:minmax(260px,.9fr) minmax(0,1.6fr);
  gap:clamp(40px,6vw,96px);align-items:start}
.bv2 .l-rail > .kopf{margin-bottom:0;position:sticky;top:32px}
@media (max-width: 980px){
  .bv2 .l-rail{grid-template-columns:1fr}
  .bv2 .l-rail > .kopf{position:static;margin-bottom:clamp(28px,4vw,44px)}
}

/* ------ Split-Layout: Text neben Figur, beide Seiten tragen ------ */
.bv2 .l-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:clamp(40px,5vw,88px);align-items:center}
.bv2 .l-split--rechts > :first-child{order:2}
.bv2 .l-split .kopf{margin-bottom:0}
.bv2 .split-figur{border:1px solid var(--line);border-radius:var(--radius);
  overflow:hidden;background:var(--soft)}
.bv2 .ton-dunkel .split-figur{border-color:var(--auf-dunkel-linie);
  background:var(--navy-hell)}

/* ------ o-weiterlesen: kuratierte interne Ziele ------ */
.bv2 .o-weiterlesen .wl-liste{border-top:1px solid var(--line)}
.bv2 .wl-zeile{display:grid;grid-template-columns:minmax(0,1fr) auto;
  align-items:center;gap:var(--s5);padding-block:18px;
  border-bottom:1px solid var(--line);text-decoration:none;color:inherit}
.bv2 .wl-zeile h4{font-size:var(--t-lead);letter-spacing:-.01em;
  transition:color var(--schnell)}
.bv2 .wl-zeile:hover h4{color:var(--peri-tief)}
.bv2 .wl-grund{font:400 var(--t-nano)/1 var(--mono);letter-spacing:.08em;
  text-transform:uppercase;color:var(--ink-mute);white-space:nowrap}
.bv2 .wl-pfeil{color:var(--peri);font-size:var(--t-lead)}

/* ------ Blog-Hub: Karten und Zeilen als Verzeichnis-Eintraege ------ */
.bv2 .karte h3 a{color:inherit;text-decoration:none;transition:color var(--schnell)}
.bv2 .karte h3 a:hover{color:var(--peri-tief)}
.bv2 .hub-mehr{margin:var(--s4) 0 0}
.bv2 .hub-mehr a{font:500 var(--t-nano)/1 var(--mono);letter-spacing:.14em;
  text-transform:uppercase;color:var(--peri-tief);text-decoration:none;
  border-bottom:1px solid var(--line);padding-bottom:4px;
  transition:border-color var(--schnell)}
.bv2 .hub-mehr a:hover{border-color:var(--peri-tief)}

/* ------ o-quellen ------ */
.bv2 .ql-liste{border-top:1px solid var(--line);max-width:860px}
.bv2 .ql-zeile{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--s5);
  align-items:baseline;padding-block:14px;border-bottom:1px solid var(--line)}
.bv2 .ql-aussage{font-size:var(--t-meta);color:var(--ink-soft)}
.bv2 .ql-quelle{font:400 var(--t-nano)/1.5 var(--mono);letter-spacing:.06em;
  text-transform:uppercase;color:var(--ink-mute);white-space:nowrap}

/* ------ o-checkliste ------ */
.bv2 .ck-liste{list-style:none;margin:0;padding:0;max-width:820px}
.bv2 .ck-punkt{display:grid;grid-template-columns:52px 1fr;gap:var(--s5);
  padding-block:clamp(18px,2.4vw,28px);border-top:1px solid var(--line)}
.bv2 .ck-punkt:last-child{border-bottom:1px solid var(--line)}
.bv2 .ck-num{font:400 var(--t-label)/1 var(--mono);color:var(--peri-tief);
  padding-top:6px}
.bv2 .ck-punkt h3{font-size:var(--t-lead)}
.bv2 .ck-punkt p{margin-top:var(--s2);font-size:var(--t-meta);
  color:var(--ink-soft);max-width:56ch}

/* ------ o-methodik ------ */
.bv2 .knum--roem{font-size:var(--t-h3);color:var(--peri);letter-spacing:0}
.bv2 .kergebnis{margin-top:var(--s3) !important;font-style:italic;
  color:var(--ink-soft) !important}

/* ------ o-anbieter ------ */
.bv2 .anbieter-karte--eigen{border-color:var(--peri);position:relative;
  background:linear-gradient(180deg,var(--wash),var(--paper) 40%)}
.bv2 .anbieter-tag{position:absolute;top:-12px;left:22px;background:var(--peri);
  color:#fff;border-radius:7px;padding:5px 10px;
  font:400 var(--t-nano)/1 var(--mono);letter-spacing:.08em;
  text-transform:uppercase}
.bv2 .anbieter-fokus{font-style:italic;color:var(--ink-mute) !important}
.bv2 .anbieter-staerken{list-style:none;margin:var(--s4) 0 0;padding:0}
.bv2 .anbieter-staerken li{position:relative;padding:6px 0 6px 24px;
  font-size:var(--t-meta);color:var(--ink-soft)}
.bv2 .anbieter-staerken li::before{content:"✓";position:absolute;left:0;top:6px;
  color:var(--peri);font:400 var(--t-meta)/1.5 var(--mono)}
.bv2 .anbieter-transparenz{margin-top:var(--s6);text-align:center;
  font:400 var(--t-nano)/1.7 var(--mono);letter-spacing:.06em;
  text-transform:uppercase;color:var(--ink-mute)}

/* ------ o-glossar ------ */
.bv2 .gl-liste{margin:0;max-width:860px;border-top:1px solid var(--line)}
.bv2 .gl-zeile{display:grid;grid-template-columns:minmax(160px,240px) 1fr;
  gap:var(--s5);padding-block:16px;border-bottom:1px solid var(--line)}
.bv2 .gl-zeile dt{font-size:var(--t-lead);letter-spacing:-.01em}
.bv2 .gl-zeile dd{margin:0;font-size:var(--t-meta);color:var(--ink-soft)}

/* ------ Lesezeichen: schwebender Kapitel-Anzeiger fuer Langseiten ------ */
.bv2 .lesezeichen{position:fixed;right:18px;top:50%;transform:translateY(-50%);
  z-index:60;display:flex;flex-direction:column;align-items:flex-end;
  gap:4px}
.bv2 .lesezeichen a{display:flex;align-items:center;gap:10px;min-height:26px;
  text-decoration:none;color:var(--ink-mute)}
.bv2 .lesezeichen a::after{content:"";width:7px;height:7px;border-radius:50%;
  background:var(--line-strong);transition:background-color var(--schnell)}
.bv2 .lesezeichen a:hover::after{background:var(--peri)}
.bv2 .lesezeichen a span{opacity:0;transform:translateX(4px);
  font:400 var(--t-nano)/1 var(--mono);letter-spacing:.08em;
  text-transform:uppercase;background:var(--paper);
  border:1px solid var(--line);border-radius:7px;padding:6px 9px;
  transition:opacity var(--schnell),transform var(--schnell)}
.bv2 .lesezeichen:hover a span{opacity:1;transform:none}
.bv2 .lesezeichen-schalter{display:none}
.bv2 .lesezeichen-knopf{cursor:pointer;margin-top:6px;
  font:400 var(--t-nano)/1 var(--mono);color:var(--ink-mute);
  border:1px solid var(--line);border-radius:7px;background:var(--paper);
  padding:5px 8px}
.bv2 .lesezeichen-schalter:checked ~ .lesezeichen a{display:none}
@keyframes lz-lauf{to{transform:scaleX(1)}}

/* ====== Responsiv ====== */
@media (max-width: 800px){
  .bv2 .faq-raster{grid-template-columns:1fr}
  .bv2 .faq-schiene{position:static}
  .bv2 .faq-index{display:none}
}
@media (max-width: 980px){
  .bv2 .hero-raster,.bv2 .l-split,.bv2 .case-vitrine{grid-template-columns:1fr}
  .bv2 .l-split--rechts > :first-child{order:0}
  .bv2 .raster--3,.bv2 .raster--4{grid-template-columns:repeat(2,1fr)}
  .bv2 .engines-reihe,.bv2 .trust-reihe{grid-template-columns:repeat(2,1fr)}
  .bv2 .trust-zelle:nth-child(odd){border-left:0}
  .bv2 .trust-zelle:nth-child(n+3){border-top:1px solid var(--line)}
  .bv2 .o-trust--dunkel .trust-zelle:nth-child(n+3){border-top-color:var(--auf-dunkel-linie)}
  .bv2 .engine:nth-child(odd){border-left:0}
  .bv2 .engine:nth-child(n+3){border-top:1px solid var(--line)}
  .bv2 .lesezeichen{top:auto;bottom:16px;right:50%;
    transform:translateX(50%);flex-direction:row;align-items:center;
    gap:14px;background:rgba(255,255,255,.97);
    border:1px solid var(--line-strong);border-radius:6px;
    padding:11px 18px;box-shadow:0 6px 26px rgba(11,20,38,.18)}
  .bv2 .lesezeichen a::after{width:8px;height:8px;background:#8E97AB}
  .bv2 .lesezeichen a{min-height:32px;min-width:26px;justify-content:center}
  .bv2 .lesezeichen a span{display:none}
  .bv2 .lesezeichen-knopf{display:none}
}
@media (max-width: 640px){
  .bv2 .wow-quelle,.bv2 .wl-grund,.bv2 .ql-quelle{white-space:normal}
  .bv2 .raster--2,.bv2 .raster--3,.bv2 .raster--4{grid-template-columns:1fr}
  .bv2 .fit-raster,.bv2 .standort-raster{grid-template-columns:1fr}
  .bv2 .engines-reihe,.bv2 .trust-reihe{grid-template-columns:1fr}
  .bv2 .trust-zelle,.bv2 .engine{border-left:0}
  .bv2 .trust-zelle:nth-child(n+2){border-top:1px solid var(--line)}
  .bv2 .engine:nth-child(n+2){border-top:1px solid var(--line)}
  .bv2 .o-stat .stat-reihe{grid-template-columns:1fr;gap:var(--s5)}
  .bv2 .wow-fuss{grid-template-columns:1fr}
  .bv2 .wl-zeile{grid-template-columns:1fr}
  .bv2 .ql-zeile{grid-template-columns:1fr}
  .bv2 .gl-zeile{grid-template-columns:1fr;gap:var(--s1)}
  .bv2 .trust-zelle{text-align:center}
  .bv2 .o-stat .stat-reihe{text-align:center}
  .bv2 .stat-zahl{white-space:normal}
  .bv2 .stat-text{margin-inline:auto}
  .bv2 .autor-zeile{flex-direction:column;align-items:flex-start;gap:var(--s3)}
  .bv2 .case-stapel .karte{flex-direction:column;gap:var(--s2)}
  .bv2 .wow-mobil{display:block}
  .bv2 .wow-desktop{display:none}
}
@media (min-width: 641px){
  .bv2 .wow-mobil{display:none}
  .bv2 .wow-desktop{display:block}
}
@media (prefers-reduced-motion: reduce){
  .bv2 *{transition:none !important;animation:none !important}
}
/* ============================================================================
   o-verzeichnis · Ergaenzung zu bavaria-v2.css
   ----------------------------------------------------------------------------
   Das Organ der Hub-Seiten: ein vollstaendiges, nach Facette gruppiertes
   Verzeichnis. Baut auf der Karten-Anatomie des Substrats auf, damit im Haus
   kein zweites Kartenmuster entsteht. Neu sind die Gruppierung, der Link-Zustand
   der Karte und die Gruppen-Einleitung.
   ========================================================================== */

/* Gruppen ------------------------------------------------------------------ */
.bv2 .o-verzeichnis .vz-gruppe + .vz-gruppe{margin-top:clamp(48px,6vw,84px)}
.bv2 .o-verzeichnis .vz-gruppe > .eyebrow{margin-bottom:var(--s3)}
.bv2 .o-verzeichnis .vz-gruppe > h2{font-size:var(--t-h3);letter-spacing:-.012em;
  line-height:1.25;padding-bottom:var(--s3);border-bottom:1px solid var(--line-strong)}
.bv2 .o-verzeichnis .vz-lead{margin-top:var(--s3);margin-bottom:var(--s5);
  font:400 var(--t-meta)/1.6 var(--serif);font-style:italic;color:var(--ink-mute);
  max-width:64ch}

/* Karte als Link ------------------------------------------------------------
   Die Karte ist ein article, kein a. Grund: wpautop behandelt den Inhalt eines
   Inline-Elements als Textfluss und setzt verwaiste Absatz-Tags hinein, die als
   leere Grid-Zellen landen. Gemessen 20.08.2026: sieben Leerzellen, 2.190 px.

   Der Hover-Zustand kommt unveraendert aus dem Substrat (.karte:hover, Rand auf
   peri-line). Eine erste Fassung hatte hier translateY und box-shadow ergaenzt,
   also einen zweiten Kartenzustand erfunden, den das Haus nirgends kennt. Das
   ist zurueckgenommen: ein Organ definiert keine eigene Bewegung und keinen
   eigenen Schatten, es erbt den Zustand seiner Anatomie.
   ------------------------------------------------------------------------- */
.bv2 .karte--link{position:relative}
.bv2 .karte--link h3 a{text-decoration:none;color:inherit;
  transition:color var(--schnell)}
.bv2 .karte--link h3 a::after{content:"";position:absolute;inset:0}
.bv2 .karte--link:hover h3 a{color:var(--peri-tief)}
.bv2 .karte--link h3 a:focus-visible{outline:2px solid var(--peri);outline-offset:4px}
.bv2 .karte--link .kmeta{color:var(--peri-tief)}
.bv2 .karte--link .wl-pfeil{color:var(--peri);font-size:var(--t-meta);
  display:inline-block;transition:transform var(--schnell)}
.bv2 .karte--link:hover .wl-pfeil{transform:translateX(3px)}

/* Wow-Buehne: Desktop- und Mobilmotiv teilen sich den Platz ----------------- */
.bv2 .o-wow .wow-buehne svg{width:100%;height:auto;border-radius:var(--radius)}

@media (max-width:640px){
  .bv2 .o-verzeichnis .vz-gruppe > h2{font-size:var(--t-lead)}
}

/* ============================================================================
   Motiv-Animation · Bewegung erklaert den Fluss, sie dekoriert nicht (GS-23)
   ----------------------------------------------------------------------------
   Bewusst CSS statt SMIL: <animate> reagiert nicht auf prefers-reduced-motion,
   CSS-Keyframes werden von der Substrat-Regel am Dateiende mit abgeschaltet.
   Und kein style-Block im SVG, weil wpautop ihn zerlegt (B-7).
   ========================================================================== */
.bv2 .wow-buehne .lauf{stroke-dasharray:var(--laenge);stroke-dashoffset:var(--laenge);
  animation:motiv-lauf 6s linear infinite}
.bv2 .wow-buehne .puls{animation:motiv-puls 4.5s ease-in-out infinite var(--takt,0s);
  transform-box:fill-box;transform-origin:center}
.bv2 .wow-buehne .perle{animation:motiv-perle 6s linear infinite}
@keyframes motiv-lauf{to{stroke-dashoffset:0}}
@keyframes motiv-puls{0%,100%{transform:scale(1)}50%{transform:scale(1.3)}}
@keyframes motiv-perle{
  0%{transform:translateX(var(--von));opacity:0}
  8%{opacity:.9} 92%{opacity:.9}
  100%{transform:translateX(var(--bis));opacity:0}}
@media (prefers-reduced-motion: reduce){
  .bv2 .wow-buehne .lauf{stroke-dashoffset:0}
  .bv2 .wow-buehne .perle{opacity:0}
}

/* ============================================================================
   Kopfzeile bei transparentem Header
   ----------------------------------------------------------------------------
   ACHTUNG, Geltungsbereich: Dieser Block wirkt bewusst AUSSERHALB von .bv2.
   Er ist der einzige im Substrat, der das tut. Grund: der Header gehoert dem
   Theme, liegt aber bei dunklem Hero optisch auf unserer Flaeche. Alles andere
   in dieser Datei bleibt auf .bv2 begrenzt.

   Befund 20.08.2026: Astra faerbt bei aktivem Transparent-Header alle Menue-
   links hell, damit sie auf dem dunklen Hero lesbar sind. Das Untermenue erbt
   diese Farbe, steht aber auf weissem Grund. Gemessen: Text rgb(239,242,255)
   auf rgb(255,255,255), Kontrast 1,12 gegen ein AA-Minimum von 4,5.
   Astra selbst setzt dort nur background-color:transparent, nicht die Farbe.

   Farben als Hexwert, weil die Tokens auf .bv2 gescoped sind und hier nicht
   gelten. Werte unveraendert aus design_tokens: navy_ink und peri-tief.
   ========================================================================== */
.ast-theme-transparent-header .ast-builder-menu .main-header-menu .menu-item .sub-menu .menu-link,
.ast-theme-transparent-header .main-header-menu .menu-item .sub-menu .menu-link,
.ast-theme-transparent-header .sub-menu a{color:#0B1426}
.ast-theme-transparent-header .ast-builder-menu .main-header-menu .menu-item .sub-menu .menu-link:hover,
.ast-theme-transparent-header .main-header-menu .menu-item .sub-menu .menu-link:hover,
.ast-theme-transparent-header .sub-menu a:hover{color:#47549E}

/* Das Untermenue bekommt eine feine Kante, damit es sich vom transparenten
   Kopf abhebt, statt frei ueber dem Hero zu schweben. */
.ast-theme-transparent-header .main-header-menu .sub-menu{
  border:1px solid #E4E7F0;border-radius:5px;overflow:hidden}

/* Mobil klappt das Untermenue im dunklen Off-Canvas auf, dort gilt das
   Gegenteil: heller Text bleibt richtig. */
@media (max-width:921px){
  .ast-theme-transparent-header .ast-mobile-popup-drawer .sub-menu .menu-link,
  .ast-theme-transparent-header .main-header-menu.ast-mobile-menu .sub-menu .menu-link{color:inherit}
  .ast-theme-transparent-header .main-header-menu .sub-menu{border:0}
}


/* ============================================================================
   NACHTRAG · Fassung 2.2 · 27.08.2026
   Changelog:
   - HE-1 vollstaendig umgesetzt: gezeichneter Krumen-Trenner (.krumen-trenner
     mit ::before), aria-current-Stufe der Kontraststaffel, Auto-Margin-Schutz.
     Vorher existierte nur eine Farbregel fuer .trenner ohne Zeichen, der
     Trenner blieb unsichtbar. Befund 27.08., /sichtbarkeits-strategie/.
   - Skalenluecke geschlossen: h3 im Prosa-Satzspiegel (.prosa h3) rendert
     bisher wie Fliesstext, weil der Preflight nullt und keine Organregel
     greift. Wert aus der Typo-Skala, kein neuer Wert.
   ========================================================================== */

.bv2 .krumen > *{margin:0 !important}
.bv2 .krumen .krumen-trenner{font-size:0;line-height:0;
  color:rgba(245,241,232,.30)}
.bv2 .krumen .krumen-trenner::before{content:"\00B7";
  font-size:var(--t-label);letter-spacing:0}
.bv2 .krumen [aria-current="page"]{color:rgba(245,241,232,.64)}
.bv2 .o-hero--licht .krumen .krumen-trenner{color:var(--peri-line)}
.bv2 .o-hero--licht .krumen [aria-current="page"]{color:var(--ink-soft)}

.bv2 .prosa h3{font-size:var(--t-h3);color:var(--ink);
  margin-top:var(--s7)}
.bv2 .prosa h3 + p{margin-top:var(--s4)}
.bv2 .ton-dunkel .prosa h3{color:var(--cream)}


/* ============================================================================
   NACHTRAG · Fassung 2.3 · 27.08.2026 (zweiter Durchgang)
   Changelog:
   - Flaechen-Verlaeufe auf Karten entfernt (Nutzer-Beschluss 27.08.:
     keine Gradients auf Karten). Betroffen: preis-karte--akzent,
     case-featured, anbieter-karte--eigen. Akzent traegt jetzt allein
     der Rand. Die radialen Glows dunkler Sektionen bleiben.
   - Breitengebot R-LAYOUT-3: .prosa als direktes Kind von .inhalt wird
     zentriert statt linksbuendig vor toter Flaeche.
   - .split-figur figcaption bekommt Satz und Abstand; stand bisher
     ungestylt buendig an der Panelkante.
   - Neue Animationsklasse .strom: laufende Strichelchen entlang eines
     beliebigen Pfads (Idiom des Referenzmotivs "Anatomie einer Zitation").
     Ersetzt den Fehlgebrauch von .lauf fuer Strukturlinien, deren
     endloses Nachzeichnen halbfertig aussah. Reduced-Motion schaltet ab.
   ========================================================================== */

.bv2 .preis-karte--akzent,
.bv2 .case-featured,
.bv2 .anbieter-karte--eigen{background:var(--paper)}

.bv2 .inhalt > .prosa{margin-inline:auto}

.bv2 .split-figur figcaption{padding:var(--s4) var(--s5) var(--s5);
  font-size:var(--t-meta);line-height:1.6;color:var(--ink-soft)}
.bv2 .ton-dunkel .split-figur figcaption{color:var(--auf-dunkel-meta)}

.bv2 .wow-buehne .strom{stroke-dasharray:12 84;stroke-linecap:round;
  animation:motiv-strom 4s linear infinite var(--takt,0s)}
@keyframes motiv-strom{to{stroke-dashoffset:-96}}
@media (prefers-reduced-motion: reduce){
  .bv2 .wow-buehne .strom{animation:none}
}
