@media (max-width: 991.98px) {

    .navbar {
        --navbar-alto: calc(30px + 2rem);
    }

    .navbar .navbar-brand,
    .navbar__hamburguesa {
        position: relative;
        z-index: 2;
    }

    .navbar__hamburguesa {
        display: block;

        width: 44px;
        height: 44px;
        margin-right: -10px;
        padding: 0;

        border: 0;
        background: none;
        color: inherit;
        cursor: pointer;
    }

    .navbar--dark .navbar__hamburguesa {
        color: var(--color-white);
    }

    .navbar--menu-abierto .navbar__hamburguesa {
        color: var(--color-dark);
    }

    .navbar__hamburguesa-barra {
        display: block;
        width: 24px;
        height: 2px;
        margin: 0 auto;
        border-radius: 2px;

        background-color: currentColor;
        transition: transform .35s cubic-bezier(.4, 0, .2, 1), opacity .2s ease;
    }

    .navbar__hamburguesa-barra + .navbar__hamburguesa-barra {
        margin-top: 5px;
    }

    .navbar--menu-abierto .navbar__hamburguesa-barra:nth-child(1) {
        transform: translateY(7px) rotate(45deg);
    }

    .navbar--menu-abierto .navbar__hamburguesa-barra:nth-child(2) {
        opacity: 0;
    }

    .navbar--menu-abierto .navbar__hamburguesa-barra:nth-child(3) {
        transform: translateY(-7px) rotate(-45deg);
    }

    .navbar__panel {
        position: absolute;

        top: -1rem;
        left: 0;
        right: 0;
        z-index: 1;

        display: block;
        width: auto;
        padding: var(--navbar-alto) var(--padding-pagina) 1.25rem;

        background-color: rgba(255, 255, 255, .9);
        -webkit-backdrop-filter: blur(16px) saturate(1.2);
        backdrop-filter: blur(16px) saturate(1.2);
        border-radius: 0 0 18px 18px;

        transform: translateY(-101%);
        visibility: hidden;
        transition: transform .38s cubic-bezier(.22, 1, .36, 1), visibility 0s .38s;
    }

    .navbar--menu-abierto .navbar__panel {
        transform: none;
        visibility: visible;
        transition: transform .38s cubic-bezier(.22, 1, .36, 1);
    }

    .navbar__panel .navbar__lista {
        flex-direction: column;
        align-items: stretch;
        gap: 0;
        width: 100%;
    }

    .navbar__panel .navbar__item {
        opacity: 0;
        transform: translateY(-8px);
        transition: opacity .3s ease, transform .3s ease;
    }

    .navbar--menu-abierto .navbar__item {
        opacity: 1;
        transform: none;
    }

    .navbar--menu-abierto .navbar__item--clientes {
        transition-delay: .06s;
    }

    .navbar--menu-abierto .navbar__item--cta {
        transition-delay: .13s;
    }

    .navbar__panel .navbar__link {
        display: flex;
        align-items: center;
        min-height: 48px;
        font-size: 17px;
        margin-top: 14px;
        border-bottom: 1px solid var(--color-divisor);
    }

    .navbar__panel .navbar__link,
    .navbar__panel .navbar__link:hover,
    .navbar__panel .navbar__link:focus,
    .navbar--dark .navbar__panel .navbar__link,
    .navbar--dark .navbar__panel .navbar__link:hover,
    .navbar--dark .navbar__panel .navbar__link:focus {
        color: var(--color-dark);
    }

    .navbar__panel .navbar__item--cta {
        margin-top: 14px;
    }

    .navbar__panel .navbar__boton {
        display: flex;
        justify-content: center;
        width: 100%;
    }

    .navbar__velo {
        display: block;
        position: fixed;
        inset: 0;
        z-index: 1029;

        background-color: rgba(27, 48, 57, .38);
        opacity: 0;
        visibility: hidden;
        transition: opacity .3s ease, visibility 0s .3s;
    }

    .navbar__velo--visible {
        opacity: 1;
        visibility: visible;
        transition: opacity .3s ease;
    }

    .navbar--sin-transicion .navbar__panel,
    .navbar--sin-transicion .navbar__panel .navbar__item,
    .navbar__velo--sin-transicion {
        transition: none;
    }

    .navbar--en-clientes .navbar__logo--full {
        display: none;
    }

    .navbar--en-clientes .navbar__logo--cajita {
        display: inline;
    }

    .navbar__boton {
        min-height: 44px;
        font-size: 14px;
        padding: 8px 18px;
    }

    .navbar__logo {
        height: 30px;
    }

    .indicador-secciones {
        display: none;
    }
}

