*, *:after, *:before { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
body, html {width: 100%; height: 100%; font-size: 15px; padding: 0; margin: 0;}
/* Clearfix hack by Nicolas Gallagher: http://nicolasgallagher.com/micro-clearfix-hack/ */
.clearfix:before, .clearfix:after { content: " "; display: table; }
.clearfix:after { clear: both; }

body {
    font-family: 'Lato', Calibri, Arial, sans-serif;
    color: #333;/* #89867e*/
}

/*
@media (min-width:450px){}
@media (min-width:576px){}
@media (min-width:768px){}
@media (min-width:992px){}
@media (min-width:1200px){}    
@media (min-width:1400px){}
*/
/*  filter: alpha(opacity=70); opacity: 0.7; z-index: -1*/

@media (min-width:350px){.test-moble {background:#FFF;position:fixed; width: 30px; height: 30px; top: 5px; right: 5px; border: 1px solid gray; border-radius: 50%; z-index: 4}}
@media (min-width:576px){.test-moble {background:yellow} }
@media (min-width:768px){.test-moble {background:orange} }
@media (min-width:992px){.test-moble {background: red}}
@media (min-width:1200px){.test-moble {background: brown}}    
@media (min-width:1400px){.test-moble {background: black}}

.container{float: left; width: 100%; height: auto; margin: 0 auto; padding: 0; background: none; clear:both;}

/* Topo */
.lente-topo{position: fixed;width: 100%; margin: 0 auto; padding: 0; background: none; z-index: 1;}
@media (min-width:350px){.lente-topo{height:80px;}}
@media (min-width:576px){.lente-topo{height:80px;}}
@media (min-width:768px){.lente-topo{height:80px;}}
@media (min-width:992px){.lente-topo{height:80px;}}
@media (min-width:1200px){.lente-topo{ height:95px;}}    
@media (min-width:1400px){.lente-topo{height:95px;}}


.content-topo{border: 0px solid red;}
@media (min-width:350px){.content-topo{position: fixed; width: 94%; margin-left: 3%; z-index: 2}.content-topo .logo{width: 100px; margin: 5px 0 0 0}}
@media (min-width:576px){.content-topo{position: fixed; width: 90%; margin-left: 5%; z-index: 2}.content-topo .logo{width: 100px;margin: 5px 0 0 0}}
@media (min-width:768px){.content-topo{position: fixed; width: 80%; margin-left: 10%; z-index: 2}.content-topo .logo{width: 100px;margin: 5px 0 0 0}}
@media (min-width:992px){.content-topo{position: fixed; width: 82%; margin-left: 9%; z-index: 2}.content-topo .logo{width: 100px;margin: 5px 0 0 0}}
@media (min-width:1200px){.content-topo{position: fixed; width: 70%; margin-left: 15%; z-index: 2}.content-topo .logo{width: 120px;margin: 5px 0 0 0}}    
@media (min-width:1400px){.content-topo{position: fixed; width: 70%; margin-left: 15%; z-index: 2}.content-topo .logo{width: 120px;  margin: 5px 0 0 0}}

.content-topo .logo{float:left; height: auto; padding: 0;}


.nav-topo{float: left;border: 0px solid red;}
@media (min-width:350px){.nav-topo{display: none}}
@media (min-width:576px){.nav-topo{display: none}}
@media (min-width:768px){.nav-topo{display: none}}
@media (min-width:992px){.nav-topo{display: block; margin-top: 20px}}
@media (min-width:1200px){.nav-topo{display: block; margin-top: 27px}}    
@media (min-width:1400px){.nav-topo{display: block;  margin-top: 27px}}

.nav-topo ul{float: left;margin-left:70px}
.nav-topo ul li{float: left; margin: 0; margin-left: 35px; padding: 5px 0; font-size: 1.1em}
.nav-topo ul li:hover{border-bottom:2px solid #FFF;}

.btn-menu {float: left; background: orange}
.btn-menu:hover {background: orangered}
@media (min-width:350px){.btn-menu{display: block;margin: 25px 0 0 40px;}}
@media (min-width:576px){.btn-menu{display: block;margin: 25px 0 0 70px;}}
@media (min-width:768px){.btn-menu{display: block;margin: 25px 0 0 70px;}}
@media (min-width:992px){.btn-menu{display: none;}}
@media (min-width:1200px){.btn-menu{display: none;}}    
@media (min-width:1400px){.btn-menu{display: none;}}

.btn-topo {padding: 7px 25px; border:0; border-radius: 7px; color: #FFF; background: linear-gradient(45deg,orangered,orange); font-size: 1.3em; cursor: pointer}
@media (min-width:350px){.btn-topo {margin-top: 21px;}}
@media (min-width:576px){.btn-topo {margin-top: 21px;}}
@media (min-width:768px){.btn-topo {margin-top: 21px;}}
@media (min-width:992px){.btn-topo {margin-top: 21px;}}
@media (min-width:1200px){.btn-topo {margin-top: 28px;}}    
@media (min-width:1400px){.btn-topo {margin-top: 28px;}}
.btn-topo:hover{background: linear-gradient(45deg,orange,orangered);}
/* Fim: Topo */

.box-banner-op{}
@media (min-width:350px){.box-banner-op{width: 100%; height: auto; margin: 0; padding: 120px 20px 50px 20px; text-align: center}}
@media (min-width:576px){.box-banner-op{padding: 150px 0 120px 0;}}
@media (min-width:768px){}
@media (min-width:992px){}
@media (min-width:1200px){.box-banner-op{ margin: 0; padding: 120px 20px 50px 20px }}    
@media (min-width:1400px){.box-banner-op{ margin: 0; padding: 130px 20px 50px 20px }}


@media (min-width:350px){.box-banner-op h1{color:#FFF;font-size: 1.7em; padding: 20px 0;}}
@media (min-width:576px){.box-banner-op h1{color:#FFF;font-size: 1.7; padding: 20px 0;}}
@media (min-width:768px){.box-banner-op h1{color:#FFF;font-size: 2.1em; padding: 20px 0;}}
@media (min-width:992px){.box-banner-op h1{color:#FFF;font-size: 2.3em; padding: 20px 0;}}
@media (min-width:1200px){.box-banner-op h1{color:#FFF;font-size: 2.4em; padding: 20px 0;}}    
@media (min-width:1400px){.box-banner-op h1{color:#FFF;font-size: 3em; padding: 20px 0;}}

@media (min-width:350px){.box-banner-op p{color:#FFF;font-size: 1.4em; padding: 0; line-height: 27px}}
@media (min-width:576px){.box-banner-op p{color:#FFF;font-size: 1.3em; padding: 0; line-height: 27px}}
@media (min-width:768px){.box-banner-op p{color:#FFF;font-size: 1.4em; padding: 0; line-height: 27px}}
@media (min-width:992px){.box-banner-op p{color:#FFF;font-size: 1.6em; padding: 0; line-height: 27px}}
@media (min-width:1200px){.box-banner-op p{color:#FFF;font-size: 1.8em; padding: 0; line-height: 27px}}    
@media (min-width:1400px){.box-banner-op p{color:#FFF;font-size: 2em; padding: 20px 0; line-height: 40px}}

.content{border:0px solid red}
@media (min-width:350px){.content{width: 92%; height: auto; margin: 0 auto; margin-bottom: 30px; padding:0; border-radius: 7px; background: none}}
@media (min-width:450px){.content{width: 92%; height: auto; margin: 0 auto; margin-bottom: 30px; padding:0; border-radius: 7px; background: none}}
@media (min-width:576px){.content{width: 90%; height: auto; margin: 0 auto; margin-bottom: 30px; padding:0; border-radius: 7px; background: none}}
@media (min-width:768px){.content{width: 90%; height: auto; margin: 0 auto; margin-bottom: 30px; padding:0; border-radius: 7px; background: none}}
@media (min-width:1200px){.content{width: 84%; height: auto; margin: 0 auto; margin-top: 0; margin-bottom: 30px; padding:0; border-radius: 7px; background: none}}
@media (min-width:1400px){.content{width: 70%; height: auto; margin: 0 auto; margin-top: 0; margin-bottom: 30px; padding: 0; border-radius: 7px; background: none}}


@media (min-width:350px){.diferencial{text-align: c}.diferencial article{width:100%; height: auto; margin: 30px 0 0 0; padding: 20px 0; border-right: 2px solid orange; border-bottom: 2px solid orange; border-radius: 30px; background: #3c3c3c}.diferencial article .title{padding:20px;color:#FFF; font-size: 1.8em}.diferencial article .descriptio{padding:0 20px;color:#FFF; text-align: justify; font-size: 1.3em}}
@media (min-width:576px){}
@media (min-width:768px){}
@media (min-width:992px){.diferencial article .descriptio{font-size: 1.4em}}
@media (min-width:1200px){.diferencial article .descriptio{font-size: 1.5em}}    
@media (min-width:1400px){.diferencial article .descriptio{font-size: 1.6em}}

.lista-bairros {
    list-style: none; /* Remove os marcadores padrão */
    padding: 10px;
    margin-top: 20px;
    display: flex; /* Layout em colunas, se o espaço permitir */
    gap: 10px 20px;
    flex-wrap: wrap;
}
.lista-bairros li{
    flex: 1 1 300px; /* Permite que os itens se ajustem em linha ou quebrem */
    font-size: 1.5em;
    padding: 5px  20px;
    border-radius: 15px;
    transition: transform 0.3s ease, box-shadow 0.3s ease;

    /*border-right: 1px solid #ff6600;
    border-bottom: 1px solid #ff6600;*/




}

.lista-bairros li:hover {
    transform: translateY(-3px); /* Efeito sutil ao passar o mouse */
    /*box-shadow: 0 5px 15px #666;*/
}

.lista-bairros li a{
    color: orange;
    text-align: left;
    text-decoration: underline;
    font-family: 'Montserrat', sans-serif; font-weight: 500; font-style: normal;
}



@media (max-width: 768px) {

    .lista-bairros {
        /*flex-direction: column; /* Itens em coluna em telas menores */
        flex: 1 1 100%;
    }
}





.fixed {position:fixed;}
.opacity{filter: alpha(opacity=80); opacity: 0.8;}
.bg-black {background: black}
.bg-white {background: white}
.bg-none {background: none}
.tx-center{text-align: center}
.tx-bold {font-weight: bold}
.mg0{margin: 0}
.mgB0{margin-bottom: 0}
.pd0{padding: 0}
.pdB0{padding-bottom: 0}
.michroma {font-family: 'Michroma', serif; font-weight: 400; font-style: normal;}
.montserrat {font-family: 'Montserrat', sans-serif; font-weight: 400; font-style: normal;}
.color-white {color: #FFF}
.color-orange {color: orange;}/*#ff6600*/



.btn {
    display: inline-block;
    padding: 7px 25px 10px 25px;
    margin-top: 20px;
    margin-bottom: 10px;
    border:0;
    border-radius: 7px;
    color: #FFF;
    background: linear-gradient(45deg,orangered,orange);
    font-size: 1.3em;
    cursor: pointer;
    transition: background-color 0.3s ease, transform 0.2s ease;
}
.btn:hover{
    background: linear-gradient(45deg,orange,orangered);
    transform: translateY(-2px);
}

/* 1. ESTILOS GERAIS DO CONTÊINER FLEX */
.section-artigos-g {
    /* Ativa o Flexbox no contêiner pai */
    display: flex; 

    /* Envolve os itens para a próxima linha em telas pequenas */
    flex-wrap: wrap; 

    /* Centraliza os artigos no contêiner */
    justify-content: center; 

    /* Adiciona um espaço entre os artigos e as bordas do contêiner */
    gap: 20px; 

    /* Define a largura máxima para o layout (opcional) */
    max-width: 1500px;
    margin: 30px 0;/*30px auto*/
    padding: 0; /*0 20px*/       
}

/* 2. ESTILOS DOS ITENS (ARTIGOS) */
.artigo-g {
    /* Define que cada artigo deve ocupar, no máximo, 
       cerca de 1/3 do contêiner. 
       
       flex-basis: 300px garante uma largura mínima inicial.
       flex-grow: 1 permite que o artigo cresça e ocupe o espaço
                  disponível de forma igual entre os 3.
    */
    flex: 1 1 300px; 

    background-color: #ffffff;
    padding: 0;
    border-radius: 8px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
    text-align: left;
    transition: transform 0.3s ease;
    font-family: 'Montserrat', sans-serif; font-weight: 400; font-style: normal;
}

/* Efeito ao passar o mouse (opcional) */
.artigo-g:hover {
    /*transform: translateY(-5px);*/
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.4);
    /*box-shadow: 0 8px 15px rgba(0, 0, 0, 0.15);*/

}


/* 3. RESPONSIVIDADE (PARA TELAS PEQUENAS) */
@media (max-width: 960px) {
    /* Em telas menores que 960px, o 'gap' e 'flex: 1 1 300px'
       farão com que os artigos naturalmente quebrem para a linha de baixo
       quando não houver mais espaço suficiente para os três lado a lado.
       
       Se você quiser forçar 2 colunas e depois 1, pode ajustar o flex-basis:
    */
    .artigo-g {
        /* Garante que, se couberem 2, eles fiquem bem distribuídos */
        flex: 1 1 45%; 
    }
}

@media (max-width: 600px) {        
    .artigo-g {
        /* Em telas muito pequenas (celular), cada artigo ocupa sua própria linha (100%) */
        padding: 0;
        flex: 1 1 100%;
    }
}

/* Container Principal do Post com Imagem */
/*.post-geladeira-imagem {
    max-width: 550px;
    margin: 30px auto;
    background-color: #fcfcfc;
    border-radius: 12px;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
    overflow: hidden;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    line-height: 1.6;
    border: 1px solid #eee;  
}*/

/* Área da Imagem */
.artigo-g .post-imagem {
    float:left;
    max-width: 450px;
    height: auto; /* Altura fixa para a imagem 250px*/
    margin:20px;
    overflow: hidden;
}

.artigo-g .post-imagem img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* Cobre a área sem distorcer, cortando se necessário */
    display: block; /* Remove espaço extra abaixo da imagem */
    transition: transform 0.3s ease-in-out;
}

.artigo-g .post-imagem img:hover {
    transform: scale(1.05); /* Efeito de zoom suave ao passar o mouse */
}

/* Conteúdo do Post */
.artigo-g .post-conteudo {
    padding: 25px 30px;
    text-align: center;
}

.artigo-g .post-conteudo h3 {
    color: #333; /* Azul vibrante para o título #007bff*/
    font-size: 1.9em;
    margin-bottom: 15px;
    line-height: 1.3;
    font-weight:600;
}

.artigo-g .post-conteudo p {
    color: #444;
    font-size: 1.2em;
    margin-bottom: 0;
    font-weight:400;
    line-height: 27px;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

.artigo-g .post-conteudo .destaque {
    font-weight: bold;
    color: #333;
    background-color: #e6f3ff;
    padding: 10px;
    border-radius: 5px;
    margin-bottom: 20px;
}

/* Botão do WhatsApp */
.btn-whatsapp {
    display: inline-block;
    background-color: #25d366; /* Cor oficial do WhatsApp */
    color: white;
    padding: 14px 28px;
    text-decoration: none;
    border-radius: 30px; /* Botão arredondado */
    font-weight: bold;
    font-size: 1.1em;
    margin-top: 10px;
    transition: background-color 0.3s ease, transform 0.2s ease;
    box-shadow: 0 4px 10px rgba(37, 211, 102, 0.4);
}

.btn-whatsapp:hover {
    background-color: #1fad50;
    transform: translateY(-2px);
}

/* Telefone Direto */
.telefone-direto {
    margin-top: 15px;
    font-size: 1em;
    color: #666;
    font-weight: normal;
}

.telefone-direto strong {
    color: #333;
}

/* Mídia Query para Responsividade */
@media (max-width: 600px) {

    .artigo-g .post-conteudo h3 {
        font-size: 1.7em;
    }

    .artigo-g .post-conteudo {
        padding: 10px;            
    }

    .artigo-g .post-conteudo p {  
        margin-bottom: 5px;
        line-height: 27px;
    }

    .btn-whatsapp {
        padding: 12px 20px;
        font-size: 1em;
    }
}

.p-tit-cont{margin-top: 20px;font-size: 2em; padding: 10px 0;}
.p-sub-tit-cont{padding: 0 0; font-size: 2.5em}
.float-l{float: left}
.float-r{float: right}
/*MENSAGENS DO SISTEM*/
.trigger{padding: 5px 15px 5px 40px; font-size: 12px; margin-bottom: 0; color: #FFF}
.trigger a{font-weight: 600; font-size: 12px; text-transform: uppercase; padding: 5px 15px; background: #069; color: #fff;}
.trigger a:hover{background: #09f; color: #fff;}

.accept{background: green url(../icons/accept.png) center left 10px no-repeat; color: #FFF; font-size: 1.2em}/*#71ca73*/
.infor{background:  #00192A url(../icons/infor.png) center left 10px no-repeat; color: #FFF; font-size: 1.2em}/*#c8dbfd*/
.alert{background:  gold url(../icons/alert.png) center left 10px no-repeat; color: #000; font-size: 1.2em}/*#faf7b7*/
.error{background:  red url(../icons/error.png) center left 10px no-repeat; color: #FFF; font-size: 1.2em}/*#ffafaf*/
.excluir{ width: 22px; height: 20px; background: red url(../icons/act_delete.png) center left 0px no-repeat; font-size: 0; cursor: pointer}