@keyframes characterAssemble {
  0% { opacity: 0; transform: translate3d(var(--character-x), var(--character-y), 0) rotate(var(--character-rotate)); filter: blur(7px); }
  68% { opacity: 1; transform: translate3d(-2px, 3px, 0) rotate(-.45deg); filter: blur(0); }
  100% { opacity: 1; transform: translate3d(0, 0, 0) rotate(0); filter: blur(0); }
}

@keyframes sectionAssemble {
  0% { opacity: 0; transform: translate3d(var(--assemble-x), var(--assemble-y), 0) scale(.96); }
  72% { opacity: 1; transform: translate3d(0, 0, 0) scale(1.012); }
  100% { opacity: 1; transform: translate3d(0, 0, 0) scale(1); }
}

@media (prefers-reduced-motion: no-preference) {
  .motion-ready .kinetic-heading .character { display: inline-block; opacity: 0; }
  .motion-ready .kinetic-heading.is-character-ready .character { animation: characterAssemble .82s var(--character-delay) cubic-bezier(.16, 1, .3, 1) both; }

  .motion-ready [data-assemble] [data-assemble-piece] { --assemble-x: 0px; --assemble-y: 56px; opacity: 0; transform: translate3d(var(--assemble-x), var(--assemble-y), 0) scale(.96); }
  .motion-ready [data-assemble] [data-assemble-from="left"] { --assemble-x: -86px; --assemble-y: 16px; }
  .motion-ready [data-assemble] [data-assemble-from="right"] { --assemble-x: 86px; --assemble-y: 16px; }
  .motion-ready [data-assemble] [data-assemble-from="center"] { --assemble-x: 0px; --assemble-y: 68px; }
  .motion-ready [data-assemble].is-assembled [data-assemble-piece] { animation: sectionAssemble .82s cubic-bezier(.16, 1, .3, 1) both; }
  .motion-ready [data-assemble].is-assembled [data-assemble-piece]:nth-child(1) { animation-delay: 40ms; }
  .motion-ready [data-assemble].is-assembled [data-assemble-piece]:nth-child(2) { animation-delay: 150ms; }
  .motion-ready [data-assemble].is-assembled [data-assemble-piece]:nth-child(3) { animation-delay: 250ms; }
  .motion-ready [data-assemble].is-assembled [data-assemble-piece]:nth-child(4) { animation-delay: 340ms; }
  .motion-ready [data-assemble].is-assembled .product-rail { animation-delay: 110ms; }
  .motion-ready [data-assemble].is-assembled .product-stage { animation-delay: 210ms; }
  .hero h1, .motion-ready [data-assemble].is-assembled h2 { animation: titleDrift 5.8s ease-in-out 1.2s infinite; }
}