/* ============================================================
   IMMOXX — Header Refinement
   Sticky-Nav + Shrink · Höhe/Abstände straffen · Hover/Active
   Lädt SPÄT, scoped auf html body[class], ergänzt bestehende Blöcke
   (immoxx-global-topbar, immoxx-trust-strip-css, immoxx-menu-polish).
   ============================================================ */
:root{
  --ixh-red:#BC2E2B; --ixh-red-dark:#9A211F;
  --ixh-ink:#1A1D24; --ixh-line:#E5E2DA;
  --ixh-stick-ease:cubic-bezier(.4,0,.2,1);
}

/* ----------------------------------------------------------
   1) STICKY — nur die Nav-Schicht klebt; Topbar + Trust-Strip
      scrollen natürlich weg ("klappen ein").
   ---------------------------------------------------------- */
html body .rh_responsive_header_temp,
html body .rh_temp_header_large_screens{
  position:-webkit-sticky !important;
  position:sticky !important;
  top:0 !important;
  z-index:1000 !important;
  /* KEIN Hintergrund hier setzen: auf der Home liegt der Nav transparent
     über dem Hero (immoxx-home-nav-transparent), Innenseiten bleiben weiß
     (wp-custom-css). Weiß kommt erst im gescrollten Zustand dazu. */
  transition:box-shadow .28s var(--ixh-stick-ease),
             background-color .28s var(--ixh-stick-ease) !important;
}
/* Sticky darf nicht von overflow:hidden-Vorfahren gekillt werden */
html body .rh_wrap,
html body .rh_wrap_stick_footer{overflow:visible !important}

/* Beim Scrollen: leicht transparenter, milchiger Header (Frosted-Glass)
   statt solidem Weiß. Backdrop-Blur lässt den Inhalt dahinter durchscheinen. */
/* Das <header> trägt mehrere Klassen gleichzeitig -> alle ansprechen,
   damit es sicher milchig wird (überstimmt den transparent-Block der Home). */
html.ix-hdr-stuck body .rh_responsive_header_temp,
html.ix-hdr-stuck body .rh_temp_header_large_screens,
html.ix-hdr-stuck body .rh_header,
html.ix-hdr-stuck body .rh_header_var_1{
  background:rgba(255,255,255,.80) !important;
  background-color:rgba(255,255,255,.80) !important;
  -webkit-backdrop-filter:blur(14px) saturate(1.4) !important;
  backdrop-filter:blur(14px) saturate(1.4) !important;
  box-shadow:0 6px 24px rgba(15,18,24,.07), 0 1px 0 rgba(229,226,218,.6) !important;
}
/* Nur die echte Innen-Lage transparent, damit keine zweite weiße Schicht entsteht */
html.ix-hdr-stuck body .rh_header__wrap{
  background:transparent !important;
  background-color:transparent !important;
}

/* ----------------------------------------------------------
   2) SHRINK beim Scrollen (nur Desktop) — Logo + Padding kleiner
   ---------------------------------------------------------- */
@media (min-width:993px){
  html body .rh_header__wrap{
    padding-top:16px !important;
    padding-bottom:16px !important;
    align-items:center !important;
    transition:padding .28s var(--ixh-stick-ease) !important;
  }
  html body .rh_logo img,
  html body .rh_logo_inner img,
  html body .rh_logo a img{
    height:40px !important; width:auto !important;
    transition:height .28s var(--ixh-stick-ease) !important;
  }
  html.ix-hdr-stuck body .rh_header__wrap{
    padding-top:9px !important;
    padding-bottom:9px !important;
  }
  html.ix-hdr-stuck body .rh_logo img,
  html.ix-hdr-stuck body .rh_logo_inner img,
  html.ix-hdr-stuck body .rh_logo a img{
    height:32px !important;
  }
}

/* Unterzeile unter dem Logo (wie EXKLUSIV) — per CSS, ohne Markup-Eingriff */
html body .rh_logo a,
html body .rh_logo_inner a{display:inline-block !important;line-height:1 !important;text-decoration:none !important}
html body .rh_logo_inner a::after{
  content:"Maklerbüro";
  display:block !important;
  margin-top:5px !important;
  font-family:'Inter',system-ui,-apple-system,sans-serif !important;
  font-size:9.5px !important;
  font-weight:600 !important;
  letter-spacing:.34em !important;
  text-transform:uppercase !important;
  color:#3A3A3A !important;
  transition:color .25s var(--ixh-stick-ease) !important;
}
/* Über dem Hero hell, beim Scrollen gedeckt-dunkel */
html:not(.ix-hdr-stuck) body.home .rh_logo_inner a::after,
html:not(.ix-hdr-stuck) body.page-id-105 .rh_logo_inner a::after{
  color:rgba(255,255,255,.78) !important;
}

