/* Jolgorio — capa de animación compartida (web y panel). © Carlo · Dev */
.progreso{position:fixed;top:0;left:0;height:3px;width:100%;transform-origin:0 50%;transform:scaleX(var(--p,0));background:linear-gradient(90deg,var(--coral),var(--oro),var(--viol));z-index:200;pointer-events:none}
/* brillo que sigue al cursor en tarjetas */
.glow{position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .4s;background:radial-gradient(260px circle at var(--mx,50%) var(--my,50%),rgba(255,255,255,.22),transparent 60%);z-index:3;mix-blend-mode:soft-light}
.pk .glow,.ps .glow,.sol .glow,.kpi .glow,.ev .glow,.faq .glow,.ex .glow,.tp .glow,.op .glow{background:radial-gradient(260px circle at var(--mx,50%) var(--my,50%),rgba(255,90,60,.10),transparent 60%);mix-blend-mode:normal}
*:hover>.glow{opacity:1}
/* inclinación suave del bloque del héroe */
.vis{transform:perspective(1100px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .5s var(--ease)}
.chip{translate:calc(var(--px,0)*14px) calc(var(--py,0)*10px)}
/* llamada a la acción con latido discreto */
.hero .btn:not(.sec):not(.suave),.menu a.btn,.final .btn{animation:latido 3.4s ease-in-out infinite}
@keyframes latido{0%,100%{box-shadow:0 14px 30px -14px var(--coral)}50%{box-shadow:0 14px 34px -8px var(--coral),0 0 0 8px rgba(255,90,60,.12)}}
.btn:hover{filter:brightness(1.06)}
/* subrayado dibujado bajo la palabra destacada de cada título */
h2 em{background:linear-gradient(var(--oro),var(--oro)) 0 92%/0% .22em no-repeat;transition:background-size .9s .35s var(--ease)}
.in h2 em,h2.in em,.cab.in h2 em{background-size:100% .22em}
/* línea de pasos que se dibuja */
.pasos::before{transform-origin:0 50%;transform:scaleX(0);transition:transform 1.4s .2s var(--ease)}
.pasos.in::before{transform:none}
/* extras y tipos: entrada escalonada */
.extras .ex,.tipos .tp{animation:subir .5s var(--ease) both;animation-delay:calc(var(--i,0)*45ms)}
@keyframes subir{from{opacity:0;translate:0 14px}to{opacity:1;translate:0 0}}
.paso-c{animation:entra .5s var(--ease)}
.num output{display:inline-block;transition:transform .2s}
.num output.tic{transform:scale(1.18)}
.ex.on .ck,.tp.on{animation:pop2 .45s var(--ease)}
@keyframes pop2{40%{scale:1.06}}
/* ---------- PANEL (formal: movimiento corto y sobrio) ---------- */
.pn .lead{animation:subir .6s .05s var(--ease) both}
.pn h1{animation:subir .6s var(--ease) both}
.pn-tabs button:hover:not(.on){transform:translateY(-2px);border-color:var(--ink)}
.pn-tabs button i{animation:pop2 .6s var(--ease)}
.pipe i{transform-origin:0 50%;animation:crece .9s var(--ease) both}
@keyframes crece{from{transform:scaleX(0)}}
.sol{animation:subir .45s var(--ease) both;animation-delay:calc(var(--i,0)*55ms)}
.sol:hover{box-shadow:0 18px 34px -24px rgba(23,17,43,.5)}
.ev{animation:subir .5s var(--ease) both;animation-delay:calc(var(--i,0)*80ms)}
.aro .p{animation:aroIn 1.1s .15s var(--ease) both}
@keyframes aroIn{from{stroke-dashoffset:327}}
.kpi{transition:transform .35s var(--ease),box-shadow .3s}
.kpi:hover{transform:translateY(-4px);box-shadow:0 22px 34px -26px rgba(23,17,43,.55)}
.kpi::after{transition:transform .6s var(--ease)}.kpi:hover::after{transform:scale(1.6)}
.chk label{animation:subir .35s var(--ease) both;animation-delay:calc(var(--i,0)*30ms)}
.chk input:checked::after{animation:pop2 .4s var(--ease)}
.cal-big .cal-g button{transition:transform .2s var(--ease),background .2s}.cal-big .cal-g button:hover:not(:disabled){transform:scale(1.08)}
.det{animation:entra .4s var(--ease)}
.est{transition:background .4s,color .4s}
@media(prefers-reduced-motion:reduce){.vis{transform:none}.chip{translate:none}.progreso{display:none}h2 em{background-size:100% .22em}.pasos::before{transform:none}}
@media(hover:none){.glow{display:none}.vis{transform:none}}