@media (max-width: 991.98px) and (prefers-reduced-motion: reduce) {
    .navbar__hamburguesa-barra,
    .navbar__panel,
    .navbar--menu-abierto .navbar__panel,
    .navbar__panel .navbar__item,
    .navbar__velo,
    .navbar__velo--visible {
        transition: none;
    }
}

@media (max-width: 991.98px) {

    .hero__lineas {
        display: none;
    }

    .hero__gradiente--sup {
        top: -3%;
        right: -40%;
        width: 140%;
        transform: rotate(180deg);
    }

    @media (max-width: 767.98px) {
        .hero__gradiente--sup {
            top: 13%;
            right: -25%;
        }
    }

    .hero__principal {
        padding-top: 24px;
        padding-bottom: 24px;
    }

    .hero__principal .row {
        flex-direction: column;
        align-items: center;
        flex-wrap: nowrap;
    }

    .hero__texto,
    .hero__col-dispositivos {
        display: contents;
    }

    .hero__titulo {
        order: 1;

        font-size: clamp(24px, max(min(8.23vw, 30.875px), calc(2.334vw + 16.87px)), 40px);
        text-align: center;
        white-space: normal;
        min-height: 0;
        margin-bottom: 24px;
    }

    .hero__bajada {
        order: 2;

        font-size: var(--cuerpo-mobile);
        text-align: center;
        max-width: min(100%, 38ch);
        margin-bottom: 24px;
    }

    .hero__dispositivos {
        order: 3;

        width: min(88%, 38vh);
        margin: clamp(10px, 2.6vh, 28px) auto 0;
    }

    @media (min-width: 768px) {
        .hero__dispositivos {
            width: min(88%, 48vh);
        }
    }

    .hero__boton {
        order: 4;
        justify-content: center;
        min-height: 44px;
        margin-top: clamp(20px, 5vh, 44px);

        padding: 10px clamp(16px, 5vw, 24px);
        font-size: 14px;
    }

    .hero__features {
        order: 5;
        width: 100%;
        margin-top: clamp(26px, 6vh, 56px);
    }

    .hero__feature {
        text-align: center;
    }

    .hero__feature:first-child {
        padding-left: 0.5rem !important;
    }

    .hero__feature-label {
        font-size: clamp(11px, 3.2vw, 14px);
    }

    .hero__clientes-titulo {

        font-size: clamp(16px, calc(1.03vw + 12.8px), 23px);
    }
}

@media (min-width: 992px) {
    .problema__minicard:nth-child(1) { margin-left: 3.7%; }
    .problema__minicard:nth-child(2) { margin-left: 29%; }
    .problema__minicard:nth-child(3) { margin-left: 13%; }
    .problema__minicard:nth-child(4) { margin-left: 29%; }
    .problema__minicard:nth-child(5) { margin-left: 7.5%; }
    .problema__minicard:nth-child(6) { margin-left: 29%; }
}

