/* =========================================================
   CAB STAR — RESPONSIVE STYLES
   Desktop -> Tablet -> Mobile
   ========================================================= */

/* ===== Tablet (<=991px) ===== */
@media (max-width: 991px){
  .top-center{ display:none; }
  .hero-heading{ font-size: 2.4rem; }
  .hero-tagline{ font-size: 1.05rem; }
  .hero-logo-wrap{ width: 45%; max-width: 260px; }
  .main-nav{ background: var(--white); padding: 14px; border-radius: 12px; margin-top: 10px; box-shadow: var(--shadow); }
  .main-nav .nav-link{ padding: 10px 8px !important; }
  .stat-chip{ padding: 8px 16px; }
  .stat-value{ font-size:.9rem; }
  .step-item h4{ font-size:.92rem; }
  .footer-cta-inner{ justify-content:center; text-align:center; border-radius: 30px; padding: 20px; }
  .booking-form-section{ margin-top: -60px; }
  .booking-tabs{ gap:6px; }
  .tab-item{ font-size:.78rem; padding:10px 8px; }
}

/* ===== Small Tablet (<=767px) ===== */
@media (max-width: 767px){
  .top-bar-inner{ flex-wrap: wrap; justify-content:center; text-align:center; gap:6px; }
  .top-left{ order:1; }
  .top-right{ order:2; }

  .hero-section{ padding: 40px 0 110px; text-align:center; min-height: auto; }
  .hero-heading{ font-size: 2rem; }
  .hero-icons-row{ justify-content:center; }
  .hero-buttons{ justify-content:center; }
  .hero-badge{ margin-left:auto; margin-right:auto; }
  .hero-stats-row{ justify-content:center; }

  .route-hero-section{ padding: 40px 0 110px; text-align:center; }
  .route-hero-section .hero-icons-row{ justify-content:center; }
  .route-hero-section .hero-buttons{ justify-content:center; }
  .route-hero-section .hero-badge{ margin-left:auto; margin-right:auto; }
  .hero-right{ margin-top: 30px; }
  .floating-card{ position:static; display:inline-flex; margin: 8px 6px 0; }
  .card-distance, .card-time{ position:static; }

  .booking-form-section{ margin-top: -80px; }
  .booking-form-card{ padding: 8px 16px 20px; }
  .booking-tabs{ flex-wrap: nowrap; }
  .booking-form .row > div{ margin-bottom: 4px; }

  .section-heading h2{ font-size: 1.5rem; white-space: normal; }
  .section-heading.text-start{ justify-content:center; text-align:center; }

  .vehicle-footer{ flex-direction:column; align-items:flex-start; gap:14px; }
  .vehicle-price{ text-align:left; }

  .step-arrow{ display:none !important; }
  .booking-steps .step-item{ margin-bottom: 20px; }

  .footer-cta-inner{
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 16px 24px;
    border-radius: 26px;
    padding: 18px 20px;
  }
  .footer-cta{ padding: 40px 0; }
  .fc-brand{ order: -1; flex-basis: 100%; justify-content: center; }
  .fc-brand img{ height: 58px; }
  .fc-brand .brand-name{ font-size: 1.5rem; }
  .main-footer{ text-align:center; }

  /* Space for the mobile sticky Call/SMS/Facebook bar (visible below 768px) */
  body{ padding-bottom: 58px; }
  .contact-info-list li{ justify-content:center; }
}

/* ===== Mobile (<=575px) ===== */
@media (max-width: 575px){
  .main-header{ padding: 6px 0; }
  .logo-img{ height: 63px; }
  .brand-text{ display: none; }

  .hero-heading{ font-size: 1.7rem; }
  .hero-tagline{ font-size: .9rem; }
  .hero-logo-wrap{ width: 65%; max-width: 220px; }
  .hero-sub{ font-size: 1rem; }
  .hero-icons-row{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
    justify-content: stretch;
  }
  .hero-icons-row li{ font-size:.68rem; }
  .icon-badge{ width: 32px; height: 32px; font-size:.85rem; }

  .btn-call, .btn-whatsapp{
    padding: 12px 10px;
    font-size: .7rem;
    flex: 1 1 0;
    width: auto;
    gap: 6px;
  }
  .btn-call i, .btn-whatsapp i{ font-size: .85rem; }
  .hero-buttons{ flex-direction:row; flex-wrap:nowrap; gap: 10px; }

  .vehicle-card{ padding: 20px; }

  .why-icon{ width: 68px; height:68px; font-size:1.4rem; }
  .why-choose-section p{ font-size:.78rem; }

  .info-card{ padding: 22px; }

  .step-icon{ width:60px; height:60px; font-size:1.3rem; }
  .step-circle{ width:28px; height:28px; font-size:.8rem; }

  .fc-item span{ display:none; }
  .fc-item{ padding: 6px; gap: 8px; }
  .fc-item i{ width: 36px; height:36px; font-size: 1rem; }
  .footer-cta-inner{ gap: 14px 18px; padding: 16px; }
  .fc-brand img{ height: 44px; }
  .fc-brand .brand-name{ font-size: 1.15rem; }
  .fc-brand .brand-tagline{ font-size: .55rem; letter-spacing: 1px; }

  /* Booking tabs — keep One Way / Round Trip / Local in a single row */
  .booking-tabs{ gap: 4px; padding: 4px; }
  .tab-item{
    flex-direction: column;
    gap: 4px;
    font-size: .62rem;
    padding: 8px 4px;
    white-space: nowrap;
  }
  .tab-item i{ font-size: .8rem; }
}

/* ===== Extra Small Phones (<=400px) — full width single column for icon labels ===== */
@media (max-width: 400px){
  .hero-icons-row{ grid-template-columns: 1fr; }
}

/* ===== About Us Page — Responsive ===== */
@media (max-width: 767px){
  .page-banner{ padding: 70px 0 50px; text-align:center; }
  .page-banner-title{ font-size: 1.9rem; }
  .about-experience-badge{ right: 10px; bottom: -16px; padding: 12px 16px; }
  .ae-number{ font-size: 1.4rem; }
  .about-heading{ font-size: 1.5rem; }
  .stat-box-number{ font-size: 1.6rem; }
}
@media (max-width: 575px){
  .about-experience-badge{ position: static; margin-top: 14px; display:inline-flex; flex-direction:row; gap:10px; align-items:center; border-radius: 14px; }
  .ae-label{ margin-top:0; text-align:left; }
}