@media (max-width:1200px) {
    .banner-main {
        .container {
            .left {
                .wrapper-conuntdowns {
                    /* justify-content: center; */
                    column-gap: 3rem;
                    flex-wrap: wrap;

                    .countdown {
                        margin: auto;
                        width: 8rem;
                    }
                }
            }
        }
    }

    .testimonies {
        .container {
            #swSuccess {
                padding-block: 0 5rem;
            }
        }
    }

    .popup-overlay {
        & .popup-container {
            & .popup-content {
                & .popup-carousel-container {
                    & .popup-carousel {
                        & .swiper-wrapper {
                            & .popup-carousel-slide {
                                .popup-carousel-item {
                                    display: flex;
                                    flex-direction: row;
                                    overflow: hidden;
                                    /* border: 1px solid rgba(255, 255, 255, 0.1); */
                                    height: 100%;

                                    max-width: inherit;
                                    margin: auto;
                                }
                            }
                        }
                    }
                }
            }
        }
    }
}

@media (max-width:1025px) {
    .header {

        padding-block: 0;
        background-color: #fff;

        .container {

            /* padding: 32px 0; */
            padding: 16px;
            background-color: inherit;

            .logo-header {
                img {
                    max-width: 80%;
                }
            }

            .hamburgerMenu {
                display: flex;

                #closeMenu {
                    display: none;
                }
            }

            .header-menu {
                display: none;
            }

            .menu-contacts {
                display: none;
            }



        }

        .menu-responsive {
            visibility: hidden;
            opacity: 0;
            height: calc(-76.8px + 100vh);
            width: 85%;
            /* max-width: 320px; */
            position: fixed;
            bottom: 0;
            left: 0;
            background: #000;
            transform: translateX(-100%);
            transition: all 0.3s ease-in-out;
            z-index: 999;
            display: flex;
            flex-direction: column;
            padding-top: 100px;

            .mega {
                display: block;
                padding-inline: 24px;

                ul {
                    list-style: none;
                    padding: 0;

                    li {
                        width: 100%;
                        cursor: pointer;
                        pointer-events: all;

                        a {

                            display: block;
                            width: 100%;
                            text-align: start;
                            padding: 20px 16px;
                            font-size: 20px;
                            color: #fff;
                            text-decoration: none;
                            border-top: 1px solid transparent;

                        }

                        &.demo {

                            /* background-color: transparent; */
                            padding: 12px 14px;
                            box-shadow: none;

                            a {
                                color: #000;
                                position: relative;
                                font-size: 18px;
                                width: fit-content;
                                padding: 0;
                                /* background-color: var(--bg-green-light); */
                                /* padding: 12px 14px; */
                                border-radius: 16px;

                                &::before {
                                    content: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIj4KICA8cGF0aCBkPSJNMTYgMlY2TTggMlY2TTMgMTBIMjFNNSA0SDE5QzIwLjEwNDYgNCAyMSA0Ljg5NTQzIDIxIDZWMjBDMjEgMjEuMTA0NiAyMC4xMDQ2IDIyIDE5IDIySDVDMy44OTU0MyAyMiAzIDIxLjEwNDYgMyAyMFY2QzMgNC44OTU0MyAzLjg5NTQzIDQgNSA0WiIgc3Ryb2tlPSIjMkMyQzJDIiBzdHJva2Utd2lkdGg9IjIuNSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+Cjwvc3ZnPg==');
                                    position: relative;
                                    top: 4px;

                                }


                            }

                        }

                    }
                }
            }





            &.active {
                visibility: visible;
                opacity: 1;
                transform: translateX(0);
            }
        }


        &.scrolling {
            .header-bottom {
                height: 116px;
            }
        }

    }

    .us {
        .container {
            .row {
                flex-direction: column;

                .left {
                    max-width: 100%;

                    figure {
                        display: flex;
                        flex-direction: column;
                        gap: 1rem;
                        align-items: center;
                        justify-content: center;

                        img {
                            max-width: 400px;
                            aspect-ratio: 1/ 1;
                        }
                    }
                }
            }
        }
    }

    .banner-main {
        margin-top: 150px;
        padding-block: 0;

        .container {
            flex-direction: column;
            padding: 24px;

            .texts {
                gap: 24px;
                max-width: 100%;

                h1 {
                    text-align: center;
                }

                p {
                    text-align: center;
                    max-width: 80%;
                    margin: auto;
                }

                .wrapperButtons {
                    justify-content: center;
                }
            }

            .wrapperVideo {
                width: 80%;
            }
        }
    }



    .companies {
        .container {
            padding: 60px;
        }


    }

    .soluciones {
        .container {
            .tabs-sistema {
                .tabs-contenido {
                    .tab-panel {

                        .categorias-contenedor {
                            .servicios-grid {
                                flex-direction: column;

                                .servicio-tarjeta {


                                    .servicio-contenido {
                                        .info {
                                            .servicio-titulo {
                                                font-size: 30px;

                                            }

                                            .servicio-descripcion {
                                                font-size: 16px;
                                            }
                                        }

                                    }

                                    .panel-video {}
                                }
                            }

                            .categorias-contenido {
                                .categoria-panel {
                                    .servicios-container {
                                        .servicios-swiper {
                                            .swiper-wrapper {
                                                .swiper-slide {
                                                    .servicio-item {

                                                        .servicio-info {


                                                            h3,
                                                            h4 {
                                                                text-align: center;
                                                            }

                                                            p {
                                                                text-align: center;
                                                            }

                                                            .ver-mas-btn {}
                                                        }

                                                        .servicio-imagen {


                                                            img {
                                                                object-fit: contain;
                                                            }
                                                        }

                                                        .servicio-video {}
                                                    }
                                                }
                                            }
                                        }
                                    }
                                }
                            }
                        }
                    }
                }
            }
        }
    }




}



