/**
 * Alfa Marble motion system.
 *
 * Native CSS transitions are activated by motion.js. No animation library is
 * required, and content remains readable when JavaScript is unavailable.
 */

html.alfa-motion-enabled .alfa-reveal {
	--alfa-motion-delay: 0ms;
	--alfa-motion-duration: 960ms;
	--alfa-motion-distance: 28px;
	opacity: 0;
	visibility: hidden;
	transition-property: opacity, transform, visibility;
	transition-duration: var(--alfa-motion-duration), var(--alfa-motion-duration), 0s;
	transition-delay: var(--alfa-motion-delay);
	transition-timing-function: cubic-bezier(.22, 1, .36, 1);
	will-change: opacity, transform;
}

html.alfa-motion-enabled .alfa-reveal.alfa-reveal--preparing {
	transition: none;
}

html.alfa-motion-enabled .alfa-reveal--up {
	transform: translate3d(0, var(--alfa-motion-distance), 0);
}

html.alfa-motion-enabled .alfa-reveal--hero {
	transform: translate3d(0, var(--alfa-motion-distance), 0);
}

html.alfa-motion-enabled .alfa-reveal--scale {
	transform: scale(.972);
}

html.alfa-motion-enabled .alfa-reveal--wide {
	transform: translate3d(0, 34px, 0) scale(.992);
}

html.alfa-motion-enabled .alfa-reveal--side {
	transform: translate3d(30px, 0, 0);
}

html.alfa-motion-enabled .alfa-reveal.is-visible {
	opacity: 1;
	visibility: visible;
}

html.alfa-motion-enabled .alfa-reveal--up.is-visible,
html.alfa-motion-enabled .alfa-reveal--hero.is-visible,
html.alfa-motion-enabled .alfa-reveal--scale.is-visible,
html.alfa-motion-enabled .alfa-reveal--wide.is-visible,
html.alfa-motion-enabled .alfa-reveal--side.is-visible {
	transform: translate3d(0, 0, 0) scale(1);
}

.alfa-parallax-layer {
	translate: 0 var(--alfa-parallax-y, 0%);
}

@media (hover: hover) and (pointer: fine) {
	.button,
	.text-link,
	.site-header__phone,
	.alfa-whatsapp-float,
	.alfa-service-card__media img,
	.alfa-work-gallery__item img,
	.alfa-work__item img,
	.alfa-process-card figure img,
	.alfa-about-intro figure img {
		will-change: transform;
	}
}

@media (max-width: 780px) {
	html.alfa-motion-enabled .alfa-reveal {
		--alfa-motion-duration: 760ms;
		--alfa-motion-distance: 22px;
	}

	html.alfa-motion-enabled .alfa-reveal--wide {
		transform: translate3d(0, 24px, 0) scale(.995);
	}

	html.alfa-motion-enabled .alfa-reveal--side {
		transform: translate3d(20px, 0, 0);
	}
}

@media (prefers-reduced-motion: reduce) {
	html .alfa-reveal {
		opacity: 1;
		visibility: visible;
		transition: none;
	}

	.alfa-parallax-layer {
		translate: none;
	}

	.alfa-hero__media img {
		transform: none;
	}
}
