/* Impressum und Datenschutz. Bewusst eigenes, sehr schlichtes Blatt und
   nicht style.css: Diese Seiten sind zum Lesen da, nicht zum Wirken. Sie
   brauchen weder GSAP noch die Bildwelt, und je weniger sie mitziehen,
   desto sicherer laufen sie auch dann, wenn an der Hauptseite gebaut wird.

   Farben und Schriften kommen aus der Haus-CI (css/ci.css). */

:root {
  --grund: var(--ba-canvas);
  --papier: var(--ba-canvas-soft);
  --text: var(--ba-ink-secondary);
  --stark: var(--ba-ink);
  --leise: var(--ba-ink-mute);
  --linie: var(--ba-hairline);
  --akzent: var(--ba-primary);
}
@media (prefers-color-scheme: dark) {
  :root {
    --grund: #0B1318;
    --papier: var(--ba-dark-raised);
    --text: #C3CDD2;
    --stark: var(--ba-on-dark);
    --leise: var(--ba-on-dark-mute);
    --linie: var(--ba-hairline-dark);
    --akzent: var(--ba-primary-soft);
  }
}

* { margin: 0; padding: 0; box-sizing: border-box; }

body {
  background: var(--grund);
  color: var(--text);
  font-family: var(--ba-font-body);
  line-height: 1.65;
}

/* Warnband fuer unfertige Rechtsseiten. Auffaellig mit Absicht - es soll
   niemandem entgehen, dass hier noch Angaben fehlen. */
.warnband {
  background: var(--ba-schlecht);
  color: #fff;
  font-family: var(--ba-font-mono);
  font-size: 13px;
  line-height: 1.5;
  padding: 12px 20px;
  text-align: center;
}

.recht {
  max-width: 74ch;
  margin: 0 auto;
  padding: clamp(28px, 5vw, 60px) clamp(18px, 5vw, 32px) 96px;
  display: flex;
  flex-direction: column;
  gap: 34px;
}

.zurueck a {
  font-family: var(--ba-font-mono);
  font-size: 12px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--akzent);
  text-decoration: none;
}
.zurueck a:hover { text-decoration: underline; }

h1 {
  font-family: var(--ba-font-display);
  font-weight: 700;
  letter-spacing: -0.02em;
  font-size: clamp(28px, 5vw, 40px);
  line-height: 1.1;
  color: var(--stark);
  text-wrap: balance;
}

section { display: flex; flex-direction: column; gap: 12px; }

h2 {
  font-family: var(--ba-font-display);
  font-weight: 700;
  font-size: clamp(17px, 2.6vw, 20px);
  letter-spacing: -0.01em;
  color: var(--stark);
  border-bottom: 1px solid var(--linie);
  padding-bottom: 8px;
}

h3 {
  font-family: var(--ba-font-display);
  font-weight: 600;
  font-size: 15px;
  color: var(--stark);
  margin-top: 6px;
}

p, li { font-size: 15.5px; }
ul, ol { padding-left: 1.3em; display: flex; flex-direction: column; gap: 6px; }

a { color: var(--akzent); }

.anschrift { background: var(--papier); border: 1px solid var(--linie); padding: 16px 18px; }
.anschrift strong { color: var(--stark); font-weight: 600; }

/* Beschriftung links, Wert rechts - auf schmalen Geraeten untereinander. */
dl {
  display: grid;
  grid-template-columns: minmax(160px, 34%) 1fr;
  gap: 8px 18px;
  font-size: 15.5px;
}
dt { font-weight: 600; color: var(--stark); }
dd { color: var(--text); }
@media (max-width: 620px) {
  dl { grid-template-columns: 1fr; gap: 2px; }
  dt { margin-top: 10px; }
}

/* Noch auszufuellende Angabe. Sieht bewusst nach Baustelle aus. */
.fehlt {
  display: inline-block;
  background: color-mix(in srgb, var(--ba-schlecht) 14%, transparent);
  border: 1px dashed var(--ba-schlecht);
  color: var(--ba-schlecht);
  font-family: var(--ba-font-mono);
  font-size: 12.5px;
  padding: 1px 7px;
}

.stand { font-family: var(--ba-font-mono); font-size: 12.5px; color: var(--leise); }

table { border-collapse: collapse; width: 100%; font-size: 14.5px; }
th, td { text-align: left; border-bottom: 1px solid var(--linie); padding: 8px 10px; vertical-align: top; }
th { color: var(--stark); font-weight: 600; }
.tabellenrahmen { overflow-x: auto; }