@media(max-width:992px){

    .hero-container{
        grid-template-columns:1fr;
        text-align:center;
    }

    .hero-image{
        margin-top:50px;
    }

    .services-grid{
        grid-template-columns:repeat(2,1fr);
    }

}

@media(max-width:768px){

    .services-grid{
        grid-template-columns:1fr;
    }

    .hero h1{
        font-size:42px;
    }

}