/* ==========================================================================
   Product slider (template-parts/tech-ae-product-slider)
   Cards per view: 2 · 3 from 768px · --tech-ae-slider-cols (default 4) from 1200px.
   ========================================================================== */
.tech-ae-slider {
	--tech-ae-slider-gap: 14px;
	--tech-ae-slider-view: 2;
	min-width: 0;
}

.tech-ae-slider__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	margin-bottom: 18px;
}
.tech-ae-slider__title { margin: 0; font-size: clamp(1.25rem, 1.1rem + .6vw, 1.6rem); }

.tech-ae-slider__nav { display: flex; gap: 8px; margin-left: auto; }
.tech-ae-slider.is-static .tech-ae-slider__nav { display: none; }
.tech-ae-slider__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 42px;
	height: 42px;
	padding: 0;
	border: 1px solid var(--tech-ae-border-strong);
	border-radius: 50%;
	background: var(--tech-ae-white);
	color: var(--tech-ae-dark);
	cursor: pointer;
	transition: background var(--tech-ae-ease), border-color var(--tech-ae-ease), color var(--tech-ae-ease);
}
.tech-ae-slider__btn:hover:not(:disabled) { border-color: var(--tech-ae-primary); background: var(--tech-ae-primary); color: var(--tech-ae-white); }
.tech-ae-slider__btn:disabled { opacity: .4; cursor: default; }

.tech-ae-slider__track {
	display: grid;
	grid-auto-flow: column;
	grid-auto-columns: calc((100% - (var(--tech-ae-slider-view) - 1) * var(--tech-ae-slider-gap)) / var(--tech-ae-slider-view));
	gap: var(--tech-ae-slider-gap);
	margin: 0;
	padding: 4px 0 8px; /* Room for the card hover lift. */
	overflow-x: auto;
	overscroll-behavior-x: contain;
	scroll-snap-type: x mandatory;
	scroll-behavior: smooth;
	scrollbar-width: none;
	list-style: none;
}
.tech-ae-slider__track::-webkit-scrollbar { display: none; }
.tech-ae-slider__track > * { scroll-snap-align: start; }

@media (min-width: 768px) {
	.tech-ae-slider { --tech-ae-slider-gap: 20px; --tech-ae-slider-view: 3; }
}
@media (min-width: 1200px) {
	.tech-ae-slider { --tech-ae-slider-gap: 24px; --tech-ae-slider-view: var(--tech-ae-slider-cols, 4); }
}

@media (prefers-reduced-motion: reduce) {
	.tech-ae-slider__track { scroll-behavior: auto; }
}