/* Motion: the hero ticket printing out, plus a reduced-motion switch for everything. */

.ticket.is-printing { animation: ticket-out 1.6s steps(14, end) forwards; }
.ticket.is-leaving { animation: ticket-tear .5s var(--ease-out) forwards; }
@keyframes ticket-out { from { transform: translateY(100%); } to { transform: translateY(0); } }
@keyframes ticket-tear { to { transform: translate(30px, -40px) rotate(8deg); opacity: 0; } }

/* Page-load entrance for the hero only */
.hero-copy > * { animation: rise .7s var(--ease-out) backwards; }
.hero-copy > :nth-child(2) { animation-delay: .08s; }
.hero-copy > :nth-child(3) { animation-delay: .16s; }
.hero-copy > :nth-child(4) { animation-delay: .22s; }
.hero-stage { animation: stage-in .9s .15s var(--ease-out) backwards; }
@keyframes rise { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@keyframes stage-in { from { opacity: 0; transform: translateY(24px) scale(.98); } to { opacity: 1; transform: none; } }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important; animation-iteration-count: 1 !important;
    transition-duration: .01ms !important; scroll-behavior: auto !important;
  }
  .topo-line i { display: none; }
}

/* Scroll reveal — only when JS is running (html.js), so content never stays hidden without it */
.js [data-reveal] { opacity: 0; transform: translateY(22px); transition: opacity .7s var(--ease-out), transform .7s var(--ease-out);
  transition-delay: calc(var(--reveal-i, 0) * 70ms); }
.js [data-reveal].is-in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { .js [data-reveal] { opacity: 1; transform: none; } }