/* ----------------------------------------------------------
   3) HÖHE / ABSTÄNDE straffen — konsistenter vertikaler Rhythmus
   ---------------------------------------------------------- */
html body .ix-topbar{padding:7px 0 !important}
html body .ix-trust-strip .ix-trust-inner{height:34px !important}

@media (min-width:993px){
  /* Menüpunkte: gleichmäßige Klickfläche, vertikal zentriert */
  html body .rh_menu__main > li > a{
    padding-top:9px !important;
    padding-bottom:9px !important;
    display:inline-flex !important;
    align-items:center !important;
  }
}

/* Menü rechtsbündig: .rh_menu wächst über den freien Platz, daher die
   Items innerhalb ans rechte Ende schieben (flush zur Container-Kante). */
@media (min-width:993px){
  html body .rh_menu{justify-content:flex-end !important; margin-left:auto !important}
  html body .rh_menu > nav.main-menu,
  html body .rh_menu .menu-main-menu-container{margin-left:auto !important}
  html body .rh_menu__main{justify-content:flex-end !important; margin-left:auto !important}
}

/* Edles Schriftbild (nach Exklusiv-Vorbild): Title Case statt Versalien,
   leichter, feiner Abstand. KONTAKT-Button (Abschnitt 7) bleibt Versalien. */
html body .rh_menu__main > li > a{
  text-transform:none !important;
  font-weight:500 !important;
  font-size:15px !important;
  letter-spacing:.015em !important;
  font-family:'Inter',system-ui,-apple-system,sans-serif !important;
}

/* ----------------------------------------------------------
   4) HOVER / ACTIVE — KEIN Unterstrich (Wunsch FK, site-weit).
      Weder die eigene Haarlinie noch ein Theme-Unterstrich/-Border
      (roter Balken unter dem aktiven Punkt) sollen erscheinen.
   ---------------------------------------------------------- */
@media (min-width:993px){
  html body .rh_menu__main > li > a{position:relative !important}
}
/* Eigene ::before-Linie UND jeden Theme-::after-Unterstrich abschalten */
html body .rh_menu__main > li > a::before,
html body .rh_menu__main > li > a::after{
  display:none !important; content:none !important;
}
/* Theme-Border/Underline unter (aktiven) Menuepunkten entfernen —
   KONTAKT-Button bleibt unberuehrt (voll umrandeter Button). */
html body .rh_menu__main > li > a:not([href*="/kontakt"]),
html body .rh_menu__main > li:hover > a:not([href*="/kontakt"]),
html body .rh_menu__main > li.current-menu-item > a:not([href*="/kontakt"]),
html body .rh_menu__main > li.current_page_item > a:not([href*="/kontakt"]),
html body .rh_menu__main > li.current-menu-ancestor > a:not([href*="/kontakt"]){
  border-bottom:0 !important;
  box-shadow:none !important;
  text-decoration:none !important;
}

/* ----------------------------------------------------------
   4b) KEIN BROTKRÜMEL — site-weit. Theme-Breadcrumb (.page-breadcrumbs)
       und eigener Listing-Brotkruemel (.ix-breadcrumb) ausgeblendet.
   ---------------------------------------------------------- */
html body .page-breadcrumbs,
html body .rh_breadcrumb,
html body .ix-breadcrumb{display:none !important}

/* ----------------------------------------------------------
   5) NAV AUFRÄUMEN — Theme-„User"-Block (Telefon-Nummer + Submit-
      Property-Button) raus. Kontakt liegt bereits in der Topbar.
   ---------------------------------------------------------- */
html body .rh_menu__user,
html body .rh_menu__user_phone,
html body .rh_menu__user_submit,
html body .rh_header_var_1 .rh_menu__user{
  display:none !important;
}

/* ----------------------------------------------------------
   6) ÜBER DEM HERO (Home, transparenter Header, NICHT gescrollt):
      Logo + Menüschrift WEISS. Beim Scrollen (.ix-hdr-stuck) wird
      der Header weiß -> Logo/Menü automatisch wieder dunkel.
   ---------------------------------------------------------- */
