.featured-products {
  --items-per-view: 1.5;
  --gap: var(--wrapper-gutter);
}

@media (min-width: 40rem) {
  .featured-products {
    --items-per-view: 2.5;
  }
}

@media (min-width: 60rem) {
  .featured-products {
    --items-per-view: 4;
  }
}

@media (min-width: 80rem) {
  .featured-products {
    --items-per-view: 5;
  }
}