/*
 * Motion language.
 * Page should feel still until the user pays attention.
 */

[data-cielo-reveal] {
	opacity: 0;
	transform: translateY(16px);
	filter: blur(2px);
	transition:
		opacity var(--cielo-motion-normal) var(--cielo-ease),
		transform var(--cielo-motion-normal) var(--cielo-ease),
		filter var(--cielo-motion-normal) var(--cielo-ease);
}

[data-cielo-reveal].is-visible {
	opacity: 1;
	transform: translateY(0);
	filter: blur(0);
}

.cielo-hero.is-ready .cielo-hero__scroll i {
	animation: cielo-scroll-breathe 2.8s var(--cielo-ease-soft) infinite;
}

@keyframes cielo-scroll-breathe {
	0%, 100% { opacity: .34; transform: scaleY(.72); transform-origin: top; }
	50% { opacity: .92; transform: scaleY(1); transform-origin: top; }
}

@media (prefers-reduced-motion: reduce) {
	[data-cielo-reveal] {
		opacity: 1 !important;
		transform: none !important;
		transition: none !important;
	}

	.cielo-site *,
	.cielo-site *::before,
	.cielo-site *::after {
		scroll-behavior: auto !important;
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
	}
}

.cielo-aging__card:nth-child(2){transition-delay:.08s}
.cielo-aging__card:nth-child(3){transition-delay:.16s}