/**
 * Animations — entrance reveals, counters, marquee, hero motion.
 * Everything here is opacity/transform only (no layout-triggering
 * properties) and is fully neutralized by the prefers-reduced-motion
 * block in base.css.
 */

@keyframes momentum-spin {
	to { transform: rotate(360deg); }
}

@keyframes momentum-marquee {
	from { transform: translateX(0); }
	to { transform: translateX(-50%); }
}

@keyframes momentum-fade-up {
	from { opacity: 0; transform: translateY(24px); }
	to { opacity: 1; transform: translateY(0); }
}

@keyframes momentum-fade-in {
	from { opacity: 0; }
	to { opacity: 1; }
}

@keyframes momentum-drift {
	0%, 100% { transform: translate(0, 0); }
	50% { transform: translate(12px, -14px); }
}

/* Scroll-reveal: elements start hidden and are flipped to .is-revealed by
   scroll-effects.js via IntersectionObserver. If JS never runs (disabled/
   blocked), the .no-js fallback below keeps content visible immediately. */
[data-reveal] {
	opacity: 0;
	transform: translateY(24px);
	transition: opacity var(--duration-reveal) var(--ease-out), transform var(--duration-reveal) var(--ease-out);
}
[data-reveal].is-revealed {
	opacity: 1;
	transform: translateY(0);
}
.no-js [data-reveal] {
	opacity: 1;
	transform: none;
}

[data-reveal-group] > * { transition-delay: calc(var(--reveal-index, 0) * 80ms); }

@media (prefers-reduced-motion: reduce) {
	[data-reveal] { opacity: 1; transform: none; transition: none; }
	.marquee__track { animation: none; }
	.hero__drift { animation: none; }
}

/* Hero background motion — a slow drifting glow, not a particle circus. */
.hero__drift {
	animation: momentum-drift 10s var(--ease-in-out) infinite;
}

/* Counter number pop when it finishes counting (counters.js toggles this
   class briefly on completion). */
.stat__value.is-counting { color: var(--color-primary); }