.cc_aprkxy05_6SCBtfFMyG .kombos-category-circles {
  width: 100%;
}

.cc_aprkxy05_6SCBtfFMyG .kombos-category-circles__container {
  padding-top: 1.5rem;
  padding-bottom: 0.5rem;
}

/* Wraps instead of scrolling so every category stays discoverable on mobile */
.cc_aprkxy05_6SCBtfFMyG .kombos-category-circles__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.75rem;
}

/* IkasComponentRenderer emits one wrapper div holding a container per child.
 * Making that wrapper transparent promotes the per-child containers to grid
 * items, so the columns work regardless of how many levels the runtime adds. */
.cc_aprkxy05_6SCBtfFMyG .kombos-category-circles__grid > * {
  display: contents;
}

.cc_aprkxy05_6SCBtfFMyG .kombos-category-circles__grid > * > * {
  min-width: 0;
}

@media (min-width: 640px) {
  .cc_aprkxy05_6SCBtfFMyG .kombos-category-circles__grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (min-width: 768px) {
  .cc_aprkxy05_6SCBtfFMyG .kombos-category-circles__container {
    padding-top: 2rem;
  }
}

/* Twelve shortcuts over 3 / 4 / 6 columns: every breakpoint divides evenly, so
 * no row ends with one stranded card. Ten across also made each card too narrow
 * for a two-word Turkish label on a laptop. */
@media (min-width: 1024px) {
  .cc_aprkxy05_6SCBtfFMyG .kombos-category-circles__grid {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
}