/**
 * Página /funcionalidades — contenção de largura alinhada ao padrão institucional.
 * Arquivo separado para garantir deploy/cache-bust independente do redesign.
 */

/* Preserva max-width do .inst-container (evita override por width:100% no layout) */
.inst-container.ga-lp-func__layout {
    width: min(var(--inst-container-max, 1160px), calc(100% - var(--inst-container-pad, 24px) * 2));
    margin-inline: auto;
}

@media (max-width: 1024px) {
    .ga-lp-func {
        overflow-x: clip;
        max-width: 100%;
    }

    .ga-lp-func__layout {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 16px !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        overflow-x: clip !important;
    }

    .ga-lp-func__main,
    .ga-lp-func-toc,
    .ga-lp-func-mod,
    .ga-lp-fluxo,
    .ga-lp-func-midcta,
    .ga-lp-func-midcta__inner {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
    }

    .ga-lp-func-mod.ga-lp-area,
    .ga-lp-func .ga-lp-area {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        gap: 16px !important;
        overflow: hidden !important;
    }

    .ga-lp-func-mod .ga-lp-area__copy,
    .ga-lp-func-mod .ga-lp-area__media,
    .ga-lp-func-mod .ga-lp-shot-annot,
    .ga-lp-func-mod .ga-lp-browser,
    .ga-lp-func-mod .ga-lp-browser__screen,
    .ga-lp-func-mod .ga-lp-area__media picture,
    .ga-lp-func-mod .ga-lp-area__media img,
    .ga-lp-func-mod .ga-lp-shot__img {
        min-width: 0 !important;
        max-width: 100% !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    .ga-lp-func-mod .ga-lp-area__media,
    .ga-lp-func-mod .ga-lp-shot-annot,
    .ga-lp-func-mod .ga-lp-browser,
    .ga-lp-func-mod .ga-lp-browser__screen {
        overflow: hidden !important;
    }

    .ga-lp-func-mod .ga-lp-browser__screen.ga-lp-shot img,
    .ga-lp-func-mod .ga-lp-browser__screen.ga-lp-shot .ga-lp-shot__img {
        height: 100% !important;
        object-fit: cover !important;
        object-position: top center !important;
    }

    .ga-lp-func-quote {
        overflow-wrap: anywhere !important;
        word-break: break-word !important;
    }

    .ga-lp-func-quote footer picture {
        width: 40px !important;
        max-width: 40px !important;
        min-width: 40px !important;
        height: 40px !important;
        flex-shrink: 0 !important;
        display: block !important;
        overflow: hidden !important;
        border-radius: 50% !important;
    }

    .ga-lp-func-mod .ga-lp-func-quote footer img,
    .ga-lp-func-mod .ga-lp-func-quote__avatar {
        width: 40px !important;
        max-width: 40px !important;
        min-width: 40px !important;
        height: 40px !important;
        flex-shrink: 0 !important;
        object-fit: cover !important;
        border-radius: 50% !important;
    }

    .ga-lp-func-toc {
        overflow: hidden !important;
        position: sticky;
        top: var(--inst-header-h, 80px);
        z-index: 40;
        margin: 0 0 12px !important;
        padding: 12px 0 8px !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
        backdrop-filter: none !important;
    }

    .ga-lp-func-toc__list {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        overflow-x: auto !important;
        gap: 6px !important;
        max-width: 100% !important;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: thin;
        overscroll-behavior-x: contain;
    }

    .ga-lp-func-toc__list li {
        flex: 0 0 auto !important;
    }

    .ga-lp-func-toc__list a {
        white-space: nowrap !important;
        padding: 8px 12px !important;
        border: 1px solid var(--inst-border, #d1d9e6);
        border-radius: 999px;
        background: #fff;
    }

    .ga-lp-func-mod .ga-lp-shot-annot__pin {
        display: none !important;
    }
}

@media (max-width: 640px) {
    .ga-lp-fluxo__steps {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    .ga-lp-func-mod {
        padding: 16px 12px !important;
    }

    .ga-lp-func-midcta__inner {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 14px !important;
    }

    .ga-lp-func-midcta .botao-primario {
        width: 100% !important;
        text-align: center !important;
        white-space: normal !important;
    }
}