/* ==========================================================
   KITTU BITTU FOODS
   Responsive CSS
==========================================================*/

/* ==========================================================
   LARGE TABLETS
==========================================================*/

@media (max-width:1200px){

.container{

    width:min(94%,1100px);

}

.hero-grid{

    gap:50px;

}

.hero-title{

    font-size:3.5rem;

}

.hero-image-wrapper{

    max-width:520px;

}

.hero-stats{

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

}

.footer-grid{

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

}

}



/* ==========================================================
   TABLETS
==========================================================*/

@media (max-width:992px){

.desktop-nav,

.whatsapp-btn{

    display:none;

}

.menu-toggle{

    display:flex;

}

.header-wrapper{

    min-height:80px;

}

.logo-image{

    width:60px;

    height:60px;

}

.logo-text h1{

    font-size:1.55rem;

}

.logo-text p{

    font-size:.85rem;

}



/* Hero */

.hero-section{

    padding:90px 0 70px;

}

.hero-grid{

    grid-template-columns:1fr;

    gap:60px;

    text-align:center;

}

.hero-content{

    order:2;

    align-items:center;

}

.hero-media{

    order:1;

}

.hero-description{

    max-width:700px;

}

.hero-features{

    justify-content:center;

}

.hero-buttons{

    justify-content:center;

}

.hero-trust{

    justify-content:center;

}

.hero-image-wrapper{

    max-width:520px;

    margin:auto;

}



/* Floating Cards */

.floating-card-top{

    left:10px;

    top:-20px;

}

.floating-card-left{

    left:-10px;

    bottom:100px;

}

.floating-card-right{

    right:-10px;

    bottom:25px;

}

.hero-rating-card{

    right:-20px;

}

.experience-card{

    left:15px;

}

}



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

@media (max-width:768px){

section{

    padding:70px 0;

}

.container{

    width:92%;

}



/* Announcement */

.announcement-content{

    gap:12px;

    font-size:.82rem;

}



/* Header */

.header-wrapper{

    min-height:72px;

}

.logo-image{

    width:54px;

    height:54px;

}

.logo-text h1{

    font-size:1.35rem;

}

.logo-text p{

    font-size:.78rem;

}



/* Hero */

.hero-title{

    font-size:2.55rem;

}

.hero-description{

    font-size:1rem;

}

.hero-buttons{

    flex-direction:column;

    width:100%;

}

.hero-buttons .btn{

    width:100%;

}

.hero-features{

    gap:10px;

}

.hero-feature{

    width:100%;

    justify-content:center;

}



/* Hero Image */

.hero-image{

    border-radius:24px;

}

.hero-image-wrapper{

    max-width:100%;

}



/* Hide Floating Cards */

.floating-card,

.hero-rating-card,

.experience-card{

    position:relative;

    inset:auto;

    width:100%;

    margin-top:18px;

    animation:none;

}

.hero-image-wrapper{

    display:flex;

    flex-direction:column;

}



/* Hero Stats */

.hero-stats{

    grid-template-columns:1fr;

}

.stat-card{

    padding:22px;

}



/* Section Heading */

.section-heading{

    margin-bottom:45px;

}

.section-heading h2{

    font-size:2.1rem;

}

.section-heading p{

    font-size:1rem;

}

}



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

@media (max-width:480px){

.hero-title{

    font-size:2rem;

}

.logo-text h1{

    font-size:1.15rem;

}

.logo-text p{

    display:none;

}

.hero-badge{

    width:100%;

    justify-content:center;

}

.hero-feature{

    padding:12px;

}

.btn{

    padding:15px 20px;

}

.section-heading h2{

    font-size:1.8rem;

}

}
/* ==========================================================
   HOMEPAGE SECTIONS RESPONSIVE
==========================================================*/

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

@media (max-width:992px){

/* Trust Strip */

.trust-strip-grid{

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

    gap:20px;

}

/* Specialities */

.specialities-grid{

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

    gap:25px;

}

/* Why Choose */

.why-grid{

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

    gap:25px;

}

/* Vanta Master */

.vanta-grid{

    grid-template-columns:1fr;

    gap:60px;

}

.vanta-content{

    order:2;

    text-align:center;

}

.vanta-image{

    order:1;

}

.vanta-features{

    justify-content:center;

}

.vanta-buttons{

    justify-content:center;

}

/* Featured Products */

.products-grid{

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

}

/* Offers */

.offers-grid{

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

}

.featured-offer{

    grid-column:span 2;

}

/* How To Order */

.order-steps{

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

}

/* Reviews */

.reviews-grid{

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

}

/* Social */

.social-grid{

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

}

}


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

@media (max-width:768px){

/* Trust Strip */

.trust-strip-grid{

    grid-template-columns:1fr;

}

.trust-strip-item{

    padding:20px;

}

/* Specialities */

.specialities-grid{

    grid-template-columns:1fr;

}

.speciality-card{

    padding:28px;

}

/* Why Choose */

.why-grid{

    grid-template-columns:1fr;

}

.why-card{

    padding:30px 24px;

}

/* Vanta Master */

.vanta-content{

    text-align:center;

}

.vanta-buttons{

    flex-direction:column;

    width:100%;

}

.vanta-buttons .btn{

    width:100%;

}

.vanta-features{

    flex-direction:column;

    align-items:flex-start;

}

.feature-item{

    width:100%;

}

/* Featured Products */

.products-grid{

    grid-template-columns:1fr;

}

.product-card{

    width:100%;

}

/* Offers */

.offers-grid{

    grid-template-columns:1fr;

}

.featured-offer{

    grid-column:auto;

}

/* How To Order */

.order-steps{

    grid-template-columns:1fr;

}

.order-step{

    padding:28px;

}

/* Reviews */

.reviews-grid{

    grid-template-columns:1fr;

}

/* Social */

.social-grid{

    grid-template-columns:1fr;

}

.social-card{

    padding:22px;

}

/* Footer */

.footer-grid{

    grid-template-columns:1fr;

    gap:45px;

}

.footer-brand{

    text-align:center;

}

.footer-brand img{

    margin:auto;

}

.footer-social{

    justify-content:center;

}

.footer-column{

    text-align:center;

}

.footer-contact li{

    justify-content:center;

}

.footer-bottom{

    flex-direction:column;

    text-align:center;

    gap:20px;

}

.footer-bottom-links{

    justify-content:center;

    flex-wrap:wrap;

}

}


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

@media (max-width:480px){

.speciality-card{

    padding:24px;

}

.why-card{

    padding:24px;

}

.product-content{

    padding:22px;

}

.offer-content{

    padding:22px;

}

.review-card{

    padding:22px;

}

.social-card{

    padding:18px;

}

.footer-logo{

    width:120px;

    height:120px;

}

.footer-bottom-links{

    flex-direction:column;

    gap:12px;

}

}

@media (min-width:1600px){

.container{

    max-width:1400px;

}

.hero-title{

    font-size:4.8rem;

}

}