/* Mobile/tablet refinements layered over the inline desktop styles.
   Inline styles win the cascade, so overrides here need !important. */

@media (max-width: 960px) {
  .split { grid-template-columns: 1fr !important; gap: 44px !important; }
  .trip-grid { grid-template-columns: repeat(auto-fit, minmax(290px, 1fr)) !important; }
  .footer-grid { grid-template-columns: 1fr 1fr !important; gap: 36px !important; }
  .sec-head { flex-direction: column !important; align-items: flex-start !important; gap: 12px !important; margin-bottom: 28px !important; }
}

@media (max-width: 760px) {
  .nav-hide { display: none !important; }
  .nav-cta { display: none !important; }
  .hero { padding-top: 100px; }
  .nav-links { gap: 14px !important; }
  .nav-bar { height: 64px !important; }
  .stat-grid { grid-template-columns: 1fr 1fr !important; gap: 32px 24px !important; padding-top: 40px !important; padding-bottom: 40px !important; }
  .stat-grid > div { border-left: none !important; padding-left: 0 !important; }
  .sect { padding-top: 56px !important; padding-bottom: 56px !important; }
  .form-row { grid-template-columns: 1fr !important; }
  .form-card { padding: 22px !important; }
  .cta-row { flex-wrap: wrap; }
  .chip-row { flex-wrap: wrap; }
  .foot-legal { flex-wrap: wrap; gap: 6px 16px; }
}

@media (max-width: 520px) {
  .footer-grid { grid-template-columns: 1fr !important; }
}