.hero {
  position: relative;
  overflow: hidden;
  background: var(--surface);
}
.hero-slider {
  display: flex;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
}
.hero-slider::-webkit-scrollbar { display: none; }

.hero-banner {
  flex: 0 0 100%;
  scroll-snap-align: start;
  display: block;
  line-height: 0;
}
.hero-banner__img {
  width: 100%;
  height: auto;
  display: block;
  aspect-ratio: 2.5 / 1;
  object-fit: cover;
}

.hero-dots {
  display: flex;
  gap: 8px;
  justify-content: center;
  padding: var(--space-md) 0;
}
.hero-dots button {
  width: 8px; height: 8px; border-radius: 50%; background: var(--ink-10);
  box-sizing: content-box; padding: 18px 8px; background-clip: content-box;
}
.hero-dots button.is-active { background: var(--accent); background-clip: content-box; width: 22px; border-radius: var(--radius-pill); }

@media (max-width: 768px) {
  /* Banners are 2.5:1; on narrow screens let them stay full-width and shorter
     rather than cropping the Bangla headline out of frame. */
  .hero-banner__img { aspect-ratio: 16 / 9; object-position: left center; }
}

.flash-sale-strip {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-sm);
  background: var(--ink);
  color: #fff;
  padding: 10px 0;
  font-size: 13px;
  font-weight: 600;
}
.flash-sale-strip a { color: #FFB27A; text-decoration: underline; }