/*==================================================
                PRODUCTS PAGE
==================================================*/

.products-page{

    min-height:100vh;

    padding:6.5rem 0 5rem;

    background:linear-gradient(
        180deg,
        #FDFEFF 0%,
        #F7FBFF 45%,
        #F3F9FF 100%
    );

}


.footer-section{

    position:relative;

    overflow:hidden;

    padding:7rem 0 2rem;
    background:linear-gradient(
    180deg,
    #F7FBFF 45%,
    #FDFEFF 0%,
    #F3F9FF 100%


    )!important;

}

.section-badge{

    display:inline-flex;

    align-items:center;

    gap:.65rem;

    padding:.75rem 1.4rem;

    margin-bottom:1rem;

    border-radius:999px;

    background:#ffffff;

    color:var(--primary);

    font-weight:600;

    font-size:.95rem;

    box-shadow:0 10px 30px rgba(0,0,0,.08);

}

.section-badge i{

    font-size:1rem;

}


.products-categories .section-heading{

    max-width:820px;

    margin:0 auto 2rem;

    text-align:center;

}

.products-categories .section-heading h2{

    margin-top:.3rem;


}

.products-categories h2 span{

    background:linear-gradient(
        135deg,
        #4BA8FF 0%,
        #6FC7FF 50%,
        #8ED8FF 100%
    );

    -webkit-background-clip:text;

    -webkit-text-fill-color:transparent;

    background-clip:text;

}


/*==================================================
                SECTION SPACING
==================================================*/

.products-categories{

    margin-bottom:2rem;

}

.products-filter{

    margin-bottom:2rem;

}

.products-listing{

    margin-bottom:2rem;

}


/*==================================================
                CATEGORY SLIDER
==================================================*/

.category-slider{

    position:relative;

    display:flex;

    align-items:center;

    gap:1rem;

    margin-top:2.8rem;

}

/*==================================================
                CATEGORY SECTION
==================================================*/
/*==================================================
                CATEGORY GRID
==================================================*/

.category-grid{

    flex:1;

    display:flex;

    gap:1.2rem;

    overflow-x:auto;

    overflow-y:hidden;

    scroll-behavior:smooth;

    scrollbar-width:none;

    -ms-overflow-style:none;

    padding:.6rem;

}

.category-grid::-webkit-scrollbar{

    display:none;

}
/*==================================================
                CATEGORY NAVIGATION
==================================================*/

.category-nav{

    flex-shrink:0;

    width:52px;

    height:52px;

    border:none;

    border-radius:50%;

    background:#FFFFFF;

    color:#3A9BFF;

    display:flex;

    align-items:center;

    justify-content:center;

    cursor:pointer;

    box-shadow:

        0 10px 28px rgba(58,155,255,.16);

    transition:.3s;

}

.category-nav i{

    font-size:1.25rem;

}

.category-nav:hover{

    background:#3A9BFF;

    color:#fff;

    transform:translateY(-3px);

}
/*==================================================
                CATEGORY CARD
==================================================*/

/*==================================================
                CATEGORY CARD
==================================================*/

.category-card{

    flex:0 0 150px;

    min-height:150px;

    display:flex;

    flex-direction:column;

    justify-content:center;

    align-items:center;

    gap:1rem;

    text-decoration:none;

    background:#FFFFFF;

    border-radius:24px;

    border:1px solid rgba(74,169,255,.12);

    box-shadow:

        0 12px 35px rgba(74,169,255,.08);

    transition:

        transform .35s,

        box-shadow .35s,

        border-color .35s;

}

.category-card:hover{

    transform:translateY(-8px);

    border-color:#4BA8FF;

    box-shadow:

        0 20px 45px rgba(74,169,255,.18);

}
.category-card.active{

    background:

        linear-gradient(

            135deg,

            #4AA8FF,

            #73C7FF

        );

    color:#fff;

    border-color:#4AA8FF;

    box-shadow:

        0 18px 45px rgba(74,169,255,.28);

}


/*==================================================
                CATEGORY IMAGE
==================================================*/

.category-card img{

    width:78px;

    height:78px;

    object-fit:contain;

}

.category-icon{

    width:78px;

    height:78px;

    display:flex;

    justify-content:center;

    align-items:center;

    border-radius:50%;

    background:#F3F9FF;

    color:#4AA8FF;

    font-size:1.9rem;

    box-shadow:

        0 8px 20px rgba(74,169,255,.12);

}

