/* ==========================================
   Tablet
========================================== */

@media (max-width:992px){

    .contact-grid{

        grid-template-columns:1fr;

        gap:60px;

    }

}

/* ==========================================
   Mobile
========================================== */

@media (max-width:768px){

    #header .container{

        height:70px;

    }

    nav ul{

        gap:20px;

    }

    .hero-image img{

        max-width:100%;

    }

    .hero-text h1{

        font-size:2.5rem;

    }

    .contact-item{

        flex-direction:column;

        align-items:flex-start;

        gap:8px;

    }

    .footer-top{

        flex-direction:column;

        text-align:center;

    }

    .footer-bottom{

        flex-direction:column;

        text-align:center;

    }

}

@media (max-width:900px){

    .footer-top{

        grid-template-columns:1fr;

        gap:50px;

    }

    .footer-bottom{

        flex-direction:column;

        gap:15px;

        text-align:center;

    }

}