/* Rechtstextseiten (/impressum/, /datenschutz/).

   Am Original (Framer) per getComputedStyle nachgemessen, 1440px:

     Container   x=189, w=1062  -> mittig, Inhaltsbreite exakt 1062px.
                 Mit dem 24px-Innenabstand von .container heisst das
                 max-width 1110px, sonst blieben nur 1014px uebrig und der
                 gesamte Fliesstext lief mit anderem Zeilenumbruch (der
                 Hauptgrund fuer die 9,5% Abweichung).
     Seitentitel 29px/700/34.8, ZENTRIERT, rgb(51,51,51)
     alles uebrige 15px/400 bzw. /700, linksbuendig, gedaempftes Grau
     Definitionsliste  li ohne Aufzaehlungszeichen, 20px eingerueckt

   Abstandsmodell: das Original setzt NIRGENDS margin. Der vertikale Rhythmus
   entsteht ausschliesslich aus leeren Absaetzen (je 22,5px = eine Zeile).
   Unser frueheres Modell (margin-bottom 16px, margin-top 48px vor
   Ueberschriften) driftete deshalb ueber die Seite auf: das Dokument war
   19933px statt 17350px hoch, also 2583px zu lang - weiter unten lag kein
   Absatz mehr auf seiner Original-Position. Deshalb bilden wir die Leerzeilen
   des Originals 1:1 als <p class="ln"> ab und setzen alle Margins auf 0. */

/* padding-bottom 123 statt 96: Textende -> Pfadleiste ist im Original @1440
   123px (impressum 1379,3 -> 1502,3; Lauf 6 2026-07-30). Das war die gesamte
   dh-Differenz -27 der Rechtstextseiten. Mobil bleibt 96 (dort sitzt die
   Kette, dh 0 - s. Media-Block unten). */
.section--legal { padding-top: 123px; padding-bottom: 123px; }

/* Unterhalb 1200px setzt das Original den Kopfabstand der Rechtstextseiten
   um 47px herab: der Seitentitel steht bei 390px UND 768px auf y=150 (bei uns
   sonst y=197). Da der gesamte Fliesstext an derselben x/Breite/Schrift wie im
   Original umbricht, verschiebt allein dieser konstante 47px-Versatz jede
   Textzeile der ~50000px langen Seite - Differenzbild durchgehend ~15% rot.
   Gated auf 1199px, damit die am Desktop (1440) exakt sitzende 123px-Marke
   unberuehrt bleibt. */
@media (max-width: 1199px) {
  .section--legal { padding-top: 76px; padding-bottom: var(--space-9); }
}

.legal-prose { max-width: 1110px; margin-left: auto; margin-right: auto; }

.legal-prose h1,
.legal-prose h2,
.legal-prose h3,
.legal-prose p,
.legal-prose ul,
.legal-prose li { margin: 0; }

/* Seitentitel: 29px-Stufe (nicht die 32px der Hero-Seiten), zentriert. */
.legal-prose h1 {
  font-size: var(--fs-h2);
  line-height: var(--lh-h2);
  text-align: center;
  color: var(--color-text);
}

/* Zwischenueberschriften: gleiche Groesse wie der Fliesstext, nur fett -
   im Original 15px/700/22.5 in derselben gedaempften Farbe wie der Text. */
.legal-prose h2,
.legal-prose h3 {
  font-size: var(--fs-h3);
  line-height: var(--lh-h3);
  color: var(--color-text-muted);
}

.legal-prose p {
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  color: var(--color-text-muted);
}

/* Leerzeile des Originals: exakt eine Zeilenhoehe. */
.legal-prose p.ln { height: 22.5px; }

/* Das Original rendert die Rechtstexte mit white-space: pre-wrap. Dadurch
   bleiben Mehrfach-Leerzeichen stehen - z.B. "a)    personenbezogene Daten"
   in der Definitionsliste, deren Text bei uns sonst um ~26px nach links
   ruckte. Unsere Textbloecke stehen jeweils auf einer Quellzeile, es kommt
   also keine Einrueckung aus der Vorlage hinzu. */
.legal-prose h1,
.legal-prose h2,
.legal-prose h3,
.legal-prose p { white-space: pre-wrap; }

/* Definitionsliste (a) … z) …): im Original list-style none, 20px Einzug. */
.legal-prose ul.legal-defs { list-style: none; padding: 0; }
.legal-prose ul.legal-defs > li { list-style: none; padding-left: 20px; }
/* Verschachtelte Ebene: im Original nur 18px Einzug (li-pl 18, Textbreite
   274 statt 272 @390) - die 2px liessen einen Absatz eine Zeile mehr
   umbrechen (+22,5px docH, Lauf 6 2026-07-30). */
.legal-prose ul.legal-defs ul.legal-defs > li { padding-left: 18px; }

.legal-prose a { color: var(--color-brand-blue-text); text-decoration: underline; }

/* Das Original zeigt die E-Mail-Adresse im Impressum als reinen Text ohne
   Verweis. Wir behalten den mailto-Verweis (Funktion), geben ihm aber das
   Aussehen des Fliesstextes - sonst stuende dort blau unterstrichener Text,
   den das Original nicht hat. */
.legal-prose a.plain { color: inherit; text-decoration: none; }