/* ============================================
   PMG CAMPING — RESPONSIVE BREAKPOINTS
   ============================================ */

/* ─── Tablet: ≤ 1024px ─── */
@media (max-width: 1024px) {
  .grid-4 { grid-template-columns: repeat(2, 1fr); }
  .grid-3 { grid-template-columns: repeat(2, 1fr); }
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 36px; }
  .stats-grid  { grid-template-columns: repeat(2, 1fr); }
  .gallery-grid {
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: auto;
  }
  .gallery-item.featured { grid-column: span 2; grid-row: span 1; }
  .gallery-grid .gallery-item { height: 200px; }

  .hero-bg { background-attachment: scroll; }
}

/* ─── Phablet: ≤ 768px ─── */
@media (max-width: 768px) {
  :root { --nav-h: 64px; }

  /* Nav */
  .nav-links { display: none; }
  .nav-hamburger { display: flex; }

  /* Grids */
  .grid-3 { grid-template-columns: 1fr; }
  .grid-2 { grid-template-columns: 1fr; }
  .grid-4 { grid-template-columns: repeat(2, 1fr); gap: 16px; }

  /* Hero */
  .hero-sub { max-width: 100%; }
  .hero-btns { flex-direction: column; align-items: flex-start; }
  .hero-btns .btn { width: 100%; justify-content: center; max-width: 320px; }

  /* Gallery */
  .gallery-grid {
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: auto;
  }
  .gallery-item.featured { grid-column: span 2; }
  .gallery-grid .gallery-item { height: 180px; }

  /* Stats */
  .stats-grid { grid-template-columns: repeat(2, 1fr); }

  /* Footer */
  .footer-grid { grid-template-columns: 1fr; gap: 32px; }
  .footer-bottom { flex-direction: column; text-align: center; }

  /* Pricing */
  .pricing-grid { grid-template-columns: 1fr !important; max-width: 420px; margin: 0 auto; }

  /* Buttons */
  .btn-lg { padding: 16px 32px; }

  /* Page header */
  .page-header { padding: 120px 0 60px; }

  /* Countdown */
  .countdown { gap: 12px; }
  .countdown-unit { min-width: 55px; }

  /* Modal */
  .modal-body { padding: 24px; }
  .modal-img  { height: 200px; }

  /* Events grid */
  .events-grid { grid-template-columns: 1fr !important; }

  /* Trek cards */
  .trek-grid { grid-template-columns: 1fr !important; }

  /* Lightbox nav */
  .lightbox-nav.prev { left: 8px; }
  .lightbox-nav.next { right: 8px; }

  /* Contact */
  .contact-grid { grid-template-columns: 1fr !important; }

  /* WhatsApp + BackTop */
  .whatsapp-float { bottom: 20px; right: 16px; }
  .back-top       { bottom: 84px; right: 16px; }
}

/* ─── Mobile: ≤ 480px ─── */
@media (max-width: 480px) {
  .grid-4 { grid-template-columns: 1fr; }

  .gallery-grid {
    grid-template-columns: 1fr 1fr;
  }
  .gallery-grid .gallery-item { height: 140px; }
  .gallery-item.featured { grid-column: span 2; height: 180px; }

  .hero-eyebrow { flex-direction: column; align-items: flex-start; gap: 6px; }

  .btn { padding: 13px 24px; font-size: 0.88rem; }
  .btn-lg { padding: 15px 28px; font-size: 0.95rem; }

  .section { padding: clamp(48px, 8vw, 60px) 0; }

  .testimonial-card { padding: 24px; }
  .pricing-card { padding: 28px 24px; }

  .countdown { justify-content: center; }

  .stats-grid { grid-template-columns: repeat(2, 1fr); gap: 16px; }

  .map-container { height: 280px; }

  /* Tab filters */
  .filter-tabs { flex-wrap: wrap; gap: 8px; }
  .filter-tab  { font-size: 0.8rem; padding: 8px 16px; }

  /* Trek card expand */
  .trek-card-body { padding: 20px; }
}

/* ─── Page-specific overrides ─── */

/* Trekking page */
.trek-filter-row {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  justify-content: center;
  margin-bottom: 48px;
}

/* Masonry gallery */
@media (max-width: 768px) {
  .masonry-grid {
    columns: 2 !important;
    gap: 10px !important;
  }
}
@media (max-width: 480px) {
  .masonry-grid {
    columns: 1 !important;
  }
}

/* Overlanding */
@media (max-width: 768px) {
  .overlanding-features { grid-template-columns: 1fr !important; }
  .overlanding-routes   { grid-template-columns: 1fr !important; }
}

/* About team */
@media (max-width: 768px) {
  .team-grid { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 480px) {
  .team-grid { grid-template-columns: 1fr !important; }
}

/* Events */
@media (max-width: 640px) {
  .featured-event-inner { flex-direction: column !important; }
  .featured-event-img   { width: 100% !important; height: 240px; }
}

/* Seasonal timeline */
@media (max-width: 768px) {
  .seasonal-grid { grid-template-columns: 1fr !important; }
}

/* Camping amenities */
@media (max-width: 768px) {
  .amenities-grid { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 480px) {
  .amenities-grid { grid-template-columns: 1fr !important; }
}