/* Homepage only: the reference's horizontal wipe and staggered title rise.
   A missing script self-releases; without JavaScript everything stays visible. */
html.js [data-home-hero]:not([data-home-hero-state]) .opening__image,
html.js [data-home-hero]:not([data-home-hero-state]) .title-line > span,
html.js [data-home-hero]:not([data-home-hero-state]) .opening__note {
  animation: home-hero-safety 3200ms steps(1, end) both;
}

[data-home-hero][data-home-hero-state="running"] .opening__image {
  will-change: clip-path;
}

[data-home-hero][data-home-hero-state="running"] .opening__image img,
[data-home-hero][data-home-hero-state="running"] .title-line > span,
[data-home-hero][data-home-hero-state="running"] .opening__note {
  will-change: transform, opacity;
}

@keyframes home-hero-safety {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@media (prefers-reduced-motion: reduce), print {
  html.js [data-home-hero] .opening__image,
  html.js [data-home-hero] .opening__image img,
  html.js [data-home-hero] .title-line > span,
  html.js [data-home-hero] .opening__note {
    animation: none !important;
    clip-path: none !important;
    opacity: 1 !important;
    transform: none !important;
  }
}
