/* ==========================================================
   EFECTOS transversales (los mismos que usa aiapply): ping, pulse, pop, nudge,
   swipe, glow, floatUp, shine, fadeInScale, texto degradado animado, botón degradado, puntos de escritura
   ========================================================== */
@keyframes fx-ping{75%,100%{transform:scale(2.4); opacity:0}}
@keyframes fx-pulse{50%{opacity:.45}}
@keyframes fx-pop{0%{transform:scale(.6); opacity:0}70%{transform:scale(1.08); opacity:1}100%{transform:scale(1); opacity:1}}
@keyframes fx-nudge{0%,100%{transform:translateX(0)}25%{transform:translateX(-3px)}75%{transform:translateX(3px)}}
@keyframes fx-swipe-left{to{opacity:0; transform:translateX(-120%) rotate(-8deg)}}
@keyframes fx-swipe-right{to{opacity:0; transform:translateX(120%) rotate(8deg)}}
@keyframes fx-swipe-up{to{opacity:0; transform:translateY(-80%) scale(.95)}}
@keyframes fx-in-right{from{opacity:0; transform:translateX(40px)}to{opacity:1; transform:none}}
@keyframes fx-in-left{from{opacity:0; transform:translateX(-40px)}to{opacity:1; transform:none}}
@keyframes fx-glow{0%{box-shadow:0 0 5px -5px rgba(31,160,110,.9)}100%{box-shadow:0 0 22px -4px rgba(31,160,110,.9)}}
@keyframes fx-float-up{0%{opacity:1; transform:translateY(0)}100%{opacity:0; transform:translateY(-70px)}}
@keyframes fx-float-up-bounce{0%{transform:translateY(0); opacity:1}70%{transform:translateY(-58px); opacity:1}100%{transform:translateY(-50px); opacity:0}}
@keyframes fx-shine{0%{transform:translateX(-120%) skewX(-18deg)}100%{transform:translateX(220%) skewX(-18deg)}}
@keyframes fx-fade-scale{0%{opacity:0; transform:scale(1.12)}100%{opacity:1; transform:scale(1)}}
@keyframes fx-textclip{to{background-position:200% center}}
@keyframes fx-gradient{0%{background-position:0% center}50%{background-position:100% center}100%{background-position:0% center}}
@keyframes fx-dot1{0%{transform:scale(0)}100%{transform:scale(1)}}
@keyframes fx-dot2{0%{transform:translateX(0)}100%{transform:translateX(14px)}}
@keyframes fx-dot3{0%{transform:scale(1)}100%{transform:scale(0)}}
@keyframes fx-up{from{opacity:0; transform:translateY(10px)}to{opacity:1; transform:none}}

.fx-pop{animation:fx-pop .22s cubic-bezier(.34,1.56,.64,1) both}
.fx-nudge{animation:fx-nudge .6s ease-in-out 2}
.fx-glow{animation:fx-glow 1.4s ease-in-out infinite alternate}
.fx-fade-scale{animation:fx-fade-scale .4s ease-out both}
.fx-up{animation:fx-up .45s cubic-bezier(.23,1,.32,1) both}
.fx-swipe-left{animation:fx-swipe-left .28s ease forwards}
.fx-swipe-right{animation:fx-swipe-right .28s ease forwards}
.fx-swipe-up{animation:fx-swipe-up .28s ease forwards}
.fx-in-right{animation:fx-in-right .34s cubic-bezier(.23,1,.32,1) both}
.fx-in-left{animation:fx-in-left .34s cubic-bezier(.23,1,.32,1) both}

