/* =====================================
   Announcement Bar Start
===================================== */

@media(max-width:768px){

.announcement-wrapper{

    flex-direction:column;

    gap:10px;

    text-align:center;

}

.announcement-right{

    flex-wrap:wrap;

    justify-content:center;

}

}

/* =====================================
   Announcement Bar End
===================================== */

/* ==========================================
        HEADER
========================================== */

@media(max-width:992px){

.search-box{

    display:none;

}

.header-wrapper{

    gap:20px;

}

}

@media(max-width:576px){

.logo{

    font-size:26px;

}

.header-icons{

    gap:18px;

}

.header-icons a{

    font-size:20px;

}

}

/* ==========================================
        HEADER End
========================================== */

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

/* ---------- Large Tablet ---------- */

@media (max-width: 1200px){

    .navbar-wrapper{
        gap:20px;
    }

    .nav-menu{
        gap:20px;
    }

}


/* ---------- Tablet ---------- */

@media (max-width:992px){

    /* Show Hamburger */

    .menu-toggle{
        display:flex;
        justify-content:center;
        align-items:center;
    }

    /* Hide Desktop Navigation */

    .nav-menu{
        display:none;
    }

    /* Hide Offer */

    .nav-right{
        display:none;
    }

    /* Categories Grow */

    .categories{
        flex:1;
    }

    .category-toggle{
        width:100%;
        justify-content:space-between;
    }

}


/* ---------- Mobile ---------- */

@media (max-width:768px){

    .navbar-wrapper{

        min-height:65px;

    }

    .category-toggle{

        padding:14px 18px;

        font-size:15px;

    }

}


/* ---------- Small Mobile ---------- */

@media (max-width:576px){

    .category-toggle span{

        font-size:14px;

    }

    .category-toggle{

        padding:12px 15px;

    }

    .mobile-menu{

        width:280px;

    }

}


/* ---------- Extra Small ---------- */

@media (max-width:380px){

    .mobile-menu{

        width:100%;

    }

}

/* =====================================================
            NAVIGATION RESPONSIVE End
===================================================== */

/* ==========================================
            HERO
========================================== */

@media(max-width:992px){

.hero-wrapper{

    grid-template-columns:1fr;

    text-align:center;

}

.hero-content p{

    margin:auto auto 35px;

}

.hero-buttons{

    justify-content:center;

}

.hero-info{

    justify-content:center;

    flex-wrap:wrap;

}

.hero-image{

    order:-1;

}

}

@media(max-width:576px){

.hero-content h1{

    font-size:42px;

}

.hero-info{

    gap:25px;

}

}

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

@media (max-width:1200px){

.hero-wrapper{

    gap:50px;

}

.hero-content h1{

    font-size:56px;

}

.hero-image img{

    max-width:480px;

}

}

@media (max-width:992px){

.hero{

    padding:80px 0;

}

.hero-wrapper{

    grid-template-columns:1fr;

    text-align:center;

    gap:60px;

}

.hero-content{

    max-width:100%;

    order:2;

}

.hero-image{

    order:1;

}

.hero-buttons{

    justify-content:center;

}

.hero-stats{

    justify-content:center;

}

.hero-image img{

    max-width:430px;

}

.discount-card{

    left:0;

}

.rating-card{

    right:0;

}

}

@media (max-width:768px){

.hero{

    min-height:auto;

}

.hero-wrapper{

    min-height:auto;

    padding:40px 0;

}

.hero-content h1{

    font-size:42px;

}

.hero-content p{

    font-size:16px;

}

.hero-buttons{

    flex-direction:column;

}

.hero-buttons .btn{

    width:100%;

}

.hero-stats{

    gap:20px;

    flex-wrap:wrap;

}

.hero-image img{

    max-width:340px;

}

.discount-card{

    width:110px;

    padding:16px;

}

.discount-card h2{

    font-size:32px;

}

.rating-card{

    width:150px;

}

}

@media (max-width:480px){

.hero-content h1{

    font-size:34px;

}

.hero-badge{

    font-size:13px;

}

.hero-image img{

    max-width:280px;

}

.discount-card{

    display:none;

}

.rating-card{

    display:none;

}

.hero-stats{

    flex-direction:column;

    align-items:center;

}

}

/* ==========================================
            HERO End
========================================== */


/* ==========================================
            FEATURES Start
========================================== */

@media(max-width:992px){

.features-grid{

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

}

}

@media(max-width:576px){

.features-grid{

grid-template-columns:1fr;

}

}
/* ==========================================
            FEATURES End
========================================== */

/* ==========================================
        SHOP CATEGORY SECTION Start
========================================== */

@media(max-width:768px){

.section-title{

    font-size:34px;

}

.section-description{

    font-size:16px;

    line-height:1.7;

}

.shop-category{

    padding:80px 0;

}

}

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

@media(max-width:1200px){

.category-grid{

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

}

}

@media(max-width:768px){

.category-grid{

    grid-template-columns:1fr;

}

.category-card{

    height:350px;

}

}
/* ==========================================
        SHOP CATEGORY SECTION End
========================================== */


/* ==========================================
        TRENDING PRODUCTS Start
========================================== */

@media(max-width:1200px){

.product-grid{

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

}

}

@media(max-width:992px){

.product-grid{

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

}

}

@media(max-width:768px){

.product-grid{

    grid-template-columns:1fr;

}

.product-image{

    height:250px;

}

}

/* ==========================================
        TRENDING PRODUCTS End
========================================== */


/* ==========================================
        Flash Sale Start
========================================== */

@media(max-width:992px){

.flash-wrapper{

    grid-template-columns:1fr;

    text-align:center;

    padding:50px 35px;

}

.flash-content p{

    margin:auto auto 35px;

}

.flash-image{

    margin-top:30px;

}

.flash-content h2{

    font-size:42px;

}

}


@media(max-width:768px){

.countdown{

    justify-content:center;

}

.time-box{

    width:80px;

    height:80px;

}

.time-box h3{

    font-size:28px;

}

}
/* ==========================================
        Flash Sale End
========================================== */


/* ==========================================
        FEATURED PRODUCTS Start
========================================== */

@media(max-width:768px){

.featured-filter{

    gap:12px;

}

.featured-btn{

    padding:12px 22px;

    font-size:14px;

}

}

@media(max-width:1200px){

.featured-grid{

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

}

}

@media(max-width:992px){

.featured-grid{

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

}

}

@media(max-width:768px){

.featured-grid{

    grid-template-columns:1fr;

}

}

/* ==========================================
         FEATURED PRODUCTS END
========================================== */