/* --- RESPONSIVE QUERIES --- */
@media (max-width: 768px) {
    header {
        flex-direction: row;
        height: var(--header-height);
    }
    .hero {
        min-height: 400px;
        height: 60vh;
    }
    .about-container {
        flex-direction: column;
    }
    .contact-grid {
        grid-template-columns: 1fr;
    }
    .map-embed iframe {
        height: 300px;
    }
    .hero-tagline {
        color: #333; /* Change color to black on smaller screens */
        background-color: rgba(255, 255, 255, 0); 
            }
    }