.elementor-816 .elementor-element.elementor-element-9c74fd8{--display:flex;--min-height:179px;--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:-31px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:51px;--padding-left:0px;--padding-right:0px;}.elementor-816 .elementor-element.elementor-element-9c74fd8:not(.elementor-motion-effects-element-type-background), .elementor-816 .elementor-element.elementor-element-9c74fd8 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#5F4B40;}.elementor-816 .elementor-element.elementor-element-3e368d9{--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-816 .elementor-element.elementor-element-8185a7d{--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;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:10px;--padding-left:0px;--padding-right:0px;}.elementor-816 .elementor-element.elementor-element-8185a7d:not(.elementor-motion-effects-element-type-background), .elementor-816 .elementor-element.elementor-element-8185a7d > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FAF8EB;background-image:url("https://marugastrobar.com.br/wp-content/uploads/2026/09/sobremaru01-scaled.webp");background-position:center center;background-repeat:no-repeat;background-size:cover;}.elementor-816 .elementor-element.elementor-element-2d13e58{margin:39px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-816 .elementor-element.elementor-element-90435c3{--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-816 .elementor-element.elementor-element-90435c3:not(.elementor-motion-effects-element-type-background), .elementor-816 .elementor-element.elementor-element-90435c3 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FAF8EB;}.elementor-816 .elementor-element.elementor-element-9f90d1a{--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;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-816 .elementor-element.elementor-element-9f90d1a:not(.elementor-motion-effects-element-type-background), .elementor-816 .elementor-element.elementor-element-9f90d1a > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FAF8EB;}.elementor-816 .elementor-element.elementor-element-2701b35{--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-816 .elementor-element.elementor-element-2701b35:not(.elementor-motion-effects-element-type-background), .elementor-816 .elementor-element.elementor-element-2701b35 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FAF8EB;}.elementor-816 .elementor-element.elementor-element-4e5d219{--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:31px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-816 .elementor-element.elementor-element-4e5d219:not(.elementor-motion-effects-element-type-background), .elementor-816 .elementor-element.elementor-element-4e5d219 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FAF8EB;}.elementor-816 .elementor-element.elementor-element-8973a90{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--align-items:center;--padding-top:0px;--padding-bottom:50px;--padding-left:80px;--padding-right:80px;}.elementor-816 .elementor-element.elementor-element-8973a90:not(.elementor-motion-effects-element-type-background), .elementor-816 .elementor-element.elementor-element-8973a90 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FAF8EB;}.elementor-816 .elementor-element.elementor-element-368ffa5{--display:flex;--min-height:0px;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-816 .elementor-element.elementor-element-368ffa5.e-con{--align-self:center;}.elementor-widget-gallery .elementor-gallery-item__title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-gallery .elementor-gallery-item__description{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-widget-gallery{--galleries-title-color-normal:var( --e-global-color-primary );--galleries-title-color-hover:var( --e-global-color-secondary );--galleries-pointer-bg-color-hover:var( --e-global-color-accent );--gallery-title-color-active:var( --e-global-color-secondary );--galleries-pointer-bg-color-active:var( --e-global-color-accent );}.elementor-widget-gallery .elementor-gallery-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-816 .elementor-element.elementor-element-7c3a2af .e-gallery-item:hover .elementor-gallery-item__overlay, .elementor-816 .elementor-element.elementor-element-7c3a2af .e-gallery-item:focus .elementor-gallery-item__overlay{background-color:rgba(0,0,0,0.5);}.elementor-816 .elementor-element.elementor-element-7c3a2af{--image-transition-duration:800ms;--overlay-transition-duration:800ms;--content-text-align:center;--content-padding:20px;--content-transition-duration:800ms;--content-transition-delay:800ms;}.elementor-816 .elementor-element.elementor-element-78113b1{--display:flex;--min-height:0px;--align-items:center;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-816 .elementor-element.elementor-element-78113b1.e-con{--align-self:center;}.elementor-816 .elementor-element.elementor-element-202ad55 .e-gallery-item:hover .elementor-gallery-item__overlay, .elementor-816 .elementor-element.elementor-element-202ad55 .e-gallery-item:focus .elementor-gallery-item__overlay{background-color:rgba(0,0,0,0.5);}.elementor-816 .elementor-element.elementor-element-202ad55{--image-transition-duration:800ms;--overlay-transition-duration:800ms;--content-text-align:center;--content-padding:20px;--content-transition-duration:800ms;--content-transition-delay:800ms;}.elementor-816 .elementor-element.elementor-element-7bc576d{--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-816 .elementor-element.elementor-element-7bc576d:not(.elementor-motion-effects-element-type-background), .elementor-816 .elementor-element.elementor-element-7bc576d > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FAF8EB;}.elementor-816 .elementor-element.elementor-element-82a731a{--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-816 .elementor-element.elementor-element-82a731a:not(.elementor-motion-effects-element-type-background), .elementor-816 .elementor-element.elementor-element-82a731a > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#525E3A;}@media(max-width:1366px){.elementor-816 .elementor-element.elementor-element-9c74fd8{--min-height:164px;}}@media(max-width:767px){.elementor-816 .elementor-element.elementor-element-9c74fd8{--min-height:146px;}.elementor-816 .elementor-element.elementor-element-3e368d9:not(.elementor-motion-effects-element-type-background), .elementor-816 .elementor-element.elementor-element-3e368d9 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://marugastrobar.com.br/wp-content/uploads/2026/09/sobremarucel.webp");background-position:center center;background-repeat:no-repeat;background-size:cover;}.elementor-816 .elementor-element.elementor-element-3e368d9{--min-height:439px;}.elementor-816 .elementor-element.elementor-element-8185a7d:not(.elementor-motion-effects-element-type-background), .elementor-816 .elementor-element.elementor-element-8185a7d > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://marugastrobar.com.br/wp-content/uploads/2026/09/begecel01.webp");}.elementor-816 .elementor-element.elementor-element-8185a7d{--padding-top:0px;--padding-bottom:22px;--padding-left:0px;--padding-right:0px;}.elementor-816 .elementor-element.elementor-element-90435c3{--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-816 .elementor-element.elementor-element-9f90d1a{--padding-top:0px;--padding-bottom:0px;--padding-left:20px;--padding-right:20px;}.elementor-816 .elementor-element.elementor-element-8973a90{--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}}@media(min-width:768px){.elementor-816 .elementor-element.elementor-element-9c74fd8{--content-width:1406px;}.elementor-816 .elementor-element.elementor-element-8185a7d{--content-width:1600px;}.elementor-816 .elementor-element.elementor-element-90435c3{--content-width:1600px;}.elementor-816 .elementor-element.elementor-element-9f90d1a{--content-width:1600px;}.elementor-816 .elementor-element.elementor-element-2701b35{--content-width:1600px;}.elementor-816 .elementor-element.elementor-element-4e5d219{--content-width:1600px;}.elementor-816 .elementor-element.elementor-element-8973a90{--content-width:1600px;}.elementor-816 .elementor-element.elementor-element-368ffa5{--width:100%;}.elementor-816 .elementor-element.elementor-element-7bc576d{--content-width:1600px;}.elementor-816 .elementor-element.elementor-element-82a731a{--content-width:1600px;}}@media(min-width:2400px){.elementor-816 .elementor-element.elementor-element-8185a7d{--padding-top:0px;--padding-bottom:103px;--padding-left:0px;--padding-right:0px;}}/* Start custom CSS for html, class: .elementor-element-2d13e58 *//* =========================================================
   =========================================================
        SOBRE O MARÚ — EXPERIÊNCIA
        PADRÃO BASEADO NO HERO
   =========================================================
========================================================= */


/* =========================================================
   SEÇÃO PRINCIPAL
   FUNDO TOTALMENTE TRANSPARENTE
========================================================= */

.maru-sobre-experiencia {

    position: relative !important;

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

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

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

    overflow: visible !important;

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

    box-sizing: border-box !important;
}


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

.maru-sobre-experiencia-container {

    position: relative !important;

    z-index: 2 !important;

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

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

    margin: 0 auto !important;


    /* =====================================================
       ESPAÇAMENTO VERTICAL

       60px = TOPO
       60px = EMBAIXO
    ====================================================== */

    padding: 60px 0 60px !important;


    display: flex !important;

    align-items: center !important;

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

    box-sizing: border-box !important;
}


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

