/* =====================================================================
   Lindenhof · Home-Overrides
   - Featured Image / Page-Title-Header verstecken
   - Hero full-bleed (volle Bildschirmbreite, aus Container ausbrechen)
   - Header auf der Startseite transparent über Hero
   ===================================================================== */

/* ---------- Page-Title / Featured-Image-Header verstecken ---------- */
body.home .entry-header,
body.home .entry-title,
body.home .page-header,
body.home .page-title,
body.home .post-thumbnail,
body.home .post-image,
body.home .featured-image,
body.home .featured-media,
body.home .has-post-thumbnail .post-thumbnail,
body.home .at-page-header,
body.home .atomion-page-header,
body.home .at-featured,
body.home .at-hero,
body.home .at-page-title,
body.page-id-17 .entry-header,
body.page-id-17 .entry-title,
body.page-id-17 .page-header,
body.page-id-17 .page-title,
body.page-id-17 .post-thumbnail,
body.page-id-17 .post-image,
body.page-id-17 .featured-image,
body.page-id-17 .featured-media,
body.page-id-17 .at-page-header,
body.page-id-17 .atomion-page-header,
body.page-id-17 .at-featured,
body.page-id-17 .at-hero,
body.page-id-17 .at-page-title {
  display: none !important;
}

/* Falls das Theme Featured Image als <img class="wp-post-image"> direkt im Content rendert */
body.home .entry-content > .wp-post-image,
body.page-id-17 .entry-content > .wp-post-image {
  display: none !important;
}

/* =====================================================================
   Content-Container öffnen — Hero soll full-bleed werden können
   ===================================================================== */
body.home .site-content,
body.home .content-area,
body.home .site-main,
body.home main,
body.home .entry-content,
body.home article,
body.home .post,
body.home .page,
body.page-id-17 .site-content,
body.page-id-17 .content-area,
body.page-id-17 .site-main,
body.page-id-17 main,
body.page-id-17 .entry-content,
body.page-id-17 article,
body.page-id-17 .post,
body.page-id-17 .page {
  max-width: none !important;
  width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-top: 0 !important;
  margin-top: 0 !important;
  background: transparent;
}

/* erste Section-Block direkt am oberen Rand */
body.home .entry-content > *:first-child,
body.page-id-17 .entry-content > *:first-child {
  margin-top: 0 !important;
}

/* =====================================================================
   HERO full-bleed — bricht aus jedem Container aus
   ===================================================================== */
.lh-hero {
  position: relative;
  width: 100vw !important;
  max-width: none !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  margin-top: 0 !important;
  /* Platz für transparenten Header oben */
  padding-top: clamp(96px, 11vh, 140px);
  padding-bottom: clamp(48px, 6vh, 80px);
}

/* Andere lh-sections: in Container halten */
body.home .lh-section:not(.lh-hero),
body.page-id-17 .lh-section:not(.lh-hero) {
  width: 100%;
  max-width: none;
  margin-left: 0;
  margin-right: 0;
}

/* Section-Backgrounds full-bleed, Inhalt zentriert */
body.home .lh-section--alt,
body.page-id-17 .lh-section--alt {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}

/* =====================================================================
   HEADER transparent über Hero (nur auf Home)
   ===================================================================== */
/* Header über dem Hero — fixed (sticky), transparent solange am Top.
   Wichtig: position: fixed (NICHT absolute), damit der Theme-Sticky beim
   Scrollen weiter funktioniert. */
body.home .site-header,
body.home #masthead,
body.home header.site-header,
body.home .header-main,
body.home .at-header,
body.home .atomion-header,
body.home #site-header,
body.page-id-17 .site-header,
body.page-id-17 #masthead,
body.page-id-17 header.site-header,
body.page-id-17 .header-main,
body.page-id-17 .at-header,
body.page-id-17 .atomion-header,
body.page-id-17 #site-header {
  position: fixed !important;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  background: transparent !important;
  background-color: transparent !important;
  border-bottom: 0 !important;
  box-shadow: none !important;
  z-index: 50;
}

/* Logo & Navigationstexte hell auf Hero */
body.home .site-header,
body.home .site-header a,
body.home .site-header .menu a,
body.home .site-header .site-title,
body.home .site-header .site-title a,
body.home .site-header nav a,
body.home #masthead a,
body.page-id-17 .site-header,
body.page-id-17 .site-header a,
body.page-id-17 .site-header .menu a,
body.page-id-17 .site-header .site-title,
body.page-id-17 .site-header .site-title a,
body.page-id-17 .site-header nav a,
body.page-id-17 #masthead a {
  color: var(--lh-cream-50) !important;
}