@media (max-width:768px) {
    section {
        padding-block: 1rem;
    }




    .banner-main {
        margin-top: 100px;

        .container {
            background-color: #fff;
            padding: 20px;
            gap: 0rem;
            flex-direction: column;
            border-radius: 32px;


          .wrapperVideo{
            bottom: 0;
            .svgClipt{
                picture{
                    display: block;
                }
                .video-wrapper{
                    
                }
            }
          }

         


        }
    }

    .us {
        .container {
            .row {
                .wrapper {
                    flex-direction: column-reverse;

                    .wrapper-contadores {
                        .contador {

                            &:nth-child(1),
                            &:nth-child(2),
                            &:nth-child(4) {
                                border-right: none;
                            }
                        }

                    }

                    .wrapper-box {

                        display: grid;

                        .box {
                            .card-content {
                                .box-svg {}

                                .header-box {
                                    flex-direction: row;
                                    width: 100%;
                                    justify-content: center;
                                    gap: 1rem;
                                }

                                .texts {
                                    p {
                                        text-align: start;
                                    }
                                }
                            }

                        }
                    }
                }
            }
        }
    }



    .popup-overlay {
        & .popup-container {
            & .popup-content {
             .popup-close{
                top: -1%;
             }

                & .popup-body {
                    padding: 12px;
                    .popup-main-content {
                        display: flex;
                        gap: 10px;
                        flex-direction: column;

                        .popup-info {
                            width: 100%;
                            padding: 12px;
                            .popup-title{
                                font-size: 24px;
                            }
                            
                        }

                        .popup-media {
                            width: 100%;
                        }
                    }
                }
				 .popup-carousel-container{
                    padding: 12px;
                }
            }
        }
    }

    .contact {
        .container {
            gap: 2rem;
            flex-direction: column;

            .left {
                max-width: 100%;
                width: 100%;
            }

            .wpcf7 {
                max-width: 100%;

                .wpcf7-form {
                    .btn {
                        justify-content: center;
                    }
                }

            }
        }
    }

    .seats {
        .container {
            .wrapper-seats {
                display: grid;
                grid-template-columns: repeat(2, 1fr);
                grid-template-rows: auto;
            }
        }
    }



}

