/* =========================================================================
   Glasklar · Rechtstexte
   Impressum, Datenschutz (Clubbase, CampingReport, Nuvario Sports), AGB
   und Einrichtungs-Leitfaden. Baut auf glasklar.css auf
   (.page-hero, .prose, .prose-layout, .toc, .callout) und enthaelt nur Regeln
   dieser Seiten. Lesbarkeit vor Effekten: Bewegung nur im Seitenkopf.
   ========================================================================= */

/* ---------- Seitenkopf ---------- */
.page-hero--recht { padding-bottom: 56px; }
.page-hero--recht h1 { font-size: clamp(38px, 4.6vw, 64px); max-width: 860px; }
.page-hero--recht .lead { max-width: 660px; }
.page-hero--recht .kicker-pill { margin-top: 8px; }
.page-hero--recht .hero-ctas { margin-top: 30px; }
.page-hero--recht h1 { overflow-wrap: break-word; -webkit-hyphens: auto; hyphens: auto; }
.recht-top { margin-bottom: 2px; }
.recht-body { padding-bottom: 120px; }
/* Unterabschnitte (Impressum/Datenschutz) sind <section>: globales Sektions-Padding aus glasklar.css aufheben */
.page-recht .prose-part { padding-block: 0; }

/* ---------- Lesebereich ---------- */
.page-recht .prose { overflow-wrap: break-word; -webkit-hyphens: auto; hyphens: auto; }
.page-recht .prose a { -webkit-hyphens: none; hyphens: none; }
.page-recht .prose .nobr { -webkit-hyphens: none; hyphens: none; white-space: nowrap; }
.prose-part + .prose-part { margin-top: 64px; }
.prose-part > h2:first-child {
  margin-top: 0; font-size: clamp(28px, 3vw, 38px); letter-spacing: -0.03em;
}
.prose-part > h2:first-child + .prose-meta { margin-top: -4px; }
.prose-part > hr:last-child { display: none; }

.prose .prose-meta { margin-bottom: 30px; }
.prose .prose-lead {
  margin-bottom: 34px; padding: 16px 20px; border-radius: 16px;
  background: rgba(var(--brand-rgb), .06); color: var(--ink); font-size: 16px; line-height: 1.6;
}

.prose .addr {
  display: block; margin: 6px 0 20px; padding: 18px 22px; border-radius: 18px;
  background: rgba(255, 255, 255, .62); border: 1px solid rgba(var(--ink-rgb), .08);
  line-height: 1.75; color: var(--ink);
}
.prose .addr a { color: var(--brand); }

.prose .callout { margin: 10px 0 26px; }
.prose .callout p { margin: 0; font-size: 16px; line-height: 1.65; color: var(--ink2); }

.prose .prose-stand {
  margin-top: 44px; padding-top: 20px; border-top: 1px solid rgba(var(--ink-rgb), .1);
  font-size: 14px; line-height: 1.6; color: var(--ink3);
}
.prose .prose-stand em { font-style: normal; }
.prose .prose-end {
  margin-top: 40px; padding: 18px 22px; border-radius: 18px;
  background: rgba(var(--brand-rgb), .06); color: var(--ink); font-size: 16px;
}

/* ---------- Leitfaden: Schrittnummern und Pflicht-/Optional-Kennzeichen ---------- */
.prose h2 .step-num {
  display: inline-flex; align-items: center; justify-content: center;
  width: 36px; height: 36px; margin-right: 14px; border-radius: 50%;
  position: relative; top: -3px; vertical-align: middle;
  background: var(--brand); color: #fff;
  font-family: var(--mono); font-size: 15px; font-weight: 600; letter-spacing: 0;
  box-shadow: 0 6px 16px rgba(var(--brand-rgb), .28);
}
.req {
  display: inline-flex; align-items: center; min-height: 24px; margin-left: 10px; padding: 2px 10px;
  position: relative; top: -2px; vertical-align: middle; white-space: nowrap;
  border-radius: 999px; font-family: var(--mono); font-size: 11.5px; font-weight: 500;
  letter-spacing: .06em; text-transform: uppercase; line-height: 1.4;
}
.req--pflicht { color: var(--brand-deep); background: rgba(var(--brand-rgb), .1); }
.req--optional { color: var(--ink2); background: rgba(var(--ink-rgb), .06); }

/* ---------- Inhaltsverzeichnis ---------- */
/* Das Verzeichnis scrollt bei langen Rechtstexten mit. Der Scrollbalken lief
   dabei als zweite senkrechte Kante dicht innerhalb der Kartenkante mit und
   sah aus wie ein Rahmen im Rahmen. Darum ist er ausgeblendet; gescrollt wird
   weiterhin mit Rad, Geste und Tastatur. */
