/* ==========================================================================
   Ghost cursor — curseur fantôme à halo organique (Double Youpi / RML demo)
   Réglages VALIDÉS bakés en defaults (surcharges possibles via opts JS).
   Le module JS (ghost-cursor.js) crée le DOM + injecte les filtres SVG.
   Le curseur se place dans un conteneur `position:relative; overflow:hidden`.
   ========================================================================== */

.ghost-cursor{
  --gc-core: 20px;            /* diamètre du cœur (aplat)        */
  --gc-glow: 96px;            /* diamètre du halo                 */
  --gc-core-color: #ffffff;   /* couleur (aplat) du cœur          */
  --gc-hue: 258;              /* teinte du halo (258 = violet RML)*/
  --gc-sat: 95%;
  --gc-light: 66%;
  --gc-glow-opacity: .24;     /* intensité du halo                */
  --gc-breathe: 3.4s;         /* vitesse de respiration           */

  position:absolute; left:0; top:0; width:0; height:0;
  transform:translate(-200px,-200px);
  z-index:2147483600; pointer-events:none; will-change:transform; /* au-dessus de tout (panneau RML compris) */
}
.ghost-cursor[data-hidden="1"]{ opacity:0; transition:opacity .25s ease; }
.ghost-cursor{ transition:opacity .25s ease; }

/* halo organique principal (turbulence SVG + respiration) */
.ghost-cursor .gc-glow{
  position:absolute; left:0; top:0;
  width:var(--gc-glow); height:var(--gc-glow);
  margin-left:calc(var(--gc-glow) / -2); margin-top:calc(var(--gc-glow) / -2);
  border-radius:50%;
  background:radial-gradient(circle at 50% 50%,
    hsla(var(--gc-hue),var(--gc-sat),var(--gc-light),var(--gc-glow-opacity)) 0%,
    hsla(var(--gc-hue),var(--gc-sat),var(--gc-light),calc(var(--gc-glow-opacity)*.5)) 32%,
    transparent 70%);
  filter:url(#gc-organic) blur(6px);
  mix-blend-mode:screen;
  animation:gc-breathe var(--gc-breathe) ease-in-out infinite;
}
/* halo interne, plus serré, rotation lente -> asymétrie vivante */
.ghost-cursor .gc-glow--2{
  width:calc(var(--gc-glow)*.62); height:calc(var(--gc-glow)*.62);
  margin-left:calc(var(--gc-glow)*-.31); margin-top:calc(var(--gc-glow)*-.31);
  filter:url(#gc-organic2) blur(3px); opacity:.9;
  animation:gc-breathe calc(var(--gc-breathe)*.8) ease-in-out infinite reverse,
            gc-spin 9s linear infinite;
}
/* cœur : aplat de couleur */
.ghost-cursor .gc-core{
  position:absolute; left:0; top:0;
  width:var(--gc-core); height:var(--gc-core);
  margin-left:calc(var(--gc-core) / -2); margin-top:calc(var(--gc-core) / -2);
  border-radius:50%;
  background:var(--gc-core-color);
  box-shadow:0 0 10px color-mix(in srgb, var(--gc-core-color) 65%, transparent),
             inset 0 0 0 1px rgba(255,255,255,.28);
}
/* ripple de clic */
.ghost-cursor .gc-ring{
  position:absolute; left:0; top:0;
  width:var(--gc-core); height:var(--gc-core);
  margin-left:calc(var(--gc-core) / -2); margin-top:calc(var(--gc-core) / -2);
  border-radius:50%; border:2px solid hsla(var(--gc-hue),95%,72%,.9);
  opacity:0; transform:scale(1);
}
.ghost-cursor.is-click .gc-ring{ animation:gc-ripple .55s cubic-bezier(.2,.7,.2,1); }
.ghost-cursor.is-click .gc-core{ animation:gc-press .3s ease; }

@keyframes gc-breathe{ 0%,100%{transform:scale(.9);opacity:.78} 50%{transform:scale(1.12);opacity:1} }
@keyframes gc-spin{ to{transform:rotate(360deg)} }
@keyframes gc-ripple{ 0%{opacity:.8;transform:scale(1)} 100%{opacity:0;transform:scale(5.5)} }
@keyframes gc-press{ 50%{transform:scale(.7)} }

@media (prefers-reduced-motion: reduce){
  .ghost-cursor .gc-glow,.ghost-cursor .gc-glow--2{ animation:none !important; }
}