@media (min-width: 1624px) {
    .container,
    .container-lg,
    .container-md,
    .container-sm,
    .container-xl,
    .container-xxl {
        max-width: 1596px;
    }
}

@media (max-width: 1623.98px) {
    /* TEMA */
    body {
        font-size: 17px;
        line-height: 27px;
    }

    h1 {
        font-size: 50px;
        line-height: 55px;
        letter-spacing: -2px;
    }

    h2 {
        font-size: 55px;
        line-height: 55px;
    }

    h4 {
        font-size: 40px;
        line-height: 45px;
    }

    .form-control,
    .form-select,
    .choices__inner {
        font-size: 17px !important;
        border-radius: 40px !important;
        padding: 17px 30px !important;
    }
    .choices__inner {
        min-height: 45px !important;
        height: 45px;
    }

    .btn {
        border-radius: 40px;
        gap: 7px;
        font-size: 20px;
        padding: 17px 30px;
    }

    /* HEADER */
    header::before {
        height: 160px;
    }

    header .container {
        padding: 25px 0;
    }

    header .row:nth-child(1) {
        padding: 15px 0;
    }

    header .logo {
        max-height: 85px;
    }

    header .menu {
        gap: 30px;
    }

    header .row:nth-child(2) {
        padding: 25px 0;
    }

    header .row:nth-child(2) > div > div {
        padding: 25px 0;
    }

    header .row:nth-child(2) h1 {
        margin-bottom: 35px;
    }

    header .row:nth-child(2) p {
        margin-bottom: 25px;
    }

    header .row:nth-child(2) form > div {
        padding: 7px;
    }

    header .row:nth-child(2) .imagens {
        gap: 15px;
    }

    header .row:nth-child(2) .imagens > div {
        gap: 15px;
    }

    header .row:nth-child(2) .imagens > div > div {
        border-radius: 40px;
    }

    header .row:nth-child(2) .imagens .img-1 {
        width: 540px;
    }
    header .row:nth-child(2) .imagens .img-2 {
        width: 300px;
    }
    header .row:nth-child(2) .imagens .img-3 {
        width: 300px;
    }

    /* QUEM SOMOS */
    #quem-somos .container {
        padding: 80px 0;
    }

    #quem-somos .imagens {
        gap: 15px;
    }

    #quem-somos .imagens > div {
        gap: 15px;
    }

    #quem-somos .imagens > div > div {
        border-radius: 40px;
    }

    #quem-somos .imagens .img-4 {
        width: 360px;
    }

    #quem-somos .imagens .img-5 {
        width: 230px;
    }

    #quem-somos .imagens .gota {
        border-radius: 80px 20px 80px 80px;
        height: 160px;
        width: 160px;
        margin-top: 10px;
    }

    #quem-somos .container h2 {
        margin-bottom: 40px;
    }

    /* CLIENTES */
    #clientes {
        margin-bottom: 80px;
    }

    #clientes .container {
        border-radius: 25px;
    }

    #clientes ul {
        gap: 25px;
        padding: 40px 0;
    }

    #clientes ul li img {
        max-height: 120px;
    }

    /* COMO FUNCIONA */
    #como-funciona {
    }

    #como-funciona .container {
        border-radius: 25px;
        padding: 60px 80px;
    }

    #como-funciona .container::before {
        width: 160px;
    }

    #como-funciona .container .slider-vertical {
        max-height: 295px;
    }

    #como-funciona .row > div ul {
        gap: 15px;
    }

    #como-funciona .row > div ul li {
        gap: 15px;
    }

    #como-funciona .row > div ul li > div:nth-child(1) strong {
        border-radius: 30px;
        font-size: 25px;
        height: 60px;
        width: 60px;
    }

    #como-funciona .row > div ul li > div:nth-child(2) {
        gap: 5px;
    }

    #como-funciona .row > div ul li > div:nth-child(2) p {
        font-size: 14px;
        line-height: 20px;
    }

    #como-funciona .row > div {
        min-height: 450px;
    }

    #como-funciona .row > div .img-dashboard {
        border-radius: 15px;
        height: 420px;
        width: 672px;
        margin-left: 80px;
    }

    #como-funciona .dots {
        gap: 10px;
        bottom: 20px;
    }

    #como-funciona .dots a {
        border-radius: 8px;
        height: 16px;
        width: 16px;
    }

    /* VANTAGENS */
    #vantagens {
        padding: 80px 0;
    }

    #vantagens .col > div {
        gap: 30px;
    }

    #vantagens .col > div div:nth-child(2) .padrao {
        height: 70px;
        width: 760px;
    }

    #vantagens ul {
        padding-top: 40px;
        gap: 15px;
    }

    #vantagens ul li > img {
        margin-left: 30px;
        height: 440px;
    }

    #vantagens ul li > div {
        border-radius: 15px;
        padding: 40px;
        height: 440px;
        width: 380px;
    }

    #vantagens ul li > div h4 {
        margin-bottom: 0;
        position: absolute;
        top: 100px;
    }

    #vantagens ul li > div::before {
        height: 700px;
        width: 160px;
        right: 20px;
    }

    #vantagens ul li > div::after {
        border-radius: 21px;
        height: 40px;
        width: 40px;
        top: 20px;
        right: 20px;
    }

    #vantagens ul li > div p {
        color: var(--cor-magenta);
        position: absolute;
        top: 380px;
        left: -200px;
        opacity: 0;
        max-width: 230px;
        min-height: 180px;
    }

    #vantagens ul li.ativo > div::before {
        top: -36%;
    }

    #vantagens ul li.ativo > div::after {
        height: 30px;
        width: 30px;
        top: 25px;
        right: 25px;
    }

    /* CONTATO */
    #contato {
        margin-bottom: 80px;
    }

    #contato .imagens {
        gap: 15px;
    }

    #contato .imagens > div {
        gap: 15px;
    }

    #contato .imagens > div > div {
        border-radius: 40px;
    }

    #contato .imagens .img-6 {
        width: 360px;
    }

    #contato .imagens .img-7 {
        width: 230px;
    }

    #contato .imagens .gota {
        border-radius: 80px 20px 80px 80px;
        height: 160px;
        width: 160px;
        margin-top: 10px;
    }

    #contato .imagens .gota img {
        height: 70%;
    }

    #contato h2 {
        margin-bottom: 20px;
    }

    #contato p {
        margin-bottom: 20px;
    }

    #contato form .row {
        row-gap: 15px;
    }

    #contato form .btn-secondary {
        font-size: 16px;
        padding: 20px 30px;
    }

    /* FOOTER */
    footer::before {
        bottom: -40px;
        height: 160px;
    }

    footer .container {
        padding: 40px 0;
    }

    footer .row > div > div {
        gap: 30px;
    }

    footer .logo {
        max-height: 70px;
    }

    footer ul {
        gap: 30px;
    }

    footer ul li a img {
        max-height: 65px;
    }
}

