/* =============================================================
   ContractorsLane — Animations
   Scroll reveal (Intersection Observer) · keyframes · hover
   All motion respects prefers-reduced-motion.
   ============================================================= */

/* ---------- Scroll reveal ----------
   Hidden state only applies when JS is active (html.js). Without JS the
   content is fully visible — no invisible content for crawlers or a11y. */
.js .cl-reveal {
	opacity: 0;
	transform: translateY(28px);
	transition: opacity 0.7s var(--cl-ease), transform 0.7s var(--cl-ease);
	will-change: opacity, transform;
}
.js .cl-reveal.is-visible {
	opacity: 1;
	transform: none;
}

/* Stagger children when a container gets .is-visible */
.js .cl-reveal-group > * {
	opacity: 0;
	transform: translateY(24px);
	transition: opacity 0.6s var(--cl-ease), transform 0.6s var(--cl-ease);
}
.js .cl-reveal-group.is-visible > * { opacity: 1; transform: none; }
.cl-reveal-group.is-visible > *:nth-child(1) { transition-delay: 0.05s; }
.cl-reveal-group.is-visible > *:nth-child(2) { transition-delay: 0.12s; }
.cl-reveal-group.is-visible > *:nth-child(3) { transition-delay: 0.19s; }
.cl-reveal-group.is-visible > *:nth-child(4) { transition-delay: 0.26s; }
.cl-reveal-group.is-visible > *:nth-child(5) { transition-delay: 0.33s; }
.cl-reveal-group.is-visible > *:nth-child(6) { transition-delay: 0.40s; }

/* ---------- Keyframes ---------- */
@keyframes cl-scroll {
	from { transform: translateX(0); }
	to   { transform: translateX(-50%); }
}

@keyframes cl-float {
	0%, 100% { transform: translateY(0); }
	50%      { transform: translateY(-12px); }
}

@keyframes cl-pulse {
	0%, 100% { box-shadow: 0 0 0 0 rgba(247, 181, 0, 0.4); }
	50%      { box-shadow: 0 0 0 8px rgba(247, 181, 0, 0); }
}

@keyframes cl-fade-in {
	from { opacity: 0; transform: translateY(16px); }
	to   { opacity: 1; transform: none; }
}

/* Hero entrance on first paint */
.cl-hero__content > * { animation: cl-fade-in 0.8s var(--cl-ease) both; }
.cl-hero__content > *:nth-child(1) { animation-delay: 0.05s; }
.cl-hero__content > *:nth-child(2) { animation-delay: 0.15s; }
.cl-hero__content > *:nth-child(3) { animation-delay: 0.25s; }
.cl-hero__content > *:nth-child(4) { animation-delay: 0.35s; }
.cl-hero__content > *:nth-child(5) { animation-delay: 0.45s; }
.cl-hero__visual { animation: cl-fade-in 1s var(--cl-ease) 0.35s both; }

/* Counter flip while animating */
.cl-stat-card__num.is-counting { color: transparent; }

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*,
	*::before,
	*::after {
		animation-duration: 0.001ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.001ms !important;
		scroll-behavior: auto !important;
	}
	.cl-reveal,
	.cl-reveal-group > * { opacity: 1; transform: none; }
	.cl-marquee__track { animation: none; }
	.cl-hero__float { animation: none; }
}