/* eb5inc.com — motion. On while <body> has .motion-on (Appearance → Customize →
   eb5inc.com). Hero copy rises on load with an 80ms stagger; elements with
   .rise fade up as they scroll into view (CSS scroll-driven animation, where
   supported). Nothing is hidden by script, so content never stays invisible.
   Everything stops under prefers-reduced-motion. */

@keyframes eb5rise { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }
@keyframes eb5fade { from { opacity: 0; } to { opacity: 1; } }

.motion-on .hero-copy > .elementor-element { animation: eb5rise 700ms var(--eb-ease) both; }
.motion-on .hero-copy > .elementor-element:nth-child(2) { animation-delay: 80ms; }
.motion-on .hero-copy > .elementor-element:nth-child(3) { animation-delay: 160ms; }
.motion-on .hero-copy > .elementor-element:nth-child(4) { animation-delay: 240ms; }
.motion-on .hero-copy > .elementor-element:nth-child(5) { animation-delay: 320ms; }
.motion-on .hero-img, .motion-on .band { animation: eb5fade 900ms var(--eb-ease) 150ms both; }
.motion-on .modal[open] { animation: eb5rise 260ms var(--eb-ease) both; }

@supports (animation-timeline: view()) {
	.motion-on .rise {
		animation: eb5rise linear both;
		animation-timeline: view();
		animation-range: entry 0% entry 60%;
	}
}

/* Transitions (hover states) are short; motion is removed entirely on request. */
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation: none !important; transition: none !important; } /* user preference wins over every animation */
}