@media (max-width: 768px) {
    .two-column .text, .two-column .image {
        flex: 1;
    }
}

.events-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 20px;
}

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

@media (max-width: 768px) {
    .two-column .text, .two-column .image {
        flex: 1 1 100%; /* Stack on small screens */
    }
}