/* Impressum und Datenschutzerklärung — die beiden öffentlichen Pflichtseiten.
 *
 * Eine gemeinsame Datei statt zweier `<style>`-Blöcke: Zwei Kopien desselben
 * Blocks weichen beim fünften Absatz voneinander ab. Genau dafür gibt es
 * `forms.css` schon als Beispiel.
 *
 * Nur semantische Tokens. Kein eigener Farbwert.
 *
 * Diese Seiten sind ohne Anmeldung erreichbar und müssen es sein: § 5 DDG
 * verlangt „leicht erkennbar, unmittelbar erreichbar und ständig verfügbar".
 * Eine Pflichtangabe hinter einer Anmeldung ist keine. Deshalb tragen sie
 * auch nicht die Anwendungsschale (`.app`, Seitenleiste, Sitzung), sondern
 * stehen für sich. */

body.recht{
  background:var(--surface-gray);
  color:var(--ink);
  font-family:var(--font);
  margin:0;
  /* `min-height:100dvh` und nicht `100vh`: Auf dem Telefon wandert die
     Adressleiste, und `vh` rechnet mit dem grössten Zustand — der Fuss
     stünde dann unter dem Bildrand. */
  min-height:100dvh;
}

.recht-band{
  background:var(--bg);
  border-bottom:1px solid var(--line);
}
.recht-band .innen{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.recht-band a.zurueck{
  margin-left:auto;font-size:14px;font-weight:600;color:var(--primary-ink);
  text-decoration:none;
  /* 44px Tastfläche (--touch aus dem Leitfaden), ohne das Band zu dehnen:
     Die Polsterung liegt innen, der Ausgleich aussen. */
  padding:12px 4px;
}
.recht-band a.zurueck:hover{text-decoration:underline}
.recht-band img{height:30px;width:auto;display:block}

.innen{max-width:780px;margin:0 auto;padding:0 20px}

main.recht{padding:32px 0 64px}

.recht h1{
  font-family:var(--font-display);font-size:30px;line-height:1.2;
  margin:0 0 6px;font-weight:600;
}
.recht .stand{color:var(--ink-3);font-size:13px;margin:0 0 30px}

.recht h2{
  font-size:18px;line-height:1.35;margin:34px 0 10px;font-weight:600;
  padding-top:18px;border-top:1px solid var(--line);
}
.recht h2:first-of-type{border-top:none;padding-top:0}
.recht h3{font-size:15px;margin:20px 0 6px;font-weight:600}

.recht p,.recht li{font-size:15px;line-height:1.65}
.recht p{margin:0 0 12px}
.recht ul{margin:0 0 12px;padding-left:20px}
.recht li{margin-bottom:6px}
.recht a{color:var(--primary-ink)}

/* Eine Angabe mit Bezeichner — für die Pflichtangaben nach § 5 DDG. Auf
   schmalen Schirmen untereinander, sonst zweispaltig. Dieselbe Bauart wie
   `.kv` im Portal; hier eigenständig, weil diese Seiten `portal.css` nicht
   laden (sie gehören zu keiner der beiden Schalen). */
.angaben{display:grid;grid-template-columns:210px 1fr;gap:8px 18px;
         font-size:15px;margin:0 0 16px}
.angaben dt{color:var(--ink-3);font-size:13px;line-height:1.6}
.angaben dd{margin:0}
@media (max-width:640px){
  .angaben{grid-template-columns:1fr;gap:2px 0}
  .angaben dd{margin-bottom:12px}
}


footer.recht-fuss{
  border-top:1px solid var(--line);margin-top:40px;padding:20px 0 40px;
  color:var(--ink-3);font-size:13px;
}
footer.recht-fuss a{color:var(--ink-3)}
footer.recht-fuss nav{display:flex;gap:18px;flex-wrap:wrap}