/* ============================================================
   responsive.css — All media queries
   Edit breakpoints here without touching layout files
   ============================================================ */

/* ── Tablet (≤960px) ── */
@media (max-width: 960px) {
  .hero-inner           { grid-template-columns: 1fr; }
  .hero h1              { font-size: 2rem; }
  .stats-bar-inner      { grid-template-columns: repeat(2, 1fr); gap: 24px; }
  .brands-grid          { grid-template-columns: repeat(4, 1fr); }
  .plans-grid           { grid-template-columns: 1fr; max-width: 420px; margin: 0 auto; }
  .spaces-grid          { grid-template-columns: 1fr 1fr; }
  .cities-grid          { grid-template-columns: repeat(2, 1fr); }
  .hiw-grid             { grid-template-columns: repeat(2, 1fr); }
  .hiw-grid::before     { display: none; }
  .why-photos           { height: 260px; }
  .why-feats            { grid-template-columns: repeat(2, 1fr); }
  .test-grid            { grid-template-columns: 1fr; }
  .footer-top           { grid-template-columns: 1fr 1fr; }
  .nav-links .nav-hide  { display: none; }
}

/* ── Mobile (≤600px) ── */
@media (max-width: 600px) {
  :root { --section-py: 52px; }

  .hero                 { padding: 40px 16px 48px; }
  .hero h1              { font-size: 1.7rem; }
  .brands-grid          { grid-template-columns: repeat(3, 1fr); }
  .spaces-grid          { grid-template-columns: 1fr; }
  .cities-grid          { grid-template-columns: 1fr 1fr; }
  .hiw-grid             { grid-template-columns: 1fr 1fr; }
  .why-feats            { grid-template-columns: 1fr; }
  .why-photos           { grid-template-columns: 1fr; height: 200px; }
  .why-photos img:last-child { display: none; }
  .footer-top           { grid-template-columns: 1fr; gap: 28px; }
  .form-row             { grid-template-columns: 1fr; }
  .cta-section h2       { font-size: 1.6rem; }
}

/* ── Very small (≤380px) ── */
@media (max-width: 380px) {
  .cities-grid          { grid-template-columns: 1fr; }
  .brands-grid          { grid-template-columns: repeat(2, 1fr); }
  .hiw-grid             { grid-template-columns: 1fr; }
}