/* Two opposing rows keep the specialty directory active without a visible reset. */
.cm-specialty-marquees {
	display: grid;
	gap: 16px;
}

.cm-specialties .cm-section-intro > .cm-text-link {
	color: var(--cm-orange) !important;
}

.cm-specialties .cm-section-intro > .cm-text-link:hover,
.cm-specialties .cm-section-intro > .cm-text-link:focus-visible {
	color: #d95f11 !important;
}

.cm-tests-head > .cm-text-link {
	color: var(--cm-orange) !important;
}

.cm-tests-head > .cm-text-link:hover,
.cm-tests-head > .cm-text-link:focus-visible {
	color: #d95f11 !important;
}

.cm-specialty-carousel {
	position: relative;
	overflow: hidden;
	padding: 7px 0;
}

.cm-specialty-carousel::before,
.cm-specialty-carousel::after {
	position: absolute;
	top: 0;
	bottom: 0;
	z-index: 2;
	width: 56px;
	pointer-events: none;
	content: "";
}

.cm-specialty-carousel::before {
	left: 0;
	background: linear-gradient(90deg, #f4f9fd, rgba(244, 249, 253, 0));
}

.cm-specialty-carousel::after {
	right: 0;
	background: linear-gradient(270deg, #f4f9fd, rgba(244, 249, 253, 0));
}

.cm-specialty-track,
.cm-specialty-carousel-group {
	display: flex;
	width: max-content;
	align-items: stretch;
	gap: 16px;
}

.cm-specialty-track {
	animation: cm-specialty-marquee-left 34s linear infinite;
	will-change: transform;
}

.cm-specialty-carousel--reverse .cm-specialty-track {
	animation-name: cm-specialty-marquee-right;
}

.cm-specialty-carousel:hover .cm-specialty-track,
.cm-specialty-carousel:focus-within .cm-specialty-track {
	animation-play-state: paused;
}

.cm-specialty-carousel .cm-specialty-card {
	width: 286px;
	min-width: 286px;
	flex: 0 0 286px;
}

@keyframes cm-specialty-marquee-left {
	to { transform: translateX(calc(-50% - 8px)); }
}

@keyframes cm-specialty-marquee-right {
	from { transform: translateX(calc(-50% - 8px)); }
	to { transform: translateX(0); }
}

@media (max-width: 640px) {
	.cm-specialty-carousel::before,
	.cm-specialty-carousel::after {
		width: 26px;
	}

	.cm-specialty-carousel .cm-specialty-card {
		width: min(78vw, 300px);
		min-width: min(78vw, 300px);
		flex-basis: min(78vw, 300px);
	}
}

@media (prefers-reduced-motion: reduce) {
	.cm-specialty-carousel {
		overflow-x: auto;
	}

	.cm-specialty-track {
		animation: none;
		transform: none !important;
	}
}