/* Estilo para la alerta */

.alert {
    position: fixed;
    top: 25px;
    right: 20px;
    padding: 15px 20px;
    background-color: #4caf50;
    /* Verde para éxito */
    color: white;
    border-radius: 5px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
    z-index: 1000;
    font-family: Arial, sans-serif;
    animation: fadeInOut 5s forwards;
    /* Animación para desvanecerse */
}

.alert.error {
    background-color: #f44336;
    /* Rojo para errores */
}

/* Animación de desvanecimiento */

@keyframes fadeInOut {
    0% {
        opacity: 0;
        transform: translateY(-20px);
    }

    10% {
        opacity: 1;
        transform: translateY(0);
    }

    90% {
        opacity: 1;
    }

    100% {
        opacity: 0;
        transform: translateY(-20px);
    }
}

.loading:after {
    /* with no content, nothing is rendered */
    content: "";
    position: fixed;
    /* element stretched to cover during rotation an aspect ratio up to 1/10 */
    top: -500%;
    left: -500%;
    right: -500%;
    bottom: -500%;
    z-index: 9999;
    pointer-events: none;
    /* to block content use: all */

    /* background */
    background-color: rgba(0,0,0,0.6);
    background-image: url(data:image/png;base64,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);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 100px 100px;
    /* animation */
    -webkit-animation-name: linearRotate;
    -webkit-animation-duration: 1s;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    -moz-animation-name: linearRotate;
    -moz-animation-duration: 1s;
    -moz-animation-iteration-count: infinite;
    -moz-animation-timing-function: linear;
    -o-animation-name: linearRotate;
    -o-animation-duration: 1s;
    -o-animation-iteration-count: infinite;
    -o-animation-timing-function: linear;
    animation-name: linearRotate;
    animation-duration: 1s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}

@-webkit-keyframes linearRotate {
    from {
        -webkit-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    to {
        -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@font-face {
    font-family: 'Roboto';
    src: url(../fonts/Roboto/Roboto-Regular.woff2) format('woff2');
    font-weight: 400;
    font-display: swap;
}

@font-face {
    font-family: 'Roboto';
    src: url(../fonts/Roboto/Roboto-Medium.woff2) format('woff2');
    font-weight: 500;
    font-display: swap;
}

@font-face {
    font-family: 'Roboto';
    src: url(../fonts/Roboto/Roboto-Bold.woff2) format('woff2');
    font-weight: 700;
    font-display: swap;
}

@font-face {
    font-family: 'Gilroy';
    src: url(../fonts/gilroy/Gilroy-Bold.woff2) format('woff2');
    font-weight: 700;
    font-display: swap;
}

@font-face {
    font-family: 'Gilroy';
    src: url(../fonts/gilroy/Gilroy-ExtraBold.woff2) format('woff2');
    font-weight: 800;
    font-display: swap;
}

@font-face {
    font-family: 'uicons-regular-rounded';
    src: url(../fonts/uicons-rr-subset.woff2) format('woff2');
    font-display: block;
}

.fi {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    font-style: normal;
}

.fi:before {
    font-family: 'uicons-regular-rounded';
    font-style: normal;
    font-weight: normal;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
}

.fi-rr-comments:before {
    content: "\e477";
}

.fi-rr-pencil-ruler:before {
    content: "\eb89";
}

.fi-rr-code-simple:before {
    content: "\e442";
}

.fi-rr-rocket-lunch:before {
    content: "\ed22";
}

.fi-rr-headset:before {
    content: "\e83b";
}

.fi-rr-browser:before {
    content: "\e26c";
}

.fi-rr-mobile-notch:before {
    content: "\ea74";
}

.fi-rr-plug-connection:before {
    content: "\ec36";
}

.fi-rr-brain-circuit:before {
    content: "\e248";
}

.fi-rr-cloud-check:before {
    content: "\e40c";
}

.fi-rr-user-headset:before {
    content: "\f0ba";
}

.fi-rr-hand-holding-usd:before {
    content: "\e7fb";
}

.fi-rr-puzzle-alt:before {
    content: "\ec8d";
}

.fi-rr-arrows-repeat:before {
    content: "\e0fb";
}

.fi-rr-phone-call:before {
    content: "\ebde";
}

.fi-rr-envelope:before {
    content: "\e5fe";
}

.fi-rr-menu-burger:before {
    content: "\ea33";
}

.fi-rr-cross-small:before {
    content: "\e4d0";
}

.fi-rr-receipt:before {
    content: "\ecc1";
}

.fi-rr-calendar-clock:before {
    content: "\e2a7";
}

.fi-rr-earth-americas:before {
    content: "\e5d8";
}

.fi-rr-star:before {
    content: "\eed9";
}

body {
    margin: 0;
    font-family: 'Roboto','Helvetica Neue',Arial,sans-serif;
    color: #071325;
    font-size: 16px;
    line-height: 1.6;
}

:root {
    --fs-display: clamp(48px,4.8vw,72px);
    --fs-h2: clamp(26px,1.95vw,32px);
    --fs-h3: clamp(18px,1.4vw,20px);
    --fs-h4: clamp(17px,1.25vw,18px);
    --fs-num: clamp(20px,1.8vw,26px);
    --fs-quote: clamp(19px,1.5vw,22px);
}

.body {
    background: #071325;
}

/* Los style en línea con display ganan al atributo hidden. */

[hidden] {
    display: none !important;
}

@media (min-width:1241px) {
    #menu-movil {
        display: none !important;
    }
}

/* Google permite ocultar el badge si el formulario muestra el texto de atribución con sus enlaces (f.recaptcha). */

.grecaptcha-badge {
    visibility: hidden;
}

* {
    box-sizing: border-box;
}

a {
    color: #015EEA;
}

a:hover {
    color: #0047B3;
}

.on-dark a {
    color: #FFFFFF;
}

.on-dark a:hover {
    color: #FFFFFF;
}

.xd {
    font-family: 'Gilroy','Helvetica Neue',Arial,sans-serif;
    font-weight: 800;
    letter-spacing: -0.01em;
    line-height: 1.06;
    text-wrap: balance;
}

p {
    text-wrap: pretty;
}

.sr {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0,0,0,0);
    white-space: nowrap;
    border: 0;
}

:focus-visible {
    outline: 3px solid #015EEA;
    outline-offset: 3px;
}

.on-dark :focus-visible {
    outline-color: #F7C108;
}

.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-height: 52px;
    padding: 0 24px;
    border-radius: 8px;
    font: inherit;
    font-weight: 500;
    font-size: 16px;
    line-height: 1.2;
    text-decoration: none;
    cursor: pointer;
    transition: background-color .2s ease,color .2s ease,border-color .2s ease;
}

.btn-p,
.on-dark .btn-p {
    background: #015EEA;
    color: #FFFFFF;
    border: 2px solid #015EEA;
}

.btn-p:hover,
.on-dark .btn-p:hover {
    background: #0047B3;
    border-color: #0047B3;
    color: #FFFFFF;
}

.btn-o,
.on-dark .btn-o {
    background: transparent;
    color: #FFFFFF;
    border: 2px solid rgba(255,255,255,.6);
}

.btn-o:hover,
.on-dark .btn-o:hover {
    border-color: #FFFFFF;
}

.nav-d {
    display: flex;
}

.nav-t {
    display: none;
}

@media (max-width:1240px) {
    .nav-d {
        display: none;
    }

    .nav-t {
        display: inline-flex;
    }
}

.on-dark .nav-link {
    color: #C9D3E3;
    text-decoration: none;
    font-weight: 500;
    padding: 12px 2px;
}

.on-dark .nav-link:hover {
    color: #FFFFFF;
}

.on-dark .nav-link[aria-current="true"] {
    color: #FFFFFF;
}

.hd {
    background: #071325;
    position: relative;
    z-index: 3;
}

.hd-in {
    max-width: 1312px;
    margin: 0 auto;
    min-height: 84px;
    padding: 0 clamp(20px,4.5vw,64px);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
}

.hd-logo {
    display: flex;
    flex: 0 0 auto;
}

.hd-logo img {
    width: 128px;
    height: auto;
    display: block;
}

.hd-nav {
    align-self: stretch;
    gap: clamp(24px,2.5vw,36px);
}

.on-dark .hd-link {
    position: relative;
    display: flex;
    align-items: center;
    padding: 0;
    font-size: 15px;
    white-space: nowrap;
}

.hd-link:after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 2px;
    border-radius: 2px;
    background: #F7C108;
    opacity: 0;
    transition: opacity .2s ease;
}

.hd-link[aria-current="true"]:after {
    opacity: 1;
}

.hd-link[href="#ourProducts"]:after {
    background: #00CF67;
}

.hd-act {
    align-items: center;
    gap: 10px;
    flex: 0 0 auto;
}

.on-dark .hd-wa {
    width: 40px;
    height: 40px;
    border: 1px solid #2A3F63;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 18px;
    color: #C9D3E3;
    text-decoration: none;
    transition: color .2s ease,border-color .2s ease;
}

.on-dark .hd-wa:hover {
    color: #FFFFFF;
    border-color: #C9D3E3;
}

.hd-cta {
    min-height: 40px;
    padding: 0 16px;
    font-size: 14px;
    white-space: nowrap;
}

@media (prefers-reduced-motion:reduce) {
    .hd-link:after,
    .on-dark .hd-wa {
        transition: none;
    }
}

.hd {
    position: sticky;
    top: 0;
}

html {
    scroll-padding-top: 84px;
}

.tile {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    flex: 0 0 40px;
    border-radius: 10px;
    background: #E6EFFD;
    color: #015EEA;
    font-size: 18px;
}

@keyframes ping {
    0% {
        transform: scale(1);
        opacity: .55;
    }

    100% {
        transform: scale(2.6);
        opacity: 0;
    }
}

@keyframes rise {
    from {
        opacity: 0;
        transform: translateY(24px);
    }

    to {
        opacity: 1;
        transform: none;
    }
}

.pf-head {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
}

.pf-live {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 32px;
    padding: 0 14px;
    border-radius: 999px;
    background: rgba(255,255,255,.08);
    font-size: 13px;
    font-weight: 500;
    color: #C9D3E3;
}

.pf-dot {
    position: relative;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #3DDC84;
}

.pf-dot:after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 50%;
    background: #3DDC84;
    animation: ping 2s ease-out infinite;
}

.pf-body {
    display: grid;
    grid-template-columns: minmax(0,5fr) minmax(0,7fr);
    gap: clamp(24px,3vw,48px);
    align-items: center;
}

.pf-p {
    --c: #0071D8;
    --a: #0071D8;
}

.pf-v {
    --c: #00BC5E;
    --a: #017A3D;
}

.pf-t {
    --c: #BB0303;
    --a: #BB0303;
}

.pf-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.pf-row {
    position: relative;
    isolation: isolate;
    display: grid;
    grid-template-columns: 64px minmax(0,1fr) auto 44px;
    align-items: center;
    column-gap: 20px;
    width: 100%;
    padding: 22px 20px;
    border: 1px solid #1B3256;
    border-radius: 20px;
    background: transparent;
    color: #C9D3E3;
    font: inherit;
    text-align: left;
    cursor: pointer;
    transition: border-color .3s ease,color .3s ease;
}

.pf-row:before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    border-radius: inherit;
    background: linear-gradient(90deg,color-mix(in srgb,var(--c) 22%,transparent) 0,transparent 75%),#0E2342;
    opacity: 0;
    transition: opacity .3s ease;
}

.pf-row:focus-visible {
    outline: 2px solid #FFFFFF;
    outline-offset: 2px;
}

.pf-row[aria-selected="true"] {
    border-color: color-mix(in srgb,var(--c) 40%,transparent);
    color: #FFFFFF;
}

.pf-row[aria-selected="true"]:before {
    opacity: 1;
}

.pf-ico {
    display: block;
    width: 64px;
    height: 64px;
    border-radius: 16px;
    opacity: .75;
    transition: opacity .3s ease;
}

.pf-row[aria-selected="true"] .pf-ico {
    opacity: 1;
}

.pf-main {
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-width: 0;
}

.pf-name {
    font-size: var(--fs-num);
    line-height: 1.1;
}

.pf-line {
    font-size: 14px;
    line-height: 1.45;
    color: #8FA0BA;
}

.pf-yrs {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 4px;
}

.pf-yrs .xd {
    font-size: var(--fs-num);
    line-height: 1;
}

.pf-yrs span + span {
    font-size: 12px;
    color: #8FA0BA;
}

.pf-go {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    border: 1.5px solid #2A3F63;
    font-size: 18px;
    transition: background-color .3s ease,border-color .3s ease;
}

.pf-row[aria-selected="true"] .pf-go {
    background: var(--c);
    border-color: var(--c);
}

.pf-stage-wrap {
    position: relative;
    display: grid;
    overflow: hidden;
    container-type: inline-size;
    border: 1px solid #1B3256;
    border-radius: 28px;
    background: linear-gradient(160deg,#0D2340 0%,#091A31 100%);
}

.pf-stage-wrap:before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
    background-size: 48px 48px;
    pointer-events: none;
}

