/* ============================================================
   RAWDAH TRAVEL — responsive.css
   Breakpoints: 1200 / 1024 / 860 / 768 / 560 / 430
   ============================================================ */

/* ---------- ≤1200px ---------- */
@media (max-width: 1200px) {
  .grid-4 { grid-template-columns: repeat(2, 1fr); }
  .footer-top { grid-template-columns: 1.4fr 1fr 1fr; }
  .footer-col.contact-col { grid-column: 2 / -1; }
}

/* ---------- ≤1024px (tablet landscape) ---------- */
@media (max-width: 1024px) {
  .main-nav, .header-cta .btn, .header-phone { display: none; }
  .burger { display: flex; }
  .header-cta { margin-left: auto; }

  .split, .split.reverse { grid-template-columns: 1fr; gap: 3rem; }
  .split.reverse .split-media { order: -1; }
  .media-stack .ms-over { width: 46%; bottom: -2rem; }

  .feat-row { grid-template-columns: 1fr; gap: 2.6rem; }
  .feat-row.reverse .fr-media { order: -1; }

  .cta-inner { grid-template-columns: 1fr; }
  .cta-actions { flex-direction: row; flex-wrap: wrap; }
  .cta-card { grid-template-columns: 1fr; }

  .booking-layout { grid-template-columns: 1fr; }
  .booking-aside { position: static; grid-template-columns: 1fr 1fr; }

  .grid-3 { grid-template-columns: repeat(2, 1fr); }

  .stats-grid { grid-template-columns: repeat(2, 1fr); }
  .stat-item:nth-child(3)::before { display: none; }

  .footer-top { grid-template-columns: 1fr 1fr; }
  .footer-col.contact-col { grid-column: auto; }
}

/* ---------- ≤860px ---------- */
@media (max-width: 860px) {
  :root { --sec-pad: clamp(3.6rem, 8vw, 5rem); }
  .hero-scroll { display: none; }
  .why-grid { grid-template-columns: 1fr !important; }
}

/* ---------- ≤768px (tablet portrait / large phones) ---------- */
@media (max-width: 768px) {
  .grid-4, .grid-3, .grid-2 { grid-template-columns: 1fr; }
  .dest-grid { grid-template-columns: 1fr !important; }
  .dest-card { aspect-ratio: 16 / 10; }

  .hero-content { padding-bottom: 6rem; }
  .hero h1 { max-width: 100%; }

  .page-hero { min-height: 60vh; }

  .stats-grid { grid-template-columns: repeat(2, 1fr); }
  .stat-item { padding: 1.8rem 1rem; }
  .stat-item:nth-child(2)::before { display: none; }

  .form-grid { grid-template-columns: 1fr; }
  .booking-aside { grid-template-columns: 1fr; }

  .media-stack .ms-main { width: 100%; }
  .media-stack .ms-over { display: none; }
  .badge-since { position: static; display: inline-block; margin-top: 1.2rem; }

  .site-list .sl-desc { display: block; margin-top: 0.2rem; }
  .site-list li { flex-wrap: wrap; gap: 0.7rem; }

  .footer-top { grid-template-columns: 1fr; gap: 2.4rem; }
  .footer-bottom-inner { flex-direction: column; text-align: center; }

  .swiper-button-prev, .swiper-button-next { width: 44px !important; height: 44px !important; bottom: -6px; }
}

/* ---------- ≤560px ---------- */
@media (max-width: 560px) {
  .container, .container-wide { width: calc(100% - 2rem); }

  .brand-sub { display: none; }
  .brand-mark { width: 38px; height: 38px; }
  .brand-name { font-size: 1.05rem; }

  .hero { min-height: 92svh; }
  .hero-ctas .btn { width: 100%; }
  .hero-meta { gap: 0.6rem; font-size: 0.6rem; letter-spacing: 0.22em; }

  .btn { padding: 0.95rem 1.7rem; }
  .btn-sm { padding: 0.72rem 1.2rem; }

  .cta-actions { flex-direction: column; }
  .cta-actions .btn { width: 100%; }

  .form-wrap { padding: 1.4rem 1.1rem; }
  .feat-row .fr-media .fr-float { position: static; margin-top: 1rem; max-width: none; }

  .why-item { grid-template-columns: 1fr; gap: 0.6rem; }
  .why-num { min-width: 0; }

  .route-card .rc-route { font-size: 1.25rem; flex-wrap: wrap; }

  .fs-actions .btn { width: 100%; }
}

/* ---------- ≤430px (mobile) ---------- */
@media (max-width: 430px) {
  .hero h1 { font-size: clamp(2.3rem, 11vw, 3rem); }
  .h2 { font-size: clamp(1.9rem, 8.4vw, 2.4rem); }

  .stats-grid { grid-template-columns: 1fr 1fr; gap: 0; }
  .stat-num { font-size: 2rem; }

  .dest-card h3 { font-size: 1.55rem; }

  .back-top { right: 1rem; bottom: 1rem; width: 42px; height: 42px; }

  .breadcrumb { letter-spacing: 0.16em; }
}

/* ---------- Print ---------- */
@media print {
  .site-header, .preloader, .mobile-nav, .back-top, .scroll-progress, .page-transition,
  .cta-band, .marquee, .hero-slides { display: none !important; }
  body { background: #fff; }
}
