/*** ACCORDION ***/
    .accordion-item{
        border: none;
        border-top: 1px solid #295788;
        border-bottom: 1px solid #295788;
        background-color: transparent;
    }

    .accordion-button:focus{
        box-shadow: none;
    }

    .accordion-button{
        background-color: transparent; 
    }

    .accordion-button:not(.collapsed){
        font-weight: 600;
        background-color: transparent; 
        box-shadow: 0 -3px 0 #295788;
/*        box-shadow: none;*/
    }

    .logo-modulo{
        aspect-ratio: auto 125/28;
        width: 11.875rem; /* 190px */
    }

    #accordionBeneficiosWrapper{
        padding-top: 10%;
    }

/*** BENEFICIOS ***/
    .section-beneficios{
        padding: 80px 0;
    }

    .titulo-item{
        margin-bottom: 0.5rem; /* 8px */
        font-size: 1.25rem; /* 20px */
        font-weight: 600;
    }

/*** BOX BALLOON ***/
    .box-balloon-center,
    .box-balloon-end{
        background-color: #fff;
        box-shadow: 11px 11px 0px 0px #295788;
        -webkit-box-shadow: 11px 11px 0px 0px #295788;
        -moz-box-shadow: 11px 11px 0px 0px #295788;
    }

    .box-balloon-center{
        padding: 50px 40px;
        border-radius: 10px 80px 10px 90px;
    }

    .box-balloon-end{
        padding: 70px 50px;
        border-radius: 10px 100px 10px 120px;
    }

    .box-balloon-start{
        padding: 70px 50px;
        border-radius: 100px 10px 150px 10px;
        background-color: #fff;
        box-shadow: -11px 11px 0px 0px #295788;
        -webkit-box-shadow: -11px 11px 0px 0px #295788;
        -moz-box-shadow: -11px 11px 0px 0px #295788;
    }

/*** BUSCA POR IA ***/
    .section-busca-ia{
        background: url("../img/bg-busca-ia.webp") left #212529;
        background-size: cover;
    }

    .box-lg{
        /*text-align: center;*/
        padding: 60px 65px;
        background-color: #fff;
        border: 4px solid #ff8e33;
        border-radius: 20px;
    }

/*** CARDS ***/
    .card-item{
        padding: 1.25rem 1.875rem; /* 20px 30px */
        border-color: #ddd;
        background-color: #f3f3f3;
         box-shadow: 0px 0px 4px 0px rgba(33,37,41,0.2);
        -webkit-box-shadow: 0px 0px 4px 0px rgba(33,37,41,0.2);
        -moz-box-shadow: 0px 0px 4px 0px rgba(33,37,41,0.2);
    }

    .card-icon-wrapper{
        margin-bottom: 1.25rem; /* 20px */
        text-align: center;
    }

    .icones-primarios{
        font-size: 40px;
    }

/*** CLIENTES ***/
    .logo-cliente{
        aspect-ratio: auto 11 / 8;
    }


/*** DEPOIMENTOS ***/
    .box{
        height: 100%;
        padding: 40px;
/*        border: 2px solid #ee8601;*/
        background-color: #f9f9f9;
        box-shadow: 0px 5.91px 7.39px 0px rgba(0, 0, 0, 0.25);
    }

    .box-icon{
        margin-right: 16px;
        font-size: 30px;
        color: #1bbd06;
    }

    .carousel-inner {
        padding: 1em;
    }

    .carousel .box{
        margin: 0 12px;
    }

    .carousel-control-next,
    .carousel-control-prev{
        width: 2rem;
        height: 2rem;
        background-color: #295788;
        border-radius: 50%;
        top: 50%;
        transform: translateY(-50%);
    }

    .carousel-control-next-icon,
    .carousel-control-prev-icon{
        width: 24px;
        height: 24px;
    }

    .logo-empresa-depoimento{
        height: 60px;
        aspect-ratio: auto 40 / 23;
    }

    .txt-quote{
        margin-top: 30px;
        font-weight: 500;
    }

    #logoDepoimentoVix{
        max-width: 130px;
        aspect-ratio: 130 / 29;
    }