@media (max-width: 991.98px) {

    .problema {
        --hero-hold: 0px;
    }

    .problema__gradiente {
        display: none;
    }

    .problema__linea path {
        stroke-width: 5;
    }

    .problema__contenido {

        padding-top: clamp(104px, 12vh, 140px);

        padding-bottom: clamp(24px, 6vw, 48px);
    }

    .problema__fila {
        --bs-gutter-x: 0;
        --bs-gutter-y: 0;
        flex-direction: column;
        flex-wrap: nowrap;
    }

    .problema__escenario,
    .problema__col-minicards {
        display: contents;
    }

    .problema__titulo-wrap,
    .problema__minicards,
    .problema__video {
        width: 100%;
    }

    .problema__titulo-wrap {
        order: 1;
    }

    .problema__titulo {

        font-size: clamp(26px, calc(1.88vw + 29.4px), 48px);
    }

    .problema__minicards {
        order: 2;

        margin-top: clamp(24px, 6vw, 40px);
        row-gap: clamp(10px, 2.5vw, 16px);
        align-items: flex-start;
    }

    .problema__minicard {

        max-width: 100%;
        text-align: center;

        border-width: 2px;
        border-radius: 14px;

        font-size: var(--cuerpo-mobile);
        padding: clamp(10px, 2.6vw, 14px) clamp(16px, 4vw, 24px);
    }

    .problema__minicard:nth-child(1) {
        margin-left: 0%;
        max-width: 96%;
    }

    .problema__minicard:nth-child(3) {
        margin-left: 10%;
        max-width: 90%;
    }

    .problema__minicard:nth-child(5) {
        margin-left: 4%;
        max-width: 94%;
    }

    .problema__minicard:nth-child(even) {
        align-self: flex-end;
        margin-right: 3%;
    }

    .problema__minicard:nth-child(4) {
        margin-right: 6%;
    }
    .problema__minicard:nth-child(2) {
        margin-right: 0%;
    }
    .problema__video {
        order: 3;
        margin-top: clamp(24px, 6vw, 40px);
        border-radius: 14px;
    }

    .problema__deslizar {
        display: none;
    }
}

@media (min-width: 992px) and (prefers-reduced-motion: reduce) {
    .solucion__col-pasos {
        display: flex;
        flex-direction: column;
    }

    .solucion__pasos {
        order: 1;
    }

    .solucion__video-marco {
        position: static;
        order: 2;
        z-index: auto;
        margin-top: clamp(24px, 3vw, 48px);
    }
}

@media (min-width: 992px) and (max-width: 1199.98px) {
    .solucion__paso-texto {
        font-size: 14px;
    }
}

