/* ==========================================================================
   SIANOR — Animations complémentaires
   ========================================================================== */

/* Lettres du titre qui flottent légèrement */
.float-letter{display:inline-block;animation:float-letter 4s ease-in-out infinite;}
@keyframes float-letter{0%,100%{transform:translateY(0);}50%{transform:translateY(-4px);}}

/* Halo au survol des cartes */
.glow-hover{position:relative;}
.glow-hover::after{
  content:'';position:absolute;inset:-1px;border-radius:inherit;
  padding:1px;
  background:linear-gradient(120deg, var(--gold), var(--green), var(--red));
  -webkit-mask:linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;
  opacity:0;transition:opacity .4s var(--ease);
  pointer-events:none;
}
.glow-hover:hover::after{opacity:1;}

/* Compteur */
.count-up{font-variant-numeric:tabular-nums;}

/* Tilt 3D léger pour les cartes */
.tilt{transform-style:preserve-3d;transition:transform .3s var(--ease);}

/* Timeline : trait qui se dessine au scroll (fallback CSS géré via JS pour la hauteur) */
.roadmap-line-fill{will-change:height;}

/* Respiration du logo dans le header */
.brand img{animation:breathe 5s ease-in-out infinite;}
@keyframes breathe{0%,100%{filter:drop-shadow(0 0 0 rgba(249,176,0,0));}50%{filter:drop-shadow(0 0 6px rgba(249,176,0,0.35));}}

/* Rayons de soleil au chargement du hero */
.ray{transform-origin:center;}

/* Apparition douce générique pour éléments injectés en JS */
.fade-in-up{animation:fadeInUp .8s var(--ease) forwards;}
@keyframes fadeInUp{from{opacity:0;transform:translateY(24px);}to{opacity:1;transform:translateY(0);}}

/* Curseur magnétique — classe ajoutée en JS sur les boutons */
.magnetic{transition:transform .25s var(--ease);}