.maru-sobre-experiencia-content {

    width: 100% !important;

    max-width: 520px !important;

    position: relative !important;

    top: auto !important;
    bottom: auto !important;
    left: auto !important;
    right: auto !important;

    transform: none !important;

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


/* =========================================================
   LABEL — PADRÃO MARÚ

   SOBRE O MARÚ  ─────────
========================================================= */

.maru-sobre-experiencia-label {

    display: flex !important;

    align-items: center !important;

    gap: 14px !important;

    margin: 0 0 18px !important;

    padding: 0 !important;

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

    font-size: 11px !important;

    font-weight: 500 !important;

    line-height: 1 !important;

    letter-spacing: .3px !important;

    text-transform: uppercase !important;

    color: #5f4b40 !important;
}


/* =========================================================
   RISQUINHO DO LABEL
========================================================= */

.maru-sobre-experiencia-label-linha {


    /* =====================================================
       >>> ATIVAR / DESATIVAR RISQUINHO <<<

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

    display: block !important;


    /* =====================================================
       TAMANHO DO RISQUINHO
    ====================================================== */

    width: 40px !important;

    height: 1px !important;

    flex: 0 0 40px !important;


    /* =====================================================
       COR DO RISQUINHO
    ====================================================== */

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


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

   O MARÚ
   É EXPERIÊNCIA.

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

.maru-sobre-experiencia-title {

    margin: 0 0 22px !important;

    padding: 0 !important;

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


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

    font-size: clamp(
        42px,
        3vw,
        48px
    ) !important;


    font-weight: 400 !important;


    /* =====================================================
       >>> ESPAÇAMENTO ENTRE AS LINHAS DO TÍTULO <<<

       1.02 = ATUAL

       Colocamos só um pouquinho de espaço
       para o acento não ficar grudado.

       Se quiser mais junto:
       1.00

       Se quiser abrir um pouco mais:
       1.04
    ====================================================== */

    line-height: 1.02 !important;


    letter-spacing: -.6px !important;

    color: #525e3a !important;
}


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

.maru-sobre-experiencia-description {

    margin: 0 0 30px !important;

    padding: 0 !important;

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

    font-size: 14px !important;

    font-weight: 400 !important;

    line-height: 1.7 !important;

    color: #5f4b40 !important;

    max-width: 500px !important;
}


/* =========================================================
   QUEBRAS DESKTOP
========================================================= */

.maru-sobre-desktop-br {

    display: block !important;
}


/* =========================================================
   LINK — RESERVAR MESA
========================================================= */

.maru-sobre-experiencia-link,
.maru-sobre-experiencia-link:visited {

    display: inline-flex !important;

    align-items: center !important;

    justify-content: flex-start !important;

    gap: 12px !important;

    margin: 0 !important;

    padding: 0 0 4px !important;

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

    font-size: 11px !important;

    font-weight: 600 !important;

    line-height: 1 !important;

    letter-spacing: .4px !important;

    color: #525e3a !important;

    text-decoration: none !important;

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

    border: none !important;

    border-bottom:
        1px solid rgba(82, 94, 58, .55) !important;

    outline: none !important;

    box-shadow: none !important;

    transition:
        opacity .3s ease,
        color .3s ease,
        border-color .3s ease !important;
}


/* =========================================================
   SETA
========================================================= */

.maru-sobre-experiencia-seta {

    display: inline-block !important;

    font-size: 15px !important;

    font-weight: 300 !important;

    line-height: 1 !important;

    transition: transform .3s ease !important;
}


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

.maru-sobre-experiencia-link:hover,
.maru-sobre-experiencia-link:focus,
.maru-sobre-experiencia-link:active {

    color: #5f4b40 !important;

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

    border-bottom-color: #5f4b40 !important;

    outline: none !important;

    box-shadow: none !important;

    text-decoration: none !important;

    opacity: .75 !important;
}


.maru-sobre-experiencia-link:hover
.maru-sobre-experiencia-seta {

    transform: translateX(5px) !important;
}


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

@media (min-width: 1440px) {


    .maru-sobre-experiencia-container {

        width: 88% !important;

        padding: 60px 0 60px !important;
    }


    .maru-sobre-experiencia-content {

        max-width: 540px !important;
    }


    .maru-sobre-experiencia-title {

        font-size: 50px !important;


        /* =================================================
           MANTÉM O MESMO ESPAÇAMENTO
           ENTRE AS LINHAS NO DESKTOP GRANDE
        ================================================== */

        line-height: 1.02 !important;
    }


    .maru-sobre-experiencia-description {

        font-size: 14px !important;

        max-width: 510px !important;
    }

}


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

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


    .maru-sobre-experiencia-container {

        width: 90% !important;

        padding: 50px 0 50px !important;
    }


    .maru-sobre-experiencia-content {

        max-width: 470px !important;
    }


    .maru-sobre-experiencia-title {

        font-size: 40px !important;


        /* ESPAÇAMENTO ENTRE AS LINHAS */
        line-height: 1.02 !important;
    }


    .maru-sobre-experiencia-description {

        font-size: 13px !important;

        max-width: 460px !important;
    }

}


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

@media (max-width: 767px) {


    .maru-sobre-experiencia {

        height: auto !important;

        min-height: 0 !important;

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


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

    .maru-sobre-experiencia-container {

        width: 100% !important;

        max-width: none !important;

        height: auto !important;

        min-height: 0 !important;

        padding:
            40px
            25px
            40px !important;

        margin: 0 !important;

        display: block !important;

        box-sizing: border-box !important;
    }


    .maru-sobre-experiencia-content {

        width: 100% !important;

        max-width: 100% !important;

        position: relative !important;

        top: auto !important;

        transform: none !important;
    }


    /* =====================================================
       REMOVE QUEBRAS FORÇADAS DA DESCRIÇÃO
    ====================================================== */

    .maru-sobre-desktop-br {

        display: none !important;
    }


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

    .maru-sobre-experiencia-label {

        font-size: 10px !important;

        margin: 0 0 15px !important;
    }


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

    .maru-sobre-experiencia-label-linha {

        width: 32px !important;

        flex: 0 0 32px !important;
    }


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

    .maru-sobre-experiencia-title {

        font-size: 38px !important;


        /* =================================================
           >>> ESPAÇAMENTO ENTRE AS LINHAS <<<

           Mantendo 1.02 também no celular.
        ================================================== */

        line-height: 1.02 !important;


        margin: 0 0 18px !important;
    }


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

    .maru-sobre-experiencia-description {

        font-size: 13px !important;

        line-height: 1.65 !important;

        max-width: 360px !important;

        margin: 0 0 25px !important;
    }


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

    .maru-sobre-experiencia-link,
    .maru-sobre-experiencia-link:visited {

        font-size: 10px !important;
    }

}


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

@media (max-width: 420px) {


    .maru-sobre-experiencia-container {

        padding:
            35px
            22px
            35px !important;
    }


    .maru-sobre-experiencia-title {

        font-size: 35px !important;

        line-height: 1.02 !important;
    }


    .maru-sobre-experiencia-description {

        font-size: 12px !important;

        max-width: 320px !important;
    }

}


/* =========================================================
   GARANTIA FINAL DE TRANSPARÊNCIA
========================================================= */

.maru-sobre-experiencia {

    background: transparent !important;

    background-color: transparent !important;

    background-image: none !important;
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-a863c0a *//* =========================================================
   =========================================================
        PARA VIVER O MOMENTO — MARÚ
   =========================================================
========================================================= */


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

.maru-momento {

    position: relative !important;

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

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

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

    overflow: visible !important;

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

    box-sizing: border-box !important;
}



/* =========================================================
   =========================================================
   LINHAS DIVISÓRIAS DESTA SEÇÃO

   IMPORTANTE:
   ESTOU USANDO LINHA SOMENTE NESTA SEÇÃO
   PORQUE FOI PEDIDO.
   =========================================================
========================================================= */


/* =========================================================
   LINHA DO TOPO
========================================================= */

.maru-momento::before {

    content: "" !important;

    position: absolute !important;

    top: 0 !important;
    left: 6% !important;

    width: 88% !important;

    height: 1px !important;


    /* =====================================================
       >>> OPACIDADE DA LINHA <<<

       .22 = ATUAL
       .15 = mais suave
       .30 = mais aparente
    ====================================================== */

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

    pointer-events: none !important;
}



/* =========================================================
   LINHA DE BAIXO
========================================================= */

.maru-momento::after {

    content: "" !important;

    position: absolute !important;

    bottom: 0 !important;
    left: 6% !important;

    width: 88% !important;

    height: 1px !important;

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

    pointer-events: none !important;
}



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

.maru-momento-container {

    position: relative !important;

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

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

    margin: 0 auto !important;


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

       PRIMEIRO 55px = TOPO
       SEGUNDO 55px = EMBAIXO
    ====================================================== */

    padding: 55px 0 55px !important;


    /* =====================================================
       ESTRUTURA DESKTOP

       1 = TÍTULO
       2 = TEXTO
       3 = SÍMBOLO
    ====================================================== */

    display: grid !important;

    grid-template-columns:
        1fr
        1.75fr
        .75fr !important;


    /* =====================================================
       >>> ESPAÇO ENTRE AS 3 COLUNAS <<<
    ====================================================== */

    gap: clamp(
        35px,
        5vw,
        85px
    ) !important;

    align-items: start !important;

    box-sizing: border-box !important;
}



/* =========================================================
   COLUNA DO TÍTULO
========================================================= */

.maru-momento-titulo-box {

    width: 100% !important;

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



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

   PARA VIVER
   O MOMENTO
========================================================= */

.maru-momento-titulo {

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

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


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

       34px = mínimo
       2.7vw = tamanho fluido
       44px = máximo
    ====================================================== */

    font-size: clamp(
        34px,
        2.7vw,
        44px
    ) !important;


    font-weight: 400 !important;


    /* =====================================================
       >>> DISTÂNCIA ENTRE AS DUAS LINHAS <<<
    ====================================================== */

    line-height: 1.02 !important;

    letter-spacing: -.4px !important;

    color: #525e3a !important;


    /* =====================================================
       MANTÉM:

       PARA VIVER
       O MOMENTO

       SEM QUEBRAR "PARA VIVER"
    ====================================================== */

    white-space: nowrap !important;
}



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

.maru-momento-texto {

    width: 100% !important;


    /* =====================================================
       >>> LARGURA MÁXIMA DO TEXTO <<<

       650px = ATUAL

       Diminuir = texto quebra mais cedo
       Aumentar = linhas ficam mais compridas
    ====================================================== */

    max-width: 650px !important;

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

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


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

    font-size: 13px !important;

    font-weight: 400 !important;


    /* =====================================================
       >>> ESPAÇO ENTRE AS LINHAS DO TEXTO <<<
    ====================================================== */

    line-height: 1.75 !important;

    color: #5f4b40 !important;
}



/* =========================================================
   PARÁGRAFOS
========================================================= */

.maru-momento-texto p {

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

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

    font-size: inherit !important;

    font-weight: inherit !important;

    line-height: inherit !important;

    color: inherit !important;
}



/* =========================================================
   >>> ESPAÇO ENTRE OS DOIS PARÁGRAFOS <<<

   18px = ATUAL
========================================================= */

.maru-momento-texto p + p {

    margin-top: 18px !important;
}



/* =========================================================
   =========================================================
                   ÁREA DO SÍMBOLO
   =========================================================
========================================================= */

.maru-momento-simbolo {

    width: 100% !important;

    min-height: 180px !important;

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

    display: flex !important;

    align-items: center !important;

    justify-content: center !important;

    box-sizing: border-box !important;
}



/* =========================================================
   IMAGEM DO SÍMBOLO — DESKTOP
========================================================= */

.maru-momento-simbolo img {

    display: block !important;


    /* =====================================================
       >>> TAMANHO DO SÍMBOLO DESKTOP <<<

       230px = ATUAL

       210px = menor
       250px = maior
       270px = ainda maior
    ====================================================== */

    width: 230px !important;

    max-width: 100% !important;

    height: auto !important;

    object-fit: contain !important;

    margin: 0 auto !important;
}



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

@media (min-width: 1440px) {

    .maru-momento-container {

        width: 88% !important;

        padding: 60px 0 60px !important;

        grid-template-columns:
            1fr
            1.8fr
            .75fr !important;
    }


    .maru-momento-titulo {

        font-size: 46px !important;

        line-height: 1.02 !important;

        white-space: nowrap !important;
    }


    .maru-momento-texto {

        max-width: 680px !important;

        font-size: 13px !important;
    }


    .maru-momento-simbolo {

        min-height: 200px !important;
    }


    .maru-momento-simbolo img {

        width: 250px !important;
    }

}



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

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

    .maru-momento-container {

        width: 90% !important;

        padding: 50px 0 50px !important;

        grid-template-columns:
            .9fr
            1.6fr
            .6fr !important;

        gap: 35px !important;
    }


    /* LINHAS ACOMPANHAM O CONTAINER */

    .maru-momento::before,
    .maru-momento::after {

        width: 90% !important;

        left: 5% !important;
    }


    .maru-momento-titulo {

        font-size: 34px !important;

        line-height: 1.02 !important;

        white-space: nowrap !important;
    }


    .maru-momento-texto {

        font-size: 12px !important;

        line-height: 1.7 !important;
    }


    .maru-momento-simbolo {

        min-height: 150px !important;
    }


    .maru-momento-simbolo img {

        width: 170px !important;
    }

}



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

   ORDEM:

   1 — TÍTULO
   2 — TEXTO
   3 — SÍMBOLO

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

@media (max-width: 767px) {

    .maru-momento {

        width: 100% !important;

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

        background: #faf8eb !important;
        background-color: #faf8eb !important;
        background-image: none !important;
    }



    /* =====================================================
       LINHAS NO MOBILE
    ====================================================== */

    .maru-momento::before,
    .maru-momento::after {

        left: 25px !important;

        width: calc(100% - 50px) !important;

        height: 1px !important;

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



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

    .maru-momento-container {

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

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

        margin: 0 !important;


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

           40px = TOPO
           25px = LATERAIS
           40px = EMBAIXO
        ================================================== */

        padding:
            40px
            25px
            40px !important;


        display: flex !important;

        flex-direction: column !important;

        align-items: stretch !important;

        gap: 0 !important;

        box-sizing: border-box !important;
    }



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

    .maru-momento-titulo-box {

        order: 1 !important;

        width: 100% !important;

        margin: 0 0 25px !important;
    }


    .maru-momento-titulo {

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

        font-size: 38px !important;

        line-height: 1.02 !important;

        white-space: nowrap !important;
    }



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

    .maru-momento-texto {

        order: 2 !important;

        width: 100% !important;

        max-width: 100% !important;

        font-size: 13px !important;

        line-height: 1.7 !important;
    }


    .maru-momento-texto p + p {

        margin-top: 18px !important;
    }



    /* =====================================================
       SÍMBOLO MOBILE
    ====================================================== */

    .maru-momento-simbolo {

        order: 3 !important;

        width: 100% !important;

        min-height: 0 !important;


        /* =================================================
           >>> DISTÂNCIA TEXTO → SÍMBOLO <<<

           50px = ATUAL

           40px = mais perto
           60px = mais afastado
        ================================================== */

        margin-top: 50px !important;

        display: flex !important;

        align-items: center !important;

        justify-content: center !important;
    }



    /* =====================================================
       >>> TAMANHO DO SÍMBOLO MOBILE <<<

       200px = ATUAL

       180px = menor
       220px = maior
    ====================================================== */

    .maru-momento-simbolo img {

        width: 200px !important;

        max-width: 72% !important;

        height: auto !important;

        object-fit: contain !important;

        margin: 0 auto !important;
    }

}



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

@media (max-width: 420px) {

    /* =====================================================
       LINHAS
    ====================================================== */

    .maru-momento::before,
    .maru-momento::after {

        left: 22px !important;

        width: calc(100% - 44px) !important;
    }


    .maru-momento-container {

        padding:
            35px
            22px
            35px !important;
    }



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

    .maru-momento-titulo {

        font-size: 35px !important;

        line-height: 1.02 !important;

        white-space: nowrap !important;
    }


    .maru-momento-titulo-box {

        margin-bottom: 22px !important;
    }



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

    .maru-momento-texto {

        font-size: 12px !important;

        line-height: 1.7 !important;
    }



    /* =====================================================
       DISTÂNCIA TEXTO → SÍMBOLO
    ====================================================== */

    .maru-momento-simbolo {

        margin-top: 45px !important;
    }



    /* =====================================================
       SÍMBOLO CELULAR PEQUENO
    ====================================================== */

    .maru-momento-simbolo img {

        width: 185px !important;

        max-width: 72% !important;
    }

}



/* =========================================================
   GARANTIA FINAL DO FUNDO
========================================================= */

.maru-momento {

    background: #faf8eb !important;
    background-color: #faf8eb !important;
    background-image: none !important;
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-97a13dc *//* =========================================================
   =========================================================
                EXPERIÊNCIA MARÚ — COMPLETO
   =========================================================
========================================================= */


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

.maru-experiencia {

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

    margin: 0 !important;

    padding:
        28px
        0
        0 !important;

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

    box-sizing: border-box !important;

    overflow: hidden !important;
}


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

   ───── A EXPERIÊNCIA MARÚ ─────
   =========================================================
========================================================= */

.maru-experiencia-header {

    display: flex !important;

    align-items: center !important;

    justify-content: center !important;


    /* =====================================================
       >>> DISTÂNCIA ENTRE TEXTO E RISQUINHOS <<<

       10px = mais próximo
       14px = ATUAL
       18px = mais separado
    ====================================================== */

    gap: 14px !important;


    /* =====================================================
       >>> DISTÂNCIA ATÉ OS CARDS <<<

       22px = ATUAL
       30px = mais espaço
    ====================================================== */

    margin:
        0
        0
        22px !important;


    padding:
        0
        20px !important;

    box-sizing: border-box !important;
}


/* =========================================================
   TEXTO DO TÍTULO SUPERIOR
========================================================= */

.maru-experiencia-header-texto {

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


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

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

    font-size: 10px !important;

    font-weight: 500 !important;

    line-height: 1.2 !important;

    letter-spacing: .4px !important;

    text-transform: uppercase !important;

    color: #5f4b40 !important;

    white-space: nowrap !important;
}


/* =========================================================
   RISQUINHOS

   ───── A EXPERIÊNCIA MARÚ ─────


   >>> ATIVAR / DESATIVAR RISQUINHOS <<<

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

.maru-experiencia-header-linha {

    display: block !important;


    /* =====================================================
       >>> TAMANHO DOS RISQUINHOS <<<

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

    width: 40px !important;

    flex:
        0
        0
        40px !important;

    height: 1px !important;


    /* >>> COR DOS RISQUINHOS <<< */

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


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

.maru-experiencia-grid {

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

       90% = mais fechado
       94% = ATUAL
       96% = mais aberto
    ====================================================== */

    width: 94% !important;

    max-width: none !important;

    margin:
        0
        auto !important;

    display: grid !important;

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

    gap: 0 !important;

    box-sizing: border-box !important;
}


/* =========================================================
   CARD
========================================================= */

.maru-experiencia-card {

    min-width: 0 !important;

    margin: 0 !important;

    padding: 0 !important;

    background: #faf8eb !important;


    /* =====================================================
       LINHA DIVISÓRIA ENTRE OS CARDS
    ====================================================== */

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

    box-sizing: border-box !important;

    transition:
        transform .35s ease !important;
}


/* REMOVE LINHA DO ÚLTIMO CARD */

.maru-experiencia-card:last-child {

    border-right: none !important;
}


/* =========================================================
   HOVER SUTIL
========================================================= */

@media (hover: hover) and (pointer: fine) {

    .maru-experiencia-card:hover {

        transform: translateY(-5px) !important;
    }

}


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

.maru-experiencia-imagem {

    width: 100% !important;


    /* =====================================================
       >>> ALTURA DA IMAGEM <<<

       180px = mínimo
       15vw  = acompanha a tela
       260px = máximo
    ====================================================== */

    height:
        clamp(
            180px,
            15vw,
            260px
        ) !important;

    overflow: hidden !important;

    background: #e8e3d7 !important;
}


/* IMAGEM */

.maru-experiencia-imagem img {

    display: block !important;

    width: 100% !important;

    height: 100% !important;

    object-fit: cover !important;

    object-position: center center !important;

    margin: 0 !important;

    padding: 0 !important;

    transition:
        transform .6s ease !important;
}


/* =========================================================
   ZOOM SUAVE DA FOTO
========================================================= */

@media (hover: hover) and (pointer: fine) {

    .maru-experiencia-card:hover
    .maru-experiencia-imagem img {

        transform: scale(1.035) !important;
    }

}


/* =========================================================
   =========================================================
                  CONTEÚDO INFERIOR
   =========================================================
========================================================= */

.maru-experiencia-conteudo {

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

       24px = topo
       18px/32px = laterais responsivas
       34px = base
    ====================================================== */

    padding:
        24px
        clamp(18px, 2.1vw, 32px)
        34px !important;

    box-sizing: border-box !important;

    min-height: 245px !important;
}


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

.maru-experiencia-icone {

    display: flex !important;

    align-items: center !important;

    justify-content: flex-start !important;


    /* =====================================================
       >>> TAMANHO DO ÍCONE <<<

       29px = ATUAL
    ====================================================== */

    width: 29px !important;

    height: 29px !important;

    margin:
        0
        0
        14px !important;

    color: #8d927e !important;
}


/* SVG */

.maru-experiencia-icone svg {

    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;
}


/* =========================================================
   TÍTULO DOS CARDS
========================================================= */

.maru-experiencia-titulo {

    margin:
        0
        0
        18px !important;

    padding: 0 !important;


    /* >>> FONTE PADRÃO DOS TÍTULOS <<< */

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


    font-size:
        clamp(
            14px,
            1.1vw,
            16px
        ) !important;

    font-weight: 500 !important;

    line-height: 1.1 !important;

    letter-spacing: .5px !important;

    color: #525e3a !important;
}


/* =========================================================
   DESCRIÇÃO DOS CARDS
========================================================= */

.maru-experiencia-descricao {

    margin: 0 !important;

    padding: 0 !important;


    /* >>> FONTE PADRÃO DOS TEXTOS <<< */

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


    font-size:
        clamp(
            10px,
            .8vw,
            11px
        ) !important;

    font-weight: 400 !important;

    line-height: 1.75 !important;

    color: #5f4b40 !important;
}


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

@media (min-width: 1440px) {


    .maru-experiencia {

        padding-top: 32px !important;
    }


    .maru-experiencia-grid {

        width: 94% !important;
    }


    /* =====================================================
       CABEÇALHO
    ====================================================== */

    .maru-experiencia-header {

        gap: 14px !important;

        margin-bottom: 22px !important;
    }


    .maru-experiencia-header-texto {

        font-size: 10px !important;
    }


    .maru-experiencia-header-linha {

        width: 40px !important;

        flex:
            0
            0
            40px !important;
    }


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

    .maru-experiencia-imagem {

        height:
            clamp(
                210px,
                14vw,
                280px
            ) !important;
    }


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

    .maru-experiencia-conteudo {

        padding:
            26px
            clamp(22px, 2.2vw, 36px)
            38px !important;

        min-height: 255px !important;
    }


    .maru-experiencia-titulo {

        font-size: 16px !important;
    }


    .maru-experiencia-descricao {

        font-size: 11px !important;
    }

}


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

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


    .maru-experiencia {

        padding-top: 28px !important;
    }


    /* =====================================================
       CABEÇALHO
    ====================================================== */

    .maru-experiencia-header {

        gap: 12px !important;

        margin-bottom: 22px !important;
    }


    .maru-experiencia-header-texto {

        font-size: 10px !important;
    }


    .maru-experiencia-header-linha {

        width: 36px !important;

        flex:
            0
            0
            36px !important;
    }


    /* =====================================================
       GRID — 2 COLUNAS
    ====================================================== */

    .maru-experiencia-grid {

        width: 92% !important;

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


    .maru-experiencia-card {

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

        border-bottom:
            1px solid
            rgba(95, 75, 64, .13) !important;
    }


    .maru-experiencia-card:nth-child(2n) {

        border-right: none !important;
    }


    .maru-experiencia-card:last-child {

        border-bottom: none !important;
    }


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

    .maru-experiencia-imagem {

        height:
            clamp(
                220px,
                29vw,
                300px
            ) !important;
    }


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

    .maru-experiencia-conteudo {

        padding:
            26px
            28px
            34px !important;

        min-height: 235px !important;
    }


    .maru-experiencia-titulo {

        font-size: 15px !important;
    }


    .maru-experiencia-descricao {

        font-size: 11px !important;

        line-height: 1.7 !important;
    }

}


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

@media (max-width: 767px) {


    .maru-experiencia {

        padding-top: 30px !important;
    }


    /* =====================================================
       CABEÇALHO

       ─── A EXPERIÊNCIA MARÚ ───
    ====================================================== */

    .maru-experiencia-header {

        justify-content: center !important;

        gap: 10px !important;

        margin-bottom: 24px !important;

        padding:
            0
            20px !important;
    }


    .maru-experiencia-header-texto {

        font-size: 9px !important;

        letter-spacing: .4px !important;
    }


    .maru-experiencia-header-linha {

        width: 28px !important;

        flex:
            0
            0
            28px !important;
    }


    /* =====================================================
       GRID — 1 CARD POR LINHA
    ====================================================== */

    .maru-experiencia-grid {

        width: 100% !important;

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


    .maru-experiencia-card {

        border-right: none !important;

        border-bottom:
            1px solid
            rgba(95, 75, 64, .13) !important;
    }


    .maru-experiencia-card:last-child {

        border-bottom: none !important;
    }


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

    .maru-experiencia-imagem {

        height:
            clamp(
                250px,
                65vw,
                420px
            ) !important;
    }


    /* =====================================================
       CONTEÚDO MOBILE
    ====================================================== */

    .maru-experiencia-conteudo {

        padding:
            25px
            25px
            35px !important;

        min-height: 0 !important;
    }


    /* =====================================================
       ÍCONE MOBILE
    ====================================================== */

    .maru-experiencia-icone {

        width: 28px !important;

        height: 28px !important;

        margin-bottom: 13px !important;
    }


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

    .maru-experiencia-titulo {

        font-size: 16px !important;

        margin-bottom: 14px !important;
    }


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

    .maru-experiencia-descricao {

        font-size: 12px !important;

        line-height: 1.7 !important;

        max-width: 440px !important;
    }

}


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

@media (max-width: 420px) {


    /* =====================================================
       CABEÇALHO
    ====================================================== */

    .maru-experiencia-header {

        gap: 8px !important;
    }


    .maru-experiencia-header-texto {

        font-size: 8.5px !important;

        letter-spacing: .4px !important;
    }


    .maru-experiencia-header-linha {

        width: 22px !important;

        flex:
            0
            0
            22px !important;
    }


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

    .maru-experiencia-imagem {

        height: 260px !important;
    }


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

    .maru-experiencia-conteudo {

        padding:
            23px
            22px
            32px !important;
    }


    .maru-experiencia-titulo {

        font-size: 15px !important;
    }


    .maru-experiencia-descricao {

        font-size: 11px !important;
    }

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-f466ed8 *//* =========================================================
   =========================================================
        AMBIENTES QUE ACOLHEM — MARÚ
   =========================================================
========================================================= */


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

.maru-ambientes {

    position: relative !important;

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

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

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

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

    box-sizing: border-box !important;
}


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

.maru-ambientes-container {

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

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

    margin: 0 auto !important;

    padding: 28px 0 !important;

    display: grid !important;

    grid-template-columns:
        52%
        48% !important;

    align-items: stretch !important;

    box-sizing: border-box !important;
}


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

.maru-ambientes-imagem {

    position: relative !important;

    width: 100% !important;

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

    margin: 0 !important;


    /* =====================================================
       ESPAÇO ENTRE A FOTO E O CONTEÚDO
    ====================================================== */

    padding:
        0
        28px
        0
        0 !important;

    box-sizing: border-box !important;

    overflow: hidden !important;


    /* =====================================================
       CENTRALIZA A FOTO VERTICALMENTE
    ====================================================== */

    display: flex !important;

    align-items: center !important;

    justify-content: center !important;
}


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

.maru-ambientes-imagem img {

    display: block !important;

    width: 100% !important;


    /* =====================================================
       >>> ALTURA DA FOTO NO DESKTOP <<<

       400px = ATUAL

       380px = menor
       400px = atual
       420px = maior
    ====================================================== */

    height: 400px !important;

    min-height: 0 !important;

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

    object-fit: cover !important;


    /* =====================================================
       >>> ENQUADRAMENTO DA FOTO <<<

       center center = ATUAL

       center top    = mostra mais o topo
       center bottom = mostra mais a parte inferior
    ====================================================== */

    object-position: center center !important;
}


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

.maru-ambientes-conteudo {

    width: 100% !important;

    margin: 0 !important;

    padding:
        0
        clamp(28px, 3vw, 55px)
        0
        0 !important;

    display: flex !important;

    flex-direction: column !important;

    justify-content: center !important;

    box-sizing: border-box !important;
}


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

.maru-ambientes-label {

    width: 100% !important;

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

    display: flex !important;

    align-items: center !important;

    gap: 14px !important;

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

    font-size: 10px !important;

    font-weight: 500 !important;

    line-height: 1.2 !important;

    letter-spacing: .3px !important;

    color: #5f4b40 !important;
}


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

   >>> ATIVAR / DESATIVAR <<<

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

.maru-ambientes-label-linha {

    display: block !important;

    width: 40px !important;

    flex:
        0
        0
        40px !important;

    height: 1px !important;

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


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

.maru-ambientes-titulo {

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

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

    font-size: clamp(
        38px,
        3vw,
        48px
    ) !important;

    font-weight: 400 !important;

    line-height: .98 !important;

    letter-spacing: -.4px !important;


    /* =====================================================
       >>> COR DO TÍTULO <<<
       VERDE MARÚ
    ====================================================== */

    color: #525e3a !important;
}


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

.maru-ambientes-descricao {

    width: 100% !important;

    max-width: none !important;

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

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

    font-size: 13px !important;

    font-weight: 400 !important;

    line-height: 1.7 !important;

    color: #5f4b40 !important;
}


/* =========================================================
   QUEBRAS DO TEXTO

   DESKTOP = ATIVAS
========================================================= */

.maru-ambientes-desktop-br {

    display: block !important;
}


/* =========================================================
   =========================================================
                     GRID DOS ITENS
   =========================================================
========================================================= */

.maru-ambientes-itens {

    width: 100% !important;

    display: grid !important;

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

    row-gap: 22px !important;

    column-gap: 45px !important;

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


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

.maru-ambientes-item {

    width: 100% !important;

    display: flex !important;

    align-items: center !important;

    gap: 15px !important;

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


/* =========================================================
   ÁREA DOS ÍCONES
========================================================= */

.maru-ambientes-icone {

    width: 42px !important;
    min-width: 42px !important;

    height: 42px !important;

    display: flex !important;

    align-items: center !important;

    justify-content: center !important;

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


/* =========================================================
   SVG DOS ÍCONES
========================================================= */

.maru-ambientes-icone svg {

    display: block !important;

    width: 38px !important;
    height: 38px !important;

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

    fill: none !important;

    stroke: #525e3a !important;

    stroke-width: 2 !important;

    stroke-linecap: round !important;

    stroke-linejoin: round !important;

    overflow: visible !important;
}


/* =========================================================
   ÍCONE DO CARRO
========================================================= */

.maru-ambientes-icone-carro svg {

    width: 40px !important;
    height: 40px !important;

    stroke-width: 1.8 !important;
}


/* =========================================================
   ÍCONE DO CLIMATIZADOR
========================================================= */

.maru-ambientes-icone-clima svg {

    width: 38px !important;
    height: 38px !important;

    stroke-width: 1.8 !important;
}


/* =========================================================
   =========================================================
                    TEXTO DOS ITENS
   =========================================================
========================================================= */

.maru-ambientes-item-texto {

    width: 100% !important;

    display: flex !important;

    flex-direction: column !important;

    justify-content: center !important;

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

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

    color: #5f4b40 !important;
}


.maru-ambientes-item-texto span {

    display: block !important;

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

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

    font-size: 11px !important;

    font-weight: 500 !important;

    line-height: 1.45 !important;

    letter-spacing: .1px !important;

    color: #5f4b40 !important;
}


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

.maru-ambientes-item-texto small {

    display: block !important;

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

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

    font-size: 10px !important;

    font-weight: 400 !important;

    line-height: 1.4 !important;

    color: #5f4b40 !important;
}


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

@media (min-width: 1440px) {


    .maru-ambientes-container {

        width: 97% !important;

        padding: 28px 0 !important;

        grid-template-columns:
            52%
            48% !important;
    }


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

       >>> 400PX <<<
    ====================================================== */

    .maru-ambientes-imagem {

        min-height: 0 !important;

        padding-right: 28px !important;
    }


    .maru-ambientes-imagem img {

        height: 400px !important;

        min-height: 0 !important;
    }


    .maru-ambientes-conteudo {

        padding-right: 55px !important;
    }


    .maru-ambientes-titulo {

        font-size: 48px !important;

        color: #525e3a !important;
    }


    .maru-ambientes-descricao {

        font-size: 13px !important;
    }

}


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

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


    .maru-ambientes-container {

        width: 94% !important;

        padding: 25px 0 !important;

        grid-template-columns:
            48%
            52% !important;
    }


    .maru-ambientes-imagem {

        min-height: 0 !important;

        padding-right: 25px !important;
    }


    /* =====================================================
       FOTO TABLET
       MANTIDA EM 380PX
    ====================================================== */

    .maru-ambientes-imagem img {

        height: 380px !important;

        min-height: 0 !important;

        object-fit: cover !important;
    }


    .maru-ambientes-conteudo {

        padding-right: 15px !important;
    }


    .maru-ambientes-titulo {

        font-size: 36px !important;

        color: #525e3a !important;
    }


    .maru-ambientes-descricao {

        margin-bottom: 28px !important;

        font-size: 12px !important;
    }


    /* REMOVE QUEBRAS FORÇADAS */

    .maru-ambientes-desktop-br {

        display: none !important;
    }


    .maru-ambientes-itens {

        column-gap: 20px !important;

        row-gap: 18px !important;
    }


    .maru-ambientes-item {

        gap: 10px !important;
    }


    .maru-ambientes-icone {

        width: 34px !important;
        min-width: 34px !important;

        height: 34px !important;
    }


    .maru-ambientes-icone svg {

        width: 31px !important;
        height: 31px !important;
    }


    .maru-ambientes-icone-carro svg {

        width: 33px !important;
        height: 33px !important;
    }


    .maru-ambientes-icone-clima svg {

        width: 31px !important;
        height: 31px !important;
    }


    .maru-ambientes-item-texto span {

        font-size: 9px !important;
    }


    .maru-ambientes-item-texto small {

        font-size: 8px !important;
    }

}


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

              >>> NÃO ALTERADO <<<
   =========================================================
========================================================= */

@media (max-width: 767px) {


    .maru-ambientes {

        width: 100% !important;
    }


    .maru-ambientes-container {

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

        margin: 0 !important;

        padding: 25px !important;

        display: flex !important;

        flex-direction: column !important;

        box-sizing: border-box !important;
    }


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

    .maru-ambientes-imagem {

        width: 100% !important;

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

        margin: 0 0 38px !important;

        padding: 0 !important;

        display: block !important;
    }


    .maru-ambientes-imagem img {

        width: 100% !important;

        /* >>> ALTURA MOBILE MANTIDA <<< */

        height: 280px !important;

        min-height: 0 !important;

        object-fit: cover !important;

        object-position: center center !important;
    }


    /* =====================================================
       CONTEÚDO MOBILE
    ====================================================== */

    .maru-ambientes-conteudo {

        width: 100% !important;

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

        display: block !important;
    }


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

    .maru-ambientes-label {

        margin-bottom: 16px !important;

        font-size: 10px !important;
    }


    .maru-ambientes-label-linha {

        width: 32px !important;

        flex:
            0
            0
            32px !important;
    }


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

    .maru-ambientes-titulo {

        margin-bottom: 20px !important;

        font-size: 38px !important;

        line-height: 1 !important;

        color: #525e3a !important;
    }


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

    .maru-ambientes-descricao {

        max-width: 100% !important;

        margin-bottom: 35px !important;

        font-size: 13px !important;

        line-height: 1.7 !important;
    }


    /* REMOVE QUEBRAS DO DESKTOP */

    .maru-ambientes-desktop-br {

        display: none !important;
    }


    /* =====================================================
       ITENS MOBILE
       DUAS COLUNAS
    ====================================================== */

    .maru-ambientes-itens {

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

        column-gap: 18px !important;

        row-gap: 24px !important;
    }


    .maru-ambientes-item {

        align-items: flex-start !important;

        gap: 10px !important;
    }


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

    .maru-ambientes-icone {

        width: 34px !important;
        min-width: 34px !important;

        height: 34px !important;

        align-items: flex-start !important;
    }


    .maru-ambientes-icone svg {

        width: 31px !important;
        height: 31px !important;
    }


    .maru-ambientes-icone-carro svg {

        width: 33px !important;
        height: 33px !important;
    }


    .maru-ambientes-icone-clima svg {

        width: 31px !important;
        height: 31px !important;
    }


    .maru-ambientes-item-texto {

        justify-content: flex-start !important;
    }


    .maru-ambientes-item-texto span {

        font-size: 9px !important;

        line-height: 1.45 !important;
    }


    .maru-ambientes-item-texto small {

        font-size: 8px !important;
    }


    /* =====================================================
       VALET PARKING
       ALINHAMENTO MOBILE
    ====================================================== */

    .maru-ambientes-item-valet {

        align-items: center !important;
    }


    .maru-ambientes-item-valet .maru-ambientes-icone {

        height: 34px !important;

        align-items: center !important;

        justify-content: center !important;
    }


    .maru-ambientes-item-valet .maru-ambientes-item-texto {

        min-height: 34px !important;

        justify-content: center !important;
    }


    .maru-ambientes-item-valet .maru-ambientes-item-texto span {

        line-height: 1 !important;
    }

}


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

@media (max-width: 420px) {


    .maru-ambientes-container {

        padding:
            22px
            22px
            30px !important;
    }


    /* =====================================================
       FOTO
       MANTIDA EM 245PX
    ====================================================== */

    .maru-ambientes-imagem {

        margin-bottom: 34px !important;
    }


    .maru-ambientes-imagem img {

        height: 245px !important;
    }


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

    .maru-ambientes-titulo {

        font-size: 35px !important;

        color: #525e3a !important;
    }


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

    .maru-ambientes-descricao {

        margin-bottom: 32px !important;

        font-size: 12px !important;
    }


    /* =====================================================
       CELULAR PEQUENO
       UMA COLUNA
    ====================================================== */

    .maru-ambientes-itens {

        grid-template-columns:
            1fr !important;

        row-gap: 20px !important;
    }


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

    .maru-ambientes-icone {

        width: 38px !important;
        min-width: 38px !important;

        height: 38px !important;
    }


    .maru-ambientes-icone svg {

        width: 34px !important;
        height: 34px !important;
    }


    .maru-ambientes-icone-carro svg {

        width: 36px !important;
        height: 36px !important;
    }


    .maru-ambientes-icone-clima svg {

        width: 34px !important;
        height: 34px !important;
    }


    /* =====================================================
       TEXTO DOS ITENS
    ====================================================== */

    .maru-ambientes-item-texto span {

        font-size: 10px !important;
    }


    .maru-ambientes-item-texto small {

        font-size: 9px !important;
    }


    /* =====================================================
       VALET PARKING
    ====================================================== */

    .maru-ambientes-item-valet {

        align-items: center !important;
    }


    .maru-ambientes-item-valet .maru-ambientes-icone {

        height: 38px !important;

        align-items: center !important;

        justify-content: center !important;
    }


    .maru-ambientes-item-valet .maru-ambientes-item-texto {

        min-height: 38px !important;

        justify-content: center !important;
    }

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-1dd9998 *//* =========================================================
   =========================================================
             ESSÊNCIA MARÚ — GALERIA
   =========================================================
========================================================= */


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

.maru-essencia {

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

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

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

    /* >>> FUNDO BEGE MARÚ <<< */
    background: #faf8eb !important;
    background-color: #faf8eb !important;
    background-image: none !important;

    box-sizing: border-box !important;
}



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

.maru-essencia-container {

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

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

    margin: 0 auto !important;


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

       55px = TOPO
       45px = BASE
    ====================================================== */

    padding:
        55px
        0
        45px !important;

    box-sizing: border-box !important;
}



/* =========================================================
   =========================================================
                  CONTEÚDO CENTRAL
   =========================================================
========================================================= */

.maru-essencia-conteudo {

    width: 100% !important;


    /* =====================================================
       >>> LARGURA DO BLOCO CENTRAL <<<

       720px = ATUAL

       Essa largura permite manter a descrição
       nas 2 linhas que você pediu.
    ====================================================== */

    max-width: 720px !important;

    margin:
        0
        auto !important;

    padding: 0 !important;

    display: flex !important;

    flex-direction: column !important;

    align-items: center !important;

    justify-content: center !important;

    text-align: center !important;

    box-sizing: border-box !important;
}



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

            ───── ESSÊNCIA MARÚ ─────
   =========================================================
========================================================= */

.maru-essencia-label {

    width: auto !important;

    margin:
        0
        0
        18px !important;

    padding: 0 !important;

    display: flex !important;

    align-items: center !important;

    justify-content: center !important;


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

    gap: 14px !important;


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

    font-size: 10px !important;

    font-weight: 500 !important;

    line-height: 1.2 !important;

    letter-spacing: .4px !important;

    text-transform: uppercase !important;

    color: #5f4b40 !important;
}



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

.maru-essencia-label-texto {

    display: block !important;

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

    white-space: nowrap !important;

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

    font-size: inherit !important;

    font-weight: inherit !important;

    line-height: inherit !important;

    letter-spacing: inherit !important;

    color: #5f4b40 !important;
}



/* =========================================================
   RISQUINHOS

   ───── ESSÊNCIA MARÚ ─────


   >>> ATIVAR / DESATIVAR RISQUINHOS <<<

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

.maru-essencia-label-linha {

    display: block !important;


    /* =====================================================
       >>> TAMANHO DOS DOIS RISQUINHOS <<<

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

    width: 40px !important;

    flex:
        0
        0
        40px !important;

    height: 1px !important;

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



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

   TUDO ACONTECE
   COM INTENÇÃO.

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

.maru-essencia-titulo {

    width: 100% !important;

    margin:
        0
        0
        20px !important;

    padding: 0 !important;


    /* =====================================================
       PADRÃO MARÚ — TÍTULOS
    ====================================================== */

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


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

       48px = máximo atual
    ====================================================== */

    font-size:
        clamp(
            40px,
            3vw,
            48px
        ) !important;

    font-weight: 400 !important;

    line-height: .98 !important;

    letter-spacing: -.3px !important;

    text-align: center !important;


    /* >>> VERDE MARÚ <<< */

    color: #525e3a !important;
}



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

   DESKTOP:

   Da primeira taça ao último brinde, cada detalhe encontra o

   seu tempo para transformar encontros em memórias que permanecem.

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

.maru-essencia-descricao {

    width: 100% !important;


    /* =====================================================
       >>> LARGURA DO TEXTO <<<

       720px ajuda a manter exatamente as duas linhas
       solicitadas no desktop.
    ====================================================== */

    max-width: 720px !important;

    margin:
        0
        auto
        29px !important;

    padding: 0 !important;


    /* PADRÃO MARÚ — TEXTOS */

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

    font-size: 14px !important;

    font-weight: 400 !important;

    line-height: 1.7 !important;

    text-align: center !important;

    color: #5f4b40 !important;
}



/* =========================================================
   QUEBRA CONTROLADA DA DESCRIÇÃO

   DESKTOP = ATIVADA
========================================================= */

.maru-essencia-desktop-br {

    display: block !important;
}



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

   IMPORTANTE:

   AQUI ESTÁ A CORREÇÃO DO LINK.

   O ELEMENTOR / TEMA NÃO PODERÁ:

   - aumentar a fonte
   - deixar azul
   - deixar roxo após visitar
   - alterar peso
   - alterar espaçamento
   - adicionar sublinhado

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


/* =========================================================
   LINK — TODOS OS ESTADOS

   MANTER TODOS ESTES SELETORES.
========================================================= */

.maru-essencia-link,
.maru-essencia-link:link,
.maru-essencia-link:visited,
.maru-essencia-link:focus,
.maru-essencia-link:active {

    width: auto !important;

    margin: 0 !important;

    padding: 0 !important;

    display: inline-flex !important;

    align-items: center !important;

    justify-content: center !important;


    /* >>> DISTÂNCIA ENTRE SETA E TEXTO <<< */

    gap: 7px !important;


    /* =====================================================
       >>> FONTE DO LINK <<<

       NÃO ALTERAR PARA NÃO MUDAR O TAMANHO
       QUANDO O TEXTO VIRA LINK.
    ====================================================== */

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

    font-size: 11px !important;

    font-weight: 500 !important;

    line-height: 1 !important;

    letter-spacing: .4px !important;

    text-transform: uppercase !important;

    text-decoration: none !important;


    /* =====================================================
       >>> COR NORMAL DO LINK <<<

       VERDE MARÚ
    ====================================================== */

    color: #525e3a !important;

    -webkit-text-fill-color: #525e3a !important;


    background: transparent !important;

    background-color: transparent !important;

    background-image: none !important;

    border: none !important;

    outline: none !important;

    box-shadow: none !important;

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



/* =========================================================
   TEXTO "VIVA O MARÚ"

   ESTA CLASSE É IMPORTANTE.

   ELA EVITA QUE O ELEMENTOR AUMENTE OU
   MUDE A COR DO TEXTO DENTRO DO <a>.
========================================================= */

.maru-essencia-link-texto {

    display: inline-block !important;

    margin: 0 !important;

    padding: 0 !important;

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

    font-size: 11px !important;

    font-weight: 500 !important;

    line-height: 1 !important;

    letter-spacing: .4px !important;

    text-transform: uppercase !important;

    text-decoration: none !important;

    color: #525e3a !important;

    -webkit-text-fill-color: #525e3a !important;
}



/* =========================================================
   GARANTE A COR NORMAL TAMBÉM
   DEPOIS QUE O LINK JÁ FOI VISITADO
========================================================= */

.maru-essencia-link:visited
.maru-essencia-link-texto,

.maru-essencia-link:focus
.maru-essencia-link-texto,

.maru-essencia-link:active
.maru-essencia-link-texto {

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

    font-size: 11px !important;

    font-weight: 500 !important;

    line-height: 1 !important;

    letter-spacing: .4px !important;

    color: #525e3a !important;

    -webkit-text-fill-color: #525e3a !important;

    text-decoration: none !important;
}



/* =========================================================
   SETA
========================================================= */

.maru-essencia-seta {

    display: inline-block !important;

    margin: 0 !important;

    padding: 0 !important;

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

    font-size: 15px !important;

    font-weight: 300 !important;

    line-height: 1 !important;

    color: #525e3a !important;

    -webkit-text-fill-color: #525e3a !important;

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



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

   VERDE → MARROM

   ESTE É O ÚNICO MOMENTO EM QUE
   O LINK MUDA DE COR DE PROPÓSITO.

   SEM AZUL
   SEM ROXO
   SEM ALTERAÇÃO DE TAMANHO
========================================================= */

.maru-essencia-link:hover {

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

    font-size: 11px !important;

    font-weight: 500 !important;

    line-height: 1 !important;

    letter-spacing: .4px !important;

    color: #5f4b40 !important;

    -webkit-text-fill-color: #5f4b40 !important;

    background: transparent !important;

    background-color: transparent !important;

    text-decoration: none !important;

    opacity: .75 !important;

    transform: translateY(-1px) !important;
}



/* TEXTO NO HOVER */

.maru-essencia-link:hover
.maru-essencia-link-texto {

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

    font-size: 11px !important;

    font-weight: 500 !important;

    line-height: 1 !important;

    letter-spacing: .4px !important;

    color: #5f4b40 !important;

    -webkit-text-fill-color: #5f4b40 !important;

    text-decoration: none !important;
}



/* SETA NO HOVER */

.maru-essencia-link:hover
.maru-essencia-seta {

    color: #5f4b40 !important;

    -webkit-text-fill-color: #5f4b40 !important;
}



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

@media (min-width: 1440px) {


    .maru-essencia-container {

        width: 88% !important;

        padding:
            60px
            0
            48px !important;
    }



    .maru-essencia-conteudo {

        max-width: 720px !important;
    }



    .maru-essencia-titulo {

        font-size: 48px !important;
    }



    .maru-essencia-descricao {

        max-width: 720px !important;

        font-size: 14px !important;
    }



    .maru-essencia-label-linha {

        width: 40px !important;

        flex:
            0
            0
            40px !important;
    }

}



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

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


    .maru-essencia-container {

        width: 90% !important;

        padding:
            50px
            0
            42px !important;
    }



    .maru-essencia-conteudo {

        max-width: 620px !important;
    }



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

    .maru-essencia-label {

        justify-content: center !important;

        gap: 12px !important;

        margin-bottom: 17px !important;
    }



    .maru-essencia-label-linha {

        width: 36px !important;

        flex:
            0
            0
            36px !important;
    }



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

    .maru-essencia-titulo {

        font-size: 42px !important;
    }



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

    .maru-essencia-descricao {

        max-width: 560px !important;

        font-size: 13px !important;
    }



    /* =====================================================
       TABLET
       REMOVE A QUEBRA FORÇADA DA DESCRIÇÃO
    ====================================================== */

    .maru-essencia-desktop-br {

        display: none !important;
    }

}



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

@media (max-width: 767px) {


    .maru-essencia {

        width: 100% !important;
    }



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

    .maru-essencia-container {

        width: 100% !important;

        max-width: none !important;

        margin: 0 !important;


        /* >>> RESPIRO MOBILE <<< */

        padding:
            42px
            25px
            38px !important;

        box-sizing: border-box !important;
    }



    /* =====================================================
       CONTEÚDO CENTRAL
    ====================================================== */

    .maru-essencia-conteudo {

        width: 100% !important;

        max-width: none !important;

        margin:
            0
            auto !important;

        padding: 0 !important;

        align-items: center !important;

        text-align: center !important;
    }



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

       ─── ESSÊNCIA MARÚ ───
    ====================================================== */

    .maru-essencia-label {

        width: auto !important;

        justify-content: center !important;

        gap: 11px !important;

        margin:
            0
            0
            17px !important;

        font-size: 10px !important;
    }



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

    .maru-essencia-label-linha {

        width: 32px !important;

        flex:
            0
            0
            32px !important;

        height: 1px !important;
    }



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

       MANTÉM:

       TUDO ACONTECE
       COM INTENÇÃO.
    ====================================================== */

    .maru-essencia-titulo {

        width: 100% !important;

        margin:
            0
            0
            20px !important;

        font-size: 38px !important;

        line-height: 1 !important;

        text-align: center !important;

        color: #525e3a !important;
    }



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

       A quebra acontece naturalmente
       conforme a largura da tela.
    ====================================================== */

    .maru-essencia-descricao {

        width: 100% !important;

        max-width: 350px !important;

        margin:
            0
            auto
            27px !important;

        font-size: 13px !important;

        line-height: 1.7 !important;

        text-align: center !important;

        color: #5f4b40 !important;
    }



    /* =====================================================
       REMOVE A QUEBRA FORÇADA DO DESKTOP
    ====================================================== */

    .maru-essencia-desktop-br {

        display: none !important;
    }



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

       >>> MANTÉM EXATAMENTE 10px <<<
    ====================================================== */

    .maru-essencia-link,
    .maru-essencia-link:link,
    .maru-essencia-link:visited,
    .maru-essencia-link:hover,
    .maru-essencia-link:focus,
    .maru-essencia-link:active {

        justify-content: center !important;

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

        font-size: 10px !important;

        font-weight: 500 !important;

        line-height: 1 !important;

        letter-spacing: .4px !important;

        text-decoration: none !important;
    }



    .maru-essencia-link-texto,
    .maru-essencia-link:visited .maru-essencia-link-texto,
    .maru-essencia-link:hover .maru-essencia-link-texto,
    .maru-essencia-link:focus .maru-essencia-link-texto,
    .maru-essencia-link:active .maru-essencia-link-texto {

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

        font-size: 10px !important;

        font-weight: 500 !important;

        line-height: 1 !important;

        letter-spacing: .4px !important;
    }

}



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

@media (max-width: 420px) {


    .maru-essencia-container {

        padding:
            38px
            22px
            34px !important;
    }



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

    .maru-essencia-label {

        gap: 9px !important;

        font-size: 9px !important;
    }



    /* =====================================================
       RISQUINHOS
    ====================================================== */

    .maru-essencia-label-linha {

        width: 28px !important;

        flex:
            0
            0
            28px !important;
    }



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

    .maru-essencia-titulo {

        font-size: 35px !important;
    }



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

    .maru-essencia-descricao {

        max-width: 320px !important;

        font-size: 12px !important;
    }



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

       >>> MANTÉM 10px <<<
    ====================================================== */

    .maru-essencia-link,
    .maru-essencia-link:link,
    .maru-essencia-link:visited,
    .maru-essencia-link:hover,
    .maru-essencia-link:focus,
    .maru-essencia-link:active {

        font-size: 10px !important;
    }



    .maru-essencia-link-texto,
    .maru-essencia-link:visited .maru-essencia-link-texto,
    .maru-essencia-link:hover .maru-essencia-link-texto,
    .maru-essencia-link:focus .maru-essencia-link-texto,
    .maru-essencia-link:active .maru-essencia-link-texto {

        font-size: 10px !important;
    }

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-4381ee8 *//* =========================================================
   =========================================================
          HOSPITALIDADE QUE FICA — MARÚ
   =========================================================
========================================================= */


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

.maru-hospitalidade {

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

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

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

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

    box-sizing: border-box !important;
}


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

.maru-hospitalidade-container {

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

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

    margin: 0 auto !important;


    /* =====================================================
       >>> RESPIRO DA SEÇÃO <<<

       PRIMEIRO = TOPO
       SEGUNDO  = LATERAIS
       TERCEIRO = BASE
    ====================================================== */

    padding:
        48px
        0
        50px !important;

    box-sizing: border-box !important;
}


/* =========================================================
   =========================================================
                HOSPITALIDADE QUE FICA
   =========================================================
========================================================= */

.maru-hospitalidade-label {

    width: 100% !important;

    margin:
        0
        0
        34px !important;

    padding: 0 !important;

    display: flex !important;

    align-items: center !important;

    /* CENTRALIZADO */
    justify-content: center !important;

    gap: 14px !important;

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

    font-size: 10px !important;

    font-weight: 500 !important;

    line-height: 1.2 !important;

    letter-spacing: .8px !important;

    text-transform: uppercase !important;

    color: #5f4b40 !important;
}


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

.maru-hospitalidade-label-texto {

    display: block !important;

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

    white-space: nowrap !important;

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

    color: #5f4b40 !important;
}


/* =========================================================
   RISQUINHOS

   AGORA TEM:
   ───── HOSPITALIDADE QUE FICA ─────


   >>> ATIVAR / DESATIVAR <<<

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

.maru-hospitalidade-label-linha {

    display: block !important;


    /* =====================================================
       >>> TAMANHO DOS RISQUINHOS <<<

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

    width: 40px !important;

    flex:
        0
        0
        40px !important;

    height: 1px !important;

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


/* =========================================================
   =========================================================
                    GRID DOS ITENS
   =========================================================
========================================================= */

.maru-hospitalidade-grid {

    width: 100% !important;

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

    display: grid !important;

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

    align-items: start !important;

    box-sizing: border-box !important;
}


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

.maru-hospitalidade-item {

    position: relative !important;

    width: 100% !important;
    min-width: 0 !important;

    margin: 0 !important;


    /* =====================================================
       >>> ESPAÇO LATERAL DE CADA ITEM <<<
    ====================================================== */

    padding:
        0
        34px !important;

    text-align: center !important;

    box-sizing: border-box !important;
}


/* =========================================================
   LINHAS VERTICAIS ENTRE OS ITENS

   ITEM 1 | ITEM 2 | ITEM 3 | ITEM 4
========================================================= */

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

    content: "" !important;

    position: absolute !important;

    top: 2px !important;
    right: 0 !important;

    width: 1px !important;


    /* =====================================================
       >>> ALTURA DA LINHA VERTICAL <<<
    ====================================================== */

    height: 118px !important;

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


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

.maru-hospitalidade-icone {

    width: 46px !important;
    height: 46px !important;

    margin:
        0
        auto
        17px !important;

    padding: 0 !important;

    display: flex !important;

    align-items: center !important;

    justify-content: center !important;
}


/* =========================================================
   SVG DOS ÍCONES
========================================================= */

.maru-hospitalidade-icone svg {

    display: block !important;

    width: 40px !important;
    height: 40px !important;

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

    fill: none !important;

    /* VERDE MARÚ */

    stroke: #525e3a !important;

    stroke-width: 1.65 !important;

    stroke-linecap: round !important;

    stroke-linejoin: round !important;

    opacity: .62 !important;

    overflow: visible !important;
}


/* =========================================================
   =========================================================
                   TÍTULOS DOS ITENS
   =========================================================
========================================================= */

.maru-hospitalidade-titulo {

    width: 100% !important;

    margin:
        0
        0
        10px !important;

    padding: 0 !important;

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


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

    font-size: 10px !important;

    font-weight: 600 !important;

    line-height: 1.35 !important;

    letter-spacing: .2px !important;

    text-transform: uppercase !important;

    color: #5f4b40 !important;
}


/* =========================================================
   DESCRIÇÕES
========================================================= */

.maru-hospitalidade-descricao {

    width: 100% !important;

    /* =====================================================
       >>> LARGURA MÁXIMA DO TEXTO <<<
    ====================================================== */

    max-width: 220px !important;

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

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


    /* =====================================================
       >>> TAMANHO DA DESCRIÇÃO <<<
    ====================================================== */

    font-size: 10px !important;

    font-weight: 400 !important;

    line-height: 1.7 !important;

    color: #5f4b40 !important;
}


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

@media (min-width: 1440px) {


    .maru-hospitalidade-container {

        width: 88% !important;

        padding:
            50px
            0
            52px !important;
    }


    /* LABEL */

    .maru-hospitalidade-label {

        margin-bottom: 34px !important;
    }


    /* RISQUINHOS */

    .maru-hospitalidade-label-linha {

        width: 40px !important;

        flex:
            0
            0
            40px !important;
    }


    /* ITENS */

    .maru-hospitalidade-item {

        padding:
            0
            42px !important;
    }


    .maru-hospitalidade-descricao {

        max-width: 235px !important;

        font-size: 10px !important;
    }


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

        height: 120px !important;
    }

}


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

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


    .maru-hospitalidade-container {

        width: 92% !important;

        padding:
            45px
            0 !important;
    }


    /* =====================================================
       LABEL CONTINUA CENTRALIZADA
    ====================================================== */

    .maru-hospitalidade-label {

        justify-content: center !important;

        margin-bottom: 32px !important;
    }


    .maru-hospitalidade-label-linha {

        width: 36px !important;

        flex:
            0
            0
            36px !important;
    }


    /* =====================================================
       TABLET
       2 COLUNAS
    ====================================================== */

    .maru-hospitalidade-grid {

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

        row-gap: 40px !important;
    }


    .maru-hospitalidade-item {

        padding:
            0
            30px !important;
    }


    /* =====================================================
       REMOVE DIVISÓRIAS ORIGINAIS
    ====================================================== */

    .maru-hospitalidade-item::after {

        display: none !important;
    }


    /* =====================================================
       LINHA ENTRE AS DUAS COLUNAS
    ====================================================== */

    .maru-hospitalidade-item:nth-child(odd)::after {

        display: block !important;

        content: "" !important;

        position: absolute !important;

        top: 0 !important;
        right: 0 !important;

        width: 1px !important;
        height: 120px !important;

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


    .maru-hospitalidade-descricao {

        max-width: 250px !important;
    }

}


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

@media (max-width: 767px) {


    .maru-hospitalidade {

        width: 100% !important;
    }


    .maru-hospitalidade-container {

        width: 100% !important;

        margin: 0 !important;


        /* =================================================
           >>> RESPIRO MOBILE <<<
        ================================================== */

        padding:
            40px
            25px
            42px !important;

        box-sizing: border-box !important;
    }


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

       CONTINUA NO CENTRO
       COM RISQUINHO DOS DOIS LADOS
    ====================================================== */

    .maru-hospitalidade-label {

        width: 100% !important;

        justify-content: center !important;

        gap: 10px !important;

        margin:
            0
            0
            34px !important;

        font-size: 9px !important;
    }


    .maru-hospitalidade-label-texto {

        white-space: nowrap !important;
    }


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

    .maru-hospitalidade-label-linha {

        width: 28px !important;

        flex:
            0
            0
            28px !important;

        height: 1px !important;
    }


    /* =====================================================
       MOBILE
       2 COLUNAS
    ====================================================== */

    .maru-hospitalidade-grid {

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

        column-gap: 0 !important;

        row-gap: 40px !important;
    }


    .maru-hospitalidade-item {

        padding:
            0
            16px !important;
    }


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

    .maru-hospitalidade-item::after {

        display: none !important;
    }


    /* =====================================================
       LINHA ENTRE AS DUAS COLUNAS
    ====================================================== */

    .maru-hospitalidade-item:nth-child(odd)::after {

        display: block !important;

        content: "" !important;

        position: absolute !important;

        top: 0 !important;
        right: 0 !important;

        width: 1px !important;

        height: 125px !important;

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


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

    .maru-hospitalidade-icone {

        width: 42px !important;
        height: 42px !important;

        margin:
            0
            auto
            15px !important;
    }


    .maru-hospitalidade-icone svg {

        width: 37px !important;
        height: 37px !important;
    }


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

    .maru-hospitalidade-titulo {

        margin-bottom: 9px !important;

        font-size: 9px !important;

        line-height: 1.45 !important;
    }


    /* =====================================================
       DESCRIÇÕES MOBILE
    ====================================================== */

    .maru-hospitalidade-descricao {

        max-width: 155px !important;

        font-size: 9px !important;

        line-height: 1.6 !important;
    }

}


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

@media (max-width: 420px) {


    .maru-hospitalidade-container {

        padding:
            36px
            22px
            38px !important;
    }


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

    .maru-hospitalidade-label {

        gap: 8px !important;

        margin-bottom: 32px !important;

        font-size: 8.5px !important;

        letter-spacing: .5px !important;
    }


    /* =====================================================
       RISQUINHOS

       ─── HOSPITALIDADE QUE FICA ───
    ====================================================== */

    .maru-hospitalidade-label-linha {

        width: 22px !important;

        flex:
            0
            0
            22px !important;
    }


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

    .maru-hospitalidade-grid {

        row-gap: 36px !important;
    }


    .maru-hospitalidade-item {

        padding:
            0
            11px !important;
    }


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

    .maru-hospitalidade-icone {

        width: 40px !important;
        height: 40px !important;
    }


    .maru-hospitalidade-icone svg {

        width: 35px !important;
        height: 35px !important;
    }


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

    .maru-hospitalidade-titulo {

        font-size: 8.5px !important;
    }


    /* =====================================================
       DESCRIÇÕES
    ====================================================== */

    .maru-hospitalidade-descricao {

        max-width: 140px !important;

        font-size: 8.5px !important;
    }


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

    .maru-hospitalidade-item:nth-child(odd)::after {

        height: 122px !important;
    }

}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-e13292c *//* =========================================================
   =========================================================
           FAIXA SOCIAL / RESERVA — MARÚ
   =========================================================
========================================================= */


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

.maru-social-faixa {

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

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

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

    /* >>> COR DE FUNDO DA FAIXA <<< */
    background: #525e3a !important;
    background-color: #525e3a !important;
    background-image: none !important;

    box-sizing: border-box !important;
}


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

.maru-social-faixa-container {

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

    margin: 0 auto !important;

    /* >>> ALTURA / RESPIRO DA FAIXA <<< */
    padding:
        28px
        0 !important;

    display: grid !important;

    /* TEXTO | INSTAGRAM | WHATSAPP | BOTÃO */
    grid-template-columns:
        1.25fr
        1fr
        1fr
        1.15fr !important;

    align-items: center !important;

    column-gap: clamp(30px, 5vw, 85px) !important;

    box-sizing: border-box !important;
}


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

.maru-social-faixa-chamada {

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

    display: flex !important;

    align-items: center !important;
}


/* TEXTO */

.maru-social-faixa-chamada span {

    display: block !important;

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

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

    /* >>> TAMANHO DA CHAMADA <<< */
    font-size: 12px !important;

    font-weight: 600 !important;

    line-height: 1.45 !important;

    letter-spacing: .7px !important;

    text-transform: uppercase !important;

    color: #faf8eb !important;
}


/* =========================================================
   =========================================================
                INSTAGRAM / WHATSAPP
   =========================================================
========================================================= */

.maru-social-faixa-link,
.maru-social-faixa-link:visited,
.maru-social-faixa-link:focus,
.maru-social-faixa-link:active {

    display: flex !important;

    align-items: center !important;

    justify-content: flex-start !important;

    gap: 10px !important;

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

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

    text-decoration: none !important;

    color: #faf8eb !important;

    background: transparent !important;

    border: none !important;

    outline: none !important;

    box-shadow: none !important;

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


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

   SEM AZUL
   SEM ROXO
========================================================= */

.maru-social-faixa-link:hover {

    color: #faf8eb !important;

    background: transparent !important;

    opacity: .72 !important;

    transform: translateY(-1px) !important;
}


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

.maru-social-faixa-icone {

    width: 24px !important;
    min-width: 24px !important;

    height: 24px !important;

    display: flex !important;

    align-items: center !important;

    justify-content: center !important;

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


/* SVG */

.maru-social-faixa-icone svg {

    display: block !important;

    width: 21px !important;
    height: 21px !important;

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

    fill: none !important;

    stroke: #faf8eb !important;

    stroke-width: 2 !important;

    stroke-linecap: round !important;

    stroke-linejoin: round !important;

    opacity: .85 !important;
}


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

.maru-social-faixa-texto {

    display: block !important;

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

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

    font-size: 10px !important;

    font-weight: 500 !important;

    line-height: 1 !important;

    letter-spacing: .7px !important;

    text-transform: uppercase !important;

    color: #faf8eb !important;
}


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

.maru-social-faixa-botao-box {

    width: 100% !important;

    display: flex !important;

    justify-content: flex-end !important;

    align-items: center !important;
}


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

.maru-social-faixa-botao,
.maru-social-faixa-botao:visited,
.maru-social-faixa-botao:focus,
.maru-social-faixa-botao:active {

    display: inline-flex !important;

    align-items: center !important;

    justify-content: center !important;

    /* >>> TAMANHO DO BOTÃO <<< */
    width: 160px !important;
    height: 42px !important;

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

    box-sizing: border-box !important;

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

    font-size: 10px !important;

    font-weight: 500 !important;

    line-height: 1 !important;

    letter-spacing: .7px !important;

    text-transform: uppercase !important;

    text-decoration: none !important;

    color: #faf8eb !important;

    background: transparent !important;

    /* >>> BORDA DO BOTÃO <<< */
    border:
        1px
        solid
        rgba(250, 248, 235, .58) !important;

    border-radius: 0 !important;

    outline: none !important;

    box-shadow: none !important;

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


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

.maru-social-faixa-botao:hover {

    color: #525e3a !important;

    background: #faf8eb !important;

    border-color: #faf8eb !important;

    text-decoration: none !important;

    outline: none !important;

    box-shadow: none !important;
}


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

@media (min-width: 1440px) {

    .maru-social-faixa-container {

        width: 90% !important;

        padding:
            30px
            0 !important;

        column-gap: clamp(50px, 6vw, 100px) !important;
    }


    .maru-social-faixa-chamada span {

        font-size: 12px !important;
    }


    .maru-social-faixa-botao {

        width: 165px !important;

        height: 42px !important;
    }

}


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

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

    .maru-social-faixa-container {

        width: 92% !important;

        padding:
            25px
            0 !important;

        grid-template-columns:
            1.1fr
            .9fr
            .9fr
            1fr !important;

        column-gap: 20px !important;
    }


    .maru-social-faixa-chamada span {

        font-size: 10px !important;
    }


    .maru-social-faixa-texto {

        font-size: 9px !important;
    }


    .maru-social-faixa-icone {

        width: 21px !important;
        min-width: 21px !important;

        height: 21px !important;
    }


    .maru-social-faixa-icone svg {

        width: 19px !important;
        height: 19px !important;
    }


    .maru-social-faixa-botao {

        width: 140px !important;

        height: 40px !important;

        font-size: 9px !important;
    }

}


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

   NOVA COMPOSIÇÃO MOBILE

   VIVA O MARÚ COM A GENTE.

   INSTAGRAM      WHATSAPP

   [       RESERVAR MESA       ]

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

@media (max-width: 767px) {

    .maru-social-faixa {

        width: 100% !important;
    }


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

    .maru-social-faixa-container {

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

        margin: 0 !important;

        /* >>> RESPIRO MOBILE <<< */
        padding:
            26px
            24px !important;

        display: grid !important;

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

        column-gap: 12px !important;

        row-gap: 22px !important;

        align-items: center !important;

        box-sizing: border-box !important;
    }


    /* =====================================================
       CHAMADA

       OCUPA AS DUAS COLUNAS
    ====================================================== */

    .maru-social-faixa-chamada {

        grid-column:
            1 /
            -1 !important;

        width: 100% !important;

        display: flex !important;

        align-items: center !important;

        justify-content: center !important;

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

        text-align: center !important;
    }


    .maru-social-faixa-chamada span {

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

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

        font-size: 11px !important;

        font-weight: 600 !important;

        line-height: 1.45 !important;

        letter-spacing: .8px !important;

        text-transform: uppercase !important;

        color: #faf8eb !important;
    }


    /* =====================================================
       INSTAGRAM + WHATSAPP

       LADO A LADO
    ====================================================== */

    .maru-social-faixa-link,
    .maru-social-faixa-link:visited,
    .maru-social-faixa-link:focus,
    .maru-social-faixa-link:active {

        width: 100% !important;

        display: flex !important;

        align-items: center !important;

        justify-content: center !important;

        gap: 8px !important;

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

        color: #faf8eb !important;

        background: transparent !important;

        text-decoration: none !important;

        border: none !important;

        outline: none !important;

        box-shadow: none !important;

        transform: none !important;
    }


    .maru-social-faixa-link:hover {

        color: #faf8eb !important;

        background: transparent !important;

        opacity: .75 !important;

        transform: none !important;
    }


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

    .maru-social-faixa-icone {

        width: 22px !important;
        min-width: 22px !important;

        height: 22px !important;

        display: flex !important;

        align-items: center !important;

        justify-content: center !important;

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


    .maru-social-faixa-icone svg {

        width: 20px !important;
        height: 20px !important;

        stroke: #faf8eb !important;

        stroke-width: 2 !important;

        opacity: .9 !important;
    }


    /* =====================================================
       TEXTO DAS REDES
    ====================================================== */

    .maru-social-faixa-texto {

        display: block !important;

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

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

        font-size: 9px !important;

        font-weight: 500 !important;

        line-height: 1 !important;

        letter-spacing: .6px !important;

        white-space: nowrap !important;

        text-transform: uppercase !important;

        color: #faf8eb !important;
    }


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

       OCUPA AS DUAS COLUNAS
    ====================================================== */

    .maru-social-faixa-botao-box {

        grid-column:
            1 /
            -1 !important;

        width: 100% !important;

        display: flex !important;

        align-items: center !important;

        justify-content: center !important;

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


    .maru-social-faixa-botao,
    .maru-social-faixa-botao:visited,
    .maru-social-faixa-botao:focus,
    .maru-social-faixa-botao:active {

        /* =================================================
           >>> LARGURA DO BOTÃO MOBILE <<<

           100% = largura disponível
           330px = limite máximo
        ================================================== */

        width: 100% !important;

        max-width: 330px !important;

        height: 44px !important;

        margin: 0 auto !important;

        padding:
            0
            20px !important;

        display: flex !important;

        align-items: center !important;

        justify-content: center !important;

        box-sizing: border-box !important;

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

        font-size: 9px !important;

        font-weight: 500 !important;

        line-height: 1 !important;

        letter-spacing: .7px !important;

        text-transform: uppercase !important;

        text-decoration: none !important;

        color: #faf8eb !important;

        background: transparent !important;

        border:
            1px
            solid
            rgba(250, 248, 235, .58) !important;

        border-radius: 0 !important;

        outline: none !important;

        box-shadow: none !important;
    }


    .maru-social-faixa-botao:hover {

        color: #525e3a !important;

        background: #faf8eb !important;

        border-color: #faf8eb !important;

        text-decoration: none !important;
    }

}


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

@media (max-width: 420px) {

    .maru-social-faixa-container {

        padding:
            24px
            20px !important;

        column-gap: 8px !important;

        row-gap: 20px !important;
    }


    /* =====================================================
       CHAMADA
    ====================================================== */

    .maru-social-faixa-chamada span {

        font-size: 10px !important;

        letter-spacing: .7px !important;
    }


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

    .maru-social-faixa-link {

        gap: 7px !important;
    }


    .maru-social-faixa-icone {

        width: 20px !important;
        min-width: 20px !important;

        height: 20px !important;
    }


    .maru-social-faixa-icone svg {

        width: 18px !important;
        height: 18px !important;
    }


    .maru-social-faixa-texto {

        font-size: 8.5px !important;
    }


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

    .maru-social-faixa-botao,
    .maru-social-faixa-botao:visited,
    .maru-social-faixa-botao:focus,
    .maru-social-faixa-botao:active {

        max-width: 100% !important;

        height: 42px !important;

        font-size: 9px !important;
    }

}/* End custom CSS */