.elementor-829 .elementor-element.elementor-element-25f5a74f{--display:flex;--min-height:154px;--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;--margin-top:-28px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:51px;--padding-left:0px;--padding-right:0px;}.elementor-829 .elementor-element.elementor-element-25f5a74f:not(.elementor-motion-effects-element-type-background), .elementor-829 .elementor-element.elementor-element-25f5a74f > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#5F4B40;}.elementor-829 .elementor-element.elementor-element-9e28974{--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;}.elementor-829 .elementor-element.elementor-element-4726416{--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;}.elementor-829 .elementor-element.elementor-element-4726416:not(.elementor-motion-effects-element-type-background), .elementor-829 .elementor-element.elementor-element-4726416 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FAF8EB;background-image:url("https://marugastrobar.com.br/wp-content/uploads/2026/09/marubar-scaled.webp");background-position:center center;background-repeat:no-repeat;background-size:cover;}.elementor-829 .elementor-element.elementor-element-0a54175{--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;}.elementor-829 .elementor-element.elementor-element-0a54175:not(.elementor-motion-effects-element-type-background), .elementor-829 .elementor-element.elementor-element-0a54175 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FAF8EB;}.elementor-829 .elementor-element.elementor-element-52f9f3e{--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;}.elementor-829 .elementor-element.elementor-element-52f9f3e:not(.elementor-motion-effects-element-type-background), .elementor-829 .elementor-element.elementor-element-52f9f3e > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FAF8EB;}.elementor-829 .elementor-element.elementor-element-fcb6b98{--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;}.elementor-829 .elementor-element.elementor-element-fcb6b98:not(.elementor-motion-effects-element-type-background), .elementor-829 .elementor-element.elementor-element-fcb6b98 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#525E3A;}@media(min-width:768px){.elementor-829 .elementor-element.elementor-element-4726416{--content-width:1600px;}.elementor-829 .elementor-element.elementor-element-0a54175{--content-width:1600px;}.elementor-829 .elementor-element.elementor-element-52f9f3e{--content-width:1600px;}.elementor-829 .elementor-element.elementor-element-fcb6b98{--content-width:1600px;}}@media(max-width:767px){.elementor-829 .elementor-element.elementor-element-9e28974:not(.elementor-motion-effects-element-type-background), .elementor-829 .elementor-element.elementor-element-9e28974 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://marugastrobar.com.br/wp-content/uploads/2026/09/marubarcel.webp");background-position:center center;background-repeat:no-repeat;background-size:cover;}.elementor-829 .elementor-element.elementor-element-9e28974{--min-height:281px;}.elementor-829 .elementor-element.elementor-element-4726416:not(.elementor-motion-effects-element-type-background), .elementor-829 .elementor-element.elementor-element-4726416 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://marugastrobar.com.br/wp-content/uploads/2026/09/begecel01.webp");}.elementor-829 .elementor-element.elementor-element-0a54175{--margin-top:-36px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}}/* Start custom CSS for html, class: .elementor-element-3d8b054 *//* =========================================================
   =========================================================
              CONTATO & LOCALIZAÇÃO — MARÚ
   =========================================================

   AJUSTE ATUAL:

   ✓ DESKTOP = conteúdo mais para a esquerda
   ✓ TABLET = preservado
   ✓ MOBILE = preservado
   ✓ CELULAR PEQUENO = preservado

========================================================= */


/* =========================================================
   SEÇÃO PRINCIPAL
========================================================= */

.maru-contato-localizacao {

    width: 100% !important;
    max-width: none !important;

    height: auto !important;
    min-height: 0 !important;

    margin: 0 !important;

    /* =====================================================
       >>> ESPAÇAMENTO VERTICAL DA SEÇÃO <<<
    ====================================================== */

    padding: 70px 0 !important;

    /* >>> FUNDO <<< */

    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;

    box-sizing: border-box !important;
    overflow: visible !important;
}


/* =========================================================
   REMOVE QUALQUER OVERLAY
========================================================= */

.maru-contato-localizacao::before,
.maru-contato-localizacao::after {

    content: none !important;
    display: none !important;

    background: none !important;
    background-image: none !important;
}


/* =========================================================
   CONTAINER PRINCIPAL
========================================================= */

.maru-contato-localizacao-container {

    width: 88% !important;
    max-width: none !important;

    height: auto !important;
    min-height: 0 !important;

    margin: 0 auto !important;
    padding: 0 !important;

    display: block !important;

    box-sizing: border-box !important;
}


/* =========================================================
   BLOCO DO CONTEÚDO
========================================================= */

.maru-contato-localizacao-conteudo {

    width: 100% !important;
    max-width: 650px !important;

    height: auto !important;
    min-height: 0 !important;

    margin: 0 !important;
    padding: 0 !important;

    display: flex !important;
    flex-direction: column !important;

    align-items: flex-start !important;
    justify-content: flex-start !important;

    text-align: left !important;

    box-sizing: border-box !important;
}


/* =========================================================
   =========================================================
                         LABEL
   =========================================================
========================================================= */

.maru-contato-localizacao-label {

    display: flex !important;

    align-items: center !important;
    justify-content: flex-start !important;

    /* >>> ESPAÇO ENTRE TEXTO E RISQUINHO <<< */

    gap: 14px !important;

    /* >>> ESPAÇO ENTRE LABEL E TÍTULO <<< */

    margin: 0 0 18px !important;

    padding: 0 !important;
}


/* =========================================================
   TEXTO DA LABEL
========================================================= */

.maru-contato-localizacao-label-texto {

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

    /* >>> TAMANHO DA LABEL <<< */

    font-size: 10px !important;

    font-weight: 500 !important;

    line-height: 1.2 !important;

    letter-spacing: .7px !important;

    text-transform: uppercase !important;

    /* >>> COR <<< */

    color: #5f4b40 !important;

    white-space: nowrap !important;
}


/* =========================================================
   RISQUINHO DA LABEL
========================================================= */

.maru-contato-localizacao-label-linha {

    display: block !important;

    /* >>> COMPRIMENTO <<< */

    width: 40px !important;
    flex: 0 0 40px !important;

    /* >>> ESPESSURA <<< */

    height: 1px !important;

    /* >>> COR <<< */

    background: rgba(82, 94, 58, .45) !important;
}


/* =========================================================
   =========================================================
                         TÍTULO
   =========================================================
========================================================= */

.maru-contato-localizacao-titulo {

    width: max-content !important;
    max-width: none !important;

    margin: 0 0 22px !important;
    padding: 0 !important;

    /* >>> FONTE <<< */

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

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

       ALTERE AQUI SE QUISER:

       44px = menor
       50px = médio
       56px = atual
    ====================================================== */

    font-size: clamp(
        44px,
        3.5vw,
        56px
    ) !important;

    font-weight: 400 !important;

    line-height: 1.02 !important;

    letter-spacing: 0 !important;

    /* >>> COR <<< */

    color: #525e3a !important;

    /* NÃO DEIXA "LOCALIZAÇÃO" QUEBRAR */

    white-space: nowrap !important;
}


/* =========================================================
   DESCRIÇÃO
========================================================= */

