@media (max-width:1200px){

}

@media (max-width:900px){

    .hero{
        padding-top: 15rem;
        grid-template-columns:1fr;
        text-align:center;
    }

    .navbar{
        flex-direction:column;
        gap:1rem;
    }

    .cards{
        grid-template-columns:1fr;
    }
    .hero-image{
        top: 25rem;
        max-width: 10%;
    }

    .asset-images{
        flex-direction: column;
        align-items: center;
    }

    .asset-image{
        max-width: 280px;
    }

    .nav-links{
        flex-wrap:wrap;
        justify-content:center;
        gap:1rem;
    }

    .navbar{
        padding:1rem;
    }

}

@media (max-width:600px){

    .hero h1{
        font-size:2.5rem;
    }
    

}