/* ============================================================================
   Kora | Couche d'animations (inspirée de React Bits, réimplémentée en vanilla)
   Spotlight cartes · tilt 3D · texte brillant · CTA magnétique + halo · étincelles.
   Tout est désactivé si l'utilisateur préfère moins d'animations.
   ========================================================================== */

/* --- Spotlight : lueur qui suit le curseur, derrière le texte --- */
.fx-spot{position:relative}
.fx-spot::before{
  content:"";position:absolute;inset:0;border-radius:inherit;z-index:-1;pointer-events:none;
  background:radial-gradient(240px circle at var(--mx,50%) var(--my,50%), rgba(31,169,122,.16), transparent 60%);
  opacity:0;transition:opacity .35s ease}
.fx-spot:hover::before{opacity:1}
.fx-spot.dark::before{background:radial-gradient(260px circle at var(--mx,50%) var(--my,50%), rgba(93,169,255,.28), transparent 60%)}

/* --- Tilt 3D : la perspective est posée par JS, la transition adoucit --- */
.fx-tilt{transition:transform .18s ease;transform-style:preserve-3d;will-change:transform}

/* --- Texte brillant (sheen animé) --- */
.fx-shiny{
  background:linear-gradient(100deg,#1FA97A 0%,#54e0b0 45%,#1FA97A 60%);
  background-size:220% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;
  animation:fx-shine 6.5s linear infinite}
@keyframes fx-shine{to{background-position:-220% 0}}

/* --- CTA : halo tournant (Star Border) + rebond magnétique via JS --- */
.fx-glow{position:relative;z-index:0}
.fx-glow::before{
  content:"";position:absolute;inset:-2.5px;border-radius:inherit;z-index:-1;pointer-events:none;
  background:conic-gradient(from 0deg,#1FA97A,#5DA9FF,#0B3D91,#1FA97A);
  filter:blur(7px);opacity:0;transition:opacity .3s ease;animation:fx-spin 4.5s linear infinite}
.fx-glow:hover::before{opacity:.6}
@keyframes fx-spin{to{transform:rotate(1turn)}}

/* --- Étincelles au clic --- */
.fx-spark{position:fixed;width:7px;height:7px;border-radius:50%;background:#1FA97A;pointer-events:none;z-index:99998;
  will-change:transform,opacity;animation:fx-sparkfly .5s ease-out forwards}
@keyframes fx-sparkfly{from{opacity:1;transform:translate(0,0) scale(1)}to{opacity:0;transform:translate(var(--dx),var(--dy)) scale(.2)}}

/* --- Reveal au scroll (blur-in) : améliore .rv sans le casser --- */
.fx-reveal{opacity:0;transform:translateY(22px);filter:blur(8px);transition:opacity .7s cubic-bezier(.22,.61,.21,1),transform .7s cubic-bezier(.22,.61,.21,1),filter .7s ease}
.fx-reveal.fx-in{opacity:1;transform:none;filter:blur(0)}

@media (prefers-reduced-motion: reduce){
  .fx-shiny{animation:none;color:#1FA97A;-webkit-text-fill-color:#1FA97A}
  .fx-glow::before{animation:none}
  .fx-spot::before{transition:none}
  .fx-tilt{transition:none}
  .fx-reveal{transition:none;opacity:1;transform:none;filter:none}
  .fx-spark{display:none}
}