@charset "UTF-8";

/* Etapa 1: fundação visual e responsiva */
:root {
    --sandinox-navy: #1f2a51;
    --sandinox-blue: #1d5f96;
    --sandinox-gray: #8c9195;
    --sandinox-light: #f3f6f8;
    --sandinox-border: #d8e0e6;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { color: #46515a; line-height: 1.5; }
img { max-width: 100%; height: auto; }
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible {
    outline: 3px solid rgba(29, 95, 150, .35);
    outline-offset: 2px;
}

#menu_mobile_toggle { display: none; }

@media (min-width: 761px) {
    #cabecalho { border-bottom: 1px solid #eef1f3; }
    #menu_topo .site-menu-root > .site-menu-item > a {
        transition: color .18s ease;
    }
    #menu_topo .site-menu-dropdown {
        border-radius: 8px;
        overflow: visible;
    }
}

@media (max-width: 760px) {
    body { min-width: 0; background: #fff; overflow-x: hidden; }
    #container { width: 100%; max-width: 100%; padding: 0 16px; }
    #backgroud_principal { display: none; }

    #cabecalho {
        align-items: center;
        background: #fff;
        box-shadow: 0 5px 14px rgba(31, 42, 81, .1);
        column-gap: 10px;
        display: grid;
        float: none;
        grid-template-columns: minmax(0, 1fr) auto;
        padding: 8px 0;
        position: sticky;
        top: 0;
        width: 100%;
        z-index: 350000;
    }
    #logo_topo {
        float: none;
        min-width: 0;
        width: min(100%, 305px);
    }
    #logo_topo a, #logo_topo img {
        display: block;
        width: 100%;
    }
    #contato_topo, #logo_topo_right { display: none; }

    .site-language-switcher {
        flex-direction: row;
        gap: 3px;
        grid-column: 1 / -1;
        grid-row: 2;
        justify-self: end;
        position: static;
    }
    .site-language-switcher a {
        height: 32px;
        width: 32px;
    }

    #menu_mobile_toggle {
        align-items: center;
        background: var(--sandinox-navy);
        border: 0;
        border-radius: 6px;
        color: #fff;
        cursor: pointer;
        display: flex;
        font: 600 15px TitilliumText22LBold, Arial, sans-serif;
        gap: 8px;
        justify-self: end;
        grid-column: 2;
        grid-row: 1;
        margin: 0;
        padding: 9px 12px;
    }
    .menu_mobile_icon, .menu_mobile_icon::before, .menu_mobile_icon::after {
        background: #fff;
        content: "";
        display: block;
        height: 2px;
        position: relative;
        width: 20px;
    }
    .menu_mobile_icon::before { position: absolute; top: -6px; }
    .menu_mobile_icon::after { position: absolute; top: 6px; }

    #menu_topo {
        background: #fff;
        border: 1px solid var(--sandinox-border);
        border-radius: 8px;
        box-shadow: 0 8px 22px rgba(31, 42, 81, .14);
        display: none;
        float: none;
        grid-column: 1 / -1;
        grid-row: 3;
        margin: 10px 0 0;
        max-height: calc(100vh - 96px);
        overflow-y: auto;
        padding: 6px;
        width: 100%;
        z-index: 300000;
    }
    #menu_topo.site-menu-mobile-open { display: block; }
    #menu_topo .site-menu-root { display: block; float: none; width: 100%; }
    #menu_topo .site-menu-root > .site-menu-item { float: none; width: 100%; }
    #menu_topo .site-menu-root > .site-menu-item > a {
        background: none;
        border-bottom: 1px solid #edf1f4;
        color: #4f5962;
        display: block;
        float: none;
        padding: 10px 12px;
        width: 100%;
    }
    #menu_topo .txt_menu { float: none; margin: 0; }
    #menu_topo .site-menu-has-children > a::after {
        color: var(--sandinox-blue);
        content: "+";
        float: right;
        font-size: 20px;
        line-height: 18px;
    }
    #menu_topo .site-menu-mobile-child-open > a::after { content: "−"; }
    #menu_topo .site-menu-dropdown,
    #menu_topo .site-menu-has-children:hover > .site-menu-dropdown,
    #menu_topo .site-menu-has-children:focus-within > .site-menu-dropdown {
        background: #f3f6f8;
        border: 0;
        border-radius: 0;
        box-shadow: none;
        display: none;
        float: none;
        left: auto;
        margin: 0;
        max-width: none;
        min-width: 0;
        padding: 4px 0 4px 12px;
        position: static;
        transform: none;
        width: 100%;
    }
    #menu_topo .site-menu-has-children.site-menu-mobile-child-open > .site-menu-dropdown {
        display: block !important;
    }
    #menu_topo .site-menu-dropdown::before { display: none; }
    #menu_topo .site-menu-dropdown li a {
        color: var(--sandinox-navy);
        font-size: 15px;
        padding: 8px 12px;
    }
    #menu_topo .site-menu-dropdown .site-menu-dropdown {
        margin-left: 10px;
        padding-left: 8px;
    }
    #menu_topo .site-menu-dropdown .site-menu-next { transform: rotate(90deg); }

    #main_container, #main_container_conteudo, .container_conteudo,
    .c_left, .c_right, .c_meio, .altura_conteudo {
        box-sizing: border-box;
        clear: both;
        float: none;
        margin-left: 0;
        max-width: 100%;
        width: 100%;
    }
    #main_container { margin: 0; }
    #main_container_conteudo {
        background: none;
        min-height: 0;
    }
    .background_topo { display: none; }

    /* Banner principal: no celular exibimos uma imagem por vez sem as molduras antigas. */
    #container_display {
        background: none !important;
        clear: both;
        float: none !important;
        height: auto !important;
        margin: 0 0 22px !important;
        overflow: hidden;
        position: relative;
        width: 100% !important;
        z-index: 1;
    }
    #container_display > img { display: none; }
    #display, #slider1, #slider1 .viewport {
        float: none !important;
        height: auto !important;
        margin: 0 !important;
        width: 100% !important;
    }
    #slider1 .viewport {
        aspect-ratio: 876 / 290;
        border-radius: 0 0 12px 12px;
        overflow: hidden;
    }
    #slider1 .overview {
        height: 100%;
        left: 0 !important;
        margin: 0;
        overflow: hidden;
        position: relative;
        width: 100% !important;
    }
    #slider1 .overview li {
        display: none;
        float: none;
        height: 100%;
        width: 100% !important;
    }
    #slider1 .overview li:first-child { display: block; }
    #slider1 .overview li a,
    #slider1 .overview li img {
        display: block;
        float: none;
        height: 100%;
        object-fit: cover;
        width: 100%;
    }
    #slider1 .buttons { display: none; }

    .altura_conteudo { height: 24px; }
    .container_conteudo {
        font-size: 16px;
        margin: 0 0 34px;
        overflow: hidden;
    }
    .container_conteudo p { padding-left: 18px; padding-right: 18px; }
    .titulos { font-size: clamp(28px, 9vw, 38px); letter-spacing: -1px; line-height: 1.08; }
    .titulos_left, .titulos_right, .titulos_destaques,
    .titulos_documentacao, .titulos_agenda, .titulos_c_vantagens,
    .titulos_left_v1, .titulos_left_v2, .titulos_left_v3,
    .titulos_right_v2, .titulos_duvidas {
        box-sizing: border-box;
        float: none;
        margin: 0 18px 14px;
        padding: 0;
        width: auto;
    }

    /* Chamadas com imagem da home e das páginas internas. */
    #prende_display_left, #prende_display_right {
        float: none;
        margin: 0 0 18px;
        width: 100%;
    }
    .img_background_left, .img_background_right {
        aspect-ratio: 414 / 264;
        background: none;
        border-radius: 12px;
        box-shadow: 0 8px 22px rgba(31, 42, 81, .14);
        float: none;
        height: auto;
        margin: 0;
        overflow: hidden;
        padding: 0;
        width: 100%;
    }
    .img_background_left > img, .img_background_right > img {
        display: block;
        height: 100%;
        object-fit: cover;
        width: 100%;
    }
    .prende_img_background_left, .prende_img_background_right { display: none; }

    /* Carrossel compacto da linha de produtos. */
    #parceiros {
        float: none !important;
        margin: 0 !important;
        overflow: hidden !important;
        width: 100% !important;
    }
    #slider2 {
        align-items: center;
        display: flex;
        float: none !important;
        margin: 0 !important;
        padding: 4px 0 !important;
        width: 100% !important;
    }
    #slider2 .viewport {
        flex: 1 1 auto;
        float: none !important;
        margin: 0 4px !important;
        min-width: 0;
        width: auto !important;
    }
    #slider2 .buttons {
        flex: 0 0 30px;
        float: none;
        margin-left: 0;
        margin-right: 0;
    }

    /* Formulários legados: campos passam a ocupar uma coluna confortável. */
    #box_form_contatos,
    #main_container_conteudo #box_form_depoimentos,
    #form_busca_duvidas,
    #prende_form_busca {
        box-sizing: border-box;
        clear: both;
        float: none;
        margin: 0;
        padding: 0 18px 36px;
        width: 100%;
    }
    #box_form_contatos .form_login,
    #main_container_conteudo #box_form_depoimentos form {
        display: flex;
        flex-direction: column;
        width: 100%;
    }
    .lb, .lb_v1, .lb_cont, .lb_cont_data {
        float: none;
        font-size: 17px;
        margin: 0 0 6px;
        text-align: left;
        width: 100%;
    }
    .boxs, .boxs_v1, .boxs_v2, .boxs_v3, .boxs_v4,
    .boxs_ddd, .boxs_ddd_v1, .boxs_telefone, .boxs_telefone_duvidas,
    .boxs_duvidas, .boxs_data, .boxs_ms, .boxs_ms_duvidas, .boxs_ms_g {
        background: #fff;
        border: 1px solid #cbd4da;
        border-radius: 7px;
        box-sizing: border-box;
        float: none;
        font-size: 16px;
        height: 42px;
        margin: 0 0 16px;
        padding: 8px 10px;
        width: 100%;
    }
    .boxs_ms, .boxs_ms_duvidas, .boxs_ms_g {
        height: 150px;
        min-height: 130px;
        resize: vertical;
    }
    .b_enviar, .b_enviar_v1, .b_enviar_v2 {
        align-self: flex-end;
        float: none;
        margin: 0;
    }
    .txt_rodape_contato {
        clear: both;
        float: none;
        margin: 12px 0 0;
        text-align: left;
    }
    #central {
        margin: 22px 0 0;
        position: static;
        width: 100%;
    }
    .contato_tel { width: 100%; }
    .sub_titulo_form_duvidas, .campos_obrigatorio_duvidas {
        box-sizing: border-box;
        float: none;
        margin-left: 0;
        padding-left: 0;
        padding-right: 0;
        width: 100%;
    }

    .lista_page_interna, .lista_page_interna li, .lista_page_modelos,
    .lista_page_modelos li, .lista_page_modelos_v1, .lista_page_modelos_v1 li,
    .titulo_listagem, #lista_vantagens, #lista_vantagens li {
        float: none;
        margin-left: 0;
        max-width: 100%;
        width: 100%;
    }

    #prende_rodape {
        background: linear-gradient(145deg, #172845, #243d68);
        border-radius: 14px 14px 0 0;
        height: auto;
        left: auto;
        margin: 0 -16px;
        max-width: none;
        padding: 22px 16px 18px;
        position: static;
        width: calc(100% + 32px);
    }
    #rodape {
        align-items: center;
        display: flex;
        flex-direction: column;
        float: none;
        gap: 16px;
        margin: 0;
        padding: 0;
        width: 100%;
    }
    #rodape .selos {
        background-position: center;
        float: none;
        height: 58px;
        margin: 0;
        width: 160px;
    }
    #midias_sociais {
        height: 0;
        margin: 0;
        position: absolute;
        width: 0;
    }
    #sub_menu { display: none; }
    #campo_receba {
        float: none;
        margin: 0;
        width: 100%;
    }
    #campo_receba form {
        align-items: center;
        display: grid;
        grid-template-columns: minmax(0, 1fr) 42px;
        row-gap: 8px;
    }
    #campo_receba .titulo_receba { float: none; grid-column: 1 / -1; width: 100%; }
    #campo_receba .box_receba { float: none; }
    #campo_receba .botao_ok { float: none; margin: 0; width: 42px; }
    #tel_rodape, #tel_rodape ul {
        float: none;
        margin: 0;
        width: 100%;
    }
    #tel_rodape { font-size: 13px; gap: 8px; grid-template-columns: .9fr 1.1fr; }
    #tel_rodape ul, #tel_rodape .footer-contact-title { text-align: center; }
    #tel_rodape ul li {
        float: none;
        line-height: 1.4;
        margin: 4px 0;
        text-align: center;
        width: 100%;
    }
    #tel_rodape ul li a {
        display: inline-block;
        min-height: 0;
        padding: 4px 2px;
    }
    #tel_rodape .footer-contact-column:first-child a { font-size: 15px; }
    #copy {
        bottom: auto;
        font-size: 11px;
        margin: 0;
        position: static;
        text-align: center;
    }
    #copy .copy_left { float: none; margin: 0; }
    .cookieConsentContainer {
        padding: 18px !important;
    }
    #back-top { display: none !important; }
}

@media (max-width: 420px) {
    #container { padding: 0 10px; }
    #prende_rodape {
        margin-left: -10px;
        margin-right: -10px;
        width: calc(100% + 20px);
    }
    #menu_mobile_toggle span:last-child { display: none; }
    #logo_topo { width: min(66vw, 230px); }
}
