/* Kodra · movimiento compartido. Curva de la casa: cubic-bezier(.23,1,.32,1). */

/* transición al cambiar de página (mismo sitio) */
@view-transition { navigation: auto; }
::view-transition-old(root), ::view-transition-new(root) { animation-duration: 420ms; animation-timing-function: cubic-bezier(.23, 1, .32, 1); }
::view-transition-group(foto) { animation-duration: 560ms; animation-timing-function: cubic-bezier(.22, .8, .2, 1); }

/* desplazamiento suave (Lenis) */
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-smooth [data-lenis-prevent] { overscroll-behavior: contain; }
.lenis.lenis-stopped { overflow: hidden; }

/* barra de avance */
.mov-progreso { position: fixed; top: 0; left: 0; right: 0; height: 3px; z-index: 130; pointer-events: none; transform: scaleX(0); transform-origin: 0 50%; background: var(--accent, var(--k-accent, #3B82F6)); }

/* cabecera que se esconde */
.nav, .k-top { transition: transform .5s cubic-bezier(.23, 1, .32, 1), background-color .3s, border-color .3s; }
.mov-oculta { transform: translateY(-105%); }

/* títulos palabra por palabra */
.mov-lineas .mov-w { display: inline-block; overflow: hidden; vertical-align: top; padding-bottom: .14em; margin-bottom: -.14em; }
.mov-lineas .mov-wi { display: inline-block; transform: translateY(112%); transition: transform 1.05s cubic-bezier(.19, 1, .22, 1); transition-delay: calc(var(--i, 0) * 42ms + var(--d, 0ms)); will-change: transform; }
.mov-lineas.mov-in .mov-wi { transform: none; }

/* odómetro (blindado: las reglas del contenedor, como «.figures span», no deben tocar sus dígitos) */
.odo { display: inline-flex !important; align-items: flex-end; font-variant-numeric: tabular-nums; margin: 0 !important; font-size: inherit !important; color: inherit !important; line-height: 1.12; }
.odo .odo-d, .odo .odo-p, .odo .odo-p > span, .odo .odo-c { margin: 0 !important; padding: 0 !important; font-size: inherit !important; color: inherit !important; font-weight: inherit; letter-spacing: inherit; }
.odo .odo-d { display: inline-block !important; height: 1.12em; overflow: hidden; line-height: 1.12; }
.odo .odo-p { display: flex !important; flex-direction: column; transition: transform 1.9s cubic-bezier(.16, 1, .3, 1); transition-delay: calc(var(--k, 0) * 65ms); }
.odo .odo-p > span { display: block !important; height: 1.12em; line-height: 1.12; text-align: center; }
.odo .odo-c { display: inline !important; white-space: pre; line-height: 1.12; }

/* inclinación 3D */
.mov-tilt { transform: perspective(1100px) rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg)); transition: transform .6s cubic-bezier(.23, 1, .32, 1), box-shadow .3s; }
.mov-tilt.mov-tilt-on { transition: transform .12s linear, box-shadow .3s; }
.mov-brillo { position: absolute; inset: 0; border-radius: inherit; pointer-events: none; opacity: 0; transition: opacity .4s; background: radial-gradient(520px circle at var(--gx, 50%) var(--gy, 50%), rgba(255, 255, 255, .42), rgba(255, 255, 255, 0) 45%); z-index: 3; }
.mov-tilt-on .mov-brillo { opacity: 1; }

/* parallax */
.mov-par { will-change: transform; transform: scale(1.14); }

/* flecha en botones */
.mov-flecha { display: inline-flex; width: 16px; height: 16px; flex: none; transition: transform .4s cubic-bezier(.23, 1, .32, 1); }
.mov-flecha svg { width: 16px; height: 16px; }
a:hover > .mov-flecha, button:hover > .mov-flecha { transform: translateX(4px); }

/* grupos escalonados */
/* la entrada usa «translate» y la inclinación «transform»: así se combinan sin pisarse */
.mov-escalon > * { opacity: 0; translate: 0 22px; transition: opacity .9s cubic-bezier(.16, 1, .3, 1) calc(var(--j, 0) * 75ms), translate .9s cubic-bezier(.16, 1, .3, 1) calc(var(--j, 0) * 75ms), transform .6s cubic-bezier(.23, 1, .32, 1), box-shadow .3s; }
.mov-escalon.mov-in > * { opacity: 1; translate: none; }
.mov-escalon > .mov-tilt.mov-tilt-on { transition: opacity .9s cubic-bezier(.16, 1, .3, 1), translate .9s cubic-bezier(.16, 1, .3, 1), transform .12s linear, box-shadow .3s; }

/* entrada de la portada */
@keyframes mov-sube { from { opacity: 0; translate: 0 18px; } to { opacity: 1; translate: none; } }
.mov .mov-entra { animation: mov-sube 1s cubic-bezier(.19, 1, .22, 1) both; animation-delay: var(--d, 0ms); }

/* quietos: quien pidió menos movimiento ve todo en su lugar */
.mov-quieto .mov-lineas .mov-wi, .mov-quieto .mov-escalon > *, .mov-quieto .mov-entra { transform: none !important; translate: none !important; opacity: 1 !important; animation: none !important; transition: none !important; }
@media (prefers-reduced-motion: reduce) {
  ::view-transition-group(*), ::view-transition-old(*), ::view-transition-new(*) { animation: none !important; }
}
@media print {
  .mov-lineas .mov-wi { transform: none !important; }
  .mov-escalon > * { opacity: 1 !important; translate: none !important; }
  .mov-progreso { display: none; }
}