.elementor-kit-4{--e-global-color-primary:#000000;--e-global-color-secondary:#917C78;--e-global-color-text:#F5F5F5;--e-global-color-accent:#EAE1DF;--e-global-color-143ed6b:#545E56;--e-global-color-7f2c9bf:#667761;--e-global-color-e73fcd1:#B79492;--e-global-typography-primary-font-family:"Playfair Display";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Montserrat";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Montserrat";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"above-the-sky-script";--e-global-typography-accent-font-weight:500;background-color:var( --e-global-color-primary );}.elementor-kit-4 e-page-transition{background-color:#FFBC7D;}.elementor-kit-4 a{color:var( --e-global-color-secondary );font-style:normal;text-decoration:underline;line-height:1px;}.elementor-kit-4 a:hover{font-weight:500;}.elementor-kit-4 h2{color:var( --e-global-color-text );font-family:"Roboto";font-size:64px;font-weight:300;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){margin-block-end:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS */.hero-zoom,
.hero-zoom-mobile{
  position: relative;
  height: 100vh;
  min-height: 100vh;
  overflow: hidden;
}

/* Elementor-Struktur auf volle Höhe ziehen */
.hero-zoom .elementor-container,
.hero-zoom .elementor-column,
.hero-zoom .elementor-widget-wrap,
.hero-zoom-mobile .elementor-container,
.hero-zoom-mobile .elementor-column,
.hero-zoom-mobile .elementor-widget-wrap{
  height: 100%;
}

/* Image-Widgets absolut über die ganze Section legen */
.hero-zoom .hero-img-1,
.hero-zoom .hero-img-2,
.hero-zoom .hero-img-3,
.hero-zoom-mobile .hero-img-1-mobile,
.hero-zoom-mobile .hero-img-2-mobile,
.hero-zoom-mobile .hero-img-3-mobile
{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

/* Die IMG selbst wirklich covern lassen */
.hero-zoom .hero-img-1 img,
.hero-zoom .hero-img-2 img,
.hero-zoom .hero-img-3 img,
.hero-zoom-mobile .hero-img-1-mobile img,
.hero-zoom-mobile .hero-img-2-mobile img,
.hero-zoom-mobile .hero-img-3-mobile img{
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block;
  transform: scale(1);
  will-change: transform;
  
}

/* Bild 2 oben drüber, aber unsichtbar */
.hero-zoom .hero-img-2,
.hero-zoom-mobile .hero-img-2-mobile{
  z-index: 2;
}
.hero-zoom .hero-img-2 img,
.hero-zoom-mobile .hero-img-2-mobile img{
  opacity: 0;
  will-change: transform, opacity;
}

/* Bild 3 oben drüber, aber unsichtbar */
.hero-zoom .hero-img-3,
.hero-zoom-mobile .hero-img-3-mobile{
  z-index: 3;
}
.hero-zoom .hero-img-3 img,
.hero-zoom-mobile .hero-img-3-mobile img{
  opacity: 0;
  will-change: transform, opacity;
}

.hero-zoom .hero-img-1,
.hero-zoom-mobile .hero-img-1-mobile{
  z-index: 1;
}
.hero-zoom .hero-text,
.hero-zoom-mobile .hero-text
{
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  z-index: 5;
  text-align: center;
  width: min(900px, 90%);
  pointer-events: none; /* damit nix "klick-blockt" */
}

/* Startzustand: Text 3 unsichtbar */
.hero-zoom .hero-text-1,
.hero-zoom .hero-text-2,
.hero-zoom .hero-text-3,
.hero-zoom-mobile .hero-text-1-mobile,
.hero-zoom-mobile .hero-text-2-mobile,
.hero-zoom-mobile .hero-text-3-mobile{
  opacity: 0;
}

/* Elementor legt oft diese Wrapper rein -> auch 100% geben */
.hero-zoom .hero-img-1 .elementor-widget-container,
.hero-zoom .hero-img-2 .elementor-widget-container,
.hero-zoom .hero-img-3 .elementor-widget-container
{
  height: 100%;
}/* End custom CSS */