.category-card.active .category-icon{

    background:#FFFFFF;

    color:#4AA8FF;

}


/*==================================================
                CATEGORY TITLE
==================================================*/
.category-card h3{

    margin:0;

    font-family:var(--heading-font);

    font-size:1.05rem;

    font-weight:600;

    line-height:1.45;

    text-align:center;

    color:inherit;

}
@media(max-width:768px){

    .category-nav{

        display:none;

    }

}
/*==================================================

                FILTER SECTION

==================================================*/



.products-filter{



    padding:2rem;



    background:#fff;



    border:1px solid rgba(74,169,255,.12);



    border-radius:30px;



    box-shadow:

        0 15px 40px rgba(74,169,255,.08);



}

/*==================================================

                FILTER TOP

==================================================*/
.products-filter-top{

    display:flex;

    justify-content:space-between;

    align-items:center;

    margin-bottom:1.8rem;

    padding-bottom:1.2rem;

    border-bottom:1px solid rgba(74,169,255,.10);

}

.products-count{

    margin:0;

    font-family:var(--secondary-font);

    font-size:1rem;

    color:var(--text-body);

}

.products-count strong{

    color:var(--primary-color);

    font-weight:700;

}

/*==================================================

                FILTER GRID

==================================================*/

.filter-grid{
    display:grid;

    grid-template-columns:

        2fr

        repeat(4,1fr)

        auto;

    gap:1rem;
    align-items:end;
}

/*==================================================

                SEARCH

==================================================*/

.filter-search{

    position:relative;

}
.filter-search i{

    position:absolute;

    top:50%;

    left:20px;

    transform:translateY(-50%);

    color:var(--primary-color);

    font-size:1rem;

}

.filter-search input{



    width:100%;



    height:56px;



    padding:0 20px 0 52px;



    border:1px solid rgba(74,169,255,.15);



    border-radius:18px;



    background:#fff;



    font-family:var(--body-font);



    font-size:.96rem;



    transition:all .3s ease;



}



.filter-search input::placeholder{



    color:#94A3B8;



}



.filter-search input:focus{



    outline:none;



    border-color:var(--primary-color);



    box-shadow:

        0 0 0 4px rgba(74,169,255,.12);



}







/*==================================================

                FILTER SELECT

==================================================*/



.filter-select{



    display:flex;



    flex-direction:column;



    gap:.55rem;



}



.filter-select label{



    font-family:var(--secondary-font);



    font-size:.85rem;



    font-weight:700;



    color:var(--text-heading);



}



.filter-select select{



    width:100%;



    height:56px;



    padding:0 18px;



    border:1px solid rgba(74,169,255,.15);



    border-radius:18px;



    background:#fff;



    font-family:var(--body-font);



    font-size:.95rem;



    color:var(--text-heading);



    cursor:pointer;



    transition:all .3s ease;



}



.filter-select select:focus{



    outline:none;



    border-color:var(--primary-color);



    box-shadow:

        0 0 0 4px rgba(74,169,255,.12);



}

/*==================================================

                CLEAR FILTER BUTTON

==================================================*/



.clear-filter-btn{
    display:flex;

    align-items:center;

    justify-content:center;

    gap:.6rem;

    height:56px;

    padding:0 1.5rem;

    border:none;

    border-radius:18px;

    background:#F1F8FF;

    color:var(--primary-color);

    font-family:var(--secondary-font);

    font-size:.95rem;

    font-weight:700;

    cursor:pointer;

    transition:all .3s ease;
}

.clear-filter-btn:hover{

     background:

            linear-gradient(

                135deg,

                #4AA8FF,

                #73C7FF

            );
    color:#fff;

    transform:translateY(-2px);

}

.clear-filter-btn i{

    font-size:1rem;

}

/*==================================================

                PRODUCTS GRID

==================================================*/

.products-listing .products-grid{

    margin-top:0;
}

/*==================================================
            PRODUCT CARD
==================================================*/

.products-listing .product-card{

    position:relative;

    overflow:hidden;

    border-radius:28px;

    transition:
        transform .35s ease,
        box-shadow .35s ease;

}

.products-listing .product-card:hover{

    transform:translateY(-8px);

    box-shadow:
        0 22px 45px rgba(74,169,255,.16);

}



/*==================================================
            PRODUCT IMAGE
==================================================*/

.products-listing .product-image{

    aspect-ratio:1/1.15;

}

