/* =========================================================
   TTC Bonn-Ippendorf e. V.
   recht.css — kleine Ergänzung ausschließlich für die
   Fließtextseiten Impressum und Datenschutz.

   Baut nur auf den vorhandenen Tokens auf. Keine neuen Farben,
   keine neuen Schriften. Wird nach sections.css eingebunden.
   ========================================================= */

/* --- Seitenkopf: Kapitelmarke, Überschrift, Zurück-Link --------------- */

.rechtskopf {
  display: grid;
  gap: var(--raum-s);
  max-width: var(--breite-text);
  margin-bottom: var(--raum-xl);
}

/* Der Zurück-Link soll nicht auf volle Spaltenbreite laufen. */
.rechtskopf__zurueck { justify-self: start; margin-top: var(--raum-2xs); }

/* --- Fließtext ------------------------------------------------------- */

.prosa { max-width: var(--breite-text); }

/* Abschnitte werden durch Luft und eine feine Linie getrennt. */
.prosa h2 {
  margin-top: var(--raum-xl);
  margin-bottom: var(--raum-s);
  padding-top: var(--raum-m);
  border-top: 1px solid var(--linie);
}

.prosa > h2:first-child { margin-top: 0; padding-top: 0; border-top: 0; }

.prosa h3 { margin-top: var(--raum-m); margin-bottom: var(--raum-2xs); }

.prosa p { line-height: 1.7; margin-bottom: var(--raum-s); }

/* base.css entfernt die Aufzählungszeichen global. Hier zurückholen. */
.prosa ul,
.prosa ol {
  list-style: disc;
  padding-left: 1.25rem;
  margin-bottom: var(--raum-s);
}

.prosa ol { list-style: decimal; }

.prosa li { line-height: 1.7; margin-bottom: var(--raum-2xs); }

.prosa li::marker { color: var(--gruen); }

.prosa a {
  color: var(--gruen);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.prosa a:hover { text-decoration-thickness: 2px; }

.prosa strong { font-weight: 700; }

/* --- Angaben in Feld und Wert, etwa Kontakt und Registereintrag ------- */

.prosa dl { margin: 0 0 var(--raum-m); padding: 0; }

.prosa dt {
  font-family: var(--schrift-mono);
  font-size: var(--text-mikro);
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--tinte-leise);
}

.prosa dd { margin: 0 0 var(--raum-xs); line-height: 1.7; }

.prosa address {
  font-style: normal;
  line-height: 1.7;
  margin-bottom: var(--raum-m);
}

/* Der Warnkasten aus sections.css steht über dem Text, nicht darin.
   Innerhalb des Kastens gelten die Fließtext-Abstände nicht. */
.prosa .beitrag__hinweis { margin-bottom: var(--raum-l); }

.prosa .beitrag__hinweis h2,
.prosa .beitrag__hinweis h3,
.prosa .beitrag__hinweis p { margin: 0; padding: 0; border: 0; }

@media (min-width: 44rem) {
  /* Ab hier stehen Feld und Wert nebeneinander statt untereinander. */
  .prosa dl {
    display: grid;
    grid-template-columns: 9rem minmax(0, 1fr);
    gap: var(--raum-2xs) var(--raum-m);
    align-items: baseline;
  }
  .prosa dd { margin-bottom: 0; }
}