@media (prefers-reduced-motion: no-preference) {
	html.studio-cluster-motion
		.work-hub__grid--engagements[data-cluster]:not([data-work-grid-mounted])
		.work-engagement-card {
		animation-name: none;
	}

	html.studio-cluster-motion .cluster-nav__chip[data-cluster-wipe],
	html.studio-cluster-motion
		.work-hub__grid--engagements[data-cluster]
		.work-engagement-card[data-cluster-wipe] {
		will-change: clip-path, opacity;
	}
	html.studio-cluster-motion .cluster-nav__chip[data-cluster-wipe] {
		opacity: 0;
		-webkit-clip-path: inset(0% 100% 0% 0%);
		clip-path: inset(0% 100% 0% 0%);
	}

	html.studio-cluster-motion .cluster-nav__chip[data-cluster-wipe='in'] {
		animation: studio-cluster-chip-wipe 0.46s cubic-bezier(0.22, 1, 0.36, 1) both;
		animation-delay: calc(
			var(--wipe-lead, 0ms) + var(--wipe-index, 0) * 70ms
		);
	}

	@keyframes studio-cluster-chip-wipe {
		from {
			opacity: 0;
			-webkit-clip-path: inset(0% 100% 0% 0%);
			clip-path: inset(0% 100% 0% 0%);
		}

		to {
			opacity: 1;
			-webkit-clip-path: inset(0% 0% 0% 0%);
			clip-path: inset(0% 0% 0% 0%);
		}
	}
	html.studio-cluster-motion
		.work-hub__grid--engagements[data-cluster]
		.work-engagement-card[data-cluster-wipe] {
		-webkit-clip-path: inset(0% 0% 100% 0%);
		clip-path: inset(0% 0% 100% 0%);
	}

	html.studio-cluster-motion
		.work-hub__grid--engagements[data-cluster]
		.work-engagement-card[data-cluster-wipe='in'] {
		animation: studio-cluster-card-wipe 0.68s cubic-bezier(0.22, 1, 0.36, 1) both;
		animation-delay: calc(
			var(--wipe-lead, 0ms) + var(--wipe-index, 0) * 120ms
		);
	}

	@keyframes studio-cluster-card-wipe {
		from {
			-webkit-clip-path: inset(0% 0% 100% 0%);
			clip-path: inset(0% 0% 100% 0%);
		}

		to {
			-webkit-clip-path: inset(0% 0% 0% 0%);
			clip-path: inset(0% 0% 0% 0%);
		}
	}
}