/* ============================================================
   Tiba-Tiba Sah — Animations & Motion utilities
   ============================================================ */

/* ── Keyframes ──────────────────────────────────────── */
@keyframes pulseGlow {
  0%,100% { opacity: .55; }
  50%     { opacity: 1; }
}
@keyframes marquee {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}

/* ── Reveal (progressive enhancement) ────────────────
   Default = TERLIHAT. JS menambahkan .reveal (state awal tersembunyi)
   hanya bila motion didukung, lalu .is-in untuk memunculkan.
   Jadi tanpa JS / CDN gagal, konten tetap tampil penuh. */
.reveal {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity .8s var(--ease), transform .8s var(--ease);
  will-change: opacity, transform;
}
.reveal.is-in { opacity: 1; transform: none; }

.reveal-stagger > * {
  opacity: 0;
  transform: translateY(26px);
  transition: opacity .7s var(--ease), transform .7s var(--ease);
}
.reveal-stagger.is-in > * { opacity: 1; transform: none; }
.reveal-stagger.is-in > *:nth-child(1) { transition-delay: .05s; }
.reveal-stagger.is-in > *:nth-child(2) { transition-delay: .12s; }
.reveal-stagger.is-in > *:nth-child(3) { transition-delay: .19s; }
.reveal-stagger.is-in > *:nth-child(4) { transition-delay: .26s; }
.reveal-stagger.is-in > *:nth-child(5) { transition-delay: .33s; }
.reveal-stagger.is-in > *:nth-child(6) { transition-delay: .40s; }
.reveal-stagger.is-in > *:nth-child(7) { transition-delay: .47s; }
.reveal-stagger.is-in > *:nth-child(8) { transition-delay: .54s; }
.reveal-stagger.is-in > *:nth-child(9) { transition-delay: .61s; }

/* Hero word reveal */
.word { display: inline-block; overflow: hidden; vertical-align: top; }
.word > span {
  display: inline-block;
  transform: translateY(110%);
  transition: transform .9s var(--ease);
}
.hero-ready .word > span { transform: translateY(0); }
.hero-ready .word:nth-child(2) > span { transition-delay: .08s; }
.hero-ready .word:nth-child(3) > span { transition-delay: .16s; }
.hero-ready .word:nth-child(4) > span { transition-delay: .24s; }
.hero-ready .word:nth-child(5) > span { transition-delay: .32s; }

/* ── Reduced motion: matikan semua gerakan besar ───── */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
    scroll-behavior: auto !important;
  }
  .reveal, .reveal-stagger > * { opacity: 1 !important; transform: none !important; }
  .word > span { transform: none !important; }
}