/**
 * Scroll-triggered section reveals — smooth ease-out motion.
 */

:root {
	--atlas-ease-out: cubic-bezier(0.16, 1, 0.3, 1);
	--atlas-ease-out-soft: cubic-bezier(0.22, 1, 0.36, 1);
	--atlas-reveal-distance: 2rem;
	--atlas-reveal-duration: 0.8s;
	--atlas-reveal-base-delay: 0.05s;
}

/* Above-the-fold sections stay visible for LCP — animations are below-fold only. */
.atlas-reveal--hero,
.atlas-reveal--hero .atlas-reveal__item,
.atlas-reveal--stats,
.atlas-reveal--stats .atlas-reveal__item {
	opacity: 1 !important;
	visibility: visible !important;
	transform: none !important;
	animation: none !important;
}

@media (prefers-reduced-motion: no-preference) {
	.atlas-reveal {
		--atlas-stagger-delay: 0s;
	}

	.atlas-reveal:not(.is-in-view) .atlas-reveal__item {
		opacity: 0;
	}

	.atlas-reveal--pillars:not(.is-in-view) .atlas-reveal__item,
	.atlas-reveal--map:not(.is-in-view) .atlas-reveal__item,
	.atlas-reveal--stories:not(.is-in-view) .atlas-reveal__item,
	.atlas-reveal--supporters:not(.is-in-view) .atlas-reveal__item {
		transform: translateY(var(--atlas-reveal-distance));
	}

	.atlas-reveal--commitment:not(.is-in-view) {
		transform: translateY(1.25rem);
	}

	.atlas-reveal--commitment:not(.is-in-view) .atlas-reveal__item {
		transform: translateY(1rem);
	}

	.atlas-reveal--steps:not(.is-in-view) .atlas-reveal__item {
		transform: translateX(-1.5rem);
	}

	.atlas-reveal.is-in-view {
		visibility: visible;
	}

	.atlas-reveal--pillars.is-in-view .atlas-reveal__item,
	.atlas-reveal--map.is-in-view .atlas-reveal__item,
	.atlas-reveal--stories.is-in-view .atlas-reveal__item,
	.atlas-reveal--supporters.is-in-view .atlas-reveal__item,
	.atlas-reveal--commitment.is-in-view,
	.atlas-reveal--commitment.is-in-view .atlas-reveal__item {
		animation: atlas-reveal-up var(--atlas-reveal-duration) var(--atlas-ease-out) calc(var(--atlas-reveal-base-delay) + var(--atlas-stagger-delay, 0s)) both;
	}

	.atlas-reveal--steps.is-in-view .atlas-reveal__item {
		animation: atlas-reveal-left 0.75s var(--atlas-ease-out) calc(var(--atlas-reveal-base-delay) + var(--atlas-stagger-delay, 0s)) both;
	}

	@keyframes atlas-reveal-up {
		from {
			opacity: 0;
			transform: translateY(var(--atlas-reveal-distance));
		}

		to {
			opacity: 1;
			transform: translateY(0);
		}
	}

	@keyframes atlas-reveal-left {
		from {
			opacity: 0;
			transform: translateX(-1.5rem);
		}

		to {
			opacity: 1;
			transform: translateX(0);
		}
	}
}

@media (prefers-reduced-motion: reduce) {
	.atlas-reveal,
	.atlas-reveal__item {
		opacity: 1 !important;
		transform: none !important;
		animation: none !important;
	}
}