@media (max-width: 991.98px) {

    /* Sin pin en mobile no hay scroll que reservar: la sección 3 arranca justo
       después de la 2. La sombra superior también sobra: marcaba el borde de la
       sección que tapaba a la anterior, y sin superposición se lee como una
       banda gris entre secciones. */
    .solucion {
        --sec2-hold: 0px;
        box-shadow: none;
    }

    .solucion__linea {
        display: none;
    }

    .solucion__gradiente {
        width: 80%;
    }

    .solucion__pin {
        display: block;
        min-height: 0;
        padding-bottom: 0;
    }

    .solucion__intro {
        max-width: none;
    }

    .solucion__titulo {

        font-size: var(--titulo-seccion-mobile);
    }

    .solucion__bajada {
        margin-top: clamp(10px, 2.5vw, 20px);

        font-size: var(--cuerpo-mobile);
    }

    .solucion__col-pasos {
        display: flex;
        flex-direction: column;
    }

    .solucion__pasos {
        order: 1;

        margin-top: clamp(24px, 6vw, 44px);
        max-width: none;
        flex-direction: row;
        column-gap: clamp(12px, 2.5vw, 20px);
        margin-left: calc(-1 * clamp(1.5rem, calc(11vw - 30px), 14rem));
        margin-right: calc(-1 * clamp(1.5rem, calc(11vw - 30px), 14rem));
        padding-left: clamp(1.5rem, calc(11vw - 30px), 14rem);
        padding-right: clamp(1.5rem, calc(11vw - 30px), 14rem);
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        scroll-padding-left: clamp(1.5rem, calc(11vw - 30px), 14rem);
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }

    .solucion__pasos::-webkit-scrollbar {
        display: none;
    }

    .solucion__paso {

        --icono-paso: clamp(48px, 16.5vw, 88px);
        position: relative;

        flex: 0 0 min(84%, 420px);
        scroll-snap-align: start;
        flex-direction: column;
        align-items: stretch;
        padding-top: calc(var(--icono-paso) * 0.3);
    }

    .solucion__paso-icono {
        position: absolute;
        top: 0;
        right: clamp(14px, 4vw, 22px);
        width: var(--icono-paso);
        z-index: 1;
    }

    .solucion__paso-card {
        padding: clamp(14px, 4vw, 22px) clamp(18px, 5vw, 26px) clamp(12px, 3.5vw, 18px);
    }

    .solucion__paso-titulo {

        font-size: clamp(17px, calc(1.08vw + 15.3px), 26px);
    }

    .solucion__paso-texto {

        font-size: var(--cuerpo-chico-mobile);
    }

    .solucion__video-marco {
        position: static;
        order: 2;
        z-index: auto;

        margin-top: clamp(36px, 8vw, 56px);
    }

    .solucion__video {
        width: 100%;
    }

    .solucion__post {

        padding-top: clamp(40px, 9vw, 64px);

        padding-bottom: clamp(96px, 22vw, 180px);
    }

    .solucion__post-grilla {
        display: block;
    }

    .solucion__cta {
        min-height: 0;
        padding: clamp(20px, 5vw, 32px) clamp(18px, 5vw, 32px);
    }

    .solucion__cta-titulo {

        font-size: clamp(22px, max(min(7vw, 27.875px), calc(2.078vw + 15.41px)), 36px);
    }

    .solucion__cta-texto {
        margin-top: 10px;

        font-size: var(--cuerpo-mobile);
    }

    .solucion__testi-encabezado {
        justify-content: center;
        margin: clamp(12px, 3vw, 20px) 0 clamp(14px, 3.5vw, 22px);
    }

    .solucion__testi-icono-youtube,
    .solucion__testi-cta-youtube {
        display: none;
    }

    .solucion__testi-titulo {
        text-align: center;

        font-size: clamp(15px, calc(0.9vw + 12.1px), 20px);
    }

    .solucion__testi-tira {
        column-gap: clamp(10px, 2.5vw, 18px);
        margin-left: calc(-1 * clamp(1.5rem, calc(11vw - 30px), 14rem));
        padding-left: clamp(1.5rem, calc(11vw - 30px), 14rem);
        scroll-snap-type: x mandatory;
        scroll-padding-left: clamp(1.5rem, calc(11vw - 30px), 14rem);
        -webkit-overflow-scrolling: touch;
    }

    .solucion__testi-tira .solucion__testi-video {
        flex: 0 0 min(56%, 230px);
        scroll-snap-align: start;
    }

    .solucion__testi-tira .solucion__testi--youtube {

        flex: 0 0 min(53%, 218px);

        align-self: stretch;
        scroll-snap-align: start;

        align-items: stretch;
        text-align: left;
        text-decoration: none;
        color: var(--color-white);
    }

    .solucion__testi--youtube .solucion__testi-flechas {
        align-self: flex-end;
    }

    .solucion__testi--youtube .solucion__testi-youtube-texto {
        margin-top: auto;
        margin-bottom: clamp(12px, 5vw, 28px);
    }

    .solucion__testi--youtube:hover,
    .solucion__testi--youtube:focus-visible {
        color: var(--color-white);
    }

    .solucion__testi-flechas {

        width: clamp(90px, 30vw, 120px);
        height: auto;
    }

    .solucion__testi-youtube-texto {
        max-width: 20ch;
        font-family: var(--font-titulo);
        font-weight: 600;

        font-size: clamp(15px, calc(1vw + 11.3px), 20px);
        line-height: 1.25;
        letter-spacing: 0.5px;
    }
}

