@media screen and (max-width:680px) {
    
    /* Header part */
    nav ul{
        li{
            display: none;
        }
    }

    header , section{
        margin: 0px 10px;
    }

    .hero{
        flex-wrap: wrap-reverse;
        gap: 20px;
        margin-top: 0px;
    }
    .hero .left{
        width: 100%;
        justify-content: center;
        align-items: center;
    }
    .hero h1{
        font-size: 2rem;
        text-align: center;
    }
    .hero p{
        text-align: center;
    }

    .hero .right{
        width: 100%;
    }

    .tag > div{
        flex-wrap: wrap;
    }

    /* Popular Collection */
    .card-container{
        grid-template-columns: 1fr;
    }
    .product .title{
        margin-top: 0;
    }

    /* Featured */
    .featured{
        grid-template-columns: 1fr;
    }

    .featured h2 , .featured p{
        text-align: center;
    }

    .featured .info{
        justify-content: center;
        align-items: center;
    }

    /* Footer */
    footer{
        margin: 0;
    }

    footer p{
        text-align: center;
    }

}