/* ==========================================================================
   recht.css — Zusatz zu start.css (C3), nur für Impressum, Datenschutz und
   die Danke-Seite nach dem Kontaktformular. Kein Faden, kein JS, nur hell.
   ========================================================================== */

/* Fußzeile auf kurzen Seiten unten halten */
.rechtsseite .app{display:flex;flex-direction:column}
.recht{flex:1 0 auto;padding:72px 8px 24px}

/* eine Glas-Karte mit dem Text, linksbündig wie die Abschnittsköpfe */
.recht-karte{max-width:760px;box-sizing:border-box;padding:clamp(24px,5vw,44px);display:flex;flex-direction:column;align-items:flex-start;gap:16px}
.recht-titel{margin:0;font-size:clamp(30px,4vw,46px);line-height:1.06;font-weight:600;letter-spacing:-.03em}
.recht-daten{align-self:stretch;display:flex;flex-direction:column;margin:8px 0 0}
.recht-daten .zeile{gap:16px}
.recht-daten dt{flex:0 0 190px;margin:0;color:var(--text3)}
.recht-daten dd{flex:1 1 0;min-width:0;margin:0;color:var(--text);overflow-wrap:anywhere}
.recht-daten a{color:var(--text)}
.recht-hinweis{margin:0;font-size:13px;line-height:1.5;color:var(--text3)}

/* P4: Fließtext der Datenschutzerklärung (Überschriften, Absätze, Listen) */
.recht-h2{margin:16px 0 0;font-size:20px;line-height:1.3;font-weight:600;letter-spacing:-.01em;color:var(--text)}
.recht-text{margin:0;font-size:15px;line-height:1.6;color:var(--text2)}
.recht-liste{margin:0;padding-left:20px;font-size:15px;line-height:1.6;color:var(--text2)}
.recht-liste li+li{margin-top:6px}
.recht-text a,.recht-liste a{color:var(--text)}
.recht-text strong,.recht-liste strong{color:var(--text);font-weight:600}

@media (max-width:640px){
  .recht{padding:40px 0 8px}
  .recht-daten .zeile{flex-direction:column;gap:2px}
  .recht-daten dt{flex:none}
}