/* Hard mobile viewport guard.
 * This file is intentionally separate and versioned from the main stylesheet so
 * mobile browsers cannot keep serving the pre-fix cached layout. */
html,
body {
    width: 100%;
    min-width: 0 !important;
    max-width: 100%;
    overflow-x: hidden !important;
    overscroll-behavior-x: none;
    touch-action: pan-y pinch-zoom;
}

@supports (overflow: clip) {
    html,
    body {
        overflow-x: clip !important;
    }
}

body,
main,
.site-header,
.site-footer,
.signal-strip,
.shell,
.hero,
.hero > *,
.hero-copy,
.hero-actions,
.hero-proof,
.section-heading > *,
.feature-grid,
.feature-card,
.bento-grid,
.bento-grid > *,
.member-panel,
.member-panel > *,
.agreement-list,
.agreement-row,
.final-cta-panel,
.console-card {
    min-width: 0;
    max-width: 100%;
}

@media (max-width: 720px) {
    html,
    body {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        overflow-x: hidden !important;
    }

    @supports (overflow: clip) {
        html,
        body {
            overflow-x: clip !important;
        }
    }

    /* The absolute page rings were the widest objects on the landing page.
     * Collapse them as a fallback even though current HTML no longer emits them. */
    .page-orbit,
    .page-orbit-one,
    .page-orbit-two {
        display: none !important;
        width: 0 !important;
        height: 0 !important;
        border: 0 !important;
    }

    main,
    .site-header,
    .site-footer,
    .signal-strip {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
    }

    .shell,
    .hero {
        width: calc(100% - 28px) !important;
        min-width: 0 !important;
        max-width: calc(100% - 28px) !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }

    .hero {
        grid-template-columns: minmax(0, 1fr) !important;
        transform: none !important;
    }

    .hero > *,
    .hero-copy,
    .hero-actions,
    .hero-proof,
    .console-card {
        min-width: 0 !important;
        max-width: 100% !important;
    }

    .hero-copy,
    .console-card {
        width: 100% !important;
    }

    .hero,
    .section,
    .member-section,
    .final-cta,
    .signal-strip,
    .console-card,
    .feature-grid,
    .bento-grid,
    .member-panel,
    .final-cta-panel {
        overflow-x: hidden;
    }

    @supports (overflow: clip) {
        .hero,
        .section,
        .member-section,
        .final-cta,
        .signal-strip,
        .console-card,
        .feature-grid,
        .bento-grid,
        .member-panel,
        .final-cta-panel {
            overflow-x: clip;
        }
    }

    /* Decorative pseudo-rings inside later cards are contained already, but
     * removing them on narrow screens guarantees they can never widen paint bounds. */
    .member-panel::after,
    .final-cta-panel::before,
    .final-cta-panel::after {
        content: none !important;
        display: none !important;
    }

    .console-card {
        transform: none !important;
    }

    .terminal-line,
    .topic-row strong,
    .topic-row small,
    .agreement-row p,
    .hero h1,
    .section-heading h2,
    .final-cta h2 {
        overflow-wrap: anywhere;
        word-break: break-word;
    }
}