.products-listing .product-image img{

    width:100%;

    height:100%;

    object-fit:cover;

}



/*==================================================
            PRODUCT CONTENT
==================================================*/

.products-listing .product-content{

    padding:1rem;

}

.products-listing .product-content h3{

    margin:0 0 .3rem;

    font-size:1.3rem;

    line-height:1.1;

    font-family:var(--heading-font);

    color:var(--primary-dark);

    display:-webkit-box;

    -webkit-box-orient:vertical;

    -webkit-line-clamp:2;

    overflow:hidden;

}



/*==================================================
            INFO ROW
==================================================*/

.product-info-row{

    display:flex;

    justify-content:space-between;

    align-items:center;

    margin-bottom:.65rem;

}



/*==================================================
            RATING
==================================================*/

.product-rating{

    display:flex;

    align-items:center;

    gap:.3rem;

    font-size:.9rem;

    font-weight:600;

    color:var(--text-body);

}

.product-rating i{

    color:#FDBA12;

    font-size:.9rem;

}



/*==================================================
            PRICE
==================================================*/

.products-listing .price-box{

    display:flex;

    align-items:baseline;

    gap:.45rem;

    margin:0;

}

.products-listing .price{

    font-size:1.4rem;

    font-weight:800;

    color:#4BA8FF;

}

.products-listing .old-price{

    font-size:.82rem;

    text-decoration:line-through;

    color:#9CA3AF;

}



/*==================================================
            SAVE BADGE
==================================================*/

.products-listing .save-price{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    padding:.45rem .9rem;

    margin-bottom:.1rem;

    background:#FFF1F1;

    color:#FF4D4D;

    border-radius:999px;

    font-size:.80rem;

    font-weight:600;

}



/*==================================================
            BUTTON
==================================================*/

.products-listing .btn{

    width:100%;

    min-height:48px;

    display:flex;

    justify-content:center;

    align-items:center;

    font-size:.95rem;

    font-weight:600;

}

/*==================================================
            DISCOUNT BADGE
==================================================*/

.discount-badge{

    top:18px;

    left:18px;

    padding:.65rem 1rem;

    border-radius:16px;

    font-size:.82rem;

    font-weight:600;

    letter-spacing:.3px;

}



/*==================================================
            RESPONSIVE
==================================================*/

@media(max-width:768px){

    .products-listing .product-content{

        padding:.9rem;

    }

    .products-listing .product-content h3{

        font-size:1rem;

    }

    .products-listing .price{

        font-size:0.75rem;

    }

    .products-listing .old-price{

        font-size:.52rem;

    }

    .products-listing .btn{

        min-height:40px;

        font-size:.92rem;

    }

}
/*--------------------------------------
            NEW
--------------------------------------*/

.discount-badge.new{

    background:#22C55E;

}

/*--------------------------------------
            SALE
--------------------------------------*/

.discount-badge.sale{

    background:#EF4444;

}

/*--------------------------------------
            HOT
--------------------------------------*/

.discount-badge.hot{

    background:#F97316;

}

/*--------------------------------------
            BEST SELLER
--------------------------------------*/

.discount-badge.best{

    background:#8B5CF6;

}

/*--------------------------------------
            SOLD OUT
--------------------------------------*/

.discount-badge.sold{

    background:#64748B;

}

/*==================================================
            OUT OF STOCK
==================================================*/
/*==================================================
            OUT OF STOCK
==================================================*/

.product-card[data-stock="out-of-stock"]{

    opacity:.95;

}

.product-card[data-stock="out-of-stock"] img{

    filter:

        grayscale(.45)

        brightness(.85);

}



/*---------------------------------------
            Overlay
---------------------------------------*/

.stock-overlay{

    position:absolute;

    inset:0;

    display:flex;

    justify-content:center;

    align-items:center;

    background:rgba(255,255,255,.15);

    backdrop-filter:blur(2px);

}

.stock-overlay span{

    padding:.9rem 2.5rem;

    background:rgba(36,44,64,.92);

    color:#fff;

    border-radius:50px;

    font-family:var(--heading-font);

    font-size:1rem;

    font-weight:600;

    letter-spacing:.08em;

    text-transform:uppercase;

    box-shadow:

        0 10px 30px rgba(0,0,0,.18);

}
.product-card[data-stock="in-stock"] .stock-overlay{

    display:none;

}
/*==================================================
            NO PRODUCTS
==================================================*/

