/* ==========================================================================
   Sohail Waqas Travel — Complete Responsive CSS
   Covers all breakpoints: 1200px, 992px, 768px, 480px, 375px
   ========================================================================== */

/* --- Desktop-only utility --- */
@media (max-width: 767px) {
  .desktop-only {
    display: none !important;
  }
}

/* ==========================================================================
   Large tablets / small laptops (max 1200px)
   ========================================================================== */
@media (max-width: 1200px) {
  .swt-container {
    padding-inline: 1.25rem;
  }
  .swt-futuristic-hero {
    min-height: 600px;
  }
  .swt-hero-mini-cards {
    gap: 0.85rem;
  }
}

/* ==========================================================================
   Tablets (max 991px) — hide desktop nav, show hamburger
   ========================================================================== */
@media (max-width: 991px) {

  /* ---- Topbar ---- */
  .swt-topbar {
    font-size: 0.78rem !important;
    padding-block: 0.4rem !important;
  }
  .swt-topbar-inner {
    display: flex !important;
    flex-direction: row !important;
    justify-content: space-between !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    gap: 0.5rem !important;
    overflow: hidden;
  }
  .swt-topbar-contacts {
    display: flex !important;
    align-items: center !important;
    gap: 0.65rem !important;
    font-size: 0.76rem !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    flex-shrink: 1;
  }
  .swt-license-tag {
    font-size: 0.71rem !important;
    white-space: nowrap !important;
    flex-shrink: 0;
  }

  /* ---- Header ---- */
  .swt-header-inner {
    height: 70px !important;
    gap: 0.75rem;
  }
  .swt-header-logo-img {
    max-height: 44px !important;
    height: 44px !important;
  }
  .swt-logo-title {
    font-size: 1.15rem !important;
  }
  .swt-logo-tagline {
    font-size: 0.65rem !important;
  }

  /* ---- Hero ---- */
  .swt-futuristic-hero {
    min-height: 520px;
    padding: 4rem 0 3rem !important;
  }
  .swt-hero-title {
    font-size: clamp(1.9rem, 3.8vw, 2.8rem) !important;
  }
  .swt-hero-subtitle {
    font-size: 1rem !important;
    max-width: 580px !important;
  }

  /* ---- General grid stacking ---- */
  .swt-split-grid {
    grid-template-columns: 1fr !important;
    gap: 2rem !important;
  }

  /* ---- Booking widget ---- */
  .swt-booking-form-grid {
    grid-template-columns: 1fr 1fr !important;
    gap: 0.75rem !important;
  }
}

/* ==========================================================================
   Mobile landscape / large phones (max 768px)
   ========================================================================== */
@media (max-width: 768px) {

  /* ---- Topbar ---- */
  .swt-topbar-contacts .swt-topbar-item:last-child {
    display: none !important;
  }

  /* ---- Header ---- */
  .swt-header-inner {
    height: 62px !important;
  }
  .swt-header-logo-img {
    max-height: 38px !important;
    height: 38px !important;
  }
  .swt-logo-title {
    font-size: 1rem !important;
  }
  .swt-logo-tagline {
    display: none !important;
  }
  .swt-header-actions .swt-btn-whatsapp {
    padding: 0.45rem 0.85rem !important;
    font-size: 0.8rem !important;
    border-radius: 30px !important;
  }
  .swt-header-actions .swt-btn-whatsapp svg {
    width: 16px !important;
    height: 16px !important;
  }

  /* ---- Hero ---- */
  .swt-futuristic-hero {
    min-height: 440px;
    padding: 3rem 0 2.5rem !important;
  }
  .swt-hero-title {
    font-size: 1.85rem !important;
  }
  .swt-hero-subtitle {
    font-size: 0.95rem !important;
    padding-inline: 1rem;
  }
  .swt-hero-cta-group {
    gap: 0.65rem !important;
    flex-direction: column !important;
    align-items: center !important;
  }
  .swt-hero-cta-group .swt-btn {
    width: 100% !important;
    max-width: 320px !important;
    justify-content: center !important;
  }
  .swt-hero-quick-pills {
    gap: 0.5rem !important;
  }
  .swt-hero-mini-cards {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 0.75rem !important;
  }

  /* ---- Sections ---- */
  .swt-section {
    padding-block: 3rem !important;
  }
  .swt-section-header {
    margin-bottom: 2.5rem;
  }
  .swt-section-header h2 {
    font-size: 1.65rem !important;
  }

  /* ---- Service / Content Cards ---- */
  .swt-cards-grid,
  .swt-archive-grid,
  .swt-services-grid {
    grid-template-columns: 1fr 1fr !important;
    gap: 1rem !important;
  }

  /* ---- Gallery ---- */
  .swt-gallery-tiles-grid,
  .swt-gallery-grid {
    grid-template-columns: 1fr 1fr !important;
    gap: 1rem !important;
  }
  .swt-gallery-tile {
    height: 240px !important;
  }

  /* ---- Lightbox Modal (full-screen on mobile) ---- */
  #swt-gallery-modal {
    padding: 0 !important;
    align-items: flex-end !important;
  }
  #swt-gallery-modal > div {
    grid-template-columns: 1fr !important;
    max-width: 100% !important;
    max-height: 95vh !important;
    border-radius: 20px 20px 0 0 !important;
    overflow-y: auto !important;
  }
  #swt-gallery-modal > div > div:first-child {
    min-height: 240px !important;
    max-height: 260px !important;
  }
  #swt-gallery-modal img {
    max-height: 260px !important;
    object-fit: cover !important;
  }

  /* ---- About / Contact / Legal page grids ---- */
  .swt-about-grid,
  .swt-offices-grid,
  .swt-team-grid,
  .swt-stats-grid {
    grid-template-columns: 1fr 1fr !important;
    gap: 1rem !important;
  }

  /* ---- Fare / Package tables ---- */
  .swt-fare-matrix,
  .swt-doc-matrix {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }
  .swt-fare-matrix table,
  .swt-doc-matrix table {
    min-width: 500px !important;
  }

  /* ---- Filter Buttons Bar ---- */
  .swt-gallery-filter-btn {
    padding: 0.5rem 0.85rem !important;
    font-size: 0.82rem !important;
  }

  /* ---- Booking form ---- */
  .swt-booking-form-grid {
    grid-template-columns: 1fr !important;
    gap: 0.65rem !important;
  }
  .swt-search-btn {
    width: 100% !important;
  }

  /* ---- Footer ---- */
  .swt-footer-grid {
    grid-template-columns: 1fr 1fr !important;
    gap: 1.5rem !important;
  }
}

