/*=============================================
Large Devices (1200px)
=============================================*/

@media (max-width:1200px){

.hero h1{

font-size:35px;

}
.products-hero h1,.about-hero h1,.how-hero h1 {

font-size:30px;

}
.featured-products{
    padding: 50px 0;
}
.hero p{

font-size:17px;

}

.hero-image img{

max-width:520px;

}

}


/*=============================================
Laptop
=============================================*/

@media (max-width:992px){

.top-bar{

display:none;

}

.navbar{

padding:5px 0;

}
.marquee-content span {
    font-size: 13px;
    font-weight: 500;
}
.announcement-bar {
   
    padding: 4px 0;
}

.navbar-brand img{

height:55px;

}

.navbar-toggler{

border:none;
box-shadow:none;

}

.navbar-toggler:focus{

box-shadow:none;

}

.navbar-collapse{

background:#fff;
margin-top:20px;
padding:20px;
border-radius:18px;
box-shadow:0 20px 40px rgba(0,0,0,.08);

}

.navbar-nav{

gap:10px;
margin-bottom:20px;

}

.download-btn{

display:block;
text-align:center;

}

.hero{

padding:80px 0;

}

.hero .row{

flex-direction:column-reverse;

}

.hero-image{

margin-bottom:50px;

}

.hero-image img{

max-width:500px;
margin:auto;

}

.hero{

text-align:center;

}

.hero p{

margin:auto;

}

.hero-buttons{

justify-content:center;

}

.hero-features{

justify-content:center;

}

.hero h1{

font-size:30px;

}

}


/*=============================================
Tablet
=============================================*/

@media (max-width:768px){

section{

padding:80px 0;

}

.hero{

min-height:auto;

}

.hero h1{

font-size:35px;
line-height:1.25;

}

.hero p{

font-size:16px;
line-height:1.8;

}

.hero-buttons{

/* flex-direction:column; */
align-items:center;

}
.hero-highlights div {
    background: #fff;
    padding: 13px 12px;
    border-radius: 50px;
    box-shadow: 0 10px 25px rgba(0, 0, 0, .08);
    font-size: 14px;
    font-weight: 600;
}

.btn-green,
.btn-white{

width:240px;
text-align:center;

}

.hero-features{

gap:15px;

}

.hero-features div{

width:100%;
justify-content:center;
display:flex;

}

.hero-tag{

font-size:14px;

}

}


/*=============================================
Mobile
=============================================*/

@media (max-width:576px){


    .categories .row>* {
    flex-shrink: 0;
    width: 50%;
    max-width: 100%;
    padding-right: calc(var(--bs-gutter-x) * .5);
    padding-left: calc(var(--bs-gutter-x) * .5);
    margin-top: var(--bs-gutter-y);
}

.navbar-brand img{

height:48px;

}

.hero{

padding:70px 0;

}

.hero h1{

font-size:30px;

}
.hero-features div {
        width: 48%;
        justify-content: center;
        display: flex;
    }
}
.hero p{

font-size:15px;

}

.hero-tag{

padding:10px 18px;
font-size:13px;

}

.hero-buttons{

margin:30px 0;

}

.btn-green,
.btn-white{

padding:15px 20px;
font-size:15px;

}

.hero-features div{

padding:14px 18px;
font-size:14px;

}

.hero::before{

width:280px;
height:280px;

}

.hero::after{

width:220px;
height:220px;

}

}


/*=============================================
Small Mobile
=============================================*/

@media (max-width:400px){

.hero h1{

font-size:30px;

}

.hero p{

font-size:14px;

}

.btn-green,
.btn-white{

width:100%;

}

.download-btn{

width:100%;

}

}

/* Search */