.maru-contato-localizacao-descricao {

    width: 100% !important;
    max-width: 390px !important;

    margin: 0 !important;
    padding: 0 !important;

    /* >>> FONTE <<< */

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

    /* >>> TAMANHO <<< */

    font-size: 13px !important;

    font-weight: 400 !important;

    line-height: 1.75 !important;

    /* >>> COR <<< */

    color: #5f4b40 !important;
}


/* =========================================================
   =========================================================
              DESKTOP — SOMENTE DESKTOP
   =========================================================

   >>> AJUSTE IMPORTANTE FEITO AQUI <<<

   ANTES:
   width: 88%;
   margin: 0 auto;

   Isso criava aproximadamente:
   6% de margem de cada lado.

   AGORA:
   width: 92%;
   margin-left: 4%;
   margin-right: 4%;

   Resultado:
   conteúdo 2% mais para a esquerda.

   >>> NÃO ALTERA O CELULAR <<<

========================================================= */

@media (min-width: 1025px) {

    .maru-contato-localizacao-container {

        /* =================================================
           >>> ALINHAMENTO HORIZONTAL DESKTOP <<<

           ATUAL = 4%

           MAIS PARA A ESQUERDA:
           3.5%
           3%
           2.5%

           MAIS PARA A DIREITA:
           4.5%
           5%
           5.5%
        ================================================= */

        width: 92% !important;

        max-width: none !important;

        margin-left: 4% !important;
        margin-right: 4% !important;

        padding: 0 !important;
    }


    .maru-contato-localizacao-conteudo {

        width: 100% !important;

        max-width: 650px !important;

        margin: 0 !important;

        padding: 0 !important;

        /* >>> SEM TRANSFORM / SEM DESLOCAMENTO FALSO <<< */

        transform: none !important;
    }

}


/* =========================================================
   =========================================================
                   DESKTOP GRANDE — 1440+
   =========================================================
========================================================= */

@media (min-width: 1440px) {

    .maru-contato-localizacao {

        /* >>> ESPAÇAMENTO VERTICAL <<< */

        padding: 78px 0 !important;
    }


    .maru-contato-localizacao-container {

        /* =================================================
           IMPORTANTE:

           MANTÉM O MESMO ALINHAMENTO DE 4%
           DO DESKTOP NORMAL.

           NÃO VOLTAR PARA 88%.
        ================================================= */

        width: 92% !important;

        max-width: none !important;

        margin-left: 4% !important;
        margin-right: 4% !important;

        padding: 0 !important;
    }


    .maru-contato-localizacao-conteudo {

        max-width: 700px !important;

        transform: none !important;
    }


    .maru-contato-localizacao-titulo {

        /* >>> TAMANHO DO TÍTULO EM TELAS GRANDES <<< */

        font-size: 58px !important;

        line-height: 1.02 !important;

        white-space: nowrap !important;
    }


    .maru-contato-localizacao-descricao {

        font-size: 13px !important;
    }

}


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

   >>> PRESERVADO <<<

========================================================= */

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

    .maru-contato-localizacao {

        padding: 60px 0 !important;
    }


    .maru-contato-localizacao-container {

        width: 90% !important;

        max-width: none !important;

        margin: 0 auto !important;

        padding: 0 !important;
    }


    .maru-contato-localizacao-conteudo {

        width: 100% !important;

        max-width: 100% !important;

        margin: 0 !important;

        transform: none !important;
    }


    /* =====================================================
       LABEL TABLET
    ====================================================== */

    .maru-contato-localizacao-label {

        gap: 12px !important;

        margin-bottom: 17px !important;
    }


    .maru-contato-localizacao-label-texto {

        font-size: 9.5px !important;
    }


    .maru-contato-localizacao-label-linha {

        width: 36px !important;

        flex: 0 0 36px !important;
    }


    /* =====================================================
       TÍTULO TABLET
    ====================================================== */

    .maru-contato-localizacao-titulo {

        font-size: 48px !important;

        line-height: 1.02 !important;

        margin-bottom: 21px !important;

        white-space: nowrap !important;
    }


    /* =====================================================
       DESCRIÇÃO TABLET
    ====================================================== */

    .maru-contato-localizacao-descricao {

        font-size: 12.5px !important;

        line-height: 1.7 !important;
    }

}


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

   >>> NÃO ALTERADO <<<
   >>> MANTIDO COMO ESTAVA <<<

========================================================= */

@media (max-width: 767px) {

    .maru-contato-localizacao {

        padding: 48px 0 !important;
    }


    .maru-contato-localizacao-container {

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

        width: 90% !important;

        max-width: none !important;

        margin: 0 auto !important;

        padding: 0 !important;
    }


    .maru-contato-localizacao-conteudo {

        width: 100% !important;

        max-width: 100% !important;

        margin: 0 !important;

        padding: 0 !important;

        transform: none !important;
    }


    /* =====================================================
       LABEL MOBILE
    ====================================================== */

    .maru-contato-localizacao-label {

        gap: 10px !important;

        margin-bottom: 16px !important;
    }


    .maru-contato-localizacao-label-texto {

        font-size: 9px !important;

        letter-spacing: .6px !important;
    }


    .maru-contato-localizacao-label-linha {

        width: 32px !important;

        flex: 0 0 32px !important;
    }


    /* =====================================================
       TÍTULO MOBILE
    ====================================================== */

    .maru-contato-localizacao-titulo {

        width: max-content !important;

        max-width: none !important;

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

        font-size: 39px !important;

        line-height: 1.03 !important;

        white-space: nowrap !important;

        margin-bottom: 20px !important;
    }


    /* =====================================================
       DESCRIÇÃO MOBILE
    ====================================================== */

    .maru-contato-localizacao-descricao {

        width: 100% !important;

        max-width: 350px !important;

        font-size: 12px !important;

        line-height: 1.7 !important;
    }


    /* =====================================================
       REMOVE QUEBRA FORÇADA DA DESCRIÇÃO NO MOBILE
    ====================================================== */

    .maru-contato-localizacao-desktop-br {

        display: none !important;
    }

}


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

   >>> NÃO ALTERADO <<<

========================================================= */

@media (max-width: 420px) {

    .maru-contato-localizacao {

        padding: 42px 0 !important;
    }


    .maru-contato-localizacao-container {

        width: 89% !important;

        margin: 0 auto !important;
    }


    /* =====================================================
       LABEL
    ====================================================== */

    .maru-contato-localizacao-label {

        gap: 9px !important;
    }


    .maru-contato-localizacao-label-texto {

        font-size: 8.5px !important;

        letter-spacing: .5px !important;
    }


    .maru-contato-localizacao-label-linha {

        width: 28px !important;

        flex: 0 0 28px !important;
    }


    /* =====================================================
       TÍTULO CELULAR PEQUENO
    ====================================================== */

    .maru-contato-localizacao-titulo {

        font-size: 34px !important;

        line-height: 1.03 !important;

        white-space: nowrap !important;

        margin-bottom: 19px !important;
    }


    /* =====================================================
       DESCRIÇÃO
    ====================================================== */

    .maru-contato-localizacao-descricao {

        font-size: 11.5px !important;

        line-height: 1.7 !important;
    }

}


