/* ==========================================================================
   responsive.css — breakpoints (mobile-first overrides applied at max-width)
   ========================================================================== */

/* Large desktop */
@media (max-width: 1200px) {
  .footer-top { grid-template-columns: 1.3fr 1fr 1fr; }
  .footer-contact { grid-column: 1 / -1; }
}

/* Tablet landscape */
@media (max-width: 1024px) {
  :root { --header-h: 78px; }
  .nav, .header-call { display: none; }
  .nav-toggle { display: inline-flex; }
  .hero-grid { grid-template-columns: 1fr; gap: clamp(2.5rem, 6vw, 3.5rem); }
  .hero-media { max-width: 480px; }
  .hero-media .frame { aspect-ratio: 16/11; }
  .split { grid-template-columns: 1fr; gap: 2.5rem; }
  .split .media-frame { order: -1; }
  .grid--4 { grid-template-columns: repeat(2, 1fr); }
  .stat-grid { grid-template-columns: repeat(2, 1fr); gap: 2rem; }
  .quote-tab { display: none; }
}

/* Tablet portrait */
@media (max-width: 820px) {
  .grid--3 { grid-template-columns: repeat(2, 1fr); }
  .cta-band .inner { flex-direction: column; align-items: flex-start; }
  .footer-top { grid-template-columns: 1fr 1fr; }
  .footer-brand { grid-column: 1 / -1; }
  .form-grid { grid-template-columns: 1fr; }
  .faq-q { font-size: 1.08rem; }
}

/* Mobile */
@media (max-width: 640px) {
  :root { --header-h: 68px; }
  body { padding-bottom: 64px; } /* room for sticky mobile bar */
  .grid--2, .grid--3, .grid--4 { grid-template-columns: 1fr; }
  .stat-grid { grid-template-columns: 1fr 1fr; gap: 1.5rem; }
  .hero-proof { gap: 1.5rem 2rem; }
  .hero-badge { left: 0; bottom: 14px; padding: .8rem 1rem; }
  .hero-cta .btn { width: 100%; }
  .cta-band .actions .btn { width: 100%; }
  .mobi-bar { display: grid; }
  .footer-top { grid-template-columns: 1fr; gap: 2rem; }
  .footer-bottom { flex-direction: column; align-items: flex-start; text-align: left; }
  .brand-text span { display: none; }
  .page-hero h1 { max-width: none; }
  .btn { width: 100%; }
  .hero-cta, .cta-band .actions, .header-actions .btn { width: 100%; }
}

@media (max-width: 380px) {
  .brand img { width: 40px; height: 40px; }
  .brand-text b { font-size: .98rem; }
}

/* Print */
@media print {
  .site-header, .mobi-bar, .quote-tab, .scroll-progress, .nav-drawer, .cta-band, .map-frame { display: none !important; }
  body { color: #000; background: #fff; }
}