/**
 * Loaded after Breakdance global-settings.css + post-*.css (wp_head priority 100000).
 * Global Typography setzt Poppins + H1-Farbe — ohne das wirkt -webkit-text-stroke wie Vollfläche.
 */

.breakdance h1.bde-heading.eff-heading.eff-heading--stroke,
.breakdance h2.bde-heading.eff-heading.eff-heading--stroke,
.breakdance .bde-heading.eff-heading.eff-heading--stroke {
  color: transparent !important;
  -webkit-text-fill-color: transparent !important;
  -webkit-text-stroke-color: var(--eff-white, #fff) !important;
  -webkit-text-stroke-width: var(--eff-stroke-width, 2px) !important;
  paint-order: stroke fill;
  font-family: var(--eff-font-display, "Open Sans", sans-serif) !important;
  font-style: italic !important;
}

.breakdance h1.bde-heading.eff-heading--stroke.eff-heading--hero,
.breakdance h2.bde-heading.eff-heading--stroke.eff-heading--hero {
  -webkit-text-stroke-width: clamp(1px, 0.032em, 2px) !important;
}

/* Spans: kein transparent !important — sonst blockiert es eff-heading-fill-in */

.breakdance .eff-heading--hero .eff-heading-fill,
.breakdance .eff-hero-animate .eff-heading--stroke .eff-heading-fill {
  animation: eff-heading-fill-in var(--eff-fill-duration) var(--eff-motion-ease) forwards;
  animation-delay: calc(var(--eff-fill-delay) + var(--eff-fill-i, 0) * var(--eff-fill-stagger));
}

@keyframes eff-heading-fill-in {
  from {
    color: transparent;
    -webkit-text-fill-color: transparent;
  }

  to {
    color: var(--eff-white, #fff);
    -webkit-text-fill-color: var(--eff-white, #fff);
    -webkit-text-stroke-color: var(--eff-white, #fff);
  }
}

/* Bild-Stack: Breakdance layout_v2 / Column-Flex überschreibt sonst row + negative Margins */
.breakdance .eff-image-stack.bde-div,
.breakdance .bde-div.eff-image-stack {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: flex-end !important;
  justify-content: flex-start !important;
  width: 100% !important;
  max-width: 100% !important;
  overflow: visible !important;
  position: relative !important;
}

.breakdance .eff-image-stack > .eff-image-stack__front,
.breakdance .eff-image-stack > .bde-image2.eff-image-stack__front {
  position: relative !important;
  z-index: 99 !important;
  flex: 0 0 auto !important;
  margin: 0 -310px -120px 0 !important;
  padding: 5px 5px 0 0 !important;
  background-color: #fff !important;
  overflow: hidden !important;
  box-sizing: content-box !important;
  width: 360px !important;
  max-width: min(360px, 42vw) !important;
  height: 340px !important;
  object-fit: cover !important;
}

.breakdance .eff-image-stack > .eff-image-stack__main,
.breakdance .eff-image-stack > .bde-div.eff-image-stack__main {
  flex: 0 0 auto !important;
  position: relative !important;
  z-index: 1 !important;
  max-width: 100% !important;
  /* Breite/Höhe: Breakdance am Div eff-image-stack__main (Design → Size) */
}

/* Im Stack kein Ken-Burns-Start 1.3 — sonst wirkt das Team-Foto „eingezoomt/klein“ */
.breakdance .eff-image-stack__main.eff-media .eff-media__img {
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  aspect-ratio: unset !important;
  object-fit: cover !important;
  transform: scale(1) !important;
}

.breakdance .eff-image-stack__main.eff-media.is-inview .eff-media__img {
  transform: scale(1) !important;
}

@media (max-width: 991px) {
  .breakdance .eff-image-stack.bde-div,
  .breakdance .bde-div.eff-image-stack {
    flex-direction: column !important;
    align-items: flex-start !important;
  }

  .breakdance .eff-image-stack > .eff-image-stack__front,
  .breakdance .eff-image-stack > .bde-image2.eff-image-stack__front {
    margin: 0 0 20px 0 !important;
    padding: 0 !important;
    order: 2 !important;
  }

  .breakdance .eff-image-stack > .eff-image-stack__main,
  .breakdance .eff-image-stack > .bde-div.eff-image-stack__main {
    order: 1 !important;
    width: 100% !important;
    max-width: 100% !important;
  }
}

@media (max-width: 479px) {
  .breakdance .eff-image-stack > .eff-image-stack__front,
  .breakdance .eff-image-stack > .bde-image2.eff-image-stack__front {
    display: none !important;
  }
}