html body .rh_logo img{transition:filter .25s var(--ixh-stick-ease) !important}
html:not(.ix-hdr-stuck) body.home .rh_logo img,
html:not(.ix-hdr-stuck) body.page-id-105 .rh_logo img{
  filter:brightness(0) invert(1) !important;
}
html:not(.ix-hdr-stuck) body.home .rh_menu__main > li > a,
html:not(.ix-hdr-stuck) body.page-id-105 .rh_menu__main > li > a{
  color:#fff !important;
  text-shadow:0 1px 14px rgba(0,0,0,.5), 0 0 2px rgba(0,0,0,.3) !important;
}
/* Logo über dem Hero: dezenter Schatten für Lesbarkeit auf hellen Bildern */
html:not(.ix-hdr-stuck) body.home .rh_logo img,
html:not(.ix-hdr-stuck) body.page-id-105 .rh_logo img{
  filter:brightness(0) invert(1) drop-shadow(0 1px 8px rgba(0,0,0,.45)) !important;
}
html:not(.ix-hdr-stuck) body.home .rh_logo_inner a::after,
html:not(.ix-hdr-stuck) body.page-id-105 .rh_logo_inner a::after{
  text-shadow:0 1px 10px rgba(0,0,0,.5) !important;
}
/* Hover über dem Hero: weiß bleiben, kein roter Block — Unterstrich genügt */
html:not(.ix-hdr-stuck) body.home .rh_menu__main > li:hover > a,
html:not(.ix-hdr-stuck) body.page-id-105 .rh_menu__main > li:hover > a,
html:not(.ix-hdr-stuck) body.home .rh_menu__main > li.current-menu-item > a,
html:not(.ix-hdr-stuck) body.page-id-105 .rh_menu__main > li.current-menu-item > a{
  color:#fff !important;background:transparent !important;
}

/* ----------------------------------------------------------
   6b) GESCROLLTER ZUSTAND (.ix-hdr-stuck) — Header ist milchig-weiß,
       also Menüschrift DUNKEL erzwingen. Ohne diese Regel fällt die
       Farbe auf die Theme-Default zurück, die aktive/gehoverte Punkte
       ROT einfärbt -> rot auf hellem Grund / rot auf rotem Theme-Block
       = unleserlich. KONTAKT-Button (eigene Regel, Abschnitt 7) bleibt
       ausgenommen.
   ---------------------------------------------------------- */
html.ix-hdr-stuck body .rh_menu__main > li > a:not([href*="/kontakt"]),
html.ix-hdr-stuck body .rh_menu__main > li:hover > a:not([href*="/kontakt"]),
html.ix-hdr-stuck body .rh_menu__main > li.current-menu-item > a:not([href*="/kontakt"]),
html.ix-hdr-stuck body .rh_menu__main > li.current_page_item > a:not([href*="/kontakt"]),
html.ix-hdr-stuck body .rh_menu__main > li.current-menu-ancestor > a:not([href*="/kontakt"]){
  color:var(--ixh-ink) !important;
  background:transparent !important;
  background-color:transparent !important;
  text-shadow:none !important;
}
/* Roter Theme-Hintergrund auf Menüpunkten generell weg (alle Zustände,
   alle Seiten) — außer KONTAKT. Verhindert den roten Kasten hinter
   aktivem/gehovertem Punkt, der "rot auf rot" verursacht. */
html body .rh_menu__main > li > a:not([href*="/kontakt"]),
html body .rh_menu__main > li:hover > a:not([href*="/kontakt"]),
html body .rh_menu__main > li.current-menu-item > a:not([href*="/kontakt"]),
html body .rh_menu__main > li.current_page_item > a:not([href*="/kontakt"]),
html body .rh_menu__main > li.current-menu-ancestor > a:not([href*="/kontakt"]){
  background:transparent !important;
  background-color:transparent !important;
}
/* Gehovert im gescrollten Zustand: dezenter dunkler Akzent (Bordeaux-Text),
   KEIN Hintergrund — edel und lesbar. */
html.ix-hdr-stuck body .rh_menu__main > li:hover > a:not([href*="/kontakt"]){
  color:var(--ixh-red) !important;
}

