/* ==========================
   CLUBS SECTION
========================== */

.clubs {
  max-width: 87.5rem; /* 1400px */
  margin: 0 auto;
  padding: 3.75rem 1.25rem;
}

.clubs__title {
  font-size: 2rem;
  text-align: center;
  margin-bottom: 1.875rem;
}

.clubs__map {
  background: #f4f4f4;
  border-radius: 0.625rem;
  padding: 1.875rem;
  margin-bottom: 2.5rem;
}

.clubs__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(17.5rem, 1fr));
  gap: 1.875rem;
}

/* ==========================
   NEWS SECTION
========================== */

.news {
  background: #f9f9f9;
  padding: 3.75rem 1.25rem;
}

.news__title {
  text-align: center;
  font-size: 2rem;
  margin-bottom: 2.5rem;
}

.news__grid {
  max-width: 75rem; /* 1200px */
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(18.75rem, 1fr)); /* 300px */
  gap: 1.5625rem;
}

/* ==========================
   EVENTS SECTION
========================== */

.events,
.past-events {
  padding: 3.75rem 1.25rem;
}

.events__title,
.past-events__title {
  text-align: center;
  font-size: 2rem;
  margin-bottom: 2.5rem;
}

.events__grid,
.past-events__grid {
  max-width: 75rem;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(18.75rem, 1fr));
  gap: 1.5625rem;
}

/* ==========================
   RESPONSIVE
========================== */

@media (min-width: 62rem) {
  /* 992px */
  .clubs,
  .news,
  .events,
  .past-events {
    padding: 5rem 2.5rem;
  }
}

@media (min-width: 75rem) {
  /* 1200px */
  .clubs__grid,
  .news__grid,
  .events__grid,
  .past-events__grid {
    gap: 2.5rem;
  }
}
