/* ==========================================================
   TUCHFABRIK BERLIN · Rechtstexte (Datenschutz, Impressum, DE + EN)
   Struktur aus dem Rechtstexte-Paket (02.10.2026), Gestaltung im
   aktuellen CI: Plex Sans, Bordeaux/Anthrazit, eckige Elemente.
   ========================================================== */

.legal-hero {
  background: var(--surface);
  border-bottom: 1px solid var(--line);
  padding: clamp(48px, 7vw, 80px) 0 clamp(32px, 5vw, 48px);
}
.legal-hero .page-title {
  font-family: var(--font-display); font-weight: 600; letter-spacing: -.01em;
  font-size: clamp(2rem, 4vw, 3.2rem); line-height: 1.05;
  margin: 0 0 16px; color: var(--brand-ink);
}
.legal-hero .lede { max-width: 62ch; color: var(--ink-muted); font-size: 1.05rem; line-height: 1.6; margin: 0; }
.legal-meta {
  margin-top: 22px; display: flex; flex-wrap: wrap; gap: 6px 22px;
  font-size: .74rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--brand-slate);
}

/* ---------- Layout: Inhaltsverzeichnis + Text ---------- */
.legal-layout {
  display: grid; grid-template-columns: 1fr; gap: 40px;
  padding: clamp(40px, 6vw, 72px) 0 clamp(64px, 9vw, 112px);
}
@media (min-width: 960px) {
  .legal-layout { grid-template-columns: 250px minmax(0, 1fr); gap: 72px; }
  .legal-layout.single { grid-template-columns: minmax(0, 1fr); }
}

.legal-toc { font-size: .9rem; }
@media (min-width: 960px) {
  .legal-toc { position: sticky; top: 112px; align-self: start; max-height: calc(100vh - 136px); overflow: auto; }
}
.legal-toc .toc-label {
  font-size: .74rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase;
  color: var(--brand-slate); margin-bottom: 12px;
}
.legal-toc ol { list-style: none; margin: 0; padding: 0; border-left: 2px solid var(--line); }
.legal-toc li { margin: 0; }
.legal-toc a {
  display: grid; grid-template-columns: 2.2em 1fr;
  padding: 6px 0 6px 14px; margin-left: -2px; border-left: 2px solid transparent;
  color: var(--brand-ink); text-decoration: none; line-height: 1.35;
}
.legal-toc a .n { font-size: .8em; font-weight: 600; color: var(--brand-red-d); padding-top: .1em; }
.legal-toc a:hover, .legal-toc a:focus-visible { border-left-color: var(--brand-red-d); color: var(--brand-red-d); }

/* ---------- Fließtext ---------- */
.legal-body { max-width: 72ch; color: var(--brand-ink); line-height: 1.7; font-size: 1rem; }
.legal-body section { padding-top: 8px; margin-bottom: 52px; scroll-margin-top: 112px; }
.legal-body h2 {
  display: flex; align-items: baseline; gap: 14px;
  font-family: var(--font-display); font-weight: 600; letter-spacing: -.01em;
  font-size: clamp(1.35rem, 2.2vw, 1.7rem); line-height: 1.2;
  margin: 0 0 18px; padding-bottom: 12px; border-bottom: 1px solid var(--line);
}
.legal-body h2 .n { font-size: .8rem; font-weight: 600; letter-spacing: .08em; color: var(--brand-red-d); flex: none; }
.legal-body h3 { font-size: 1.05rem; font-weight: 600; margin: 28px 0 8px; }
.legal-body h2 + h3 { margin-top: 4px; }
.legal-body p { margin: 0 0 14px; }
.legal-body ul { margin: 0 0 16px; padding-left: 1.2em; }
.legal-body li { margin-bottom: 6px; }
.legal-body li::marker { color: var(--brand-red-d); }
.legal-body a { color: inherit; text-decoration-color: var(--brand-red); text-underline-offset: 3px; }
.legal-body a:hover { color: var(--brand-red-d); }
.legal-body strong { font-weight: 600; }

/* Adressblöcke */
.legal-address {
  background: var(--surface); border-left: 3px solid var(--brand-red-d); border-radius: var(--radius-sm);
  padding: 18px 22px; margin: 0 0 16px; font-style: normal; line-height: 1.6;
}
.legal-address .org { font-weight: 600; }

/* Daten-/Rechtsgrundlagen-Raster */
.legal-facts { display: grid; grid-template-columns: 1fr; margin: 8px 0 18px; border-top: 1px solid var(--line); }
.legal-body h2 + .legal-facts { border-top: 0; margin-top: 0; }
.legal-facts > div { display: grid; grid-template-columns: 1fr; gap: 2px 24px; padding: 12px 0; border-bottom: 1px solid var(--line); }
@media (min-width: 640px) { .legal-facts > div { grid-template-columns: 170px 1fr; } }
.legal-facts dt {
  font-size: .74rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase;
  color: var(--brand-slate); padding-top: .25em;
}
.legal-facts dd { margin: 0; }

/* Hervorgehobener Hinweis (Widerspruchsrecht, Art. 21 Abs. 4 DSGVO) */
.legal-callout {
  border: 1px solid var(--brand-ink); border-left: 4px solid var(--brand-red-d); border-radius: var(--radius-sm);
  padding: 20px 22px; margin: 20px 0;
}
.legal-callout h3 { margin-top: 0; }

/* Platzhalter für noch unbestätigte Angaben – vor Livegang füllen */
.ph {
  background: var(--status-prep-bg); color: var(--status-prep);
  border-bottom: 1px dashed var(--status-prep); padding: 0 .3em; font-style: normal; font-weight: 500;
}
.ph-note {
  font-size: .86rem; background: var(--status-prep-bg); color: var(--status-prep);
  border-left: 3px solid var(--status-prep); border-radius: var(--radius-sm); padding: 10px 14px; margin: 0 0 16px;
}

.legal-note-lang {
  font-size: .92rem; color: var(--ink-muted);
  border-left: 3px solid var(--line); padding: 4px 0 4px 14px; margin: 0 0 40px;
}

.legal-back-top { font-size: .78rem; font-weight: 500; letter-spacing: .06em; text-transform: uppercase; }

@media print {
  header.site, footer.site, .legal-toc, .legal-back-top { display: none !important; }
  .legal-layout { display: block; padding: 0; }
  .legal-hero { background: none; padding: 0 0 16px; }
  .ph, .ph-note { background: none; }
}