/* =========================================================
   =========================================================
                 CELULAR MUITO PEQUENO
                      ATÉ 360PX

   >>> NÃO ALTERADO <<<

========================================================= */

@media (max-width: 360px) {

    .maru-contato-localizacao-titulo {

        font-size: 31px !important;

        white-space: nowrap !important;
    }

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-60cb615 *//* =========================================================
   =========================================================
                    LOCALIZAÇÃO — MARÚ
   =========================================================

   VERSÃO COMPACTA / CLEAN

   DESKTOP:
   [ INFORMAÇÕES ][ MAPA ]

   MOBILE:
   [ INFORMAÇÕES ]
   [ MAPA        ]

   PRINCIPAL ALTERAÇÃO:
   ✓ MAPA MAIS BAIXO
   ✓ CONTEÚDO MAIS COMPACTO
   ✓ MENOS ESPAÇO VERTICAL

========================================================= */


/* =========================================================
   SEÇÃO
========================================================= */

.maru-localizacao {

    width: 100% !important;
    max-width: none !important;

    margin: 0 !important;
    padding: 0 !important;

    background: #faf8eb !important;
    background-color: #faf8eb !important;

    box-sizing: border-box !important;

    overflow: hidden !important;
}


/* =========================================================
   CONTAINER PRINCIPAL
========================================================= */

.maru-localizacao-container {

    width: 100% !important;
    max-width: none !important;

    margin: 0 !important;
    padding: 0 !important;

    display: grid !important;


    /* =====================================================
       >>> PROPORÇÃO DESKTOP <<<

       34% = informações
       66% = mapa
    ====================================================== */

    grid-template-columns:
        34%
        66% !important;

    align-items: stretch !important;

    box-sizing: border-box !important;
}


/* =========================================================
   =========================================================
                    LADO ESQUERDO
   =========================================================
========================================================= */

.maru-localizacao-conteudo {

    width: 100% !important;

    display: flex !important;

    flex-direction: column !important;

    align-items: flex-start !important;

    justify-content: center !important;


    /* =====================================================
       >>> COMPACTAMOS AQUI <<<

       ANTES:
       55px 12%

       AGORA:
       34px 12%

       Isso reduz bastante a altura da seção.
    ====================================================== */

    padding:
        34px
        12% !important;

    background: #faf8eb !important;

    box-sizing: border-box !important;
}


/* =========================================================
   LABEL
========================================================= */

.maru-localizacao-label {

    display: flex !important;

    flex-direction: column !important;

    align-items: flex-start !important;

    justify-content: flex-start !important;


    /* >>> MENOS ESPAÇO ATÉ O ENDEREÇO <<< */

    margin: 0 0 20px !important;
}


/* =========================================================
   TEXTO LOCALIZAÇÃO
========================================================= */

.maru-localizacao-label-texto {

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

    font-size: 10px !important;

    font-weight: 600 !important;

    line-height: 1.2 !important;

    letter-spacing: .7px !important;

    text-transform: uppercase !important;

    color: #525e3a !important;
}


/* =========================================================
   RISQUINHO
========================================================= */

.maru-localizacao-label-linha {

    display: block !important;

    /* >>> DISTÂNCIA DO TEXTO <<< */
    margin-top: 9px !important;

    /* >>> COMPRIMENTO <<< */
    width: 28px !important;

    /* >>> ESPESSURA <<< */
    height: 1px !important;

    background:
        rgba(82, 94, 58, .35) !important;
}


/* =========================================================
   ENDEREÇO
========================================================= */

.maru-localizacao-endereco {

    width: 100% !important;

    display: flex !important;

    align-items: flex-start !important;

    justify-content: flex-start !important;

    /* >>> ÍCONE / TEXTO <<< */
    gap: 13px !important;

    /* >>> ANTES ERA 30px <<< */
    margin: 0 0 20px !important;
}


/* =========================================================
   ÍCONE PIN
========================================================= */

.maru-localizacao-pin {

    /* >>> UM POUCO MENOR <<< */

    width: 23px !important;

    height: 23px !important;

    flex: 0 0 23px !important;

    color: #697057 !important;

    margin-top: 1px !important;
}


/* =========================================================
   SVG PIN
========================================================= */

.maru-localizacao-pin svg {

    display: block !important;

    width: 100% !important;

    height: 100% !important;

    fill: none !important;

    stroke: currentColor !important;

    stroke-width: 1.7 !important;

    stroke-linecap: round !important;

    stroke-linejoin: round !important;
}


/* =========================================================
   BLOCO ENDEREÇO
========================================================= */

.maru-localizacao-endereco-texto {

    display: flex !important;

    flex-direction: column !important;

    align-items: flex-start !important;

    /* >>> MAIS COMPACTO <<< */

    gap: 4px !important;
}


/* =========================================================
   ENDEREÇO PRINCIPAL
========================================================= */

.maru-localizacao-endereco-texto strong {

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

    font-size: 10.5px !important;

    font-weight: 600 !important;

    line-height: 1.35 !important;

    color: #5f4b40 !important;
}


/* =========================================================
   BAIRRO / CEP
========================================================= */

.maru-localizacao-endereco-texto span {

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

    font-size: 9.5px !important;

    font-weight: 400 !important;

    line-height: 1.4 !important;

    color: #5f4b40 !important;
}


/* =========================================================
   DESCRIÇÃO
========================================================= */

.maru-localizacao-descricao {

    width: 100% !important;

    max-width: 300px !important;


    /* =====================================================
       >>> ANTES: 28px EMBAIXO
       >>> AGORA: 20px
    ====================================================== */

    margin: 0 0 20px !important;

    padding: 0 !important;

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

    font-size: 9.5px !important;

    font-weight: 400 !important;


    /* >>> UM POUCO MAIS COMPACTO <<< */

    line-height: 1.7 !important;

    color: #5f4b40 !important;
}


/* =========================================================
   BOTÕES
========================================================= */

.maru-localizacao-botoes {

    width: 100% !important;

    display: flex !important;

    flex-direction: column !important;

    align-items: flex-start !important;


    /* >>> MENOR ESPAÇO ENTRE BOTÕES <<< */

    gap: 8px !important;
}


/* =========================================================
   BOTÃO
========================================================= */

.maru-localizacao-botao,
.maru-localizacao-botao:visited,
.maru-localizacao-botao:focus,
.maru-localizacao-botao:active {

    /* =====================================================
       >>> BOTÃO MAIS COMPACTO <<<

       ANTES:
       190px × 42px

       AGORA:
       180px × 38px
    ====================================================== */

    width: 180px !important;

    height: 38px !important;

    display: grid !important;

    grid-template-columns:
        22px
        1fr
        12px !important;

    align-items: center !important;

    column-gap: 8px !important;

    padding:
        0
        12px !important;

    background: transparent !important;
    background-color: transparent !important;

    border:
        1px solid
        rgba(95, 75, 64, .36) !important;

    border-radius: 0 !important;

    text-decoration: none !important;

    outline: none !important;

    box-shadow: none !important;

    box-sizing: border-box !important;

    transition:
        background-color .25s ease,
        border-color .25s ease,
        color .25s ease !important;
}


/* =========================================================
   ÍCONE BOTÃO
========================================================= */

.maru-localizacao-botao-icone {

    width: 18px !important;

    height: 18px !important;

    color: #7d826c !important;
}


.maru-localizacao-botao-icone svg {

    display: block !important;

    width: 100% !important;

    height: 100% !important;

    fill: none !important;

    stroke: currentColor !important;

    stroke-width: 1.6 !important;

    stroke-linecap: round !important;

    stroke-linejoin: round !important;
}


/* =========================================================
   TEXTO BOTÃO
========================================================= */

.maru-localizacao-botao-texto {

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

    font-size: 7.5px !important;

    font-weight: 600 !important;

    line-height: 1 !important;

    letter-spacing: .5px !important;

    text-transform: uppercase !important;

    color: #5f4b40 !important;

    text-align: left !important;
}


/* =========================================================
   ÍCONE ↗
========================================================= */

.maru-localizacao-externo {

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

    font-size: 10px !important;

    line-height: 1 !important;

    color: #7d826c !important;

    transition:
        transform .25s ease !important;
}


/* =========================================================
   HOVER BOTÃO
========================================================= */

.maru-localizacao-botao:hover {

    background: #525e3a !important;

    background-color: #525e3a !important;

    border-color: #525e3a !important;

    text-decoration: none !important;
}


.maru-localizacao-botao:hover
.maru-localizacao-botao-texto {

    color: #faf8eb !important;
}


.maru-localizacao-botao:hover
.maru-localizacao-botao-icone,
.maru-localizacao-botao:hover
.maru-localizacao-externo {

    color: #faf8eb !important;
}


.maru-localizacao-botao:hover
.maru-localizacao-externo {

    transform:
        translate(
            2px,
            -2px
        ) !important;
}


/* =========================================================
   =========================================================
                    MAPA — COMPACTO
   =========================================================

   ESTE É O PRINCIPAL AJUSTE.

========================================================= */

.maru-localizacao-mapa {

    width: 100% !important;


    /* =====================================================
       >>> ALTURA DO MAPA DESKTOP <<<

       ANTES = 430px
       AGORA = 330px

       PARA DEIXAR AINDA MENOR:
       300px

       PARA AUMENTAR:
       360px
    ====================================================== */

    height: 330px !important;

    min-height: 330px !important;

    position: relative !important;

    overflow: hidden !important;

    background: #25251f !important;

    box-sizing: border-box !important;
}


/* =========================================================
   IMAGEM DO MAPA
========================================================= */

.maru-localizacao-mapa img {

    display: block !important;

    width: 100% !important;

    height: 330px !important;

    min-height: 330px !important;

    object-fit: cover !important;


    /* =====================================================
       >>> ENQUADRAMENTO <<<

       Se o ponto do mapa ficar cortado,
       altere aqui.

       center center = ATUAL
    ====================================================== */

    object-position:
        center center !important;

    margin: 0 !important;

    padding: 0 !important;
}


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

@media (min-width: 1440px) {

    .maru-localizacao-container {

        grid-template-columns:
            32%
            68% !important;
    }


    .maru-localizacao-conteudo {

        /* =================================================
           >>> ANTES ERA 60px <<<
           >>> AGORA 36px <<<
        ================================================= */

        padding:
            36px
            12% !important;
    }


    /* =====================================================
       MAPA DESKTOP GRANDE

       ANTES = 460px
       AGORA = 350px
    ====================================================== */

    .maru-localizacao-mapa {

        height: 350px !important;

        min-height: 350px !important;
    }


    .maru-localizacao-mapa img {

        height: 350px !important;

        min-height: 350px !important;
    }
}


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

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

    .maru-localizacao-container {

        grid-template-columns:
            42%
            58% !important;
    }


    .maru-localizacao-conteudo {

        /* >>> MAIS COMPACTO <<< */

        padding:
            32px
            9% !important;
    }


    .maru-localizacao-descricao {

        font-size: 9px !important;

        line-height: 1.65 !important;
    }


    /* =====================================================
       MAPA TABLET

       ANTES = 430px
       AGORA = 330px
    ====================================================== */

    .maru-localizacao-mapa {

        height: 330px !important;

        min-height: 330px !important;
    }


    .maru-localizacao-mapa img {

        height: 330px !important;

        min-height: 330px !important;
    }


    .maru-localizacao-botao,
    .maru-localizacao-botao:visited,
    .maru-localizacao-botao:focus,
    .maru-localizacao-botao:active {

        width: 170px !important;

        height: 37px !important;
    }
}


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