.pf-stage {
    position: relative;
    grid-area: 1 / 1;
    aspect-ratio: 737 / 600;
    background: radial-gradient(circle 87cqw at var(--gx,72%) var(--gy,38%),color-mix(in srgb,var(--c) 42%,transparent),transparent 62%);
    opacity: 0;
    transition: opacity .3s ease;
}

.pf-stage.is-on {
    z-index: 1;
    opacity: 1;
}

.pf-art {
    position: absolute;
    inset: 0;
    overflow: hidden;
    container-type: inline-size;
}

.pf-canvas {
    position: absolute;
    top: 0;
    left: 0;
    width: 737px;
    height: 600px;
    transform-origin: 0 0;
    transform: scale(tan(atan2(100cqw,737px)));
}

.pf-ipad {
    position: absolute;
    right: 40px;
    top: 48px;
    width: 372px;
    height: 492px;
    padding: 12px;
    border-radius: 36px;
    border: 1px solid rgba(255,255,255,.14);
    background: #0B0F17;
    box-shadow: 0 40px 80px rgba(0,0,0,.5);
}

.pf-phone {
    position: absolute;
    right: 240px;
    bottom: -60px;
    width: 200px;
    height: 420px;
    padding: 8px;
    border-radius: 36px;
    border: 1px solid rgba(255,255,255,.18);
    background: #0B0F17;
    box-shadow: 0 30px 60px rgba(0,0,0,.55);
}

.pf-phone:after {
    content: "";
    position: absolute;
    left: 50%;
    top: 16px;
    width: 58px;
    height: 16px;
    margin-left: -29px;
    border-radius: 999px;
    background: #0B0F17;
}

.pf-img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: top;
    border-radius: 24px;
}

.pf-phone .pf-img {
    border-radius: 28px;
}

.pf-chips {
    position: absolute;
    left: 32px;
    top: 32px;
    z-index: 2;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.pf-chip {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    min-height: 40px;
    padding: 0 16px 0 10px;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 12px;
    background: rgba(7,19,37,.72);
    backdrop-filter: blur(8px);
    box-shadow: 0 10px 24px rgba(0,0,0,.25);
    font-size: 14px;
    font-weight: 500;
    color: #FFFFFF;
}

.pf-chk {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border-radius: 8px;
    background: var(--a);
}

.pf-visit,
.on-dark .pf-visit {
    position: absolute;
    left: 32px;
    bottom: 32px;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    min-height: 48px;
    padding: 0 20px;
    border-radius: 12px;
    background: var(--a);
    box-shadow: 0 12px 28px color-mix(in srgb,var(--a) 40%,transparent);
    font-size: 15px;
    font-weight: 500;
    color: #FFFFFF;
    text-decoration: none;
    transition: filter .2s ease;
}

.pf-visit:hover {
    filter: brightness(1.12);
}

.pf-visit:focus-visible {
    outline: 2px solid #FFFFFF;
    outline-offset: 3px;
}

.pf-ks {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    overflow: hidden;
    border-radius: 24px;
    background: #F5F6F8;
}

.pf-ks-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-shrink: 0;
    height: 60px;
    padding: 0 18px;
    background: #BB0303;
    color: #FFFFFF;
}

.pf-ks-brand {
    font-size: 12px;
}

.pf-ks-clock {
    font-size: 11px;
    opacity: .85;
}

.pf-ks-body {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 12px 16px;
}

.pf-ks-now {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    padding: 10px 12px;
    border: 1px solid #ECEEF2;
    border-radius: 14px;
    background: #FFFFFF;
}

.pf-ks-cap {
    font-size: 10px;
    font-weight: 500;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #6B7487;
}

.pf-ks-num {
    font-size: 44px;
    line-height: 1.05;
    color: #BB0303;
}

.pf-ks-win {
    font-size: 12px;
    font-weight: 500;
    color: #1A2233;
}

.pf-ks-h {
    font-size: 11px;
    font-weight: 500;
    color: #6B7487;
}