@media (max-width: 991.98px) {

    .implementacion {
        --sec4-linea-x: clamp(18px, 3.5vw, 36px);
        --sec4-punto: clamp(8px, 1.1vw, 11px);

        min-height: 0;

        padding-top: clamp(104px, 12vh, 140px);
        padding-bottom: clamp(28px, 6vw, 48px);

        scroll-margin-top: clamp(104px, 12vh, 140px);

        z-index: 3;
    }

    .implementacion__movil-titulo {
        margin: 0 0 clamp(10px, 2.5vw, 16px);
        font-family: var(--font-titulo);
        font-weight: 700;

        font-size: var(--titulo-seccion-mobile);
        line-height: normal;
        color: var(--color-titulo-oscuro);

        text-wrap: balance;
    }

    .implementacion__movil-bajada {
        margin: 0 0 clamp(18px, 4.5vw, 32px);
        font-family: var(--font-texto);
        font-weight: 400;

        font-size: var(--cuerpo-mobile);
        line-height: normal;
        color: var(--color-dark);
        margin-right: 10px;
    }

    .implementacion__movil-linea {
        position: absolute;
        top: 0;
        right: calc(var(--sec4-linea-x) - 1.5px);
        width: 3px;
        height: 100%;
        z-index: 1;
        pointer-events: none;
    }

    .implementacion__movil-media {
        position: relative;
    }

    .implementacion__movil-foto {
        aspect-ratio: 320 / 165;
        border-radius: 0;
    }

    .implementacion__movil-difuminado {
        position: absolute;
        inset: 0;
        z-index: 0;
        pointer-events: none;
        background: linear-gradient(to left,
                rgba(255, 255, 255, 0.95) 21%,
                rgba(255, 255, 255, 0) 42%);
    }

    .implementacion__movil-pasos {
        position: absolute;
        top: clamp(18px, 6vw, 44px);
        right: calc(var(--sec4-linea-x) - var(--sec4-punto) / 2);
        z-index: 2;
        display: flex;
        flex-direction: column;
        align-items: flex-end;
        row-gap: clamp(17px, 4vw, 28px);
    }

    .implementacion__movil-paso {
        display: flex;
        align-items: center;
        column-gap: clamp(5px, 1vw, 8px);
    }

    .implementacion__movil-paso-punto {
        flex: 0 0 auto;
        width: var(--sec4-punto);
        height: var(--sec4-punto);
        border-radius: 50%;
        background-color: var(--color-primary);
    }

    .implementacion__movil-paso-label {
        font-family: var(--font-texto);
        font-weight: 400;
        font-size: var(--cuerpo-chico-mobile);
        line-height: 1.2;
        color: var(--color-primary);
        white-space: nowrap;
    }
}

@media (min-width: 992px) {
    .contacto__encabezado {
        margin-block: auto;
    }
}

@media (min-width: 992px) {
    .contacto__acciones {
        display: flex;
        flex-direction: row-reverse;
        align-items: center;
        justify-content: space-between;
        gap: clamp(16px, 2vw, 32px);
    }

    .contacto__enviar {
        float: none;
        flex-shrink: 0;
    }

    .contacto__acciones .contacto__form-nota {
        margin-top: 0;
        text-align: left;
    }
}

@media (min-width: 992px) {
    .contacto__pie {
        min-height: clamp(52px, 4.9vw, 75px);
    }

    .contacto__boton {
        position: absolute;
        left: 0;
    }

    .contacto__iso {
        position: absolute;
        right: 0;
        top: 50%;
        transform: translateY(-50%);
    }
}

