/* Rechtsseiten: Impressum und Datenschutz – ergänzt styles.css */

.recht-kopf { border-bottom: 1px solid var(--linie); }
.recht-zurueck {
  display: inline-flex; align-items: center; gap: 8px; min-height: 44px;
  font-family: var(--font-display); font-size: 15px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; text-decoration: none;
}
.recht-zurueck svg { width: 20px; height: 20px; flex: none; }
.recht-zurueck:hover { text-decoration: underline; }

.recht { padding: clamp(48px, 6vw, 88px) 0 clamp(64px, 8vw, 112px); }
.recht .wrap { max-width: calc(880px + 2 * var(--gutter)); }
.recht h1 {
  margin-bottom: 14px; color: var(--grau);
  font-size: clamp(34px, 4.2vw, 54px); font-weight: 300; line-height: 1.08; letter-spacing: .04em; text-transform: uppercase;
  text-wrap: balance; hyphens: manual; overflow-wrap: break-word;
}
.recht__stand { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; margin: 0 0 36px; font-size: 16px; color: var(--tinte-2); }
.recht__hinweis { padding: 3px 12px; border-radius: 999px; background: #FFF3C4; color: var(--tinte); font-weight: 600; }
.recht__einleitung { font-size: clamp(19px, 1.5vw, 21px); }

.recht p, .recht li { max-width: 70ch; color: var(--tinte-2); }
.recht strong { color: var(--tinte); }
.recht ul { margin: 0 0 1em; padding-left: 1.3em; }
.recht li + li { margin-top: 6px; }
.recht li::marker { color: var(--gruen-ui); }

.recht h2 {
  display: flex; align-items: baseline; gap: 14px;
  margin: 52px 0 14px; padding-top: 28px; border-top: 1px solid var(--linie);
  font-size: clamp(22px, 2vw, 26px); font-weight: 600; line-height: 1.25; color: var(--tinte);
}
.recht h3 { margin: 26px 0 6px; font-family: var(--font-display); font-size: 20px; font-weight: 700; color: var(--tinte); }
.recht .nr {
  flex: none; display: inline-grid; place-items: center; width: 34px; height: 34px; border-radius: 50%;
  background: var(--gruen-hauch); color: var(--gruen-text); font-size: 17px; font-weight: 700; font-variant-numeric: tabular-nums;
}
.recht address, .recht-adresse { font-style: normal; color: var(--tinte); line-height: 1.6; }
.recht-adresse { margin: 0 0 14px; padding: 18px 22px; border-radius: var(--r-m); background: var(--papier); }

/* Impressum: Eckdaten als Raster */
.recht-karte { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; margin-bottom: 8px; }
.recht-feld { padding: 20px 22px; border: 1px solid var(--linie); border-radius: var(--r-m); background: #fff; }
.recht .recht-feld h2 {
  display: block; margin: 0 0 8px; padding: 0; border: 0;
  font-size: 14px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--gruen-text);
}
.recht-feld p, .recht-feld address { margin: 0; color: var(--tinte); }

/* Datenschutz: Inhaltsverzeichnis */
.inhalt { margin: 32px 0 8px; padding: 22px 26px; border-radius: var(--r-m); background: var(--papier); }
.recht .inhalt h2 {
  display: block; margin: 0 0 10px; padding: 0; border: 0;
  font-size: 14px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--gruen-text);
}
.inhalt ol { columns: 2; column-gap: 40px; margin: 0; padding-left: 1.5em; }
.inhalt li { break-inside: avoid; margin: 0 0 6px; font-variant-numeric: tabular-nums; }
.inhalt li::marker { color: var(--gruen-text); font-weight: 700; }

.recht-fuss .fuss__leiste { border-top: 0; }

@media (max-width: 760px) {
  body.recht-seite { padding-bottom: 0; }
  .recht-karte { grid-template-columns: 1fr; }
  .inhalt ol { columns: 1; }
  .recht h2 { gap: 12px; }
  .recht-zurueck span, .recht-zurueck { font-size: 14px; }
}