.pf-ks-q {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.pf-ks-it {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 6px 12px;
    border: 1px solid #ECEEF2;
    border-radius: 10px;
    background: #FFFFFF;
}

.pf-ks-id {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.pf-ks-code {
    font-size: 15px;
    color: #1A2233;
}

.pf-ks-svc,
.pf-ks-eta {
    font-size: 10px;
    color: #6B7487;
}

.pf-ks-eta {
    font-weight: 500;
}

.pf-ks-form {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 10px 12px;
    border: 1px solid #ECEEF2;
    border-radius: 12px;
    background: #FFFFFF;
}

.pf-ks-ask {
    font-size: 11px;
    font-weight: 500;
    color: #1A2233;
}

.pf-ks-row {
    display: flex;
    gap: 8px;
}

.pf-ks-field {
    flex: 1;
    display: flex;
    align-items: center;
    height: 32px;
    padding: 0 10px;
    border: 1px solid #D9DDE4;
    border-radius: 8px;
    font-size: 11px;
    color: #9AA2B1;
}

.pf-ks-btn {
    display: inline-flex;
    align-items: center;
    height: 32px;
    padding: 0 12px;
    border-radius: 8px;
    background: #BB0303;
    font-size: 11px;
    font-weight: 500;
    color: #FFFFFF;
}

.pf-ph {
    display: flex;
    flex-direction: column;
    gap: 12px;
    width: 100%;
    height: 100%;
    overflow: hidden;
    padding: 40px 12px 14px;
    border-radius: 28px;
    background: #FFFFFF;
}

.pf-ph-top {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.pf-ph-title {
    font-size: 16px;
    color: #1A2233;
}

.pf-ph-sub {
    font-size: 10px;
    color: #6B7487;
}

.pf-ph-h {
    font-size: 10px;
    font-weight: 500;
    color: #6B7487;
}

.pf-ph-days {
    display: flex;
    gap: 4px;
}

.pf-ph-day {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    padding: 6px 0;
    border-radius: 8px;
    background: #F5F6F8;
    color: #1A2233;
}

.pf-ph-day span:first-child {
    font-size: 8px;
    opacity: .75;
}

.pf-ph-day span + span {
    font-size: 12px;
    font-weight: 700;
}

.pf-ph-day.is-sel {
    background: #BB0303;
    color: #FFFFFF;
}

.pf-ph-slots {
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: 6px;
}

.pf-ph-slot {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 28px;
    border: 1px solid #D9DDE4;
    border-radius: 8px;
    font-size: 11px;
    font-weight: 500;
    color: #1A2233;
}

.pf-ph-slot.is-off {
    border-color: #F5F6F8;
    background: #F5F6F8;
    color: #B5BBC6;
    text-decoration: line-through;
}

.pf-ph-slot.is-sel {
    border-color: #BB0303;
    background: #BB0303;
    color: #FFFFFF;
}

.pf-ph-ok {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 36px;
    margin-top: auto;
    border-radius: 10px;
    background: #BB0303;
    font-size: 12px;
    font-weight: 500;
    color: #FFFFFF;
}

@media (min-width:901px) and (max-width:1100px) {
    .pf-phone {
        right: 130px;
    }

    .pf-chips {
        left: 20px;
        top: 20px;
    }

    .pf-chip {
        min-height: 34px;
        font-size: 12px;
    }

    .pf-visit,
    .on-dark .pf-visit {
        left: 20px;
        bottom: 20px;
        min-height: 42px;
        font-size: 13px;
    }
}

@media (max-width:900px) {
    .pf-body {
        grid-template-columns: minmax(0,1fr);
    }

    .pf-stage-wrap {
        border-radius: 20px;
    }

    .pf-stage {
        --gy: 60%;
        display: flex;
        flex-direction: column;
        gap: 20px;
        padding: 20px;
        aspect-ratio: auto;
    }

    .pf-chips {
        position: static;
        flex-direction: row;
        flex-wrap: wrap;
    }

    .pf-art {
        position: relative;
        inset: auto;
        width: 100%;
        max-width: 440px;
        margin: 0 auto;
        aspect-ratio: 480 / 600;
    }

    /* 480 = el grupo iPad + teléfono (400) con 40 px por lado: así queda centrado. */
    .pf-canvas {
        width: 480px;
        transform: scale(tan(atan2(100cqw,480px)));
    }

    .pf-visit,
    .on-dark .pf-visit {
        position: static;
        align-self: flex-start;
    }
}

@media (max-width:600px) {
    .pf-row {
        grid-template-columns: 48px minmax(0,1fr) auto;
        column-gap: 14px;
        padding: 16px 14px;
    }

    .pf-ico {
        width: 48px;
        height: 48px;
        border-radius: 12px;
    }

    .pf-go {
        display: none;
    }

    .pf-stage {
        padding: 16px;
    }

    .pf-chip {
        font-size: 13px;
    }
}

@media (prefers-reduced-motion:reduce) {
    .pf-dot:after {
        animation: none;
    }

    .pf-stage,
    .pf-row,
    .pf-row:before,
    .pf-ico,
    .pf-go,
    .pf-visit {
        transition: none;
    }
}

.swap-a {
    animation: swapA .4s ease;
}

.swap-b {
    animation: swapB .4s ease;
}

@keyframes swapA {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: none;
    }
}

@keyframes swapB {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: none;
    }
}

.svc {
    position: relative;
    display: flex;
    flex-direction: column;
    padding: 24px;
    background: #F4F5F7;
    border-radius: 16px;
    transition: background-color .25s ease;
}

.svc:hover {
    background: #EDF0F4;
}

.svc-ico {
    position: absolute;
    top: 24px;
    right: 24px;
    display: inline-flex;
    color: #015EEA;
    font-size: 24px;
    line-height: 1;
}

.svc h3 {
    padding-right: 36px;
}

.svc-wrap {
    max-width: 1312px;
    margin: 0 auto;
    padding: clamp(72px,9vw,128px) clamp(20px,4.5vw,64px);
    display: flex;
    flex-direction: column;
    gap: clamp(40px,5vw,56px);
}

.svc-head {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.svc-bento {
    display: grid;
    grid-template-columns: minmax(0,1fr);
    gap: 20px;
}

.svc-body {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-top: auto;
}

.svc-proof {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding-top: 18px;
    border-top: 1px solid #DCE0E6;
}

.svc-proof>span {
    font-size: 14px;
    font-weight: 500;
    color: #015EEA;
}

.svc-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.svc-chips .chip-app {
    min-height: 26px;
    padding: 0 10px 0 4px;
    background: #FFFFFF;
    font-size: 12px;
}

.svc-chips .chip-app img {
    width: 18px;
    height: 18px;
}

.svc--ecf {
    background: #071325;
    color: #FFFFFF;
}

.svc--ecf:hover {
    background: #0B1D38;
}

.svc--ecf .svc-ico {
    color: #F7C108;
}

.svc--ecf p {
    max-width: 64ch;
}

.svc--ecf .btn {
    align-self: flex-start;
    margin-top: 8px;
}

@media (min-width:768px) {
    .svc-bento {
        grid-template-columns: repeat(2,minmax(0,1fr));
        grid-auto-flow: dense;
    }

    .svc--wide {
        grid-column: span 2;
    }
}

.svc span + p {
    font-size: 16px;
}

.chip-app {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 32px;
    padding: 0 12px 0 6px;
    border-radius: 999px;
    background: #F1F3F6;
    font-size: 14px;
    font-weight: 500;
    color: #071325;
}

.chip-app img {
    width: 22px;
    height: 22px;
}

.map {
    position: relative;
}

.map-dots {
    -webkit-mask-image: linear-gradient(to bottom,transparent,#000 10%,#000 90%,transparent);
    mask-image: linear-gradient(to bottom,transparent,#000 10%,#000 90%,transparent);
}

.arc {
    fill: none;
    stroke: url(#arcGrad);
    stroke-width: .3;
    stroke-linecap: round;
    stroke-dasharray: 1;
    stroke-dashoffset: 1;
    animation: draw 9s cubic-bezier(.25,.8,.3,1) infinite;
}

@keyframes draw {
    0% {
        stroke-dashoffset: 1;
        opacity: 1;
    }

    16% {
        stroke-dashoffset: 0;
        opacity: 1;
    }

    78% {
        stroke-dashoffset: 0;
        opacity: 1;
    }

    92% {
        stroke-dashoffset: 0;
        opacity: 0;
    }

    100% {
        stroke-dashoffset: 1;
        opacity: 0;
    }
}

@media (max-width:600px) {
    .arc {
        stroke-width: .6;
    }
}

.pin {
    position: absolute;
    width: 7px;
    height: 7px;
    margin: -3.5px 0 0 -3.5px;
    border-radius: 50%;
    background: #015EEA;
    transition: transform .2s ease;
}

.pin:after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: 50%;
    background: #015EEA;
    animation: pulse4 1.5s linear infinite;
}

@keyframes pulse4 {
    0% {
        transform: scale(1);
        opacity: .5;
    }

    100% {
        transform: scale(4);
        opacity: 0;
    }
}

.pin.hub {
    width: 10px;
    height: 10px;
    margin: -5px 0 0 -5px;
    background: #071325;
    box-shadow: 0 0 0 2px #FFFFFF;
}

.pin.hub:after {
    background: #071325;
}

@media (max-width:600px) {
    .pin {
        width: 5px;
        height: 5px;
        margin: -2.5px 0 0 -2.5px;
    }

    .pin:after {
        animation-name: pulse3;
    }

    .pin.hub {
        width: 8px;
        height: 8px;
        margin: -4px 0 0 -4px;
    }
}

@keyframes pulse3 {
    0% {
        transform: scale(1);
        opacity: .45;
    }

    100% {
        transform: scale(3);
        opacity: 0;
    }
}

.pin .tip {
    position: absolute;
    z-index: 3;
    left: 50%;
    bottom: calc(100% + 10px);
    transform: translateX(-50%);
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 6px 12px 6px 6px;
    border-radius: 999px;
    background: #071325;
    color: #FFFFFF;
    font-size: 13px;
    font-weight: 500;
    white-space: nowrap;
    opacity: 0;
    pointer-events: none;
    transition: opacity .15s ease;
}

.pin .tip img {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    box-shadow: 0 0 0 1.5px #FFFFFF;
}

.pin:hover {
    transform: scale(1.5);
    z-index: 2;
}

.pin:hover .tip {
    opacity: 1;
}

.ctag {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 36px;
    padding: 0 14px 0 5px;
    border-radius: 999px;
    border: 1px solid #C5CBD5;
    background: #FFFFFF;
    font-size: 14px;
    color: #071325;
}

.ctag img {
    width: 26px;
    height: 26px;
    border-radius: 50%;
    box-shadow: 0 0 0 1px #DCE0E6;
}

.chip {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    padding: 0 16px;
    border-radius: 999px;
    border: 1.5px solid #8A94A6;
    background: #FFFFFF;
    color: #071325;
    font: inherit;
    font-size: 15px;
    font-weight: 500;
    cursor: pointer;
    transition: background-color .2s ease,color .2s ease,border-color .2s ease;
}

.chip:hover {
    border-color: #071325;
}

.chip.on {
    background: #071325;
    border-color: #071325;
    color: #FFFFFF;
}

.fld {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.fld label {
    font-size: 15px;
    font-weight: 500;
    color: #071325;
}

.fld input,
.fld textarea {
    font: inherit;
    font-size: 16px;
    color: #071325;
    background: #FFFFFF;
    border: 1.5px solid #8A94A6;
    border-radius: 6px;
    padding: 12px 14px;
    min-height: 52px;
}

.fld input:focus-visible,
.fld textarea:focus-visible {
    outline: 3px solid #015EEA;
    outline-offset: 1px;
    border-color: #015EEA;
}

.ph {
    display: inline-block;
    padding: 1px 8px;
    border: 1.5px dashed currentColor;
    border-radius: 4px;
    font-size: .9em;
    font-weight: 500;
}

.tcols {
    display: flex;
    justify-content: center;
    gap: 24px;
    width: 100%;
    max-height: 740px;
    overflow: hidden;
    -webkit-mask-image: linear-gradient(to bottom,transparent,#000 22%,#000 78%,transparent);
    mask-image: linear-gradient(to bottom,transparent,#000 22%,#000 78%,transparent);
}

.tcol {
    flex: 0 1 360px;
    min-width: 0;
}

.ttrack {
    display: flex;
    flex-direction: column;
    animation-name: tscroll;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
}

.tcols:hover .ttrack,
.tcols:focus-within .ttrack {
    animation-play-state: paused;
}

@keyframes tscroll {
    from {
        transform: translateY(0);
    }

    to {
        transform: translateY(-50%);
    }
}

.tcard {
    margin: 0 0 24px;
    padding: 32px;
    border: 1px solid #DCE0E6;
    border-radius: 24px;
    background: #FFFFFF;
    box-shadow: 0 12px 32px -18px rgba(7,19,37,.25);
    display: flex;
    flex-direction: column;
    gap: 24px;
    font-size: 16px;
    line-height: 1.6;
    color: #2B3443;
}

.tav {
    display: block;
    width: 48px;
    height: 48px;
    flex: 0 0 48px;
    border-radius: 50%;
    object-fit: cover;
    background: #E6EFFD;
    box-shadow: 0 0 0 2px #FFFFFF,0 0 0 3px #DCE0E6;
}

@media (max-width:1023px) {
    .tcol-3 {
        display: none;
    }
}

@media (max-width:767px) {
    .tcol-2 {
        display: none;
    }

    .tcol {
        flex-basis: 100%;
    }
}

.logos {
    display: flex;
    flex-direction: column;
    gap: 16px;
    width: 100%;
}

.lrow {
    overflow: hidden;
    -webkit-mask-image: linear-gradient(to right,transparent,#000 10%,#000 90%,transparent);
    mask-image: linear-gradient(to right,transparent,#000 10%,#000 90%,transparent);
}

.ltrack {
    display: flex;
    width: max-content;
    animation-name: lscroll;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
}

.ltrack.rev {
    animation-direction: reverse;
}

.lset {
    display: flex;
    gap: 16px;
    padding-right: 16px;
}

.logos:hover .ltrack,
.logos:focus-within .ltrack {
    animation-play-state: paused;
}

@keyframes lscroll {
    from {
        transform: translateX(0);
    }

    to {
        transform: translateX(-50%);
    }
}

.ltile {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 152px;
    height: 88px;
    flex: 0 0 152px;
    padding: 12px;
    border: 1px solid #E3E7ED;
    border-radius: 14px;
    background: #FFFFFF;
}

.ltile img {
    display: block;
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    filter: grayscale(1);
    opacity: .75;
    transition: filter .25s ease,opacity .25s ease;
}

.ltile:hover img {
    filter: none;
    opacity: 1;
}

@media (max-width:600px) {
    .ltile {
        width: 120px;
        height: 72px;
        flex-basis: 120px;
    }
}

@font-face {
    font-family: 'uicons-brands';
    src: url(../fonts/uicons-brands-subset.woff2) format('woff2');
    font-display: block;
}

[class^="fi-brands-"]:before,
[class*=" fi-brands-"]:before {
    font-family: 'uicons-brands' !important;
    font-style: normal;
    font-weight: normal;
    line-height: 1;
}

.fi-brands-facebook:before {
    content: "\e675";
}

.fi-brands-instagram:before {
    content: "\e8de";
}

.fi-brands-linkedin:before {
    content: "\e9a9";
}

.fi-brands-youtube:before {
    content: "\f199";
}

.fi-brands-whatsapp:before {
    content: "\f151";
}

.mh {
    background: #071325;
    color: #FFFFFF;
    overflow: hidden;
}

.mh-wrap {
    max-width: 1312px;
    margin: 0 auto;
    padding: 24px clamp(20px,4.5vw,64px) 0;
    display: grid;
    grid-template-columns: minmax(0,1fr) 520px minmax(0,1fr);
    grid-template-areas: "left center title" "social center place";
    grid-template-rows: 1fr auto;
    column-gap: 24px;
    min-height: 720px;
}

.mh-left {
    grid-area: left;
    align-self: center;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 18px;
    max-width: 320px;
    animation: fadeUp .7s ease .55s backwards;
}

.on-dark .mh-link {
    font-size: 16px;
    font-weight: 500;
    color: #FFFFFF;
    text-decoration: underline;
    text-decoration-thickness: 2px;
    text-underline-offset: 6px;
}

.mh-center {
    grid-area: center;
    grid-row: 1 / span 2;
    position: relative;
    min-height: 730px;
}

.mh-circle {
    position: absolute;
    left: 50%;
    bottom: 120px;
    width: 500px;
    height: 500px;
    margin-left: -250px;
    border-radius: 50%;
    background: #F7C108;
    animation: circleIn .9s cubic-bezier(.2,.8,.2,1) .1s backwards;
}

.mh-title {
    grid-area: title;
    align-self: center;
    justify-self: end;
    margin: 0 0 0 -40px;
    text-align: right;
    font-size: var(--fs-display);
    line-height: .98;
    color: #FFFFFF;
    position: relative;
    z-index: 2;
    text-shadow: 0 2px 24px rgba(7,19,37,.35);
    animation: fadeLeft .9s cubic-bezier(.2,.8,.2,1) .35s backwards;
}

.mrot {
    display: block;
    position: relative;
    height: 1.04em;
}

.mw {
    position: absolute;
    right: 0;
    top: 0;
    white-space: nowrap;
    opacity: 0;
    transform: translateY(60%);
    transition: transform .7s cubic-bezier(.2,.9,.25,1.15),opacity .45s ease;
}

.mw.on {
    opacity: 1;
    transform: none;
}

.mw.out {
    opacity: 0;
    transform: translateY(-60%);
}

.mh-social {
    grid-area: social;
    align-self: end;
    display: flex;
    gap: 6px;
    padding-bottom: 28px;
    margin-left: -12px;
}

.on-dark .mh-social a {
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    font-size: 20px;
    color: #C9D3E3;
}

.on-dark .mh-social a:hover {
    color: #FFFFFF;
}

.mh-place {
    grid-area: place;
    align-self: end;
    justify-self: end;
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0;
    padding-bottom: 40px;
    font-weight: 500;
    color: #C9D3E3;
}

@keyframes circleIn {
    from {
        opacity: 0;
        transform: scale(.6);
    }

    to {
        opacity: 1;
        transform: none;
    }
}

@keyframes fadeUp {
    from {
        opacity: 0;
        transform: translateY(16px);
    }

    to {
        opacity: 1;
        transform: none;
    }
}

/* .01 y no 0: con opacidad 0 Chrome no cuenta el LCP hasta que acaba la animación. Igual en photoUp. */
@keyframes fadeLeft {
    from {
        opacity: .01;
        transform: translateX(24px);
    }

    to {
        opacity: 1;
        transform: none;
    }
}

@media (max-width:1100px) {
    .mh-wrap {
        grid-template-columns: minmax(0,1fr) 420px minmax(0,1fr);
    }

    .mh-circle {
        width: 400px;
        height: 400px;
        margin-left: -200px;
    }

    .mh-center {
        min-height: 560px;
    }

    .mh-title {
        margin-left: -20px;
    }
}

@media (max-width:900px) {
    .mh-wrap {
        grid-template-columns: minmax(0,1fr);
        grid-template-areas: "title" "center" "left" "social" "place";
        grid-template-rows: auto;
        min-height: 0;
        row-gap: 24px;
        padding-top: 16px;
        padding-bottom: 32px;
    }

    .mh-title {
        justify-self: start;
        text-align: left;
        margin: 0;
        font-size: clamp(40px,10.6vw,56px);
    }

    .mw {
        right: auto;
        left: 0;
    }

    .mh-center {
        grid-row: auto;
        --pw: min(100vw - max(40px,9vw),420px);
        min-height: calc(var(--pw) * .947 + 150px);
    }

    .mh-circle {
        width: 320px;
        height: 320px;
        margin-left: -160px;
        bottom: 80px;
    }

    .mh-left {
        max-width: none;
    }

    .mh-social {
        padding-bottom: 0;
    }

    .mh-place {
        justify-self: start;
        padding-bottom: 0;
    }
}

.orbit-wrap {
    --r: 210px;
    --d: 520px;
    position: relative;
    width: var(--d);
    height: var(--d);
    flex: 0 0 auto;
}

.oring {
    position: absolute;
    left: 50%;
    top: 50%;
    width: calc(var(--r) * 2);
    height: calc(var(--r) * 2);
    margin: calc(var(--r) * -1) 0 0 calc(var(--r) * -1);
    border-radius: 50%;
    border: 1.5px dashed #C5CBD5;
}

.ocenter {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 150px;
    height: 150px;
    margin: -75px 0 0 -75px;
    border-radius: 50%;
    background: #015EEA;
    color: #FFFFFF;
    display: flex;
    align-items: center;
    justify-content: center;
}

.opulse {
    position: absolute;
    inset: 0;
    border-radius: 50%;
    border: 2px solid #015EEA;
    animation: opulse 3.2s ease-out infinite;
}

.opulse.o2 {
    animation-delay: 1.6s;
}

@keyframes opulse {
    0% {
        transform: scale(1);
        opacity: .45;
    }

    100% {
        transform: scale(1.6);
        opacity: 0;
    }
}

.orbit {
    position: absolute;
    inset: 0;
    animation: ospin 70s linear infinite;
}

.onode {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 0;
    height: 0;
}

.oinner {
    position: absolute;
    left: -60px;
    top: -32px;
    width: 120px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    animation: ospin 70s linear infinite reverse;
}

.orbit-wrap.paused .orbit,
.orbit-wrap.paused .oinner,
.orbit-wrap:hover .orbit,
.orbit-wrap:hover .oinner,
.orbit-wrap:focus-within .orbit,
.orbit-wrap:focus-within .oinner {
    animation-play-state: paused;
}

@keyframes ospin {
    to {
        transform: rotate(360deg);
    }
}

.obtn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background: #FFFFFF;
    border: 1.5px solid #C5CBD5;
    color: #015EEA;
    font-size: 24px;
    cursor: pointer;
    transition: background-color .25s ease,color .25s ease,border-color .25s ease,box-shadow .25s ease;
}

.obtn:hover {
    border-color: #015EEA;
}

.obtn.is-sel {
    background: #015EEA;
    border-color: #015EEA;
    color: #FFFFFF;
    box-shadow: 0 0 0 8px rgba(1,94,234,.16);
}

.olabel {
    font-size: 14px;
    font-weight: 500;
    color: #071325;
    white-space: nowrap;
    background: rgba(255,255,255,.92);
    padding: 2px 8px;
    border-radius: 999px;
}

@media (max-width:600px) {
    .orbit-wrap {
        --r: 118px;
        --d: 330px;
    }

    .ocenter {
        width: 104px;
        height: 104px;
        margin: -52px 0 0 -52px;
    }

    .ocenter .xd {
        font-size: 16px !important;
    }

    .obtn {
        width: 52px;
        height: 52px;
        font-size: 20px;
    }

    .oinner {
        top: -26px;
    }

    .olabel {
        font-size: 12px;
    }
}

.orn {
    position: relative;
    overflow: hidden;
    isolation: isolate;
}

.orn > * {
    position: relative;
    z-index: 1;
}

.orn:before,
.orn:after {
    content: "";
    position: absolute;
    pointer-events: none;
    z-index: 0;
}

.orn-dark {
    --dot: rgba(255,255,255,.13);
    --ring: rgba(255,255,255,.07);
}

.orn-light {
    --dot: rgba(7,19,37,.13);
    --ring: rgba(1,94,234,.13);
}

.od-tl:before,
.od-tr:before,
.od-bl:before,
.od-br:before,
.od-band:before,
.od-pl:before {
    background-image: radial-gradient(circle,var(--dot) 1.3px,transparent 1.7px);
    background-size: 22px 22px;
}

.od-tl:before {
    top: -40px;
    left: -40px;
    width: 560px;
    height: 460px;
    -webkit-mask-image: radial-gradient(ellipse at top left,#000 10%,transparent 70%);
    mask-image: radial-gradient(ellipse at top left,#000 10%,transparent 70%);
}

.od-tr:before {
    top: -40px;
    right: -40px;
    width: 560px;
    height: 460px;
    -webkit-mask-image: radial-gradient(ellipse at top right,#000 10%,transparent 70%);
    mask-image: radial-gradient(ellipse at top right,#000 10%,transparent 70%);
}

.od-bl:before {
    bottom: -40px;
    left: -40px;
    width: 560px;
    height: 460px;
    -webkit-mask-image: radial-gradient(ellipse at bottom left,#000 10%,transparent 70%);
    mask-image: radial-gradient(ellipse at bottom left,#000 10%,transparent 70%);
}

.od-br:before {
    bottom: -40px;
    right: -40px;
    width: 560px;
    height: 460px;
    -webkit-mask-image: radial-gradient(ellipse at bottom right,#000 10%,transparent 70%);
    mask-image: radial-gradient(ellipse at bottom right,#000 10%,transparent 70%);
}

.od-band:before {
    inset: 0;
    opacity: .7;
    -webkit-mask-image: linear-gradient(to right,transparent,#000 18%,transparent 40%,transparent 60%,#000 82%,transparent);
    mask-image: linear-gradient(to right,transparent,#000 18%,transparent 40%,transparent 60%,#000 82%,transparent);
}

.od-pl:before {
    left: 0;
    top: 12%;
    width: 60%;
    height: 84%;
    -webkit-mask-image: radial-gradient(circle at 50% 55%,#000 15%,transparent 62%);
    mask-image: radial-gradient(circle at 50% 55%,#000 15%,transparent 62%);
}

.or-bl:after,
.or-tr:after,
.or-c:after {
    border-radius: 50%;
    background: repeating-radial-gradient(circle,var(--ring) 0 1.5px,transparent 1.5px 64px);
    -webkit-mask-image: radial-gradient(circle,#000 30%,transparent 70%);
    mask-image: radial-gradient(circle,#000 30%,transparent 70%);
}

.or-bl:after {
    left: -300px;
    bottom: -320px;
    width: 760px;
    height: 760px;
}

.or-tr:after {
    right: -300px;
    top: -320px;
    width: 760px;
    height: 760px;
}

.or-c:after {
    left: 50%;
    top: -260px;
    width: 960px;
    height: 960px;
    margin-left: -480px;
    -webkit-mask-image: radial-gradient(circle,#000 20%,transparent 60%);
    mask-image: radial-gradient(circle,#000 20%,transparent 60%);
}

.og-tr:after,
.og-bl:after {
    width: 720px;
    height: 720px;
    border-radius: 50%;
    background: radial-gradient(circle,rgba(1,94,234,.34),transparent 64%);
}

.og-tr:after {
    right: -240px;
    top: -260px;
}

.og-bl:after {
    left: -260px;
    bottom: -280px;
}

.og-c:after {
    left: 50%;
    top: 50%;
    width: 1100px;
    height: 700px;
    margin: -350px 0 0 -550px;
    border-radius: 50%;
    background: radial-gradient(ellipse,rgba(255,255,255,.85),transparent 62%);
}

.mh-ring {
    position: absolute;
    left: 50%;
    border-radius: 50%;
    border: 1px solid rgba(255,255,255,.1);
    pointer-events: none;
}

.mh-ring.r1 {
    width: 660px;
    height: 660px;
    margin-left: -330px;
    bottom: 40px;
}

.mh-ring.r2 {
    width: 840px;
    height: 840px;
    margin-left: -420px;
    bottom: -50px;
    border-style: dashed;
    border-color: rgba(255,255,255,.07);
}

.mh-sat {
    position: absolute;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #F7C108;
    left: calc(50% + 227px);
    bottom: 597px;
    box-shadow: 0 0 0 6px rgba(247,193,8,.15);
}

@media (max-width:1100px) {
    .mh-ring.r1 {
        width: 520px;
        height: 520px;
        margin-left: -260px;
        bottom: 60px;
    }

    .mh-ring.r2 {
        width: 660px;
        height: 660px;
        margin-left: -330px;
        bottom: -10px;
    }

    .mh-sat {
        left: calc(50% + 178px);
        bottom: 498px;
    }
}

@media (max-width:900px) {
    .mh-ring.r1 {
        width: 420px;
        height: 420px;
        margin-left: -210px;
        bottom: 30px;
    }

    .mh-ring.r2 {
        width: 520px;
        height: 520px;
        margin-left: -260px;
        bottom: -20px;
    }

    .mh-sat {
        left: calc(50% + 142px);
        bottom: 382px;
    }
}

@media (max-width:600px) {
    .od-tl:before,
    .od-tr:before,
    .od-bl:before,
    .od-br:before {
        width: 320px;
        height: 300px;
    }

    .or-bl:after,
    .or-tr:after {
        width: 520px;
        height: 520px;
    }

    .or-c:after {
        width: 640px;
        height: 640px;
        margin-left: -320px;
        top: -200px;
    }
}

.wa-card {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 18px 20px;
    border-radius: 18px;
    background: #FFFFFF;
    border: 1px solid #DCE0E6;
    text-decoration: none;
    color: #071325;
    transition: border-color .2s ease;
}

.wa-card:hover {
    border-color: #015EEA;
}

.nstep {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    flex: 0 0 28px;
    border-radius: 50%;
    background: #071325;
    color: #FFFFFF;
    font-size: 14px;
    font-weight: 500;
}

.fcard {
    flex: 1 1 520px;
    min-width: 0;
    background: #FFFFFF;
    border-radius: 24px;
    border: 1px solid #DCE0E6;
    padding: clamp(24px,3.5vw,40px);
    display: flex;
    flex-direction: column;
    gap: 24px;
    box-shadow: 0 24px 48px -30px rgba(7,19,37,.35);
}

.fprog {
    display: grid;
    grid-template-columns: repeat(3,minmax(0,1fr));
    gap: 6px;
}

.fprog span {
    height: 6px;
    border-radius: 999px;
    background: #E3E7ED;
    transition: background-color .3s ease;
}

.fprog span.done {
    background: #015EEA;
}

.pgrid {
    display: grid;
    grid-template-columns: repeat(auto-fit,minmax(min(140px,100%),1fr));
    gap: 10px;
}

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

    .pcard {
        min-height: 92px;
        padding: 14px;
        font-size: 14px;
    }
}

.pcard {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
    min-height: 104px;
    padding: 16px;
    border-radius: 16px;
    border: 1.5px solid #DCE0E6;
    background: #FFFFFF;
    color: #071325;
    font: inherit;
    font-size: 15px;
    font-weight: 500;
    text-align: left;
    cursor: pointer;
    transition: border-color .2s ease,background-color .2s ease,box-shadow .2s ease;
}

.pcard i {
    font-size: 22px;
    color: #015EEA;
}

.pcard:hover {
    border-color: #8A94A6;
}

.pcard.on {
    border-color: #015EEA;
    background: #F2F7FF;
    box-shadow: 0 0 0 3px rgba(1,94,234,.14);
}

.ocard {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 52px;
    padding: 0 16px;
    border-radius: 14px;
    border: 1.5px solid #DCE0E6;
    background: #FFFFFF;
    color: #071325;
    font: inherit;
    font-size: 16px;
    text-align: left;
    cursor: pointer;
    transition: border-color .2s ease,background-color .2s ease;
}

.ocard:hover {
    border-color: #8A94A6;
}

.ocard .radio {
    width: 18px;
    height: 18px;
    flex: 0 0 18px;
    border-radius: 50%;
    border: 2px solid #8A94A6;
    transition: border-color .2s ease,box-shadow .2s ease;
}

.ocard.on {
    border-color: #015EEA;
    background: #F2F7FF;
}

.ocard.on .radio {
    border-color: #015EEA;
    box-shadow: inset 0 0 0 4px #FFFFFF;
    background: #015EEA;
}

.sumchip {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 0 10px;
    border-radius: 999px;
    background: #F1F3F6;
    font-size: 13px;
    font-weight: 500;
    color: #071325;
}

.mbar {
    display: none;
}

@media (max-width:700px) {
    .mbar {
        display: flex;
    }

    .pad-mbar {
        padding-bottom: 112px;
    }
}

.fi-rr-user:before {
    content: "\f0a7";
}

.fi-rr-lock:before {
    content: "\e9c5";
}

.fi-rr-eye:before {
    content: "\e62c";
}

.fi-rr-laptop-mobile:before {
    content: "\e955";
}

.fi-rr-users-alt:before {
    content: "\f0e0";
}

.fi-rr-key:before {
    content: "\e922";
}

.fi-rr-wifi-slash:before {
    content: "\f161";
}

.fi-rr-shield-check:before {
    content: "\edb1";
}

.fi-rr-check-circle:before {
    content: "\e360";
}

.fi-rr-wallet:before {
    content: "\f12a";
}

.fi-rr-apps:before {
    content: "\e098";
}

.fi-rr-calculator:before {
    content: "\e29b";
}

.fi-rr-route:before {
    content: "\ed2d";
}

.fi-rr-print:before {
    content: "\ec6b";
}

.fi-rr-document-signed:before {
    content: "\e589";
}

.fi-rr-sign-in-alt:before {
    content: "\ede8";
}

.fi-rr-map:before {
    content: "\e9f2";
}

.fi-rr-arrow-up-right:before {
    content: "\e0e8";
}

.fi-rr-stopwatch:before {
    content: "\eef9";
}

.fi-rr-users:before {
    content: "\f0df";
}

.fi-rr-chart-line-up:before {
    content: "\e33f";
}

.fi-rr-home:before {
    content: "\e866";
}

.fi-rr-shopping-bag:before {
    content: "\edce";
}

.fi-rr-cash-register:before {
    content: "\e315";
}

.fi-rr-file-invoice:before {
    content: "\e6ad";
}

.fi-rr-box-open:before {
    content: "\e21c";
}

.fi-rr-arrow-left:before {
    content: "\e0c6";
}

.fi-rr-clouds:before {
    content: "\e430";
}

.fi-rr-menu-dots-vertical:before {
    content: "\ea35";
}

.fi-rr-barcode-read:before {
    content: "\e162";
}

.fi-rr-add:before {
    content: "\e026";
}

.fi-rr-menu-dots:before {
    content: "\ea34";
}

.fi-rr-camera:before {
    content: "\e2c4";
}

.fi-rr-boxes:before {
    content: "\e220";
}

.fi-rr-shopping-cart:before {
    content: "\edd1";
}

.fi-rr-trash:before {
    content: "\f026";
}

.fi-rr-angle-small-right:before {
    content: "\e07e";
}

.fi-rr-pencil:before {
    content: "\eb87";
}

.fi-rr-info:before {
    content: "\e8ce";
}

.fi-rr-minus-small:before {
    content: "\ea66";
}

.fi-rr-plus-small:before {
    content: "\ec3a";
}

.fi-rr-angle-down:before {
    content: "\e079";
}

.fi-rr-badge-percent:before {
    content: "\e138";
}

.fi-rr-truck-side:before {
    content: "\f065";
}

.fi-rr-disk:before {
    content: "\e56a";
}

.fi-rr-coins:before {
    content: "\e44d";
}

.fi-rr-coffee:before {
    content: "\e443";
}

.fi-rr-milk:before {
    content: "\ea5e";
}

.fi-rr-popcorn:before {
    content: "\ec51";
}

.fi-rr-broom:before {
    content: "\e26a";
}

.fi-rr-bread-slice:before {
    content: "\e254";
}

.btn-k {
    background: transparent;
    color: #071325;
    border: 2px solid #071325;
}

.btn-k:hover {
    background: #071325;
    color: #FFFFFF;
}

.dm-mods {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 6px;
}

.dm-mod {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 36px;
    padding: 0 10px 0 8px;
    border-radius: 8px;
    border: 1.5px solid #C5CBD5;
    background: #FFFFFF;
    color: #071325;
    font: inherit;
    font-size: 12px;
    font-weight: 500;
    white-space: nowrap;
    cursor: pointer;
    transition: background-color .2s ease,color .2s ease,border-color .2s ease;
}

.dm-mod i {
    font-size: 14px;
    color: #015EEA;
    transition: color .2s ease;
}

.dm-mod:hover {
    border-color: #071325;
}

.dm-mod.on {
    background: #071325;
    border-color: #071325;
    color: #FFFFFF;
}

.dm-mod.on i {
    color: #F7C108;
}

.dm-stage {
    display: grid;
    grid-template-columns: minmax(0,1fr) 390px minmax(0,1fr);
    grid-template-areas: "l phone r";
    column-gap: 64px;
    align-items: center;
}

.dm-side {
    display: flex;
    flex-direction: column;
    gap: 24px;
    min-width: 0;
}

.dm-l {
    grid-area: l;
    align-items: flex-end;
}

.dm-r {
    grid-area: r;
    align-items: flex-start;
}

.dm-fact {
    position: relative;
    width: 100%;
    max-width: 340px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
    padding: 22px 24px;
    background: #FFFFFF;
    border: 1px solid #DCE0E6;
    border-radius: 20px;
    box-shadow: 0 16px 36px -24px rgba(7,19,37,.35);
    z-index: 2;
}

.dm-fact h3 {
    margin: 0;
    font-size: var(--fs-h4);
}

.dm-fact p {
    margin: 0;
    font-size: 15px;
    line-height: 1.55;
    color: #3E4A5C;
}

.dm-k {
    font-size: 14px;
    font-weight: 500;
    color: #015EEA;
}

.dm-link {
    position: absolute;
    top: 50%;
    width: 48px;
    height: 2px;
    background: repeating-linear-gradient(90deg,#8DB4F2 0 5px,transparent 5px 9px);
}

.dm-l .dm-link {
    right: -56px;
}

.dm-r .dm-link {
    left: -56px;
}

.dm-link:after {
    content: "";
    position: absolute;
    top: -4px;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #015EEA;
    box-shadow: 0 0 0 4px rgba(1,94,234,.18);
}

.dm-l .dm-link:after {
    right: -5px;
}

.dm-r .dm-link:after {
    left: -5px;
}

.dmA {
    animation: dmA .5s cubic-bezier(.2,.8,.2,1) backwards;
}

.dmB {
    animation: dmB .5s cubic-bezier(.2,.8,.2,1) backwards;
}

.dd1 {
    animation-delay: .07s;
}

.dd2 {
    animation-delay: .14s;
}

.dd3 {
    animation-delay: .21s;
}

@keyframes dmA {
    from {
        opacity: 0;
        transform: translateY(14px);
    }

    to {
        opacity: 1;
        transform: none;
    }
}

@keyframes dmB {
    from {
        opacity: 0;
        transform: translateY(14px);
    }

    to {
        opacity: 1;
        transform: none;
    }
}

.dm-phone-wrap {
    grid-area: phone;
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 18px;
}

.dm-glow,
.dm-rings {
    position: absolute;
    left: 50%;
    top: 380px;
    border-radius: 50%;
    pointer-events: none;
}

.dm-glow {
    width: 520px;
    height: 520px;
    margin: -260px 0 0 -260px;
    background: radial-gradient(circle,rgba(1,94,234,.2),transparent 65%);
}

.dm-rings {
    width: 820px;
    height: 820px;
    margin: -410px 0 0 -410px;
    background: repeating-radial-gradient(circle,rgba(1,94,234,.16) 0 1.5px,transparent 1.5px 72px);
    -webkit-mask-image: radial-gradient(circle,#000 28%,transparent 68%);
    mask-image: radial-gradient(circle,#000 28%,transparent 68%);
    animation: dmRings 6s ease-in-out infinite alternate;
}

@keyframes dmRings {
    from {
        transform: scale(.96);
    }

    to {
        transform: scale(1.04);
    }
}

.dm-phone {
    position: relative;
    zoom: 1.15;
    width: 320px;
    height: 660px;
    padding: 11px;
    border-radius: 54px;
    background: #0B1426;
    box-shadow: inset 0 0 0 2px #2A3A55,0 40px 80px -30px rgba(7,19,37,.55),0 18px 30px -18px rgba(7,19,37,.4);
}

.dm-phone:before {
    content: "";
    position: absolute;
    right: -3px;
    top: 160px;
    width: 3px;
    height: 76px;
    border-radius: 0 2px 2px 0;
    background: #2A3A55;
}

.dm-phone:after {
    content: "";
    position: absolute;
    left: -3px;
    top: 130px;
    width: 3px;
    height: 46px;
    border-radius: 2px 0 0 2px;
    background: #2A3A55;
    box-shadow: 0 62px 0 #2A3A55;
}

.dm-screen {
    position: relative;
    width: 100%;
    height: 100%;
    border-radius: 44px;
    overflow: hidden;
    background: #FFFFFF;
    font-size: 13px;
    line-height: 1.4;
    color: #1F2937;
}

/* Oculta la app hasta que cargue demo.css, que la vuelve a mostrar. */
.dm-screen .pa-app {
    visibility: hidden;
}

.dm-island {
    position: absolute;
    left: 50%;
    top: 10px;
    width: 96px;
    height: 28px;
    margin-left: -48px;
    border-radius: 999px;
    background: #05080F;
    z-index: 3;
}

.dm-status {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 24px 0 34px;
    color: #FFFFFF;
    font-size: 14px;
    font-weight: 500;
    z-index: 2;
}

.dm-status svg {
    display: block;
}

.dm-apps {
    display: inline-flex;
    gap: 4px;
    padding: 4px;
    border: 1.5px solid #C5CBD5;
    border-radius: 12px;
    background: #FFFFFF;
}

.dm-app {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 44px;
    padding: 0 16px;
    border: 0;
    border-radius: 9px;
    background: transparent;
    color: #071325;
    font: inherit;
    font-size: 15px;
    font-weight: 500;
    white-space: nowrap;
    cursor: pointer;
    transition: background-color .2s ease,color .2s ease;
}

.dm-app img {
    width: 20px;
    height: 20px;
}

.dm-app:hover {
    background: #ECEEF0;
}

.dm-app.on {
    background: #071325;
    color: #FFFFFF;
}

#demo[data-app="vc"] .dm-app.on {
    background: #0A1E3D;
}

#demo[data-app="vc"] .dm-mod i {
    color: #017A3D;
}

#demo[data-app="vc"] .dm-mod:hover {
    border-color: #0A1E3D;
}

#demo[data-app="vc"] .dm-mod.on {
    background: #0A1E3D;
    border-color: #0A1E3D;
}

#demo[data-app="vc"] .dm-mod.on i {
    color: #00CF67;
}

#demo[data-app="vc"] .dm-k {
    color: #017A3D;
}

#demo[data-app="vc"] .dm-fact .tile {
    background: #E3F6EC;
    color: #017A3D;
}

#demo[data-app="vc"] .dm-link {
    background: repeating-linear-gradient(90deg,#7FD9AA 0 5px,transparent 5px 9px);
}

#demo[data-app="vc"] .dm-link:after {
    background: #00CF67;
    box-shadow: 0 0 0 4px rgba(0,207,103,.18);
}

#demo[data-app="vc"] .dm-glow {
    background: radial-gradient(circle,rgba(0,207,103,.2),transparent 65%);
}

#demo[data-app="vc"] .dm-rings {
    background: repeating-radial-gradient(circle,rgba(0,207,103,.16) 0 1.5px,transparent 1.5px 72px);
}

#demo[data-app="vc"] .dm-stats .xd {
    color: #017A3D;
}

#demo[data-app="vc"] .btn-p {
    background: #017A3D;
    border-color: #017A3D;
}

#demo[data-app="vc"] .btn-p:hover {
    background: #01652F;
    border-color: #01652F;
}

@media (max-width:640px) {
    .dm-apps {
        display: flex;
        align-self: stretch;
    }

    .dm-app {
        flex: 1 1 0;
        padding: 0 10px;
    }
}

@media (prefers-reduced-motion:reduce) {
    .dm-app {
        transition: none;
    }
}

.dm-stats {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 20px 72px;
    padding-top: 32px;
    border-top: 1px solid #D3D8DF;
}

.dm-stats > div {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    text-align: center;
}

.dm-stats .xd {
    font-size: var(--fs-num);
    color: #015EEA;
}

.dm-stats span + span {
    font-size: 15px;
    color: #3E4A5C;
}

@media (max-width:1100px) {
    .dm-stage {
        grid-template-columns: repeat(2,minmax(0,1fr));
        grid-template-areas: "phone phone" "l r";
        column-gap: 24px;
        row-gap: 48px;
    }

    .dm-l,
    .dm-r {
        align-items: stretch;
        justify-content: flex-start;
    }

    .dm-fact {
        max-width: none;
    }

    .dm-link {
        display: none;
    }
}

@media (max-width:640px) {
    .dm-mods {
        align-self: stretch;
        flex-wrap: nowrap;
        justify-content: flex-start;
        overflow-x: auto;
        margin: 0 -20px;
        padding: 0 20px 6px;
        scroll-snap-type: x mandatory;
        scroll-padding: 0 20px;
    }

    .dm-mod {
        scroll-snap-align: start;
    }

    .dm-stage {
        grid-template-columns: minmax(0,1fr);
        grid-template-areas: "phone" "l" "r";
        row-gap: 16px;
    }

    .dm-phone-wrap {
        margin-bottom: 24px;
    }

    .dm-phone {
        zoom: 1;
    }

    .dm-glow,
    .dm-rings {
        top: 330px;
    }

    .dm-side {
        gap: 16px;
    }

    .dm-fact {
        display: grid;
        grid-template-columns: 40px minmax(0,1fr);
        column-gap: 14px;
        row-gap: 4px;
        padding: 18px;
    }

    .dm-fact .tile {
        grid-row: span 3;
    }

    .dm-fact h3 {
        font-size: var(--fs-h4);
    }

    .dm-stats {
        display: grid;
        grid-template-columns: repeat(3,minmax(0,1fr));
        gap: 12px;
    }

    .dm-stats .xd {
        font-size: var(--fs-num);
        white-space: nowrap;
    }

    .dm-stats span + span {
        font-size: 13px;
        line-height: 1.4;
    }
}

@media (prefers-reduced-motion:reduce) {
    .dmA,
    .dmB,
    .dm-rings
    {
        animation: none;
    }
}

@media (prefers-reduced-motion:reduce) {
    .orbit,
    .oinner,
    .opulse {
        animation: none;
    }

    .ttrack,
    .ltrack,
    .mh-left,
    .mh-circle,
    .mh-photo,
    .mh-card,
    .mh-title {
        animation: none;
    }

    .mw,
    .node,
    .svc,
    .svc-ico,
    .pin,
    .btn,
    .chip {
        transition: none;
        animation: none;
    }

    .pin:after {
        animation: none;
        opacity: 0;
    }

    .swap-a,
    .swap-b {
        animation: none;
    }

    .arc {
        animation: none;
        stroke-dashoffset: 0;
    }
}

.pv-sec {
    background: #0A1E3D;
    color: #FFFFFF;
}

.pv-sec:before {
    inset: 0;
    background-image: radial-gradient(circle,var(--dot) 1.3px,transparent 1.7px);
    background-size: 22px 22px;
}

.pv-wrap {
    max-width: 1312px;
    margin: 0 auto;
    padding: clamp(72px,9vw,128px) clamp(20px,4.5vw,64px);
    display: flex;
    flex-direction: column;
    gap: clamp(32px,4vw,56px);
}

.pv-head {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.pv-head-t {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.pv-k {
    font-size: 14px;
    font-weight: 500;
    letter-spacing: .02em;
    color: #00CF67;
}

.pv-title {
    margin: 0;
    font-size: var(--fs-h2);
    line-height: 1.02;
}

.pv-lead {
    margin: 0;
    max-width: 60ch;
    font-size: 16px;
    color: #C9D3E3;
}

.pv-grid {
    display: grid;
    grid-template-columns: minmax(0,640px) minmax(360px,1fr);
    align-items: center;
    gap: clamp(40px,4.5vw,64px);
}

.pv-fig {
    container: pv/inline-size;
    position: relative;
    margin: 0;
}

.pv-shot {
    position: relative;
}

.pv-shot:before {
    content: "";
    position: absolute;
    left: 9.375%;
    top: 10.363%;
    width: 81.25%;
    aspect-ratio: 1;
    border-radius: 50%;
    background: radial-gradient(circle,rgba(2,170,86,.38),rgba(2,170,86,0) 68%);
}

.pv-kit {
    position: relative;
    display: block;
    width: 100%;
    height: auto;
}

.pv-dot {
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 3.125cqi;
    height: 3.125cqi;
    border-radius: 50%;
    background: #00CF67;
    box-shadow: 0 0 0 1.25cqi rgba(0,207,103,.28);
    color: #0A1E3D;
    font-size: 14px;
    line-height: 1;
    transform: translate(-50%,-50%);
}

.pv-dot b {
    display: none;
}

.pv-at1 {
    left: 55.625%;
    top: 29.188%;
}

.pv-at2 {
    left: 10.469%;
    top: 50.777%;
}

.pv-at3 {
    left: 34.688%;
    top: 79.965%;
}

.pv-at4 {
    left: 78.594%;
    top: 86.01%;
}

.pv-cap {
    position: absolute;
    inset: 0;
}

.pv-parts {
    list-style: none;
    margin: 0;
    padding: 0;
}

.pv-part {
    position: absolute;
    padding: 1.25cqi 2.1875cqi;
    border-radius: 999px;
    background: #FFFFFF;
    color: #0A1E3D;
    font-size: 2.1875cqi;
    font-weight: 500;
    line-height: 1.2;
    white-space: nowrap;
}

.pv-part-n:after {
    content: "\00a0·\00a0";
}

.pv-lb1 {
    left: 58.125%;
    top: 19.344%;
}

.pv-lb2 {
    left: 1.25%;
    top: 39.378%;
}

.pv-lb3 {
    left: 18.75%;
    top: 91.537%;
}

.pv-lb4 {
    right: 3.906%;
    top: 92.573%;
}

.pv-hw {
    display: flex;
    flex-direction: column;
    gap: 14px;
    min-width: 0;
}

.pv-hw-head {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px 16px;
}

.pv-hw-t {
    margin: 0;
    font-family: 'Gilroy','Helvetica Neue',Arial,sans-serif;
    font-weight: 700;
    font-size: var(--fs-h4);
    line-height: 1.2;
}

.pv-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 12px;
}

.pv-card {
    display: grid;
    grid-template-columns: 76px minmax(0,1fr) 48px;
    align-items: center;
    gap: 16px;
    padding: 12px;
    border-radius: 16px;
    border: 1px solid rgba(0,207,103,.2);
    background: rgba(255,255,255,.05);
    transition: border-color .25s ease;
}

.pv-card:hover {
    border-color: #02AA56;
}

.pv-media {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 76px;
    height: 76px;
    border-radius: 12px;
    background: #FFFFFF;
}

.pv-media img {
    display: block;
    width: auto;
    height: auto;
    max-width: 64px;
    max-height: 56px;
}

.pv-body {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
}

.pv-name {
    margin: 0;
    font-family: 'Gilroy','Helvetica Neue',Arial,sans-serif;
    font-weight: 700;
    font-size: 17px;
    line-height: 1.2;
}

.pv-price {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 0 10px;
    line-height: 1.3;
}

.pv-now {
    font-size: 17px;
    font-weight: 700;
    color: #00CF67;
}

.pv-was {
    font-size: 14px;
    color: #8FA0BA;
}

.pv-buy {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    border: 1.5px solid rgba(0,207,103,.35);
    font-size: 20px;
    text-decoration: none;
    transition: border-color .2s ease,color .2s ease;
}

.pv-sec .pv-buy:hover {
    border-color: #00CF67;
    color: #00CF67;
}

.pv-sec .pv-cta {
    align-self: flex-start;
    display: inline-flex;
    align-items: center;
    min-height: 48px;
    margin-top: 8px;
    padding: 0 22px;
    border-radius: 999px;
    background: #017A3D;
    color: #FFFFFF;
    font-weight: 500;
    text-decoration: none;
    transition: background-color .2s ease;
}

.pv-sec .pv-cta:hover {
    background: #01652F;
    color: #FFFFFF;
}

@container pv (max-width:547px) {
    .pv-dot {
        width: 26px;
        height: 26px;
        box-shadow: 0 0 0 5px rgba(247,193,8,.25);
    }

    .pv-dot b {
        display: block;
    }

    .pv-cap {
        position: static;
        margin-top: 20px;
    }

    .pv-parts {
        display: grid;
        grid-template-columns: repeat(2,minmax(0,1fr));
        gap: 12px 16px;
    }

    .pv-part {
        position: static;
        display: flex;
        align-items: center;
        gap: 10px;
        padding: 0;
        background: none;
        color: #C9D3E3;
        font-size: 15px;
        white-space: normal;
    }

    .pv-part-n {
        flex: none;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 26px;
        height: 26px;
        border-radius: 50%;
        background: #F7C108;
        color: #071325;
        font-size: 14px;
        font-weight: 700;
    }

    .pv-part-n:after {
        content: none;
    }
}

@media (max-width:1100px) {
    .pv-grid {
        grid-template-columns: minmax(0,1fr);
    }

    .pv-fig {
        justify-self: center;
        width: 100%;
        max-width: 640px;
    }
}

@media (min-width:700px) and (max-width:1100px) {
    .pv-list {
        grid-template-columns: repeat(2,minmax(0,1fr));
    }
}

@media (max-width:480px) {
    .pv-card {
        grid-template-columns: 64px minmax(0,1fr) 48px;
        gap: 12px;
    }

    .pv-media {
        width: 64px;
        height: 64px;
    }

    .pv-media img {
        max-width: 54px;
        max-height: 48px;
    }
}

@media (prefers-reduced-motion:reduce) {
    .pv-card,
    .pv-buy,
    .pv-sec .pv-cta {
        transition: none;
    }
}

@media (min-width:1280px) {
    .svc p,
    .svc span + p {
        font-size: 15px;
    }

    .dm-mod {
        font-size: 12px;
    }

    .dm-stats span + span {
        font-size: 14px;
    }
}

@media (min-width:1280px) {
    .svc-wrap {
        max-width: 1568px;
        padding-top: 72px;
        padding-bottom: 72px;
        gap: 28px;
    }

    .svc-bento {
        grid-template-columns: repeat(4,minmax(0,1fr));
        gap: 16px;
    }

    .svc {
        padding: 20px;
    }

    .svc-ico {
        top: 20px;
        right: 20px;
    }

    .svc-body {
        gap: 10px;
    }

    .svc-proof {
        padding-top: 14px;
    }

    .svc:not(.svc--wide) .svc-chips {
        display: none;
    }

    .svc--ecf {
        grid-column: span 3;
    }
}

.eq-chip {
    display: inline-flex;
    align-items: center;
    min-height: 32px;
    padding: 0 14px;
    border-radius: 999px;
    border: 1px solid #2C4469;
    font-size: 14px;
    font-weight: 500;
    color: #C9D3E3;
}

.eq-list {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.eq-list li {
    display: flex;
    align-items: flex-start;
    gap: 14px;
    color: #C9D3E3;
}

.eq-list .tile {
    background: #12305A;
    color: #7FB0FF;
}

.eq-list b {
    display: block;
    font-weight: 500;
    color: #FFFFFF;
}

.eq-fig {
    position: relative;
    margin: 0;
    border-radius: 16px;
    overflow: hidden;
    background: #0E2342;
}

.eq-fig img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.eq-cap {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 48px 20px 18px;
    background: linear-gradient(to top, rgba(7,19,37,.92), rgba(7,19,37,0));
    font-size: 14px;
    line-height: 1.4;
    color: #C9D3E3;
}

.eq-cap b {
    display: block;
    font-size: 15px;
    font-weight: 500;
    color: #FFFFFF;
}

.eq-ia {
    position: absolute;
    top: 12px;
    left: 12px;
    padding: 4px 10px;
    border-radius: 999px;
    background: rgba(7,19,37,.72);
    font-size: 12px;
    color: #FFFFFF;
}

@media (max-width:600px) {
    .eq-cap {
        padding: 32px 14px 12px;
        font-size: 13px;
    }

    .eq-cap b {
        font-size: 14px;
    }
}

/* Al final del archivo: deben ganar a las reglas anteriores de igual especificidad. */

.hd-menu-btn {
    min-height: 44px;
    padding: 0 16px;
    font-size: 15px;
}

.ico-md {
    font-size: 18px;
}

.hd-mnav {
    border-top: 1px solid #1B3256;
    padding: 8px clamp(20px, 4.5vw, 64px) 24px;
    display: flex;
    flex-direction: column;
}

.hd-mlink {
    min-height: 52px;
    display: flex;
    align-items: center;
    font-size: 16px;
}

.mh-lead {
    margin: 0;
    line-height: 1.6;
    color: #C9D3E3;
}

.on-dark .mh-alt {
    font-size: 15px;
    color: #8FA0BA;
    text-underline-offset: 4px;
}

.mh-line {
    display: block;
}

.bg-soft {
    background: #ECEEF0;
}

.cl-in {
    max-width: 1312px;
    margin: 0 auto;
    padding: clamp(48px, 6vw, 72px) clamp(20px, 4.5vw, 64px);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 32px;
}

.cl-title {
    margin: 0;
    text-align: center;
    font-size: var(--fs-quote);
}

.bg-white {
    background: #FFFFFF;
}

.sec-in {
    max-width: 1312px;
    margin: 0 auto;
    padding: clamp(72px, 9vw, 128px) clamp(20px, 4.5vw, 64px);
}

.sec-col {
    display: flex;
    flex-direction: column;
    gap: clamp(40px, 5vw, 56px);
}

.sec-head {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.h2 {
    margin: 0;
    font-size: var(--fs-h2);
}

.txt {
    margin: 0;
    color: #3E4A5C;
}

.pr-lead {
    max-width: 62ch;
}

.pr-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: clamp(40px, 6vw, 96px);
}

.pr-center-t {
    position: relative;
    font-size: 18px;
    line-height: 1.1;
    text-align: center;
}

.pr-card {
    flex: 1 1 400px;
    max-width: 520px;
    min-width: 0;
    background: #FFFFFF;
    border: 1px solid #DCE0E6;
    border-radius: 24px;
    padding: clamp(24px, 3vw, 36px);
    box-shadow: 0 24px 48px -28px rgba(7,19,37,.35);
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.pr-card-head {
    display: flex;
    align-items: center;
    gap: 14px;
}

.tile-lg {
    width: 52px;
    height: 52px;
    flex-basis: 52px;
    border-radius: 14px;
    font-size: 22px;
}

.pr-card-ttl {
    display: flex;
    flex-direction: column;
}

.pr-step {
    font-size: 14px;
    font-weight: 500;
    color: #015EEA;
}

.h3 {
    margin: 0;
    font-size: var(--fs-h3);
}

.pr-block {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.pr-label {
    font-size: 14px;
    font-weight: 500;
    color: #3E4A5C;
}

.m0 {
    margin: 0;
}

.pr-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    border-top: 1px solid #E3E7ED;
    padding-top: 20px;
}

.pr-btn {
    min-height: 44px;
    padding: 0 18px;
    font-size: 15px;
}

.sec-col-sm {
    display: flex;
    flex-direction: column;
    gap: clamp(32px, 4vw, 48px);
}

.dm-head {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    text-align: center;
}

.dm-title {
    max-width: 20ch;
}

.dm-hint {
    margin: 0;
    max-width: 64ch;
    font-size: 14px;
    color: #3E4A5C;
    text-align: center;
}

.dm-center {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    min-width: 0;
}

.dm-status-r {
    display: flex;
    align-items: center;
    gap: 6px;
}

.dm-ctas {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 12px;
}

.bg-dark {
    background: #071325;
    color: #FFFFFF;
}

.pf-in {
    display: flex;
    flex-direction: column;
    gap: clamp(32px, 4vw, 56px);
}

.pf-title {
    color: #FFFFFF;
}

.txt-d {
    margin: 0;
    color: #C9D3E3;
}

.pf-lead {
    max-width: 60ch;
}

.sec-lead {
    max-width: 60ch;
}

.svc-ecf-title {
    color: #FFFFFF;
}

.ps-map {
    display: block;
    width: 100%;
    height: auto;
}

.ps-arcs {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    overflow: visible;
}

.ps-flags {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.pq-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(480px, 100%), 1fr));
    gap: 48px 64px;
}

.pq-item {
    display: flex;
    gap: 20px;
    align-items: flex-start;
}

.pq-body {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.h4 {
    margin: 0;
    font-size: var(--fs-h4);
}

.eq-in {
    display: flex;
    flex-wrap: wrap;
    gap: clamp(40px, 5vw, 72px);
}

.eq-text {
    flex: 1 1 460px;
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 24px;
}

.eq-title {
    color: #FFFFFF;
}

.eq-note {
    margin: 0;
    font-size: 15px;
    color: #8FA0BA;
}

.eq-quote {
    margin: 0;
    padding: 24px 0 0;
    border-top: 1px solid #1B3256;
    align-self: stretch;
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.eq-quote-t {
    margin: 0;
    font-size: var(--fs-quote);
    line-height: 1.25;
    color: #FFFFFF;
}

.eq-quote-by {
    font-size: 15px;
    color: #8FA0BA;
}

.eq-grid {
    flex: 1 1 520px;
    min-width: 0;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr));
    gap: 12px;
}

.eq-fig--wide {
    grid-column: 1 / -1;
}

.vz-in {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: clamp(40px, 5vw, 56px);
}

.vz-head {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    text-align: center;
    max-width: 640px;
}

.vz-chip {
    display: inline-flex;
    align-items: center;
    min-height: 32px;
    padding: 0 14px;
    border-radius: 999px;
    border: 1px solid #C5CBD5;
    font-size: 14px;
    font-weight: 500;
    color: #3E4A5C;
}

.vz-note {
    font-size: 13px;
    color: #3E4A5C;
}

.vz-by {
    display: flex;
    align-items: center;
    gap: 12px;
}

.vz-who {
    display: flex;
    flex-direction: column;
    line-height: 1.35;
}

.vz-name {
    font-weight: 500;
    color: #071325;
}

.txt-sm {
    font-size: 14px;
    color: #3E4A5C;
}

.ct-in {
    display: flex;
    flex-wrap: wrap;
    gap: clamp(40px, 5vw, 72px);
    align-items: flex-start;
}

.ct-side {
    flex: 1 1 380px;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 28px;
}

.ct-stack {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.ct-wa-ico {
    background: #015EEA;
    color: #FFFFFF;
}

.ct-wa-txt {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.ct-wa-num {
    font-size: var(--fs-h3);
    color: #015EEA;
}

.ct-wa-more {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: -8px;
}

.ct-wa-links {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 20px;
}

.ct-wa-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 32px;
    font-weight: 500;
    color: #015EEA;
    text-decoration: none;
}

.ct-wa-link:hover {
    text-decoration: underline;
    text-underline-offset: 4px;
}

.ct-next {
    display: flex;
    flex-direction: column;
    gap: 16px;
    border-top: 1px solid #C5CBD5;
    padding-top: 24px;
}

.ct-next-t {
    font-size: 15px;
    font-weight: 500;
}

.ct-steps {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.ct-step {
    display: flex;
    gap: 14px;
    align-items: flex-start;
}

.ct-step-t {
    font-weight: 500;
}

.ct-step-d {
    color: #3E4A5C;
    font-size: 15px;
}

.ct-form-in {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.ct-prog-head {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 12px;
}

.ct-prog-step {
    font-size: 14px;
    font-weight: 500;
    color: #015EEA;
}

.ct-pane {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.ct-fs {
    border: 0;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.ct-lg {
    padding: 0;
    margin-bottom: 16px;
    font-size: var(--fs-h4);
}

.ct-fs-sm {
    gap: 12px;
}

.ct-lg-sm {
    margin-bottom: 12px;
}

.ct-opts {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.ct-lg-xs {
    padding: 0;
    margin-bottom: 10px;
    font-size: 15px;
    font-weight: 500;
}

.ct-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.ct-data {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

.ct-data-t {
    font-size: var(--fs-h4);
}

.ct-sum {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    align-items: center;
}

.ct-sum-l {
    font-size: 14px;
    color: #3E4A5C;
    margin-right: 4px;
}

.ct-sum-v {
    display: contents;
}

.ct-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(200px, 100%), 1fr));
    gap: 16px;
}

.ct-ta {
    resize: vertical;
}

.ct-hint {
    font-size: 13px;
    color: #3E4A5C;
}

.ct-foot {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    border-top: 1px solid #E3E7ED;
    padding-top: 20px;
}

.ct-next-btn {
    margin-left: auto;
}

.ct-ok {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    padding: 12px 0;
}

.ct-ok-ico {
    width: 64px;
    height: 64px;
    flex-basis: 64px;
    border-radius: 50%;
    font-size: 28px;
    background: #E8F6EE;
    color: #0A8F4E;
}

.ct-ok-t {
    font-size: var(--fs-h3);
}

.ct-ok-acts {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.ct-apps {
    margin: 0;
    padding-top: 16px;
    border-top: 1px solid #E3E7ED;
    font-size: 14px;
    color: #3E4A5C;
}

.ft {
    background: #071325;
    color: #C9D3E3;
}

.ft-in {
    max-width: 1312px;
    margin: 0 auto;
    padding: clamp(56px, 7vw, 96px) clamp(20px, 4.5vw, 64px) 40px;
    display: flex;
    flex-direction: column;
    gap: 48px;
}

.ft-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr));
    gap: 40px;
}

.ft-brand {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.ft-logo {
    width: 140px;
    height: auto;
    display: block;
}

.ft-p {
    margin: 0;
    font-size: 15px;
}

.ft-member {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
}

/* El logo trae el texto en negro: va sobre una tarjeta clara para leerse en el pie oscuro */
.ft-member-card {
    display: inline-flex;
    padding: 10px 14px;
    border-radius: 10px;
    background: #FFFFFF;
}

.ft-member-logo {
    width: 150px;
    height: auto;
    display: block;
}

.ft-contact {
    display: flex;
    flex-direction: column;
    gap: 8px;
    font-size: 15px;
}

.on-dark .ft-clink {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 32px;
    text-decoration: none;
    color: #C9D3E3;
}

.ft-col {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.ft-col-t {
    font-size: 15px;
    font-weight: 500;
    color: #FFFFFF;
    margin-bottom: 8px;
}

.on-dark .ft-link {
    min-height: 36px;
    display: flex;
    align-items: center;
    text-decoration: none;
    color: #C9D3E3;
}

.ft-bar {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 16px;
    border-top: 1px solid #1B3256;
    padding-top: 24px;
    font-size: 14px;
}

.ft-legal {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 24px;
}

.on-dark .ft-legal-a {
    color: #C9D3E3;
}

.mbar-cta {
    flex: 1 1 auto;
    padding: 0 14px;
    font-size: 15px;
    white-space: nowrap;
}

.mbar-wa {
    flex: 0 0 auto;
    padding: 0 14px;
    font-size: 15px;
}

.ltrack {
    animation-duration: 54s;
}

.ltrack.rev {
    animation-duration: 48s;
}

.tcol .ttrack {
    animation-duration: 15s;
}

.tcol-2 .ttrack {
    animation-duration: 19s;
}

.tcol-3 .ttrack {
    animation-duration: 17s;
}

.onode:nth-of-type(1) {
    transform: rotate(-90deg) translateX(var(--r)) rotate(90deg);
}

.onode:nth-of-type(2) {
    transform: rotate(-18deg) translateX(var(--r)) rotate(18deg);
}

.onode:nth-of-type(3) {
    transform: rotate(54deg) translateX(var(--r)) rotate(-54deg);
}

.onode:nth-of-type(4) {
    transform: rotate(126deg) translateX(var(--r)) rotate(-126deg);
}

.onode:nth-of-type(5) {
    transform: rotate(198deg) translateX(var(--r)) rotate(-198deg);
}

.arc:nth-of-type(1) {
    animation-delay: 0.00s;
}

.arc:nth-of-type(2) {
    animation-delay: 0.14s;
}

.arc:nth-of-type(3) {
    animation-delay: 0.28s;
}

.arc:nth-of-type(4) {
    animation-delay: 0.42s;
}

.arc:nth-of-type(5) {
    animation-delay: 0.56s;
}

.arc:nth-of-type(6) {
    animation-delay: 0.70s;
}

.arc:nth-of-type(7) {
    animation-delay: 0.84s;
}

.arc:nth-of-type(8) {
    animation-delay: 0.98s;
}

.arc:nth-of-type(9) {
    animation-delay: 1.12s;
}

.arc:nth-of-type(10) {
    animation-delay: 1.26s;
}

.arc:nth-of-type(11) {
    animation-delay: 1.40s;
}

.arc:nth-of-type(12) {
    animation-delay: 1.54s;
}

.arc:nth-of-type(13) {
    animation-delay: 1.68s;
}

.arc:nth-of-type(14) {
    animation-delay: 1.82s;
}

.arc:nth-of-type(15) {
    animation-delay: 1.96s;
}

.arc:nth-of-type(16) {
    animation-delay: 2.10s;
}

.arc:nth-of-type(17) {
    animation-delay: 2.24s;
}

.arc:nth-of-type(18) {
    animation-delay: 2.38s;
}

.arc:nth-of-type(19) {
    animation-delay: 2.52s;
}

.pin--repdom {
    left: 29.29%;
    top: 49.36%;
}

.pin--argentina {
    left: 31.06%;
    top: 81.41%;
}

.pin--bolivia {
    left: 30.81%;
    top: 70.15%;
}

.pin--brasil {
    left: 35.10%;
    top: 67.55%;
}

.pin--chile {
    left: 28.79%;
    top: 80.54%;
}

.pin--colombia {
    left: 28.03%;
    top: 57.16%;
}

.pin--costa-rica {
    left: 24.75%;
    top: 54.56%;
}

.pin--ecuador {
    left: 26.52%;
    top: 60.62%;
}

.pin--el-salvador {
    left: 23.48%;
    top: 51.96%;
}

.pin--usa {
    left: 20.45%;
    top: 34.64%;
}

.pin--guatemala {
    left: 23.23%;
    top: 51.10%;
}

.pin--haiti {
    left: 28.54%;
    top: 48.50%;
}

.pin--honduras {
    left: 24.24%;
    top: 51.10%;
}

.pin--mexico {
    left: 19.70%;
    top: 45.90%;
}

.pin--mozambique {
    left: 60.35%;
    top: 71.01%;
}

.pin--nicaragua {
    left: 24.75%;
    top: 52.83%;
}

.pin--panama {
    left: 26.01%;
    top: 55.43%;
}

.pin--paraguay {
    left: 32.58%;
    top: 74.48%;
}

.pin--peru {
    left: 27.53%;
    top: 65.82%;
}

.pin--venezuela {
    left: 30.30%;
    top: 56.29%;
}

.mbar {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 5;
    gap: 8px;
    padding: 12px 16px;
    background: #071325;
    border-top: 1px solid #1B3256;
}

.lang {
    display: inline-flex;
    height: 40px;
    border: 1px solid #2A3F63;
    border-radius: 8px;
    overflow: hidden;
}

.lang-b {
    min-width: 36px;
    padding: 0 8px;
    border: 0;
    background: transparent;
    font: inherit;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .04em;
    color: #C9D3E3;
    cursor: pointer;
    transition: color .2s ease, background-color .2s ease;
}

.lang-b + .lang-b {
    border-left: 1px solid #2A3F63;
}

.lang-b:hover {
    color: #FFFFFF;
}

.lang-b[aria-pressed="true"] {
    background: #015EEA;
    color: #FFFFFF;
}

/* overflow:hidden recortaría el foco por fuera. */
.lang-b:focus-visible {
    outline-offset: -3px;
}

.hd-mlang {
    align-self: flex-start;
    margin-top: 16px;
}

.hd-mlang .lang-b {
    min-width: 64px;
}

html.i18n-wait body {
    visibility: hidden;
}

.mh-photo {
    position: absolute;
    left: 50%;
    bottom: 0;
    width: 560px;
    max-width: none;
    height: auto;
    --px: 0px;
    translate: calc(-50% + var(--px)) 0;
    filter: drop-shadow(0 0 1px rgba(255,255,255,.7)) drop-shadow(0 0 8px rgba(255,255,255,.25));
    animation: photoUp 1s cubic-bezier(.2,.8,.2,1) .25s backwards;
}

@keyframes photoUp {
    from {
        opacity: .01;
        translate: calc(-50% + var(--px)) 40px;
    }
}

@media (max-width:1100px) {
    .mh-photo {
        width: 460px;
    }
}

@media (max-width:900px) {
    .mh-photo {
        width: min(100%,420px);
        --px: 0px;
    }

    .mh-center:after {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        bottom: 0;
        height: 64px;
        background: linear-gradient(to bottom,rgba(7,19,37,0),#071325);
        pointer-events: none;
    }
}

.mh-cards {
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.mh-card {
    --k: 1;
    --glow: rgba(0,113,216,.5);
    position: absolute;
    color: #1A2233;
    rotate: var(--rot);
    scale: calc(var(--k) * .94);
    filter: drop-shadow(0 14px 16px rgba(0,0,0,.38));
    transition: scale .5s cubic-bezier(.2,.8,.2,1),filter .5s ease;
    animation: cardIn .7s cubic-bezier(.2,.8,.2,1) .3s backwards,cardFloat 6s ease-in-out infinite;
}

.mh-card.is-on {
    z-index: 2;
    scale: calc(var(--k) * 1.04);
    filter: drop-shadow(0 22px 26px var(--glow));
}

.mh-c1 {
    --rot: -3deg;
    left: -28px;
    bottom: 540px;
    width: 212px;
}

.mh-c2 {
    --glow: rgba(0,188,94,.5);
    --rot: 2deg;
    right: -30px;
    bottom: 395px;
    width: 252px;
    animation-delay: .45s,-2s;
}

.mh-c3 {
    --glow: rgba(187,3,3,.45);
    --rot: -2deg;
    left: -44px;
    bottom: 96px;
    width: 232px;
    animation-delay: .6s,-4s;
}

.mh-c4 {
    --glow: rgba(1,94,234,.5);
    --rot: 3deg;
    right: -26px;
    bottom: 42px;
    width: 226px;
    animation-delay: .75s,-1s;
}

.mh-doc {
    position: relative;
    display: flex;
    flex-direction: column;
    background: #FFFFFF;
    line-height: 1.2;
}

.mh-doc:after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: #071325;
    opacity: .2;
    pointer-events: none;
    transition: opacity .4s ease;
}

.is-on .mh-doc:after {
    opacity: 0;
}

.mh-doc img {
    flex: none;
    display: block;
    border-radius: 6px;
}

.mh-sm {
    font-size: 11px;
    color: #5C6577;
}

.mh-r {
    gap: 8px;
    padding: 16px 16px 17px;
    font-family: ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
    -webkit-mask: conic-gradient(from -45deg at bottom,#0000,#000 1deg 89deg,#0000 90deg) 0 0 / calc(100% / 21) 100%;
    mask: conic-gradient(from -45deg at bottom,#0000,#000 1deg 89deg,#0000 90deg) 0 0 / calc(100% / 21) 100%;
}

.mh-r-hd {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .06em;
}

.mh-lbl {
    font-size: 10px;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #5C6577;
}

.mh-sep {
    border-top: 1px dashed #C3C9D4;
}

.mh-row {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    font-size: 11px;
}

.mh-tot {
    font-weight: 700;
    text-transform: uppercase;
}

.mh-tot span:last-child {
    font-size: 14px;
}

.mh-end {
    align-self: center;
    font-size: 9px;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: #5C6577;
}

.mh-stamp {
    position: absolute;
    right: 14px;
    top: 46px;
    padding: 2px 8px;
    border: 2px solid #0071D8;
    border-radius: 4px;
    rotate: -12deg;
    font-size: 13px;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #0071D8;
}

.mh-f {
    gap: 12px;
    padding: 16px;
    border-radius: 14px;
}

.mh-f-hd {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    font-weight: 700;
}

.mh-pill {
    margin-left: auto;
    padding: 2px 8px;
    border-radius: 999px;
    background: #E3F5EA;
    font-family: ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
    font-size: 10px;
    font-weight: 700;
    color: #017A3D;
}

.mh-f-meta {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.mh-code {
    font-family: ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
    font-size: 12px;
}

.mh-f-mid {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 12px;
}

.mh-amt {
    font-size: 24px;
    line-height: 1;
    white-space: nowrap;
}

.mh-qr {
    flex: none;
    box-sizing: content-box;
    display: block;
    width: 42px;
    height: 42px;
    padding: 4px;
    border: 1px solid #E3E6EB;
    border-radius: 4px;
    fill: #1A2233;
    shape-rendering: crispEdges;
}

.mh-f-ft {
    display: flex;
    align-items: center;
    gap: 8px;
    padding-top: 10px;
    border-top: 1px solid #EEF0F3;
    font-size: 12px;
    font-weight: 500;
    color: #017A3D;
}

.mh-ok {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #017A3D;
}

.mh-ok svg {
    width: 11px;
    height: 11px;
    fill: none;
    stroke: #FFFFFF;
    stroke-width: 3.5;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.mh-t {
    border-radius: 12px;
    -webkit-mask: radial-gradient(circle 9px at 0 97px,#0000 98%,#000 100%) left / 51% 100% no-repeat,radial-gradient(circle 9px at 100% 97px,#0000 98%,#000 100%) right / 51% 100% no-repeat;
    mask: radial-gradient(circle 9px at 0 97px,#0000 98%,#000 100%) left / 51% 100% no-repeat,radial-gradient(circle 9px at 100% 97px,#0000 98%,#000 100%) right / 51% 100% no-repeat;
}

.mh-t-top {
    display: flex;
    flex-direction: column;
    gap: 4px;
    height: 96px;
    padding: 14px 18px;
}

.mh-t-hd {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #BB0303;
}

.mh-time {
    font-size: 26px;
    line-height: 1;
}

.mh-t-cut {
    margin: 0 16px;
    border-top: 2px dashed #E3E6EB;
}

.mh-t-ft {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 18px 14px;
}

.mh-tno {
    font-size: 16px;
    color: #BB0303;
}

.mh-b {
    gap: 10px;
    padding: 14px 16px 16px;
    border-radius: 12px;
}

.mh-b-ttl {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #5C6577;
}

.mh-b-t {
    font-size: 14px;
    font-weight: 700;
}

.mh-b-kpi {
    display: flex;
    align-items: baseline;
    gap: 8px;
}

.mh-b-pct {
    font-size: 28px;
    line-height: 1;
    color: #015EEA;
}

.mh-bars {
    box-sizing: content-box;
    display: flex;
    align-items: flex-end;
    gap: 6px;
    height: 44px;
    padding-top: 4px;
    border-bottom: 1px solid #E3E6EB;
}

.mh-bars span {
    flex: 1;
    border-radius: 3px 3px 0 0;
    background: #C9DAF8;
}

.mh-bars span:nth-child(1) {
    height: 30%;
}

.mh-bars span:nth-child(2) {
    height: 46%;
}

.mh-bars span:nth-child(3) {
    height: 40%;
}

.mh-bars span:nth-child(4) {
    height: 62%;
}

.mh-bars span:nth-child(5) {
    height: 74%;
}

.mh-bars span:nth-child(6) {
    height: 100%;
    background: #015EEA;
}

@keyframes cardIn {
    from {
        opacity: 0;
        scale: calc(var(--k) * .85);
    }
}

@keyframes cardFloat {
    0%,
    100% {
        translate: 0 0;
    }

    50% {
        translate: 0 -8px;
    }
}

@media (max-width:1100px) {
    .mh-card {
        --k: .82;
    }

    .mh-c1,
    .mh-c3 {
        transform-origin: 0 100%;
    }

    .mh-c2,
    .mh-c4 {
        transform-origin: 100% 100%;
    }

    .mh-c1 {
        left: -20px;
        bottom: 445px;
    }

    .mh-c2 {
        right: -20px;
        bottom: 340px;
    }

    .mh-c3 {
        left: -28px;
        bottom: 16px;
    }

    .mh-c4 {
        right: -20px;
        bottom: 14px;
    }
}

@media (max-width:900px) {
    .mh-cards {
        z-index: 1;
        inset: auto 0 0;
        width: min(100%,420px);
        margin: 0 auto;
        aspect-ratio: 1300 / 1256;
    }

    .mh-card {
        --k: .72;
    }

    .mh-c1 {
        left: -6px;
        bottom: 98%;
    }

    .mh-c2 {
        right: -8px;
        bottom: 76%;
    }

    .mh-c3 {
        left: -8px;
        bottom: -10px;
    }

    .mh-c4 {
        right: -8px;
        bottom: -10px;
    }
}

@media (prefers-reduced-motion:reduce) {
    .mh-card {
        transition: none;
    }
}

/* ===== Movimiento (CSD-2180) =====
   Todo cuelga de html.motion: lo pone el <head> antes del primer pintado solo si el visitante no pidió menos
   movimiento y el navegador tiene IntersectionObserver; main.js (bloque "Movimiento") lo confirma y revela.
   La lista de objetivos es la misma que SEL en main.js. Al terminar cada revelado (is-done) la regla deja de
   aplicar y el elemento vuelve a sus estilos propios. */

@media screen {
    html.motion :is(#clientes .cl-title, #clientes .logos, #proceso .sec-head, #proceso .orbit-wrap, #proceso .pr-card, #demo .dm-head, #demo .dm-center, #plataformas .pf-head, #plataformas .pf-row, #plataformas .pf-stage-wrap, #services .svc-head, #services .svc, #ourProducts .pv-head, #ourProducts .pv-fig, #ourProducts .pv-hw, #paises .sec-head, #paises .map, #paises .ps-flags > li, #por-que .sec-in > h2, #por-que .pq-item, #estudio .eq-text, #estudio .eq-fig, #voces .vz-head, #contactUs .ct-side, #contactUs .fcard):not(.is-done) {
        opacity: var(--mo-o, 0);
        translate: var(--mo-x, 0px) var(--mo-y, 18px);
        scale: var(--mo-s, 1);
        transition: opacity .75s cubic-bezier(.2,.8,.2,1) var(--mo-d, 0ms), translate .75s cubic-bezier(.2,.8,.2,1) var(--mo-d, 0ms), scale .75s cubic-bezier(.2,.8,.2,1) var(--mo-d, 0ms);
    }

    html.motion :is(#clientes .cl-title, #clientes .logos, #proceso .sec-head, #proceso .orbit-wrap, #proceso .pr-card, #demo .dm-head, #demo .dm-center, #plataformas .pf-head, #plataformas .pf-row, #plataformas .pf-stage-wrap, #services .svc-head, #services .svc, #ourProducts .pv-head, #ourProducts .pv-fig, #ourProducts .pv-hw, #paises .sec-head, #paises .map, #paises .ps-flags > li, #por-que .sec-in > h2, #por-que .pq-item, #estudio .eq-text, #estudio .eq-fig, #voces .vz-head, #contactUs .ct-side, #contactUs .fcard).is-in:not(.is-done) {
        opacity: 1;
        translate: 0 0;
        scale: 1;
    }

    /* Dirección por bloque: los pares laterales entran desde cada lado, el mapa crece, las banderas brotan, las fotos se destapan */
    html.motion #contactUs .ct-side,
    html.motion #ourProducts .pv-fig {
        --mo-x: -26px;
        --mo-y: 0px;
    }

    html.motion #contactUs .fcard,
    html.motion #ourProducts .pv-hw,
    html.motion #plataformas .pf-stage-wrap {
        --mo-x: 26px;
        --mo-y: 0px;
    }

    html.motion #paises .map,
    html.motion #proceso .orbit-wrap {
        --mo-y: 0px;
        --mo-s: .95;
    }

    html.motion #paises .ps-flags > li {
        --mo-y: 10px;
        --mo-s: .88;
    }

    /* Fotos del equipo: ni la figura ni la imagen se recortan (el recorte retrasaba la carga perezosa de la foto);
       una cortina del color del fondo se retira hacia abajo y destapa la foto ya cargada */
    html.motion #estudio .eq-fig {
        --mo-o: 1;
        --mo-y: 0px;
    }

    html.motion #estudio .eq-fig:not(.is-done)::after {
        content: "";
        position: absolute;
        inset: 0;
        z-index: 2;
        background: #0E2342;
        transition: translate .9s cubic-bezier(.2,.8,.2,1) var(--mo-d, 0ms);
    }

    html.motion #estudio .eq-fig.is-in:not(.is-done)::after {
        translate: 0 100%;
    }
}

/* Botones principales: se levantan al pasar el puntero y responden al clic */
html.motion .btn {
    transition: background-color .2s ease, color .2s ease, border-color .2s ease, translate .25s cubic-bezier(.2,.8,.2,1), box-shadow .25s ease, scale .15s ease;
}

html.motion .btn-p:hover {
    translate: 0 -2px;
    box-shadow: 0 14px 28px -14px rgba(1,94,234,.65);
}

html.motion .btn:active {
    translate: 0 0;
    scale: .985;
}

/* Fotos del equipo: acercamiento lento al pasar el puntero */
html.motion .eq-fig img {
    transition: scale .9s cubic-bezier(.2,.8,.2,1);
}

html.motion .eq-fig:hover img {
    scale: 1.04;
}

/* Hero: tarjetas y anillos siguen al puntero con profundidad (variables --mx/--my en .mh-center, las pone main.js) */
html.motion .mh-card {
    transform: translate(calc(var(--mx, 0) * var(--pz, 8) * 1px), calc(var(--my, 0) * var(--pz, 8) * .6px));
}

html.motion .mh-c1 { --pz: 10; }
html.motion .mh-c2 { --pz: -7; }
html.motion .mh-c3 { --pz: 8; }
html.motion .mh-c4 { --pz: -6; }

html.motion .mh-ring {
    translate: calc(var(--mx, 0) * -5px) calc(var(--my, 0) * -4px);
}

/* Hero: al hacer scroll las tarjetas se adelantan a la foto (solo navegadores con animaciones ligadas al scroll) */
@supports (animation-timeline: scroll()) {
    html.motion .mh-cards {
        animation: moHeroDrift linear both;
        animation-timeline: scroll(root);
        animation-range: 0 100vh;
    }
}

@keyframes moHeroDrift {
    to {
        translate: 0 -90px;
        opacity: .55;
    }
}

/* Demo: el teléfono se inclina hacia el puntero (variables --rx/--ry, las pone main.js) */
html.motion .dm-phone {
    transform: perspective(1400px) rotateX(calc(var(--rx, 0) * 1deg)) rotateY(calc(var(--ry, 0) * 1deg));
}
