/* ═══════════════════════════════════════════════════════
   YSYSTEMS — animations.css
   États initiaux + classes utilitaires GSAP
   ═══════════════════════════════════════════════════════ */

/* États initiaux — affichés seulement quand JS est chargé,
   sinon pas de flash d'éléments invisibles */
.js-ready [data-reveal],
.js-ready [data-split] {
  opacity: 0;
  transform: translateY(30px);
  transition: none;
}

.js-ready [data-card-reveal] {
  opacity: 0;
  transform: translateY(40px) scale(.98);
}

.js-ready [data-step-reveal] {
  opacity: 0;
  transform: translateX(-20px);
}

/* SplitText — les chars sont générés par JS, on réserve l'espace */
.js-ready [data-split] .char {
  display: inline-block;
  transform: translateY(100%);
  opacity: 0;
  will-change: transform, opacity;
}

.js-ready [data-split] .word { overflow: hidden; display: inline-block; }

/* ─── Variantes d'animation custom ─── */

/* Hover glow sur CTA primaires */
.ys-btn--primary::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(255, 255, 255, .25) 0%, transparent 50%);
  opacity: 0;
  transition: opacity .4s var(--ys-easing);
  pointer-events: none;
}
.ys-btn--primary:hover::after { opacity: 1; }

/* Shimmer sur hero kicker */
@keyframes ys-shimmer {
  0%, 100% { box-shadow: 0 0 20px rgba(111, 168, 255, .3); }
  50%      { box-shadow: 0 0 30px rgba(111, 168, 255, .6); }
}
.ys-hero__kicker { animation: ys-shimmer 3s ease-in-out infinite; }

/* Texte gradient animé sur titres hero */
@keyframes ys-gradient-shift {
  0%, 100% { background-position: 0% 50%; }
  50%      { background-position: 100% 50%; }
}
.ys-hero__title,
.ys-page-hero__title,
.ys-prest-hero__title {
  background-size: 200% 200%;
  animation: ys-gradient-shift 8s ease-in-out infinite;
}

/* ─── Reduced motion — respect OS ─── */
@media (prefers-reduced-motion: reduce) {
  .js-ready [data-reveal],
  .js-ready [data-split],
  .js-ready [data-card-reveal],
  .js-ready [data-step-reveal] {
    opacity: 1 !important;
    transform: none !important;
  }
  .js-ready [data-split] .char {
    opacity: 1 !important;
    transform: none !important;
  }
  .ys-hero__title,
  .ys-page-hero__title,
  .ys-prest-hero__title,
  .ys-hero__kicker { animation: none !important; }
  .ys-hero__scroll-line::after { animation: none !important; }
  .ys-zone__pulse span { animation: none !important; }
  * { transition-duration: 0.01ms !important; }
}

/* ─── Empêche flash si JS désactivé ─── */
.no-js [data-reveal],
.no-js [data-split],
.no-js [data-card-reveal],
.no-js [data-step-reveal] {
  opacity: 1 !important;
  transform: none !important;
}