/* ==========================================================================
   animations.css · motion states, keyframes and reduced-motion rules
   Initial "hidden" states apply only when JavaScript is running and the visitor
   has not asked for reduced motion. If scripts fail, .motion-failed reveals everything.
   ========================================================================== */

/* Hero entry: hidden until the intro timeline plays */
.js:not(.reduced-motion):not(.motion-failed) .hero [data-hero-in],
.js:not(.reduced-motion):not(.motion-failed) .hero .hero__trust li,
.js:not(.reduced-motion):not(.motion-failed) .hero__line,
.js:not(.reduced-motion):not(.motion-failed) .hero-arch,
.js:not(.reduced-motion):not(.motion-failed) .hs-fan__book,
.js:not(.reduced-motion):not(.motion-failed) .hs-vine,
.js:not(.reduced-motion):not(.motion-failed) .hs-foliage,
.js:not(.reduced-motion):not(.motion-failed) .hs-parrot { opacity: 0; }

/* Word-split headings */
.w { display: inline-block; overflow: hidden; vertical-align: top; padding-bottom: .08em; margin-bottom: -.08em; }
.w__i { display: inline-block; will-change: transform; }

/* Gentle CSS loops (also run when GSAP is unavailable) */
@keyframes steam { 0% { transform: translateY(6px); opacity: 0; } 30% { opacity: .8; } 100% { transform: translateY(-14px); opacity: 0; } }
.prop-mug .steam path { animation: steam 3.2s ease-in-out infinite; }
.prop-mug .steam .steam-2 { animation-delay: 1s; }
.prop-mug .steam .steam-3 { animation-delay: 2s; }

@keyframes flicker { 0%, 100% { opacity: .55; } 45% { opacity: .62; } 50% { opacity: .5; } 55% { opacity: .6; } }
.lamp-glow { animation: flicker 5s ease-in-out infinite; }

@keyframes twinkle { 0%, 100% { opacity: .25; } 50% { opacity: .55; } }
.prop-lights .bulb circle { animation: twinkle 2.4s ease-in-out infinite; }
.prop-lights .bulb:nth-child(2n) circle { animation-delay: .8s; }
.prop-lights .bulb:nth-child(3n) circle { animation-delay: 1.6s; }

@keyframes bob { 0%, 100% { transform: translateY(0) rotate(var(--r, 0deg)); } 50% { transform: translateY(-10px) rotate(var(--r, 0deg)); } }

/* Confetti burst particles (created by JS) */
.confetti-piece { position: fixed; z-index: 300; width: 10px; height: 14px; border-radius: 2px; pointer-events: none; }

/* Page-load curtain for book worlds */
.book-hero [data-enter] { will-change: transform, opacity; }

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; scroll-behavior: auto !important; }
  .scroll-cue span { animation: none; }
}
.reduced-motion .prop-mug .steam path,
.reduced-motion .lamp-glow,
.reduced-motion .prop-lights .bulb circle { animation: none; }
