.grid {
  display: grid;
  gap: var(--Spacing-x2);
  grid-auto-flow: dense;
  grid-template-columns: repeat(4, 1fr);
}

@media screen and (min-width: 768px) {
  .grid {
    grid-template-columns: repeat(8, 1fr);
  }
}

@media screen and (min-width: 1367px) {
  .grid {
    grid-template-columns: repeat(12, 1fr);
  }
}