/**
 * Entrada y parallax sutil para la imagen principal del Hero.
 */

.hero-image-home {
	--p4-hero-parallax-y: 0px;

	opacity: 0;
	clip-path: inset(2.5% 2.5% 2.5% 2.5%);
	filter: blur(3px);
	transform: translate3d(0, var(--p4-hero-parallax-y), 0) scale(1.015);
	transform-origin: 50% 65%;
	transition: opacity 1100ms ease,
		clip-path 1400ms cubic-bezier(0.22, 1, 0.36, 1),
		filter 1100ms ease;
	will-change: transform;
}

.hero-image-home.is-visible {
	opacity: 1;
	clip-path: inset(0 0 0 0);
	filter: blur(0);
}

@media (prefers-reduced-motion: reduce) {
	.hero-image-home,
	.hero-image-home.is-visible {
		opacity: 1;
		clip-path: none;
		filter: none;
		transform: none;
		transition: none;
	}
}
