@media screen and (max-width: 1490px){
    /*==Modal servicios start==*/
    .modal-card {
        width: 500px;
        height: 300px;
    }
    .modal-card .frontFace-modal > h5 {
        font-size: 18px;
        height: 35px;
        line-height: 35px;
    }
    .modal-card .backFace-modal h5 {
        font-size: 22px;
    }
    .modal-card .backFace-modal p {
        font-size: 15px;
    }
    .modal-card .backFace-modal .links-modal {
        font-size: 14px;
    }
    /*==Modal servicios end==*/
}
@media screen and (max-width: 1300px){
    /*******Sliders responsive start******/
    .thumbnail{
        justify-content: start;
    }
    /*******Sliders responsive end******/
}
@media screen and (max-width: 1256px){
    /*==Modal servicios start==*/
    .modal-scroll-content{
        overflow-y: auto;
        max-height: calc(100% - 100px); 
        padding-right: 3px;
        margin-bottom: 15px;
    }
    /*==Modal servicios end==*/
}
@media screen and (max-width: 1275px){
    /*======about us start======*/
    .aboutUS-content{
        max-width: 600px;
    }
    /*======about us end======*/
}
@media screen and (max-width: 1250px){

    /*******Sliders responsive start******/
    .slider>.list>.item>.content>h2{
        font-size: 60px;
    }
    /*******Sliders responsive end******/


    /*======about us start======*/
    .aboutUS-content h1 {
        font-size: 48px;
    }

    .aboutUS-content h5,
    .aboutUS-content h6 {
        font-size: 28px;
    }

    .aboutUS-content p {
        font-size: 16px;
    }

    .btn-socialUs {
        padding: 10px 24px;
        font-size: 15px;
    }

    .socialUs a {
        width: 36px;
        height: 36px;
        font-size: 18px;
    }

    .aboutUs-img {
        max-width: 340px;
    }
    /*======ABOUT US end======*/
}
@media screen and (max-width: 1155px){
    /*ABOUT US IDENTITY START*/
    .card__container{
        grid-template-columns: repeat(2, 350px);
    }
    .card__article, .card__img{
        border-radius: 3rem;
    }
    .cardInfo_data{
        left: 2rem;
        bottom: 3rem;
    }
    /*ABOUT US IDENTITY END*/
}
@media (max-width: 1024px){

    /*======Servicios start======*/
    .servcios_container {
        justify-content: center;
    }
    /*======Servicios start======*/


    /*======ABOUT US start======*/
    .aboutUS-content h6 .textUS {
        font-size: 24px;
        min-width: 18ch;
    }
    /*======ABOUT US ends======*/
}
@media (max-width:  995px) {

    /*******Menu y Header responsive start******/
    .header{
        padding: 1.25rem 4%;
    }
    /*******Menu y Header responsive end******/

    /*======Slider start======*/
    .slider>.list>.item>.content>h2{
        font-size: 55px;
    }
    /*======Slider end======*/

    /*======FOOTER START======*/
    .footer_container{
        max-width: 960PX;
    }
    .footer_wrapper .footer_widget, 
    .footer_wrapper .footer_widget:nth-child(1){
    width: calc(40% - 50px);
    }
    
    /*======FOOTER END======*/


    /*======about us start======*/
    .aboutUs {
        flex-direction: column;
        padding: 60px 5% 0;
        height: auto;
        text-align: center;
    }

    .aboutUs-img {
        order: 1;
        max-width: 280px;
        margin-bottom: 30px;
        animation: slideLeft 1s ease forwards;
        padding-left: 0;

    }

    .aboutUS-content {
        order: 2;
        max-width: 90%;
        animation: slideRigth 1s ease forwards;
    }

    .aboutUS-content h1 {
        font-size: 38px;
    }

    .aboutUS-content h5,
    .aboutUS-content h6 {
        font-size: 22px;
    }

    .aboutUS-content span:nth-child(5) {
        flex-direction: column;
        gap: 10px;
        font-size: 18px;
    }

    .aboutUS-content p {
        font-size: 15px;
        text-align: justify;
        align-items: center;
    }

    .btn-socialUs {
        font-size: 14px;
        padding: 8px 20px;
    }

    .socialUs a {
        margin: 20px 10px;
    }
    .aboutUS-content h6 .textUS {
        font-size: 20px;
        min-width: 16ch;
    }
    /*======about us end======*/
}
@media (min-width:  1150px){
    /*ABOUT US IDENTITY START*/
    .card_container{
        grid-template-columns: repeat(3, 350px);
    }
    /*ABOUT US IDENTITY END*/
}
@media screen and (max-width: 915px){
    /*******Sliders responsive start******/
    .slider>.list>.item>.content>h2{
        font-size: 45px;
    }
    /*******Sliders responsive end******/
}
@media screen and (max-width: 894px){
    /*==Servicios CONTPAQi servicios start==*/
    #img-servicio3-servicios{
        height: 100%;
        width: auto;
    }
    /*==Servicios CONTPAQi servicios end==*/
}
@media screen and (max-width: 855px){
    /*======Servicios sistemas contpaqi start======*/
    #sistemas-contpaqiModal-antivirus-kaspersky .sistemas-contpaqiModal-container {
        max-height: 90vh;
        overflow-y: auto;
    }
    /*======Servicios sistemas contpaqi end======*/
}
@media (max-width:  770px), (max-height: 730px){
    /*======Servicios sistemas contpaqi start======*/
    .sistemas-contpaqiModal-container {
        padding: 2em 1.5em;
        display: flex;
        flex-direction: column;
    }

    /* Título siempre arriba */
    .sistemas-contpaqiModal-titulo {
        font-size: 1.5rem;
    }

    /* Contenedor con scroll para párrafo + wrap */
    .modal-scroll-area {
        overflow-y: auto;
        flex: 1;
        padding-right: 10px; /* para que no tape el scrollbar */
    }

    /* Botón siempre abajo */
    .wrap-servidor-btn {
        flex-shrink: 0;
        margin-top: 15px;
    }
    .modal-scroll-area::-webkit-scrollbar {
        width: 4px;
    }
    .modal-scroll-area::-webkit-scrollbar-thumb {
        background: #1C7DD6;
        border-radius: 4px;
    }
    .modal-scroll-area::-webkit-scrollbar-track {
        background: #E3E3E3;
    }
    /*======Servicios sistemas contpaqi end======*/
}
@media (max-width:  768px){

    /*******Menu y Header responsive start******/
    #menu-barras-icon{
        display: block;
    }
    .navbar{
        position: fixed;
        top: 100%;
        left: 0;
        width: 100%;
        padding: .5rem 4%;
        display: none;

    }
    .navbar.active{
        display: block;
    }
    .navbar>a{
        display: block;
        margin: 1.5rem 0;
    }
    .nav-bg{
        position: fixed;
        top: 7.5%;
        left: 0;
        width: 100%;
        height: 25%;
        background: rgba(100, 250, 250, .2);
        border-bottom: 2px solid rgba(0, 0, 0, .3);
        backdrop-filter: blur(10px);
        z-index: 99;
        display: none;
    }
    .nav-bg.active{
        display: block;
    }
    /*******Menu y Header responsive end******/

    /*======Servicios start======*/
    .servcios_container {
        flex-direction: column;
        align-items: center;
    }

    .servcios_container > section {
        max-width: 90%;
    }

    .servcios_container > section > img {
        height: 350px;
    }

    .service_info > h2,
    .service_info > h4 {
        font-size: 20px;
    }

    .service_info > p {
        font-size: 14px;
    }

    .service_info > button {
        width: 90%;
    }
    /*======Servicios end======*/

    /*******Sliders responsive start******/
    .slider>.list>.item>.content>h2{
        font-size: 35px;
    }
    .slider>.list>.item>.content>p{
        font-size: 16px;
    }
    .slider>.list>.item>.content>p:nth-child(1){
        text-transform: uppercase;
        letter-spacing: 10px;
        font-size: 15px;
    }
    /*******Sliders responsive end******/

    /*======FOOTER START======*/
    .footer_container{
        max-width: 720px;
    }
    .footer_wrapper .footer_widget, 
    .footer_wrapper .footer_widget:nth-child(1){
        width: 100%;
        margin: 0 10px 50px;
    }
    /*======FOOTER END======*/

    /*======About US- identity END======*/
    .subtitulo-Us {
        font-size: 40px;
        padding-bottom: 40px;
    }

    .MVV-Us_container {
        padding: 30px 15px;
    }

    .card_container{
        grid-template-columns: repeat(1, 350px);
    }
    /*======About US- identity END======*/
}
@media (max-width:  755px){

    /*******Menu y Header responsive start******/
    .nav-bg{
        height: 240px;
    }
    /*******Menu y Header responsive end******/

}
@media screen and (max-width: 750px){
    /*FQA START*/
    .categorias{
        grid-template-columns: 1fr 1fr;
    }
    .categorias > :nth-child(3){
        grid-column: 1/3;
        justify-self: center;
    }
    .categoria{
        padding: 10px;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .categoria>i{
        margin-right: 5px;
        margin-bottom: 0;
    }
    /*FQA END*/
}
@media screen and (max-width: 700px){
    /*==Modal servicios start==*/
    .modal-card {
        width: 400px;
        height: 250px;
    }
    .modal-card .frontFace-modal > h5 {
        font-size: 18px;
        height: 35px;
        line-height: 35px;
    }
    .modal-card .backFace-modal h5 {
        font-size: 18px;
        margin-top: 5px;
    }
    .modal-card .backFace-modal p {
        font-size: 13px;
    }
    .modal-card .backFace-modal .links-modal {
        font-size: 14px;
    }
    /*==Modal servicios end==*/
}
@media screen and (max-width: 678px){

    /*******Sliders responsive start******/
    .slider>.list>.item>.content>p{
        font-size: 14px;
    }
    
    /*******Sliders responsive end******/

}
@media screen and (max-width: 630px){
    /*Estilos titulos por cada modal start*/
        /*===Requerimientos optimos start===*/
        
        .wrap-servidor-list > li {
            display: flex;
            flex-wrap: nowrap; /* No permitir saltos */
            align-items: center;
            gap: 8px; /* Separación entre elementos */
            overflow-x: auto; /* Permite desplazamiento horizontal si no cabe */
        }
        .wrap-servidor-list > li i {
            margin-right: 5px;
        }
        /*===Requerimientos optimos end===*/
    /*Estilos titulos por cada modal end*/
}
@media screen and (max-width: 600px){

    /*FQA START*/
    .categorias{
        display: grid;
        grid-template-columns: 1fr;
        justify-content: center;
        align-items: center;
    }
    .categorias > * {
    grid-column: auto !important;
    justify-self: stretch !important;
    width: 100% !important;
    }
    /*FQA END*/


    /*======ABOUT US start======*/
    .aboutUS-content h6 .textUS {
        font-size: 18px;
        min-width: 14ch;
    }
    /*======ABOUT US end======*/

    /*==Modal servicios start==*/
    .modal>h6{
        font-size: 17px;
    }
    /*==Modal servicios end==*/
}
@media (max-width: 575px){
    /*==Servicios CONTPAQi servicios start==*/
    #img-servicio3-servicios{
        height: auto;
        width: 100%;
    }
    /*==Servicios CONTPAQi servicios end==*/
}
@media (max-width: 530px){

    /*======Servicios start======*/
    .servcios_container > section > img {
        width: auto;
    }
    /*======Servicios end======*/

    /*Estilos titulos por cada modal start*/
        /*===Requerimientos optimos start===*/
        .sistemas-contpaqiModal-parrafo{
            font-size: 14px;
        }
        .wrap-servidor-list > li {
            font-size: 14px;
            display: flex;
            flex-wrap: wrap; /* Permitir salto de línea */
            white-space: normal; /* Permitir que el texto se divida */
        }
        .wrap-servidor-list > li i,
        .wrap-servidor-list > li span {
            display: inline-flex;
            align-items: center;
        }
        .wrap-servidor-list > li {
            flex-direction: row;
        }
        .wrap-servidor-list > li span {
            margin-right: 5px;
        }
        /*===Requerimientos optimos end===*/
    /*Estilos titulos por cada modal end*/

}
@media (max-width:  500px){

    /*******Menu y Header responsive start******/
    .nav-bg{
        height: 240px;
    }
    /*******Menu y Header responsive end******/


    /*******Sliders responsive start******/
    .slider>.list>.item>.content>p:nth-child(3){
        font-size: 13px;
    }
    /*******Sliders responsive end******/

    /*******ABOUT US start******/
    .aboutUS-content h6 .textUS {
        font-size: 15px;
        min-width: 14ch;
    }
    .socialUs a{
        margin: 30px 10px 30px 0;
    }
    /*******ABOUT US END******/
}
@media (max-width: 480px){
    /*Abou us start*/
    .subtitulo-Us {
        font-size: 30px;
        padding-bottom: 30px;
    }
    /*Abou us end*/


    /*about us identity start*/
    .card_container{
        margin-inline: 1rem;
        grid-template-columns: 350px;
    }
    .card__img{
        width: 350px;
    }
    /*about us identity end*/


    /*==Modal servicios start==*/
    .modal.active{
        height: 700px;
    }
    .modal-card .backFace-modal h5 {
        font-size: 15px;
        margin-top: 0;
    }
    .modal-card .backFace-modal p{
        font-size: 12px;
    }
    .modal-card .backFace-modal .links-modal{
        height: 13px;
        line-height: 13px;
        font-size: 13px;
    }
    
    /*==Modal servicios end==*/


    /*==Servicios CONTPAQi servicios start==*/
    .container-servicios h6{
        font-size: 25px;
    }
    .container-servicios .box-container-servicios{
        grid-template-columns: repeat(auto-fit, minmax(325px, 1fr));
        gap: 15px;
    }
    .box-container-servicios .box-servicios .content-box-servicios p{
        font-size: 13px;
    }
    #contpaqi_vende_icono{
        height: auto;
        width: 100%;
    }
    /*==Servicios CONTPAQi servicios end==*/

}
@media (max-width: 410px){
    /*==Servicios CONTPAQi servicios start==*/
    .box-container-servicios .box-servicios .content-box-servicios p{
        font-size: 13px;
    }
    /*==Servicios CONTPAQi servicios end==*/

    /*===Requerimientos optimos start===*/
        .wrap-servidor-btn{
            margin-top: 10px;
        }
    /*===Requerimientos optimos end===*/
}
@media (max-width: 400px) {
    /*===Servicios pagina servicios strat===*/
    .container-servicios .box-container-servicios {
        grid-template-columns: 1fr; /* Una sola columna */
        gap: 10px;
    }
    .box-container-servicios .box-servicios {
        display: flex;
        flex-direction: column; /* Imagen arriba, texto abajo */
        align-items: center;
        text-align: center;
        padding: 10px;
    }
    .box-container-servicios .box-servicios .img-box-servicios{
        height: 300px;
    }
    .box-container-servicios .box-servicios .img-box-servicios img {
        width: 100%;
        height: auto;
        max-width: 275px; /* Evita que se haga demasiado grande */
    }
    .box-container-servicios .box-servicios .content-box-servicios h6 {
        font-size: 18px;
        margin-top: 8px;
    }
    .box-container-servicios .box-servicios .content-box-servicios p {
        font-size: 12px;
        line-height: 1.4;
    }
    .box-container-servicios .box-servicios .content-box-servicios button {
        font-size: 14px;
        padding: 6px 12px;
        margin-top: 8px;
    }
    /*===Servicios pagina servicios end===*/
}

