/* Public site responsive / menu stability layer - v6.0.0 */
html, body { width: 100%; max-width: 100%; overflow-x: hidden; overflow-x: clip; }
body { min-width: 0; }
img, svg, video, canvas, iframe { max-width: 100%; }
main, section, .container, .hero-grid, .footer-grid, .service-grid, .why-grid, .process-grid { min-width: 0; }
.hero-grid > *, .footer-grid > *, .service-grid > *, .why-grid > *, .process-grid > * { min-width: 0; }
p, h1, h2, h3, a, span { overflow-wrap: break-word; }

@media (max-width: 860px) {
    html.nav-open, body.nav-open { overflow: hidden; }
    .site-header { width: 100%; max-width: 100vw; }
    .nav-wrap { min-width: 0; }
    .site-logo { min-width: 0; }
    .site-nav {
        right: max(12px, env(safe-area-inset-right));
        left: max(12px, env(safe-area-inset-left));
        width: auto;
        max-width: none;
        max-height: calc(100dvh - var(--mobile-nav-top, 96px) - max(12px, env(safe-area-inset-bottom)));
        padding-bottom: max(16px, env(safe-area-inset-bottom));
    }
    .site-nav a { min-width: 0; white-space: normal; overflow-wrap: anywhere; }
    .nav-toggle { flex: 0 0 auto; touch-action: manipulation; }
    .floating-card { max-width: calc(100vw - 40px); }
}

@media (max-width: 700px) {
    .signal-inner { min-width: 0; gap: 10px; }
    .signal-inner span:first-child { min-width: 0; }
    .signal-inner a { min-width: 0; max-width: 48vw; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .hero-visual, .hero-showcase { min-width: 0; width: 100%; }
    .hero-content h1, .section-head h2, .dark-section h2, .cta-card h2 { overflow-wrap: anywhere; }
    .footer-grid { width: 100%; }
}

@media (max-width: 420px) {
    .container { width: calc(100% - 20px); }
    .site-nav { left: 10px; right: 10px; border-radius: 18px; padding: 12px; }
    .site-nav a { padding: 13px 14px; }
    .site-logo img { max-width: 108px; }
}

/* General small-screen overflow guards */
input, select, textarea, button { max-width: 100%; }
.footer-legal { flex-wrap: wrap; }

@media (max-width: 520px) {
    .footer-legal { gap: 8px 12px; }
    .footer-legal a { min-width: 0; }
}
