h1, h2, h3, h4, h5, h6 {
  hyphens: auto;
}

/* Header Zeile & Navigation */
header.wp-block-template-part {
  position: absolute;
  z-index: 10;
  width: 100vw;
  margin-top: 20px;
}

header > * {
  position: relative;

}

/* Pattern Bildnavigation */

.bildnavi p.has-gross-font-size {
  font-size: clamp(1.75rem, 0.4375rem + 2.3333vw, 2.625rem) !important;
}

.bildnavi a img {
  transition: transform 0.3s ease-in-out;
}

.bildnavi a:hover img {
  transform: scale(1.1);
  transition: transform 0.3s ease-in-out;
}


.bildnavi a .bildnavi__pfeil {
  opacity: 0;
  pointer-events: none;
  transform: translateX(-30px);
  animation: none;
  transition: opacity 0.4s cubic-bezier(0.4,0,0.2,1);
}

.bildnavi a:hover .bildnavi__pfeil {
  opacity: 1;
  pointer-events: auto;
  animation: pfeil-in 0.4s cubic-bezier(0.4,0,0.2,1) forwards;
  /* Kein transform hier, das macht die Animation */
}

.bildnavi a:not(:hover) .bildnavi__pfeil {
  opacity: 0;
  pointer-events: none;
  animation: pfeil-out 0.4s cubic-bezier(0.4,0,0.2,1) forwards;
}

@keyframes pfeil-in {
  from {
      transform: translateX(-30px);
  }
  to {
      transform: translateX(0);
  }
}

@keyframes pfeil-out {
  from {
      transform: translateX(0);
  }
  to {
      transform: translateX(30px);
  }
}

/* hyperlin block */
a:where(:not(.wp-element-button)) {
  text-decoration: none;
}

.wp-block-group.section-after-hero {
  margin-top: 2rem;
}

.wp-block-cover.hero-container {
  margin-right: 1% !important;
  margin-left: 1% !important;
}

.hero-container .wp-block-cover__inner-container {
  width: 100% !important;
}

:where(.wp-site-blocks) > .entry-content {
  margin-block-start: 1%;
}

div.line {
  overflow: visible;
}






/* styles für navigations block */

/* === Basis: nur der einzelne Cover reagiert === */
.bildnavi .wp-block-tiptip-hyperlink-group-block .wp-block-cover {
  position: relative;
  overflow: hidden;
  /* sorgt für eine eigene Stacking-Context, damit z-index sauber funktioniert */
  isolation: isolate;
}

/* Standard-Content (die zwei Texte + Pfeil) sauber über dem Bild halten */
.bildnavi .wp-block-tiptip-hyperlink-group-block .wp-block-cover__inner-container {
  position: relative;
  z-index: 2;
}

/* Nur die normalen Texte und den Pfeil ausblenden – NICHT die Hover-Elemente */
.bildnavi .wp-block-tiptip-hyperlink-group-block .wp-block-cover__inner-container > .wp-block-group > p:not(.bildnavi__hover-text),
.bildnavi .wp-block-tiptip-hyperlink-group-block .wp-block-cover__inner-container > .wp-block-group > .wp-block-spacer,
.bildnavi .wp-block-tiptip-hyperlink-group-block .wp-block-cover__inner-container > .wp-block-group > .bildnavi__pfeil {
  transition: transform 0.35s ease, opacity 0.35s ease;
}

/* Overlay nur auf dem jeweils gehoverten Cover */
.bildnavi .wp-block-tiptip-hyperlink-group-block .wp-block-cover::after {
  content: "";
  position: absolute;
  inset: 0;
  background: #F4DF98;
  opacity: 0;
  transition: opacity 0.35s ease;
  z-index: 1; /* unter dem Content, über Bild/Dim-Overlay */
  pointer-events: none; /* blockiert keine Klicks/Hover auf Inhalt */
}

/* === Hover-Content (Text + Button) zentriert und unabhängig sichtbar === */

