/**
 * Page enter + hero stagger animations.
 * LCP images are never hidden — only text, overlays and shell elements animate.
 */

:root {
  --dx-enter-duration: 0.55s;
  --dx-enter-easing: cubic-bezier(0.22, 1, 0.36, 1);
  --dx-enter-distance: 16px;
}

body.dx-page-enter:not(.dx-page-ready) .smx-header {
  opacity: 0;
  transform: translateY(calc(var(--dx-enter-distance) * -0.75));
}

body.dx-page-enter:not(.dx-page-ready) #content {
  opacity: 0;
  transform: translateY(var(--dx-enter-distance));
}

body.dx-page-enter:not(.dx-page-ready) .dx-enter-fade,
body.dx-page-enter:not(.dx-page-ready) .dx-enter-up {
  opacity: 0;
}

body.dx-page-enter:not(.dx-page-ready) .dx-enter-up {
  transform: translateY(var(--dx-enter-distance));
}

body.dx-page-ready .smx-header,
body.dx-page-ready #content {
  opacity: 1;
  transform: none;
  transition:
    opacity var(--dx-enter-duration) var(--dx-enter-easing),
    transform var(--dx-enter-duration) var(--dx-enter-easing);
}

body.dx-page-ready .dx-enter-fade,
body.dx-page-ready .dx-enter-up {
  opacity: 1;
  transform: none;
  transition:
    opacity var(--dx-enter-duration) var(--dx-enter-easing),
    transform var(--dx-enter-duration) var(--dx-enter-easing);
}

body.dx-page-ready .dx-enter-delay-1 {
  transition-delay: 0.1s;
}

body.dx-page-ready .dx-enter-delay-2 {
  transition-delay: 0.2s;
}

body.dx-page-ready .dx-enter-delay-3 {
  transition-delay: 0.3s;
}

body.dx-page-ready .dx-enter-delay-4 {
  transition-delay: 0.4s;
}

@media (prefers-reduced-motion: reduce) {
  body.dx-page-enter:not(.dx-page-ready) .smx-header,
  body.dx-page-enter:not(.dx-page-ready) #content,
  body.dx-page-enter:not(.dx-page-ready) .dx-enter-fade,
  body.dx-page-enter:not(.dx-page-ready) .dx-enter-up {
    opacity: 1;
    transform: none;
  }

  body.dx-page-ready .smx-header,
  body.dx-page-ready #content,
  body.dx-page-ready .dx-enter-fade,
  body.dx-page-ready .dx-enter-up {
    transition: none;
  }
}