.product-items {
  display: grid;
  row-gap: 34px;
  column-gap: 24px;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));

  @container large (min-width: 0) {
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
  }

  @container medium (min-width: 0) {
    column-gap: 9px;
    row-gap: 20px;
  }

  @container small (min-width: 0) {
    grid-template-columns: repeat(2, 1fr);
  }
}