/* Zusätzliche Regeln: vorhandene Position und Größe bleiben erhalten. */
.hero-phone-display img {
  opacity: 0;
  transform: translateX(100%);
  transition: none;
  animation: none;
}
.hero-phone-display img.is-active {
  opacity: 1;
  transform: translateX(0);
  z-index: 2;
}
.hero-phone-display img.is-entering {
  animation: handy-rein 650ms ease-in-out both;
}
.hero-phone-display img.is-leaving {
  opacity: 1;
  z-index: 1;
  animation: handy-raus 650ms ease-in-out both;
}
@keyframes handy-rein {
  from { transform: translateX(100%); }
  to { transform: translateX(0); }
}
@keyframes handy-raus {
  from { transform: translateX(0); }
  to { transform: translateX(-100%); }
}
@media (prefers-reduced-motion: reduce) {
  .hero-phone-display img.is-entering,
  .hero-phone-display img.is-leaving { animation: none; }
}