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

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

@media (min-width: 60rem) {
  .featured-collections {
    --items-per-view: 3;
    --gap: 1.5rem;
  }
}

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