body.home .site-header a:hover,
body.page-id-17 .site-header a:hover {
  color: var(--lh-cream-100) !important;
  opacity: .85;
}

/* Site-Logo (falls als <img> mit color-filter): leichtes Anheben */
body.home .site-header .custom-logo,
body.home .site-header img.logo,
body.home .site-header .site-logo img,
body.page-id-17 .site-header .custom-logo,
body.page-id-17 .site-header img.logo,
body.page-id-17 .site-header .site-logo img {
  filter: drop-shadow(0 2px 8px rgba(0,0,0,.35));
}

/* =====================================================================
   Sticky / Scrolled-State — eigene Body-Klasse, theme-unabhängig
   Wird von assets/header-scroll.js gesetzt, sobald window.scrollY > 60.
   So bleibt der Top-Zustand garantiert transparent, egal welche
   Atomion-Klassen sich am Header tummeln.
   ===================================================================== */

/* Header beim Scrollen: solider Creme-Hintergrund + Schatten */
body.home.lh-scrolled .site-header,
body.home.lh-scrolled #masthead,
body.home.lh-scrolled header.site-header,
body.home.lh-scrolled .header-main,
body.home.lh-scrolled .at-header,
body.home.lh-scrolled .atomion-header,
body.home.lh-scrolled #site-header,
body.page-id-17.lh-scrolled .site-header,
body.page-id-17.lh-scrolled #masthead,
body.page-id-17.lh-scrolled header.site-header,
body.page-id-17.lh-scrolled .header-main,
body.page-id-17.lh-scrolled .at-header,
body.page-id-17.lh-scrolled .atomion-header,
body.page-id-17.lh-scrolled #site-header {
  background: var(--lh-cream-100) !important;
  background-color: var(--lh-cream-100) !important;
  box-shadow: var(--lh-shadow-md) !important;
  transition: background-color .25s ease, box-shadow .25s ease;
}

/* Schrift/Logo im Scrolled-Zustand auf Logogrün */
body.home.lh-scrolled .site-header a,
body.home.lh-scrolled .site-header .menu a,
body.home.lh-scrolled .site-header .site-title,
body.home.lh-scrolled .site-header .site-title a,
body.home.lh-scrolled .site-header nav a,
body.home.lh-scrolled #masthead a,
body.page-id-17.lh-scrolled .site-header a,
body.page-id-17.lh-scrolled .site-header .menu a,
body.page-id-17.lh-scrolled #masthead a {
  color: var(--lh-green-700) !important;
}
body.home.lh-scrolled .site-header a:hover,
body.page-id-17.lh-scrolled .site-header a:hover {
  color: var(--lh-green-900) !important;
  opacity: 1;
}

/* Logo-Drop-Shadow im Scrolled-Zustand zurücknehmen */
body.home.lh-scrolled .site-header .custom-logo,
body.home.lh-scrolled .site-header img.logo,
body.home.lh-scrolled .site-header .site-logo img,
body.page-id-17.lh-scrolled .site-header .custom-logo,
body.page-id-17.lh-scrolled .site-header img.logo,
body.page-id-17.lh-scrolled .site-header .site-logo img {
  filter: none !important;
}

/* Sanfte Übergänge auch im Top-Zustand */
body.home .site-header,
body.home #masthead,
body.page-id-17 .site-header,
body.page-id-17 #masthead {
  transition: background-color .25s ease, box-shadow .25s ease;
}

/* Body-Padding-Top, falls das Theme via JS einen Spacer setzt */
body.home,
body.page-id-17 {
  padding-top: 0 !important;
}

/* Sicherheitsnetz: keinerlei horizontaler Overflow durch full-bleed */
html, body { overflow-x: hidden; }

/* =====================================================================
   HEADER feste Höhe 100 px (Home)
   ===================================================================== */
body.home .site-header,
body.home #masthead,
body.home header.site-header,
body.home .header-main,
body.home .at-header,
body.home .atomion-header,
body.home #site-header,
body.page-id-17 .site-header,
body.page-id-17 #masthead,
body.page-id-17 header.site-header,
body.page-id-17 .header-main,
body.page-id-17 .at-header,
body.page-id-17 .atomion-header,
body.page-id-17 #site-header {
  height: 100px !important;
  min-height: 100px !important;
  max-height: 100px !important;
  display: flex !important;
  align-items: center !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* Innere Wrapper im Header — NUR auf 100 % Höhe, KEIN display erzwingen,
   damit theme-eigene "display:none" für Mobile-only-Wrapper greifen bleibt. */
