/* --- ADD THIS MOBILE RESPONSIVE CODE BEFORE </style> --- */
@media (max-width: 768px) {
    /* Stack header items vertically */
    header {
        flex-direction: column;
        gap: 15px;
        padding: 15px 20px;
        text-align: center;
    }

    /* Wrap navigation links cleanly */
    nav {
        flex-wrap: wrap;
        justify-content: center;
        gap: 10px 16px;
    }

    nav a {
        font-size: 13px;
    }

    /* Full-width button on mobile */
    .btn-quote {
        width: 100%;
        text-align: center;
    }

    /* Adjust page container and title sizes */
    .contact-container {
        padding: 30px 15px;
    }

    .contact-title {
        font-size: 28px;
    }

    .contact-subtitle {
        font-size: 13px;
    }

    /* Compact contact rows */
    .contact-row {
        padding: 12px 15px;
    }

    .contact-details h4 {
        font-size: 0.95rem;
    }

    .contact-details p {
        font-size: 0.8rem;
    }

    /* Adjust map height */
    .info-box {
        padding: 20px 15px;
    }

    .map-container {
        height: 200px;
    }
}