.hero_slide {
  object-fit: cover;
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0%;
  opacity: 0;
  transform: scale(1);
  transition: opacity 2000ms ease, transform 9000ms linear;
}

.hero_slide.is-active {
  opacity: 1;
  transform: scale(1.12);
}

/* Fortsetzung des Zooms während des Ausblendens, statt Umkehr auf scale(1): eigene,
   kürzere Transition-Dauer (deckungsgleich mit der Opacity-Fade-Dauer), Zielgröße so
   berechnet, dass die Zoom-Geschwindigkeit exakt gleich bleibt wie in .is-active. */
.hero_slide.is-leaving {
  transition: opacity 2000ms ease, transform 2000ms linear;
  opacity: 0;
  transform: scale(1.147);
}

.hero_slide.is-resetting {
  transition: none;
}

@media (prefers-reduced-motion: reduce) {
  .hero_slide {
    transition: none;
  }

  .hero_slide.is-active,
  .hero_slide.is-leaving {
    transform: scale(1);
  }
}