.no-products{

    display:flex;

    flex-direction:column;

    align-items:center;

    justify-content:center;

    text-align:center;

    padding:5rem 2rem;

    margin-top:2rem;

    background:#fff;

    border:1px solid rgba(74,169,255,.12);

    border-radius:32px;

    box-shadow:

        0 15px 40px rgba(74,169,255,.08);

}

.no-products-icon{

    display:flex;

    align-items:center;

    justify-content:center;

    width:90px;

    height:90px;

    margin-bottom:1.5rem;

    border-radius:50%;

    background:

        linear-gradient(

            135deg,

            var(--primary-color),

            #81CBFF

        );

    color:#fff;

    font-size:2.4rem;

}

.no-products h2{

    margin-bottom:1rem;

    font-family:var(--heading-font);

    font-size:2rem;

    color:var(--text-heading);

}

.no-products p{

    max-width:560px;

    margin-bottom:2rem;

    line-height:1.9;

    color:var(--text-body);

}



/*==================================================
            REVEAL ANIMATION
==================================================*/

.products-categories,
.products-filter,
.products-listing,
.no-products{

    opacity:0;

    transform:translateY(35px);

    transition:

        opacity .8s ease,

        transform .8s ease;

}

.products-categories.revealed,
.products-filter.revealed,
.products-listing.revealed,
.no-products.revealed{

    opacity:1;

    transform:translateY(0);

}
/*==================================================
                TABLET
==================================================*/

@media (max-width:992px){

    .products-page{

        padding:7.5rem 0 4rem;

    }

    /*-------------------------------
            Categories
    -------------------------------*/

    .category-grid{

        grid-template-columns:repeat(4,1fr);

    }

    /*-------------------------------
            Filters
    -------------------------------*/

    .filter-grid{

        grid-template-columns:repeat(2,1fr);

    }

    .filter-search{

        grid-column:1/-1;

    }

    .clear-filter-btn{

        grid-column:1/-1;

        width:100%;

    }

    /*-------------------------------
            Products
    -------------------------------*/

    .products-listing .products-grid{

        grid-template-columns:repeat(3,1fr);

    }

}



/*==================================================
                MOBILE
==================================================*/

@media (max-width:768px){

    .products-page{

        padding:7rem 0 3rem;

    }

    /*-------------------------------
            Heading
    -------------------------------*/

    .products-categories .section-heading{

        margin-bottom:2rem;

    }

    /*-------------------------------
            Categories
    -------------------------------*/

    .category-grid{

        display:flex;

        gap:1rem;

        overflow-x:auto;

        padding-bottom:.5rem;

        scroll-behavior:smooth;

        scrollbar-width:none;

    }

    .category-grid::-webkit-scrollbar{

        display:none;

    }

    .category-card{

        flex:0 0 140px;

    }

    .category-card img,

    .category-icon{

        width:90px;

        height:90px;

    }

    .category-card h3{

        font-size:.9rem;

    }

    /*-------------------------------
            Filter Card
    -------------------------------*/

    .products-filter{

        padding:1.5rem;

        border-radius:24px;

    }

    .products-filter-top{

        margin-bottom:1.5rem;

    }

    .products-count{

        font-size:.95rem;

    }

    .filter-grid{

        grid-template-columns:repeat(2,1fr);


    }

    .filter-search input,

    .filter-select select,

    .clear-filter-btn{

        height:52px;

    }

    /*==================================================
                PRODUCTS - MOBILE
    ==================================================*/

    .products-listing .products-grid{

        display:grid;

        grid-template-columns:repeat(2,minmax(0,1fr));

        gap:.85rem;

        align-items:start;

    }

    .products-listing .product-card{

        width:100%;

        margin:0;

        border-radius:22px;

    }

    .products-listing .product-image{

        aspect-ratio:1/1.1;

    }

    .products-listing .product-content{

        padding:.9rem .8rem 1rem;

    }



    /*-----------------------------------
                TITLE
    -----------------------------------*/

    .products-listing .product-content h3{

        margin:0 0 .2rem;

        font-size:.9rem;

        line-height:1;

        min-height:.3rem;

        display:-webkit-box;

        -webkit-line-clamp:2;

        -webkit-box-orient:vertical;

        overflow:hidden;

    }



    /*-----------------------------------
                RATING + PRICE
    -----------------------------------*/

    .product-info-row{

        display:flex;

        flex-direction:column;

        align-items:flex-start;

        gap:.3rem;

        margin-bottom:.55rem;

    }

    .product-rating{

        font-size:.82rem;

        gap:.25rem;

    }

    .product-rating i{

        font-size:.8rem;

    }

    .products-listing .price-box{

        display:flex;

        align-items:center;

        flex-wrap:wrap;

        gap:.35rem;

    }

    .products-listing .price{

        font-size:1.1rem;

        line-height:1;

    }

    .products-listing .old-price{

        font-size:.78rem;

    }



    /*-----------------------------------
                SAVE BADGE
    -----------------------------------*/

    .products-listing .save-price{

        padding:.38rem .75rem;

        font-size:.75rem;

        margin-bottom:.75rem;

    }



    /*-----------------------------------
                BUTTON
    -----------------------------------*/

    .products-listing .btn{

        min-height:42px;

        font-size:.88rem;

        border-radius:999px;

    }

    .products-listing .btn i{

        font-size:.8rem;

    }



    /*-----------------------------------
                BADGE
    -----------------------------------*/

    .discount-badge{

        top:12px;

        left:12px;

        padding:.55rem .8rem;

        font-size:.72rem;

        border-radius:14px;

    }



    /*-----------------------------------
                NO PRODUCTS
    -----------------------------------*/

    .no-products{

        padding:2.5rem 1rem;

    }


    .stock-overlay{

        backdrop-filter:blur(1.5px);

    }

    .stock-overlay span{

        padding:.55rem .9rem;

        max-width:85%;

        border-radius:14px;

        font-size:.72rem;

        font-weight:700;

        letter-spacing:.04em;

        line-height:1.35;

        text-align:center;

        word-break:break-word;

        box-shadow:

            0 6px 18px rgba(0,0,0,.18);

    }
}



