/* ==========================================================================
   legal.css – Produktions-Stylesheet für die Rechts-Unterseiten
   /datenschutz/ und /impressum/.
   Finalisiert aus legal-v2.css (letzte freigegebene, nach technischem
   Legal-Audit geltende Version), 1:1 übernommen – keine Design-Änderung in
   diesem Finalisierungsschritt. Beide Seiten laden ausschließlich:
   ../style.css + ../legal.css. style.css und loader.js bleiben unangetastet.
   Ruhige, redaktionelle Fläche: weißer Unterseiten-Header (identisches
   Muster wie auf der Weihnachtsseite), zentrierte Content-Spalte, keine
   Bilder, kein Hero, keine Animation.

   Enthält keine .loader-svg-Regel: Der Startseiten-Loader ist auf
   /datenschutz/ und /impressum/ entfernt (siehe LEGAL-AUDIT.md). Diese
   Datei wirkt ausschließlich auf diese beiden Seiten – keine globale
   Wirkung auf index.html oder /weihnachtsfeiern/.
   ========================================================================== */

/* Kleine Layout-Basis, 1:1 wie in index.html inline <style>, hier ausgelagert
   damit style.css nicht angefasst werden muss. */
html {
  margin: 0;
  padding: 0;
  width: 100%;
  min-height: 100%;
}
body {
  margin: 0;
  padding: 0;
  width: 100%;
  min-height: 100%;
  background: #fff;
}
.website-content {
  position: relative;
  width: 100%;
  min-height: 100vh;
  z-index: 0;
}
/* style.css versteckt #footer unter 768px per Default und blendet ihn erst über
   ein JS-Update wieder ein, das an .hero-scroll-zone / #section-villa-intro hängt.
   Beide existieren auf dieser Seite nicht, daher hier lokal wieder sichtbar machen. */
@media (max-width: 768px) {
  #footer {
    visibility: visible;
  }
}

/* Footer-Fix (identisch zur aktiven Weihnachtsseite): style.css definiert den
   Footer global als sticky Homepage-Reveal-Effekt. Hier lokal vollständig in
   den normalen Dokumentfluss zurückversetzt – kein Durchscheinen, kein
   Flicker, Footer erscheint erst am tatsächlichen Seitenende. */
.footer {
  position: relative;
  bottom: auto;
  z-index: 1;
}

/* Eigenständige weiße Unterseiten-Leiste, symmetrisches vertikales Padding,
   kein Overlay – identisches Muster wie auf der aktiven Weihnachtsseite. */
.header {
  background: #fff;
  padding-bottom: 28px;
}
.header .nav-link {
  color: #242424;
}
.header .logo-img {
  filter: invert(1);
}
.hamburger-line {
  background: #242424;
}

/* ==========================================================================
   RECHTSSEITEN-CONTENT
   Ruhiger Contentbereich, Content-Breite ca. 900px, keine Bilder, kein Hero,
   keine Animation. Bestehende Zwischenüberschriften der Rechtstexte werden
   sauber hierarchisiert (h3), ohne den Text zu verändern.
   ========================================================================== */
.legal-page {
  background: #fff;
  padding: 72px 0 128px;
}
.legal-page__container {
  max-width: 900px;
  margin: 0 auto;
  padding: 0 28px;
  box-sizing: border-box;
}
.legal-page__title {
  margin: 0 0 44px;
  color: #1a1a1a;
  font-family: "Instrument Serif", serif;
  font-weight: 400;
  font-size: clamp(2.5rem, 4vw, 3.25rem);
  line-height: 1.15;
}
.legal-page__body {
  color: #333;
  font-family: "Google Sans", sans-serif;
  font-size: 1.0625rem;
  line-height: 1.7;
}
.legal-page__body h3 {
  margin: 44px 0 14px;
  color: #1a1a1a;
  font-family: "Instrument Serif", serif;
  font-weight: 400;
  font-size: 1.5rem;
  line-height: 1.3;
}
.legal-page__body h3:first-child {
  margin-top: 0;
}
.legal-page__body p {
  margin: 0 0 18px;
}
.legal-page__body p:last-child {
  margin-bottom: 0;
}
.legal-page__body a {
  color: #1a1a1a;
  text-decoration: underline;
}
.legal-page__body strong {
  font-weight: 600;
}

@media (max-width: 767px) {
  .legal-page {
    padding: 56px 0 96px;
  }
  .legal-page__container {
    padding: 0 20px;
  }
  .legal-page__title {
    font-size: clamp(2rem, 8vw, 2.5rem);
    margin-bottom: 32px;
  }
  .legal-page__body h3 {
    margin: 36px 0 12px;
    font-size: 1.375rem;
  }
}