/* ============================================================
   recht.css — AGB, Anbietervertrag, Datenschutz, Impressum

   Form am 01.09.2026 an itasap.de/impressum angeglichen: eine
   Spalte von 800 px, Abschnittsüberschriften mit dünner Linie
   darunter statt Trennlinien zwischen den Blöcken, ruhigere
   Zeilenhöhe, und der Betreiberblock als weiche Karte.

   Der Unterschied zu vorher ist nicht Geschmack: eine Linie UNTER
   der Überschrift bindet sie an ihren Abschnitt. Eine Linie
   ZWISCHEN den Blöcken trennt sie von dem, wozu sie gehört — beim
   Überfliegen sucht man dann jedes Mal neu, wo ein Abschnitt
   anfängt.
   ============================================================ */

.rt {
  max-width: 50rem;              /* 800 px */
  margin: 0 auto;
  padding: 72px 24px 96px;
  font-family: var(--font-body, system-ui, sans-serif);
  overflow-wrap: break-word;
}

.rt h1 {
  font-family: var(--font-display, Georgia, serif);
  font-size: clamp(30px, 4.5vw, 40px);
  font-weight: 800;
  line-height: 1.15;
  letter-spacing: -.02em;
  color: var(--ink, #14120E);
  margin: 0 0 28px;
}

/* Entwurfs-Hinweis: nur sichtbar, wenn die Fassung noch nicht gilt. */
.rt-entwurf {
  display: flex; gap: 10px; align-items: flex-start;
  background: #FEF3CD; border: 1px solid #FFC107; border-radius: 10px;
  padding: 12px 14px; margin: 0 0 28px;
  font-size: 14px; line-height: 1.6; color: #6B5416;
}
.rt-entwurf .ico { margin-top: 2px; flex: 0 0 auto; }

.rt-vorwort {
  font-size: 16.5px; line-height: 1.8;
  color: var(--ink2, #4A4845);
  margin: 0 0 36px;
}

/* ── Abschnitte ─────────────────────────────────────────────
   Keine Trennlinie zwischen den Blöcken mehr — die Linie sitzt
   unter der Überschrift und gehört damit zum Abschnitt. */
.rt-block { margin: 0 0 8px; }

.rt h2 {
  font-family: var(--font-display, Georgia, serif);
  font-size: 20px; font-weight: 700; letter-spacing: -.01em;
  color: var(--ink, #14120E);
  margin: 44px 0 14px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--border, rgba(20,18,14,.10));
}
.rt-block:first-child h2 { margin-top: 0; }

.rt h3 {
  font-family: var(--font-display, Georgia, serif);
  font-size: 17px; font-weight: 700; color: var(--ink, #14120E);
  margin: 26px 0 8px;
}

.rt p  { font-size: 16px; line-height: 1.8; color: var(--ink2, #3A3835); margin: 0 0 16px; }
.rt p:last-child { margin-bottom: 0; }
.rt strong { color: var(--ink, #14120E); font-weight: 650; }

.rt ul, .rt ol { margin: 0 0 16px; padding-left: 1.4rem; }
.rt ul { list-style: disc; }
.rt li { font-size: 16px; line-height: 1.8; color: var(--ink2, #3A3835); margin-bottom: 6px; }
.rt li::marker { color: var(--local, #2D6A4F); }

.rt a { color: var(--local, #2D6A4F); text-decoration: underline; text-underline-offset: 2px; }
.rt a:hover { text-decoration-thickness: 2px; }

/* ── Karte für Anschrift und Kontakt ────────────────────────
   Ein Adressblock ist keine Fließtext-Passage; als Karte findet
   man ihn beim Überfliegen sofort wieder. */
.rt-karte {
  background: var(--sand, #F7F4EE);
  border: 1px solid var(--border, rgba(20,18,14,.10));
  border-radius: 12px;
  padding: 20px 22px;
  margin: 0 0 16px;
}
.rt-karte p:last-child { margin-bottom: 0; }

/* "SanxiasWorld by IT-asap GmbH" — der Betreiber eine Stufe leiser.
   Gleich gross gesetzt liest es sich, als hiesse die Firma so. */
.rt-leiser { font-size: .9em; color: var(--ink3, #7A766F); font-weight: 400; }

/* ── Fuß ────────────────────────────────────────────────────
   Nur der Stand. Die E-Mail stand hier ein zweites Mal, obwohl
   sie im Text selbst schon steht — bei Impressum und Datenschutz
   sogar als eigener Abschnitt. */
/* Der Stand ist eine Fussnote, kein Absatz — entsprechend klein.
   Bis 02.09.2026 stand er in 12,5px und damit fast so gross wie der
   Fliesstext; "Fassung 1.0, gueltig ab 28. August 2026 · Stand: 31.
   August 2026" las sich wie eine Aussage statt wie eine Fussnote. */
.rt-fuss {
  margin: 48px 0 0;
  padding-top: 14px;
  border-top: 1px solid var(--border, rgba(20,18,14,.08));
  font-size: 11px;
  letter-spacing: .01em;
  line-height: 1.6;
  color: var(--ink3, #9A968F);
}

/* ── Fusszeile der Rechtsseiten ─────────────────────────────
   Bewusst schmal: nur die Dokumente, die zusammengehoeren. Der
   grosse Website-Footer verlinkt Angebot, Anmeldung und Gutscheine
   — auf einer Rechtsseite sucht das niemand, und vor dem Start
   wollen wir es dort auch nicht anbieten. */
.rt-seitenfuss {
  max-width: 50rem;
  margin: 0 auto;
  padding: 22px 24px 56px;
  display: flex; flex-wrap: wrap; gap: 8px 20px;
  align-items: baseline; justify-content: space-between;
  font-size: 11.5px; line-height: 1.7;
  color: var(--ink3, #9A968F);
}
.rt-seitenfuss .rf-links { display: flex; flex-wrap: wrap; gap: 0 4px; align-items: baseline; }
.rt-seitenfuss a {
  color: var(--ink3, #8A867F);
  text-decoration: none;
}
.rt-seitenfuss a:hover { color: var(--local, #2D6A4F); text-decoration: underline; }
.rt-seitenfuss .rf-trenner { margin: 0 6px; opacity: .5; }

@media (max-width: 600px) {
  .rt   { padding: 48px 20px 72px; }
  .rt h2 { margin-top: 34px; }
  .rt-seitenfuss { padding: 18px 20px 48px; }
}
