/* ==========================================================================
   Hotel Galaxy, Katra — Responsive Rules
   ========================================================================== */

/* ---------- Ultra-wide ---------- */
@media (min-width: 1600px) {
  :root { --container-w: 1440px; }
  .hero-title { font-size: 5rem; }
}

/* ---------- Laptops / small desktops ---------- */
@media (max-width: 1279px) {
  .main-nav ul { gap: 20px; }
  .header-call span { display: none; }
  .attractions-grid { grid-template-columns: repeat(3, 1fr); }
}

/* ---------- Tablets ---------- */
@media (max-width: 1023px) {
  :root { --header-h: 76px; }

  .main-nav {
    position: fixed; top: 0; right: 0; width: min(360px, 82vw); height: 100vh;
    background: #fff; box-shadow: var(--shadow-lg); padding: 110px 32px 40px;
    transform: translateX(100%);
    transition: transform var(--transition-med); z-index: 1050; overflow-y: auto;
  }
  .main-nav.is-open { transform: translateX(0); }
  .main-nav ul { flex-direction: column; gap: 6px; }
  .nav-link { display: block; padding: 14px 4px; color: var(--color-text) !important; border-bottom: 1px solid var(--color-border); }
  .nav-link::after { display: none; }
  .hamburger { display: flex; }
  .header-call { display: none; }

  .about-grid { grid-template-columns: 1fr; }
  .about-media { margin-bottom: 60px; }
  .about-media-float { width: 50%; }

  .why-grid { grid-template-columns: repeat(3, 1fr); }
  .room-grid { grid-template-columns: 1fr; }
  .amenities-grid { grid-template-columns: repeat(3, 1fr); }
  .dining-grid { grid-template-columns: 1fr; }
  .dining-visual { order: -1; max-width: 320px; margin-inline: auto; }
  .gallery-grid { grid-template-columns: repeat(3, 1fr); }
  .attractions-grid { grid-template-columns: repeat(2, 1fr); }
  .policy-grid { grid-template-columns: repeat(2, 1fr); }
  .contact-grid { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1fr 1fr; }
}

/* ---------- Mobile landscape / large phones ---------- */
@media (max-width: 767px) {
  .section { padding: 80px 0; }
  .header-actions { gap: 10px; }
  .header-actions .btn-gold { display: none; }
  .logo-text small { display: none; }
  .stats-grid { grid-template-columns: repeat(2, 1fr); gap: 32px; }
  .why-grid { grid-template-columns: repeat(2, 1fr); }
  .amenities-grid { grid-template-columns: repeat(2, 1fr); }
  .attractions-grid { grid-template-columns: 1fr; }
  .policy-grid { grid-template-columns: 1fr; }
  .gallery-grid { grid-template-columns: repeat(2, 1fr); gap: 12px; }
  .gallery-filters { justify-content: flex-start; overflow-x: auto; flex-wrap: nowrap; padding-bottom: 6px; }
  .filter-btn { flex-shrink: 0; }
  .footer-grid { grid-template-columns: 1fr; gap: 32px; }
  .cursor-dot, .cursor-ring { display: none; }
  .hero-actions { flex-direction: column; width: 100%; max-width: 320px; margin-inline: auto; }
  .hero-actions .btn { width: 100%; }
  .floating-cta { bottom: 18px; right: 16px; }
  .back-to-top { bottom: 18px; left: 16px; width: 42px; height: 42px; }
}

/* ---------- Small phones ---------- */
@media (max-width: 480px) {
  .container { padding-inline: 18px; }
  .stats-grid { grid-template-columns: repeat(2, 1fr); gap: 24px; }
  .hero-badges { gap: 8px; }
  .badge { font-size: 0.72rem; padding: 7px 12px; }
  .logo-text small { display: none; }
  .about-media-float { position: static; width: 100%; margin-top: 16px; border-width: 0; }
  .room-amenities { grid-template-columns: 1fr; }
  .room-plans { flex-direction: column; }
  .compare-table th, .compare-table td { padding: 12px 14px; font-size: 0.82rem; }
  .contact-form { padding: 28px 22px; }
  .testimonial-card { padding: 28px 22px; }
}

/* ---------- Foldables / narrow tall screens ---------- */
@media (max-width: 400px) {
  .hero-title { font-size: 2rem; }
  .gallery-grid { grid-template-columns: 1fr; }
}

/* ---------- Landscape phones (short height) ---------- */
@media (max-height: 480px) and (orientation: landscape) {
  .hero { height: auto; min-height: 100vh; padding-block: 100px 60px; }
  .loader-monogram { width: 64px; height: 64px; line-height: 60px; font-size: 2.2rem; }
}

/* ---------- Print ---------- */
@media print {
  .site-header, .floating-cta, .back-to-top, .lightbox, .loader, .scroll-progress, .cursor-dot, .cursor-ring { display: none !important; }
  .hero { height: auto; }
}