/* Reduced motion */

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}

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

/* ==========================================
   Header Scroll
========================================== */

.site-header{

	transition:.35s;

}

.site-header.is-scrolled{

	background:rgba(255,255,255,.94);

	box-shadow:0 12px 40px rgba(0,0,0,.06);

}

.site-header.is-scrolled .header{

	min-height:72px;

}

/* ==========================================
   Reveal Animation
========================================== */

.reveal{

	opacity:0;

	transform:translateY(40px);

	transition:

		opacity .8s,

		transform .8s;

}

.reveal.is-visible{

	opacity:1;

	transform:none;

}

/* ==========================================
   Better Hover
========================================== */

.service-card{

	will-change:transform;

}

.button{

	position:relative;

	overflow:hidden;

}

.button::before{

	content:"";

	position:absolute;

	inset:0;

	background:rgba(255,255,255,.12);

	transform:translateX(-100%);

	transition:.5s;

}

@media (hover: hover) {
	.button:hover::before{

		transform:translateX(100%);

	}
}