.cc_Ipc5W68kmf_diB3HlxCsr .kombos-ugc {
  width: 100%;
}

.cc_Ipc5W68kmf_diB3HlxCsr .kombos-ugc__container {
  /* Less space above than below — pulls the title closer to the section
     above (Bestsellers) instead of sitting with equal breathing room on
     both sides. */
  padding-block: 1rem 2rem;
}

.cc_Ipc5W68kmf_diB3HlxCsr .kombos-ugc__title {
  margin: 0;
  color: var(--kombos-gray-900);
  text-align: left;
}

/* A real block with its own height, not a margin — guarantees the gap
   renders regardless of anything the row/title might do to a margin. */
.cc_Ipc5W68kmf_diB3HlxCsr .kombos-ugc__spacer {
  width: 100%;
  height: 1.5rem;
}

.cc_Ipc5W68kmf_diB3HlxCsr .kombos-ugc__viewport {
  position: relative;
}

/* Mobile: cards stay at a moderate, "own" size instead of near-filling the
   screen — about 1.5-2 cards visible at once, swipeable, with the next card
   peeking in to make it obvious there's more. */
.cc_Ipc5W68kmf_diB3HlxCsr .kombos-ugc__row {
  display: flex;
  gap: 0.625rem;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  margin-inline: -1rem;
  padding-inline: 1rem;
  scroll-padding-inline: 1rem;
}

.cc_Ipc5W68kmf_diB3HlxCsr .kombos-ugc__row::-webkit-scrollbar {
  display: none;
}

/* Targets the actual card by class (two-class selector so it reliably beats
   UgcVideoItem's own single-class ".kombos-ugc-item{width:100%}" regardless
   of build order), not a positional child combinator — IkasComponentRenderer
   wraps each list item in an invisible display:contents element (no box of
   its own), so ".kombos-ugc__row > *" only ever matched that non-rendering
   wrapper and had zero real effect; width was silently ignored and cards
   fell back to shrink-to-fit sizing. */
.cc_Ipc5W68kmf_diB3HlxCsr .kombos-ugc__row .kombos-ugc-item {
  flex: 0 0 auto;
  min-width: 0;
  /* One video fills the screen at a time, shorts/reels-style — just a
     sliver of the next one peeks in from the right edge. */
  width: 92%;
  scroll-snap-align: center;
}

@media (min-width: 768px) and (max-width: 1023px) {
  .cc_Ipc5W68kmf_diB3HlxCsr .kombos-ugc__row {
    margin-inline: -1.5rem;
    padding-inline: 1.5rem;
  }

  .cc_Ipc5W68kmf_diB3HlxCsr .kombos-ugc__row .kombos-ugc-item {
    width: 45%;
  }
}

/* Desktop: 3 videos visible */
@media (min-width: 1024px) {
  .cc_Ipc5W68kmf_diB3HlxCsr .kombos-ugc__container {
    padding-block: 1.5rem 3rem;
  }

  .cc_Ipc5W68kmf_diB3HlxCsr .kombos-ugc__title {
    text-align: center;
  }

  .cc_Ipc5W68kmf_diB3HlxCsr .kombos-ugc__spacer {
    height: 2.25rem;
  }

  .cc_Ipc5W68kmf_diB3HlxCsr .kombos-ugc__row {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
    overflow-x: visible;
    margin-inline: 0;
    padding-inline: 0;
  }

  .cc_Ipc5W68kmf_diB3HlxCsr .kombos-ugc__row .kombos-ugc-item {
    width: auto;
  }
}

/* Consultation reviews above the videos (category placement only): a
   white band holding the one-at-a-time review carousel. */
.cc_Ipc5W68kmf_diB3HlxCsr .kombos-ugc-reviews {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  margin-bottom: 2.5rem;
  padding: 2rem 0 1.5rem;
  background: var(--kombos-white);
}

/* Review carousel: one full-width slide at a time on white. */
.cc_Ipc5W68kmf_diB3HlxCsr .kombos-reviews {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  background: var(--kombos-white);
}

.cc_Ipc5W68kmf_diB3HlxCsr .kombos-reviews__track {
  display: flex;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
}

.cc_Ipc5W68kmf_diB3HlxCsr .kombos-reviews__track::-webkit-scrollbar {
  display: none;
}

.cc_Ipc5W68kmf_diB3HlxCsr .kombos-reviews__slide {
  flex: 0 0 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
  margin: 0;
  padding: 0.5rem 1rem;
  text-align: center;
  scroll-snap-align: start;
}

.cc_Ipc5W68kmf_diB3HlxCsr .kombos-reviews__stars {
  display: flex;
  gap: 0.25rem;
  font-size: 1.125rem;
  color: var(--kombos-brand-yellow);
}

.cc_Ipc5W68kmf_diB3HlxCsr .kombos-reviews__text {
  max-width: 42rem;
  margin: 0;
  color: var(--kombos-gray-700);
}

.cc_Ipc5W68kmf_diB3HlxCsr .kombos-reviews__name {
  color: var(--kombos-brand-bordo);
}

.cc_Ipc5W68kmf_diB3HlxCsr .kombos-reviews__pager {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
}

.cc_Ipc5W68kmf_diB3HlxCsr .kombos-reviews__arrow {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 1.5rem;
  height: 1.5rem;
  border: none;
  background: none;
  color: var(--kombos-gray-900);
  font-size: 0.875rem;
  cursor: pointer;
  transition: opacity 0.2s ease;
}

.cc_Ipc5W68kmf_diB3HlxCsr .kombos-reviews__arrow:hover:not(:disabled) {
  opacity: 0.6;
}

.cc_Ipc5W68kmf_diB3HlxCsr .kombos-reviews__arrow:disabled {
  color: var(--kombos-gray-300);
  cursor: default;
}

.cc_Ipc5W68kmf_diB3HlxCsr .kombos-reviews__dots {
  display: flex;
  align-items: center;
}

/* 8px dot drawn inside a 24px tap target. */
.cc_Ipc5W68kmf_diB3HlxCsr .kombos-reviews__dot {
  box-sizing: content-box;
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 50%;
  border: none;
  padding: 0.5rem;
  background-color: var(--kombos-gray-300);
  background-clip: content-box;
  cursor: pointer;
  transition: background-color 0.2s ease;
}

.cc_Ipc5W68kmf_diB3HlxCsr .kombos-reviews__dot--active {
  background-color: var(--kombos-brand-bordo);
}