/* 6c) GESCROLLT: AKTIVER Punkt als gefüllter roter Kasten (weiß auf rot),
   wie der KONTAKT-Button. Wunsch FK. Sticht die Flat-/Transparent-Regeln
   oben aus (gleiche Spezifität, späterer Quelltext). */
html.ix-hdr-stuck body .rh_menu__main > li.current-menu-item > a:not([href*="/kontakt"]),
html.ix-hdr-stuck body .rh_menu__main > li.current_page_item > a:not([href*="/kontakt"]),
html.ix-hdr-stuck body .rh_menu__main > li.current-menu-ancestor > a:not([href*="/kontakt"]){
  background:#BC2E2B !important;
  background-color:#BC2E2B !important;
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
  border-radius:4px !important;
  padding-left:14px !important;
  padding-right:14px !important;
  text-shadow:none !important;
}
/* Rote Unterlinie des aktiven Punkts im Kasten unterdrücken */
html.ix-hdr-stuck body header .rh_menu__main > li.current-menu-item > a:not([href*="/kontakt"])::after,
html.ix-hdr-stuck body header .rh_menu__main > li.current_page_item > a:not([href*="/kontakt"])::after,
html.ix-hdr-stuck body header .rh_menu__main > li.current-menu-ancestor > a:not([href*="/kontakt"])::after{
  display:none !important; content:none !important;
}

/* ----------------------------------------------------------
   7) KONTAKT als Umriss-Button (Bordeaux), edel — gilt überall.
      Versalien als Akzent (wie Referenz), füllt sich beim Hover.
   ---------------------------------------------------------- */
html body .rh_menu__main > li > a[href*="/kontakt"]{
  background:#1A1D24 !important;
  color:#fff !important;
  border:1px solid #BC2E2B !important;
  padding:9px 22px !important;
  margin-left:8px !important;
  text-transform:uppercase !important;
  letter-spacing:.12em !important;
  font-weight:600 !important;
  font-size:12.5px !important;
  text-shadow:none !important;
  transition:background .2s var(--ixh-stick-ease), color .2s var(--ixh-stick-ease), border-color .2s var(--ixh-stick-ease) !important;
}
html body .rh_menu__main > li > a[href*="/kontakt"]:hover{
  background:#BC2E2B !important;
  color:#fff !important;
  border-color:#BC2E2B !important;
}
/* Über dem Hero: dunkelblaugrauer Fuell-Button mit rotem Rahmen (wie „Objekt ansehen") */
html:not(.ix-hdr-stuck) body.home .rh_menu__main > li > a[href*="/kontakt"],
html:not(.ix-hdr-stuck) body.page-id-105 .rh_menu__main > li > a[href*="/kontakt"]{
  color:#fff !important;
  background:#1A1D24 !important;
  border-color:#BC2E2B !important;
}
html:not(.ix-hdr-stuck) body.home .rh_menu__main > li > a[href*="/kontakt"]:hover,
html:not(.ix-hdr-stuck) body.page-id-105 .rh_menu__main > li > a[href*="/kontakt"]:hover{
  background:#BC2E2B !important;color:#fff !important;border-color:#BC2E2B !important;
}
/* Kein animierter Unterstrich unter dem KONTAKT-Button */
html body .rh_menu__main > li > a[href*="/kontakt"]::before{display:none !important}

/* ----------------------------------------------------------
   7b) DROPDOWN BERUHIGEN — weniger Linien, „runder".
       Harter roter 3px-Balken raus -> weicher Schatten + feine
       1px-Haarlinie. Einträge Title Case (wie Hauptmenü) statt Versalien.
   ---------------------------------------------------------- */
@media (min-width:993px){
  html body[class] .rh_menu__main > li > ul.sub-menu,
  html body[class] .rh_menu .menu .sub-menu,
  html body .rh_menu__main .sub-menu{
    border:1px solid #ECE8E0 !important;
    border-top:1px solid #ECE8E0 !important;
    box-shadow:0 18px 44px rgba(15,18,24,.10) !important;
    border-radius:3px !important;
    padding:7px 0 !important;
    overflow:visible !important;
  }
  /* Einträge: Title Case, leicht, ohne Trennlinien — exakte Child-Struktur,
     um die Versalien-Bestandsregeln (beide Ebenen) zu überstimmen. */
  html body[class] .rh_menu__main > li > ul.sub-menu > li > a,
  html body[class] .rh_menu__main > li > ul.sub-menu > li > ul.sub-menu > li > a,
  html body[class] .rh_menu .menu .sub-menu li > a{
    text-transform:none !important;
    font-weight:500 !important;
    letter-spacing:.01em !important;
    font-size:13.5px !important;
    border:0 !important;
  }
  html body[class] .rh_menu__main .sub-menu li{border:0 !important}
}

