/* ==========================================================================
   Faseeh — Couche d'animation (feeling « Framer Motion », sans build)
   • Scroll-reveal en cascade + easings premium
   • Tracé SVG (anneaux / ondes) piloté en JS (Web Animations API)
   • Micro-interactions (hover cartes/boutons, pulsation micro, onde vivante)
   • Entièrement désactivé si prefers-reduced-motion: reduce
   ========================================================================== */

:root {
  --ease-expo: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-out:  cubic-bezier(0.22, 1, 0.36, 1);
  --ease-soft: cubic-bezier(0.33, 1, 0.68, 1);
}

@media (prefers-reduced-motion: no-preference) {

  /* ---------- Scroll reveal : pré-masquage avant peinture (html.fsh-motion) ;
       la révélation (translate + fade + stagger) est pilotée par GSAP. ---------- */
  .fsh-motion .fsh-hero__lead,
  .fsh-motion .fsh-hero__media,
  .fsh-motion .fsh-hero__stores,
  .fsh-motion .fsh-challenge__head,
  .fsh-motion .fsh-challenge__card,
  .fsh-motion .fsh-showcase__intro,
  .fsh-motion .fsh-dark-card,
  .fsh-motion .fsh-step,
  .fsh-motion .fsh-features__head,
  .fsh-motion .fsh-feature-card,
  .fsh-motion .fsh-audience__head,
  .fsh-motion .fsh-persona-card,
  .fsh-motion .fsh-cta__panel,
  .fsh-motion .fsh-footer-brand,
  .fsh-motion .fsh-footer-cols,
  .fsh-motion .fsh-footer-bottom {
    opacity: 0;
  }

  /* ---------- Hover : élévation des cartes ---------- */
  .fsh-card,
  .fsh-feature-card,
  .fsh-persona-card,
  .fsh-dark-card,
  .fsh-step {
    transition:
      transform 0.45s var(--ease-out),
      box-shadow 0.45s var(--ease-out),
      border-color 0.45s var(--ease-out);
  }
  .fsh-card:hover,
  .fsh-feature-card:hover,
  .fsh-persona-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 22px 48px rgba(0, 0, 0, 0.10);
  }
  .fsh-dark-card:hover,
  .fsh-step:hover {
    transform: translateY(-5px);
    border-color: #5f5f5f;
    box-shadow: 0 22px 48px rgba(0, 0, 0, 0.35);
  }
  .fsh-persona-card:hover .fsh-persona-card__icon,
  .fsh-feature-card:hover .fsh-feature-card__icon {
    transform: scale(1.08) rotate(-3deg);
    transition: transform 0.45s var(--ease-out);
  }

  /* ---------- Hover : boutons (flèche qui glisse) ---------- */
  .fsh-btn { transition: transform 0.35s var(--ease-out), background-color 0.25s ease, box-shadow 0.35s var(--ease-out); }
  .fsh-btn svg { transition: transform 0.35s var(--ease-out); }
  .fsh-btn--dark:hover, .fsh-btn--white:hover { box-shadow: 0 10px 26px rgba(0,0,0,0.18); }
  .fsh-btn--gold:hover { box-shadow: 0 10px 26px rgba(195,143,63,0.35); }
  .fsh-btn:hover .fsh-icon--arrow-right { transform: translateX(4px); }
  .fsh-btn:hover .fsh-icon--arrow-up-right { transform: translate(3px, -3px); }
  .fsh-btn:hover .fsh-icon--download { transform: translateY(2px); }

  /* Liens nav : souligné animé */
  .fsh-nav__list a { position: relative; }
  .fsh-nav__list a::after {
    content: ""; position: absolute; left: 12px; right: 12px; bottom: 2px;
    height: 1.5px; background: var(--c-gold);
    transform: scaleX(0); transform-origin: left;
    transition: transform 0.4s var(--ease-out);
  }
  .fsh-nav__list a:hover::after { transform: scaleX(1); }

  /* Header : entrée douce au chargement */
  .fsh-site-header .fsh-header-inner {
    animation: fshDrop 0.9s var(--ease-expo) both;
  }
  @keyframes fshDrop { from { opacity: 0; transform: translateY(-16px); } to { opacity: 1; transform: none; } }

  /* ---------- Ondes : barres révélées (build-up) via JS, + vie continue ---------- */
  .fsh-wave__bar { transform-origin: center; }
  /* Onde « enregistrement » (Open and recite) : scintillement vivant */
  .fsh-mock--record .fsh-wave--gold .fsh-wave__bar:not(.is-dim) {
    animation: fshShimmer 1.7s ease-in-out infinite;
  }
  .fsh-mock--record .fsh-wave--gold .fsh-wave__bar:nth-child(2n) { animation-delay: 0.25s; }
  .fsh-mock--record .fsh-wave--gold .fsh-wave__bar:nth-child(3n) { animation-delay: 0.55s; }
  .fsh-mock--record .fsh-wave--gold .fsh-wave__bar:nth-child(5n) { animation-delay: 0.85s; }
  @keyframes fshShimmer { 0%, 100% { opacity: 0.95; } 50% { opacity: 0.4; } }

  /* ---------- Micro (Open and recite) : halo qui pulse ---------- */
  .fsh-mic--lg { position: relative; }
  .fsh-mic--lg::after {
    content: ""; position: absolute; inset: 0; border-radius: inherit;
    border: 2px solid var(--c-gold-border);
    animation: fshMicPulse 2.4s var(--ease-soft) infinite;
    pointer-events: none;
  }
  @keyframes fshMicPulse {
    0%   { transform: scale(1);   opacity: 0.55; }
    70%  { transform: scale(1.55); opacity: 0; }
    100% { transform: scale(1.55); opacity: 0; }
  }

  /* ---------- Radar (Le défi) : anneaux qui respirent ---------- */
  .fsh-radar__ring { animation: fshBreathe 4.5s ease-in-out infinite; }
  .fsh-radar__ring:nth-child(2) { animation-delay: 0.3s; }
  .fsh-radar__ring:nth-child(3) { animation-delay: 0.6s; }
  .fsh-radar__ring:nth-child(4) { animation-delay: 0.9s; }
  .fsh-radar__ring:nth-child(5) { animation-delay: 1.2s; }
  @keyframes fshBreathe {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.45; }
  }
  .fsh-radar__icon { animation: fshFloat 5s ease-in-out infinite; }
  @keyframes fshFloat { 0%,100% { transform: translate(-50%, -50%); } 50% { transform: translate(-50%, calc(-50% - 4px)); } }

  /* « Instant » / « AI analysis » : léger pop des pastilles au reveal */
  .fsh-chip__check { animation: fshBadgePop 0.5s var(--ease-out) both; }
  @keyframes fshBadgePop { from { transform: scale(0); } to { transform: scale(1); } }
}