@media (max-width: 1399.98px) {
    /* TEMA */
    body {
        font-size: 14px;
        line-height: 20px;
    }

    h1 {
        font-size: 40px;
        line-height: 45px;
        letter-spacing: -1px;
    }

    h2 {
        font-size: 40px;
        line-height: 40px;
    }

    h4 {
        font-size: 30px;
        line-height: 35px;
    }

    .form-control,
    .form-select,
    .choices__inner {
        font-size: 14px !important;
        border-radius: 40px !important;
        padding: 10px 25px !important;
    }
    .choices__inner {
        min-height: 45px !important;
        height: 45px;
    }

    .btn {
        border-radius: 40px;
        gap: 5px;
        font-size: 17px;
        padding: 14px 26px;
    }
    /* .bg-primary.login::after{
        width: 45%;
        background-position: left -15% top 100px;
    } */
     /* .login-person{
        height: 60%;
     } */
     .login-person img{
        height: 60%;
     }
    /* HEADER */
    header .row:nth-child(2) .imagens .img-1 {
        width: 450px;
    }
    header .row:nth-child(2) .imagens .img-2 {
        width: 200px;
    }
    header .row:nth-child(2) .imagens .img-3 {
        width: 200px;
    }

    /* QUEM SOMOS */
    #quem-somos .imagens .img-4 {
        width: 330px;
    }

    #quem-somos .imagens .img-5 {
        width: 180px;
    }

    #quem-somos .imagens .gota {
        border-radius: 65px 15px 65px 65px;
        height: 130px;
        width: 130px;
    }

    #quem-somos .container h2 {
        margin-bottom: 30px;
    }

    /* CLIENTES */
    #clientes {
        margin-bottom: 60px;
    }

    #clientes .container {
        border-radius: 25px;
    }

    #clientes ul {
        gap: 25px;
        padding: 30px 0;
    }

    #clientes ul li img {
        max-height: 100px;
    }
}

