.institucional-bg .institucional {display: grid; grid-template-columns: repeat(2, 1fr); padding: 85px 0 75px;}
.institucional .fotos {gap: 18px; display: grid;grid-template-columns: 1fr 1fr;}
.institucional .img {position: relative; display: flex; flex: 1 1 auto;}
.institucional .img .teste { background: #ccc;}

.institucional .img-small .teste{width: 200px; height: 150px; aspect-ratio: 200/150; align-self: flex-end; justify-self: flex-end;max-width: 200px}
.institucional .img-medium .teste{width: 260px; height: 245px; aspect-ratio: 260/245;max-width: 260px}
.institucional .img-large .teste{width: 540px; height: 260px; aspect-ratio: 540 / 260;max-width: 540px; z-index: 2; object-fit: cover;}

.institucional .img-large {grid-column: 1/-1; justify-content: flex-end; align-items: flex-end;}
.institucional .img-medium:nth-of-type(2) {justify-self: flex-end;}
.institucional .img-medium:nth-child(3) {margin-right: 65px;}

.institucional.bottom .fotos {align-items: center;}

.institucional .img-large::before {left: 50px;z-index: -1; bottom: 0;}
.institucional .img-large.top::before {right: -15px;z-index: -1; transform: skew(15deg); bottom: 0; left: unset;}
.institucional .img-medium:nth-child(3)::before {right: -12px;  top: 0; }
.institucional .img-medium:nth-child(3)::before,
.institucional .img-large::before {content: ''; position: absolute; background: var(--cor2); height: 115px; width: 45px; transform: skewX(-15deg); z-index: -1;}


.institucional .texto-parent .titulo {font: 600 40.21px / 47.07px oblivion; padding: 0 0 50px 0;}
.institucional .texto-parent .texto {font: 400 15px / 26.7px montserrat; padding: 0 55px 0 0;}

.institucional-bg .institucional.bottom {grid-template-columns: repeat(2, 1fr);}
.institucional.bottom .img-large {margin-right: 20px; align-items: flex-start;}
.institucional.bottom .img-medium {justify-self: flex-start; align-items: flex-end;}
.institucional.bottom .img-small .teste{width: 285px; height: 285px; aspect-ratio: 1/1; align-self: flex-end; justify-self: flex-end;max-width: 285px}
.institucional.bottom .img-medium .teste{width: 250px; height: 335px; aspect-ratio: 250/335;max-width: 250px; object-fit: contain;}
.institucional.bottom .img-large .teste{width: 515px; height: 225px; aspect-ratio: 515 / 225;max-width: 515px; z-index: 2;}
.institucional.bottom .img-large::before {left: 30px; bottom: 10px;}


.institucional.bottom .img-medium::before { position: absolute; background: var(--cor2); height: 115px; width: 45px; transform: skewX(-15deg); z-index: -1; right: -15px; top: 10px;}
.institucional.bottom .texto-parent {padding: 0 0 0 50px;}
.institucional.bottom .texto-parent .texto {padding: 0;}




@media(max-width: 1250px){
    .institucional-bg .institucional {grid-template-columns: 1fr; padding: 40px 0;}
    .institucional .texto-parent .titulo {text-align: center; font-size: 30px; line-height: 1.1; padding: 0 0 30px;}
    .institucional .texto-parent .texto {text-align: center; font-size: 14px; padding: 0 0 30px;}
    .institucional .fotos { justify-self: anchor-center;}
    .institucional .img-large {justify-content: center;}
    .institucional .img-large::before {left: -15px;}

    .institucional.bottom {display: flex; flex-direction: column-reverse; justify-content: center; align-items: center; gap: 30px;}
    .institucional.bottom .texto-parent {padding: 0;}
    .institucional .img-medium:nth-child(3) {margin: 0;}

}

@media(max-width: 650px){ 
    .institucional.bottom .img-large {grid-row: 1/2; grid-column: 1/-1; margin: 0;}
    .institucional.bottom .img-large::before,
    .institucional.bottom .img-medium::before {display: none;}
    .institucional.bottom .img-small .teste,
    .institucional.bottom .img-medium .teste {height: 140px;max-width: 300px; width: auto; aspect-ratio: 1/1;}
    .institucional.bottom .img-large .teste {max-width: 300px;}
    .institucional.bottom .img-small {justify-content: flex-end;}
    .institucional .img-small .teste ,
    .institucional .img-medium .teste{width: 140px; height: auto;}
    .institucional .img-large .teste {width: 300px; height: auto;}
}