@media (max-width:1024px) {

    .hero-section {
        height: fit-content;
        max-height: fit-content;
        flex-direction: column-reverse;
    }
   
    .hero-image {
        margin-top: 20px;
    }

   

    #hero-categories-list-container {
        margin-top: 20px;
        width: 100%;
    }


    .categoriesherolest {
        border: none;
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(219px, 1fr));
        width: 100%;
        max-width: 1024px;
        height: fit-content;
        padding: 0;
        margin: 0;
        gap: 10px;
    }

    .categories-item {
        display: flex;
        flex-direction: column;
        width: 100%; 
        height: fit-content;
        border: 1px solid rgb(235, 235, 235);
        gap: 8px;
        padding: 20px 0;
        margin: 0px;
    }

    .categories-item .categorie {
        flex-direction: column-reverse;
    }

    .categories-item .categorie .categories-icon img {
        width: 50px;
    }

    .categories-opne-icon i {
        font-size: 16px;
    }

    .categories-opne-icon {
        background-color: #e8e8e8;
        padding: 4px 20px;
        display: flex;
        justify-content: center;
        text-align: center;
        width: fit-content;
        height: fit-content;
        border-radius: 8px;
    }


    .about-section {
        display: grid;
        grid-template-columns: repeat(2, minmax(219px, 1fr));
        width: 100%;
    }

    .about-cart {
        background-color: rgba(250, 235, 215, 0.412);
        width: 100%; 
    }



    .new-arrivals-section {
        flex-direction: column;
        height: fit-content;
    }
    .new-arrival {
        width: 100%;
        max-height: 500px;
    }

    .new-arrival img {
        height: 500px;
        max-height: 500px;
    }

    .new-arrival .new-arrival-content {
        background:linear-gradient(#0000002b,#0000004c,#000000c0);
    }

    .new-arrivals-items {
        width: 100%;
            padding: 20px 0px 0px 0px;
    }

    .trending-products-title-section {
        margin-top: 50px;
    }

    .trending-products-section {
        grid-template-columns: repeat(3,1fr);
    }

    .Special-offers-for-you-section {
        grid-template-columns: repeat(3,1fr);
    }
}

@media (max-width:880px) {

    .products-image{
        max-height: 200px;
        min-height: 200px;
    }

}