.institucional-1 {padding: 111px 0 52px;}
.institucional-1 .conteudo {display: flex; flex-direction: row; gap: 25px; justify-content: space-between;}
.institucional-1 .conteudo > .img {display: block; flex: 0 0 515px; width: 100%; height: 100%;}
.institucional-1 .conteudo .img img {width: 100%; height: 100%; object-fit: cover;}
.institucional-1 .conteudo .info {width: 583px;}

.institucional-1 .conteudo .info {display: flex; flex-direction: column; justify-content: space-between; gap: 30px; padding: 0 0 320px; position: relative;}
.institucional-1 .conteudo .info .texto {font: 400 15.5px / 32px montserrat; color: var(--preto-ter);}

.institucional-1 .conteudo .info .top .titulo {font: 700 45.99px / 51.81px aloe; color: var(--azul-qua); margin: 0 0 37px; padding: 42px 0 0; position: relative;}
.institucional-1 .conteudo .info .top .titulo::before {content: ''; width: 76px; height: 10px; background: var(--azul-qui); left: 0; top: 0; position: absolute;}

.institucional-1 .conteudo .info .bottom {display: flex; flex-direction: row; gap: 70px; margin: -6px 0 0 -296px; justify-content: space-between; position: absolute; bottom: 0; left: 0; background: var(--branco);}
.institucional-1 .conteudo .info .bottom .img {flex: 0 0 361px; padding: 26px 0 0 27px; background: var(--branco);}

