/* Sección "Destacados de hoy" del inicio — franja horizontal que reutiliza
   la misma .product-card del resto del sitio (css/components/product-card.css),
   solo cambia el contenedor de grilla por scroll horizontal. No toca ninguna
   regla de product-card.css ni de layout.css. */

.featured-shelf {
  display: flex;
  gap: 1rem;
  overflow-x: auto;
  padding-block: 0.25rem 1.25rem;
  scroll-snap-type: x mandatory;
  /* deja que el borde recortado (clip-path) de la tarjeta no se corte */
  padding-inline-end: 0.25rem;
}

.featured-shelf .product-card {
  flex: 0 0 240px;
  scroll-snap-align: start;
}

.featured-shelf::-webkit-scrollbar {
  height: 8px;
}
.featured-shelf::-webkit-scrollbar-thumb {
  background: var(--color-line);
  border-radius: 999px;
}

@media (min-width: 1024px) {
  .featured-shelf .product-card {
    flex-basis: 264px;
  }
}