@media (max-width: 767px) {

    .maru-localizacao-container {

        grid-template-columns:
            1fr !important;
    }


    /* =====================================================
       CONTEÚDO MOBILE MAIS COMPACTO
    ====================================================== */

    .maru-localizacao-conteudo {

        padding:
            32px
            6% !important;
    }


    .maru-localizacao-label {

        margin-bottom: 19px !important;
    }


    .maru-localizacao-label-texto {

        font-size: 9px !important;
    }


    .maru-localizacao-endereco {

        gap: 12px !important;

        margin-bottom: 19px !important;
    }


    .maru-localizacao-pin {

        width: 22px !important;

        height: 22px !important;

        flex: 0 0 22px !important;
    }


    .maru-localizacao-endereco-texto strong {

        font-size: 10px !important;
    }


    .maru-localizacao-endereco-texto span {

        font-size: 9px !important;
    }


    .maru-localizacao-descricao {

        max-width: 340px !important;

        font-size: 9.5px !important;

        line-height: 1.65 !important;

        margin-bottom: 20px !important;
    }


    .maru-localizacao-botao,
    .maru-localizacao-botao:visited,
    .maru-localizacao-botao:focus,
    .maru-localizacao-botao:active {

        width: 180px !important;

        height: 38px !important;
    }


    /* =====================================================
       MAPA MOBILE

       ANTES = 300px
       AGORA = 230px
    ====================================================== */

    .maru-localizacao-mapa {

        width: 100% !important;

        height: 230px !important;

        min-height: 230px !important;
    }


    .maru-localizacao-mapa img {

        width: 100% !important;

        height: 230px !important;

        min-height: 230px !important;
    }
}


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