/*** FALE CONOSCO ***/
    .section-fale-conosco{
        background: url("../img/bg-mobile-saphira-3.webp") #004165;
        background-size: cover;
    }

    .section-fale-conosco-sol{
        background: url("../img/bg-mobile-sol-3.webp") #004165;
        background-size: cover;
    }

/*** IMAGENS ***/
    .img-cropped-xe,
    .img-cropped-xs{
        width: 100%;
    }

    .img-e-over{
        width: 80%;
        margin-top: -110px;
        margin-left: 60px;
    }

    .img-e-under{
        width: 80%;
        margin-left: -50px;
    }

    .img-s-over{
        width: 80%;
        margin-top: -140px;
        margin-left: 50px;
    }

    .img-s-under{
        width: 80%;
        margin-left: -50px;
    }

    #telaSolAtendimento{
        aspect-ratio: auto 458 / 329;
    }

    #telaSolKanban,
    #telaSolRelatorio{
        aspect-ratio: auto 380 / 273;
    }

    #telaSolMonitora{
        aspect-ratio: auto 967 / 695;
    }

    #telaSolWorkflow{
        aspect-ratio: auto 809 / 424;
    }

/*** INTEGRAÇÃO COM SISTEMAS LEGADOS ***/
    .section-integracao-legados{
        background: url("../img/bg-mobile-sol-2.webp") right #004165;
        background-size: cover;
    }

/*** JUMBOTRON ***/
    /*.jumbotron-header{
        height: 350px;
    }*/

    .jumbotron-saphira:before{
        background-image: url('../img/bg-mobile-saphira-1.webp');
    }

    .jumbotron-sol:before{
        background-image: url('../img/bg-mobile-sol-1.webp');
    }

    .jumbotron-saphira{
        min-height: 615px;
    }

    .jumbotron-sol{
        min-height: 708px;
    }

    .logo-banner-saphira{
        width: 250px;
        aspect-ratio: auto 50 / 17;
    }

    .logo-banner-sol{
        width: 250px;
        aspect-ratio: auto 275 / 142;
    }

/*** MODAL ***/
    .btn-modal,
    .btn-modal:hover{
        padding: 7px 14px;
        color: #fff;
        border: none;
        border-radius: 50%;
        background-color: #000;
    }

    .btn-modal:hover{
        font-weight: 600;
    }

    .modal-video .modal-content{
        border: none;
        background: transparent;
    }

    .modal-video .modal-footer{
        border: none;
    }

/*** PORTAL DE FORNECEDORES ***/
    .section-portal-fornecedores{
        background: url("../img/bg-mobile-saphira-2.webp") right #004165;
        background-size: cover;
    }

/*** TABS ***/
    .tab-component .nav.nav-underline{
        border-bottom: 2px solid #295788;
    }

    .tab-component .nav.nav-underline .nav-link{
        color: #666;
        border: 0;
    }

    .tab-component .nav.nav-underline .nav-link:focus, .tab-component .nav.nav-underline .nav-link:hover,
    .tab-component .nav.nav-underline .nav-link.active, .tab-component .nav.nav-underline .show>.nav-link{
        color: #212529;
    }

    .tab-component .nav.nav-underline .nav-item:has(.active):after,
    .tab-component .nav.nav-underline .nav-item:hover::after{
        width: 100%;
    }

    .tab-component .nav.nav-underline .nav-item::after{
        width: 0;
    }

    .tab-component .nav.nav-underline .nav-item:has(.active):after,
    .tab-component .nav.nav-underline .nav-item::after{
        content: '';
        display: block;
        height: 2px;
        background: #295788;
        transition: 0.2s;
    }

    .tab-content-illustration{
        height: 300px;
    }

