.institucional-bg {padding: 80px 0 45px;}
.institucional .top {gap: 45px;}
.institucional .top .img {max-width: 540px; width: 100%; border-radius: 20px; overflow: hidden;}
.institucional .img img {width: 100%; height: 100%; object-fit: cover;}
.institucional .text {margin-top: 30px;}

.institucional .bottom {margin-top: 65px; gap: 40px; align-items: center;}
.institucional .bottom .grid-2 {gap: 25px; max-width: 540px;}
.institucional .bottom .img {max-height: 260px; border-radius: 20px; overflow: hidden;}

.diferenciais-institucional-bg {background: var(--cor2); padding: 85px 0;}
.diferenciais-institucional .diferenciais-lista {display: grid; grid-template-columns: repeat(2, 1fr); gap: 65px 25px;}
.diferenciais-institucional .diferencial {position: relative; border: 3px solid var(--cor1); padding: 50px 30px; }
.diferenciais-institucional .diferencial-imagem {position: absolute; top: 0; left: 50%; width: 70px; height: 70px; background: var(--cor1); border-radius: 50%; display: flex; align-items: center; justify-content: center; transform: translate(-50%, -50%);} 
.diferencial .titulo {text-align: center; font: 700 25.2px ubuntu; color: var(--branco);}
.diferencial .texto {text-align: center; font: 400 17px / 26.13px ubuntu; color: var(--branco); margin-top: 15px;}
.diferenciais-institucional > .title .title{color: var(--branco); text-align: center; white-space: nowrap;}
.diferenciais-institucional > .title {margin: 0 0 100px;}


.missao-bg {padding: 150px 0 80px; background: var(--cor3);}
.missao .titulo {font: 700 31.72px ubuntu; color: var(--preto_titulo);}
.missao .texto {font: 300 16px / 29.12px ubuntu; color: #040404;}
.missao .missao-item.top {display: flex; gap: 40px; padding-bottom: 80px;}
.missao .missao-item.bottom {display: grid; grid-template-columns: max-content repeat(3, 1fr); align-items: flex-start; gap: 45px; padding-top: 90px; border-top: 3px solid #E4EADD;}
.missao .missao-item.bottom .titulo {padding: 0 35px 0 0; height: 100%; align-content: center;}

.missao .missao-item .titulo p,
.missao .missao-item .texto,
.missao .missao-item .titulo {position: relative; z-index: 1;}
.missao .missao-item .titulo::after {position: absolute; content: ''; top: -80%; left: -7%; width: 110px; height: 110px;}
.missao .missao-item .titulo.missao::after {background: url(../../img/institucional/missao.svg) no-repeat center center;}
.missao .missao-item .titulo.visao::after {background: url(../../img/institucional/visao.svg) no-repeat center center;}
.missao .missao-item .titulo.valores::after {background: url(../../img/institucional/valor.svg) no-repeat center center; top: -35%; left: -40%; height: 140px; width: 140px;}
.diferenciais-bg {margin-bottom: -95px;}

@media(max-width: 1250px){
    .institucional-bg {padding: 40px 0;}
    .institucional .top {display: flex; flex-direction: column-reverse; align-items: center; gap: 25px;}
    .institucional .top .title {text-align: center;}
    .institucional .bottom {grid-template-columns: 1fr; text-align: center; justify-items: center;}
    .diferenciais-institucional > .title .title {white-space: normal;}
    .institucional .iframe {width: 100%; max-width: 600px;}

}

@media(max-width: 990px){
    .diferenciais-institucional-bg {padding: 45px 0;}
    .diferenciais-institucional > .title {margin: 0 0 60px;}
    .diferenciais-institucional .diferenciais-lista{grid-template-columns: 1fr; gap: 45px;}
    .missao .missao-item.top {flex-direction: column; padding: 0 0 20px;}
    .missao .missao-item.bottom {border: none; grid-template-columns: 1fr; gap: 0; padding: 20px 0 0}
    .missao .missao-item .titulo.valores::after {top: -80% !important; left: -7% !important;}
    .missao .titulo {font-size: 25px;}
    .missao .texto {font-size: 14px;}
    .institucional .bottom {margin-top: 30px;}
}