/* Ritualic Extras · banner de suscripción + gato de redes sin saltos */

/* ================= BANNER ================= */
.rxt-sub{position:relative;isolation:isolate;overflow:hidden;margin:clamp(2rem,5vw,4.5rem) var(--pad,clamp(1rem,4vw,3rem));border-radius:clamp(26px,3.4vw,44px);color:var(--silver,#f3ecfb);
  background:radial-gradient(60% 90% at 82% 55%,rgba(139,61,219,.5),transparent 70%),radial-gradient(40% 60% at 8% 12%,rgba(217,164,91,.14),transparent 72%),linear-gradient(160deg,#1b0d2e,#100817 70%);
  box-shadow:0 40px 80px -40px rgba(0,0,0,.8),inset 0 0 0 1px rgba(200,166,245,.2)}
.rxt-sub::after{content:"";position:absolute;inset:0;border-radius:inherit;padding:1.5px;pointer-events:none;z-index:2;
  background:conic-gradient(from var(--rxt-a,0deg),rgba(217,164,91,0),rgba(217,164,91,.95) 12%,rgba(200,166,245,.8) 24%,rgba(139,61,219,0) 40%,rgba(139,61,219,0) 100%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0)}
@property --rxt-a{syntax:"<angle>";inherits:false;initial-value:0deg}
.rxt-sub__bg{position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:hidden}
.rxt-sub__glow{position:absolute;right:-18%;top:-40%;width:90%;aspect-ratio:1;border-radius:50%;background:conic-gradient(from 0deg,rgba(139,61,219,0),rgba(139,61,219,.38),rgba(217,164,91,.22),rgba(139,61,219,0) 70%);-webkit-mask:radial-gradient(closest-side,#000 40%,transparent 100%);mask:radial-gradient(closest-side,#000 40%,transparent 100%)}
.rxt-sub__in{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:clamp(1rem,4vw,4rem);max-width:1240px;margin:0 auto;padding:clamp(2.2rem,5.5vw,4.8rem) clamp(1.4rem,4.5vw,4.2rem)}
.rxt-sub__k{margin:0 0 .9rem;font:700 .74rem/1 var(--sans,system-ui,sans-serif);letter-spacing:.22em;text-transform:uppercase;color:var(--amber,#d9a45b)}
.rxt-sub__t{margin:0 0 1rem;font:800 clamp(2.5rem,5.6vw,4.7rem)/.94 var(--disp,'Big Shoulders Display',Impact,'Arial Narrow',sans-serif);text-transform:uppercase;letter-spacing:.01em;color:var(--silver,#f3ecfb)}
.rxt-sub__t em{display:block;font:italic 400 .86em/1.05 var(--serif,Georgia,serif);text-transform:none;letter-spacing:0;color:var(--lav,#c8a6f5)}
.rxt-sub__p{margin:0 0 1.3rem;max-width:34rem;font:400 clamp(1.02rem,1.35vw,1.2rem)/1.6 var(--sans,system-ui,sans-serif);color:rgba(243,236,251,.86)}
.rxt-sub__chips{display:flex;flex-wrap:wrap;gap:.55rem;margin:0 0 1.7rem;padding:0;list-style:none}
.rxt-sub__chips li{display:inline-flex;align-items:center;gap:.5rem;padding:.5rem .95rem .5rem .75rem;border-radius:99px;font:600 .88rem/1 var(--sans,system-ui,sans-serif);color:#f3ecfb;background:rgba(200,166,245,.1);box-shadow:inset 0 0 0 1px rgba(200,166,245,.28)}
.rxt-sub__chips li::before{content:"";width:.5rem;height:.5rem;border-radius:50%;background:var(--amber,#d9a45b);box-shadow:0 0 10px rgba(217,164,91,.8)}
.rxt-sub__btn{position:relative;overflow:hidden;display:inline-flex;align-items:center;gap:.7rem;min-height:56px;padding:.9rem 1.6rem .9rem 1.8rem;border-radius:99px;font:700 1.05rem/1 var(--sans,system-ui,sans-serif);text-decoration:none;color:#1d0f2e;background:linear-gradient(135deg,#d9a45b,#f4cf8c);box-shadow:0 14px 34px -10px rgba(217,164,91,.6),0 0 0 1px rgba(255,255,255,.25) inset;transition:transform .35s cubic-bezier(.16,1,.3,1),box-shadow .35s}
.rxt-sub__btn svg{transition:transform .35s cubic-bezier(.16,1,.3,1)}
.rxt-sub__btn:hover,.rxt-sub__btn:focus-visible{transform:translateY(-3px);box-shadow:0 20px 40px -10px rgba(217,164,91,.75),0 0 0 1px rgba(255,255,255,.3) inset}
.rxt-sub__btn:hover svg,.rxt-sub__btn:focus-visible svg{transform:translateX(5px)}
.rxt-sub__btn:focus-visible{outline:3px solid #fff;outline-offset:3px}
.rxt-sub__btn::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.55) 50%,transparent 65%);transform:translateX(-120%)}
.rxt-sub__art{position:relative;justify-self:center;width:min(100%,600px);aspect-ratio:560/600}
.rxt-sub__art>*{pointer-events:none}
.rxt-rays{position:absolute;left:4%;top:-4%;width:92%;aspect-ratio:1;border-radius:50%;background:repeating-conic-gradient(from 0deg,rgba(240,201,135,.0) 0 9deg,rgba(240,201,135,.13) 9deg 14deg);-webkit-mask:radial-gradient(closest-side,#000 15%,transparent 78%);mask:radial-gradient(closest-side,#000 15%,transparent 78%)}
.rxt-back,.rxt-chest{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.rxt-tw{fill:#d9a45b}.rxt-tw.l{fill:#c8a6f5}
/* el gato: capas WebP separadas, cada una con su movimiento. Las imágenes se piden cuando el banner está cerca de la pantalla. */
.rxt-cat{position:absolute;left:12%;top:3%;width:76%;aspect-ratio:477/512;transform-origin:50% 94%}
.rxt-head{position:absolute;inset:0;display:block;transform-origin:48.7% 52%}
.rxt-l{position:absolute;display:block;background:center/100% 100% no-repeat;will-change:transform}
.rxt-cat.is-load .rxt-l{background-image:var(--u)}
.rxt-eyes{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.rxt-l--body{left:9.329%;top:41.699%;width:70.964%;height:52.930%;transform-origin:57.16% -23.43%}
.rxt-l--tail{left:68.658%;top:52.734%;width:28.931%;height:36.816%;transform-origin:36.59% 92.31%}
.rxt-l--earL{left:29.036%;top:2.637%;width:23.270%;height:25.098%;transform-origin:46.40% 81.32%}
.rxt-l--earR{left:60.482%;top:6.348%;width:19.706%;height:27.246%;transform-origin:52.66% 84.23%}
.rxt-l--armL{left:9.329%;top:31.738%;width:32.180%;height:30.762%;transform-origin:83.06% 79.68%}
.rxt-l--armR{left:57.966%;top:32.910%;width:28.512%;height:29.980%;transform-origin:21.69% 80.46%}
.rxt-l--head{left:21.593%;top:6.348%;width:60.168%;height:47.852%;transform-origin:44.95% 95.31%}
.rxt-l--pend{left:41.719%;top:50.684%;width:9.015%;height:9.082%;transform-origin:53.49% -7.53%}
.rxt-l--tongue{left:44.340%;top:38.184%;width:5.870%;height:4.980%;transform-origin:50% 0%}
.rxt-l--tongue{transform-origin:50% 0}
.rxt-hl{transform-box:fill-box;transform-origin:center}
.rxt-lid{transform-box:fill-box;transform-origin:50% 0;transform:scaleY(0)}
.rxt-lash{opacity:0}
.rxt-flame{position:absolute;width:calc(5% * var(--s,1));aspect-ratio:24/40;transform-origin:50% 100%;filter:drop-shadow(0 0 8px rgba(255,190,80,.9))}
.rxt-flame svg{display:block;width:100%;height:100%}
.rxt-lockglow{position:absolute;left:37.1%;top:70%;width:17.9%;aspect-ratio:1;border-radius:50%;background:radial-gradient(closest-side,rgba(255,217,138,.75),rgba(240,201,135,.25) 55%,transparent 75%);opacity:.55}
.rxt-fc{position:absolute;top:58%;width:7%;aspect-ratio:40/64;opacity:0}
.rxt-fc svg{display:block;width:100%;height:100%;filter:drop-shadow(0 0 6px rgba(240,201,135,.7))}
.rxt-dust{position:absolute;top:60%;width:6px;height:6px;border-radius:50%;background:#f0c987;box-shadow:0 0 8px #f0c987;opacity:0}
.rxt-dust.d0{left:30%}.rxt-dust.d1{left:36%;width:4px;height:4px}.rxt-dust.d2{left:42%}.rxt-dust.d3{left:47%;width:4px;height:4px;background:#c8a6f5;box-shadow:0 0 8px #c8a6f5}.rxt-dust.d4{left:53%}.rxt-dust.d5{left:58%;width:4px;height:4px}.rxt-dust.d6{left:63%;background:#c8a6f5;box-shadow:0 0 8px #c8a6f5}.rxt-dust.d7{left:69%;width:4px;height:4px}.rxt-dust.d8{left:25%;background:#c8a6f5;box-shadow:0 0 8px #c8a6f5}
.rxt-seal{position:absolute;left:-3%;top:4%;width:22%;aspect-ratio:1;transform-origin:50% 50%;filter:drop-shadow(0 8px 14px rgba(0,0,0,.55))}
.rxt-seal svg{display:block;width:100%;height:100%;overflow:visible}
.rxt-seal__ring{transform-box:fill-box;transform-origin:center}

/* ================= MOVIMIENTO =================
   La clase .js solo existe si no pides «reducir movimiento». Todo se mueve con transform/opacity: nada cambia de tamaño en la página. */
.js .rxt-sub::after{animation:rxtBorder 7s linear infinite}
@keyframes rxtBorder{to{--rxt-a:360deg}}
.js .rxt-sub__glow{animation:rxtSpin 48s linear infinite}
@keyframes rxtSpin{to{transform:rotate(360deg)}}
.js .rxt-rays{animation:rxtSpin 70s linear infinite}
.js .rxt-moon{transform-box:fill-box;transform-origin:center;animation:rxtMoon 9s ease-in-out infinite alternate}
@keyframes rxtMoon{from{transform:translateY(-4px) rotate(-5deg)}to{transform:translateY(6px) rotate(4deg)}}
.js .rxt-tw{transform-box:fill-box;transform-origin:center;animation:rxtTw 3.2s ease-in-out infinite}
@keyframes rxtTw{0%,100%{transform:scale(.35) rotate(0);opacity:.35}50%{transform:scale(1.15) rotate(30deg);opacity:1}}
/* gato */
.js .rxt-cat{animation:rxtBreath 4.6s ease-in-out infinite}
@keyframes rxtBreath{0%,100%{transform:scale(1,1)}50%{transform:scale(1.006,1.014)}}
.js .rxt-head{animation:rxtHead 8s ease-in-out infinite}
@keyframes rxtHead{0%,100%{transform:rotate(-1.6deg) translateY(0)}18%{transform:rotate(1.2deg) translateY(-.4%)}36%{transform:rotate(3deg) translateY(-.2%)}50%{transform:rotate(3deg) translateY(-.2%)}64%{transform:rotate(-4.6deg) translateY(-.5%)}78%{transform:rotate(-4.6deg) translateY(-.5%)}}
.js .rxt-l--earL{animation:rxtEarL 6.1s ease-in-out infinite}
@keyframes rxtEarL{0%,66%,100%{transform:rotate(0)}69%{transform:rotate(-9deg)}72%{transform:rotate(5deg)}75%{transform:rotate(-6deg)}79%{transform:rotate(0)}}
.js .rxt-l--earR{animation:rxtEarR 8.4s ease-in-out infinite 1.3s}
@keyframes rxtEarR{0%,55%,100%{transform:rotate(0)}58%{transform:rotate(9deg)}62%{transform:rotate(-4deg)}66%{transform:rotate(0)}}
.js .rxt-l--armL{animation:rxtArmL 5.4s ease-in-out infinite}
@keyframes rxtArmL{0%,52%,100%{transform:rotate(0)}56%{transform:rotate(-11deg)}62%{transform:rotate(7deg)}68%{transform:rotate(-10deg)}74%{transform:rotate(5deg)}80%{transform:rotate(0)}}
.js .rxt-l--armR{animation:rxtArmR 5.4s ease-in-out infinite .7s}
@keyframes rxtArmR{0%,52%,100%{transform:rotate(0)}56%{transform:rotate(11deg)}62%{transform:rotate(-7deg)}68%{transform:rotate(10deg)}74%{transform:rotate(-5deg)}80%{transform:rotate(0)}}
.js .rxt-l--tail{animation:rxtTail 3.6s ease-in-out infinite alternate}
@keyframes rxtTail{from{transform:rotate(-4deg)}to{transform:rotate(6deg)}}
.js .rxt-l--pend{animation:rxtPend 2.4s ease-in-out infinite alternate}
@keyframes rxtPend{from{transform:rotate(-11deg)}to{transform:rotate(11deg)}}
.js .rxt-l--tongue{animation:rxtTongue 3.4s ease-in-out infinite}
@keyframes rxtTongue{0%,58%,100%{transform:scale(1,1)}70%{transform:scale(1.05,1.28) translateY(2%)}84%{transform:scale(1,1.06)}}
.js .rxt-lid{animation:rxtBlink 5.2s infinite}
@keyframes rxtBlink{0%,92%,100%{transform:scaleY(0)}95.5%{transform:scaleY(1)}}
.js .rxt-lash{animation:rxtLash 5.2s infinite}
@keyframes rxtLash{0%,92%,100%{opacity:0}94.5%,97%{opacity:1}}
.js .rxt-hl{animation:rxtHl 2.8s ease-in-out infinite}.js .rxt-hl.d1{animation-delay:-.9s}.js .rxt-hl.d2{animation-delay:-1.8s}
@keyframes rxtHl{0%,100%{transform:scale(.6) rotate(0);opacity:.7}50%{transform:scale(1.25) rotate(20deg);opacity:1}}
/* cofre, llamas, cartas, polvo y sello */
.js .rxt-flame{animation:rxtFlame 1.1s ease-in-out infinite alternate}
@keyframes rxtFlame{from{transform:scale(1,.9) rotate(-3deg)}to{transform:scale(1.05,1.12) rotate(3deg)}}
.js .rxt-lockglow{animation:rxtLock 3.2s ease-in-out infinite}
@keyframes rxtLock{0%,100%{opacity:.35;transform:scale(.85)}50%{opacity:.95;transform:scale(1.15)}}
.js .rxt-fc{animation:rxtFc 6.4s ease-in infinite}
@keyframes rxtFc{0%{opacity:0;transform:translate(0,10%) rotate(-10deg) scale(.7)}14%{opacity:1}100%{opacity:0;transform:translate(var(--dx,40%),-330%) rotate(24deg) scale(1.05)}}
.js .rxt-fc.a{--dx:-260%}.js .rxt-fc.b{--dx:260%}
.js .rxt-dust{animation:rxtDust 5s ease-out infinite}
.js .rxt-dust.d1{animation-delay:-.6s}.js .rxt-dust.d2{animation-delay:-1.2s}.js .rxt-dust.d3{animation-delay:-1.8s}.js .rxt-dust.d4{animation-delay:-2.4s}.js .rxt-dust.d5{animation-delay:-3s}.js .rxt-dust.d6{animation-delay:-3.6s}.js .rxt-dust.d7{animation-delay:-4.2s}.js .rxt-dust.d8{animation-delay:-4.8s}
@keyframes rxtDust{0%{opacity:0;transform:translate(0,0) scale(.4)}20%{opacity:1}100%{opacity:0;transform:translate(var(--sx,18px),-260px) scale(1)}}
.js .rxt-dust.d0,.js .rxt-dust.d2,.js .rxt-dust.d4,.js .rxt-dust.d6{--sx:-22px}
.js .rxt-seal{animation:rxtSeal 4.6s ease-in-out infinite}
@keyframes rxtSeal{0%,100%{transform:rotate(-7deg) scale(1)}50%{transform:rotate(5deg) scale(1.05)}}
.js .rxt-seal__ring{animation:rxtSpin 24s linear infinite}
.js .rxt-sub__btn::after{animation:rxtShine 4.2s ease-in-out 1.2s infinite}
@keyframes rxtShine{0%,55%{transform:translateX(-120%)}85%,100%{transform:translateX(120%)}}
/* al pasar el ratón por el banner el gato anima más las patitas y las llamas se avivan */
.js .rxt-sub:hover .rxt-l--armL{animation:rxtCheerL 1.1s ease-in-out infinite}
.js .rxt-sub:hover .rxt-l--armR{animation:rxtCheerR 1.1s ease-in-out infinite .15s}
@keyframes rxtCheerL{0%,100%{transform:rotate(-9deg)}50%{transform:rotate(7deg)}}
@keyframes rxtCheerR{0%,100%{transform:rotate(9deg)}50%{transform:rotate(-7deg)}}
.js .rxt-sub:hover .rxt-flame{animation-duration:.5s}
.js .rxt-sub:hover .rxt-lockglow{animation-duration:1.2s}
/* entrada al llegar con el scroll */
.js .rxt-sub:not(.is-in) .rxt-sub__k,.js .rxt-sub:not(.is-in) .rxt-sub__t,.js .rxt-sub:not(.is-in) .rxt-sub__p,.js .rxt-sub:not(.is-in) .rxt-sub__chips li,.js .rxt-sub:not(.is-in) .rxt-sub__btn{opacity:0;transform:translateY(22px)}
.js .rxt-sub:not(.is-in) .rxt-sub__art{opacity:0;transform:translateY(34px) scale(.94)}
.js .rxt-sub .rxt-sub__k,.js .rxt-sub .rxt-sub__t,.js .rxt-sub .rxt-sub__p,.js .rxt-sub .rxt-sub__chips li,.js .rxt-sub .rxt-sub__art{transition:opacity .8s ease,transform 1s cubic-bezier(.16,1,.3,1)}
.js .rxt-sub__k{transition-delay:.05s!important}.js .rxt-sub__t{transition-delay:.15s!important}.js .rxt-sub__p{transition-delay:.3s!important}.js .rxt-sub__chips li:nth-child(1){transition-delay:.42s!important}.js .rxt-sub__chips li:nth-child(2){transition-delay:.5s!important}.js .rxt-sub__chips li:nth-child(3){transition-delay:.58s!important}.js .rxt-sub__art{transition-delay:.2s!important}
.js .rxt-sub .rxt-sub__btn{transition:opacity .8s ease .66s,transform .35s cubic-bezier(.16,1,.3,1),box-shadow .35s}
@media (max-width:860px){
  .rxt-sub__in{grid-template-columns:1fr}
  .rxt-sub__art{order:-1;width:min(88%,380px);margin-bottom:-.2rem}
  .rxt-sub__p{max-width:none}
}
@media (prefers-reduced-motion:reduce){.rxt-sub *,.rxt-sub::after{animation:none!important;transition:none!important}}

/* ================= BANNER · estilo editorial (a sangre, con el mismo idioma que el resto de la web) ================= */
.rxt-sub.rxt-sub--ed{margin:0;border-radius:0;background:none;box-shadow:none;overflow:hidden;padding:clamp(4.5rem,9vw,8rem) var(--pad,clamp(1.25rem,4.5vw,4.5rem));border-top:1px dashed rgba(200,166,245,.26);color:var(--silver,#e6dff0)}
.rxt-sub--ed::after{display:none}
.rxt-sub--ed .rxt-sub__bg::before{content:"";position:absolute;right:-14%;top:-12%;width:88%;aspect-ratio:1;border-radius:50%;background:radial-gradient(closest-side,rgba(139,61,219,.52),rgba(139,61,219,.17) 55%,transparent 75%)}
.rxt-sub--ed .rxt-sub__bg::after{content:"";position:absolute;left:-12%;bottom:-34%;width:62%;aspect-ratio:1;border-radius:50%;background:radial-gradient(closest-side,rgba(217,164,91,.14),transparent 70%)}
.rxt-sub--ed .rxt-sub__glow{opacity:.5}
.rxt-sub--ed .rxt-sub__in{padding:0;max-width:1480px;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:clamp(1.5rem,4vw,5rem)}
.rxt-sub--ed .rxt-sub__k{display:flex;align-items:center;gap:.9rem;margin:0 0 1.5rem;font:700 .8rem/1 var(--sans,system-ui,sans-serif);letter-spacing:.26em;text-transform:uppercase;color:var(--lav,#c8a6f5);opacity:1}
.rxt-sub--ed .rxt-sub__k::before{content:"";flex:none;width:2.6rem;height:1px;background:var(--amber,#d9a45b)}
.rxt-sub--ed .rxt-sub__t{--fs:clamp(4.4rem,11.6vw,13rem);margin:0 0 .3em;font:700 var(--fs)/.82 var(--disp,"Big Shoulders",Impact,sans-serif);text-transform:uppercase;letter-spacing:-.01em;color:var(--silver,#e6dff0)}
.rxt-sub--ed .rxt-sub__t em{display:block;margin-top:.2em;font:italic 400 .46em/1.05 var(--serif,Georgia,serif);text-transform:none;letter-spacing:0;color:var(--lav,#c8a6f5)}
.rxt-sub--ed .rxt-sub__p{max-width:30ch;margin:0;font:italic 400 clamp(1.3rem,2vw,1.85rem)/1.28 var(--serif,Georgia,serif);color:var(--silver,#e6dff0)}
.rxt-sub--ed .rxt-sub__list{list-style:none;max-width:34rem;margin:clamp(1.6rem,3vw,2.4rem) 0;padding:0}
.rxt-sub--ed .rxt-sub__list li{display:flex;align-items:baseline;gap:1.3rem;padding:.95rem 0;border-top:1px solid rgba(200,166,245,.24);font:700 1.05rem/1.3 var(--sans,system-ui,sans-serif);color:var(--silver,#e6dff0)}
.rxt-sub--ed .rxt-sub__list li:last-child{border-bottom:1px solid rgba(200,166,245,.24)}
.rxt-sub--ed .rxt-sub__list b{flex:none;font:700 .78rem/1 var(--sans,system-ui,sans-serif);letter-spacing:.22em;color:var(--amber,#d9a45b)}
.rxt-sub--ed .rxt-sub__art{width:min(100%,660px);justify-self:end;margin:0}
.js .rxt-sub--ed:not(.is-in) .rxt-sub__list li,.js .rxt-sub--ed:not(.is-in) .rxt-sub__cta{opacity:0;transform:translateY(22px)}
.js .rxt-sub--ed .rxt-sub__list li,.js .rxt-sub--ed .rxt-sub__cta{transition:opacity .8s ease,transform 1s cubic-bezier(.16,1,.3,1)}
.rxt-sub--ed .rxt-sub__list li:nth-child(2){transition-delay:.12s!important}.rxt-sub--ed .rxt-sub__list li:nth-child(3){transition-delay:.24s!important}.rxt-sub--ed .rxt-sub__cta{transition-delay:.4s!important}
@media (max-width:880px){
 .rxt-sub.rxt-sub--ed{padding-top:clamp(3.5rem,12vw,5rem);padding-bottom:clamp(3.5rem,12vw,5rem)}
 .rxt-sub--ed .rxt-sub__in{grid-template-columns:minmax(0,1fr);gap:1rem}
 .rxt-sub--ed .rxt-sub__t{--fs:clamp(4.6rem,24vw,9rem)}
 .rxt-sub--ed .rxt-sub__art{order:-1;justify-self:center;width:min(88%,400px);margin:0 0 .4rem}
 .rxt-sub--ed .rxt-sub__p{max-width:none}
}