.banner-area {
    background: #F4F0F0;
    background-size: contain;
    box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.25);
    position: relative;
    font-family: "Nunito";
}

.banner-area p{
    color: #F31876;
    text-align: center;
    font-size: 26px;
}

.banner-area div h3{
    color: #373737;
    text-align: center;
    font-size: 13.769px;
    font-style: normal;
    font-weight: 900;
    line-height: normal;
}

.logo-banner {
    width: 100px;
    height: auto;
}

.banner-retangulo {
    background-color: #82D5A1;
    position: absolute;
    top: 65%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 49%;
    height: 102px;
    aspect-ratio: 1/1;
    border-radius: 10px;
    z-index: 0;
    max-width: 133px;
}

.img-banner {
    position: relative; /* Certifique-se de que a posição está configurada */
    top: calc(7px + (10 - 7) * ((100vw - 315px) / (766 - 315)));
    z-index: 999 !important;
}

@media (max-width: 315px) {
    .img-banner {
        top: 7px;
    }
}

@media (min-width: 766px) {
    .img-banner {
        top: 17px;
    }
}


.termos{
    font-family: "Nunito";
    font-style: normal;
}
.termos p{
    color: #0C0F0A;
    /* line-height: 252%; 40.32px */
}

.text-justify {
    text-align: justify;
  }


/* Responsividade Mobile First */
@media (min-width: 768px) and (max-width: 992px) {
    .banner-retangulo {
        top: 67%;
        left: 172px;
        width: 226px;
        height: 210px;
        max-width: 192px;
    }

    .banner-area p{
        font-size: 45px;
        font-weight: 900;
        line-height: 40px;
    }
    .banner-area div h3{
        font-size: 26px;
    }

    .img-banner {
        max-width: 248px;
    }

    .logo-banner {
        width: 200px;
        height: auto;
    }

    .container.termos{
        max-width: 750px;
        margin: 0 auto;
    }
}
@media (min-width: 993px) {
    .banner-retangulo {
        top: 63%;
        left: 278px;
        width: 53%;
        max-width: 409px;
        height: 305px;

    }
    .banner-area p{
        font-size: 50px;
        font-weight: 900;
        line-height: 79px;
    }
    .banner-area div h3{
        font-size: 40px;
    }

    .img-banner {
        max-width: 380px;
    }

    .logo-banner {
        width: 300px;
        height: auto;
    }

    .container.termos , .container{
        max-width: 770px;
        margin: 0 auto;
    }

    .banner-area .container{
        max-width: 960px !important;
    }
}