@media (max-width: 420px) {

    .maru-localizacao-conteudo {

        padding:
            29px
            7% !important;
    }


    .maru-localizacao-label-texto {

        font-size: 8.5px !important;
    }


    .maru-localizacao-endereco-texto strong {

        font-size: 9.5px !important;
    }


    .maru-localizacao-endereco-texto span {

        font-size: 8.7px !important;
    }


    .maru-localizacao-descricao {

        font-size: 9px !important;
    }


    /* =====================================================
       MAPA CELULAR PEQUENO

       ANTES = 260px
       AGORA = 210px
    ====================================================== */

    .maru-localizacao-mapa {

        height: 210px !important;

        min-height: 210px !important;
    }


    .maru-localizacao-mapa img {

        height: 210px !important;

        min-height: 210px !important;
    }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-0e5e76b *//* =========================================================
   =========================================================
                CONTATOS / INFORMAÇÕES — MARÚ
   =========================================================

   ✓ 4 COLUNAS DESKTOP
   ✓ 2 COLUNAS MOBILE
   ✓ DIVISÓRIAS SOMENTE DESKTOP/TABLET
   ✓ ÍCONES SVG
   ✓ WHATSAPP CORRIGIDO
   ✓ SORA NOS TEXTOS
   ✓ FUNDO #faf8eb

========================================================= */


/* =========================================================
   SEÇÃO PRINCIPAL
========================================================= */

.maru-contatos-info {

    width: 100% !important;
    max-width: none !important;

    height: auto !important;
    min-height: 0 !important;

    margin: 0 !important;


    /* >>> ESPAÇAMENTO DA SEÇÃO <<< */

    padding: 42px 0 !important;


    /* =====================================================
       >>> FUNDO <<<

       ATUAL:
       #faf8eb

       PARA TRANSPARENTE:

       background: transparent !important;
       background-color: transparent !important;
       background-image: none !important;
    ====================================================== */

    background: #faf8eb !important;
    background-color: #faf8eb !important;

    box-sizing: border-box !important;

    overflow: hidden !important;
}


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

.maru-contatos-info-container {

    /* >>> LARGURA GERAL <<< */

    width: 94% !important;

    max-width: none !important;

    margin: 0 auto !important;

    padding: 0 !important;


    /* >>> DESKTOP = 4 COLUNAS <<< */

    display: grid !important;

    grid-template-columns:
        repeat(4, minmax(0, 1fr)) !important;

    gap: 0 !important;

    align-items: stretch !important;

    box-sizing: border-box !important;
}


/* =========================================================
   ITEM
========================================================= */

.maru-contatos-info-item {

    position: relative !important;

    width: 100% !important;

    min-width: 0 !important;

    display: flex !important;

    flex-direction: column !important;

    align-items: center !important;

    justify-content: flex-start !important;

    text-align: center !important;


    /* >>> ESPAÇAMENTO INTERNO <<< */

    padding:
        0
        clamp(20px, 3vw, 48px)
        4px !important;

    margin: 0 !important;

    box-sizing: border-box !important;
}


/* =========================================================
   DIVISÓRIA VERTICAL
========================================================= */

.maru-contatos-info-item:not(:last-child)::after {

    content: "" !important;

    display: block !important;

    position: absolute !important;

    right: 0 !important;

    top: 15px !important;

    height: calc(100% - 30px) !important;

    width: 1px !important;

    background:
        rgba(95, 75, 64, .12) !important;
}


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

.maru-contatos-info-icone {

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

       30px = menor
       34px = ATUAL
       40px = maior
    ====================================================== */

    width: 34px !important;

    height: 34px !important;

    flex: 0 0 34px !important;


    /* >>> DISTÂNCIA ATÉ O TÍTULO <<< */

    margin: 0 0 14px !important;


    /* >>> COR <<< */

    color: #7d826c !important;

    box-sizing: border-box !important;
}


/* =========================================================
   SVG

   ESSAS REGRAS SERVEM TAMBÉM PARA
   O NOVO WHATSAPP CORRIGIDO.
========================================================= */

.maru-contatos-info-icone svg {

    display: block !important;

    width: 100% !important;

    height: 100% !important;

    fill: none !important;

    stroke: currentColor !important;


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

       1.4 = mais delicado
       1.6 = atual
       1.8 = mais forte
    ====================================================== */

    stroke-width: 1.6 !important;

    stroke-linecap: round !important;

    stroke-linejoin: round !important;

    overflow: visible !important;
}


/* =========================================================
   TÍTULO
========================================================= */

.maru-contatos-info-titulo {

    margin: 0 0 20px !important;

    padding: 0 !important;

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

    font-size: 9px !important;

    font-weight: 600 !important;

    line-height: 1.3 !important;

    letter-spacing: .6px !important;

    text-transform: uppercase !important;

    color: #525e3a !important;
}


/* =========================================================
   HORÁRIOS
========================================================= */

.maru-contatos-info-horarios {

    width: 100% !important;

    display: flex !important;

    flex-direction: column !important;

    align-items: center !important;

    gap: 12px !important;

    margin: 0 0 17px !important;
}


/* =========================================================
   BLOCO DE HORÁRIO
========================================================= */

.maru-contatos-info-horario {

    display: flex !important;

    flex-direction: column !important;

    align-items: center !important;

    gap: 4px !important;
}


/* =========================================================
   DIA
========================================================= */

.maru-contatos-info-horario strong {

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

    font-size: 8.5px !important;

    font-weight: 600 !important;

    line-height: 1.3 !important;

    letter-spacing: .4px !important;

    color: #5f4b40 !important;

    text-transform: uppercase !important;
}


/* =========================================================
   HORÁRIO
========================================================= */

.maru-contatos-info-horario span {

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

    font-size: 8.5px !important;

    font-weight: 400 !important;

    line-height: 1.4 !important;

    color: #5f4b40 !important;
}


/* =========================================================
   TEXTOS
========================================================= */

.maru-contatos-info-texto {

    margin: 0 !important;

    padding: 0 !important;

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

    font-size: 9px !important;

    font-weight: 400 !important;

    line-height: 1.7 !important;

    color: #5f4b40 !important;
}


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

.maru-contatos-info-email,
.maru-contatos-info-email:visited,
.maru-contatos-info-email:focus,
.maru-contatos-info-email:active {

    display: inline-block !important;

    margin: 0 0 15px !important;

    padding: 0 !important;

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

    font-size: 9px !important;

    font-weight: 500 !important;

    line-height: 1.4 !important;

    color: #5f4b40 !important;

    text-decoration: none !important;

    outline: none !important;

    box-shadow: none !important;

    background: transparent !important;
}


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

.maru-contatos-info-email:hover {

    color: #525e3a !important;

    text-decoration: none !important;

    opacity: .7 !important;
}


/* =========================================================
   BOTÕES
========================================================= */

.maru-contatos-info-botao,
.maru-contatos-info-botao:visited,
.maru-contatos-info-botao:focus,
.maru-contatos-info-botao:active {

    display: inline-flex !important;

    align-items: center !important;

    justify-content: center !important;


    /* >>> DISTÂNCIA TEXTO / ÍCONE <<< */

    gap: 14px !important;


    /* >>> TAMANHO DO BOTÃO <<< */

    min-width: 170px !important;

    height: 38px !important;

    margin-top: 20px !important;

    padding: 0 17px !important;


    /* >>> FUNDO TRANSPARENTE <<< */

    background: transparent !important;

    background-color: transparent !important;


    /* >>> BORDA <<< */

    border:
        1px solid
        rgba(95, 75, 64, .38) !important;

    border-radius: 0 !important;


    /* >>> FONTE <<< */

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

    font-size: 8px !important;

    font-weight: 500 !important;

    line-height: 1 !important;

    letter-spacing: .5px !important;

    text-transform: uppercase !important;

    color: #5f4b40 !important;


    /* REMOVE ELEMENTOR */

    text-decoration: none !important;

    outline: none !important;

    box-shadow: none !important;

    box-sizing: border-box !important;


    transition:
        background-color .25s ease,
        border-color .25s ease,
        color .25s ease !important;
}


/* =========================================================
   HOVER DOS BOTÕES
========================================================= */

.maru-contatos-info-botao:hover {

    background: #525e3a !important;

    background-color: #525e3a !important;

    border-color: #525e3a !important;

    color: #faf8eb !important;

    text-decoration: none !important;

    outline: none !important;

    box-shadow: none !important;
}


/* =========================================================
   ÍCONE ↗
========================================================= */

.maru-contatos-info-botao-icone {

    display: inline-block !important;

    font-size: 12px !important;

    line-height: 1 !important;

    transition:
        transform .25s ease !important;
}


.maru-contatos-info-botao:hover
.maru-contatos-info-botao-icone {

    transform:
        translate(
            2px,
            -2px
        ) !important;
}


/* =========================================================
   DESKTOP GRANDE
========================================================= */

@media (min-width: 1440px) {

    .maru-contatos-info {

        padding: 46px 0 !important;
    }


    .maru-contatos-info-container {

        width: 92% !important;
    }


    .maru-contatos-info-icone {

        width: 36px !important;

        height: 36px !important;

        flex: 0 0 36px !important;
    }


    .maru-contatos-info-titulo {

        font-size: 9px !important;
    }


    .maru-contatos-info-texto {

        font-size: 9px !important;
    }
}


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

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

    .maru-contatos-info {

        padding: 40px 0 !important;
    }


    .maru-contatos-info-container {

        width: 90% !important;

        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;

        row-gap: 45px !important;
    }


    .maru-contatos-info-item {

        padding:
            0
            35px
            4px !important;
    }


    /* =====================================================
       ITEM 2 TERMINA A PRIMEIRA LINHA
    ====================================================== */

    .maru-contatos-info-item:nth-child(2)::after {

        display: none !important;
    }


    .maru-contatos-info-botao {

        min-width: 175px !important;
    }
}


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

