/* ==========================================================================
   OAKWILL REALTY HOMES — RESPONSIVE STYLESHEET
   Breakpoints: 1200px (large laptop) / 992px (tablet landscape) /
   768px (tablet portrait) / 560px (mobile)
   ========================================================================== */

/* ---------- Large screens polish ---------- */
@media (min-width: 1600px) {
  :root { --container-w: 1400px; }
}

/* ---------- 1200px — laptop ---------- */
@media (max-width: 1200px) {
  .footer-grid { grid-template-columns: 1.4fr 1fr 1fr; }
  .footer-grid .footer-newsletter { grid-column: 1 / -1; }
}

/* ---------- 992px — tablet landscape ---------- */
@media (max-width: 992px) {
  section { padding: 76px 0; }
  .grid-2 { grid-template-columns: 1fr; gap: 40px; }
  .grid-3 { grid-template-columns: repeat(2, 1fr); }
  .grid-4 { grid-template-columns: repeat(2, 1fr); }
  .stats-grid { grid-template-columns: repeat(2, 1fr); row-gap: 40px; }
  .detail-specs { grid-template-columns: repeat(2, 1fr); }
  .amenities-grid { grid-template-columns: repeat(2, 1fr); }
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 40px; }
  .cta-band { padding: 56px 32px; margin: 0 16px; }

  /* Mobile nav */
  .hamburger { display: flex; }
  .nav-links {
    position: fixed; top: 0; right: 0; height: 100vh; width: min(78vw, 340px);
    background: var(--primary-dark); flex-direction: column; align-items: flex-start;
    padding: 110px 36px 40px; gap: 26px;
    transform: translateX(100%); transition: transform var(--transition);
    box-shadow: -20px 0 60px rgba(0,0,0,0.3);
  }
  .nav-links.open { transform: translateX(0); }
  .nav-links a { color: var(--white); font-size: 1.05rem; }
  .nav-right { gap: 16px; }
  .nav-overlay {
    position: fixed; inset: 0; background: rgba(0,0,0,0.5); z-index: 999;
    opacity: 0; visibility: hidden; transition: all var(--transition);
  }
  .nav-overlay.open { opacity: 1; visibility: visible; }
  .btn-call span { display: none; }
  .btn-call { padding: 11px; }
  .logo-img { height: 110px; }
}

/* ---------- 768px — tablet portrait ---------- */
@media (max-width: 768px) {
  .container { padding: 0 20px; }
  h1 { font-size: 2.2rem; }
  h2 { font-size: 1.7rem; }
  .hero-content { padding-top: 60px; }
  .hero-actions, .cta-band .hero-actions { flex-direction: column; align-items: stretch; }
  .hero-actions .btn, .cta-band .btn { justify-content: center; }

  .grid-3 { grid-template-columns: 1fr; }
  .grid-4 { grid-template-columns: 1fr; }
  .stats-grid { grid-template-columns: repeat(2, 1fr); }
  .stat-item .stat-number { font-size: 2.2rem; }

  .detail-header { flex-direction: column; }
  .detail-specs { grid-template-columns: repeat(2, 1fr); }
  .amenities-grid { grid-template-columns: 1fr; }
  .gallery-thumbs { grid-template-columns: repeat(3, 1fr); }

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

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

  .whatsapp-float, .back-to-top { width: 48px; height: 48px; bottom: 18px; }
  .whatsapp-float { left: 18px; }
  .back-to-top { right: 18px; }

  .filter-bar { flex-direction: column; align-items: stretch !important; }
  .filter-bar select, .filter-bar input { width: 100%; }
}

/* ---------- 560px — mobile ---------- */
@media (max-width: 560px) {
  .hero p { font-size: 1rem; }
  .stats-grid { grid-template-columns: 1fr 1fr; }
  .property-specs { gap: 12px; }
  .property-actions { flex-direction: column; }
  .cta-band { padding: 44px 22px; }
  .logo-text { font-size: 1rem; }
  .logo-img { height: 90px; }
  .gallery-thumbs { grid-template-columns: repeat(3, 1fr); }
  .lightbox-nav { width: 38px; height: 38px; }
  .lightbox-prev { left: 10px; }
  .lightbox-next { right: 10px; }
}