.cc_q8ux376z_0Llua3T72m .cc-offer-banners {
  width: 100%;
}

.cc_q8ux376z_0Llua3T72m .cc-offer-banners__inner {
  width: 100%;
  max-width: 1600px;
  margin: 0 auto;
  padding: 80px 16px;
}

.cc_q8ux376z_0Llua3T72m .cc-offer-banners__grid {
  display: flex;
  gap: 32px;
  width: 100%;
}

@media (max-width: 1440px) {
  .cc_q8ux376z_0Llua3T72m .cc-offer-banners__inner {
    padding: 64px 16px;
  }
}

@media (max-width: 1024px) {
  .cc_q8ux376z_0Llua3T72m .cc-offer-banners__inner {
    padding: 48px 16px;
  }

  .cc_q8ux376z_0Llua3T72m .cc-offer-banners__grid {
    gap: 16px;
  }
}

.cc_q8ux376z_0Llua3T72m .cc-offer-banners__dots {
  display: none;
}

@media (max-width: 768px) {
  .cc_q8ux376z_0Llua3T72m .cc-offer-banners__inner {
    padding: 32px 16px;
  }

  /* Mobile becomes a horizontal, one-card-per-view snap carousel — each
     card's own __mobile layout (see OfferBannerCard/styles.css) takes
     over at this same breakpoint. */
  .cc_q8ux376z_0Llua3T72m .cc-offer-banners__grid {
    flex-wrap: nowrap;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    -ms-overflow-style: none;
  }

  .cc_q8ux376z_0Llua3T72m .cc-offer-banners__grid::-webkit-scrollbar {
    display: none;
  }

  /* IkasComponentRenderer wraps each child in a display:contents element,
     so the real flex item is the card itself, not its wrapper — target it
     directly rather than relying on a direct-child selector. */
  .cc_q8ux376z_0Llua3T72m .cc-offer-banners__grid .cc-offer-banner-card {
    flex: 0 0 100%;
    width: 100%;
    scroll-snap-align: start;
  }

  .cc_q8ux376z_0Llua3T72m .cc-offer-banners__dots {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin-top: 16px;
  }

  .cc_q8ux376z_0Llua3T72m .cc-offer-banners__dot {
    width: 8px;
    height: 8px;
    padding: 0;
    border: none;
    border-radius: 50px;
    background: var(--wUp6NoOHuO);
    opacity: 0.3;
    cursor: pointer;
    transition: width 0.2s ease, opacity 0.2s ease;
  }

  .cc_q8ux376z_0Llua3T72m .cc-offer-banners__dot--active {
    width: 48px;
    opacity: 1;
  }
}