/* ============================================================
   Vista Travel Consultancy Ltd - Responsive rules
   Mobile first adjustments layered over style.css
   ============================================================ */

@media (max-width: 1080px) {
  .counters-grid { grid-template-columns: repeat(2, 1fr); }
  .cards-grid { grid-template-columns: repeat(2, 1fr); }
  .process-grid { grid-template-columns: repeat(3, 1fr); }
  .package-grid { grid-template-columns: repeat(2, 1fr); }
  .value-grid { grid-template-columns: repeat(2, 1fr); }
  .filter-panel { grid-template-columns: repeat(2, 1fr); }
  .footer-grid { grid-template-columns: 1fr 1fr; }
  .split { grid-template-columns: 1fr; gap: 30px; }
  .split-media { min-height: 240px; order: -1; }
  .ceo-block { grid-template-columns: 280px 1fr; gap: 30px; }
}

@media (max-width: 900px) {
  /* Mobile navigation */
  .nav-toggle { display: flex; }
  .main-nav {
    position: fixed; top: 0; right: 0; bottom: 0;
    width: min(340px, 88vw);
    background: var(--white);
    flex-direction: column; align-items: stretch;
    padding: 84px 22px 30px;
    transform: translateX(100%);
    transition: transform 0.25s ease;
    box-shadow: -12px 0 40px rgba(11, 53, 88, 0.2);
    overflow-y: auto; z-index: 250;
  }
  .main-nav.is-open { transform: translateX(0); }
  .nav-list { flex-direction: column; align-items: stretch; gap: 2px; }
  .nav-list > li > a, .nav-drop-btn {
    padding: 13px 12px; font-size: 1rem; width: 100%; text-align: left;
  }
  .dropdown {
    position: static; display: none; box-shadow: none;
    border: 0; border-left: 2px solid var(--line);
    border-radius: 0; margin: 0 0 6px 14px; padding: 0 0 0 6px;
  }
  .has-dropdown[data-open="true"] .dropdown { display: block; }
  .nav-actions { flex-direction: column; margin-top: 18px; gap: 10px; }
  .nav-actions .btn { width: 100%; }
  body.nav-open { overflow: hidden; }

  .top-email { display: none; }
  .top-offices { display: none; }

  .ceo-block { grid-template-columns: 1fr; }
  .ceo-photo-frame { max-width: 320px; margin: 0 auto; }
  .cta-band-inner { flex-direction: column; align-items: flex-start; }
}

@media (max-width: 680px) {
  .section { padding: 52px 0; }
  .hero-inner { padding: 64px 20px 78px; }
  .hero-actions .btn { width: 100%; }
  .cards-grid { grid-template-columns: 1fr; }
  .counters-grid { grid-template-columns: repeat(2, 1fr); gap: 12px; }
  .counter-card { padding: 18px 12px; }
  .process-grid { grid-template-columns: 1fr; }
  .package-grid { grid-template-columns: 1fr; }
  .features-grid { grid-template-columns: 1fr; }
  .value-grid { grid-template-columns: 1fr; }
  .office-grid { grid-template-columns: 1fr; }
  .filter-panel { grid-template-columns: 1fr; }
  .form-grid { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1fr; gap: 30px; padding-top: 44px; }
  .footer-bottom-inner { flex-direction: column; align-items: flex-start; }
  .brand-logo { width: 74px; height: 74px; }

  /* Show sticky enquiry button on service pages for mobile */
  .sticky-enquire { display: block; }
  .wa-float { right: 14px; bottom: 14px; }
  .wa-float-label { display: none; }
  .wa-float-btn { padding: 14px; border-radius: 50%; }
  .sticky-enquire { left: 14px; bottom: 14px; }
  .sticky-enquire .btn { padding: 12px 18px; font-size: 0.86rem; }

  .popup-card { max-height: 94vh; border-radius: 12px; }
  .popup-body { padding: 0 16px 22px; }
  .popup-head { padding: 0 16px 6px; }
  .cookie-banner { left: 10px; right: 10px; bottom: 10px; }
  .cookie-actions .btn { width: 100%; }
}

@media (max-width: 380px) {
  .counters-grid { grid-template-columns: 1fr; }
  .top-bar-contacts { gap: 8px; font-size: 0.76rem; }
}