/* ----------------------------------------------------------
   8) KONSOLIDIERTER KOPF — „Staatlich geprüft" wandert in die dunkle
      Topbar (mittig), die cremefarbene Trust-Leiste entfällt.
      (Markup wird per JS in .ix-topbar-inner eingesetzt.)
   ---------------------------------------------------------- */
html body .ix-trust-strip{display:none !important}

html body .ix-topbar-inner{position:relative !important}
html body .ix-topbar-cred{
  position:absolute !important;
  left:50% !important; top:50% !important;
  transform:translate(-50%,-50%) !important;
  display:inline-flex !important; align-items:center !important; gap:9px !important;
  white-space:nowrap !important;
  font-family:'Inter',system-ui,-apple-system,sans-serif !important;
  font-size:11.5px !important; letter-spacing:.02em !important;
  color:rgba(255,255,255,.82) !important; pointer-events:none !important;
}
html body .ix-topbar-cred .ix-topbar-dot{
  width:7px !important; height:7px !important; border-radius:50% !important;
  background:#BC2E2B !important; flex:0 0 7px !important;
  box-shadow:0 0 0 0 rgba(188,46,43,.5);
  animation:ixCredPulse 2s ease-in-out infinite;
}
@keyframes ixCredPulse{
  0%{box-shadow:0 0 0 0 rgba(188,46,43,.5)}
  70%{box-shadow:0 0 0 5px rgba(188,46,43,0)}
  100%{box-shadow:0 0 0 0 rgba(188,46,43,0)}
}
/* Auf breiten Screens zeigt das zentrierte Credential -> dort die
   Mail-Adresse in der Topbar ausblenden (Tel + WhatsApp genügen,
   Mail steht in Kontakt/Footer), damit kein Überlapp entsteht. */
@media (min-width:1201px){
  html body .ix-topbar-contact a[href^="mailto"]{display:none !important}
}
/* Auf engeren Viewports kollidiert das zentrierte Credential mit
   Kontakt/Meta -> ausblenden, dafür bleibt die Mail sichtbar. */
@media (max-width:1200px){
  html body .ix-topbar-cred{display:none !important}
}

/* Kleines IMMOXX-Logo links in der dunklen Topbar — nur Mobile, wo links
   Platz frei ist (Kontakt ist dort zentriert). Balanciert das mittige Telefon. */
html body .ix-topbar-logo{display:none}
@media (max-width:992px){
  html body .ix-topbar-inner{position:relative !important}
  html body .ix-topbar-logo{
    display:block !important; position:absolute !important;
    left:12px !important; top:50% !important; transform:translateY(-50%) !important;
    line-height:0 !important; z-index:3 !important;
  }
  html body .ix-topbar-logo img{
    height:15px !important; width:auto !important; display:block !important;
    filter:brightness(0) invert(1) !important;
  }
}

/* ----------------------------------------------------------
   9) MOBILE — Topbar bleibt klebend, Logo-Schicht darunter sticky.
      (Custom-Drawer #ixMobDrawer/#ixMobBtn bleibt unangetastet.)
   ---------------------------------------------------------- */
@media (max-width:992px){
  html.ix-hdr-stuck body .rh_responsive_header_temp{
    box-shadow:0 4px 16px rgba(15,18,24,.10) !important;
  }
}

/* Sanftes Reduce-Motion-Opt-out */
@media (prefers-reduced-motion:reduce){
  html body .rh_header__wrap,
  html body .rh_logo img,
  html body .rh_menu__main > li > a::before,
  html body .rh_responsive_header_temp,
  html body .rh_temp_header_large_screens{transition:none !important}
}

/* Global: prevent theme a:hover from overriding white text on filled buttons */
a.primary:hover,a.primary:focus,
.actions a.primary:hover,.actions a.primary:focus,
[class*="-hero-actions"] .primary:hover,[class*="-hero-actions"] .primary:focus,
[class*="-hero-cta"]:hover,[class*="-hero-cta"]:focus{color:#fff !important}