.elementor-238 .elementor-element.elementor-element-b799136{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--align-items:center;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--margin-top:0rem;--margin-bottom:0rem;--margin-left:0rem;--margin-right:0rem;}.elementor-238 .elementor-element.elementor-element-fc10beb{--display:flex;--min-height:0px;--justify-content:flex-start;}.elementor-238 .elementor-element.elementor-element-218c99d{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-238 .elementor-element.elementor-element-19da8c1{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:20px 20px;--row-gap:20px;--column-gap:20px;}.elementor-238 .elementor-element.elementor-element-d995a1b{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:flex-start;--e-con-transform-transition-duration:1000ms;}.elementor-238 .elementor-element.elementor-element-d995a1b.e-con:hover{--e-con-transform-translateY:-5px;}.elementor-238 .elementor-element.elementor-element-0166312{--display:flex;--position:absolute;--background-transition:0.3s;--border-radius:0px 0px 5px 5px;bottom:0px;--z-index:88;}.elementor-238 .elementor-element.elementor-element-0166312:not(.elementor-motion-effects-element-type-background), .elementor-238 .elementor-element.elementor-element-0166312 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-primary );}.elementor-238 .elementor-element.elementor-element-0166312:hover{background-color:var( --e-global-color-7758aec );}body:not(.rtl) .elementor-238 .elementor-element.elementor-element-0166312{left:0px;}body.rtl .elementor-238 .elementor-element.elementor-element-0166312{right:0px;}.elementor-238 .elementor-element.elementor-element-f695de5{padding:1rem 0rem 1rem 0rem;text-align:center;}.elementor-238 .elementor-element.elementor-element-f695de5 .elementor-heading-title{font-family:var( --e-global-typography-ad68e87-font-family ), Sans-serif;font-size:var( --e-global-typography-ad68e87-font-size );line-height:var( --e-global-typography-ad68e87-line-height );color:var( --e-global-color-3369006 );}.elementor-238 .elementor-element.elementor-element-f695de5 .elementor-heading-title a{transition-duration:1s;}.elementor-238 .elementor-element.elementor-element-85c8989 img{width:100%;}.elementor-238 .elementor-element.elementor-element-ab96d98{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-238 .elementor-element.elementor-element-197502e{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--e-con-transform-transition-duration:1000ms;}.elementor-238 .elementor-element.elementor-element-197502e.e-con:hover{--e-con-transform-translateY:-10px;}.elementor-238 .elementor-element.elementor-element-86fd73c{--display:flex;--position:absolute;--background-transition:0.3s;--border-radius:0px 0px 5px 5px;bottom:0px;--z-index:88;}.elementor-238 .elementor-element.elementor-element-86fd73c:not(.elementor-motion-effects-element-type-background), .elementor-238 .elementor-element.elementor-element-86fd73c > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-text );}.elementor-238 .elementor-element.elementor-element-86fd73c:hover{background-color:var( --e-global-color-7758aec );}body:not(.rtl) .elementor-238 .elementor-element.elementor-element-86fd73c{left:0px;}body.rtl .elementor-238 .elementor-element.elementor-element-86fd73c{right:0px;}.elementor-238 .elementor-element.elementor-element-99401c4{padding:1rem 0rem 1rem 0rem;text-align:center;}.elementor-238 .elementor-element.elementor-element-99401c4 .elementor-heading-title{font-family:var( --e-global-typography-ad68e87-font-family ), Sans-serif;font-size:var( --e-global-typography-ad68e87-font-size );line-height:var( --e-global-typography-ad68e87-line-height );color:var( --e-global-color-3369006 );}.elementor-238 .elementor-element.elementor-element-f1b99af img{width:100%;}.elementor-238 .elementor-element.elementor-element-94ca020{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-238 .elementor-element.elementor-element-9b45645{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--e-con-transform-transition-duration:1000ms;}.elementor-238 .elementor-element.elementor-element-9b45645.e-con:hover{--e-con-transform-translateY:-10px;}.elementor-238 .elementor-element.elementor-element-45d7d86{--display:flex;--position:absolute;--background-transition:0.5s;--border-radius:0px 0px 5px 5px;bottom:0px;--z-index:88;}.elementor-238 .elementor-element.elementor-element-45d7d86:not(.elementor-motion-effects-element-type-background), .elementor-238 .elementor-element.elementor-element-45d7d86 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-accent );}.elementor-238 .elementor-element.elementor-element-45d7d86:hover{background-color:var( --e-global-color-7758aec );}body:not(.rtl) .elementor-238 .elementor-element.elementor-element-45d7d86{left:0px;}body.rtl .elementor-238 .elementor-element.elementor-element-45d7d86{right:0px;}.elementor-238 .elementor-element.elementor-element-755feba{padding:1rem 0rem 1rem 0rem;text-align:center;}.elementor-238 .elementor-element.elementor-element-755feba .elementor-heading-title{font-family:var( --e-global-typography-ad68e87-font-family ), Sans-serif;font-size:var( --e-global-typography-ad68e87-font-size );line-height:var( --e-global-typography-ad68e87-line-height );color:var( --e-global-color-3369006 );}.elementor-238 .elementor-element.elementor-element-8c0b7d0 img{width:100%;}.elementor-238 .elementor-element.elementor-element-7014051{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}@media(max-width:1024px){.elementor-238 .elementor-element.elementor-element-f695de5 .elementor-heading-title{font-size:var( --e-global-typography-ad68e87-font-size );line-height:var( --e-global-typography-ad68e87-line-height );}.elementor-238 .elementor-element.elementor-element-99401c4 .elementor-heading-title{font-size:var( --e-global-typography-ad68e87-font-size );line-height:var( --e-global-typography-ad68e87-line-height );}.elementor-238 .elementor-element.elementor-element-755feba .elementor-heading-title{font-size:var( --e-global-typography-ad68e87-font-size );line-height:var( --e-global-typography-ad68e87-line-height );}}@media(max-width:767px){.elementor-238 .elementor-element.elementor-element-b799136{--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-238 .elementor-element.elementor-element-218c99d{--flex-wrap:nowrap;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-238 .elementor-element.elementor-element-19da8c1{--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-238 .elementor-element.elementor-element-d995a1b{--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-238 .elementor-element.elementor-element-f695de5 .elementor-heading-title{font-size:var( --e-global-typography-ad68e87-font-size );line-height:var( --e-global-typography-ad68e87-line-height );}.elementor-238 .elementor-element.elementor-element-ab96d98{--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-238 .elementor-element.elementor-element-197502e{--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-238 .elementor-element.elementor-element-99401c4 .elementor-heading-title{font-size:var( --e-global-typography-ad68e87-font-size );line-height:var( --e-global-typography-ad68e87-line-height );}.elementor-238 .elementor-element.elementor-element-94ca020{--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-238 .elementor-element.elementor-element-9b45645{--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-238 .elementor-element.elementor-element-755feba .elementor-heading-title{font-size:var( --e-global-typography-ad68e87-font-size );line-height:var( --e-global-typography-ad68e87-line-height );}}/* Start custom CSS for container, class: .elementor-element-218c99d */img { /* Targets all <img> elements */
  width: 100%; /* Make the image fill the width of its container */
  height: 100%; /* Make the image fill the height of its container */
  object-fit: cover; /* Crop the image to fill the container without distortion */
}

section { /* Targets all <section> elements */
  position: relative; /* Makes absolute-positioned children position relative to this section */
  width: 100%; /* Full width section */
  box-sizing: border-box; /* Include padding/border inside the element’s width/height */
}

.sticky { /* The pinned/sticky area that ScrollTrigger pins */
  position: relative; /* Establish positioning context for absolutely-positioned children */
  display: flex; /* Use flex layout for centering content */
  justify-content: center; /* Horizontally center flex children */
  align-items: center; /* Vertically center flex children */
  height: 100vh; /* Full viewport height (so pinning feels like a full-screen panel) */
  box-sizing: border-box; /* Padding counts inside the height/width */
  padding: 2rem; /* Inner spacing so content isn’t flush to edges */
  overflow: hidden; /* Hide overflow so flipped/tilted elements don’t spill outside */
  transform: none; /* Explicitly remove transforms (transformed ancestors can break pin/fixed) */
  will-change: auto; /* Don’t force will-change here (prevents unnecessary layer creation) */
transition: none; /* will stop the section from jumping on scroll end
}

.sticky-header { /* Wrapper for the title over the cards */
  position: absolute; /* Take it out of the normal flow and overlay it */
  top: 20%; /* Place it down from the top of the sticky section */
  left: 50%; /* Move anchor point to the horizontal center */
  transform: translate(-50%, -50%); /* Center the header precisely around its own midpoint */
}

.sticky-header h1 { /* The actual header text element */
  position: relative; /* Allows future positioning tweaks if needed */
  text-align: center; /* Center-align the header text */
  will-change: transform, opacity; /* Hint that transform/opacity will animate (helps performance) */
  transform: translateY(40px); /* Default “hidden” position: shifted down */
  opacity: 0; /* Default hidden state (JS animates it in) */
}

.card-container { /* Flex container holding the cards */
  position: relative; /* Position context for any absolute children (if added later) */
  width: 90%; /* Base width (JS later animates between 75-80% and locks at 80%) */
  display: flex; /* Lay out the cards side-by-side */
  /*gap: 0px;              */ /* Gap is commented here; JS animates gap on scroll */
  perspective: 1000px; /* Enables 3D perspective for child transforms (flip looks real) */
  transform: translateZ(0); /* Nudge into its own GPU layer to reduce paint glitches */
  will-change: auto; /* Don’t force will-change constantly (avoids extra layers/memory) */
}

.card { /* The 3D “flip” wrapper */
  position: relative; /* Needed because .card-front/.card-back are absolutely positioned */
  flex: 1; /* Each card takes equal width in the flex row */
  aspect-ratio: 5/7; /* Maintain a consistent card shape (responsive height based on width) */
  transform-style: preserve-3d; /* Keep children in 3D space when the parent rotates */
  backface-visibility: hidden; /* Helps avoid flickering/bleeding during 3D flips */
  will-change: auto; /* Don’t force a permanent layer; GSAP uses transforms anyway */
}

#card-1 { /* Special styling for the first card */
  border-radius: 20px 0 0 20px; /* Rounded only on the outer-left corners */
}

#card-3 { /* Special styling for the third card */
  border-radius: 0 8px 8px 0; /* Rounded only on the outer-right corners */
}

.card-front,
.card-back { /* Both faces of the card */
  position: absolute; /* Stack both faces on top of each other */
  width: 100%; /* Fill the full card width */
  height: 100%; /* Fill the full card height */
  backface-visibility: hidden; /* Hide the reverse face when it’s turned away */
  border-radius: inherit; /* Use the parent card’s border radius */
  overflow: hidden; /* Clip the image/content to rounded corners */
}

.card-back { /* The back face only */
  display: flex; /* Use flex to center its content */
  justify-content: center; /* Center content horizontally */
  align-items: center; /* Center content vertically */
  text-align: center; /* Center any text inside */
  transform: rotateY(180deg); /* Pre-rotate the back so when the card flips 180 it reads correctly */
  padding: 2rem; /* Add spacing around the back content */
}

/* —–––––––––––––––––––––––––––––––––––––––––––––––––––––––
   Fix für GSAP ScrollTrigger / Elementor Buttons Klickproblem
––––––––––––––––––––––––––––––––––––––––––––––––––––––— */
.gsap-pin-spacer {
  pointer-events: none !important;
  z-index: auto !important;
}
.gsap-pin-spacer .sticky {
  pointer-events: auto !important;
  z-index: 10;
}
.card-container,
.card {
  position: relative;
  z-index: 10;
  pointer-events: auto;
}
.card a,
.card button {
  pointer-events: auto;
  cursor: pointer;
}


  .appearOnScroll {
    opacity: 0;
    transform: translateY(16px);
    transition: none; /* GSAP übernimmt die Animation */
  }/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-b799136 */transition: none;/* End custom CSS */