/* texto con degradado que se mueve (títulos) */
.fx-textclip,.landing.v2 .grad,.pn-hero h2 em{background-image:linear-gradient(90deg,#05664a 0%,#1fa06e 30%,#3a7bff 55%,#1fa06e 80%,#05664a 100%); background-size:200% auto; -webkit-background-clip:text; background-clip:text; color:transparent; animation:fx-textclip 3.5s linear infinite}

/* botones principales: degradado vivo + brillo que barre al pasar el ratón */
.fx-btn,.pn-btn.solido,.bb-btn,.landing.v2 .lp-solid,.ob-continuar,.sim-btn:not(.gris):not(.mic),#app-main .btn-primary{position:relative; overflow:hidden; background-image:linear-gradient(120deg,#0b7a58,#05664a,#158f66,#05664a); background-size:220% auto; animation:fx-gradient 4s ease infinite}
.fx-btn::after,.pn-btn.solido::after,.bb-btn::after,.landing.v2 .lp-solid::after,.ob-continuar::after,.sim-btn:not(.gris):not(.mic)::after,#app-main .btn-primary::after{content:""; position:absolute; top:0; bottom:0; left:0; width:45%; background:linear-gradient(90deg,transparent,rgba(255,255,255,.35),transparent); transform:translateX(-120%) skewX(-18deg); pointer-events:none}
.fx-btn:hover::after,.pn-btn.solido:hover::after,.bb-btn:hover::after,.landing.v2 .lp-solid:hover::after,.ob-continuar:not(:disabled):hover::after,.sim-btn:hover::after,#app-main .btn-primary:hover::after{animation:fx-shine .7s ease}
.ob-continuar:disabled{animation:none; background-image:none}
/* brillo automático cada pocos segundos en la llamada principal */
.fx-shine-auto::after{animation:fx-shine 1s ease 1.2s infinite; animation-delay:0s}
.fx-shine-auto::after{animation:fx-shine-loop 5s ease infinite}
@keyframes fx-shine-loop{0%{transform:translateX(-120%) skewX(-18deg)}18%{transform:translateX(220%) skewX(-18deg)}100%{transform:translateX(220%) skewX(-18deg)}}

/* etiquetas que "saltan" al aparecer */
.job-directa,.pn-pill-estado,.pn-estado,.ob-tag,.landing.v2 .lp-badge,.lp-bc-score,.cvlab-tag,.live-tabs button.on,.pn-cuenta{animation:fx-pop .28s cubic-bezier(.34,1.56,.64,1) both}
/* filas que entran escalonadas */
.app .job-card{animation:fx-up .45s cubic-bezier(.23,1,.32,1) both; animation-delay:calc(var(--i, 0) * 45ms)}
.pn-kpi,.pn-card,.pn-hero{animation:fx-up .5s cubic-bezier(.23,1,.32,1) both}
.pn-kpi:nth-child(2){animation-delay:.06s}.pn-kpi:nth-child(3){animation-delay:.12s}.pn-kpi:nth-child(4){animation-delay:.18s}
/* números que suben */
.pn-kpi b,.pn-feed-cont b,#pn-feed-n{font-variant-numeric:tabular-nums}
/* "+1" que flota */
.fx-mas-uno{position:absolute; right:14px; top:-6px; font-size:14px; font-weight:800; color:var(--ap-acento, #05664a); pointer-events:none; animation:fx-float-up-bounce .8s cubic-bezier(.175,.885,.32,1.275) forwards}
.pn-feed-cont{position:relative}
/* puntos de "escribiendo" */
.fx-ellipsis{display:inline-flex; align-items:center; gap:4px; height:12px}
.fx-ellipsis i{width:6px; height:6px; border-radius:50%; background:currentColor; display:inline-block}
.fx-ellipsis i:nth-child(1){animation:fx-dot1 .6s infinite}.fx-ellipsis i:nth-child(2){animation:fx-dot2 .6s infinite}.fx-ellipsis i:nth-child(3){animation:fx-dot3 .6s infinite}
/* puntos latiendo */
.live-punto.on::before,.sim-rec::after{content:""}
.fx-ping{position:relative}
.fx-ping::before{content:""; position:absolute; inset:0; border-radius:50%; background:inherit; opacity:.6; animation:fx-ping 1.2s cubic-bezier(0,0,.2,1) infinite}
/* llamada principal con halo */
.pn-btn.solido.grande,.landing.v2 .lp-hero .lp-solid{animation:fx-gradient 4s ease infinite, fx-glow 1.6s ease-in-out infinite alternate}
/* selección de opción en el cuestionario */
.ob-op.sel,.ob-cardop.sel{animation:fx-pop .25s cubic-bezier(.34,1.56,.64,1)}
/* tarjeta del cuestionario: entra desde la derecha, sale a la izquierda */
.ob-in{animation:fx-in-right .36s cubic-bezier(.23,1,.32,1) both}
.ob-in-atras{animation:fx-in-left .36s cubic-bezier(.23,1,.32,1) both}
.ob-card.saliendo-izq{animation:fx-swipe-left .26s ease forwards}
.ob-card.saliendo-der{animation:fx-swipe-right .26s ease forwards}
/* ilustraciones que aparecen con zoom */
.ob-ilu,.ob-gen-anillo,.sim-anillo,.cvlab-ico{animation:fx-fade-scale .5s ease-out both}
.ob-ilu{animation:fx-fade-scale .5s ease-out both, ob-flota 4s ease-in-out .5s infinite}
@media (prefers-reduced-motion:reduce){*{animation-duration:.001s !important; animation-iteration-count:1 !important}}