@media (max-width: 767px) {

    .maru-contatos-info {

        padding: 38px 0 !important;
    }


    .maru-contatos-info-container {

        width: 90% !important;


        /* >>> MOBILE = 2 COLUNAS <<< */

        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;


        column-gap: 8px !important;

        row-gap: 42px !important;
    }


    .maru-contatos-info-item {

        padding:
            0
            12px
            3px !important;
    }


    /* =====================================================
       REMOVE TODAS AS DIVISÓRIAS NO MOBILE
    ====================================================== */

    .maru-contatos-info-item::after,
    .maru-contatos-info-item:not(:last-child)::after,
    .maru-contatos-info-item:nth-child(odd)::after,
    .maru-contatos-info-item:nth-child(even)::after {

        content: none !important;

        display: none !important;

        width: 0 !important;

        height: 0 !important;

        background: transparent !important;
    }


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

    .maru-contatos-info-icone {

        width: 32px !important;

        height: 32px !important;

        flex: 0 0 32px !important;

        margin-bottom: 12px !important;
    }


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

    .maru-contatos-info-titulo {

        font-size: 8px !important;

        line-height: 1.4 !important;

        margin-bottom: 16px !important;
    }


    /* =====================================================
       TEXTOS MOBILE
    ====================================================== */

    .maru-contatos-info-texto {

        font-size: 8px !important;

        line-height: 1.65 !important;
    }


    .maru-contatos-info-horario strong {

        font-size: 7.5px !important;
    }


    .maru-contatos-info-horario span {

        font-size: 8px !important;
    }


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

    .maru-contatos-info-email,
    .maru-contatos-info-email:visited,
    .maru-contatos-info-email:focus,
    .maru-contatos-info-email:active {

        font-size: 7.5px !important;

        overflow-wrap: anywhere !important;
    }


    /* =====================================================
       BOTÕES MOBILE
    ====================================================== */

    .maru-contatos-info-botao,
    .maru-contatos-info-botao:visited,
    .maru-contatos-info-botao:focus,
    .maru-contatos-info-botao:active {

        width: 100% !important;

        min-width: 0 !important;

        max-width: 175px !important;

        height: 38px !important;

        padding: 0 9px !important;

        gap: 7px !important;

        font-size: 7px !important;

        margin-top: 17px !important;
    }
}


/* =========================================================
   CELULAR PEQUENO
========================================================= */

