@media (max-width: 768px) {

     /* ==navbar== */
     .menu {
         position: absolute;
         top: 100%;
         left: 0;
         width: 100%;
         background: linear-gradient(90deg, rgb(11 44 77 / 37%) 0%, rgb(91 163 237 / 41%) 20%, rgb(64 112 159 / 40%) 40%, rgb(124 163 201 / 41%) 60%, rgb(35 118 201 / 44%) 80%, rgb(11 44 77 / 46%) 100%);

         flex-direction: column;
         align-items: center;
         gap: 15px;

         overflow: hidden;
         max-height: 0;
         transition: max-height 0.35s ease;

         z-index: 1000;
     }

     .menu.active {
         max-height: 350px;
         padding: 15px 0;
     }

     .hamburger {
         display: flex;
     }

     .right-btn {
         display: none;
     }
 }

 @media (max-width: 1024px) {

     /* ===hero section=== */
     .hero-section,
     .innerpage-banner-section {
         min-height: 700px;
         background-position: center center;
     }

     .hero-content {
         width: 90%;
         padding: 70px 0;
     }

     .hero-text {
         max-width: 560px;
     }

     .hero-text h1 {
         font-size: 48px;
     }

     .hero-proof {
         gap: 20px;
     }

     .hero-proof-item h6 {
         font-size: 16px;
     }

     .strip-item {
         padding: 18px 20px;
     }
 }


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

 @media (max-width: 768px) {

     /* ===hero section== */
     .hero-section,
     .innerpage-banner-section {
         min-height: auto;
         background-position: 65% center;
     }

     .hero-section::before,
     .innerpage-banner-section::before {
         background: linear-gradient(90deg,
                 rgb(31 49 69 / 94%) 0%,
                 rgb(31 49 69 / 82%) 55%,
                 rgb(7 29 53 / 60%) 100%);
     }

     .hero-content {
         width: 90%;
         padding: 80px 0;
     }

     .hero-text {
         max-width: 600px;
     }

     .hero-text h1 {
         font-size: 44px;
         line-height: 1.15;
     }

     .herotop-text {
         font-size: 14px;
         letter-spacing: 2px;
     }

     .hero-proof {
         gap: 20px;
     }

     .hero-proof-item h6 {
         font-size: 16px;
     }

     .hero-proof-item p {
         font-size: 12px;
     }

     /* ==strip=== */
     .strip-grid {
         grid-template-columns: 1fr;
     }

     .strip-item {
         border-right: 0;
         border-bottom: 1px solid rgba(255, 255, 255, 0.12);
         padding: 18px 20px;
     }

     .strip-item:last-child {
         border-bottom: 0;
     }

     /* ===about== */
     .about .about_img {
         float: none;
         width: 100%;
         margin: 0 0 25px 0;
     }

     /* ====how it works== */

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

     .conversation-card {
         width: 100%;
         min-height: auto;
         padding: 25px 20px;
     }

     .conversation-icon-box {
         width: 75px;
         height: 75px;
     }

     .conversation-icon img {
         width: 38px;
         height: 38px;
     }

     .conversation-card h3 {
         margin-top: 15px;
         font-size: 19px;
     }

     .conversation-card p {
         font-size: 15px;
         line-height: 1.5;
     }

     /* ====explore business== */
     .explore-business {
         padding: 40px 0;
     }

     .explore-icon {
         height: 200px;
     }

     .explore-card h6 {
         margin-top: 25px;
     }

     .explore-card h3 {
         font-size: 20px;
     }

     /* ===quote=== */
     .quote {
         padding: 20px;
     }

     .quote p {
         font-size: 18px;
         line-height: 1.5;
     }
 }


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

 @media (max-width: 576px) {

     /* ==hero section== */
     .hero-section,
     .innerpage-banner-section {
         min-height: auto;
         background-position: center center;
     }

     .hero-section::before,
     .innerpage-banner-section::before {
         background: rgba(15, 37, 59, 0.82);
     }

     .hero-content {
         width: 90%;
         padding: 70px 0 60px;
     }

     .hero-text {
         max-width: 100%;
     }

     .herotop-text {
         font-size: 12px;
         padding: 7px 10px;
         letter-spacing: 1.5px;
     }

     .hero-text h1 {
         font-size: 36px;
         line-height: 1.15;
         margin-top: 18px;
     }

     .hero-text p {
         font-size: 14px;
         line-height: 1.6;
     }

     /* Buttons stack on mobile */

     .hero-buttons {
         flex-direction: column;
         align-items: stretch;
         gap: 12px;
         margin-top: 25px;
     }

     .hero-buttons button {
         width: 100%;
         min-height: 50px;
     }

     /* Proof items stack */

     .hero-proof {
         flex-direction: column;
         gap: 18px;
         padding-top: 22px;
         margin-top: 25px;
     }

     .hero-proof-item {
         width: 100%;
     }

     .hero-proof-item h6 {
         font-size: 17px;
         margin-bottom: 5px;
     }

     .hero-proof-item p {
         max-width: 100%;
         font-size: 12px;
         line-height: 1.5;
     }

     /* ===strip=== */

     .strip-item {
         padding: 18px 20px;
     }

     .strip-item h6 {
         font-size: 14px;
     }

     .strip-item p {
         font-size: 12px;
     }

     /* ===franchise categories== */
     .franchise-grid {
         grid-template-columns: 1fr;
         gap: 15px;
     }

     .franchise-box {
         height: 240px;
     }

     .franchise-content {
         left: 15px;
         bottom: 15px;
     }

     .franchise-content h6 {
         font-size: 18px;
     }

     .franchise-content p {
         font-size: 12px;
     }
 }


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

 @media (max-width: 375px) {

     /* ==hero section=== */
     .hero-content {
         padding: 60px 0 50px;
     }

     .hero-text h1 {
         font-size: 31px;
     }

     .herotop-text {
         font-size: 11px;
         letter-spacing: 1px;
     }

     .hero-text p {
         font-size: 13px;
     }

     .hero-proof-item h6 {
         font-size: 16px;
     }
 }

 /* Tablet */
 @media (max-width: 991px) {

     /* ==franchise categories== */
     .franchise-grid {
         grid-template-columns: repeat(2, 1fr);
         gap: 15px;
     }

     .franchise-box {
         height: 260px;
     }

     .franchise-content {
         left: 16px;
         bottom: 16px;
     }

     .franchise-content h6 {
         font-size: 19px;
     }

     /* ===how it works== */
     .five-grid {
         grid-template-columns: repeat(2, 1fr);
         gap: 25px;
     }

     .conversation-card {
         min-height: 230px;
         padding: 20px 15px;
     }

     .conversation-card h3 {
         font-size: 19px;
     }

     .conversation-card p {
         font-size: 15px;
     }

     /* ===explore business== */
     .explore-icon {
         height: 180px;
     }

     .explore-card h3 {
         font-size: 21px;
     }

     /* === evaluate== */
     .quote {
         padding: 25px;
     }

     .quote p {
         font-size: 20px;
     }

    
 }

 @media (max-width: 480px) {

     /* ===how it works== */
     .five-grid {
         gap: 15px;
     }

     .conversation-card {
         padding: 22px 15px;
         border-radius: 6px;
     }

     .conversation-icon-box {
         width: 70px;
         height: 70px;
         border-width: 5px;
     }

     .conversation-icon img {
         width: 35px;
         height: 35px;
     }

     .conversation-step {
         width: 26px;
         height: 26px;
         top: -10px;
         left: -10px;
         font-size: 11px;
     }

     .conversation-card h3 {
         font-size: 18px;
     }

     .conversation-card p {
         font-size: 14px;
     }
 }