/* Capa de movimiento compartida · MRL Asesores y firmas */
html{scroll-behavior:smooth}
header{position:sticky;top:0;z-index:50;transition:box-shadow .35s ease,backdrop-filter .35s ease,background-color .35s ease}
header.is-scrolled{box-shadow:0 10px 30px -18px rgba(0,0,0,.45);backdrop-filter:saturate(1.4) blur(12px);-webkit-backdrop-filter:saturate(1.4) blur(12px)}

/* Titular de portada: palabra por palabra */
.mx-word{display:inline-block;overflow:hidden;vertical-align:bottom;padding-bottom:.08em;margin-bottom:-.08em}
.mx-word>span{display:inline-block;transform:translateY(105%);animation:mx-up .9s cubic-bezier(.2,.75,.2,1) forwards;animation-delay:calc(var(--i)*70ms + 120ms)}
@keyframes mx-up{to{transform:translateY(0)}}
.mx-hero-fade{opacity:0;transform:translateY(18px);animation:mx-fade .9s cubic-bezier(.2,.75,.2,1) forwards;animation-delay:calc(var(--i)*120ms + 650ms)}
@keyframes mx-fade{to{opacity:1;transform:none}}

/* Imagen de portada: acercamiento lento */
.mx-kenburns{animation:mx-kb 22s ease-in-out infinite alternate;transform-origin:60% 40%;will-change:transform}
@keyframes mx-kb{from{transform:scale(1.02)}to{transform:scale(1.12)}}
.mx-clip{overflow:hidden}

/* Aparición al hacer scroll (solo elementos fuera de la primera pantalla) */
.mx-js .mx-rv{opacity:0;transform:translateY(34px);transition:opacity .9s cubic-bezier(.2,.75,.2,1),transform .9s cubic-bezier(.2,.75,.2,1);transition-delay:calc(var(--d,0)*90ms)}
.mx-js .mx-rv.mx-in{opacity:1;transform:none}
.mx-js .mx-rv-img{clip-path:inset(12% 0 12% 0 round 18px);transition:clip-path 1.2s cubic-bezier(.2,.75,.2,1)}
.mx-js .mx-rv-img.mx-in{clip-path:inset(0 0 0 0 round 18px)}

/* Tarjetas e imágenes: hover */
.mx-card{transition:transform .45s cubic-bezier(.2,.75,.2,1),box-shadow .45s ease}
.mx-card:hover{transform:translateY(-6px);box-shadow:0 26px 50px -28px rgba(0,0,0,.45)}
.mx-card img{transition:transform 1.1s cubic-bezier(.2,.75,.2,1)}
.mx-card:hover img{transform:scale(1.06)}

/* Botones: elevación y brillo */
.mx-btn{position:relative;overflow:hidden;transition:transform .3s cubic-bezier(.2,.75,.2,1),box-shadow .3s ease}
.mx-btn:hover{transform:translateY(-2px);box-shadow:0 12px 26px -14px rgba(0,0,0,.55)}
.mx-btn::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.35) 50%,transparent 70%);transform:translateX(-120%);transition:transform .8s ease}
.mx-btn:hover::after{transform:translateX(120%)}
.mx-btn svg{transition:transform .3s ease}
.mx-btn:hover svg{transform:translateX(4px)}

/* Marquesina */
.mx-marquee{overflow:hidden;white-space:nowrap;border-block:1px solid var(--mx-line,rgba(127,127,127,.25));background:var(--mx-bg,transparent);color:var(--mx-fg,inherit);padding-block:22px}
.mx-track{display:inline-flex;gap:56px;padding-left:56px;animation:mx-scroll var(--mx-speed,38s) linear infinite}
.mx-track span{font-size:clamp(1.25rem,2.4vw,2rem);letter-spacing:.02em;display:inline-flex;align-items:center;gap:56px}
.mx-track span::after{content:"";width:9px;height:9px;border-radius:50%;background:var(--mx-dot,currentColor);opacity:.8}
.mx-marquee:hover .mx-track{animation-play-state:paused}
@keyframes mx-scroll{to{transform:translateX(-50%)}}

/* Barra de progreso de lectura */
.mx-progress{position:fixed;top:0;left:0;height:3px;width:100%;transform-origin:0 50%;transform:scaleX(0);background:var(--mx-accent,#999);z-index:60;pointer-events:none}

@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  .mx-word>span,.mx-hero-fade{transform:none!important;opacity:1!important}
  .mx-js .mx-rv,.mx-js .mx-rv-img{opacity:1!important;transform:none!important;clip-path:none!important}
  .mx-track{transform:none!important}
}