/* ================================
   Layout for #full-calendar-events
   ================================ */

/* Desktop: 3 cards in a row */

.full-item-events {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 32px;
  justify-items: center;
  align-items: start;
  width: 100%;
  max-width: 1400px;
  margin: 0 auto;
  padding: 40px 5vw;
  background-color: rgb(242, 242, 242); /* optional */
}

.calendar-intro-text {
  font-family: 'Montserrat', sans-serif;
  font-size: 1em;
  line-height: 1.6;
  text-align: center;
  margin: 0 auto;              /* centers on desktop */
  max-width: 750px !important;                /* desktop width */
  color: #333;                 /* optional */
}

/* Tablet: 2 cards */
@media (max-width: 1024px) {
  .full-item-events {
    grid-template-columns: repeat(2, 1fr);
    gap: 28px;
    padding: 30px 4vw;
  }
    .calendar-intro-text {
    width: auto;
    margin-left: 15%;
    margin-right: 15%;
  }
}

/* Mobile: 1 card */
@media (max-width: 640px) {
  .full-item-events {
    grid-template-columns: 1fr;
    gap: 22px;
    padding: 20px 3vw;
  }
    .calendar-intro-text {
    margin-left: 4%;
    margin-right: 4%;
  }
}