.section--streamers {
  padding-top: var(--space-md);
}

.streamer-grid {
  display: grid;
  gap: var(--space-md);
  grid-template-columns: repeat(2, 1fr);
}

@media (min-width: 640px) {
  .streamer-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (min-width: 1024px) {
  .streamer-grid {
    grid-template-columns: repeat(4, 1fr);
  }
}

.skeleton-grid--streamers {
  grid-column: 1 / -1;
  display: grid;
  gap: var(--space-md);
  grid-template-columns: repeat(2, 1fr);
}

@media (min-width: 640px) {
  .skeleton-grid--streamers {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (min-width: 1024px) {
  .skeleton-grid--streamers {
    grid-template-columns: repeat(4, 1fr);
  }
}