.cc_HPUOT9V5Zm_category_images .kombos-category-images {
  width: 100%;
}

/* Mobile-first: base = mobile (375px)
   Revival: section py-8 md:py-10 lg:py-[4rem], başlık altı mb-4 md:mb-6 lg:mb-9 */
.cc_HPUOT9V5Zm_category_images .kombos-category-images__container {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding-top: 2rem;
  padding-bottom: 2rem;
}

/* ===== Header (centered section title) ===== */
.cc_HPUOT9V5Zm_category_images .kombos-category-images__header {
  display: flex;
  align-items: center;
}

.cc_HPUOT9V5Zm_category_images .kombos-category-images__header--center {
  justify-content: center;
  text-align: center;
}

.cc_HPUOT9V5Zm_category_images .kombos-category-images__title {
  margin: 0;
  color: var(--kombos-gray-900);
}

/* ===== Grid layout ===== */
.cc_HPUOT9V5Zm_category_images .kombos-category-images__grid {
  display: grid;
  grid-template-columns: repeat(var(--cols), 1fr);
  grid-auto-rows: 1fr;
  gap: var(--gap);
}

/* Kolon sayısı ve boşluk tek yerden: breakpoint'ler sadece bu ikisini değiştirir */
.cc_HPUOT9V5Zm_category_images .kombos-category-images__grid, .cc_HPUOT9V5Zm_category_images .kombos-category-images__track {
  --gap: 1rem;
  --cols: var(--mobile-cols, 1);
}

/* Peek payı yalnızca mobilde; class üzerinden verilir ki media query ezebilsin */
.cc_HPUOT9V5Zm_category_images .kombos-category-images__track--peek-1 {
  --mobile-peek: 0.78;
}

/* Revival mobilde kartı %46 genişlikte tutuyor: 2 tam kart + üçüncüden bir dilim */
.cc_HPUOT9V5Zm_category_images .kombos-category-images__track--peek-2 {
  --mobile-peek: 0.91;
}

/* ===== Carousel layout — horizontal scroll track + side arrows ===== */
.cc_HPUOT9V5Zm_category_images .kombos-category-images__carousel {
  position: relative;
}

.cc_HPUOT9V5Zm_category_images .kombos-category-images__track {
  display: grid;
  grid-auto-flow: column;
  /* Kart genişliği = seçilen kolon sayısı. Mobilde tek kolonda peek payı uygulanır. */
  grid-auto-columns: calc(
    ((100% - (var(--cols) - 1) * var(--gap)) / var(--cols)) *
      var(--mobile-peek, 1)
  );
  gap: var(--gap);
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  -ms-overflow-style: none;
  padding-bottom: 0.25rem;
}

.cc_HPUOT9V5Zm_category_images .kombos-category-images__track::-webkit-scrollbar {
  display: none;
}

/* Side arrows — dark navy circles centered on the card row */
.cc_HPUOT9V5Zm_category_images .kombos-category-images__arrow {
  position: absolute;
  top: 42%;
  transform: translateY(-50%);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 3rem;
  height: 3rem;
  border-radius: 9999px;
  border: none;
  background: var(--ci-arrow-bg, var(--kombos-navy));
  color: var(--ci-arrow-icon, var(--kombos-white));
  font-size: 1.125rem;
  cursor: pointer;
  z-index: 2;
  transition: opacity 0.2s ease;
}

.cc_HPUOT9V5Zm_category_images .kombos-category-images__arrow:hover {
  opacity: 0.88;
}

.cc_HPUOT9V5Zm_category_images .kombos-category-images__arrow--prev {
  left: -0.5rem;
}

.cc_HPUOT9V5Zm_category_images .kombos-category-images__arrow--next {
  right: -0.5rem;
}

.cc_HPUOT9V5Zm_category_images .kombos-category-images__arrow--hidden {
  opacity: 0;
  pointer-events: none;
}

@media (min-width: 640px) {
  .cc_HPUOT9V5Zm_category_images .kombos-category-images__grid, .cc_HPUOT9V5Zm_category_images .kombos-category-images__track, .cc_HPUOT9V5Zm_category_images .kombos-category-images__track--peek-1, .cc_HPUOT9V5Zm_category_images .kombos-category-images__track--peek-2 {
    --cols: var(--sm-cols, 2);
    --mobile-peek: 1;
  }
}

@media (min-width: 768px) {
  .cc_HPUOT9V5Zm_category_images .kombos-category-images__container {
    gap: 1.5rem;
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
  }

  .cc_HPUOT9V5Zm_category_images .kombos-category-images__grid, .cc_HPUOT9V5Zm_category_images .kombos-category-images__track {
    --gap: 1.25rem;
    --cols: var(--md-cols, 3);
  }
}

/* Desktop */
@media (min-width: 1024px) {
  .cc_HPUOT9V5Zm_category_images .kombos-category-images__container {
    gap: 2.25rem;
    padding-top: 4rem;
    padding-bottom: 4rem;
  }

  .cc_HPUOT9V5Zm_category_images .kombos-category-images__grid, .cc_HPUOT9V5Zm_category_images .kombos-category-images__track {
    --gap: 1.5rem;
    --cols: var(--desktop-cols, 4);
  }

  .cc_HPUOT9V5Zm_category_images .kombos-category-images__arrow--prev {
    left: -1.25rem;
  }
  .cc_HPUOT9V5Zm_category_images .kombos-category-images__arrow--next {
    right: -1.25rem;
  }
}
