/* ==========================================================================
   /impressum — Rechtsseite (Klasse P), Wortlaut 1:1 von sing-schule.de (W4 offen)
   Gleicher Aufbau auf /impressum, /datenschutz, /cookie-richtlinie (Kandidat fuer style.css).
   Reihenfolge (website-bauen 2B.1): 1 Kopf · 2 Text · 3 dunkler Grund (keiner) · 4 Lesegroessen klein
   ========================================================================== */

/* ── 1 Kopf: hell, schlicht, Entwurfs-Marker ganz oben ─────────────── */
.recht-kopf { padding: 132px 0 0; background-color: var(--color-bg); }
.recht-wrap { max-width: 820px; }
.recht-marker {
  display: block; padding: 16px 20px; border-radius: 14px; background: var(--color-surface);
  border-left: 3px solid var(--color-error); color: var(--color-text); font-weight: 600;
}
.recht-kopf h1 { margin-top: 36px; font-size: clamp(2.25rem, 5vw, 3.5rem); }
.recht-kopf h1::after {
  content: ""; display: block; width: 72px; height: 1px; margin-top: 22px;
  background: linear-gradient(90deg, var(--ci-bronze), var(--ci-gold));
}

/* ── 2 Text ──────────────────────────────────────────────────────────── */
.recht-sec { padding-top: clamp(36px, 5vw, 56px); }
.recht-text { max-width: var(--measure); color: var(--color-text-2); overflow-wrap: anywhere; }
.recht-text h2 { margin: 2em 0 .6em; font-size: clamp(1.375rem, 2.4vw, 1.75rem); line-height: 1.25; color: var(--color-text); }
.recht-text h2:first-child { margin-top: 0; }
.recht-text h3 { margin: 1.6em 0 .5em; font-size: 1.25rem; color: var(--color-text); }
.recht-text h4 { margin: 1.2em 0 .3em; font-family: var(--font-sans); font-size: 1rem; font-weight: 600; color: var(--color-text); }
.recht-text p + p { margin-top: .9em; }
.recht-text ul { margin: .8em 0 1em 1.3em; display: grid; gap: .4em; }
.recht-text a { color: var(--color-accent-d); text-decoration: underline; text-underline-offset: 3px; }
.recht-text a[href^="mailto:"] { display: inline-block; padding: 10px 0; margin: -10px 0; } /* Tap-Ziel 44 px */
.recht-text a:hover { color: var(--color-accent); }
.recht-text strong { color: var(--color-text); }
.recht-text hr { margin: 2.4em 0 1.2em; border: 0; height: 1px; background: var(--color-border); }
.recht-text .dienst { margin-top: 1.4em; padding: 22px 24px; border-radius: var(--radius); background: var(--color-surface); box-shadow: var(--shadow-md); }
.recht-text .dienst h3 { margin-top: 0; }
.recht-text .dienst-status, .recht-text .dienst-zweck { font-size: 1rem; color: var(--color-muted); }
.recht-text .tabelle-wrap { margin-top: 10px; overflow-x: auto; }
.recht-text table { width: 100%; border-collapse: collapse; font-size: 1rem; }
.recht-text th { text-align: left; padding: 8px 12px 8px 0; color: var(--color-text); border-bottom: 1px solid var(--color-border); }
.recht-text td { padding: 7px 12px 7px 0; border-bottom: 1px solid var(--color-border); vertical-align: top; }

/* ── 3 Zustaende auf dunklem Grund: keine ───────────────────────────── */

/* ── 4 Lesegroessen klein (immer zuletzt) ────────────────────────────── */
@media (max-width: 699px) {
  .recht-kopf { padding-top: 104px; }
  .recht-kopf h1 { margin-top: 26px; }
  .recht-text .dienst { padding: 18px 16px; }
}
