/* Animationen — ausschließlich transform, nie opacity:0 als Startzustand */

.reveal {
  transform: translateY(32px);
  transition: transform 700ms var(--ease-out);
  will-change: transform;
}
.reveal.is-visible { transform: translateY(0); }

.reveal-stagger > * {
  transform: translateY(28px);
  transition: transform 650ms var(--ease-out);
}
.reveal-stagger.is-visible > * { transform: translateY(0); }
.reveal-stagger.is-visible > *:nth-child(1) { transition-delay: 0ms; }
.reveal-stagger.is-visible > *:nth-child(2) { transition-delay: 60ms; }
.reveal-stagger.is-visible > *:nth-child(3) { transition-delay: 120ms; }
.reveal-stagger.is-visible > *:nth-child(4) { transition-delay: 180ms; }
.reveal-stagger.is-visible > *:nth-child(5) { transition-delay: 240ms; }
.reveal-stagger.is-visible > *:nth-child(6) { transition-delay: 300ms; }

.reveal-side {
  transform: translateX(-24px);
  transition: transform 700ms var(--ease-out);
}
.reveal-side.is-visible { transform: translateX(0); }
.reveal-side.from-right { transform: translateX(24px); }
.reveal-side.from-right.is-visible { transform: translateX(0); }

.hero-content, .hero-media { transform: translateY(18px); transition: transform 750ms var(--ease-out); }
.hero.is-loaded .hero-content { transform: translateY(0); }
.hero.is-loaded .hero-media { transform: translateY(0); transition-delay: 100ms; }

@media (prefers-reduced-motion: reduce) {
  .reveal, .reveal-stagger > *, .reveal-side,
  .hero-content, .hero-media {
    transition: none !important;
    transform: none !important;
  }
}