/* COMO FUNCIONA */
@media (max-width: 1623.98px) {
    #como-funciona .container .slider-vertical {
        max-height: 303px;
    }

    #como-funciona .row > div {
        min-height: 362px;
    }

    #como-funciona .row > div .img-dashboard {
        height: 362px;
        width: 580px;
    }

    #como-funciona .dots a {
        border-radius: 6px;
        height: 12px;
        width: 12px;
    }

    /* VANTAGENS */
    #vantagens {
        padding: 60px 0;
    }

    #vantagens ul {
        padding-top: 30px;
    }

    #vantagens ul li > img {
        margin-left: 20px;
        height: 350px;
    }

    #vantagens ul li > div {
        height: 350px;
        width: 325px;
    }

    /* CONTATO */
    #contato {
        margin-bottom: 60px;
    }

    #contato .imagens .img-6 {
        width: 330px;
    }

    #contato .imagens .img-7 {
        width: 180px;
    }

    #contato .imagens .gota {
        border-radius: 65px 15px 65px 65px;
        height: 130px;
        width: 130px;
    }

    #contato form .btn-secondary {
        font-size: 14px;
        padding: 14px 19px;
    }
}

@media (max-width: 1199.98px) {
}
/* COMO FUNCIONA */
@media (max-width: 1623.98px) {
    #como-funciona .container .slider-vertical {
        max-height: 348px;
    }

    #como-funciona .row > div {
        min-height: 324px;
    }

    #como-funciona .row > div .img-dashboard {
        height: 324px;
        width: 520px;
    }
}

