/* A short, once-only sequence. No content is hidden while waiting for JavaScript.
   Individual translate/scale preserve the existing product rotations and layout. */
@media (prefers-reduced-motion: no-preference) {
  .motion-run .hero-receipt {
    animation: tastie-arrive 480ms cubic-bezier(.16, 1, .3, 1) backwards;
  }
  .motion-run .hero-device {
    animation: tastie-product 660ms cubic-bezier(.16, 1, .3, 1) 120ms backwards;
  }
  .motion-run .hero-receipt-line {
    animation: tastie-arrive 300ms cubic-bezier(.16, 1, .3, 1) 260ms backwards;
  }
  .motion-run .hero-receipt-line:nth-child(3) { animation-delay: 350ms; }
  .motion-run .hero-receipt-line:nth-child(4) { animation-delay: 440ms; }
  .motion-run .free-stamp {
    animation: tastie-stamp 360ms cubic-bezier(.16, 1, .3, 1) 580ms backwards;
  }
  .motion-run .order-receipt,
  .motion-run .terminal-device,
  .motion-run .domain-browser {
    animation: tastie-product 580ms cubic-bezier(.16, 1, .3, 1) backwards;
  }
  .motion-run .commission-line,
  .motion-run .included-tag,
  .motion-run .domain-paid {
    animation: tastie-arrive 320ms cubic-bezier(.16, 1, .3, 1) 260ms backwards;
  }
  .menu-illustration.motion-run .menu-sheet {
    animation: tastie-photo 900ms cubic-bezier(.16, 1, .3, 1) backwards;
  }
  .menu-illustration.motion-run::after {
    content: '';
    position: absolute;
    inset: 16px 22px;
    border: 1px solid #be8970;
    border-radius: 12px;
    opacity: 0;
    pointer-events: none;
    animation: tastie-viewfinder 1100ms cubic-bezier(.16, 1, .3, 1) backwards;
  }
  .motion-run > .feature,
  .motion-run > .guide-card {
    animation: tastie-arrive 420ms cubic-bezier(.16, 1, .3, 1) backwards;
  }
  .motion-run > .feature:nth-child(2),
  .motion-run > .guide-card:nth-child(2) { animation-delay: 60ms; }
  .motion-run > .feature:nth-child(3),
  .motion-run > .guide-card:nth-child(3) { animation-delay: 120ms; }
  .motion-run > .feature:nth-child(4) { animation-delay: 180ms; }

  @keyframes tastie-arrive {
    from { opacity: .3; translate: 0 10px; }
    to { opacity: 1; translate: 0 0; }
  }
  @keyframes tastie-product {
    from { opacity: .45; translate: 0 18px; scale: .98; }
    to { opacity: 1; translate: 0 0; scale: 1; }
  }
  @keyframes tastie-stamp {
    from { opacity: .3; scale: .92; }
    to { opacity: 1; scale: 1; }
  }
  @keyframes tastie-photo {
    0% { scale: .97; translate: 0 8px; }
    65%, 100% { scale: 1; translate: 0 0; }
  }
  @keyframes tastie-viewfinder {
    0% { opacity: 0; scale: 1.04; }
    35%, 60% { opacity: .75; scale: 1; }
    100% { opacity: 0; scale: 1; }
  }
}

/* Print and system preferences always show the complete, still composition. */
@media print, (prefers-reduced-motion: reduce) {
  .motion-run, .motion-run * { animation: none !important; }
  .menu-illustration.motion-run::after { display: none; }
}