.site-header {
background-color: #181818;
position: relative;
}
.header_page p span {
font-weight: 700;
color: var(--azul-zixbe);
display: block;
} #case_individual .content {
margin: auto;
min-width: 1000px;
position: relative;
width: 67.3%;
padding: 4vw 3.229vw;
}
.casesind_titulo {
font-weight: 800;
color: var(--chumbo);
font-size: 1.66vw;
line-height: 2.6vw;
letter-spacing: 0.5px;
}
.casesind_texto {
color: var(--chumbo);
font-size: 0.85vw;
line-height: 1.6vw;
}
.introducao_content .box_esq {
width: 64.5%;
}
.introducao_content .box_dir {
width: 30%;
}
.organiza_boxes {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
margin-top: 2.7vw;
}
.imagem_intro {
width: 100%;
height: auto;
border: 2px solid #9bbadc;
} #case_individual .content.content_desafio {
padding: 0vw 3.229vw;
}
.casesind_subtitulo {
font-weight: 700;
color: var(--azul-zixbe);
font-size: 1.45vw;
letter-spacing: 0.5px;
margin-bottom: 1.9vw;
}
.organiza_boxes_metade {
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
}
.bloco_chumbo .organiza_boxes_metade { align-items: flex-start;
}
.bloco_chumbo .box_esq p,
.content_desafio .box_dir p {
margin-bottom: 1.5vw;
}
.bloco_chumbo .box_esq p:last-child,
.content_desafio .box_dir p:last-child {
margin-bottom: 0;
}
.organiza_boxes_metade .box_esq {
width: 48%;
margin-right: 5%;
}
.organiza_boxes_metade .box_dir {
width: 47%;
}
.imagem_detalhes {
width: calc(100% - 17px);
position: relative;
bottom: 50px;
object-fit: cover;
margin-left: 17px;
}
.div_detalhes {
position: relative;
}
.div_detalhes::after {
content: '';
height: 15px;
width: 80%;
background-color: var(--azul-zixbe);
position: absolute;
left: 0px;
top: -65px;
z-index: 1;
}
.div_detalhes::before {
content: '';
height: 80%;
width: 17px;
background-color: var(--azul-zixbe);
position: absolute;
left: 0px;
top: -65px;
z-index: 1;
}
.versao-azul .div_detalhes::after,
.versao-azul .div_detalhes::before{
background-color: var(--azul-claro);  
}
.quadrado_azul {
position: absolute;
border: 3px solid var(--azul-zixbe);
width: 72%;
height: 57%;
left: 21%;
bottom: 19%;
} .bloco_chumbo {
background-color: var(--chumbo);
border-top: 3px solid var(--azul-zixbe);
border-bottom: 3px solid var(--azul-zixbe);
}
.caseind_texto_branco,
.bloco_chumbo  p,
.bloco_chumbo  ul li{
font-weight: 600;
color: var(--branco);
font-size: 0.95vw;
line-height: 1.82vw;
letter-spacing: 0.5px;
}
.bloco_chumbo  ul{
padding-left: 20px;
list-style: disc;
margin-bottom: 15px;
}
.organiza_boxes_metade.metade_baixo .box_esq {
width: 50%;
margin-right: 0;
}
.organiza_boxes_metade.metade_baixo .box_dir {
width: 48%;
display: flex;
flex-direction: column;
align-items: flex-end;
position: relative;
position: sticky;
top: 100px;
}
.organiza_boxes_metade.metade_baixo .box_dir img {
position: relative;
z-index: 1;
}
#depoimentos-02 .organiza_boxes_metade.metade_baixo .box_dir img {
max-width: 350px;
margin: auto;
}
.imagem_quadrado {
width: 85%;
height: 100%;
object-fit: cover;
margin-right: 15px;
z-index: 2;
}
.quadrado_atras {
position: absolute;
border: 2px solid var(--azul-zixbe);
width: 62%;
height: 75%;
right: -15px;
top: -15px;
} .m_bottom {
margin-bottom: 1.9vw;
} .kpi_palavras {
background-image: url(//zixbe.com/wp-content/themes/gestao-de-processos/transformacao-digital/case_individual/consultoria-de-processos_fundo_kpi.jpg);
background-repeat: no-repeat;
background-size: cover;
}
.kpi_texto {
color: var(--branco);
font-size: 0.88vw;
font-weight: 500;
line-height: 1.25vw;
}
.kpi_texto span {
color: var(--azul-claro);
font-weight: 700;
}
.coluna_03 {
width: 27.84%;
}
.coluna_01 {
width: 25.33%;
padding: 0 0 0 2.5%;
}
.coluna_02 {
width: 28.33%;
padding: 0 0 0 1%;
}
.kpi_tcoluna {
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
}
.kpi_tcoluna hr {
border: none;
border-left: 1px solid #4d4d4d;
height: 100px;
position: relative;
top: 25%;
width: 1px;
margin: 0 3.5%;
}
#case_individual .kpi_palavras .content,
#case_individual .kpi_numeros .content {
padding: 5vw 3.229vw 6vw;
} .kpi_numeros {
background-color: var(--chumbo);
}
.kpi_subtitulo {
text-align: center;
color: var(--azul-claro);
font-size: 0.93vw;
text-transform: uppercase;
}
.kpi_number {
color: var(--azul-claro);
font-weight: 300;
font-size: 3vw;
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
}
.kpi_number p {
color: var(--branco);
font-size: 4vw;
font-weight: 700;
}
.postid-1025 .coluna_02 .kpi_number p,
.postid-1096 .coluna_02 .kpi_number p{
font-size: 2vw;
}
.texto_03 {
text-align: center;
width: 50%;
margin-left: 25%;
} .kpi_numeros.versao-azul {
background-color: var(--azul-zixbe);
}
.kpi_numeros.versao-azul .kpi_tcoluna hr {
background-color: transparent;
border-left: 1px solid #ffffff66;
height: 200px;
}
.kpi_numeros.versao-azul .kpi_texto {
width: 80%;
}
.kpi_numeros.versao-azul .kpi_maisde{
font-weight: 600;
text-align: center;
margin-bottom: 10px;
}
.kpi_numeros.versao-azul .kpi_sub{
color: var(--branco);
text-align: center;
width: 70%;
margin-top: 10px;
margin-left: 15%;
}
#case_individual .kpi_numeros.versao-azul .content {
padding: 5vw 3.229vw;
} #depoimentos {
background-color: #e8e8e8;
padding: 4.5vw 0;
overflow: hidden;
}
#depoimentos .content {
margin: auto;
min-width: 1000px;
padding: 0 8.3%;
width: 67.3%;
display: flex;
flex-direction: column;
align-items: center;
}
#depoimentos .content .titulo {
color: var(--preto);
font-size: 2.075vw;
font-weight: 800;
letter-spacing: 0.7px;
line-height: 2.5vw;
text-align: center;
margin-bottom: 50px;
}
#depoimentos .content .titulo span {
color: var(--azul-claro);
}
#depoimentos .content .box-depoimento {
width: 100%;
}
#depoimentos .header-video {
width: 100%;
background-color: var(--branco);
height: 40px;
display: flex;
align-items: center;
justify-content: space-between;
padding: 0 22px;
box-sizing: border-box;
}
#depoimentos .circle {
width: 15px;
height: 15px;
background-color: black;
border-radius: 15px;
}
#depoimentos .circle:first-child {
background-color: var(--azul-claro);
}
#depoimentos .organiza-circle {
display: flex;
gap: 10px;
}
#depoimentos .video-content {
padding: 3vw 2.8vw;
}
#depoimentos .box-video {
background-color: #000;
}
#depoimentos .video-content iframe {
border: 1px solid var(--azul-claro);
box-shadow: #3A91F259 0px 5px 15px;
position: relative;
width: 100%;
height: 25.13vw;
}
#depoimentos .swiper-depo {
height: auto;
width: 100%;
overflow: visible;
}
#depoimentos .paginacao-depo {
position: relative;
top: 25px;
bottom: auto;
}
#depoimentos .paginacao-depo .swiper-pagination-bullet {
width: 12px;
height: 12px;
opacity: 1;
}
#depoimentos .nome {
color: var(--azul-claro);
font-size: 24px;
font-weight: 800;
letter-spacing: 0.2px;
margin-top: 20px;
}
#depoimentos .cargo {
color: #fff;
font-size: 18px;
font-weight: 400;
letter-spacing: 0.2px;
} #banner {
-ms-flex-align: center;
-ms-flex-pack: center;
-webkit-box-align: center;
-webkit-box-pack: center;
align-items: center;
background-color: #181818;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
height: 77vh;
min-height: 700px;
justify-content: flex-end;
position: relative;
flex-direction: column;
background-image: url(//zixbe.com/wp-content/themes/gestao-de-processos/transformacao-digital/case_individual/cases-novo-bg.webp);
background-repeat: no-repeat;
background-size: contain;
background-position: center right;
padding-bottom: 30px;
}
#banner .opacidade {
position: absolute;
top: 0;
width: 100%;
background: #000000c4;
height: 100%;
}
#banner .banner_content {
align-items: flex-start;
display: flex;
flex-direction: row;
justify-content: space-between;
min-width: 1000px;
position: relative;
padding: 0vw 0vw 0px 12.5vw;
width: 86.1%;
}
#banner .banner_esq::before {
content: ' ';
height: calc(100% + 4.5vw);
left: 0;
position: absolute;
top: -1.2vw;
width: 20.55vw;
border: 3px solid var(--azul-zixbe);
z-index: 1;
}
#banner .banner_titulo {
color: var(--branco);
font-size: 2.4vw;
letter-spacing: 0.5px;
line-height: 2.9vw;
margin-bottom: 1.6vw;
}
#banner .banner_titulo b {
color: var(--azul-zixbe);
font-weight: 700;
display: block;
}
#banner .banner_texto {
color: var(--branco);
font-size: 0.85vw;
letter-spacing: 0.5px;
line-height: 1.27vw;
margin-bottom: 1.5vw;
}
#banner .box-video {
background-color: #0000004d;
backdrop-filter: blur(5px);
}
#banner .leg-video {
background-color: var(--azul-claro);
color: var(--branco);
margin-top: 20px;
padding: 15px;
text-align: center;
font-size: 14px;
font-weight: 700;
}
#banner .header-video {
width: 100%;
background-color: var(--branco);
height: 35px;
display: flex;
align-items: center;
justify-content: space-between;
padding: 0 22px;
}
#banner .video-content {
padding: 1.9vw 2.6vw;
}
#banner .video-produto {
border: 1px solid var(--azul-claro);
box-shadow: #3A91F259 0px 5px 15px;
position: relative;
width: 100%;
height: 21.2vw;
}
#banner .video-produto img,
#banner .video-produto iframe {
display: block;
}
#banner .video-produto iframe {
width: 100%;
height: 100%;
}
#banner .circle {
width: 13px;
height: 13px;
background-color: black;
border-radius: 15px;
}
#banner .circle:first-child {
background-color: var(--azul-claro);
}
#banner .organiza-circle {
display: flex;
gap: 10px;
}
#banner .video-yt {
position: absolute;
width: 116px;
left: calc(50% - 58px);
top: calc(50% - 58px);
cursor: pointer;
transition: .2s all;
}
#banner .video-yt:hover {
transform: scale(1.05);
}
#banner .capa-yt {
filter: brightness(0.8);
width: 100%;
height: 100%;
object-fit: cover;
}
#banner .banner_esq {
width: 38%;
position: relative;
}
#banner .banner-box {
background-color: #181818;
position: relative;
z-index: 2;
margin-top: 1.8vw;
padding: 1vw 0 1vw 3vw;
border-left: 3px solid var(--azul-zixbe);
}
#banner .btn-1 {
height: 2.7083vw;
width: 9.535vw;
cursor: pointer;
background-color: var(--azul-claro);
}
#banner .btn_animacao span {
font-weight: 700;
font-size: 0.78vw;
}
#banner .banner_dir {
width: 56%;
margin-left: 0;
}
.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 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%;
}
.btn-saibamais.btn_animacao span {
font-weight: 700;
font-size: 18px;
}