/* =============================================================
   RESPONSIVE STYLES
   Merged & ordered: largest breakpoint → smallest
   ============================================================= */


/* ── min-width: 1140px–1339px (wide desktop range) ── */
@media only screen and (min-width:1140px) and (max-width:1339px){
  .pkg-trust-bar{padding-top:40px;}
}


/* ── min-width: 769px–1023px (tablet landscape range) ── */
@media only screen and (min-width:769px) and (max-width:1023px){
  .global-cta{display:none;}
  .left-panel{max-height:400px;}
}


/* ── min-width: 900px (desktop+) ── */
@media(min-width:900px){
  .svc2-track{padding:4px 0 16px;}
  .svc2-swipe-hint{display:none;}
}


/* ── min-width: 821px (desktop+) ── */
@media(min-width:821px){
  .right-panel{max-height:680px}
  .panel-content{overflow-y:auto}
}


/* ── min-width: 769px (desktop+) ── */
@media(min-width:769px){
  .nav-logo-compact{margin-right:14px;}
}


/* ── min-width: 768px (desktop+) ── */
@media(min-width:768px){
  .pkg-card{
    flex-direction:row;
    align-items:stretch;
  }
  .pkg-card-img-wrap{
    width:320px;
    height:auto;
    flex-shrink:0;
  }
  .pkg-card-body{flex:1;}
}


/* ── max-width: 1024px (tablet and below) ── */
@media(max-width:1024px){
  /* pkg grid */
  .pkg-track{grid-template-columns:repeat(2,1fr)}

  /* pkg list */
  .pkl-thumb{width:160px;}
  .pkl-thumb-custom{width:160px;}
  .pkl-cta-col{width:140px;}
  .pkl-btn-expand{font-size:0.75rem;}
}


/* ── max-width: 900px (tablet and below) ── */
@media(max-width:900px){
  /* success stories */
  .ss-header-right{display:none;}
  .ss-scroll-hint-top{display:block;}
  .ss-title{font-size:1.6rem;}

  /* agra full section */
  .agra-full-section{padding:56px 0 48px}
  .agra-full-title{font-size:1.9rem}
  .agra-hero-banner{height:280px}
  .agra-hero-banner-left h2{font-size:1.4rem}
  .agra-pkg-card{flex:0 0 82vw;max-width:300px}
  .agra-exp-card{flex:0 0 76vw;max-width:270px}
  .agra-bottom-cta{flex-direction:column;align-items:flex-start}

  /* footer */
  .footer-grid{grid-template-columns:1fr 1fr;gap:28px}
  .footer-col-brand{grid-column:1/-1}
  .footer-trust-pills{flex-direction:row}
}