body.home .site-header > *:not([hidden]),
body.home #masthead > *:not([hidden]),
body.home .header-main > *:not([hidden]),
body.home .at-header > *:not([hidden]),
body.home .atomion-header > *:not([hidden]),
body.page-id-17 .site-header > *:not([hidden]),
body.page-id-17 #masthead > *:not([hidden]),
body.page-id-17 .header-main > *:not([hidden]),
body.page-id-17 .at-header > *:not([hidden]),
body.page-id-17 .atomion-header > *:not([hidden]) {
  height: 100%;
  align-items: center;
}

/* =====================================================================
   Doppel-Header verhindern: mobile-Header-Variante NUR auf Mobile zeigen
   ===================================================================== */
@media (min-width: 769px) {
  body .mobile-header,
  body .header-mobile,
  body .header--mobile,
  body .site-header--mobile,
  body .site-header.mobile,
  body .at-header-mobile,
  body .at-mobile-header,
  body .atomion-mobile-header,
  body .at-mobile,
  body .mobile-only,
  body .mobile-nav,
  body .mobile-menu,
  body .nav-mobile,
  body .menu-toggle,
  body .mobile-menu-toggle,
  body .hamburger,
  body .at-hamburger,
  body .at-burger,
  body .burger,
  body .menu-icon,
  body .nav-toggle,
  body .visible-mobile,
  body .show-mobile,
  body .d-md-none,
  body .lg\:hidden {
    display: none !important;
  }
}

/* Optional: Desktop-only-Wrapper auf Mobile verstecken (falls Theme das so benennt) */
@media (max-width: 768px) {
  body .desktop-only,
  body .visible-desktop,
  body .show-desktop,
  body .header-desktop,
  body .site-header--desktop,
  body .at-header-desktop,
  body .at-desktop-header,
  body .nav-desktop {
    display: none !important;
  }
}

/* Logo-Höhe an 100-px-Header anpassen — passt sich proportional an */
body.home .site-header .custom-logo,
body.home .site-header img.logo,
body.home .site-header .site-logo img,
body.home .site-header .site-branding img,
body.page-id-17 .site-header .custom-logo,
body.page-id-17 .site-header img.logo,
body.page-id-17 .site-header .site-logo img,
body.page-id-17 .site-header .site-branding img {
  max-height: 64px !important;
  width: auto !important;
  height: auto !important;
}

/* Hero-Top-Padding an Header anpassen — Inhalt rutscht aus dem Header-Bereich */
.lh-hero { padding-top: 100px !important; }

/* =====================================================================
   FIX · Mobiles Menü — Kontrast im Hamburger-Panel
   ---------------------------------------------------------------------
   Das transparente Home-Header-Muster färbt alle Navigationslinks hell
   (Creme, --lh-cream-50) für die Lesbarkeit über dem Hero-Bild. Das
   AUSGEKLAPPTE mobile Menü-Panel hat jedoch einen soliden weißen
   Hintergrund (#mobile-navigation .main-nav-item = #fff) — dort wird
   heller Cremetext praktisch unsichtbar.
   Lösung: Links im mobilen Menü immer in Logogrün, aktive/aktuelle
   Punkte und Hover in Weinrot — unabhängig vom Scroll-Zustand.
   Die #mobile-navigation-ID übersteuert die hellen .site-header-Regeln.
   ===================================================================== */
body.home #mobile-navigation .menu a,
body.home #mobile-navigation .menu.mobile li a,
body.home #mobile-navigation nav a,
body.home #mobile-navigation .header-element a,
body.page-id-17 #mobile-navigation .menu a,
body.page-id-17 #mobile-navigation .menu.mobile li a,
body.page-id-17 #mobile-navigation nav a,
body.page-id-17 #mobile-navigation .header-element a {
  color: var(--lh-green-700) !important;
  opacity: 1 !important;
}
body.home #mobile-navigation .menu a:hover,
body.home #mobile-navigation li.current-menu-item > a,
body.home #mobile-navigation li.current-menu-item a,
body.page-id-17 #mobile-navigation .menu a:hover,
body.page-id-17 #mobile-navigation li.current-menu-item > a,
body.page-id-17 #mobile-navigation li.current-menu-item a {
  color: var(--lh-wine-500) !important;
  opacity: 1 !important;
}