/* =========================================================
   INTERIA — animations.css
   Initial states for GSAP targets + pure-CSS animations.
   GSAP animates FROM these states; if JS fails, the
   .no-js / .gsap-failed fallbacks keep content visible.
   ========================================================= */

/* Elements GSAP will reveal start hidden — but only when JS is running */
.js [data-animate="fade-up"],
.js [data-animate="cards"] > *,
.js [data-hero-sub],
.js [data-hero-ctas] {
	opacity: 0;
}

/* Hero word reveal: words are wrapped by Splitting.js / animations.js */
.js .hero__headline .word > .word-inner {
	display: inline-block;
	transform: translateY(110%);
}

/* Image clip reveal — GSAP drives clip-path + scale */
.js .img-reveal[data-reveal-pending] img {
	clip-path: inset(0 0 100% 0);
	transform: scale(1.08);
}

/* Marquee is pure CSS (declared in components.css) */

/* Char splitting via Splitting.js */
.js [data-animate="chars"] .char {
	display: inline-block;
	opacity: 0;
	transform: translateY(20px);
}

/* Footer column reveal */
.js [data-footer-col] { opacity: 0; transform: translateY(32px); }

/* Reduced motion: neutralise everything */
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
	.js [data-animate="fade-up"],
	.js [data-animate="cards"] > *,
	.js [data-hero-sub],
	.js [data-hero-ctas],
	.js [data-animate="chars"] .char,
	.js [data-footer-col] {
		opacity: 1 !important;
		transform: none !important;
	}
	.js .hero__headline .word > .word-inner { transform: none; }
	.js .img-reveal[data-reveal-pending] img { clip-path: none; transform: none; }
}