/* ===== KEMHA-2 Product Slider (spec §6.9) ===== */
.cc_PGeYAvBrga_product_slider .kombos-product-slider {
  width: 100%;
  max-width: 100%;
  overflow: hidden;
  background: var(--k2-bone);
  color: var(--k2-ink);
}

/* Head — eyebrow + serif title left, view-all + arrows right */
.cc_PGeYAvBrga_product_slider .kombos-product-slider__head-left {
  min-width: 0;
}

.cc_PGeYAvBrga_product_slider .kombos-product-slider__head-right {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  flex: none;
}

.cc_PGeYAvBrga_product_slider .kombos-product-slider__arrows {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

/* Track — scroll-snap, hidden scrollbar; mobile shows 1.6 cards (peek) */
.cc_PGeYAvBrga_product_slider .kombos-product-slider__track {
  display: flex;
  gap: 1rem;
  width: 100%;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  /* room for the swatch outline / touch pill without clipping */
  padding-bottom: 0.25rem;
}

.cc_PGeYAvBrga_product_slider .kombos-product-slider__track::-webkit-scrollbar {
  display: none;
}

.cc_PGeYAvBrga_product_slider .kombos-product-slider__card {
  flex: 0 0 calc((100% - 0.6rem) / 1.6);
  min-width: 0;
  scroll-snap-align: start;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.cc_PGeYAvBrga_product_slider .kombos-product-slider__card-content {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

/* Touch devices scroll by hand — no arrows */
@media (hover: none) {
  .cc_PGeYAvBrga_product_slider .kombos-product-slider__arrows {
    display: none;
  }
}

/* ===== Tablet (>= 768px): 2.6 cards peeking ===== */
@media (min-width: 768px) {
  .cc_PGeYAvBrga_product_slider .kombos-product-slider__track {
    gap: 1.5rem;
  }

  .cc_PGeYAvBrga_product_slider .kombos-product-slider__card {
    flex: 0 0 calc((100% - 1.5rem * 1.6) / 2.6);
  }
}

/* ===== Desktop (>= 1024px): exactly `desktopColumns` cards ===== */
@media (min-width: 1024px) {
  .cc_PGeYAvBrga_product_slider .kombos-product-slider__card {
    flex: 0 0 calc((100% - (var(--columns) - 1) * 1.5rem) / var(--columns));
  }
}