@media (max-width: 420px) {

    .maru-contatos-info {

        padding: 34px 0 36px !important;
    }


    .maru-contatos-info-container {

        width: 92% !important;

        column-gap: 4px !important;

        row-gap: 38px !important;
    }


    .maru-contatos-info-item {

        padding:
            0
            8px
            2px !important;
    }


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

    .maru-contatos-info-icone {

        width: 30px !important;

        height: 30px !important;

        flex: 0 0 30px !important;
    }


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

    .maru-contatos-info-titulo {

        font-size: 7.5px !important;
    }


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

    .maru-contatos-info-texto {

        font-size: 7.5px !important;
    }


    /* =====================================================
       HORÁRIOS
    ====================================================== */

    .maru-contatos-info-horario strong {

        font-size: 7px !important;
    }


    .maru-contatos-info-horario span {

        font-size: 7.5px !important;
    }


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

    .maru-contatos-info-email,
    .maru-contatos-info-email:visited,
    .maru-contatos-info-email:focus,
    .maru-contatos-info-email:active {

        font-size: 7px !important;
    }


    /* =====================================================
       BOTÕES
    ====================================================== */

    .maru-contatos-info-botao,
    .maru-contatos-info-botao:visited,
    .maru-contatos-info-botao:focus,
    .maru-contatos-info-botao:active {

        min-width: 0 !important;

        width: 100% !important;

        max-width: 160px !important;

        height: 36px !important;

        padding: 0 6px !important;

        gap: 5px !important;

        font-size: 6.5px !important;
    }


    .maru-contatos-info-botao-icone {

        font-size: 10px !important;
    }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-80dd32a *//* =========================================================
   =========================================================
                       VIVA O MARÚ
   =========================================================

   DESKTOP:

   [ BLOCO VERDE ][ FOTO ][ FOTO ][ FOTO ][ FOTO ]

   MOBILE:

   [ BLOCO VERDE ]
   [ FOTO ][ FOTO ]
   [ FOTO ][ FOTO ]

   TÍTULO SEMPRE:

   CONECTE-SE
   COM A GENTE.

========================================================= */


/* =========================================================
   SEÇÃO
========================================================= */

.maru-conecte {

    width: 100% !important;
    max-width: none !important;

    margin: 0 !important;
    padding: 0 !important;

    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;

    box-sizing: border-box !important;

    overflow: hidden !important;
}


/* =========================================================
   GRID PRINCIPAL
========================================================= */

.maru-conecte-grid {

    width: 100% !important;
    max-width: none !important;

    margin: 0 !important;
    padding: 0 !important;

    display: grid !important;


    /* =====================================================
       >>> PROPORÇÃO DESKTOP <<<

       34% = BLOCO VERDE
       restante = 4 fotos

       PARA AUMENTAR BLOCO VERDE:
       38%

       PARA DIMINUIR:
       30%
    ====================================================== */

    grid-template-columns:
        34%
        repeat(4, minmax(0, 1fr)) !important;


    /* >>> ESPAÇO ENTRE BLOCOS <<< */

    gap: 2px !important;

    align-items: stretch !important;

    box-sizing: border-box !important;
}


/* =========================================================
   =========================================================
                    BLOCO VERDE
   =========================================================
========================================================= */

.maru-conecte-conteudo {

    width: 100% !important;


    /* =====================================================
       >>> ALTURA DO BLOCO <<<

       270px = menor
       310px = ATUAL
       350px = maior
    ====================================================== */

    min-height: 310px !important;


    display: flex !important;

    flex-direction: column !important;

    align-items: flex-start !important;

    justify-content: center !important;


    /* =====================================================
       >>> ESPAÇAMENTO INTERNO <<<

       38px = topo/baixo
       12%  = laterais
    ====================================================== */

    padding:
        38px
        12% !important;


    /* >>> COR DO BLOCO <<< */

    background: #525e3a !important;
    background-color: #525e3a !important;

    box-sizing: border-box !important;
}


/* =========================================================
   =========================================================
                         LABEL
   =========================================================

                    VIVA O MARÚ ─────

========================================================= */

.maru-conecte-label {

    display: flex !important;

    align-items: center !important;

    justify-content: flex-start !important;


    /* >>> DISTÂNCIA TEXTO / RISQUINHO <<< */

    gap: 14px !important;


    /* >>> DISTÂNCIA ATÉ O TÍTULO <<< */

    margin: 0 0 13px !important;

    padding: 0 !important;
}


/* =========================================================
   TEXTO DA LABEL
========================================================= */

.maru-conecte-label-texto {

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


    /* >>> TAMANHO <<< */

    font-size: 9px !important;

    font-weight: 500 !important;

    line-height: 1.2 !important;

    letter-spacing: .7px !important;

    text-transform: uppercase !important;


    /* >>> COR <<< */

    color: #faf8eb !important;

    opacity: .82 !important;

    white-space: nowrap !important;
}


/* =========================================================
   RISQUINHO DA LABEL

   >>> LOCAL CORRETO <<<

   VIVA O MARÚ ─────

   block = ATIVADO
   none  = DESATIVADO
========================================================= */

.maru-conecte-label-linha {

    display: block !important;


    /* >>> COMPRIMENTO <<< */

    width: 40px !important;

    flex: 0 0 40px !important;


    /* >>> ESPESSURA <<< */

    height: 1px !important;


    /* >>> COR <<< */

    background:
        rgba(250, 248, 235, .35) !important;
}


/* =========================================================
   =========================================================
                         TÍTULO
   =========================================================

                     CONECTE-SE
                     COM A GENTE.

   >>> DESKTOP E MOBILE = 2 LINHAS <<<

========================================================= */

.maru-conecte-titulo {

    /* =====================================================
       max-content ajuda a preservar
       exatamente as duas linhas do HTML.
    ====================================================== */

    width: max-content !important;

    max-width: 100% !important;

    margin: 0 !important;

    padding: 0 !important;


    /* >>> FONTE <<< */

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


    /* =====================================================
       >>> TAMANHO DESKTOP <<<

       24px = menor
       31px = atual máximo
       35px = maior
    ====================================================== */

    font-size:
        clamp(
            24px,
            2.2vw,
            31px
        ) !important;


    font-weight: 400 !important;


    /* >>> DISTÂNCIA ENTRE AS 2 LINHAS <<< */

    line-height: 1.05 !important;

    letter-spacing: 0 !important;


    /* >>> COR <<< */

    color: #faf8eb !important;


    /* =====================================================
       NÃO CRIA QUEBRAS EXTRAS.

       Os <br> do HTML controlam as linhas.
    ====================================================== */

    white-space: nowrap !important;
}


/* =========================================================
   IMPORTANTE

   O RISQUINHO ANTIGO EMBAIXO DO TÍTULO
   NÃO EXISTE MAIS.

   Mesmo que tenha sobrado no Elementor,
   ele será escondido.
========================================================= */

.maru-conecte-risco {

    display: none !important;
}


/* =========================================================
   =========================================================
                       DESCRIÇÃO
   =========================================================
========================================================= */

.maru-conecte-descricao {

    width: 100% !important;

    max-width: 310px !important;


    /* =====================================================
       >>> DISTÂNCIA DO TÍTULO ATÉ A DESCRIÇÃO <<<

       Como retiramos o risquinho antigo,
       o espaço é controlado aqui.
    ====================================================== */

    margin:
        17px
        0
        21px !important;

    padding: 0 !important;


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


    /* >>> TAMANHO <<< */

    font-size: 9px !important;

    font-weight: 400 !important;

    line-height: 1.65 !important;


    /* >>> COR <<< */

    color: #faf8eb !important;

    opacity: .78 !important;
}


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

.maru-conecte-redes {

    display: flex !important;

    align-items: center !important;

    justify-content: flex-start !important;


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

    gap: 16px !important;

    margin: 0 !important;

    padding: 0 !important;
}


/* =========================================================
   LINK SOCIAL
========================================================= */

.maru-conecte-social,
.maru-conecte-social:visited,
.maru-conecte-social:focus,
.maru-conecte-social:active {

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

       25px = menor
       29px = ATUAL
       34px = maior
    ====================================================== */

    width: 29px !important;

    height: 29px !important;

    flex: 0 0 29px !important;

    display: flex !important;

    align-items: center !important;

    justify-content: center !important;

    margin: 0 !important;

    padding: 0 !important;

    color: #faf8eb !important;

    background: transparent !important;
    background-color: transparent !important;

    border: none !important;

    text-decoration: none !important;

    outline: none !important;

    box-shadow: none !important;

    opacity: .82 !important;

    transition:
        opacity .25s ease,
        transform .25s ease !important;
}


/* =========================================================
   SVG DAS REDES
========================================================= */

.maru-conecte-social svg {

    display: block !important;

    width: 100% !important;

    height: 100% !important;

    fill: none !important;

    stroke: currentColor !important;

    stroke-width: 1.7 !important;

    stroke-linecap: round !important;

    stroke-linejoin: round !important;

    overflow: visible !important;
}


/* =========================================================
   HOVER DAS REDES
========================================================= */

.maru-conecte-social:hover {

    color: #faf8eb !important;

    opacity: 1 !important;

    transform:
        translateY(-2px) !important;

    background: transparent !important;
    background-color: transparent !important;

    text-decoration: none !important;
}


/* =========================================================
   =========================================================
                         FOTOS
   =========================================================
========================================================= */

.maru-conecte-foto {

    width: 100% !important;

    min-width: 0 !important;


    /* >>> MESMA ALTURA DO BLOCO VERDE <<< */

    min-height: 310px !important;

    position: relative !important;

    overflow: hidden !important;

    background: #222 !important;

    margin: 0 !important;

    padding: 0 !important;

    box-sizing: border-box !important;
}


/* =========================================================
   IMAGEM
========================================================= */

.maru-conecte-foto img {

    display: block !important;

    width: 100% !important;

    height: 100% !important;

    min-height: 310px !important;


    /* >>> NÃO DEFORMA <<< */

    object-fit: cover !important;


    /* =====================================================
       >>> ENQUADRAMENTO <<<

       center center = ATUAL

       PARA SUBIR:
       center 30%

       PARA DESCER:
       center 70%
    ====================================================== */

    object-position:
        center center !important;

    margin: 0 !important;

    padding: 0 !important;

    transform:
        scale(1) !important;

    transition:
        transform .5s ease !important;
}


/* =========================================================
   HOVER FOTO
========================================================= */

.maru-conecte-foto:hover img {

    transform:
        scale(1.035) !important;
}


/* =========================================================
   =========================================================
             AJUSTE INDIVIDUAL DAS FOTOS
   =========================================================
========================================================= */


/* >>> FOTO 01 <<< */

.maru-conecte-foto:nth-child(2) img {

    object-position:
        center center !important;
}


/* >>> FOTO 02 <<< */

.maru-conecte-foto:nth-child(3) img {

    object-position:
        center center !important;
}


/* >>> FOTO 03 <<< */

.maru-conecte-foto:nth-child(4) img {

    object-position:
        center center !important;
}


/* >>> FOTO 04 <<< */

.maru-conecte-foto:nth-child(5) img {

    object-position:
        center center !important;
}


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

@media (min-width: 1440px) {

    .maru-conecte-grid {

        grid-template-columns:
            34%
            repeat(4, minmax(0, 1fr)) !important;
    }


    .maru-conecte-conteudo,
    .maru-conecte-foto,
    .maru-conecte-foto img {

        /* >>> ALTURA DESKTOP GRANDE <<< */

        min-height: 330px !important;
    }


    /* =====================================================
       TÍTULO CONTINUA 2 LINHAS
    ====================================================== */

    .maru-conecte-titulo {

        font-size: 32px !important;

        line-height: 1.05 !important;

        white-space: nowrap !important;
    }


    .maru-conecte-descricao {

        font-size: 9px !important;
    }
}


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

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

    /* =====================================================
       TABLET:

       BLOCO VERDE EM CIMA
       FOTOS = 2 POR LINHA
    ====================================================== */

    .maru-conecte-grid {

        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;

        gap: 2px !important;
    }


    .maru-conecte-conteudo {

        grid-column:
            1 / -1 !important;

        min-height: 250px !important;

        padding:
            36px
            7% !important;
    }


    /* =====================================================
       LABEL
    ====================================================== */

    .maru-conecte-label {

        gap: 12px !important;

        margin-bottom: 13px !important;
    }


    .maru-conecte-label-linha {

        width: 36px !important;

        flex: 0 0 36px !important;
    }


    /* =====================================================
       TÍTULO = 2 LINHAS
    ====================================================== */

    .maru-conecte-titulo {

        width: max-content !important;

        max-width: 100% !important;

        font-size: 30px !important;

        line-height: 1.05 !important;

        white-space: nowrap !important;
    }


    .maru-conecte-descricao {

        max-width: 420px !important;

        margin-top: 17px !important;
    }


    .maru-conecte-foto,
    .maru-conecte-foto img {

        min-height: 270px !important;
    }
}


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

   BLOCO VERDE
   ↓
   FOTO | FOTO
   FOTO | FOTO

