/* Block: Rechtstext (AGB, Datenschutz, Impressum)
   ------------------------------------------------------------------
   Inhalt kommt von der alten Seite, Gestaltung aus diesem Theme:
   Literata für Überschriften, Poppins für den Fließtext, Weserwaben-Blau,
   Akzentfarbe für Links.

   Die Skala aus typography.css (H2 40px, H3 34px) ist für Sektions-
   überschriften gedacht. Die Datenschutzerklärung hat 31 Zwischen-
   überschriften – in dieser Größe zerfällt der Text in Plakate. Der Block
   setzt deshalb eine eigene, engere Stufung. Die Schriften und Farben
   bleiben unverändert, nur die Größen sind textgerecht.

   Zeilenlänge: Der Block läuft auf 9 von 12 Spalten und begrenzt den
   Fließtext zusätzlich auf 70ch – darüber wird Lesen anstrengend.
   ------------------------------------------------------------------ */

.block-legal-text {
    background-color: var(--color-white);
}

.legal-text-headline {
    margin: 0 0 var(--space-md);
    color: var(--color-dark);
}

/* ── Fließtext ──────────────────────────────────────────── */
.legal-text-body {
    max-width: 70ch;
    font-family: var(--font-body);
    font-size: var(--fs-copy-s);
    line-height: 1.7;
    color: var(--color-text);
}

.legal-text-body > *:first-child { margin-top: 0; }
.legal-text-body > *:last-child  { margin-bottom: 0; }

.legal-text-body p {
    margin: 0 0 16px;
}

/* ── Zwischenüberschriften ──────────────────────────────── */
.legal-text-body h2,
.legal-text-body h3 {
    font-family: var(--font-heading);
    font-weight: var(--fw-semibold);
    color: var(--color-dark);
}

.legal-text-body h2 {
    margin: 48px 0 16px;
    font-size: 24px;
    line-height: 1.3;
}

.legal-text-body h3 {
    margin: 36px 0 12px;
    font-size: 19px;
    line-height: 1.35;
}

/* ── Listen ─────────────────────────────────────────────── */
.legal-text-body ul,
.legal-text-body ol {
    margin: 0 0 16px;
    padding-left: 22px;
}

.legal-text-body li {
    margin-bottom: 8px;
}

.legal-text-body li:last-child { margin-bottom: 0; }

/* Verschachtelte Listen sitzen dichter am Elternpunkt. */
.legal-text-body li > ul,
.legal-text-body li > ol {
    margin: 8px 0 0;
}

/* ── Links ──────────────────────────────────────────────── */
.legal-text-body a {
    color: var(--color-dark);
    text-decoration: underline;
    text-underline-offset: 3px;
    /* Die Erklärung verlinkt lange Anbieter-Adressen. Ohne Umbruch
       schieben die auf Mobil die ganze Spalte auf. */
    overflow-wrap: anywhere;
    transition: var(--transition);
}

.legal-text-body a:hover,
.legal-text-body a:focus-visible {
    color: var(--color-dark-hover, #1b2848);
}

.legal-text-body strong {
    font-weight: var(--fw-semibold);
}

/* ── Tablet und Desktop ─────────────────────────────────── */
@media (min-width: 768px) {
    .legal-text-body h2 { font-size: 28px; }
    .legal-text-body h3 { font-size: 21px; }
}
