.elementor-3375 .elementor-element.elementor-element-ce0ac82{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-3375 .elementor-element.elementor-element-ce0ac82:not(.elementor-motion-effects-element-type-background), .elementor-3375 .elementor-element.elementor-element-ce0ac82 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#5F4B40;}@media(min-width:768px){.elementor-3375 .elementor-element.elementor-element-ce0ac82{--content-width:1600px;}}/* Start custom CSS for html, class: .elementor-element-d3bed31 *//* =========================================================
   =========================================================
                  FOOTER MARÚ — COMPLETO
   =========================================================
========================================================= */


/* =========================================================
   CORES

   MARROM: #5f4b40
   BEGE:   #faf8eb
========================================================= */


/* =========================================================
   FOOTER PRINCIPAL
========================================================= */

.maru-footer {

    width: 100% !important;

    max-width: none !important;

    margin: 0 !important;

    padding: 0 !important;

    background: #5f4b40 !important;

    background-color: #5f4b40 !important;

    color: #faf8eb !important;

    box-sizing: border-box !important;

    position: relative !important;
}


/* =========================================================
   CONTAINER GERAL

   CORRIGIDO PARA ACOMPANHAR MELHOR O ZOOM
========================================================= */

.maru-footer-container {

    /* =====================================================
       >>> LARGURA TOTAL DO CONTEÚDO <<<

       84% = mais fechado
       88% = ATUAL
       90% = mais aberto
       92% = bem aberto

       IMPORTANTE:
       NÃO TEM MAIS max-width: 1120px
       ISSO EVITA O CONTEÚDO FICAR "PRESO"
       QUANDO DIMINUI O ZOOM.
    ====================================================== */

    width: 88% !important;

    max-width: none !important;


    /* CENTRALIZA TODO O CONTEÚDO */

    margin: 0 auto !important;


    /* =====================================================
       >>> ESPAÇAMENTO DO FOOTER <<<

       PRIMEIRO  = TOPO
       SEGUNDO   = LATERAIS
       TERCEIRO  = BAIXO

       ATUAL:
       65px topo
       0 laterais
       22px baixo
    ====================================================== */

    padding:
        65px
        0
        22px;


    box-sizing: border-box !important;
}


/* =========================================================
   =========================================================
                     PARTE SUPERIOR
   =========================================================
========================================================= */

.maru-footer-top {

    display: grid;


    /* =====================================================
       >>> DIVISÃO DAS COLUNAS <<<

       COLUNA 1 = LOGO
       COLUNA 2 = NAVEGAÇÃO
       COLUNA 3 = CONTATO
    ====================================================== */

    grid-template-columns:
        1.05fr
        .95fr
        .95fr;


    /* =====================================================
       >>> DISTÂNCIA ENTRE AS COLUNAS <<<

       clamp() faz o espaço crescer e diminuir
       automaticamente conforme a largura da tela.

       60px  = mínimo
       6vw   = responsivo
       120px = máximo
    ====================================================== */

    column-gap: clamp(
        60px,
        6vw,
        120px
    );


    align-items: start;

    width: 100%;
}


/* =========================================================
   REMOVE MARGENS DAS COLUNAS
========================================================= */

.maru-footer-brand,
.maru-footer-nav,
.maru-footer-contato {

    margin: 0 !important;

    padding: 0 !important;

    align-self: start;
}


/* =========================================================
   =========================================================
                   BLOCO DA ESQUERDA
   =========================================================
========================================================= */

.maru-footer-brand {

    /* =====================================================
       >>> POSIÇÃO VERTICAL DA COLUNA DA LOGO <<<

       NEGATIVO = SOBE
       POSITIVO = DESCE

       -5px  = sobe pouco
       -10px = sobe
       -15px = ATUAL
       -20px = sobe mais
       -25px = sobe bastante
    ====================================================== */

    position: relative !important;

    top: -15px !important;


    /* NÃO UTILIZAMOS TRANSFORM AQUI */

    transform: none !important;
}


/* =========================================================
   LINK DA LOGO
========================================================= */

.maru-footer-logo-link,
.maru-footer-logo-link:visited,
.maru-footer-logo-link:hover,
.maru-footer-logo-link:focus,
.maru-footer-logo-link:active {

    display: block;

    width: fit-content;

    margin: 0 !important;

    padding: 0 !important;

    line-height: 0 !important;

    text-decoration: none !important;

    background: transparent !important;

    background-color: transparent !important;

    border: none !important;

    outline: none !important;

    box-shadow: none !important;
}


/* =========================================================
   LOGO
========================================================= */

.maru-footer-logo {

    display: block;


    /* =====================================================
       >>> TAMANHO DA LOGO <<<

       115px = menor
       125px = média
       135px = ATUAL
       145px = maior
       155px = bem maior
    ====================================================== */

    width: 135px;


    max-width: 100%;

    height: auto;

    margin: 0 !important;

    padding: 0 !important;
}


/* =========================================================
   TEXTO ABAIXO DA LOGO
========================================================= */

.maru-footer-descricao {

    /* =====================================================
       >>> DISTÂNCIA LOGO → TEXTO <<<

       -10px = bem próximo
       -6px  = ATUAL
       0px   = posição normal
       5px   = mais afastado
       8px   = ainda mais afastado
    ====================================================== */

    margin:
        -6px
        0
        0 !important;


    padding: 0 !important;


    /* =====================================================
       >>> FONTE DO TEXTO <<<
    ====================================================== */

    font-family:
        "Sora",
        sans-serif !important;


    /* =====================================================
       >>> TAMANHO DO TEXTO <<<

       11px = menor
       12px = ATUAL
       13px = maior
    ====================================================== */

    font-size: 12px !important;


    font-weight: 500 !important;


    /* =====================================================
       >>> ESPAÇO ENTRE LINHAS <<<

       1.3 = compacto
       1.4 = ATUAL
       1.5 = mais aberto
    ====================================================== */

    line-height: 1.4 !important;


    color: #faf8eb !important;
}


/* =========================================================
   =========================================================
                    REDES SOCIAIS
   =========================================================
========================================================= */

.maru-footer-social {

    display: flex;

    align-items: center;


    /* =====================================================
       >>> DISTÂNCIA ENTRE ÍCONES <<<

       10px = próximos
       13px = ATUAL
       18px = mais separados
    ====================================================== */

    gap: 13px;


    /* =====================================================
       >>> DISTÂNCIA TEXTO → ÍCONES <<<

       5px = mais próximo
       9px = ATUAL
       12px = mais afastado
    ====================================================== */

    margin-top: 9px !important;
}


/* =========================================================
   LINKS DOS ÍCONES
========================================================= */

.maru-footer-social a,
.maru-footer-social a:visited,
.maru-footer-social a:hover,
.maru-footer-social a:focus,
.maru-footer-social a:active {

    display: inline-flex;

    align-items: center;

    justify-content: center;


    width: 18px;

    height: 18px;


    margin: 0 !important;

    padding: 0 !important;


    color: #faf8eb !important;


    background: transparent !important;

    background-color: transparent !important;


    text-decoration: none !important;


    border: none !important;

    outline: none !important;

    box-shadow: none !important;
}


/* =========================================================
   ÍCONES DA BIBLIOTECA
========================================================= */

.maru-footer-social i {

    /* =====================================================
       >>> TAMANHO DOS ÍCONES <<<

       15px = menor
       17px = ATUAL
       20px = maior
       22px = bem maior
    ====================================================== */

    font-size: 17px !important;


    line-height: 1 !important;


    color: #faf8eb !important;
}


/* =========================================================
   HOVER DOS ÍCONES
========================================================= */

.maru-footer-social a:hover,
.maru-footer-social a:focus,
.maru-footer-social a:active {

    opacity: .65;
}


/* =========================================================
   =========================================================
                 TÍTULOS DAS COLUNAS
   =========================================================
========================================================= */

.maru-footer-titulo {

    /* =====================================================
       >>> DISTÂNCIA TÍTULO → LINKS <<<

       14px = menor
       18px = ATUAL
       22px = maior
    ====================================================== */

    margin:
        0
        0
        18px !important;


    padding: 0 !important;


    /* =====================================================
       >>> FONTE DOS TÍTULOS <<<
    ====================================================== */

    font-family:
        "MEKONA",
        serif !important;


    /* =====================================================
       >>> TAMANHO DO TÍTULO <<<

       13px = menor
       14px = ATUAL
       15px = maior
    ====================================================== */

    font-size: 14px !important;


    font-weight: 500 !important;


    line-height: 1 !important;


    color: #faf8eb !important;
}


/* =========================================================
   =========================================================
                       NAVEGAÇÃO
   =========================================================
========================================================= */

.maru-footer-menu {

    display: flex;

    flex-direction: column;

    align-items: flex-start;


    /* =====================================================
       >>> DISTÂNCIA ENTRE LINKS <<<

       2px = mais juntos
       4px = ATUAL
       6px = mais separados
    ====================================================== */

    gap: 4px;


    margin: 0;

    padding: 0;
}


/* =========================================================
   LINKS DA NAVEGAÇÃO
========================================================= */

.maru-footer-menu a,
.maru-footer-menu a:visited {

    font-family:
        "Sora",
        sans-serif !important;


    /* =====================================================
       >>> TAMANHO DOS LINKS <<<

       10px = menor
       11px = ATUAL
       12px = maior
    ====================================================== */

    font-size: 11px !important;


    font-weight: 600 !important;


    line-height: 1.15 !important;


    color: #faf8eb !important;


    text-decoration: none !important;


    background: transparent !important;

    background-color: transparent !important;


    margin: 0 !important;

    padding: 0 !important;


    border: none !important;

    outline: none !important;

    box-shadow: none !important;


    transition:
        opacity .25s ease;
}


/* =========================================================
   HOVER LINKS
========================================================= */

.maru-footer-menu a:hover,
.maru-footer-menu a:focus,
.maru-footer-menu a:active {

    color: #faf8eb !important;

    background: transparent !important;

    background-color: transparent !important;

    opacity: .65;
}


/* =========================================================
   =========================================================
                        CONTATO
   =========================================================
========================================================= */

.maru-footer-whatsapp,
.maru-footer-whatsapp:visited {

    display: flex;

    flex-direction: column;


    /* =====================================================
       >>> DISTÂNCIA WHATSAPP → EMAIL <<<
    ====================================================== */

    margin:
        0
        0
        2px !important;


    padding: 0 !important;


    font-family:
        "Sora",
        sans-serif !important;


    /* =====================================================
       >>> TAMANHO DO CONTATO <<<
    ====================================================== */

    font-size: 11px !important;


    line-height: 1.25 !important;


    color: #faf8eb !important;


    text-decoration: none !important;


    background: transparent !important;

    background-color: transparent !important;


    border: none !important;

    outline: none !important;

    box-shadow: none !important;
}


/* =========================================================
   WHATSAPP CONCIERGE
========================================================= */

.maru-footer-whatsapp strong {

    font-family:
        "Sora",
        sans-serif !important;

    font-weight: 600 !important;

    color: #faf8eb !important;
}


/* =========================================================
   TELEFONE
========================================================= */

.maru-footer-whatsapp span {

    font-family:
        "Sora",
        sans-serif !important;

    font-weight: 500 !important;

    color: #faf8eb !important;
}


/* =========================================================
   EMAIL
========================================================= */

.maru-footer-email,
.maru-footer-email:visited {

    display: inline-block;


    /* =====================================================
       >>> DISTÂNCIA DO EMAIL <<<

       0px = mais próximo
       4px = ATUAL
       8px = mais distante
    ====================================================== */

    margin-top: 4px !important;


    padding: 0 !important;


    font-family:
        "Sora",
        sans-serif !important;


    font-size: 11px !important;


    font-weight: 500 !important;


    line-height: 1.3 !important;


    color: #faf8eb !important;


    text-decoration: none !important;


    background: transparent !important;

    background-color: transparent !important;
}


/* =========================================================
   HOVER CONTATO
========================================================= */

.maru-footer-whatsapp:hover,
.maru-footer-whatsapp:focus,
.maru-footer-whatsapp:active,

.maru-footer-email:hover,
.maru-footer-email:focus,
.maru-footer-email:active {

    color: #faf8eb !important;

    background: transparent !important;

    background-color: transparent !important;

    opacity: .65;
}


/* =========================================================
   =========================================================
                    PARTE INFERIOR
   =========================================================
========================================================= */

.maru-footer-bottom {

    /* =====================================================
       >>> DISTÂNCIA ATÉ COPYRIGHT <<<

       35px = mais alto
       45px = ATUAL
       55px = mais baixo
       65px = bem baixo
    ====================================================== */

    margin-top: 45px;


    display: flex;

    align-items: center;

    justify-content: center;

    flex-wrap: wrap;


    /* =====================================================
       >>> DISTÂNCIA COPYRIGHT → POLÍTICA <<<
    ====================================================== */

    gap: 24px;


    text-align: center;


    /* =====================================================
       >>> CORRIGIDO PARA SORA <<<
    ====================================================== */

    font-family:
        "Sora",
        sans-serif !important;


    /* =====================================================
       >>> TAMANHO DO COPYRIGHT <<<

       7px = menor
       8px = ATUAL
       9px = maior
    ====================================================== */

    font-size: 8px !important;


    font-weight: 500 !important;


    line-height: 1.4 !important;


    color: #faf8eb !important;
}


/* =========================================================
   TEXTO COPYRIGHT
========================================================= */

.maru-footer-bottom span {

    margin: 0 !important;

    padding: 0 !important;

    color: #faf8eb !important;

    font-family:
        "Sora",
        sans-serif !important;
}


/* =========================================================
   POLÍTICA
========================================================= */

.maru-footer-bottom a,
.maru-footer-bottom a:visited {

    margin: 0 !important;

    padding: 0 !important;


    color: #faf8eb !important;


    /* CORRIGIDO PARA SORA */

    font-family:
        "Sora",
        sans-serif !important;


    font-size: 8px !important;


    font-weight: 500 !important;


    text-decoration: none !important;


    background: transparent !important;

    background-color: transparent !important;
}


/* =========================================================
   HOVER POLÍTICA
========================================================= */

.maru-footer-bottom a:hover,
.maru-footer-bottom a:focus,
.maru-footer-bottom a:active {

    color: #faf8eb !important;

    opacity: .65;

    background: transparent !important;
}


/* =========================================================
   =========================================================
                    DESKTOP GRANDE
                       1440PX+
   =========================================================
========================================================= */

@media (min-width: 1440px) {


    .maru-footer-container {

        /* =================================================
           >>> LARGURA DESKTOP GRANDE <<<

           NÃO USAMOS MAIS max-width: 1180px

           Assim o conteúdo acompanha melhor
           o tamanho da viewport e o zoom.
        ================================================= */

        width: 88% !important;

        max-width: none !important;

        padding-left: 0 !important;

        padding-right: 0 !important;
    }


    .maru-footer-top {

        /* =================================================
           >>> DISTÂNCIA ENTRE COLUNAS <<<

           70px = mínimo
           6vw  = variável
           140px = máximo
        ================================================= */

        column-gap: clamp(
            70px,
            6vw,
            140px
        );
    }


    /* =====================================================
       >>> POSIÇÃO DA COLUNA DA LOGO <<<

       -15px = ATUAL
       -20px = mais para cima
       -25px = ainda mais para cima
    ====================================================== */

    .maru-footer-brand {

        top: -15px !important;
    }


    /* =====================================================
       >>> LOGO DESKTOP GRANDE <<<
    ====================================================== */

    .maru-footer-logo {

        width: 135px;
    }

}


/* =========================================================
   =========================================================
                          TABLET
                     768PX — 1024PX
   =========================================================
========================================================= */

@media
(max-width: 1024px)
and
(min-width: 768px) {


    .maru-footer-container {

        /* =================================================
           NO TABLET USAMOS LARGURA MENOR
           PARA NÃO ENCOSTAR NAS BORDAS
        ================================================= */

        width: 92% !important;

        max-width: none !important;


        padding:
            55px
            0
            22px;
    }


    .maru-footer-top {

        grid-template-columns:
            1fr
            1fr
            1fr;


        column-gap: clamp(
            25px,
            4vw,
            45px
        );
    }


    /* =====================================================
       POSIÇÃO DA LOGO TABLET
    ====================================================== */

    .maru-footer-brand {

        position: relative !important;

        top: -8px !important;

        transform: none !important;
    }


    /* =====================================================
       LOGO TABLET
    ====================================================== */

    .maru-footer-logo {

        width: 112px;
    }


    /* =====================================================
       LOGO → TEXTO TABLET
    ====================================================== */

    .maru-footer-descricao {

        margin-top: 8px !important;

        font-size: 11px !important;
    }


    /* =====================================================
       TEXTO → ÍCONES TABLET
    ====================================================== */

    .maru-footer-social {

        margin-top: 8px !important;
    }


    /* =====================================================
       TÍTULOS
    ====================================================== */

    .maru-footer-titulo {

        font-size: 13px !important;

        margin-bottom: 16px !important;
    }


    /* =====================================================
       LINKS
    ====================================================== */

    .maru-footer-menu a {

        font-size: 10px !important;
    }


    /* =====================================================
       CONTATO
    ====================================================== */

    .maru-footer-whatsapp,
    .maru-footer-email {

        font-size: 10px !important;
    }


    /* =====================================================
       COPYRIGHT
    ====================================================== */

    .maru-footer-bottom {

        margin-top: 40px;
    }

}


/* =========================================================
   =========================================================
                          MOBILE
                        ATÉ 767PX
   =========================================================
========================================================= */

@media (max-width: 767px) {


    .maru-footer-container {

        /* =================================================
           >>> LARGURA MOBILE <<<

           100% com padding lateral.
        ================================================= */

        width: 100% !important;

        max-width: none !important;


        padding:
            40px
            25px
            24px;
    }


    /* =====================================================
       UMA COLUNA
    ====================================================== */

    .maru-footer-top {

        grid-template-columns: 1fr;

        column-gap: 0;

        row-gap: 34px;
    }


    /* =====================================================
       POSIÇÃO DA COLUNA DA LOGO MOBILE
    ====================================================== */

    .maru-footer-brand {

        position: relative !important;

        top: 0 !important;

        transform: none !important;
    }


    /* =====================================================
       LOGO MOBILE
    ====================================================== */

    .maru-footer-logo {

        width: 115px;
    }


    /* =====================================================
       LOGO → TEXTO MOBILE
    ====================================================== */

    .maru-footer-descricao {

        margin-top: 8px !important;


        font-size: 12px !important;


        line-height: 1.4 !important;
    }


    /* =====================================================
       TEXTO → ÍCONES MOBILE
    ====================================================== */

    .maru-footer-social {

        margin-top: 9px !important;
    }


    /* =====================================================
       ÍCONES MOBILE
    ====================================================== */

    .maru-footer-social i {

        font-size: 18px !important;
    }


    /* =====================================================
       TÍTULOS
    ====================================================== */

    .maru-footer-titulo {

        font-size: 13px !important;

        margin-bottom: 17px !important;
    }


    /* =====================================================
       LINKS
    ====================================================== */

    .maru-footer-menu {

        gap: 7px;
    }


    .maru-footer-menu a {

        font-size: 11px !important;
    }


    /* =====================================================
       CONTATO
    ====================================================== */

    .maru-footer-whatsapp,
    .maru-footer-email {

        font-size: 11px !important;
    }


    /* =====================================================
       COPYRIGHT MOBILE
    ====================================================== */

    .maru-footer-bottom {

        margin-top: 38px;


        flex-direction: column;


        align-items: flex-start;


        justify-content: flex-start;


        text-align: left;


        gap: 8px;


        font-size: 8px !important;
    }

}


/* =========================================================
   =========================================================
                   CELULAR PEQUENO
                      ATÉ 420PX
   =========================================================
========================================================= */

@media (max-width: 420px) {


    .maru-footer-container {

        width: 100% !important;


        padding:
            38px
            22px
            22px;
    }


    /* =====================================================
       POSIÇÃO LOGO
    ====================================================== */

    .maru-footer-brand {

        top: 0 !important;
    }


    /* =====================================================
       LOGO
    ====================================================== */

    .maru-footer-logo {

        width: 112px;
    }


    /* =====================================================
       LOGO → TEXTO
    ====================================================== */

    .maru-footer-descricao {

        margin-top: 8px !important;

        font-size: 11px !important;
    }


    /* =====================================================
       TEXTO → ÍCONES
    ====================================================== */

    .maru-footer-social {

        margin-top: 8px !important;
    }


    /* =====================================================
       DISTÂNCIA ENTRE BLOCOS
    ====================================================== */

    .maru-footer-top {

        row-gap: 32px;
    }


    /* =====================================================
       COPYRIGHT
    ====================================================== */

    .maru-footer-bottom {

        margin-top: 35px;
    }

}/* End custom CSS */