@media (max-width: 991.98px) {
    /* TEMA */
    body {
        font-size: 12px;
        line-height: 16px;
    }

    h1 {
        font-size: 28px;
        line-height: 35px;
        letter-spacing: 0;
    }

    h2 {
        font-size: 22px;
        line-height: 26px;
    }

    h4 {
        font-size: 20px;
        line-height: 20px;
    }
    /* .bg-primary.login::after {
        width: 55%;
        background-position: left 0% top 100px;
    } */
    /* .login-person{
        height: 50%;
     } */
    .login-person img{
        height: 80%;
     }
    .form-page h2{
        line-height: 26px;
    }
    .form-control,
    .form-select,
    .choices__inner {
        font-size: 12px !important;
        border-radius: 40px !important;
        padding: 12px 20px !important;
    }
    .choices__inner {
        min-height: 45px !important;
        height: 45px;
    }

    .btn {
        gap: 5px;
        font-size: 14px;
        padding: 12px 20px;
    }

    /* HEADER */
    header .container {
        padding: 0 30px 30px;
    }

    header .menu {
        flex-direction: column;
        height: 0;
        overflow: hidden;
        position: absolute;
        top: 70px;
        right: 0;
        transform: translateY(-100%);
        width: 100%;
        gap: 15px;
        opacity: 0;
    }

    header .menu.ativo {
        background: var(--cor-magenta)
            linear-gradient(0deg, #c10464 0%, #a40c4b 100%);
        height: auto;
        transform: translateY(0);
        z-index: 1;
        box-shadow: 0 7px 5px #00000022;
        padding: 30px 0 40px;
        opacity: 1;

        transition: transform 0.3s ease-out, opacity 0.3s ease-out 0.2s;
    }

    header .toggle {
        display: flex;
        position: relative;
        z-index: 2;
    }

    header .logo {
        max-height: 40px;
    }

    header .row:nth-child(2) {
        padding: 0;
    }

    header .row:nth-child(2) h1 {
        margin-bottom: 20px;
    }

    header .row:nth-child(2) p {
        margin-bottom: 15px;
    }

    header .row:nth-child(2) form > div {
        padding: 5px;
        margin: 0;
    }

    header .row:nth-child(2) .imagens {
        flex-direction: column;
    }

    header .row:nth-child(2) .imagens > div {
        width: 100%;
        flex-direction: row;
    }

    header .row:nth-child(2) .imagens > div > div {
        border-radius: 20px;
    }

    header .row:nth-child(2) .imagens .img-1 {
        height: 250px;
        width: 100%;
    }
    header .row:nth-child(2) .imagens .img-2 {
        height: 150px;
        width: 70%;
    }
    header .row:nth-child(2) .imagens .img-3 {
        height: 150px;
        width: 30%;
    }

    /* QUEM SOMOS */
    #quem-somos .container {
        padding: 30px;
    }

    #quem-somos .imagens {
        margin-bottom: 30px;
    }

    #quem-somos .imagens > div {
        width: 65%;
    }

    #quem-somos .imagens > div:nth-child(2) {
        width: 35%;
    }

    #quem-somos .imagens > div > div {
        border-radius: 20px;
    }

    #quem-somos .imagens .img-4 {
        height: 250px;
        width: 100%;
    }

    #quem-somos .imagens .img-5 {
        height: 150px;
        width: 100%;
    }

    #quem-somos .imagens .gota {
        border-radius: 65px 15px 65px 65px;
        height: 80px;
        width: 80px;
        margin-top: 0;
    }

    #quem-somos .container h2 {
        margin-bottom: 15px;
    }

    /* CLIENTES */
    #clientes {
        margin: 0;
        padding: 0 30px;
    }

    #clientes ul {
        padding: 15px 0;
    }

    #clientes ul li img {
        max-height: 80px;
    }

    /* COMO FUNCIONA */
    #como-funciona {
        padding: 30px;
    }

    #como-funciona .container {
        border-radius: 25px;
        padding: 40px;
    }

    #como-funciona .container::before {
        width: 120px;
        opacity: 0.3;
    }

    #como-funciona .container .slider-vertical {
        max-height: 310px;
    }

    #como-funciona .row > div ul li {
        align-items: flex-start;
    }

    #como-funciona .row > div ul li > div:nth-child(1) strong {
        border-radius: 30px;
        font-size: 20px;
        height: 40px;
        width: 40px;
    }

    #como-funciona .row > div ul li > div:nth-child(2) p {
        font-size: 10px;
        line-height: 14px;
    }

    #como-funciona .row > div {
        min-height: 250px;
        margin-right: 0;
    }

    #como-funciona .row > div .img-dashboard {
        border-radius: 15px;
        height: 212px;
        width: 340px;
        bottom: 25px;
        margin-left: 0;
        top: unset;
    }

    #como-funciona .dots {
        gap: 10px;
        bottom: 20px;
    }

    #como-funciona .dots a {
        border-radius: 8px;
        height: 16px;
        width: 16px;
    }

    /* VANTAGENS */
    #vantagens {
        padding: 30px;
    }

    #vantagens .col > div {
        gap: 0;
    }

    #vantagens .col > div:nth-child(1) {
        max-width: 80%;
    }

    #vantagens ul {
        padding-top: 30px;
        gap: 15px;
        flex-direction: column;
    }

    #vantagens ul li > img {
        margin-left: 0;
        margin-top: 10px;
        height: auto;
        width: 100%;
    }

    #vantagens ul li > div {
        border-radius: 15px;
        padding: 30px;
        height: 280px;
        width: 100%;
    }

    #vantagens ul li > div::before {
        width: 120px;
    }

    #vantagens ul li > div::after {
        height: 30px;
        width: 30px;
    }

    #vantagens ul li.ativo > div::before {
        top: -36%;
    }

    #vantagens ul li.ativo > div::after {
        height: 25px;
        width: 25px;
        top: 23px;
        right: 23px;
    }

    /* CONTATO */
    #contato {
        margin: 0;
    }

    #contato .container {
        padding: 30px;
    }

    #contato .imagens {
        margin-bottom: 30px;
    }

    #contato .imagens > div {
        width: 65%;
    }

    #contato .imagens > div:nth-child(2) {
        width: 35%;
    }

    #contato .imagens > div > div {
        border-radius: 20px;
    }

    #contato .imagens .img-6 {
        height: 250px;
        width: 100%;
    }

    #contato .imagens .img-7 {
        height: 150px;
        width: 100%;
    }

    #contato .imagens .gota {
        border-radius: 65px 15px 65px 65px;
        height: 80px;
        width: 80px;
        margin-top: 0;
    }

    #contato form .row {
        justify-content: center;
    }

    /* FOOTER */
    footer .container {
        padding: 30px;
    }

    footer .logo {
        max-height: 40px;
    }

    footer .row > div {
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    footer .row > div > div {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }

    footer .row > div > div img {
        margin-bottom: 15px;
    }

    footer .row > div > ul {
        flex-wrap: wrap;
        justify-content: center;
        align-items: start;
    }

    footer .row > div > ul li a {
        font-size: 20px;
    }

    footer .row > div > ul li:last-child {
        /* min-width: 100%; */
        justify-content: center;
        display: flex;
    }
    .item.depoimento {
        .card {
            border-radius: 15px;
            padding-top: 2rem;
            width: 700px;
            min-height: 280px;
            height: fit-content;
            aspect-ratio: 16/9;
            & .div-titulo.left {
                flex-direction: row;
            }
            & .div-titulo.right {
                flex-direction: row-reverse;
            }
            & .div-texto {
                display: flex;
                justify-content: center;
                padding: 1rem 1rem 0;
                gap: 1em;
                & .aspas {
                width: 20px !important;
                height: 15px;
                margin-top: -0.5em;
                }
                & .texto-depoimento {
                color: #2b2b2b;
                width: 90%;
                text-align: justify;
                margin: 0;
                }
            }
            & .div-autor {
                display: flex;
                justify-content: start;
                align-items: center;
                padding: 1em 3rem;
                gap: 1em;
                & img {
                margin-left: 0rem;
                width: 60px;
                height: 60px;
                border-radius: 50%;
                }
                & p {
                white-space: wrap;
                font-weight: bold;
                }
            }
            & .logo-depoimento {
                position: absolute;
                bottom: 5px;
                right: 5px;
                width: 35px !important;
                height: 35px;
                margin: 0;
            }
        }
    }
}

@media (max-width: 767.98px) {
    .text-xs {
        font-size: 14px;
    }
    /* .bg-primary.login::after {
        content: "";
        height: 85%;
        width: 35%;
        background-image: url(../img/login-bg.png);
        background-repeat: no-repeat;
        background-size: cover;
        background-position: left 0% top 100px;
        z-index: 2;
        position: absolute;
        right: 0;
        bottom: 0;
    } */
    .bg-primary.login{
        max-height: 600px;
    }
    /* .login-person {
        height: 40%;
     } */
    .login-person img{
        height: 60%;
     }
}

@media (max-width: 575.98px) {
}
@media (min-width: 767.98px){
    .mw-md-80{
        max-width: 80% !important;
    }
}