.container {
  margin-bottom: 50px;
}

.text-center {
  text-align: center !important;
}

.h2 {
  font-size: 1.75rem;
}

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

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

.flash-success {
  background-color: rgba(227, 255, 192, 0.9);
  margin-bottom: 24px;
}

.event-card {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

/*
 * Image de couverture d'un événement : boîte de ratio fixe pour éviter tout
 * décalage de mise en page (CLS) pendant le chargement, sans rogner l'image
 * (object-fit: contain). Le ratio et la largeur explicites évitent aussi
 * l'audit Lighthouse « images sans dimensions ».
 */
.event-cover {
  display: block;
  width: 100%;
  max-width: 600px;
  aspect-ratio: 3 / 2;
  object-fit: contain;
  margin-inline: auto;
}