@media (max-width: 991.98px) {

    .contacto {
        z-index: 4;
    }

    .contacto__gradiente {
        top: auto;
        bottom: -5%;
        right: -45%;
        width: 150%;
    }

    .contacto__contenido {
        padding-top: clamp(48px, 7vh, 80px);
        row-gap: clamp(14px, 2.5vh, 28px);
    }

    .contacto__encabezado {

        --bs-gutter-x: 0;
        --bs-gutter-y: 0;
        flex-direction: column;
        flex-wrap: nowrap;
    }

    .contacto__texto {
        display: contents;
    }

    .contacto__titulo,
    .contacto__bajada,
    .contacto__canales-bloque,
    .contacto__form-col {
        width: 100%;
    }

    .contacto__form-col {
        order: 1;
        margin-top: clamp(24px, 6vw, 36px);
    }

    .contacto__titulo {
        max-width: none;

        font-size: var(--titulo-seccion-mobile);
        text-align: center;
    }

    .contacto__bajada {
        margin-top: 10px;

        font-size: var(--cuerpo-mobile);
        text-align: center;
    }

    .contacto__canales-bloque {
        order: 2;
        margin-top: clamp(24px, 6vw, 36px);
        text-align: left;
    }

    .contacto__canales-titulo {
        margin-bottom: clamp(12px, 3vw, 20px);
    }

    .contacto__canales {
        gap: clamp(6px, 1.8vw, 10px);
        justify-content: space-between;
    }

    .contacto__canal-icono {
        width: clamp(32px, 10vw, 52px);
        height: auto;
    }

    .contacto__form-card,
    .contacto__canales-bloque {
        padding: clamp(18px, 5vw, 28px);
        background-color: var(--color-white);
        border: 1px solid var(--color-dark);
        border-radius: 20px;
    }

    .contacto__enviar {
        min-height: 44px;
        padding: 10px clamp(24px, 7vw, 34px);
        font-size: 15px;
        float: none;
    }

    .contacto__acciones {
        display: flex;
        flex-direction: column;
        align-items: flex-end;
        gap: clamp(24px, 7vw, 32px);
    }

    .contacto__form-nota {
        align-self: stretch;
        margin-top: 0;
        font-size: var(--cuerpo-chico-mobile);
    }

    .contacto__pie {
        flex-wrap: wrap;
        justify-content: flex-end;
        gap: clamp(14px, 3vw, 20px);
    }

    .contacto__iso {
        order: 1;
        margin-right: auto;
    }

    .contacto__boton {
        order: 2;
        justify-content: center;
        min-height: 40px;
        padding: 6px clamp(16px, 4.5vw, 22px);
        font-size: 13px;
    }

    .contacto__boton-flecha {
        width: 12px;
    }

    .contacto__copy {
        order: 3;
        flex: 0 0 100%;
        font-size: clamp(10px, 2.8vw, 13px);
        text-align: center;
    }
}

@media (max-width: 1399.98px) {
    .clientes__grilla {
        grid-template-columns: repeat(5, minmax(0, 1fr));
    }
}

@media (max-width: 1199.98px) {
    .clientes__grilla {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

@media (max-width: 991.98px) {

    .clientes {
        padding-top: calc(70px + clamp(16px, 4vh, 36px));
        padding-bottom: clamp(48px, 10vh, 96px);
    }

    .clientes__volver {
        font-size: clamp(14px, calc(0.65vw + 11.55px), 18px);
    }

    .clientes__titulo {
        font-size: var(--titulo-seccion-mobile);
    }

    .clientes__bajada {
        font-size: var(--cuerpo-mobile);
        margin-bottom: 14px;
    }

    .clientes__filtro-titulo,
    .clientes__vacio {
        font-size: var(--cuerpo-chico-mobile);
    }

    .clientes__rubro {
        min-height: 44px;

        font-size: clamp(12px, calc(0.7vw + 9.7px), 15px);
        padding: 6px 10px;
    }

    .clientes__rubro-icono {
        width: 28px;
    }

    .clientes__rubros-flecha {
        display: none;
    }

    .clientes__grilla {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .clientes__flecha {
        display: none;
    }

    .clientes__carrusel {
        gap: 0;
    }

    .clientes__logo {
        max-width: 195px;
    }

    .clientes__distribuidores-logo {
        width: clamp(150px, calc(14.5vw + 93.4px), 195px);
    }

    .clientes__pie {
        flex-direction: column;
        gap: clamp(14px, 3vw, 20px);
        margin-top: clamp(32px, 7vw, 56px);
    }

    .clientes__boton {
        justify-content: center;
        min-height: 44px;
        padding: 10px clamp(26px, 8vw, 40px);
        font-size: 14px;
    }

    .clientes__copy {
        font-size: clamp(10px, 2.8vw, 13px);
        text-align: center;
    }

    .clientes__gradiente {
        width: min(130vw, 640px);
        left: -40vw;
        bottom: -40vw;
    }

    .clientes__distribuidores-titulo {
        font-size: clamp(16px, calc(1.03vw + 12.8px), 23px);
    }
}

@media (max-width: 575.98px) {
    .clientes__grilla {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}