@media (max-width:680px) {
    .header {
        .container {
            padding: 16px;

            .logo-header {
                img {
                    max-width: 80%;
                }
            }
        }
    }

    .banner-main {
        .container {
            .right {
                .tracking-button {
                    &.purple {
                        bottom: 30%;
                    }
                }

                .wrapper-conuntdowns {
                    display: flex;
                    justify-content: center;
                    flex-wrap: wrap;
                    gap: 1rem;
                }

            }
        }
    }

    .popup-overlay {
        & .popup-container {
            & .popup-content {
                & .popup-carousel-container {
                    & .popup-carousel {
                        & .swiper-wrapper {
                            & .popup-carousel-slide {
                                .popup-carousel-item {
                                    display: flex;
                                    flex-direction: column;
                                    overflow: hidden;
                                    /* border: 1px solid rgba(255, 255, 255, 0.1); */
                                    height: 100%;
                                    max-width: inherit;
                                    margin: auto;
                                }
                            }
                        }
                    }
                }
            }
        }
    }
}





@media (max-width:560px) {


    .banner-main {
        .container {
            padding: 24px;

            .texts {
                .wrapperButtons {
                    flex-direction: column;
                    gap: 12px;

                    .benefitsB {
                        min-width: 11.375rem;
                    }
                }

                .buttons {
                    width: 100%;
                }
            }

            .right {
                .tracking-button {
                    &.purple {
                        bottom: 50%;
                    }
                }
            }
        }
    }

    .soluciones {
        .container {
            .tabs-sistema {
                .tabs-navegacion {
                    .tab-boton {
                        padding: 5px 10px;

                        .tab-titulo {
                            font-size: 14px;
                        }
                    }
                }

                .tabs-contenido {
                    .tab-panel {

                        .categorias-contenedor {
                            .servicios-grid {
                                flex-direction: column;

                                .servicio-tarjeta {
                                    width: 100%;
                                    min-height: 180px;

                                    .servicio-contenido {
                                        width: 100%;
                                    }

                                    .panel-video {
                                        display: none;
                                    }
                                }
                            }

                            .categorias-contenido {
                                .categoria-panel {
                                    .servicios-container {
                                        .servicios-swiper {
                                            .swiper-wrapper {
                                                .swiper-slide {
                                                    .servicio-item {
                                                        max-height: inherit;
                                                        flex-direction: column;
                                                        padding: 20px;

                                                        .servicio-info {
                                                            width: 100%;
                                                            max-width: 100%;

                                                            h3,
                                                            h4 {
                                                                text-align: center;
                                                            }

                                                            p {
                                                                text-align: center;
                                                            }

                                                            .ver-mas-btn {
                                                                margin: auto;
                                                            }
                                                        }

                                                        .servicio-imagen, .servicio-youtube  {
                                                            width: 100%;
                                                            height: 300px;
                                                            max-width: 100%;

                                                            img {
                                                                object-fit: contain;
                                                            }
                                                        }

                                                        .servicio-video {
                                                            width: 100%;
                                                            height: 300px;
                                                        }
                                                    }
                                                }
                                            }
                                        }
                                    }
                                }
                            }
                        }
                    }
                }
            }
        }
    }

    .seats {
        .container {
            .wrapper-seats {
                grid-template-columns: 1fr;

                .box-seat {
                    width: 100%;
                }
            }
        }
    }
	  .blog {
        padding: 1rem 0;
    }
	.companies{
		.container{
		padding: 48px 0;
			  #swCompaniesTwo {
            margin-top: 3rem;
        }
		}
	}
	.footer{
		padding:1rem 0;
	}
}


@media (max-width:530px) {



    .us {
        .container {
            padding: 20px;

            .row {
                .wrapper {
                    .wrapper-contadores {
                        display: flex;
                        justify-content: center;
                        gap: 1rem;
                        flex-wrap: wrap;
                    }
                }
            }
        }
    }

}

@media (max-width:420px) {
    .banner-main {
        .container {
            .left {
                padding: 24px;
            }
        }
    }

    .soluciones {
        .container {
            padding: 10px;

            .tab-content {
                padding: 12px;

                .solucionesSwiper {
                    .swiper-wrapper {
                        .swiper-slide {
                            .solucion-item {
                                flex-direction: column;
                                padding: 0;

                                .solucion-content {
                                    width: 100%;
                                    padding: 10px;
                                }

                                .solucion-image,
                                .solucion-video {
                                    width: 100%;
                                }
                            }
                        }
                    }
                }
            }
        }
    }


}

@media(max-width:350px) {
    .banner-main {
        .container {
            padding: 10px;

            .right {
                .tracking-button {
                    &.purple {
                        bottom: 50%;
                    }
                }
            }
        }
    }
}