/*** VÍDEO ***/
    .thumb-video{
        float: left;
        width: 550px;
        aspect-ratio: auto 22 / 15;
        border-radius: 1.25rem; /* 20px */
        box-shadow: 0px 0px 10px 0px rgba(33,37,41,0.3);
        -webkit-box-shadow: 0px 0px 10px 0px rgba(33,37,41,0.3);
        -moz-box-shadow: 0px 0px 10px 0px rgba(33,37,41,0.3);
    }

    .thumb-video-icon-circle{
        color: #f00;
    }

    .thumb-video-icon-play{
        left: 1px;
    }

    .video-play-button{
        position: relative;
        bottom: 3.75rem; /* 60px */
        display: inline-block;
        cursor: pointer;
    }

    .video-play-button-elements{
        align-items: center;
        padding: 8px 6px;
        border-radius: 50px;
        background-color: rgba(33, 37, 41, 0.85); /* #212529 */
    }

    .video-play-button-elements:hover{
        background-color: rgba(33, 37, 41, 1.0); /* #212529 */
    }

    .video-play-button-text{
        color: #fff;
    }

@media (min-width: 768px){
    /*** CARDS ***/
    .icones-primarios{
        font-size: 3.125rem; /* 50px */
    }

    /*** DEPOIMENTOS ***/
    .carousel-inner{
        display: flex;
        width: 90%;
        margin-inline: auto;
        padding: 1em 0;
        overflow: hidden;
    }

    .carousel-item{
        display: block;
        margin-right: 0;
        flex: 0 0 calc(100% / 2);
    }

    /*** IMAGENS ***/
    .img-cropped-xe{
        width: auto;
        margin-right: -50%;
    }

    .img-cropped-xs{
        width: auto;
        margin-left: calc(100% - 1300px);
    }

    .img-e-over{
        width: 90%;
        margin-top: -190px;
        margin-left: 110px;
    }

    .img-e-under{
        width: 90%;
        margin-left: 60px;
    }

    .img-s-over{
        width: 100%;
        margin-top: -250px;
        margin-left: -50px;
    }

    .img-s-under{
        width: 100%;
        margin-left: -260px;
    }

    /*** JUMBOTRON ***/
    .logo-banner-saphira,
    .logo-banner-sol{
        width: 204px;
    }

    .box-balloon-center,
    .box-balloon-end{
        padding: 5.625rem 3.75rem; /* 90px 60px */
        border-radius: 0.625rem 6.25rem 0.625rem 9.375rem; /* 10px 100px 10px 150px */
    }

    .box-balloon-start{
        padding: 5.625rem 4.375rem; /* 90px 70px */
        border-radius: 6.25rem 0.625rem 12.5rem 0.625rem; /* 100px 10px 200px 10px */
    }

    .jumbotron-saphira:before{
        background-image: url('../img/bg-saphira-1.webp');
    }

    .jumbotron-sol:before{
        background-image: url('../img/bg-sol-1.webp');
    }

    .pe-md-60{
        padding-right: 60px;
    }

    .section-fale-conosco{
        background: url("../img/bg-saphira-3.webp") #004165;
        background-size: cover;
    }

    .section-fale-conosco-sol{
        background: url("../img/bg-sol-3.webp") #004165;
        background-size: cover;
    }

    .section-integracao-legados{
        background: url("../img/bg-sol-2.webp") right #004165;
        background-size: cover;
    }

    .section-portal-fornecedores{
        background: url("../img/bg-saphira-2.webp") right #004165;
        background-size: cover;
    }
}

@media (min-width: 992px){
    .d-tab-component{ 
        display: block !important;
    }

    .d-accordion-component{
        display: none !important;
    }
}

@media (min-width: 1300px){
    .img-e-over{
        width: 100%;
        margin-top: -240px;
        margin-left: 240px;
    }

    .img-e-under{
        width: 100%;
        margin-left: 120px;
    }

    .img-s-over{
        width: 100%;
        margin-top: -420px;
        margin-left: -90px;
    }

    .img-s-under{
        width: 100%;
        margin-left: -400px;
    }
}