.events-container {
    display: flex;
    flex-wrap: wrap;     /* allow multiple rows */
    justify-content: center;
    gap: 2rem;
    row-gap: 3rem; 
}


.events-section {
    margin-top: 4rem;       /* space above the section */
}

.event-card {
    width: 23%; /* fits 4 per row with gaps */
}

/* Medium screens: 3 per row (1025px – 1200px, adjust if needed) */
@media (max-width: 1200px) and (min-width: 1025px) {
    .event-card {
        width: 28%; /* 3 cards per row */
    }
}

/* Tablets: 2 per row (768px – 1024px) */
@media (min-width: 768px) and (max-width: 1024px) {
    .event-card {
        width: 42%; /* 2 cards per row */
    }
}

/* Mobile: 1 per row (<768px) */
@media (max-width: 767px) {
    .event-card {
        width: 100%; /* 1 card per row */
    }
}