========================================================= */

@media (max-width: 767px) {

    .maru-conecte-grid {

        grid-template-columns:
            repeat(2, minmax(0, 1fr)) !important;

        gap: 2px !important;
    }


    /* =====================================================
       BLOCO VERDE
    ====================================================== */

    .maru-conecte-conteudo {

        grid-column:
            1 / -1 !important;

        min-height: 250px !important;


        /* >>> ESPAÇAMENTO MOBILE <<< */

        padding:
            36px
            7% !important;
    }


    /* =====================================================
       LABEL MOBILE

       VIVA O MARÚ ───
    ====================================================== */

    .maru-conecte-label {

        gap: 10px !important;

        margin-bottom: 13px !important;
    }


    .maru-conecte-label-texto {

        font-size: 8.5px !important;
    }


    .maru-conecte-label-linha {

        width: 32px !important;

        flex: 0 0 32px !important;
    }


    /* =====================================================
       TÍTULO MOBILE

       EXATAMENTE:

       CONECTE-SE
       COM A GENTE.
    ====================================================== */

    .maru-conecte-titulo {

        width: max-content !important;

        max-width: 100% !important;


        /* >>> TAMANHO MOBILE <<< */

        font-size: 29px !important;

        line-height: 1.05 !important;


        /* >>> PRESERVA SOMENTE AS 2 LINHAS <<< */

        white-space: nowrap !important;
    }


    /* =====================================================
       DESCRIÇÃO
    ====================================================== */

    .maru-conecte-descricao {

        width: 100% !important;

        max-width: 330px !important;

        margin:
            16px
            0
            21px !important;

        font-size: 9px !important;

        line-height: 1.65 !important;
    }


    /* =====================================================
       NO CELULAR A DESCRIÇÃO QUEBRA NATURALMENTE
    ====================================================== */

    .maru-conecte-desktop-br {

        display: none !important;
    }


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

    .maru-conecte-social,
    .maru-conecte-social:visited,
    .maru-conecte-social:focus,
    .maru-conecte-social:active {

        width: 28px !important;

        height: 28px !important;

        flex: 0 0 28px !important;
    }


    /* =====================================================
       FOTOS = 2 POR LINHA
    ====================================================== */

    .maru-conecte-foto,
    .maru-conecte-foto img {

        min-height: 220px !important;
    }


    /* REMOVE HOVER NO CELULAR */

    .maru-conecte-foto:hover img {

        transform:
            none !important;
    }
}


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

@media (max-width: 420px) {

    .maru-conecte-conteudo {

        min-height: 235px !important;

        padding:
            32px
            7% !important;
    }


    /* =====================================================
       LABEL
    ====================================================== */

    .maru-conecte-label {

        gap: 9px !important;

        margin-bottom: 12px !important;
    }


    .maru-conecte-label-texto {

        font-size: 8px !important;
    }


    .maru-conecte-label-linha {

        width: 28px !important;

        flex: 0 0 28px !important;
    }


    /* =====================================================
       TÍTULO

       CONTINUA:

       CONECTE-SE
       COM A GENTE.
    ====================================================== */

    .maru-conecte-titulo {

        font-size: 26px !important;

        line-height: 1.05 !important;

        white-space: nowrap !important;
    }


    /* =====================================================
       DESCRIÇÃO
    ====================================================== */

    .maru-conecte-descricao {

        margin:
            15px
            0
            18px !important;

        font-size: 8.5px !important;
    }


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

    .maru-conecte-redes {

        gap: 14px !important;
    }


    .maru-conecte-social,
    .maru-conecte-social:visited,
    .maru-conecte-social:focus,
    .maru-conecte-social:active {

        width: 26px !important;

        height: 26px !important;

        flex: 0 0 26px !important;
    }


    /* =====================================================
       FOTOS
    ====================================================== */

    .maru-conecte-foto,
    .maru-conecte-foto img {

        min-height: 185px !important;
    }
}


/* =========================================================
   CELULAR MUITO PEQUENO
   ATÉ 360PX
========================================================= */

@media (max-width: 360px) {

    .maru-conecte-titulo {

        /* >>> REDUZ SEM CRIAR 3ª LINHA <<< */

        font-size: 24px !important;

        line-height: 1.05 !important;

        white-space: nowrap !important;
    }
}/* End custom CSS */