.d35-vehicles--carousel .d35-vehicles__viewport {
	overflow-x: auto;
	overscroll-behavior-inline: contain;
	scroll-snap-type: inline mandatory;
	scrollbar-gutter: stable;
}

.d35-vehicles--carousel .d35-vehicles__track {
	display: grid;
	grid-auto-flow: column;
	grid-auto-columns: calc((100% - (var(--d35-columns, 3) - 1) * 1.5rem) / var(--d35-columns, 3));
	gap: 1.5rem;
}

.d35-vehicles--carousel.d35-vehicles--columns-1 .d35-vehicles__track {
	grid-auto-columns: 100%;
}

.d35-vehicles--carousel .d35-card {
	scroll-snap-align: start;
	scroll-snap-stop: always;
}

.d35-vehicles--carousel.d35-carousel-ready .d35-vehicles__viewport {
	scrollbar-width: none;
}

.d35-vehicles--carousel.d35-carousel-ready .d35-vehicles__viewport::-webkit-scrollbar {
	display: none;
}

.d35-vehicles--carousel .d35-vehicles__controls {
	display: none;
	align-items: center;
	justify-content: center;
	gap: .75rem;
	margin-top: 1.25rem;
}

.d35-vehicles--carousel.d35-carousel-ready .d35-vehicles__controls {
	display: flex;
}

.d35-vehicles--carousel .d35-vehicles__controls button {
	display: inline-grid;
	place-items: center;
	min-width: 44px;
	min-height: 44px;
	padding: .5rem .75rem;
	border: 1px solid var(--d35-border, #dddddd);
	border-radius: .25rem;
	background: var(--d35-white, #ffffff);
	color: var(--d35-heading, #202020);
	font: inherit;
	cursor: pointer;
}

.d35-vehicles--carousel .d35-vehicles__controls button:hover {
	border-color: var(--d35-accent, #333333);
}

.d35-vehicles--carousel .d35-vehicles__controls button:focus-visible {
	outline: 3px solid var(--d35-heading, #202020);
	outline-offset: 3px;
}

.d35-vehicles--carousel .d35-vehicles__play-label,
.d35-vehicles--carousel .d35-vehicles__toggle[aria-pressed="true"] .d35-vehicles__pause-label {
	display: none;
}

.d35-vehicles--carousel .d35-vehicles__toggle[aria-pressed="true"] .d35-vehicles__play-label {
	display: inline;
}

.d35-vehicles--carousel .d35-vehicles__toggle:disabled {
	cursor: default;
	opacity: .6;
}

@media (max-width: 1024px) {
	.d35-vehicles--carousel .d35-vehicles__track {
		grid-auto-columns: calc((100% - 1.5rem) / 2);
	}

	.d35-vehicles--carousel.d35-vehicles--columns-1 .d35-vehicles__track {
		grid-auto-columns: 100%;
	}
}

@media (max-width: 600px) {
	.d35-vehicles--carousel .d35-vehicles__track {
		grid-auto-columns: 100%;
	}
}

@media (prefers-reduced-motion: reduce) {
	.d35-vehicles--carousel .d35-vehicles__viewport {
		scroll-behavior: auto;
	}
}