/* Hover-Container absolut positioniert und zentriert */
.bildnavi .wp-block-tiptip-hyperlink-group-block .bildnavi__hover-container {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  opacity: 0;
  z-index: 3; /* über dem gelben Overlay */
  transition: opacity 0.35s ease;
  text-align: center;
  width: 80%;
  max-width: 300px;
}

/* Hover-Text und Button innerhalb des Containers relativ */
.bildnavi .wp-block-tiptip-hyperlink-group-block .bildnavi__hover-text,
.bildnavi .wp-block-tiptip-hyperlink-group-block .grehn-primary-button {
  position: relative;
  opacity: 1; /* Innerhalb des Containers immer sichtbar */
  /* verhindert geerbte Transparenzen/Blending-Probleme */
  filter: none;
}

/* Hover-Text Styling */
.bildnavi .wp-block-tiptip-hyperlink-group-block .bildnavi__hover-text {
  color: #000; /* gut lesbar auf #F4DF98 */
  margin-bottom: 1rem; /* Abstand zum Button */
}

/* Button Styling - folgt natürlich nach dem Text */
.bildnavi .wp-block-tiptip-hyperlink-group-block .grehn-primary-button {
  display: block;
}

/* Optional: Button selbst nicht halbtransparent rendern lassen */
.bildnavi .wp-block-tiptip-hyperlink-group-block .grehn-primary-button .wp-block-button__link {
  opacity: 1 !important;
}

/* === Hover-Zustand NUR für das jeweils gehoverte Link-Element === */
.bildnavi .wp-block-tiptip-hyperlink-group-block:hover .wp-block-cover::after {
  opacity: 0.9;
}

.bildnavi .wp-block-tiptip-hyperlink-group-block:hover .wp-block-cover__inner-container > .wp-block-group > p:not(.bildnavi__hover-text),
.bildnavi .wp-block-tiptip-hyperlink-group-block:hover .wp-block-cover__inner-container > .wp-block-group > .wp-block-spacer,
.bildnavi .wp-block-tiptip-hyperlink-group-block:hover .wp-block-cover__inner-container > .wp-block-group > .bildnavi__pfeil {
  transform: translateY(-16px);
  opacity: 0;
}

/* Hover-Container erscheint */
.bildnavi .wp-block-tiptip-hyperlink-group-block:hover .bildnavi__hover-container {
  opacity: 1;
}

/* (Optional) kleine Feinheiten für bessere Performance */
.bildnavi .wp-block-tiptip-hyperlink-group-block .wp-block-cover__inner-container > .wp-block-group > p:not(.bildnavi__hover-text),
.bildnavi .wp-block-tiptip-hyperlink-group-block .wp-block-cover__inner-container > .wp-block-group > .wp-block-spacer,
.bildnavi .wp-block-tiptip-hyperlink-group-block .wp-block-cover__inner-container > .wp-block-group > .bildnavi__pfeil,
.bildnavi .wp-block-tiptip-hyperlink-group-block .bildnavi__hover-container {
  will-change: transform, opacity;
}

a.wp-block-navigation-item__content span {
  position: relative;
  display: inline-block;
}

a.wp-block-navigation-item__content span::after {
  content: '';
  position: absolute;
  left: 0;
  bottom: 0;
  height: 1px; /* Höhe der Unterstreichung */
  width: 100%;
  background-color: #F4DF98; /* Farbe der Linie */
  transform: scaleX(0);
  transform-origin: right;
  transition: transform 0.3s ease;
}

a.wp-block-navigation-item__content:hover span::after {
  transform: scaleX(1);
  transform-origin: left;
}

/* WordPress Navigation Responsive Breakpoint Override */
@media (max-width: 800px) {
  /* Burger-Button anzeigen */
  .wp-block-navigation__responsive-container-open:not(.always-shown) {
    display: flex !important;
  }
  
  /* Container komplett ausblenden wenn NICHT geöffnet */
  .wp-block-navigation__responsive-container:not(.is-menu-open) {
    display: none !important;
  }
  
  /* Container anzeigen wenn geöffnet */
  .wp-block-navigation__responsive-container.is-menu-open {
    display: block !important;
  }
  
  /* Header Alignment auf Center und Logo kleiner */
  header .wp-block-group.is-layout-flex {
    align-items: center !important;
  }
  
  header .wp-block-outermost-icon-block a.icon-container {
    width: 40px !important;
  }
}

