/* Rock Motion FX: preloader y transiciones entre páginas */

/* ---------- Preloader ---------- */
.rmfx-pl{display:none}
html.rmfx-pl-on,html.rmfx-pl-on body{overflow:hidden!important}
html.rmfx-pl-on .rmfx-pl{--k:1;position:fixed;inset:0;z-index:2147483000;display:flex;align-items:center;justify-content:center;background:var(--pl-bg,#f4f1ec);color:var(--pl-color,#0a0a0a);overflow:hidden;box-sizing:border-box;animation:rmfx-pl-failsafe .6s ease 12s forwards}
@keyframes rmfx-pl-failsafe{to{opacity:0;visibility:hidden;pointer-events:none}}
html.rmfx-pl-on .rmfx-pl.is-done{display:none}
.rmfx-pl--fast{--k:.7}
.rmfx-pl--slow{--k:1.35}
.rmfx-pl--font-serif{font-family:"Didot","Bodoni 72","Bodoni MT","Playfair Display","Cormorant Garamond",Georgia,serif;font-weight:400}
.rmfx-pl--font-sans{font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-weight:600}
.rmfx-pl *{box-sizing:border-box}

/* texto que sube letra por letra */
.rmfx-pl__line{position:relative;z-index:2;display:flex;align-items:center;justify-content:center;white-space:nowrap;font-size:clamp(34px,6vw,104px);line-height:1;letter-spacing:-.01em;transition:opacity .6s,translate .9s cubic-bezier(.76,0,.24,1)}
.rmfx-pl__word{display:inline-flex}
.rmfx-pl__cw{display:inline-block;overflow:hidden;padding:.06em 0 .14em;margin:-.06em 0 -.14em}
.rmfx-pl__ch{display:inline-block;transform:translateY(115%);animation:rmfx-pl-up calc(.75s * var(--k)) cubic-bezier(.16,1,.3,1) forwards;animation-delay:calc((.15s + var(--i) * .045s) * var(--k))}
@keyframes rmfx-pl-up{to{transform:none}}
.rmfx-pl__sp{display:inline-block;width:.3em}
.rmfx-pl__logo{display:block;max-width:min(260px,56vw);max-height:120px;width:auto;height:auto;clip-path:inset(0 0 100% 0);animation:rmfx-pl-logo calc(.9s * var(--k)) cubic-bezier(.76,0,.24,1) calc(.15s * var(--k)) forwards}
.rmfx-pl__logo-text{max-width:none;max-height:none;font-size:clamp(28px,4vw,56px);line-height:1.1;white-space:nowrap;padding:.1em 0}
@keyframes rmfx-pl-logo{to{clip-path:inset(0)}}

/* botón saltar */
.rmfx-pl button.rmfx-pl__skip,.rmfx-pl button.rmfx-pl__skip:is(:hover,:focus,:active){position:absolute;right:clamp(16px,3vw,32px);bottom:clamp(16px,3vw,32px);z-index:5;margin:0;padding:8px 14px;min-width:0;min-height:0;border:1px solid currentColor;border-radius:40px;background:transparent;color:inherit;font:inherit;font-size:12px;letter-spacing:.08em;text-transform:uppercase;line-height:1;opacity:.55;box-shadow:none;cursor:pointer;transition:opacity .3s}
.rmfx-pl button.rmfx-pl__skip:hover{opacity:1}
.rmfx-pl.is-leave .rmfx-pl__skip{opacity:0;pointer-events:none}

/* 1. Revelado con video o imagen */
.rmfx-pl__gap{position:relative;display:inline-block;width:.3em;height:1em;flex:none;animation:rmfx-pl-gap calc(1.1s * var(--k)) cubic-bezier(.76,0,.24,1) forwards;animation-delay:calc((.55s + var(--n) * .045s) * var(--k))}
@keyframes rmfx-pl-gap{to{width:2.3em}}
.rmfx-pl__media{position:absolute;top:0;bottom:0;left:.2em;right:.2em;overflow:hidden;border-radius:.08em;background:var(--pl-accent,#ff4c4c);clip-path:inset(0 50% 0 50%);animation:rmfx-pl-open calc(1.1s * var(--k)) cubic-bezier(.76,0,.24,1) forwards;animation-delay:calc((.55s + var(--n) * .045s) * var(--k))}
@keyframes rmfx-pl-open{to{clip-path:inset(0)}}
.rmfx-pl__media :is(video,img){position:absolute;inset:0;width:100%!important;height:100%!important;max-width:none!important;object-fit:cover;display:block}
.rmfx-pl__media.is-expanding{z-index:3;clip-path:none;transition:left 1s cubic-bezier(.76,0,.24,1),top 1s cubic-bezier(.76,0,.24,1),width 1s cubic-bezier(.76,0,.24,1),height 1s cubic-bezier(.76,0,.24,1),border-radius 1s cubic-bezier(.76,0,.24,1)}
.rmfx-pl--reveal.is-leave .rmfx-pl__line{opacity:0}
.rmfx-pl--reveal.is-fade{opacity:0;transition:opacity .7s ease}

/* 2. Cortina (y salida de contador) */
.rmfx-pl--curtain,.rmfx-pl--counter{overflow:visible!important}
.rmfx-pl--curtain::after,.rmfx-pl--counter::after{content:"";position:absolute;left:-15%;right:-15%;top:calc(100% - 1px);height:14vh;background:inherit;border-radius:0 0 50% 50%;pointer-events:none}
.rmfx-pl--curtain,.rmfx-pl--counter{transition:transform calc(1.05s * var(--k)) cubic-bezier(.76,0,.24,1)}
.rmfx-pl--curtain.is-leave,.rmfx-pl--counter.is-leave{transform:translateY(calc(-100% - 15vh))}
.rmfx-pl--curtain.is-leave .rmfx-pl__line{translate:0 -60px;opacity:0}

/* 3. Contador */
.rmfx-pl__corner{position:absolute;top:clamp(20px,5vw,56px);left:clamp(20px,5vw,56px);display:flex;font-size:clamp(18px,2vw,28px);line-height:1;white-space:nowrap}
.rmfx-pl__corner .rmfx-pl__sp{width:.28em}
.rmfx-pl__count{position:absolute;right:clamp(20px,5vw,56px);bottom:clamp(36px,7vw,90px);display:flex;align-items:flex-start;font-size:clamp(80px,17vw,280px);font-weight:600;line-height:.8;letter-spacing:-.05em;font-variant-numeric:tabular-nums}
.rmfx-pl__count span{font-size:.28em;margin:.08em 0 0 .06em;letter-spacing:0;color:var(--pl-accent,#ff4c4c)}
.rmfx-pl__bar{position:absolute;left:0;right:0;bottom:0;height:3px;background:color-mix(in srgb,currentColor 12%,transparent)}
.rmfx-pl__bar i{display:block;height:100%;width:calc(var(--p,0) * 1%);background:var(--pl-accent,#ff4c4c)}

/* 4. Logo con línea de carga */
.rmfx-pl__brand{display:flex;flex-direction:column;align-items:center;gap:28px;transition:opacity .5s,transform .7s cubic-bezier(.76,0,.24,1)}
.rmfx-pl__track{display:block;width:min(180px,40vw);height:2px;border-radius:2px;background:color-mix(in srgb,currentColor 14%,transparent);overflow:hidden}
.rmfx-pl__track i{display:block;height:100%;width:calc(var(--p,0) * 1%);background:var(--pl-accent,#ff4c4c);transition:width .2s}
.rmfx-pl--logo{transition:opacity .7s ease .25s}
.rmfx-pl--logo.is-leave{opacity:0}
.rmfx-pl--logo.is-leave .rmfx-pl__brand{opacity:0;transform:scale(.94)}

/* 5. Persianas y 6. Pantalla que se abre en dos */
.rmfx-pl--blinds,.rmfx-pl--split{background:transparent!important}
.rmfx-pl__cols{position:absolute;inset:0;display:flex}
.rmfx-pl__cols i{flex:1;background:var(--pl-bg,#f4f1ec);transition:transform calc(.9s * var(--k)) cubic-bezier(.76,0,.24,1);margin-right:-1px}
.rmfx-pl--blinds .rmfx-pl__cols i{transform-origin:top}
.rmfx-pl--blinds.is-leave .rmfx-pl__cols i{transform:scaleY(0)}
.rmfx-pl--blinds.is-leave .rmfx-pl__cols i:nth-child(2){transition-delay:.06s}
.rmfx-pl--blinds.is-leave .rmfx-pl__cols i:nth-child(3){transition-delay:.12s}
.rmfx-pl--blinds.is-leave .rmfx-pl__cols i:nth-child(4){transition-delay:.18s}
.rmfx-pl--blinds.is-leave .rmfx-pl__cols i:nth-child(5){transition-delay:.24s}
.rmfx-pl--split.is-leave .rmfx-pl__cols i:first-child{transform:translateX(-101%)}
.rmfx-pl--split.is-leave .rmfx-pl__cols i:last-child{transform:translateX(101%)}
.rmfx-pl--blinds.is-leave .rmfx-pl__line,.rmfx-pl--split.is-leave .rmfx-pl__line{opacity:0;translate:0 -30px}

/* ---------- Transiciones entre páginas ---------- */
.rmfx-pt{position:fixed;inset:0;z-index:2147482999;display:flex;pointer-events:none;visibility:hidden}
.rmfx-pt i{flex:1;background:var(--pt-color,#0a0a0a);margin-right:-1px}
html.rmfx-pt-leave .rmfx-pt,html.rmfx-pt-enter .rmfx-pt{visibility:visible;pointer-events:auto}
/* entrar: la página nueva empieza tapada */
html.rmfx-pt-enter body{overflow:hidden}
/* fundido */
html.rmfx-pt-leave .rmfx-pt--fade{animation:rmfx-pt-fade-in .45s ease forwards}
html.rmfx-pt-reveal .rmfx-pt--fade{animation:rmfx-pt-fade-out .6s ease forwards}
@keyframes rmfx-pt-fade-in{from{opacity:0}to{opacity:1}}
@keyframes rmfx-pt-fade-out{from{opacity:1}to{opacity:0}}
/* cortina */
html.rmfx-pt-leave .rmfx-pt--curtain i{animation:rmfx-pt-cur-in .6s cubic-bezier(.76,0,.24,1) forwards}
html.rmfx-pt-reveal .rmfx-pt--curtain i{animation:rmfx-pt-cur-out .8s cubic-bezier(.76,0,.24,1) forwards}
@keyframes rmfx-pt-cur-in{from{transform:translateY(100%)}to{transform:none}}
@keyframes rmfx-pt-cur-out{from{transform:none}to{transform:translateY(-100%)}}
/* persianas */
html.rmfx-pt-leave .rmfx-pt--blinds i{transform-origin:bottom;animation:rmfx-pt-bl-in .55s cubic-bezier(.76,0,.24,1) both}
html.rmfx-pt-reveal .rmfx-pt--blinds i{transform-origin:top;animation:rmfx-pt-bl-out .65s cubic-bezier(.76,0,.24,1) both}
.rmfx-pt--blinds i:nth-child(2){animation-delay:.05s!important}
.rmfx-pt--blinds i:nth-child(3){animation-delay:.1s!important}
.rmfx-pt--blinds i:nth-child(4){animation-delay:.15s!important}
.rmfx-pt--blinds i:nth-child(5){animation-delay:.2s!important}
@keyframes rmfx-pt-bl-in{from{transform:scaleY(0)}to{transform:none}}
@keyframes rmfx-pt-bl-out{from{transform:none}to{transform:scaleY(0)}}
/* en dos */
html.rmfx-pt-leave .rmfx-pt--split i:first-child{animation:rmfx-pt-l-in .6s cubic-bezier(.76,0,.24,1) both}
html.rmfx-pt-leave .rmfx-pt--split i:last-child{animation:rmfx-pt-r-in .6s cubic-bezier(.76,0,.24,1) both}
html.rmfx-pt-reveal .rmfx-pt--split i:first-child{animation:rmfx-pt-l-out .8s cubic-bezier(.76,0,.24,1) both}
html.rmfx-pt-reveal .rmfx-pt--split i:last-child{animation:rmfx-pt-r-out .8s cubic-bezier(.76,0,.24,1) both}
@keyframes rmfx-pt-l-in{from{transform:translateX(-101%)}to{transform:none}}
@keyframes rmfx-pt-r-in{from{transform:translateX(101%)}to{transform:none}}
@keyframes rmfx-pt-l-out{from{transform:none}to{transform:translateX(-101%)}}
@keyframes rmfx-pt-r-out{from{transform:none}to{transform:translateX(101%)}}

@media (prefers-reduced-motion:reduce){.rmfx-pl,.rmfx-pt{display:none!important}html.rmfx-pl-on,html.rmfx-pl-on body,html.rmfx-pt-enter body{overflow:auto!important}}
.rmfx-pl--counter button.rmfx-pl__skip,.rmfx-pl--counter button.rmfx-pl__skip:is(:hover,:focus,:active){top:clamp(16px,3vw,32px);bottom:auto}