/* ── max-width: 820px (mobile/tablet) ── */
@media(max-width:820px){
  /* global cta bar */
  .global-cta{display:grid}
  .cta-bar{display:none}

  /* hero */
  .site-hero{border-radius:0 0 36px 36px;min-height:auto}
  .hero-why-outer{margin-top:0}
  .site-hero-inner{
    grid-template-columns:1fr;gap:24px;
    padding:60px 16px 36px;
  }
  .hero-btns{padding:14px 16px;width:100%}
  .hero-btn{flex:1;justify-content:center;padding:13px 14px;font-size:0.8rem}
  .hero-stat-card{max-width:100%;width:100%}
  .hero-why-wrap{padding-bottom:36px}
  .hero-why-header{padding:20px 16px 12px}
  .hero-why-track{
    display:flex;
    flex-direction:row;
    gap:10px;
    padding:0 16px 4px;
    overflow-x:auto;
    scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
  }
  .hero-why-track::-webkit-scrollbar{display:none}
  .hwc{
    flex:0 0 calc(50% - 5px);
    scroll-snap-align:start;
    min-width:0;
  }
  .hero-why-dots{
    display:flex;justify-content:center;gap:6px;
    margin-top:14px;padding-bottom:4px;
  }
  .hwd{
    width:20px;height:4px;border-radius:4px;
    background:rgba(255,255,255,0.22);
    cursor:pointer;transition:background 0.2s,width 0.2s;
  }
  .hwd.active{background:#4ade80;width:32px}

  /* main layout */
  .wus-modal{max-height:80vh}
  .page-wrap{padding:0 10px 90px}
  .ph-title{font-size:1.5rem}
  .ph-cta{display:none}
  .main-card{
    grid-template-columns:1fr;
    grid-template-rows:auto 1fr;
    overflow:clip;
  }
  .left-panel{min-height:0;max-height:210px;height:auto}
  .left-stats{grid-template-columns:repeat(4,1fr);gap:4px}
  .lst .lv{font-size:0.9rem}
  .lst .ll{font-size:0.55rem}
  .left-cta-row{display:none}
  .right-panel{max-height:none;height:auto;overflow:clip}
  .panel-content{overflow-y:visible;max-height:none;scroll-padding-top:0}
  .panel-tabs{position:sticky;top:48px;z-index:100}
  .place-tags-wrap{top:88px}
  html{scroll-padding-top:103px}

  /* agra highlights */
  .agra-highlights{grid-template-columns:1fr 1fr}
  .agra-hl:nth-child(2){border-right:none}
  .agra-hl:nth-child(3){border-right:1px solid var(--border)}
  .agra-hl:nth-child(3),.agra-hl:nth-child(4){border-top:1px solid var(--border)}
  .agra-hero-content{flex-direction:column;align-items:flex-start}
  .agra-hero-right{flex-direction:row}
  .agra-cta-btn{min-width:0;flex:1}
  .agra-notify{flex-direction:column;align-items:flex-start}
  .agra-notify-input{min-width:0;width:100%}
  .agra-notify-form{width:100%}
  .agra-notify-btn{flex:1}

  /* pkg section */
  .pkg-section{padding:40px 0 80px}
  .pkg-header{padding:0 16px}
  .pkg-track{
    display:flex;
    gap:12px;
    overflow-x:auto;
    scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
    padding:0 16px 8px;
  }
  .pkg-track::-webkit-scrollbar{display:none}
  .pkg-card{
    flex:0 0 82vw;
    max-width:320px;
    scroll-snap-align:start;
  }
  .pkg-scroll-hint{display:flex}
  .pke-places{flex-wrap:nowrap;overflow-x:auto}
  .pke-cta-row{grid-template-columns:1fr 1fr}
  .pkg-compare-bar{margin:28px 16px 0}
  .pkg-row-label{display:none}
}


/* ── max-width: 768px (mobile) ── */
@media(max-width:768px){
  /* nav — single row: [logo left] [scrollable tabs center] [hamburger right] */
  .nav-cta-desktop{display:none;}
  .nav-menu-btn{display:flex;}
  .nav-tabs-desktop{display:flex;}
  .nav-tabs-desktop .nav-tab{font-size:0.67rem;padding:5px 9px;}

  /* pkg scroll hint */
  .pkg-scroll-hint{display:flex;}

  /* experiences */
  .exp-section{padding:56px 0 40px;}
  .exp-scroll-hint{display:flex;}
  .exp-card{flex:0 0 78vw;min-width:240px;}
  .exp-card-img{height:160px;}
  .exp-bottom-cta{padding:16px 18px;}

  /* pkg list — horizontal scroll */
  .pkg-list{
    flex-direction:row;
    overflow-x:auto;
    scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
    gap:12px;
    padding-bottom:8px;
  }
  .pkg-list::-webkit-scrollbar{display:none;}
  .pkl-item{
    flex:0 0 82vw;
    max-width:340px;
    min-width:280px;
    scroll-snap-align:start;
    border-radius:16px;
  }
  .pkl-row{
    flex-direction:column;
    min-height:auto;
  }
  .pkl-thumb{
    width:100%;
    height:150px;
    border-radius:0;
  }
  .pkl-thumb-custom{
    width:100%;
    height:130px;
  }
  .pkl-body{
    border-left:none;
    border-right:none;
    border-top:1px solid var(--border);
    padding:12px 14px 10px;
  }
  .pkl-name{font-size:0.9rem;}
  .pkl-places-row{
    flex-wrap:nowrap;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
    padding-bottom:2px;
  }
  .pkl-places-row::-webkit-scrollbar{display:none;}
  .pkl-place-chip{font-size:0.6rem;padding:2px 7px 2px 3px;}
  .pkl-place-chip img{width:18px;height:18px;}
  .pkl-cta-col{
    width:100%;
    border-left:none;
    border-top:1px solid var(--green-border);
    min-height:auto;
    padding:10px 12px;
    align-items:stretch;
  }
  .pkl-btn-expand{
    width:100%;
    min-height:48px;
    height:auto;
    border-radius:10px;
    font-size:0.76rem;
    padding:12px 10px;
    flex-direction:row;
    gap:6px;
  }
}


/* ── max-width: 767px (mobile, pkg card) ── */
@media(max-width:767px){
  .pkg-card-img-wrap{height:200px;}
  .pkg-card-body{padding:18px 18px 22px;}
  .pkg-title{font-size:18px;}
  .pkg-cta-bar{gap:8px;}
  .pkg-btn{font-size:12px;padding:9px 20px;}
  .pkg-trust-item{font-size:11px;padding:12px 8px;}
  .left-panel{max-height: 330px;}
  .main-card{display: block;}
  .fleetbox{margin-bottom: 15px;}
}


/* ── max-width: 640px (small mobile) ── */
@media(max-width:640px){
  /* success stories */
  .ss-section{padding:56px 0 40px;}
  .ss-card{flex:0 0 86vw;min-width:270px;}
  .ss-header{margin-bottom:24px;}
  .ss-title{font-size:1.4rem;}
  .ss-bottom-bar{padding:16px 18px;}
  .ss-bottom-wa,.ss-bottom-call{padding:10px 16px;font-size:0.74rem;}

  /* agra */
  .agra-full-title{font-size:1.55rem}
  .agra-hero-banner{height:220px;border-radius:16px}
  .agra-hero-banner-content{bottom:16px;left:16px;right:16px}
  .agra-hero-banner-left h2{font-size:1.1rem}
  .agra-hero-banner-left p{display:none}
  .agra-hero-banner-btns{margin-top:10px}
  .agra-pkg-card{flex:0 0 88vw}
  .agra-exp-card{flex:0 0 84vw}
  .agra-full-wrap{padding:0 14px}

  /* svc2 */
  .svc2-card{width:272px;}
  .svc2-card-img-wrap{height:140px;}
  .hero-trust-pill{flex: 0 0 44%;justify-content: center;}
  .hero-trust-row{display:none;flex-wrap: nowrap;overflow-x: scroll;scrollbar-width: none;width: 100%;}
  .hero-why-header{justify-content: center;}
  .desktop-show{display: none;}
  .mobile-show{display:block;}
  .site-hero-inner{padding-bottom: 16px; padding-top: 30px;}
  .hero-why-badge{background: transparent; border: 0;padding: 3px 16px;box-shadow: none;}
  .hero-stat-card.mobile-show{display: flex;        justify-content: space-between;}
  .hsc-num{font-size: 17px;}
  .hsc-lbl{font-size: 10px;}
  .left-panel{height: 360px;}
  .left-title{font-size: 1.45rem;}
  .global-cta{display: none;}
  .ptb-item{margin-bottom: 10px;}
  .pkg-trust-bar{border-top: 0;}
  .in-layer.active{transform: translateX(20%); width: calc(100% - 16%);}
  .layer-close{left:calc(20% - 55px)}
    

}


/* ── max-width: 580px (small mobile, footer) ── */
@media(max-width:580px){
  :root {
    --nav-h: 48px;
  }
  body{padding-top: 48px;}
  .footer-grid{grid-template-columns:1fr}
  .footer-col-brand{grid-column:auto}
  .footer-cta-inner{flex-direction:column;align-items:flex-start}
  .footer-cta-headline{font-size:1.15rem}
  .footer-cta-btns{width:100%}
  .footer-btn{flex:1;justify-content:center}
  .footer-bottom-inner{flex-direction:column;align-items:flex-start;gap:6px}
  .nav-logo-compact img {width: 50px;}
  .nav-tab.nav-active .nt-dot{display: none;}
  .nav-tabs-desktop .nav-tab{padding: 6px 9px 4px;}
  .site-nav{    height: 48px; }
  .nav-menu-btn{width: 30px; height: 30px;}
  .nav-menu-bar{width: 15px;height: 1px;}
  .site-nav-inner{padding: 0px 10px;}
  .nav-tabs{border:0;}
  .hsc-item{padding: 7px 10px;    border-radius: 0; border: 1px solid rgba(255,255,255,0.07);}
  .hsc-item:nth-child(2n){border-right: 1px solid rgba(255, 255, 255, 0.07);}
  .hsc-item:nth-last-child(-n+2),.hsc-item:nth-last-child(-n+2) {border-bottom: 1px solid rgba(255, 255, 255, 0.07);}
  .hero-stat-card::before{display: none;}
  .hero-stat-card{background: transparent;  backdrop-filter: inherit;border: 0; border-radius: 0; box-shadow:none;  display: inline-flex;column-gap: 5px;        justify-content: space-between;}
  .hsc-lbl {font-size: 8px;}
  .fcard-v-img-panel img{    height: 200px;object-fit: cover;}
  .fcard-v-head{flex-wrap: wrap;    gap: 10px;}
  .fcard-v-name{flex: 0 0 60%;}
  .lst .ll {font-size: 7px;}
  .urgency-bar{flex-wrap: wrap; justify-content: flex-start;}
  .urgency-bar span:nth-child(3){margin-left: 0 !important;}
  .rv-badge{font-size: 0.55rem;padding: 1px 7px 3px;}
  .why-stat-num{font-size: 1rem;}
  .pkg-warning{font-size: 0.68rem;}
  .pke-places{scrollbar-width: none;}
  .pke-place{flex: 0 0 68px;}
  .pke-btn{font-size: 0.62rem;}
  .pkg-compare-bar{justify-content: center;}
  .pkg-section {padding: 30px 0 30px;}
  .exp-card-img {height: 250px;}
  .svc2-head-stats span{padding: 5px 7px;}
  .detail-desc{font-size: 0.66rem;}
  .drawer-logo img{width:100px}
  .wmc-btn{width: 100%;}
  .title-fleet h3{font-size: 16px;}
  .fleet-cta{font-size: 13px;padding: 5px 10px;}
  .fleet-message p{font-size: 11px;}
  .driverlist ul li{font-size: 9px;}
  .title-fleet .routekm{font-size: 14px;}
  .fleet-experience{scrollbar-width: none;}
  .package-ctabox ul li a{font-size: 13px;}
  .package-ctabox ul li a{height: 26px; line-height: 26px;}
  .fleet-experience{padding-bottom: 5px;}
  .fcard-v-cta{display: none;}
  .rcard-chips-row{border-bottom: 0;}
  .rcard-expand-btn{padding: 15px 13px;margin-top: 20px;}
  .dcard-expand{padding: 9px 0 39px;}
  .dcard{margin-bottom: 10px;}
  .review-list .engage-cta{display: none;}
  .pkl-cta-col{border-top:0;}
  .hero-btn{padding: 10px 14px;}
  .fleet_list h2{font-size: 30px; margin-bottom: 20px; margin-top: 20px;}
  .package-ctabox.v2{top: 48px;}
  .hero-btns{width: calc(100% - 0px);}
  .heroscroll-btn{display: inline-flex;white-space: nowrap;width: calc(100% - 0%);overflow-x: scroll; scrollbar-width: none;}
  .heroscroll-btn a{margin-right: 6px;}
  .notice-o{display: flex; align-items: center;}
  .notice-o span:nth-child(2){font-size: 9px;}
  .nav-tabs-wrap::after{height: 38px;top: 7px;}
  .site-hero-inner{grid-template-columns: 100%;}
  .ptab{padding: 3px 8px; font-size: 0.69rem;}
  .ptab.active{background: transparent;}
  .tour-head h2{padding-top: 20px;}
  .block-db{display: block !important;}
  .ba-slider-wrap{height: 170px;}
  .floating-cta{display:flex;}
  .footer-bottom-left{flex-wrap: nowrap; width: 100%; text-align: center; justify-content: center;}
  .footer-copy, .footer-made{font-size: 0.67rem;}
  .ss-person{flex: auto;}


}


/* ── max-width: 540px (small mobile, nav) ── */
@media(max-width:540px){
  .nav-brand{font-size:0.72rem;}
  .nav-logo-icon{font-size:0.9rem;}
}


/* ── max-width: 480px (extra small) ── */
@media(max-width:480px){
  /* experiences */
  .exp-card{flex:0 0 86vw;}
  .exp-title{font-size:1.4rem;}

  /* pkg card */
  .pkg-cta-bar{flex-direction: row;column-gap: 10px;}
  .pkg-btn{justify-content:center;}
  /* .pkg-trust-bar{flex-direction:column;} */
  .pkg-trust-item{border-right:none;border-bottom:1px solid var(--border);}
  .pkg-trust-item:last-child{border-bottom:none;}
}


/* ═══════════════════════════════════════════════════════════
   PACKAGE SECTION v2 (#mainCard) — Full Responsive
   Scoped to .pkg-section.v2 to avoid conflicts with old cards
   ═══════════════════════════════════════════════════════════ */

/* ── Desktop ≥1024px ── */
@media(min-width:1024px){
  .pkg-section.v2 .pkg-card{ flex-direction:row; flex:unset; max-width:none; }
  .pkg-section.v2 .pkg-card-img-wrap{ width:340px; height:auto; flex-shrink:0; }
  .pkg-section.v2 .pkg-card-body{ flex:1; }
}

/* ── Tablet 768px–1023px ── */
@media(min-width:768px) and (max-width:1023px){
  .pkg-section.v2 .pkg-inner{ padding:0 16px; }
  .pkg-section.v2 .pkg-card{ flex-direction:row; flex:unset; max-width:none; }
  .pkg-section.v2 .pkg-card-img-wrap{ width:250px; height:auto; flex-shrink:0; }
  .pkg-section.v2 .pkg-card-body{ flex:1; padding:18px 20px 22px; gap:12px; }
  .pkg-section.v2 .pkg-title{ font-size:18px; }
  .pkg-section.v2 .pkg-icons-row{ gap:12px; }
  .pkg-section.v2 .pkg-icon-item{ min-width:44px; }
}

/* ── Mobile ≤767px ── */
@media(max-width:767px){
  .pkg-section.v2{ padding:24px 0 32px; }
  .pkg-section.v2 .pkg-inner{ padding:0 10px; }
  .pkg-section.v2 .pkg-module-box{ border-radius:16px; }
  /* Reset old horizontal-scroll card overrides bleeding from max-820px rule */
  .pkg-section.v2 .pkg-card{
    flex:1 1 auto;
    max-width:100%;
    width:100%;
    scroll-snap-align:none;
    flex-direction:column;
  }
  .pkg-section.v2 .pkg-card-img-wrap{ width:100%; height:200px; flex-shrink:0; }
  .pkg-section.v2 .pkg-card-body{ padding:16px 14px 20px; gap:12px; }
  .pkg-section.v2 .pkg-title{ font-size:18px; line-height:1.3; }
  .pkg-section.v2 .pkg-desc{ font-size:13px; }
  .pkg-section.v2 .pkg-icons-row{ gap:8px; flex-wrap:wrap; justify-content:flex-start; }
  .pkg-section.v2 .pkg-icon-item{ min-width:44px; }
  .pkg-section.v2 .pkg-feat{ font-size:11px; padding:4px 10px; }
  .pkg-section.v2 .pkg-dest-chip{ font-size:11px; padding:4px 10px; }
  /* CTA bar: call + WA side by side, book full width below */
  .pkg-section.v2 .pkg-cta-bar{ flex-wrap:wrap; gap:8px; }
  .pkg-section.v2 .pkg-btn-call,
  .pkg-section.v2 .pkg-btn-wa{ flex:1; min-width:0; justify-content:center; }
  .pkg-section.v2 .pkg-btn-book{ width:100%; flex:0 0 100%; justify-content:center; }
  /* Trust bar: vertical stack */
  .pkg-section.v2 .pkg-trust-bar{ flex-direction:column; border-top:1px solid var(--border); }
  .pkg-section.v2 .pkg-trust-item{ font-size:12px; border-right:none; border-bottom:1px solid var(--border); padding:10px 14px; width:100%; }
  .pkg-section.v2 .pkg-trust-item:last-child{ border-bottom:none; }
}

/* ── Small mobile ≤480px ── */
@media(max-width:480px){
  .pkg-section.v2 .pkg-inner{ padding:0 6px; }
  .pkg-section.v2 .pkg-module-box{ border-radius:12px; }
  .pkg-section.v2 .pkg-card-img-wrap{ height:180px; }
  .pkg-section.v2 .pkg-card-body{ padding:14px 12px 16px; gap:10px; }
  .pkg-section.v2 .pkg-title{ font-size:16px; }
  .pkg-section.v2 .pkg-tab{ font-size:11px; padding:4px 4px; }
  .pkg-section.v2 .pkg-icons-row{ gap:4px; justify-content:space-between; }
  .pkg-section.v2 .pkg-icon-item{ min-width:36px; }
  .pkg-section.v2 .pkg-icon-item span{ font-size:18px; }
  .pkg-section.v2 .pkg-icon-item small{ font-size:9px; }
  .pkg-section.v2 .pkg-time-chip,
  .pkg-section.v2 .pkg-dist-chip{ font-size:9px; padding:3px 7px; }
  .pkg-section.v2 .car-img img{ width:46px; }
  .pkg-section.v2 .pkg-car-toggle{ font-size:13px; padding:10px 12px; }
  .pkg-section.v2 .pkg-car-item{ padding:10px; gap:6px; }
  .pkg-section.v2 .pkg-car-left strong{ font-size:13px; }
  .pkg-section.v2 .pkg-car-left small{ font-size:11px; }
  .pkg-section.v2 .pkg-btn{ font-size:11px; padding:9px 10px; }
}
