/* 13/10 : petites lumières décoratives, dans l'esprit de la section « Ambition ».
   Classes posées par vision-motion.js. Survol : souris uniquement. Rien ne bouge avec « Limiter les animations »
   ou la préférence système de mouvements réduits. */

/* Icône ou numéro qui s'allume au survol de sa case. */
@media(hover:hover) and (pointer:fine){
  .light-card:hover .light-node{animation:light-node 1.9s ease-in-out infinite}
  /* Trait lumineux qui parcourt le haut de l'étape survolée (Tarifs, mise en place). */
  .pricing-setup-steps li:hover::before{animation:light-line 1.9s ease-in-out infinite}
  /* Étincelle de l'encart « 2 semaines offertes ». */
  .trial-banner:hover .icon{animation:light-spark 1.6s ease-in-out infinite}
}
@keyframes light-node{
  0%,100%{box-shadow:none;scale:1}
  45%{box-shadow:inset 0 0 0 1px #a9caff,inset 0 0 18px #8fbcffa6,0 0 0 5px #8db8ff2e,0 8px 22px #4f7fe64d;scale:1.07}
}
.pricing-setup-steps li{position:relative}
.pricing-setup-steps li::before{content:'';position:absolute;left:0;right:0;top:-1px;height:2px;background:linear-gradient(90deg,#8fc3ff,#5f8fef);box-shadow:0 0 6px #8fb6ff66;transform:scaleX(0);transform-origin:left;opacity:0;pointer-events:none}
@keyframes light-line{0%{transform:scaleX(0);opacity:0}12%{opacity:.9}55%{transform:scaleX(1);opacity:.9}100%{transform:scaleX(1);opacity:0}}
.trial-banner .icon{transform-origin:center}
@keyframes light-spark{0%,100%{scale:1;rotate:0deg;filter:none}45%{scale:1.28;rotate:45deg;filter:drop-shadow(0 0 4px #35b98a99)}75%{scale:.95;rotate:90deg;filter:none}}

/* Trois points lumineux, à 120° les uns des autres, qui tournent sur les anneaux décoratifs. */
.light-orbit::after{
  --dot:#d7e6ff;--glow:#8fb6ffa6;--dx:calc(var(--ring-r,140px) * .866);--dy:calc(var(--ring-r,140px) * 1.5);
  content:'';position:absolute;top:-3px;left:calc(50% - 3px);width:6px;height:6px;border-radius:50%;background:var(--dot);opacity:.9;pointer-events:none;
  box-shadow:0 0 10px 3px var(--glow),
    var(--dx) var(--dy) 0 0 var(--dot),var(--dx) var(--dy) 10px 3px var(--glow),
    calc(var(--dx) * -1) var(--dy) 0 0 var(--dot),calc(var(--dx) * -1) var(--dy) 10px 3px var(--glow)}
.light-orbit{animation:light-orbit 30s linear infinite;animation-play-state:paused}
.light-orbit.lights-on{animation-play-state:running}
@keyframes light-orbit{to{rotate:360deg}}
.about-brand-orbit{position:absolute;z-index:-1;border-radius:50%;pointer-events:none}
.about-brand-orbit::after{--dot:#7fa8f5;--glow:#6f9cff59}

/* Contour lumineux qui fait le tour de l'offre Sérénité.
   17/10 : la lumière est un grand disque en dégradé conique qui tourne (transform), visible seulement
   sur un anneau de 2 px. La carte graphique le fait tourner sans redessiner la page (l'ancienne
   version animait le dégradé lui-même et redessinait la carte à chaque image). */
.serenity-border{position:absolute;inset:0;z-index:3;border-radius:inherit;padding:2px;pointer-events:none;overflow:hidden;
  -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)}
.serenity-border>span{position:absolute;left:50%;top:50%;width:1600px;height:1600px;margin:-800px 0 0 -800px;border-radius:50%;
  background:conic-gradient(#7fb0ff26 0 50%,#8dbaffd9 66%,#ffffff 78%,#8dbaffd9 88%,#7fb0ff26 100%);
  animation:serenity-border 6s linear infinite;will-change:transform}
@keyframes serenity-border{to{transform:rotate(360deg)}}
.plan-card-featured{box-shadow:0 16px 37px #234a9229,0 0 0 1px #9cc4ff40,0 0 16px #9cc4ff4d}

/* Ambition (À propos) : plus d'anneau, des mini étoiles filantes (créées par vision-motion.js) traversent la section. */
.about-vision-panel .about-vision-ring{display:none}
.shooting-star{position:absolute;left:0;top:0;z-index:-1;width:84px;height:1.5px;border-radius:2px;pointer-events:none;transform-origin:100% 50%;
  background:linear-gradient(90deg,#ffffff00,#b9d3ff80 70%,#ffffff);opacity:0}
.shooting-star::after{content:'';position:absolute;right:-2px;top:50%;width:4px;height:4px;margin-top:-2px;border-radius:50%;background:#fff;box-shadow:0 0 6px 2px #a9c8ffb3}

@media(prefers-reduced-motion:reduce){.light-node,.light-orbit,.trial-banner .icon,.pricing-setup-steps li::before,.serenity-border>span{animation:none!important}.light-orbit::after,.shooting-star{display:none}}
.motion-reduced .light-node,.motion-reduced .light-orbit,.motion-reduced .trial-banner .icon,.motion-reduced .pricing-setup-steps li::before,.motion-reduced .serenity-border>span{animation:none!important}
.motion-reduced .light-orbit::after,.motion-reduced .shooting-star{display:none}

/* 17/10 : le point bleu des petits titres pulse par un halo qui grandit (transform/opacity),
   au lieu d'animer son ombre, qui redessinait la zone en continu. Même rendu, sans redessin. */
.eyebrow-dot{position:relative;animation:none}
.eyebrow-dot::after{content:"";position:absolute;inset:-4px;border-radius:50%;background:#3177f414;animation:eyebrow-halo 3.5s ease-in-out infinite;will-change:transform}
@keyframes eyebrow-halo{0%,100%{transform:scale(1);opacity:0}50%{transform:scale(1.4);opacity:1}}
@media(prefers-reduced-motion:reduce){.eyebrow-dot::after{animation:none;opacity:0}}
.motion-reduced .eyebrow-dot::after{animation:none;opacity:0}
