/* 🔹 Mobile (Portrait phones, up to 480px) */
 @media only screen and (max-width: 480px) {
   .breadcrumbs .bread-text2 h1 {
     color: #A32430;
     font-size: 38px;
     font-weight: bold;
   }

   .breadcrumbs .bread-text2 {
     bottom: 0px !important;
   }

   .breadcrumbs .breadLogo {
     max-width: 70px;
   }

   .breadcrumbs .order-btn {
     font-size: 13px;
     padding: 7px 10px;
     margin: 0;
     zoom: 0.7;
   }

   .breadcrumbs .bread-text {
     padding: 10px;
     bottom: 0px;
   }

   .breadcrumbs .bread-social {
     position: absolute;
     bottom: 14px;
     gap: 5px;
   }

   .breadcrumbs .bread-available-platforms {
     position: absolute;
     bottom: 14px;
     right: 10px;
   }

   .bread-available-platforms h6 {
     font-size: 16px;
   }

   .bread-available-platforms img {
     width: 18px;
   }

   .breadcrumbs .breadcover {
     bottom: 0;
   }

   .breadMainLogo {
     width: 220px;
   }

   .common-section.about-section {
     background: url("../img/about_mobile.png") center/cover no-repeat;
   }

   .common-section.foodies-section {
     background: url("../img/to_talk_mobile.png") center/cover no-repeat;
   }

   .common-section.catering-section {
     background: url("../img/catering_mobile.png") center/cover no-repeat;
   }

   .about-content {
     padding: 15px;
   }

   .about-content h2 {
     font-size: 20px;
   }

   .btn-primary {
     text-align: center;
   }

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

   .theme-heading-red {
     font-size: 45px !important;
   }

   .theme-heading-cream {
     font-size: 45px !important;
   }

   .theme-subheading-red {
     font-size: 26px !important;
   }

   .theme-subheading-cream {
     font-size: 26px !important;
   }

   .brand-slider .owl-carousel .item img {
     width: 70px !important;
     height: 70px !important;
     object-fit: contain;
   }

   footer .footer-waves {
     background: url('../img/footer-mask-mob.png') !important;
   }

   /* .our-values {
     background: url('../img/our-values-mob.png') center/cover no-repeat !important;
   }

   .community {
     background: url('../img/community-mob.png') center/cover no-repeat !important;
   }

   .quality {
     background: url('../img/quality-mob.png') center/cover no-repeat !important;
   } */

   .powered {
     background: url('../img/powered-mob.png') center/cover no-repeat !important;
   }

   .partnerships {
     background: url('../img/partnerships-mob.png') center/cover no-repeat !important;
   }

   .custom-modal .modal-content {
     width: 100%;
     height: auto;
     /* let it auto-adjust on mobile */
     padding: 0;
   }

   .custom-modal h2 {
     font-size: 1.3rem;
   }

   .hero {
     height: auto;
     /* auto height for small screens */
     padding: 60px 20px;
   }

   .hero-content h1 {
     font-size: 1.8rem;
   }

   .hero-content p {
     font-size: 0.9rem;
     line-height: 1.4;
   }

   .hero-content .btn {
     font-size: 0.9rem;
     padding: 8px 20px;
   }

   .common-content h2 {
     font-size: 22px;
   }

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

   .common-content {
     max-width: 100%;
   }

   .getOffer {
     left: unset;
     right: 20px;
   }

   .customPopup {
     display: none;
     width: 240px;
     height: auto;
     padding: 20px;
     top: 85px;
   }

   .customPopupContent {
     gap: 20px;
   }

   .custom-modal .form-control {
     width: 100% !important;
     height: auto;
     background: transparent;
     border: 1px solid #A32430;
     border-radius: 5px;
     background: transparent; 
   }
   .emailBtn { 
      width: 15%;
   }
 }

 /* 🔹 Extra Small Mobile (up to 320px, old small devices) */
 @media only screen and (max-width: 320px) {
   .theme-heading-red {
     font-size: 36px !important;
   }

   .our-values .theme-heading-red {
     margin-top: 40px;
   }

   .hero-content .btn {
     font-size: 13px;
     padding: 7px 10px;
   }

   .custom-modal h2 {
     font-size: 16px;
   }

   .breadcrumbs .breadLogo {
     max-width: 55px;
   }

   .custom-modal .form-control {
     width: 100% !important;
   }

   .modal-body {
     padding: 0 !important;
   }

   .customPopup {
     display: none;
     width: 240px;
     height: auto;
     padding: 20px;
     top: 85px;
   }

   .customPopupContent {
     gap: 20px;
   }
 }

 /* 🔹 Small Mobile (321px - 375px, iPhone SE, older Androids) */
 @media only screen and (min-width: 321px) and (max-width: 375px) {
   .custom-modal h2 {
     font-size: 16px;
   }

   .customPopup {
     display: none;
     width: 240px;
     height: auto;
     padding: 20px;
     top: 85px;
   }

   .customPopupContent {
     gap: 20px;
   }
 }

 /* 🔹 Regular Mobile (376px - 414px, iPhone 11/12/13, Pixel) */
 @media only screen and (min-width: 376px) and (max-width: 414px) {}

 /* 🔹 Large Mobile / Phablets (415px - 480px, big phones) */
 @media only screen and (min-width: 415px) and (max-width: 480px) {}