/* ==========================================================================
   Skyport Villas — responsive overrides (mobile-first base lives in style.css)
   ========================================================================== */

/* Large desktops */
@media (min-width: 1400px) {
  .container { max-width: 1240px; }
}

/* Tablets and below */
@media (max-width: 991.98px) {
  :root { --nav-h: 68px; }

  .site-nav .navbar-collapse {
    background: rgba(255, 255, 255, 0.97);
    backdrop-filter: blur(14px);
    border-radius: 18px;
    margin-top: 0.75rem;
    padding: 0.75rem 1rem;
    box-shadow: 0 18px 40px rgba(15, 23, 42, 0.14);
  }
  .site-nav .navbar-collapse .nav-link { color: var(--text); }
  .site-nav .navbar-collapse .nav-link.active { color: var(--deep-blue); }
  .site-nav .navbar-collapse .btn { margin-top: 0.5rem; }

  .masonry { column-count: 2; }
  .stat-row { gap: 1.75rem; }
  .map-embed iframe { height: 240px; }
  .frame-image { margin-bottom: 0.5rem; }
}

/* Small tablets / large phones */
@media (max-width: 767.98px) {
  .section { padding: 3.75rem 0; }
  .hero { min-height: 92svh; padding: 6rem 0 5rem; }
  .hero-title { letter-spacing: 0.04em; }
  .hero-actions .btn { width: 100%; max-width: 320px; }
  .villa-specs { grid-template-columns: 1fr; }
  .footer-bottom { flex-direction: column; text-align: center; }
  .footer-text { max-width: none; }
  .social-list { justify-content: flex-start; }
  .lightbox { padding: 4.5rem 0.75rem; }
  .lightbox-nav { margin: 0 0.35rem; width: 42px; height: 42px; }
}

/* Phones */
@media (max-width: 575.98px) {
  body { font-size: 0.96rem; }
  .masonry { column-count: 1; }
  .section-head { margin-bottom: 2.25rem; }
  .glass-card { border-radius: 20px; }
  .amenity-card { padding: 1.5rem 1rem; }
  .amenity-card i { width: 54px; height: 54px; font-size: 1.35rem; }
  .contact-list li { gap: 0.75rem; }
  .whatsapp-float, .back-to-top { width: 46px; height: 46px; font-size: 1.15rem; right: 0.9rem; }
  .whatsapp-float { bottom: 4.75rem; }
  .stat .counter { font-size: 1.8rem; }
}

/* Landscape phones: keep the hero readable */
@media (max-height: 520px) and (orientation: landscape) {
  .hero { min-height: 620px; }
  .scroll-indicator { display: none; }
}

/* Print */
@media print {
  .site-nav, .scroll-indicator, .whatsapp-float, .back-to-top, .lightbox, .map-embed { display: none !important; }
  body { background: #fff; color: #000; }
  .reveal { opacity: 1 !important; transform: none !important; }
}