/*==================================================
                SMALL MOBILE
==================================================*/

@media (max-width:576px){

    .products-page{

        padding:6.5rem 0 2.5rem;

    }

    /*-------------------------------
            Categories
    -------------------------------*/

    .category-card{

        flex:0 0 100px;
        min-height:70px;
        padding:1rem .8rem;
        border-radius:20px;

    }

    .category-card img,

    .category-icon{

        width:52px;

        height:52px;

    }

    .category-card h3{

        font-size:.82rem;

    }

     /*-------------------------------
            Product Grid
    -------------------------------*/

    .products-listing{

        padding:0 .75rem;

    }

    .products-listing .products-grid{

        display:grid;

        grid-template-columns:repeat(2,minmax(0,1fr));

        gap:.75rem;

        align-items:start;

    }

    .products-listing .product-card{

        width:100%;

        max-width:none;

        margin:0;

        border-radius:20px;

    }

    /*-------------------------------
            Product Image
    -------------------------------*/

    .products-listing .product-image{

        aspect-ratio:1/1.08;

    }

    /*-------------------------------
            Product Content
    -------------------------------*/

    .products-listing .product-content{

        padding:.8rem;

    }

    .products-listing .product-content h3{

        font-size:.8rem;

        line-height:1;


        min-height:.3rem;

        display:-webkit-box;


        -webkit-box-orient:vertical;

        overflow:hidden;

    }

    /*-------------------------------
            Rating & Price
    -------------------------------*/

    .product-info-row{

        display:flex;

        flex-direction:column;

        align-items:flex-start;

        gap:.25rem;

        margin-bottom:.45rem;

    }

    .product-rating{

        font-size:.78rem;

        gap:.2rem;

    }

    .product-rating i{

        font-size:.75rem;

    }

    .products-listing .price-box{

        display:flex;

        flex-wrap:wrap;

        align-items:center;

        gap:.25rem;

        margin:0;

    }

    .products-listing .price{

        font-size:1rem;

        font-weight:700;

    }

    .products-listing .old-price{

        font-size:.72rem;

    }

    /*-------------------------------
            Save Badge
    -------------------------------*/

    .products-listing .save-price{

        padding:.35rem .65rem;

        margin-bottom:.65rem;

        font-size:.72rem;

    }

    /*-------------------------------
            Button
    -------------------------------*/

    .products-listing .btn{

        min-height:40px;

        font-size:.82rem;

        gap:.3rem;

        border-radius:999px;

    }

    .products-listing .btn i{

        font-size:.75rem;

    }

    /*-------------------------------
            Discount Badge
    -------------------------------*/

    .discount-badge{

        top:10px;

        left:10px;

        padding:.5rem .75rem;

        font-size:.68rem;

        border-radius:14px;

    }

    /*-------------------------------
            Empty State
    -------------------------------*/

    .no-products{

        padding:2rem 1rem;

    }

    .no-products-icon{

        width:68px;

        height:68px;

        font-size:1.8rem;

    }

    .no-products h2{

        font-size:1.4rem;

    }

    .no-products p{

        font-size:.9rem;

    }


    .stock-overlay{

        backdrop-filter:blur(1.5px);

    }

    .stock-overlay span{

        padding:.55rem .9rem;

        max-width:85%;

        border-radius:14px;

        font-size:.72rem;

        font-weight:700;

        letter-spacing:.04em;

        line-height:1.35;

        text-align:center;

        word-break:break-word;

        box-shadow:

            0 6px 18px rgba(0,0,0,.18);

    }

}



