/* responsive.css */

/* Responsive adjustments */

@media (max-width: 768px) {
    .container {
       padding: 0 15px;
    }

    .section {
       padding: 3rem 0;
    }

    .section h2 {
       font-size: 1.75rem;
    }

    .section p {
       font-size: 1rem;
    }

    #contact-form {
       padding: 1.5rem;
    }

    header {
       flex-direction: column;
       text-align: center;
    }

    nav ul {
       flex-direction: column;
       align-items: center;
    }

    nav ul li {
       margin-left: 0;
       margin-top: 1rem;
    }
     header h1 {
       font-size: 1.8rem;
    }
    .info-boxes {
        flex-direction: column;
        align-items: center;
    }
    .info-box {
        width: 80%;
    }
}

@media (max-width: 480px) {
    header h1 {
       font-size: 1.8rem;
    }

    .section {
       padding: 2rem 0;
    }

    .section h2 {
       font-size: 1.5rem;
    }

    .section p {
       font-size: 0.95rem;
    }

    .button {
       font-size: 1rem;
       padding: 0.75rem 1.5rem;
    }

    #contact-form {
       padding: 1rem;
    }

    #contact-form button {
       width: 100%;
    }
     header h1 {
       font-size: 1.6rem;
    }
}