.page-recht .toc {
  max-height: calc(100vh - var(--pv) - 128px); overflow-y: auto;
  overscroll-behavior: contain; scrollbar-width: none; -ms-overflow-style: none;
}
.page-recht .toc::-webkit-scrollbar { width: 0; height: 0; }
.toc ol.sub { margin: 0 0 6px 16px; }
.toc ol.sub a { min-height: 36px; font-size: 13.5px; }
.toc ol.sub a::before { width: 4px; height: 4px; }

.toc-mobile { display: none; }
.toc-mobile summary {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  min-height: 56px; padding: 0 22px; cursor: pointer; list-style: none;
  font-weight: 600; color: var(--ink);
}
.toc-mobile summary::-webkit-details-marker { display: none; }
.toc-mobile summary::after {
  content: ''; width: 9px; height: 9px; flex-shrink: 0;
  border-right: 2px solid currentColor; border-bottom: 2px solid currentColor;
  transform: translateY(-3px) rotate(45deg); transition: transform .2s var(--ease);
}
.toc-mobile[open] summary::after { transform: translateY(2px) rotate(-135deg); }
.toc-mobile ol { list-style: none; display: grid; gap: 2px; padding: 0 12px 14px; }
.toc-mobile ol.sub { padding: 0 0 4px 14px; }
.toc-mobile a {
  display: flex; align-items: center; gap: 10px; min-height: 44px; padding: 6px 10px; border-radius: 12px;
  color: var(--ink2); text-decoration: none; font-size: 15px; line-height: 1.35;
}
.toc-mobile a::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: rgba(var(--ink-rgb), .18); flex-shrink: 0; }
.toc-mobile a:hover { color: var(--ink); background: rgba(255, 255, 255, .7); }

@media (max-width: 1080px) {
  .page-recht .toc { display: none; }
  .toc-mobile { display: block; width: 100%; max-width: 820px; margin: 0 auto 18px; border-radius: 22px; }
}

@media (max-width: 600px) {
  .page-hero--recht { padding-bottom: 40px; }
  .page-hero--recht h1 { font-size: clamp(34px, 9.6vw, 44px); }
  .recht-body { padding-bottom: 80px; }
  .prose-part + .prose-part { margin-top: 48px; }
  .prose .addr { padding: 16px 18px; }
  .prose .prose-lead, .prose .prose-end { padding: 14px 16px; }
  .prose h2 .step-num { width: 32px; height: 32px; margin-right: 10px; font-size: 14px; }
  .req { margin-left: 6px; }
  .toc-mobile summary { padding: 0 18px; }
}

/* ---------- Druck ---------- */
@media print {
  .preview-bar, .nav-wrap, .bg, #footer, .toc, .toc-mobile, .skip-link, .recht-top,
  .page-hero--recht .hero-ctas, .kicker-pill .dot { display: none !important; }
  html, body { background: #fff !important; color: #000 !important; }
  .page-hero--recht { padding: 0 0 12px !important; }
  .rv { opacity: 1 !important; transform: none !important; }
  .glass, .prose, .kicker-pill {
    background: none !important; border: 0 !important; box-shadow: none !important;
    -webkit-backdrop-filter: none !important; backdrop-filter: none !important;
  }
  .glass::before, .glass::after { display: none !important; }
  .prose { max-width: none; padding: 0 !important; font-size: 11pt; }
  .prose-layout { display: block; }
  .prose p, .prose li, .prose address, .prose .addr, .prose .callout p, .prose .prose-stand,
  .page-hero--recht .lead, .page-hero--recht h1, .prose h2, .prose h3 { color: #000 !important; }
  .page-hero--recht h1 .accent { color: #000 !important; }
  .prose a { color: #000 !important; text-decoration: underline; }
  .prose .addr, .prose .prose-lead, .prose .prose-end { background: none !important; border: 1px solid #999 !important; }
  .prose h2, .prose h3 { break-after: avoid; }
  .prose .addr, .prose .callout { break-inside: avoid; }
  .prose h2 .step-num { background: none !important; color: #000 !important; border: 1px solid #000; box-shadow: none; }
}

/* ---------- Fusszeile der Sports-Rechtsseiten ----------
   Dieselbe Fusszeile wie auf den Sports-Seiten (Baustein footer-sports):
   Trennpunkte zwischen den Links, am Telefon ohne. Nur unter .theme-sports,
   damit die blauen Rechtsseiten (AGB Nuvario, Impressum) unveraendert bleiben. */
.theme-sports .foot .foot-sep { display: inline-flex; align-items: center; color: var(--ink3); padding: 0 2px; }
.theme-sports .foot ul li { display: inline-flex; align-items: center; }
@media (max-width: 600px) {
  .theme-sports .foot .foot-sep { display: none; }
}