/* VOKIP · movimiento. Todo lo que oculta contenido depende de .vk-motion (la pone el script en <head>
   y se retira sola si motion.js no carga). Con "reducir movimiento" activado no se aplica nada. */

/* barra de progreso */
.vk-progress{position:fixed;top:0;left:0;right:0;height:2px;background:#3DD6FF;transform:scaleX(0);transform-origin:0 50%;z-index:100;pointer-events:none}

/* encabezado fijo con vidrio */
.vk-header{position:sticky;top:0;z-index:50;transition:transform .45s cubic-bezier(.2,.7,.2,1),background-color .3s,border-color .3s}
.vk-header.vk-scrolled{background:rgba(10,10,11,.72)!important;-webkit-backdrop-filter:blur(16px) saturate(1.4);backdrop-filter:blur(16px) saturate(1.4)}
.vk-header.vk-hide{transform:translateY(-101%)}

/* aparición al bajar */
.vk-motion .vk-reveal{opacity:0;transform:translateY(32px);transition:opacity 1s cubic-bezier(.2,.7,.2,1),transform 1s cubic-bezier(.2,.7,.2,1);transition-delay:var(--d,0ms)}
.vk-motion .vk-reveal.in{opacity:1;transform:none}

/* titulares palabra por palabra */
.vk-w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.1em;margin-bottom:-.1em}
.vk-w>span{display:inline-block}
.vk-motion .vk-split .vk-w>span{transform:translateY(110%);transition:transform 1.1s cubic-bezier(.16,.84,.24,1);transition-delay:var(--d,0ms)}
.vk-motion .vk-split.in .vk-w>span{transform:none}

/* ilustraciones que se dibujan */
.vk-motion svg .vk-draw{stroke-dasharray:var(--len);stroke-dashoffset:var(--len);transition:stroke-dashoffset 1.8s cubic-bezier(.6,0,.2,1);transition-delay:var(--d,0ms)}
.vk-motion svg.in .vk-draw{stroke-dashoffset:0}
.vk-motion svg .vk-pop{opacity:0;transform:scale(.4);transform-box:fill-box;transform-origin:center;transition:opacity .7s,transform .9s cubic-bezier(.2,1.4,.4,1);transition-delay:var(--d,0ms)}
.vk-motion svg.in .vk-pop{opacity:1;transform:none}

/* señales: líneas punteadas que viajan, anillos que pulsan, puntos que titilan */
.vk-motion .vk-march{animation:vk-march 42s linear infinite}
@keyframes vk-march{to{stroke-dashoffset:-1260}}
.vk-motion .vk-ping{transform-box:fill-box;transform-origin:center;animation:vk-ping 3s cubic-bezier(.2,.6,.3,1) infinite;animation-delay:var(--d,0ms);pointer-events:none}
@keyframes vk-ping{0%{transform:scale(1);opacity:.9}100%{transform:scale(2.8);opacity:0}}
.vk-motion .vk-blink{animation:vk-blink 2.6s ease-in-out infinite;animation-delay:var(--d,0ms)}
@keyframes vk-blink{0%,100%{opacity:1}50%{opacity:.25}}

/* globo de la portada */
.vk-globe{position:absolute;inset:0;width:100%;height:100%;display:block;pointer-events:none}

/* franja de capacidades en movimiento */
.vk-marquee{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.vk-marquee-track{display:flex!important;flex-wrap:nowrap!important;width:max-content;max-width:none!important;animation:vk-marquee 38s linear infinite}
.vk-marquee:hover .vk-marquee-track{animation-play-state:paused}
@keyframes vk-marquee{to{transform:translateX(-50%)}}

/* frase que se ilumina palabra por palabra */
.vk-scrub-sec{position:relative}
.vk-scrub-inner{position:sticky!important;top:0;min-height:100vh;display:flex;flex-direction:column;justify-content:center;box-sizing:border-box}
.vk-sw{transition:opacity .35s,color .35s;opacity:.16}
.vk-sw.on{opacity:1}
.vk-sw.on.hot{color:#3DD6FF}
.vk-spin{transition:transform .1s linear;will-change:transform}

/* línea que se llena en las fases */
.vk-line{position:relative;border-top-color:#2A2A2E!important}
.vk-line::before{content:"";position:absolute;left:0;top:-1px;height:1px;width:100%;background:#FFFFFF;transform:scaleX(0);transform-origin:0 50%;transition:transform 1.4s cubic-bezier(.6,0,.2,1);transition-delay:calc(var(--d,0ms) + 200ms)}
.vk-line.in::before{transform:scaleX(1)}

/* tarjetas */
.vk-card{position:relative;transition:background-color .4s}
.vk-card::after{content:"";position:absolute;left:0;top:0;height:2px;width:100%;background:#3DD6FF;transform:scaleX(0);transform-origin:0 50%;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.vk-card:hover{background-color:#111113!important}
.vk-card:hover::after{transform:scaleX(1)}

/* botones */
a[style*="background: #FFFFFF"],button[style*="background: #FFFFFF"]{transition:background-color .25s,color .25s,transform .25s}
a[style*="background: #FFFFFF"]:hover,button[style*="background: #FFFFFF"]:hover{background-color:#3DD6FF!important}
a[style*="border: 1px solid #52525B"]{transition:border-color .25s,background-color .25s}
a[style*="border: 1px solid #52525B"]:hover{border-color:#FFFFFF!important;background-color:rgba(255,255,255,.06)!important}

@media (prefers-reduced-motion: reduce){
  .vk-march,.vk-ping,.vk-blink,.vk-marquee-track{animation:none!important}
  .vk-header{transition:none}
}