/*==================================================
            REDUCED MOTION
==================================================*/

@media (prefers-reduced-motion:reduce){

    .category-card,

    .product-card,

    .clear-filter-btn{

        transition:none;

    }

}

.legal-moon{

    position:absolute;

    top:85px;

    left:5%;

    width:100px;

    pointer-events:none;

    user-select:none;

    animation:legalFloat 6s ease-in-out infinite;

}

.legal-cloud{

    position:absolute;

    pointer-events:none;

    user-select:none;

    animation:legalCloud 8s ease-in-out infinite;

}


.legal-cloud-top{

    width:180px;

    top:110px;

    right:6%;

}

@media (max-width:992px){
    .legal-moon{

        width:75px;

        top:80px;

        left:2%;

    }
    .legal-cloud-top{

        width:90px;

    }

    .legal-cloud-bottom{

        width:110px;

    }
}

@media (max-width:768px){
    .legal-moon{

            width:60px;

            top:75px;

            left:10px;

        }
    .legal-cloud-top{

        width:75px;

        right:8px;

    }
}

@media (prefers-reduced-motion:reduce){
    .legal-moon,

    .legal-cloud
    {

        animation:none !important;

        transition:none !important;

        transform:none !important;

        opacity:1 !important;

    }

}/*==================================================
            FILTER TOGGLE
==================================================*/

.filter-toggle{

    display:none;

    width:100%;

    margin-top:1rem;

    padding:1rem 1.4rem;

    justify-content:space-between;

    align-items:center;

    border:1px solid rgba(74,169,255,.12);

    border-radius:18px;

    background:#F7FBFF;

    box-shadow:
        0 8px 20px rgba(74,169,255,.08);

    cursor:pointer;

    transition:all .3s ease;

}

.filter-toggle:hover{

    background:#EDF7FF;

}

.filter-toggle span{

    display:flex;

    align-items:center;

    gap:.7rem;

    font-family:var(--secondary-font);

    font-size:1rem;

    font-weight:700;

    color:#23406B;

}

.filter-toggle span i{

    color:#4AA8FF;

}

#filter-arrow{

    color:#4AA8FF;

    font-size:1rem;

    transition:transform .3s ease;

}

.filter-toggle.active #filter-arrow{

    transform:rotate(180deg);

}



/*==================================================
            FILTER GRID
==================================================*/

.filter-grid{

    display:grid;

}



/*==================================================
            TABLET & MOBILE
==================================================*/

@media(max-width:992px){

    /*-----------------------------
            Toggle
    -----------------------------*/

    .filter-toggle{

        display:flex;

    }

    /*-----------------------------
            Filters Hidden
    -----------------------------*/

    .filter-grid{

        display:none;

        margin-top:1.5rem;

        grid-template-columns:repeat(2,1fr);

        gap:1rem;

        animation:fadeDown .3s ease;

    }

    .filter-grid.show{

        display:grid;

    }

    .clear-filter-btn{

        grid-column:1/-1;

    }

}



/*==================================================
            MOBILE
==================================================*/

@media(max-width:768px){

    .filter-grid{

        grid-template-columns:1fr;

    }

}



/*==================================================
            DESKTOP
==================================================*/

@media(min-width:993px){

    .filter-grid{

        display:grid !important;

    }

}



/*==================================================
            ANIMATION
==================================================*/

@keyframes fadeDown{

    from{

        opacity:0;

        transform:translateY(-12px);

    }

    to{

        opacity:1;

        transform:translateY(0);

    }

}
.products-page{
    padding-bottom:20px !important;
}

.footer-section{
    padding-top:0px !important;
}