/**
 * Entrata in vista al scroll — IntersectionObserver + .is-inview
 * Ritardo: style inline --widen-reveal-delay (es. 0.1s) su ogni blocco.
 */

.widen-reveal {
	--widen-reveal-delay: 0ms;
	--widen-reveal-y: 2.25rem;
	opacity: 0;
	transform: translate3d(0, var(--widen-reveal-y), 0) scale(0.985);
	filter: blur(3px);
	will-change: opacity, transform, filter;
	transition:
		opacity 0.75s cubic-bezier(0.16, 1, 0.3, 1),
		transform 0.78s cubic-bezier(0.16, 1, 0.3, 1),
		filter 0.55s cubic-bezier(0.33, 1, 0.68, 1);
	transition-delay: var(--widen-reveal-delay);
}

.widen-reveal.is-inview {
	opacity: 1;
	transform: translate3d(0, 0, 0) scale(1);
	filter: blur(0);
	will-change: auto;
}

/* Variante: entra da sinistra (titoli sezioni) */
.widen-reveal--from-left {
	--widen-reveal-y: 0;
	transform: translate3d(-1.75rem, 0.75rem, 0) scale(0.99);
}

.widen-reveal--from-left.is-inview {
	transform: translate3d(0, 0, 0) scale(1);
}

/* Variante: leggero “pop” sulle CTA / card compatte */
.widen-reveal--pop {
	--widen-reveal-y: 1.25rem;
	transform: translate3d(0, var(--widen-reveal-y), 0) scale(0.96);
	filter: blur(2px);
}

@media (max-width: 47.99rem) {
	.widen-reveal,
	.widen-reveal--from-left,
	.widen-reveal--pop {
		filter: none;
		will-change: opacity, transform;
		transition:
			opacity 0.55s cubic-bezier(0.16, 1, 0.3, 1) var(--widen-reveal-delay),
			transform 0.58s cubic-bezier(0.16, 1, 0.3, 1) var(--widen-reveal-delay);
	}
}

.widen-reveal--pop.is-inview {
	transform: translate3d(0, 0, 0) scale(1);
}

@media (prefers-reduced-motion: reduce) {
	.widen-reveal {
		opacity: 1 !important;
		transform: none !important;
		filter: none !important;
		transition: none !important;
		will-change: auto !important;
	}
}