@media (min-width: 801px) {
  /* Burger-Button verstecken */
  .wp-block-navigation__responsive-container-open {
    display: none !important;
  }
  
  /* Content immer anzeigen */
  .wp-block-navigation__responsive-container-content {
    display: block !important;
  }
}


/* video styles */

/* Hero-Video in WP Cover */
.hero-container { position: relative; overflow: hidden; }

.hero-container video.wp-block-cover__video-background,
.hero-container .wp-block-cover__image-background {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
object-fit: cover;
z-index: 0; /* Beide als Hintergrund, unter Content/Overlay */
}

.hero-container video.wp-block-cover__video-background {
opacity: 0;
/* transition: opacity 0.5s ease; */
/* transition-delay: 0.5s; */

}

.hero-container .wp-block-cover__image-background {
transition: opacity 0.3s ease;
}

/* Wenn das Video läuft, sanfter Übergang statt abruptes display: none */
.hero-container.is-playing video.wp-block-cover__video-background { 
opacity: 1; 
}
.hero-container.is-playing .wp-block-cover__image-background { 
opacity: 0; 
}

/* Optional: wenn Reduced Motion aktiv → Bild behalten */
@media (prefers-reduced-motion: reduce) {
.hero-container video.wp-block-cover__video-background { display: none !important; }
}

.immobilien-gallery .gallery-grid {
  min-height: calc(100vh - 900px);
}

/* .wp-block-heading {
  line-height: 1.4 !important;
} */

.wp-block-navigation:not(.has-background) .wp-block-navigation__responsive-container.is-menu-open {
  background-color: #EFECDF;
}

.is-menu-open .wp-block-navigation__responsive-container-close svg, .is-menu-open .wp-block-navigation__responsive-container-open svg {
  fill:#165084 !important;
}

.aufzaehlung-big-container__zahl {
  font-size: clamp(26px, 3.2vw, 42px) !important;
}