.institucional-1 .conteudo .info .bottom .sub-info {width: 445px; margin-top: 16px;}
.institucional-1 .conteudo .info .bottom .sub-info .titulo {font: 700 31.54px / 35.52px aloe; color: var(--azul-sex); margin: 0 0 14px;}
.institucional-1 .conteudo .info .bottom .sub-info .texto {hyphens: auto;}
.institucional-1 .conteudo .info .bottom .sub-info .btn-whats {font: 300 25.81px / 29.07px aloe; color: var(--branco); display: flex; flex-direction: row; align-items: center; gap: 10px; padding: 10px 22px 10px 20px; border-radius: 17.74px; margin: auto 0 0; background: #00B200; background: linear-gradient(90deg, rgba(0, 178, 0, 1) 0%, rgba(0, 208, 6, 1) 50%, rgba(0, 175, 0, 1) 100%); width: fit-content; margin: 53px 0 0; transition: 0.4s;}
.institucional-1 .conteudo .info .bottom .sub-info .btn-whats:hover {transform: scale(1.06); background: var(--verde); background: linear-gradient(90deg, var(--azul-seg) 0%, var(--azul-seg) 0%, #00486f 100%);}
.institucional-1 .conteudo .info .bottom .sub-info .icone {width: 24px; height: 24px;}
.institucional-1 .conteudo .info .bottom .sub-info .icone svg {width: 100%; height: 100%;}
.institucional-1 .conteudo .info .bottom .sub-info .icone svg path {fill: #fff;}


/* seciton 2 */
.institucional-2 {overflow: hidden; padding: 0 0 94px;}
.institucional-2 .conteudo {display: flex; flex-direction: row; gap: 25px; justify-content: space-between;}
.institucional-2 .conteudo .imgs {display: block; flex: 0 0 585px; width: 100%; height: 100%; padding: 55px 0 0 68px; background: var(--branco); position: relative;}
.institucional-2 .conteudo .imgs img {width: 100%; height: 100%; object-fit: contain;}
.institucional-2 .conteudo .imgs .img {width: 100%; height: 100%; object-fit: contain;}
.institucional-2 .conteudo .imgs .carro {width: 929px; height: auto; object-fit: contain; position: absolute; bottom: -161px; left: -56px;}
.institucional-2 .conteudo .info {width: 583px;}

.institucional-2 .conteudo .info {display: flex; flex-direction: column; justify-content: space-between; gap: 71px;}
.institucional-2 .conteudo .info .texto {font: 400 15.5px / 32px montserrat; color: var(--preto-ter);}

.institucional-2 .conteudo .info .top .titulo {font: 700 45.99px / 51.81px aloe; color: var(--azul-qua); margin: 0 0 37px; padding: 42px 0 0; position: relative;}
.institucional-2 .conteudo .info .top .titulo::before {content: ''; width: 76px; height: 10px; background: var(--azul-qui); left: 0; top: 0; position: absolute;}

.institucional-2 .conteudo .info .bottom .sub-info .titulo {font: 700 39.78px / 50.24px aloe; color: var(--azul-qua);}

/* seciton 3 */
.institucional-3 .conteudo {display: grid; grid-template-areas: 'a b c' 'd e f' 'g h i'; grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(3, 1fr);}


/* seciton 4 */
.institucional-4 {padding: 95px 0 72px; position: relative; display: flex; justify-content: center; align-items: center; overflow: hidden;}
.institucional-4 .conteudo {display: flex; flex-direction: row; justify-content: center; gap: 20px; position: relative;}
.institucional-4 .conteudo::before {content: ''; width: 76px; height: 10px; background: var(--azul-qui); top: 0; position: absolute; margin: 0 auto;}
.institucional-4 .conteudo .img {width: 200px;}
.institucional-4 .carro {max-width: 833px; max-height: 415px; width: 100%; height: 100%; position: absolute; left: 0; top: 104px;object-fit: contain;}

.institucional-4 .conteudo .info {flex: 0 0 855px; display: flex; flex-direction: column; justify-content: flex-start; align-items: flex-end; margin: 0 30px 0 0;}
.institucional-4 .conteudo .titulo {font: 700 45.99px / 51.81px aloe; color: var(--azul-qua); margin: 47px 0 39px 0; text-align: right;}
.institucional-4 .conteudo .texto {font: 400 15.5px / 32px montserrat; color: var(--cinza-ter); margin: 0 0 48px; max-width: 608px; width: 100%; text-align: justify; hyphens: auto;}
.institucional-4 .conteudo .marcas {max-width: 608px; width: 100%; display: flex; flex-direction: row; gap: 39px;}
.institucional-4 .conteudo .marcas .marca {max-width: 174px; max-height: 46px; width: 100%; height: auto;}
.institucional-4 .conteudo .marcas .marca img {width: 100%; height: 100%; object-fit: contain;}

@media (max-width:1920px){
     .institucional-4 .carro {left: -5%;}
}

@media (max-width:1700px){
     .institucional-4 .carro {left: -10%;}
}

@media (max-width:1580px){
     .institucional-4 .carro {left: -15%;}
}

@media (max-width:1450px){
     .institucional-4 .carro {left: -20%;}
}

@media (max-width:1330px){
     .institucional-4 .carro {left: -25%;}
}

@media (max-width:1250px){
     .institucional-2 .conteudo .info .bottom .sub-info .titulo {font-size: 32px ; line-height: 42px;}
     .institucional-2 .conteudo .imgs {padding: 45px 0 0 48px;}
     .institucional-2 .conteudo .imgs {flex: 0 0 525px}
}
@media (max-width:1230px){
     .institucional-4 .carro {left: -33%;}
     .institucional-1 .conteudo .info .bottom {gap: 40px;}

}

@media (max-width:1200px){
     .institucional-1 .conteudo {position: relative;}
     .institucional-1 .conteudo .info {position: static; padding: 0 0 430px; flex: 0 0 48%;}
     .institucional-1 .conteudo > .img {flex: 0 0 48%;}
     .institucional-1 .conteudo .info .bottom {margin: 0; flex-direction: row-reverse; padding: 20px 0 0; justify-content: space-between; width: 100%;}
     .institucional-1 .conteudo .info .bottom .img {flex: 0 0 51%;}
     .institucional-1 .conteudo .info .top .titulo {font-size: 32px; line-height: 42px;}     
}
@media (max-width:1150px){
     .institucional-2 .conteudo .info .top .titulo {font-size: 36px; line-height: 48px;}
     .institucional-4 .carro {left: -38%;}
}

@media (max-width:1100px){
     .institucional-2 .conteudo .info {width: 100%;}
     .institucional-2 .conteudo .imgs .img {display: none; height: 650px; width: fit-content;}
     .institucional-1 .conteudo .info .bottom {left: 0;}

     .institucional-2 .conteudo {flex-direction: column-reverse; gap: 35px;}
     .institucional-2 .conteudo .imgs {padding: 0; flex: 0 0 auto;}
     .institucional-2 .conteudo .imgs .carro {bottom: 0; left: unset; right: 0; position: relative; width: auto; height: 290px;}

     .institucional-2 .conteudo .info .top .titulo .mb-none {display: none;}
     
     
     .institucional-4 .carro {left: -48%;}
}
@media (max-width:1040px){
     .institucional-4 .carro {left: -54%;}
}
@media (max-width:990px){
     
     .institucional-1 {padding: 25px 0;}
     .institucional-1 .conteudo {flex-direction: column;}
     .institucional-1 .conteudo .info {width: 100%;}
     .institucional-1 .conteudo .info .top .titulo {text-align: center; display: flex; justify-content: center; align-items: center; font-size: 30px; line-height: 37px; margin: 0 0 10px; padding: 25px 0 0;}
     .institucional-1 .conteudo .info .top .titulo::before {left: unset;}
     .institucional-1 .conteudo .info .texto, .institucional-1 .conteudo .info .bottom .sub-info .texto {text-align: justify; hyphens: auto;}
     .institucional-1 .conteudo > .img {flex: 0 0 auto; width: 50%; margin: 0 auto;}
     .institucional-1 .conteudo .info .bottom .img {padding: 0; flex: 0 0 50%;}
     .institucional-1 .conteudo .info .bottom {align-items: center; position: static; padding: 0;}
     .institucional-1 .conteudo .info {padding: 0; gap: 20px;}
     .institucional-1 .conteudo .info .bottom .sub-info{margin-top: 0;}
     .institucional-1 .conteudo .info .bottom .sub-info .titulo {font-size: 28px; line-height: 34px;}

     .institucional-1 .conteudo .info .bottom .sub-info .btn-whats {font-size: 18.81px; line-height: 18.07px;}

     .institucional-2 {padding: 0 0 25px;}
     .institucional-2 .conteudo .info {gap: 15px;}
     .institucional-2 .conteudo .info .top .titulo {font-size: 37px; line-height: 42px; margin: 0 0 20px; padding: 20px 0 0; text-align: center; display: flex; justify-content: center;align-items: center;}
     .institucional-2 .conteudo .info .texto {text-align: justify; hyphens: auto;}
     .institucional-2 .conteudo .info .top .titulo::before {left: unset;}
     .institucional-2 .conteudo .info .bottom .sub-info .titulo {font-size: 30px; line-height: 34px; text-align: center;}

     

     .institucional-3 .conteudo {grid-template-areas: 'a a' 'b c' 'e d' 'h g' 'i f'; grid-template-columns: repeat(2, 1fr); grid-template-rows: repeat(5, 1fr);}     

     .institucional-4 {padding: 25px 0; flex-direction: column;}
     .institucional-4 .carro {left: -24%; top: unset; width: 533px; height: 300px; position: relative; margin: 0 0 10px;}
     .institucional-4 .conteudo {flex-direction: column; align-items: center;}
     .institucional-4 .conteudo .img {display: none;}
     .institucional-4 .conteudo .info {margin: 0; flex: 0 0 auto;}
     .institucional-4 .conteudo .titulo {text-align: center; margin: 20px 0 10px; font-size: 37px; line-height: 42px;}     
     .institucional-4 .conteudo .texto {margin: 0 0 20px;}
     .institucional-4 .conteudo .marcas {justify-content: center; gap: 15px; flex-wrap: wrap;}
     .institucional-4 .conteudo .marcas .marca {width: 104px;}
     .institucional-4 .conteudo .texto,.institucional-4 .conteudo .marcas {max-width: 100%;}
}
@media (max-width:700px){
     .institucional-1 .conteudo .info .bottom {flex-direction: column;}
     .institucional-1 .conteudo .info .bottom .sub-info {width: 100%;}
     .institucional-1 .conteudo .info .bottom .sub-info .titulo {text-align: center;}
     .institucional-1 .conteudo .info .bottom .sub-info .btn-whats {margin: 15px auto 0;}
}
@media (max-width:650px){
     .institucional-1 .conteudo > .img {width: 100%; max-width: 400px;}
     .institucional-1 .conteudo .info .bottom .img {flex: 0 0 100%; width: 100%;}

     .institucional-2 .conteudo .info .top .titulo {font-size: 30px; line-height: 34px;}
     .institucional-2 .conteudo .info .bottom .sub-info .titulo {font-size: 27px; line-height: 30px;}
     .institucional-2 .conteudo .imgs .carro {height: auto; width: 100%;}
     .institucional-2 .conteudo {gap: 15px;}

     .institucional-4 .carro {left: -19%; top: unset; width: 400px; height: auto; position: relative;}
     .institucional-4 .conteudo .titulo {font-size: 30px; line-height: 34px;}
}
