.site-header {
background-color: #181818;
position: relative;
}
#metodologia {
padding: 4.8vw 0;
}
#metodologia .content{
-webkit-box-direction: normal;
-webkit-box-orient: horizontal;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
flex-direction: row;
margin: auto;
min-width: 1000px;
position: relative;
width: 67.3%;
}
#metodologia .content .esq{
-ms-flex-pack: center;
-webkit-box-direction: normal;
-webkit-box-orient: vertical;
-webkit-box-pack: center;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
flex-direction: column;
justify-content: center;
padding: 0 3% 0 4.9%;
width: 50%;
}
#metodologia .content .esq .titulo{
color: var(--chumbo);
font-size: 1.45vw;
font-weight: 800;
margin-bottom: 15px;
}
#metodologia .content .esq b{
font-weight: 700;
}
#metodologia .content .esq .subtitulo{
font-size: 16px;
margin-bottom: 1vw;
}
#metodologia .content .esq .texto{
color: var(--chumbo);
font-size: 16px;
line-height: 1.45vw;
margin-bottom: 1.5vw;
letter-spacing: 0.3px;
}
#metodologia .content .dir{
padding: 0 4.9% 0 0;
width: 50%;
display: flex;
justify-content: flex-end;
align-items: flex-start;
}
#o_que_e .content{
margin: auto;
min-width: 1000px;
position: relative;
width: 67.3%;
padding: 0vw 3.229vw 0;
}
#o_que_e .content .titulo{
color: var(--chumbo);
font-size: 1.25vw;
font-weight: 700;
margin-bottom: 15px;
}
#o_que_e .content b{
font-weight: 700;
}
#o_que_e .content .subtitulo{
font-size: 16px;
margin-bottom: 1vw;
}
#o_que_e .content .texto{
color: var(--chumbo);
font-size:16px;
line-height: 1.45vw;
margin-bottom: 1.5vw;
letter-spacing: 0.3px;
text-align: justify;
}
#o_que_e .content .area-box{
display: flex;
align-items:center;
justify-content:end;
flex-direction: row;
margin-right: 4vw;
margin-bottom: 4.5vw;
gap: 2.875%;
}
#o_que_e .content .area-box .box{
border: 1px solid var(--azul-claro);
width: 21%;
padding: 90px 0.8vw 1vw 0.8vw;
min-height: 220px;
display: flex;
align-items: center;
flex-direction: column;
gap: 15px;
position: relative;
}
#o_que_e .content .area-box .icone{
position: absolute;
top: 10px;
width: 100%;
height: 70px;
display: flex;
justify-content: center;
align-items: center;
}
#o_que_e .content .area-box .mais, #o_que_e .content .area-box .igual{
font-size: 1.719vw;
color: var(--azul-claro);
}
#o_que_e .content .area-box .box svg{
width: 60px;
height: 60px;
color:#3a91f2;
fill:var(--azul-claro)
}
#o_que_e .content .area-box .menor svg{
width: 50px;
height: 50px;
}
#o_que_e .content .area-box .box .titulo{
font-size: 16px;
margin-bottom: 0px;
font-weight: 600;
}
#o_que_e .content .area-box .box .texto-box{
text-align: center;
font-size: 14px;
}
#ecossistema{
margin-bottom: 60px;
}
#ecossistema .content{
margin: auto;
min-width: 1000px;
position: relative;
width: 67.3%;
padding: 0vw 3.229vw 0;
}
#ecossistema .content .titulo{
color: var(--chumbo);
font-size: 1.25vw;
font-weight: 700;
margin-bottom: 15px;
}
#ecossistema .content b{
font-weight: 700;
}
#ecossistema .content .subtitulo{
font-size: 16px;
margin-bottom: 1vw;
}
#ecossistema .content .texto{
color: var(--chumbo);
font-size: 16px;
line-height: 1.45vw;
margin-bottom: 1.5vw;
letter-spacing: 0.3px;
text-align: justify;
}
#ecossistema .content .cards{
width: 100%;
display: flex;
justify-content: space-between;
column-gap: 2%;
flex-wrap: wrap;
margin: 20px 0px;
z-index: 1;
}
#ecossistema .content .cards .card{
background-color: var(--branco);
width: 31%;
border: 2px solid #DFDFDF;
display: flex;
align-items: center;
flex-direction: column;
text-align: center;
padding: 80px 1.6vw 2vw 1.6vw;
row-gap:20px;
transition: all 0.2s ease-in-out;
position: relative;
}
#ecossistema .content .cards .card:hover{
box-shadow: 0px 8px 30px rgba(0, 0, 0, 0.4);
}
#ecossistema .content .cards .card .logo{
position: absolute;
top: 20px;
width: 100%;
display: flex;
justify-content: center;
align-items: center;
height: 50px;
}
#ecossistema .content .cards .card .logo img {
width: 130px;
height: auto;
} 
#ecossistema .content .cards .card .logo .feelbix{
width: 100px;
}
#ecossistema .content .cards .card .logo .zixbe{
width: 55px;
}
#ecossistema .content .cards .card .eixo{
font-size: 20px;
font-weight: 700;
color: var(--azul-claro);
}
#ecossistema .content .cards .card .texto{
font-size: 14px;
line-height: 24px;
font-weight: 500;
margin-bottom: 60px;
text-align: center;
}
#ecossistema .content .cards .card .saiba-mais{
border: 1px solid var(--azul-claro);
color: var(--azul-claro);
padding: 0.9vw 3vw;
display: flex;
justify-content: center;
align-items: center;
font-size: 14px;
font-weight: 700;
position: absolute;
bottom: 30px;
background-color: var(--branco);
transition: all 0.2s ease-in-out;
}
#ecossistema .content .cards .card:hover .saiba-mais{
background-color: var(--azul-claro);
color: var(--branco);
}
#ecossistema .content .cards .card .saiba-mais:hover{
background-color: var(--azul-claro);
color: var(--branco);
}
#sepi_cta{
padding: 6vw 0;
position: relative;
background-color: var(--chumbo);
background-image: url(//zixbe.com/wp-content/themes/gestao-de-processos/transformacao-digital/produto_servico/consultoria-de-processos_sepi_banner.jpeg);
background-blend-mode: overlay;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
#sepi_cta .content {
align-items: center;
-ms-flex-direction: row;
-webkit-box-direction: normal;
-webkit-box-orient: horizontal;
display: -webkit-box;
display: -ms-flexbox;
display: flex
;
flex-direction: row;
margin: auto;
min-width: 1000px;
position: relative;
width: 67.3%;
}
#sepi_cta .box_esq {
padding: 0 2.9% 0 4.9%;
width: 50%;
}
.cta_subtitulo {
color: var(--branco);
font-size: 0.83vw;
font-weight: 500;
letter-spacing: 0.4px;
margin-bottom: 0.9vw;
}
.cta_titulo {
color: var(--azul-claro);
font-size: 2.9vw;
font-weight: 700;
letter-spacing: 1.5px;
line-height: 3.65vw;
}
.quebra_linha {
display: block;
}
#sepi_cta .box_dir {
padding: 0 4.9% 0 0;
width: 50%;
}
.cta_chamado {
color: var(--branco);
font-size: 1.15vw;
font-weight: 600;
letter-spacing: 0.4px;
margin-bottom: 0.9vw;
text-align: center;
}
.cta_botao {
width: 100%;
background-color: var(--azul-claro);
}
.btn_animacao {
background-color: var(--azul-zixbe);
color: var(--branco);
display: inline-block;
position: relative;
}
.btn_animacao span {
-ms-flex-align: center;
-ms-flex-pack: center;
-webkit-box-align: center;
-webkit-box-pack: center;
align-items: center;
display: block;
display: -webkit-box;
display: -ms-flexbox;
display: flex
;
font-size: 0.85vw;
height: 100%;
justify-content: center;
letter-spacing: 0.5px;
position: relative;
width: 100%;
}
.cta_botao.btn_animacao span {
text-transform: uppercase;
font-weight: 600;
letter-spacing: 1px;
padding: 16px;
}
.btn_animacao:before, .btn_animacao:after {
-o-transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
background: var(--branco);
content: "";
position: absolute;
right: 0;
top: 0;
transition: all 0.3s ease;
}
.btn_animacao:before {
height: 0%;
width: 2px;
}
.btn_animacao:after {
height: 2px;
width: 0%;
}
.btn_animacao span:before, .btn_animacao span:after {
-o-transition: all 0.3s ease;
-webkit-transition: all 0.3s ease;
background: var(--branco);
bottom: 0;
content: "";
left: 0;
position: absolute;
transition: all 0.3s ease;
}
.btn_animacao span:before {
height: 0%;
width: 2px;
}
.btn_animacao span:after {
height: 2px;
width: 0%;
}