/* =========================================================
   Zusatz-Styles für Impressum & Datenschutz
   (wird zusätzlich zu style.css geladen)
   ========================================================= */

/* Roter Seitenkopf mit Titel */
.page-hero {
  background: var(--red);
  color: var(--white);
  padding-block: var(--section-pad);
}
.page-hero__back {
  display: inline-flex; align-items: center; gap: .4rem;
  margin-bottom: 1rem;
  font-size: var(--fs-small);
  text-decoration: none;
  opacity: .9;
}
.page-hero__back:hover { text-decoration: underline; opacity: 1; }
.page-hero h1 {
  font-size: clamp(1.6rem, 1.2rem + 2vw, 2.8rem);
  font-weight: 300;
  letter-spacing: .08em;
  text-transform: uppercase;
}

/* Inhaltsbereich */
/* Gleiche Breite wie der Seitenkopf → Text bündig mit der Überschrift.
   Nur die Zeilenlänge wird begrenzt, damit der Text lesbar bleibt. */
.legal {
  padding-block: var(--section-pad);
}
.legal > * { max-width: 900px; }
.legal h2 {
  margin: 2.75rem 0 .75rem;
  color: var(--red);
  font-size: clamp(1.1rem, 1rem + .4vw, 1.35rem);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .04em;
}
.legal h2:first-child { margin-top: 0; }
.legal h3 {
  margin: 1.75rem 0 .5rem;
  color: var(--grey-dark);
  font-size: clamp(1rem, .95rem + .25vw, 1.15rem);
  font-weight: 700;
}
.legal p,
.legal address { margin: 0 0 1rem; font-style: normal; line-height: 1.7; }
.legal ul { margin: 0 0 .8rem; padding-left: 1.3rem; }
.legal li { margin-bottom: .25rem; }
.legal a { color: var(--red); }
.legal__box {
  background: var(--grey-light);
  border-left: 3px solid var(--red);
  padding: 1rem 1.25rem;
  margin-bottom: 1rem;
}
.legal__date { margin-top: 2.5rem; font-size: var(--fs-small); color: var(--grey); }

/* Gelb markierte Platzhalter – vor Veröffentlichung ersetzen! */
mark.todo {
  background: #fff3b0;
  color: #6b5500;
  padding: 0 .25em;
  border-radius: 2px;
}