@media screen and (max-width: 800px) {

  .immobilien-slider-container {
    margin-bottom: 100px !important;
  }

  .mycb-button-container {
    width: 100% !important;
  }
  .mycb-button-container .wp-block-buttons {
    align-items: flex-end !important;
  }

  .mycb-actions {
    flex-direction: column !important;
  }

  .wp-block-navigation__responsive-container-content .wp-block-navigation-item__label{
    font-size: var(--wp--preset--font-size--large) !important;
    color:#165084 !important;
  }
  
  header > div {
    padding-left: 6% !important;
    padding-right: 6% !important;
  }

  .wp-block-navigation__responsive-dialog {
    padding: 6% !important;
  }
  .wp-block-navigation__responsive-container-close {
    top: 10% !important;
    right: 6% !important;
  }
  .m-order-1 {
    order: 1;
  }

  .m-order-2 {
    order: 2;
  }

  .m-order-3 {
    order: 3;
  }

  .wp-block-group :where(.is-layout-flex) {
    /* row-gap: 0px !important; */
    column-gap: 0px !important;
  }

  .bildnavi .wp-block-cover {
    border-radius: 0px;
  }

  .bildnavi > :first-child .wp-block-cover {
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border-bottom-left-radius: 0px !important;
  }

  .bildnavi > :last-child .wp-block-cover {
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    border-top-right-radius: 0px !important;
  }

  .bildnavi .wp-block-cover, .wp-block-cover-image {
    min-height: 300px !important;
  }
  
  .immobilien-slider-container .slider-heading {
    text-align: left;
  }

  .auflistung-small  .auflistung-small_zahl {
    font-size: 50px !important;
  }

  .auflistung-small .wp-block-column .wp-block-group {
    flex-direction: row;
    align-items: flex-end;
    gap: 10px;
    padding: 30px 0px;
    border-top: 1px solid #165084;
  }

  .auflistung-small .wp-block-column:last-child .wp-block-group {
    border-bottom: 1px solid #165084;
  }

  .auflistung-small .wp-block-column .wp-block-group p {
    width: fit-content;
  }

  .auflistung-small .wp-block-column .wp-block-group .auflistung-small_text {
    margin-bottom: 10px;
    margin-left: 6px;
    text-align: left;
  }

  .auflistung-small > .wp-block-column:not(:last-child) {
    border-right: none !important;
  }

  /* .slider-navigation {
    top: 400px !important;
  } */

  .wp-block-grehn-immobilien-listing .immobilien-results .immobilien-grid .slider-item:not(:hover) .content,
  .immobilien-slider-container .immobilien-slider-wrapper .slider-item:not(:hover) .content {
    transform: translateY(calc(100% - 8rem));
  }

  .immobilien-slider-wrapper .detail-item,
    .wp-block-grehn-immobilien-listing .detail-item {
    font-size: 16px !important;
  }

  header .wp-block-buttons {
    display: none !important;
  }

  header nav {
    align-items: flex-end !important;
    justify-content: flex-end !important;
  }

  .wp-block-navigation__responsive-container-close svg, .wp-block-navigation__responsive-container-open svg {
    width: 40px !important;
    height: 40px !important;
  }

  header img {
    max-width: 50px !important;
  }

  .partner-section .wp-block-group-is-layout-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .zwei-menschen-section .zwei-menschen-section__grid {
    flex-wrap: wrap !important;
    gap: 20px !important;
  }

  .zwei-menschen-section .zwei-menschen-section__grid .m-order-1 {
    flex-basis: 100%;
  }

  .zwei-menschen-section .zwei-menschen-section__grid .m-order-2 {
    flex-basis: calc(50% - 10px);
  }

  .zwei-menschen-section .zwei-menschen-section__grid .m-order-3 {
    flex-basis: calc(50% - 10px);
  }

  .zwei-menschen-section .zwei-menschen-section__grid img {
    height: auto !important;
    aspect-ratio: 1/1 !important;
  }

  .m-display-none {
    display: none !important;
  }

  .wp-block-grehn-immobilien-gallery .gallery-item .count-overlay {
    font-size: 20px !important;
  }

  .aufzaehlung-big-container {
    gap: 0px !important;
  }

  .aufzaehlung-big-container .wp-block-column {
    padding: 30px 20px !important;
  }

  .pswp__caption--custom {
    width: 90vw !important;
  }

  /* body {
    padding: 2% !important;
  } */

  .immo-detail__aufzaehlung-container {
    gap: 10px !important;
  }



}

@media screen and (max-width: 600px) {
  
  .wp-block-grehn-immobilien-listing .immobilien-results .immobilien-grid .slider-item:not(:hover) .content,
  .immobilien-slider-container .immobilien-slider-wrapper .slider-item:not(:hover) .content {
    transform: translateY(calc(100% - 5rem));
  }
}




/* Page Transition Overlay Styles */
.page-transition-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background-color: #EFECDF;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}

.page-transition-logo {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100px;
  height: 100px;
}

.page-transition-logo svg {
  width: 60px;
  height: 73px; /* Berechnet aus dem Seitenverhältnis 14:17 */
  opacity: 0.8;
  display: block;
}

/* Responsive Anpassungen */
@media (max-width: 800px) {

  .footer__social-media-container > div {
    flex-direction: row !important;
    align-items: center !important;

  }
  .page-transition-logo {
    width: 80px;
    height: 80px;
  }
  
  .page-transition-logo svg {
    width: 45px;
    height: 55px;
  }
}

@media (max-width: 480px) {
  .page-transition-logo {
    width: 60px;
    height: 60px;
  }
  
  .page-transition-logo svg {
    width: 35px;
    height: 42px;
  }
}

/* Barba Container Styles */
[data-barba="wrapper"] {
  position: relative;
}

[data-barba="container"] {
  position: relative;
}

.mycb-objektnummer {
  background: none !important;
  border: none !important;
  padding: 0 !important;
}

.mycb-button-container {
  flex-shrink: 0 !important;
}

.react-select__multi-value__label {
  text-transform: capitalize !important;
}

select[name="standort"] option{
  text-transform: capitalize !important;
}