/* Mobile stabilization layer */
html, body {
  max-width: 100%;
  overflow-x: hidden;
}
*, *::before, *::after {
  box-sizing: border-box;
}
img, svg, video, canvas, iframe {
  max-width: 100%;
  height: auto;
}
iframe { border: 0; }
a, p, li, h1, h2, h3, h4, h5, h6 {
  overflow-wrap: anywhere;
  word-break: normal;
}
section, main, header, footer, .container, .content, .page-content, .inner {
  max-width: 100%;
}
.table-wrap, .comparison-table, .table-responsive {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
table {
  width: 100%;
  max-width: 100%;
}
@media (max-width: 900px) {
  table { min-width: 0 !important; display: block; overflow-x: auto; }
}

@media (max-width: 768px) {
  html { font-size: 16px; }
  body { min-width: 0; }

  .container,
  nav .container,
  .topbar .container,
  main,
  .section,
  .hero,
  .page-hero,
  .cta-band,
  .footer,
  .footer-grid,
  .hero-grid,
  .grid-2,
  .grid-3,
  .grid-4,
  .metrics,
  .stat-grid,
  .benefits-grid,
  .cards-grid,
  .feature-grid,
  .service-grid,
  .contact-grid,
  .content-grid,
  .two-column,
  .split-layout,
  .form-grid,
  .hero-buttons,
  .button-row,
  .cta-row,
  [class*="grid"] {
    max-width: 100%;
  }

  .hero-grid,
  .grid-2,
  .grid-3,
  .grid-4,
  .metrics,
  .footer-grid,
  .cta-band,
  .contact-grid,
  .content-grid,
  .two-column,
  .split-layout,
  .form-grid,
  .benefits-grid,
  .cards-grid,
  .feature-grid,
  .service-grid {
    grid-template-columns: 1fr !important;
  }

  nav .container,
  .nav-wrap,
  .nav-links,
  .hero-buttons,
  .button-row,
  .cta-row,
  .topbar .container {
    flex-wrap: wrap !important;
  }

  .nav-links {
    width: 100%;
    justify-content: center !important;
    gap: .75rem !important;
  }

  .hero,
  .page-hero,
  .section,
  .section-alt,
  main,
  footer {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  .hero::after,
  .hero::before {
    width: 220px !important;
    height: 220px !important;
  }

  h1, .hero h1, .page-hero h1 {
    font-size: clamp(2rem, 8vw, 2.8rem) !important;
    line-height: 1.1 !important;
  }

  h2 { font-size: clamp(1.5rem, 6vw, 2.2rem) !important; }
  h3 { font-size: clamp(1.2rem, 5vw, 1.6rem) !important; }

  .btn,
  .cta,
  .cta-primary,
  .cta-secondary,
  .btn-primary,
  .btn-secondary,
  .nav-cta,
  .footer-cta-btn,
  button,
  [type="submit"],
  [type="button"] {
    max-width: 100%;
  }

  .hero-buttons .btn,
  .hero-buttons .cta,
  .button-row .btn,
  .cta-row .btn,
  .hero-buttons a,
  .button-row a,
  .cta-row a {
    width: 100% !important;
  }

  .card,
  .hero-card,
  .metric,
  .step,
  .notice,
  .faq details,
  .modal-content,
  .pmfla-apply-panel {
    width: 100% !important;
    max-width: 100% !important;
  }

  [style*="width: 500px"],
  [style*="width:500px"],
  [style*="width: 400px"],
  [style*="width:400px"],
  [style*="width: 600px"],
  [style*="width:600px"],
  [style*="width: 700px"],
  [style*="width:700px"],
  [style*="max-width: 1000px"],
  [style*="max-width:1000px"],
  [style*="max-width: 1200px"],
  [style*="max-width:1200px"] {
    width: 100% !important;
    max-width: 100% !important;
  }

  .modal-content {
    height: min(90vh, 720px) !important;
    border-radius: 14px !important;
  }

  input, select, textarea {
    width: 100% !important;
    max-width: 100% !important;
  }

  .stat-grid,
  .metrics {
    gap: .85rem !important;
  }

  .metro-links,
  .chip-row,
  .tag-row {
    display: flex !important;
    flex-wrap: wrap !important;
  }

  .metro-links a,
  .chip-row a,
  .tag-row a {
    white-space: normal !important;
  }
}
