@media (max-width: 900px) {
  .hero-content, .content-grid { grid-template-columns: 1fr; }
  .card-grid, .gallery-grid { grid-template-columns: 1fr 1fr; }
  .cta-band { flex-direction: column; align-items: flex-start; }
}

@media (max-width: 640px) {
  .nav-bar { flex-direction: column; align-items: flex-start; }
  .site-nav { gap: 0.7rem; }
  .card-grid, .gallery-grid { grid-template-columns: 1fr; }
  .hero, .page-hero { padding: 3.5rem 0; }
  .hero-stats { grid-template-columns: 1fr; }
  .panel-footer { flex-direction: column; align-items: flex-start; }
}