/* First paint is animated in CSS: content never waits for a JavaScript ready flag.
   These wrappers own only entrance motion, not controls or live-scene transforms. */
@keyframes portal-enter {
  from { opacity: 0; translate: 0 18px; }
  to { opacity: 1; translate: 0 0; }
}
@keyframes portal-enter-scene {
  from { opacity: 0; translate: 0 24px; scale: .992; }
  to { opacity: 1; translate: 0 0; scale: 1; }
}
@media (prefers-reduced-motion: no-preference) {
  :where(.home-page, .subscription-page, .payment-page) .site-header__inner {
    animation: portal-enter 460ms cubic-bezier(.22,1,.36,1) backwards;
  }
  .home-intro > div,
  .subscription-intro__copy > *,
  .payment-back, .payment-heading {
    animation: portal-enter 640ms cubic-bezier(.22,1,.36,1) 60ms backwards;
  }
  .home-intro > .home-intro__aside, .subscription-intro__copy > p, .payment-heading { animation-delay: 120ms; }
  .subscription-intro__links { animation-delay: 180ms; }
  .subscription-intro__copy > .subscription-trial { animation-delay: 240ms; }
  .home-cinema, .translation-compare, .payment-visual, .payment-order {
    animation: portal-enter-scene 760ms cubic-bezier(.22,1,.36,1) 140ms backwards;
  }
  .payment-visual { animation-delay: 80ms; }
  .payment-order { animation-delay: 170ms; }
  .au-panel { animation: portal-enter 320ms cubic-bezier(.22,1,.36,1) backwards; }
}
/* Completion is permanent. Toggling animation:none with :focus-within would
   restart the entrance when a select/picker hands focus back to the page. */
[data-entrance-complete] { animation: none !important; }
@media print {
  :where(.home-page, .subscription-page, .payment-page, .au) * { animation: none !important; }
}