.samesville-hero--fade {
	--color-fade-duration: 7s;
	--color-fade-easing: cubic-bezier(0.45, 0, 0.55, 1);
	--image-drift-duration: 18s;
}

.samesville-hero--fade .samesville-hero__visual {
	cursor: default;
	touch-action: auto;
}

.samesville-hero--fade .samesville-hero__image {
	animation: samesville-pan-zoom var(--image-drift-duration) ease-in-out infinite;
	transform-origin: 70% 50%;
	backface-visibility: hidden;
	will-change: transform;
}

.samesville-hero--fade .samesville-hero__image--color {
	opacity: 0;
	clip-path: none;
	transition: opacity var(--color-fade-duration) var(--color-fade-easing);
	will-change: opacity;
}

.samesville-hero--fade.is-colorized .samesville-hero__image--color {
	opacity: 1;
}

.samesville-hero--fade .samesville-hero__title strong {
	color: #cecece;
	text-shadow: none;
	transition:
		color var(--color-fade-duration) var(--color-fade-easing),
		text-shadow var(--color-fade-duration) var(--color-fade-easing);
}

.samesville-hero--fade.is-colorized .samesville-hero__title strong {
	color: var(--samesville-green);
	text-shadow: 0 0 1.7rem rgba(102, 172, 47, 0.22);
}

.samesville-hero--fade .samesville-hero__copy {
	color: rgba(218, 218, 218, 0.76);
}

.samesville-hero--fade.is-ready .samesville-hero__copy {
	transition:
		opacity 700ms ease 180ms,
		transform 700ms cubic-bezier(0.2, 0.7, 0.2, 1) 180ms,
		color var(--color-fade-duration) var(--color-fade-easing);
}

.samesville-hero--fade .samesville-hero__copy strong {
	color: rgba(232, 232, 232, 0.86);
	transition: color var(--color-fade-duration) var(--color-fade-easing);
}

.samesville-hero--fade.is-colorized .samesville-hero__copy {
	color: rgba(255, 255, 255, 0.88);
}

.samesville-hero--fade.is-colorized .samesville-hero__copy strong {
	color: var(--samesville-white);
}

.samesville-hero--fade .samesville-hero__cta,
.samesville-hero--fade .samesville-hero__cta:hover {
	position: relative;
	isolation: isolate;
	overflow: hidden;
	background: #686b66;
}

.samesville-hero--fade .samesville-hero__cta::before {
	position: absolute;
	z-index: 0;
	inset: 0;
	background: linear-gradient(100deg, var(--samesville-green-dark), #6cbd3b);
	content: "";
	opacity: 0;
	transition: opacity var(--color-fade-duration) var(--color-fade-easing);
}

.samesville-hero--fade.is-colorized .samesville-hero__cta::before {
	opacity: 1;
}

.samesville-hero--fade .samesville-hero__cta > span {
	position: relative;
	z-index: 1;
}

.samesville-hero--fade .samesville-hero__cta-label {
	font-size: 1em;
}

.samesville-hero--fade .samesville-hero__cta:hover .samesville-hero__cta-label {
	transform: none;
}

@keyframes samesville-pan-zoom {
	0%,
	100% {
		transform: scale(1.015) translate3d(0.12%, 0, 0);
	}

	50% {
		transform: scale(1.035) translate3d(-0.22%, -0.12%, 0);
	}
}

@keyframes samesville-mobile-pan-zoom {
	from {
		transform: scale(1.015) translate3d(0.08%, 0, 0);
	}

	to {
		transform: scale(1.025) translate3d(-0.12%, -0.06%, 0);
	}
}

@media (max-width: 47.99rem) {
	.samesville-hero--fade .samesville-hero__image {
		animation: samesville-mobile-pan-zoom var(--color-fade-duration) ease-out 450ms both;
	}
}

@media (prefers-reduced-motion: reduce) {
	.samesville-hero--fade .samesville-hero__image--color {
		opacity: 1;
	}
}