/* Capa final de aislamiento: evita que estilos editoriales globales desborden Mango. */
html,
body {
    max-width: 100%;
    overflow-x: hidden;
}

body.page-home,
body.page-home .home-main,
body.page-home .home-hero,
body.page-home .hero-copy,
body.page-home .section-block,
body.page-home .manifesto-layout,
body.page-home .manifesto-copy,
body.page-home .quote-card,
body.page-home .prompt-card-grid,
body.page-home .prompt-card-link {
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
}

body.page-home .home-title {
    max-width: 11ch!important;
    font-size: clamp(36px, 6vw, 72px)!important;
    line-height: .92!important;
    letter-spacing: -.045em!important;
    overflow-wrap: anywhere;
    hyphens: auto;
    text-wrap: balance;
}

body.page-home .section-head h2,
body.page-home .manifesto-copy h2 {
    max-width: 100%;
    font-size: clamp(30px, 4vw, 44px)!important;
    overflow-wrap: anywhere;
}

body.page-home .prompt-card-link {
    display: flex;
}

.page-shell,
.chat-stage,
.chat-card,
.chat-messages,
.composer-bar,
.composer-shell,
.thinking-panel,
.message,
.message-bubble {
    min-width: 0;
    box-sizing: border-box;
}

.message-bubble,
.message-bubble p,
.message-bubble li {
    overflow-wrap: anywhere;
    word-break: normal;
}

.hero-title,
.chat-stage:not(.is-empty) .hero-title {
    max-width: 11ch!important;
    margin-inline: auto;
    overflow-wrap: normal;
    text-align: center;
}

@media (max-width: 640px) {
    body.page-home .home-main {
        width: calc(100% - 24px)!important;
        margin-inline: 12px;
        gap: 12px;
        padding-top: 12px;
    }

    body.page-home .hero-copy,
    body.page-home .manifesto-copy,
    body.page-home .quote-card,
    body.page-home .prompt-card-link {
        padding: 20px;
        border-radius: 0!important;
    }

    body.page-home .home-title {
        width: 100%;
        max-width: 100%!important;
        font-size: clamp(36px, 12vw, 52px)!important;
        line-height: .92!important;
        letter-spacing: -.045em!important;
    }

    body.page-home .home-intro {
        font-size: 15px;
        line-height: 1.55;
    }

    body.page-home .hero-actions,
    body.page-home .hero-actions .button-primary {
        width: 100%;
    }

    body.page-home .hero-actions .button-primary {
        padding-inline: 12px!important;
        text-align: center;
    }

    body.page-home .hero-note {
        align-items: flex-start;
        font-size: 11px;
        line-height: 1.55;
        letter-spacing: .1em;
    }

    body.page-home .quiet-band {
        gap: 12px;
    }

    body.page-home .quiet-line {
        min-height: 64px;
        padding: 14px;
        border-radius: 0!important;
    }

    body.page-home .section-head h2,
    body.page-home .manifesto-copy h2 {
        max-width: 100%;
        font-size: clamp(32px, 10vw, 44px)!important;
        overflow-wrap: anywhere;
    }

    body.page-home .prompt-card-grid {
        display: grid;
        grid-template-columns: 1fr;
    }

    body.page-home .prompt-card-link {
        width: 100%;
    }

    .page-shell {
        width: calc(100% - 24px)!important;
        margin-inline: 12px;
        padding-top: 16px;
    }

    .chat-stage,
    .chat-card,
    .chat-messages {
        width: 100%;
        max-width: 100%;
    }

    .hero-title,
    .chat-stage:not(.is-empty) .hero-title {
        width: 100%;
        max-width: 100%!important;
        font-size: clamp(34px, 11vw, 48px)!important;
        line-height: .95!important;
        overflow-wrap: anywhere;
    }

    .message-bubble {
        max-width: 92%;
        padding: 14px;
    }

    .chat-composer,
    .chat-stage.is-empty .chat-composer {
        bottom: 12px;
        width: 100%!important;
        max-width: calc(100% - 24px)!important;
        padding: 10px 12px;
        border-radius: 0;
    }

    .composer-bar {
        width: 100%;
        max-width: 100%;
        padding: 0;
    }

    .donation-cta {
        right: 12px;
    }
}

@media (max-width: 360px) {
    body.page-home .home-title {
        font-size: 26px!important;
        line-height: .98!important;
        letter-spacing: -.045em!important;
    }

    body.page-home .hero-copy {
        padding: 18px;
    }

    body.page-home .section-kicker {
        font-size: 10px!important;
        letter-spacing: .12em!important;
    }

    body.page-home .button-primary {
        font-size: 10px!important;
        letter-spacing: .1em;
    }

    .message-bubble {
        max-width: 96%;
    }
}