/* =========================================================================
   legal.css — Textseiten (Erklärung zur Barrierefreiheit)
   Nutzt die Tokens und Bausteine der Hauptseite; hier stehen nur die
   Abweichungen, die eine reine Textseite braucht.
   ========================================================================= */

/* „BARRIEREFREIHEIT" ist mit 16 Zeichen deutlich länger als das längste
   Wort der Hauptseite, an dem die Kurve von .heading ausgerichtet ist.
   Mit deren Obergrenze bräche es bei 320px mitten im Wort um. */
.legal__title {
  font-size: clamp(1.75rem, .9rem + 4.2vw, 3.6rem);
  margin-bottom: .8em;
}

.legal { max-width: 60ch; }

.legal h2 {
  font-size: clamp(1.15rem, 1.05rem + .5vw, 1.45rem);
  color: var(--ink);
  margin: clamp(2.25rem, 5vw, 3rem) 0 .7rem;
}

.legal h2:first-of-type { margin-top: 0; }

.legal ul {
  margin: 0 0 1.15em;
  padding-left: 1.25rem;
}
.legal li { margin-bottom: .4rem; }

.legal address {
  font-style: normal;
  margin-bottom: 1.15em;
}

/* Datum und Herkunft der Erklärung stehen am Ende und dürfen zurücktreten —
   über den Farbton, nicht über Transparenz, sonst fällt der Kontrast. */
.legal__meta {
  margin-top: clamp(2.5rem, 5vw, 3.5rem);
  padding-top: 1.25rem;
  border-top: 2px solid color-mix(in srgb, var(--accent) 55%, transparent);
  font-size: .92rem;
  color: color-mix(in srgb, var(--deep) 88%, var(--bg));
  max-width: 60ch;
}