/* ==========================================
MEDORA RESPONSIVE CSS
==========================================*/

@media(max-width:1200px){

.container{
    width:100%;
    max-width:1320px;
    margin:0 auto;
    padding:0 15px;
}

.search-box{
flex:1;
min-width:0;
max-width:400px;
display:flex;
}

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

.heroSwiper{
height:550px;
}

.heroSwiper img{
height:550px;
}

}


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

@media(max-width:992px){

.logo img{
height:80px;
}

.search-box{
width:320px;
}

.header-icons{
gap:15px;
}

.main-nav ul{
gap:18px;
flex-wrap:wrap;
}

.heroSwiper{
height:450px;
}

.heroSwiper img{
height:450px;
}

.product-grid{
grid-template-columns:repeat(2,1fr);
}

.collection-grid,
.premium-grid{
grid-template-columns:1fr;
}

.premium-large{
height:450px;
}

.offer-content{
flex-direction:column;
text-align:center;
padding:40px;
}

.offer-content img{
margin-top:30px;
width:300px;
}

.why-grid{
grid-template-columns:repeat(2,1fr);
}

.footer-top{
grid-template-columns:repeat(2,1fr);
}

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

}

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

@media(max-width:768px){

/* Offer */

.offer-slider{
display:flex;
gap:25px;
white-space:nowrap;
overflow-x:auto;
padding:0 15px;
font-size:12px;
}

.offer-slider::-webkit-scrollbar{
display:none;
}

/* Utility */

.utility-bar{
display:none;
}

/* Header */

.header-main{
padding:12px 15px;
}

.header-wrapper{
display:grid;
grid-template-columns:45px 1fr 70px;
align-items:center;
gap:10px;
}


.menu-btn{
    display:flex !important;
    justify-content:center;
    align-items:center;
    width:40px;
    height:40px;
    color:#fff;
    background:none;
    border:none;
    font-size:28px;
    cursor:pointer;
    z-index:1000;
}
.logo{
display:flex;
justify-content:center;
align-items:center;
}

.logo img{
width:150px;
height:auto;
}

.search-box{
display:none;
}

.header-icons{
display:flex;
justify-content:flex-end;
align-items:center;
gap:18px;
}

.header-icons a{
display:flex;
justify-content:center;
align-items:center;
font-size:24px;
}

.header-icons span{
display:none;
}

.header-icons small,
.cart-count{
top:-6px;
right:-6px;
}

/* Hide Account on mobile */

.header-icons a:nth-child(3){
display:none;
}

/* Navigation */

.main-nav{
display:none;
}

/* Hero */

.heroSwiper{
height:240px;
}

.heroSwiper img{
height:240px;
object-fit:cover;
}

.swiper-button-next,
.swiper-button-prev{
display:none;
}

/* Categories */

.category-wrapper{
display:flex;
flex-wrap:nowrap;
overflow-x:auto;
justify-content:flex-start;
gap:18px;
padding-bottom:10px;
}

.category-wrapper::-webkit-scrollbar{
display:none;
}

.category-item{
min-width:95px;
}

.category-item img{
width:85px;
height:85px;
}

/* Products */

.product-grid{
grid-template-columns:1fr;
gap:20px;
}

.product-card img{
height:260px;
}

/* Collections */

.premium-grid{
grid-template-columns:1fr;
}

.premium-large{
height:300px;
}

.premium-card{
height:220px;
}
/* ===== Premium Collections Mobile ===== */

.premium-overlay{
    padding:20px;
    justify-content:flex-end;
}

.premium-overlay span{
    font-size:10px;
    padding:4px 12px;
    margin-bottom:8px;
}

.premium-overlay h2{
    font-size:34px;
    line-height:1.1;
    margin-bottom:8px;
}

.premium-overlay h3{
    font-size:26px;
    line-height:1.1;
    margin-bottom:8px;
}

.premium-overlay p{
    font-size:14px;
    line-height:1.4;
    margin-bottom:12px;
}

.premium-overlay a{
    font-size:15px;
}

.premium-overlay .btn{
    display:inline-block;
    width:auto;
    padding:12px 24px;
    border-radius:30px;
}
/* Offer */

.offer-content{
flex-direction:column;
text-align:center;
padding:25px;
}

.offer-content img{
width:220px;
margin-top:20px;
}

/* Why */

.why-grid{
grid-template-columns:1fr;
}

/* Brands */

.brand-grid{
grid-template-columns:repeat(2,1fr);
}

/* Footer */

.footer-top{
grid-template-columns:1fr;
text-align:center;
}

.footer-bottom{
flex-direction:column;
text-align:center;
gap:12px;
}

.social-links{
justify-content:center;
}

}


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

@media(max-width:480px){

.logo img{
height:75px;
}

.heroSwiper{
height:220px;
}

.heroSwiper img{
height:220px;
}

.category-item img{
width:80px;
height:80px;
}

.category-item p{
font-size:13px;
}

.section-title h2{
font-size:26px;
}

.offer-content h2{
font-size:24px;
}

.offer-content p{
font-size:14px;
}

.btn{
padding:12px 24px;
font-size:14px;
}

.whatsapp-btn,
.call-btn{
width:55px;
height:55px;
font-size:24px;
right:15px;
}
}
@media (max-width:768px){

.category-slider{
    padding:25px 0 5px;
}

.premium-collections{
    padding:10px 0 40px;
}
.product-card img{
    height:250px;
    object-fit:contain;
    padding:20px;
}
.product-grid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:15px;
}
.offer-banner{
    padding:20px 0 50px;
}

.offer-content{
    padding:30px 20px;
    border-radius:20px;
    flex-direction:column;
    text-align:center;
}

.offer-content h5{
    font-size:12px;
}

.offer-content h2{
    font-size:30px;
    line-height:1.2;
    margin-bottom:15px;
}

.offer-content p{
    font-size:15px;
    margin-bottom:20px;
}

.offer-content img{
    width:220px;
    margin-top:20px;
}
.whatsapp-btn{
    bottom:90px;
}

.call-btn{
    bottom:20px;
}

}