/* ==========================================================================
   Rechtsseiten (Impressum, Datenschutz) — schlichte Prosa-Seite, nutzt die
   gleiche Nav/Footer/Cookie-Huelle wie index.html, eigenes, einfaches
   Inhalts-Layout ohne Hero/Reveal-Sections.
   ========================================================================== */
.legal{max-width:47.5rem;margin:0 auto;padding:9.375rem 1.375rem 6.25rem}
.legal h1{
  font-family:var(--font-display);font-weight:700;
  font-size:clamp(1.75rem,4vw,2.75rem);line-height:1.1;margin:0 0 0.5rem;
}
.legal .legal-updated{font-size:0.8125rem;color:var(--ink-50);margin:0 0 3rem}
.legal h2{
  font-family:var(--font-display);font-weight:700;font-size:1.1875rem;
  margin:2.75rem 0 0.875rem;padding-top:1.25rem;border-top:1px solid var(--line-soft);
}
.legal h2:first-of-type{border-top:none;padding-top:0;margin-top:0}
.legal p{text-wrap:pretty;font-size:0.9375rem;line-height:1.7;color:var(--ink-70);margin:0 0 0.875rem}
.legal ul{margin:0 0 0.875rem;padding-left:1.25rem}
.legal li{font-size:0.9375rem;line-height:1.7;color:var(--ink-70);margin:0.25rem 0}
.legal a{color:var(--purple-link)}
.legal a:hover{color:#fff}
.legal .legal-meta{
  border:1px solid var(--line);background:var(--surface-2);border-radius:0.875rem;
  padding:1.25rem 1.375rem;margin:0 0 2.5rem;font-size:0.9062rem;line-height:1.7;color:var(--ink-80);
}
.legal .legal-meta strong{color:#fff}
.fill-note{color:var(--yellow);font-style:italic;font-size:.95em}

@media (max-width:900px){.legal{padding:7.5rem 1.25rem 4.5rem}}