/* ==========================================================================
   Small mobile phones (max 480px)
   ========================================================================== */
@media (max-width: 480px) {

  html, body {
    overflow-x: hidden !important;
  }

  /* ---- Topbar — single line ---- */
  .swt-topbar {
    font-size: 0.72rem !important;
  }
  .swt-topbar-contacts {
    gap: 0.4rem !important;
  }
  .swt-license-tag {
    font-size: 0.68rem !important;
  }

  /* ---- Header ---- */
  .swt-container {
    padding-inline: 0.85rem !important;
  }
  .swt-header-inner {
    height: 58px !important;
  }
  .swt-logo-mark {
    width: 36px !important;
    height: 36px !important;
  }
  .swt-logo-title {
    font-size: 0.95rem !important;
  }
  .swt-logo-wrapper {
    gap: 0.5rem !important;
  }

  /* ---- Hero ---- */
  .swt-futuristic-hero {
    min-height: 400px;
    padding: 2.5rem 0 2rem !important;
  }
  .swt-hero-title {
    font-size: 1.6rem !important;
    padding-inline: 0.5rem;
  }
  .swt-hero-subtitle {
    font-size: 0.88rem !important;
    padding-inline: 0.75rem;
  }
  .swt-live-status-pill {
    font-size: 0.75rem !important;
    padding: 0.35rem 0.85rem !important;
  }
  .swt-hero-mini-cards {
    grid-template-columns: 1fr 1fr !important;
    gap: 0.6rem !important;
  }

  /* ---- Sections ---- */
  .swt-section {
    padding-block: 2.5rem !important;
  }
  .swt-section-header h2 {
    font-size: 1.45rem !important;
  }
  .swt-section-header p {
    font-size: 0.92rem !important;
  }

  /* ---- Cards — full-width single column ---- */
  .swt-cards-grid,
  .swt-archive-grid,
  .swt-services-grid {
    grid-template-columns: 1fr !important;
    gap: 1rem !important;
  }
  .swt-card {
    border-radius: 16px !important;
  }

  /* ---- Gallery — single column ---- */
  .swt-gallery-tiles-grid,
  .swt-gallery-grid {
    grid-template-columns: 1fr !important;
    gap: 1rem !important;
  }
  .swt-gallery-tile {
    height: 260px !important;
  }

  /* ---- Stats / About grids — 2-col ---- */
  .swt-stats-grid,
  .swt-offices-grid,
  .swt-about-grid,
  .swt-team-grid {
    grid-template-columns: 1fr 1fr !important;
  }

  /* ---- Footer — single column ---- */
  .swt-footer-grid {
    grid-template-columns: 1fr !important;
    gap: 1.25rem !important;
  }
}

/* ==========================================================================
   Extra-small phones (max 375px — iPhone SE)
   ========================================================================== */
@media (max-width: 375px) {

  .swt-hero-title {
    font-size: 1.45rem !important;
  }
  .swt-hero-subtitle {
    font-size: 0.84rem !important;
  }
  .swt-hero-mini-cards {
    grid-template-columns: 1fr !important;
  }
  .swt-stats-grid,
  .swt-about-grid,
  .swt-offices-grid {
    grid-template-columns: 1fr !important;
  }
  .swt-header-inner {
    height: 54px !important;
  }
  .swt-topbar {
    font-size: 0.68rem !important;
  }
}