@media(max-width:768px){

.search-box{

flex-direction:column;
border-radius:25px;

}

.search-box i{

margin-bottom:15px;

}

.search-box input{

width:100%;
margin-bottom:20px;

}

.search-box button{

width:100%;

}

.section-title h2{

font-size:25px;
text-align:center;

}
.section-title p {
    max-width: 100%;
    margin: auto;
    font-size: 14px;
    text-align: center;
    
}
.section-title span{
    font-size: 14px;
    text-align: center;
    display: block;
}
.why-us{
    padding: 50px 0;
}

.category-card img{

height:110px;

}
.category-card{
    border-radius: 15px;
}
.category-content h4{
font-size:15px;
margin-bottom: 10px;
}
.category-content p {
 font-size: 12px;
 line-height: 1.5;
}
.category-content {
    padding: 15px;
}

.category-content a {
    margin-top: 10px;
    font-size: 13px;
}
}
@media(max-width:768px){

.product-buttons{

flex-direction:column;

}

.product-filter{

justify-content:flex-start;
overflow-x:auto;
flex-wrap:nowrap;
padding-bottom:10px;

}

.product-filter::-webkit-scrollbar{

display:none;

}

.product-filter button{

white-space:nowrap;

}

}

@media(max-width:991px){

.experience-card{

position:relative;
right:0;
bottom:0;
margin-top:20px;
width:100%;

}

}

@media(max-width:576px){

    .featured-products .row>* {
    flex-shrink: 0;
    width: 50%;
    max-width: 100%;
    padding-right: calc(var(--bs-gutter-x) * .5);
    padding-left: calc(var(--bs-gutter-x) * .5);
    margin-top: var(--bs-gutter-y);
}
.product-card img {
    width: 100%;
    height: 140px;
    object-fit: contain;
    padding: 30px 30px 0 30px;
    transition: .4s;
}
.product-badge {
    position: absolute;
    top: 12px;
    left: 12px;
    background: var(--primary);
    color: #fff;
    padding: 4px 12px;
    border-radius: 50px;
    font-size: 11px;
}

.product-price {
   
    margin: 9px 0;
    font-size: 16px;
    font-weight: 600;
}
.product-body small {
    display: block;
    color: var(--text);
    font-size: 10px;
    margin-bottom: 10px;
}
.product-body {
    padding: 20px;
}
.feature-card{

padding:25px 18px;

}

.feature-card h5{

font-size:18px;

}

.experience-card h2{

font-size:42px;

}

}

@media(max-width:991px){

.journey-wrapper{

flex-direction:column;

}

.journey-arrow{

transform:rotate(90deg);

}

}

@media(max-width:768px){

.stats-card{

padding:35px 20px;

}

.stats-card h2{

font-size:40px;

}

.stats-icon{

width:70px;
height:70px;
font-size:26px;

}

}

@media(max-width:991px){

.download-app{

text-align:center;

}

.download-buttons{

justify-content:center;
/* flex-wrap:wrap; */

}

.phone-wrapper{

margin-top:60px;

}

.qr-box{

position:relative;
left:0;
bottom:0;
margin:30px auto 0;
display:inline-block;

}

}

@media(max-width:576px){

.download-app h2{

font-size:22px;

}

.phone-image{

max-width:280px;

}

.download-buttons{
    padding-bottom: 2rem;

/* flex-direction:column; */

}
.footer {
    background: #183A1D;
    padding: 60px 0 25px;
    color: #fff;
}

.playstore-btn,
.appstore-btn{

width:100%;

}

}

@media(max-width:768px){

.footer{

/* text-align:center; */

}

.social-links{

justify-content:start;

}

.contact-info li{

justify-content:start;

}
.faq-section{
    padding: 50px 0;
}

.footer-bottom{

flex-direction:column;

}

}

@media(max-width:991px){

.about-hero{

text-align:center;
padding:90px 0;

}

.about-hero h1{

font-size:35px;

}

.about-hero-image{

margin-top:60px;

}

.card-1,
.card-2{

position:relative;
display:inline-block;
margin:15px;

}

}

@media(max-width:576px){

.about-hero h1{

font-size:30px;

}

.about-hero p{

font-size:16px;

}

}

@media(max-width:991px){

.about-list{

grid-template-columns:1fr;

}

.experience-box{

position:relative;
right:0;
bottom:0;
margin-top:25px;
width:100%;

}

.who-we-are h2{

font-size:30px;

}

}

@media(max-width:576px){

.who-we-are{

padding:80px 0;

}

.who-we-are h2{

font-size:20px;
text-align:center;

}
.section-subtitle {
text-align: center;
    font-size: 14px;
    margin-bottom: 20px;
    display: block;
}
.floating-tag.three .floating-tag.one{

    display: none!important;
}

}

