/* Site-wide mobile overflow and responsive fixes */

html,
body {
  overflow-x: hidden;
  max-width: 100%;
}

img,
video,
iframe,
svg {
  max-width: 100%;
  height: auto;
}

@media (max-width: 900px) {
  nav {
    padding: 18px 24px !important;
    position: relative;
  }

  .hero,
  .platform,
  .features,
  .pillars,
  .workflow,
  .lifecycle,
  .pricing-cta,
  .case-studies,
  .lead-magnet,
  .content,
  .hero-banner,
  .cta-banner,
  .page-header,
  .hub-grid,
  .gallery,
  .filter-bar,
  .section-label,
  .hub-strip,
  .related-reading,
  .impact-row,
  .blog-content,
  .compliance-section,
  .security-grid {
    padding-left: 24px !important;
    padding-right: 24px !important;
  }

  footer {
    padding-left: 24px !important;
    padding-right: 24px !important;
  }

  .hero,
  .hero-inner,
  .platform-inner,
  .features-inner,
  .pillars-inner,
  .workflow-inner,
  .lifecycle-inner,
  .pricing-cta,
  .case-studies-inner,
  .lead-magnet-inner,
  .footer-inner,
  .testimonial-card {
    max-width: 100%;
  }

  .hero h1,
  .hero-title,
  .page-header h1 {
    font-size: clamp(32px, 10vw, 40px) !important;
    overflow-wrap: break-word;
    word-break: break-word;
  }

  .pillars-hed,
  .lifecycle-hed,
  .pricing-hed,
  .workflow-hed,
  .case-studies-hed {
    overflow-wrap: break-word;
    word-break: break-word;
  }

  .stats-inline,
  .cs-metrics {
    flex-wrap: wrap;
    gap: 16px 24px;
  }

  .btn-secondary,
  .download-btn {
    white-space: normal;
  }

  .cta-stack {
    max-width: 100%;
  }

  .nav-dropdown-menu {
    min-width: unset !important;
    max-width: 100%;
  }

  .nav-links {
    max-width: 100%;
    box-sizing: border-box;
  }

  pre,
  code {
    max-width: 100%;
    overflow-x: auto;
    white-space: pre-wrap;
    word-break: break-word;
  }

  table {
    display: block;
    max-width: 100%;
    overflow-x: auto;
  }
}