@media(max-width:991px){

.timeline::before{

left:35px;

}

.timeline-item{

width:calc(100% - 90px);
margin-left:90px!important;
margin-right:0!important;

}

.timeline-icon{

margin-left:0;

}

}

@media(max-width:576px){

.timeline-content{

padding:25px;

}

.timeline-content h3{

font-size:22px;

}

}

@media(max-width:991px){

.values-grid{

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

}

.purpose-card{

padding:35px;

}

}

@media(max-width:576px){

.values-grid{

grid-template-columns:1fr;

}

.purpose-card{

padding:30px;

}

.purpose-card h3{

font-size:26px;

}

}

@media(max-width:768px){

.comparison-header,
.comparison-row{

grid-template-columns:1fr;

}

.comparison-title{

font-size:22px;

}

.comparison-left,
.comparison-right{

padding:22px;

}

}

@media(max-width:991px){

.promise-card{

position:relative;
left:0;
bottom:0;
width:100%;
margin-top:25px;

}

.promise-list{

grid-template-columns:1fr;

}

}

@media(max-width:576px){

.our-promise{

padding:80px 0;

}

.promise-card{

padding:25px;

}

.promise-card h3{

font-size:24px;

}

}

@media(max-width:991px){

.products-hero{

text-align:center;

}

.products-hero h1{

font-size:42px;

}

.products-hero-image{

margin-top:60px;

}

.hero-highlights{

justify-content:center;

}

.floating-tag{

position:relative;
display:none;
margin:10px;

left:auto;
right:auto;
top:auto;
bottom:auto;

}

}

@media(max-width:576px){

.products-hero{

padding:80px 0;

}

.products-hero h1{

font-size:34px;

}

.products-hero p{

font-size:16px;

}

}

@media(max-width:768px){

    .products-section .row>* {
    flex-shrink: 0;
    width: 50%;
    max-width: 100%;
    
}

.product-image {
    height: 150px;
   
}
.product-toolbar{

top:-10px;
padding:5px;

}
.price-lock {
    background: #f2f9e8;
    border-radius: 15px;
    padding: 13px 15px;
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-bottom: 10px;
}
.download-btn {
   
    padding: 10px 4px !important;
   
}
.p-d{
    height: 40px;
}
.product-body h3 {
    margin: 5px 0 10px 0;
    font-size: 15px;
    color: #256628;
    font-weight: 600;
}

.toolbar-search input{

height:58px;
font-size:15px;

}

.filter-btn{

padding:12px;
font-size:13px;

}

}

@media(max-width:991px){

.delivery-badge{

position:relative;
right:0;
bottom:0;
margin-top:25px;
width:100%;

}

.why-order{

padding:80px 0;

}

}

@media(max-width:576px){

.why-list i{

width:55px;
height:55px;
font-size:22px;

}

.why-list h4{

font-size:20px;

}

}

@media(max-width:991px){

.journey-wrapper{

flex-direction:column;

}

.journey-line{

width:4px;
height:60px;

}

.journey-line::after{

left:50%;
top:auto;
bottom:-8px;
transform:translateX(-50%);

}

.journey-card{

width:100%;

}

}

@media(max-width:991px){

.area-grid{

grid-template-columns:repeat(2,1fr);
margin-top:40px;

}

}

@media(max-width:576px){

.area-grid{

grid-template-columns:1fr;

}

.delivery-areas{

padding:80px 0;

}

.delivery-areas h2{

font-size:34px;

}

}

@media(max-width:991px){

.contact-form-section{

padding:80px 0;

}

.map-box{

min-height:400px;
margin-top:30px;

}

.contact-form-box{

padding:30px;

}

}

@media(max-width:768px){

.business-hours{

padding:80px 0;

}

.hours-wrapper{

padding:25px;

}

.hours-item{

flex-direction:column;
align-items:flex-start;
gap:8px;

}

.help-card{

margin-top:25px;

}

}

@media(max-width:768px){

.help-section{

padding:80px 0;

}

.help-box{

padding:30px 25px;

}

}