/* ============================================================
   ANIMATIONS SCROLL CLASSIQUES
   ============================================================ */
.animate-fade-up {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity .6s ease, transform .6s ease;
}
.animate-fade-up.is-visible { opacity: 1; transform: translateY(0); }

.animate-fade-left {
  opacity: 0;
  transform: translateX(-28px);
  transition: opacity .6s ease, transform .6s ease;
}
.animate-fade-left.is-visible { opacity: 1; transform: translateX(0); }

/* ============================================================
   1. APPARITION SÉQUENTIELLE EN CASCADE (STAGGERED FADE-UP)
   ============================================================ */
.cp-stagger-item,
.cp-stats-grid > *,
.cp-programs-grid > *,
.cp-antennes-grid > *,
.cp-tools-grid > *,
.cp-magazine-grid > *,
.cp-partners-grid > *,
.cp-galerie-grid > * {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.75s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.75s cubic-bezier(0.16, 1, 0.3, 1);
  will-change: opacity, transform;
}

.cp-stagger-item.is-revealed,
.cp-stats-grid > *.is-revealed,
.cp-programs-grid > *.is-revealed,
.cp-antennes-grid > *.is-revealed,
.cp-tools-grid > *.is-revealed,
.cp-magazine-grid > *.is-revealed,
.cp-partners-grid > *.is-revealed,
.cp-galerie-grid > *.is-revealed {
  opacity: 1;
  transform: translateY(0);
}

/* ============================================================
   2. LUEUR & REFLET DYNAMIQUE (GLASS SHIMMER SUR LES CARTES)
   ============================================================ */
.cp-program-card,
.cp-antenne-card,
.cp-tool-card,
.cp-stat-box,
.cp-article-card,
.cp-card-member {
  position: relative;
  overflow: hidden;
}

.cp-program-card::after,
.cp-antenne-card::after,
.cp-tool-card::after,
.cp-stat-box::after,
.cp-article-card::after,
.cp-card-member::after {
  content: '';
  position: absolute;
  top: -60%;
  left: -60%;
  width: 220%;
  height: 220%;
  background: linear-gradient(
    65deg,
    transparent 42%,
    rgba(255, 255, 255, 0.16) 50%,
    transparent 58%
  );
  transform: translateX(-120%) rotate(25deg);
  transition: transform 0.85s cubic-bezier(0.16, 1, 0.3, 1);
  pointer-events: none;
  z-index: 2;
}

.cp-program-card:hover::after,
.cp-antenne-card:hover::after,
.cp-tool-card:hover::after,
.cp-stat-box:hover::after,
.cp-article-card:hover::after,
.cp-card-member:hover::after {
  transform: translateX(120%) rotate(25deg);
}

/* ============================================================
   3. PARALLAXE DOUX (PROGRESSIVE ENHANCEMENT)
   ============================================================ */
.cp-parallax-wrap {
  overflow: hidden;
  position: relative;
}

.cp-parallax-target {
  will-change: transform;
  transition: transform 0.15s cubic-bezier(0, 0, 0.2, 1);
}

@supports (animation-timeline: view()) {
  .cp-parallax-auto {
    animation: cpParallaxMotion linear both;
    animation-timeline: view();
    animation-range: entry 0% exit 100%;
  }

  @keyframes cpParallaxMotion {
    from { transform: translateY(-24px); }
    to   { transform: translateY(24px); }
  }
}

/* Support de la réduction de mouvement (WCAG 2.1 AA) */
@media (prefers-reduced-motion: reduce) {
  .animate-fade-up,
  .animate-fade-left,
  .cp-stagger-item,
  .cp-stats-grid > *,
  .cp-programs-grid > *,
  .cp-antennes-grid > *,
  .cp-tools-grid > *,
  .cp-magazine-grid > *,
  .cp-partners-grid > *,
  .cp-galerie-grid > *,
  .cp-parallax-target,
  .cp-parallax-auto {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
    animation: none !important;
  }

  .cp-program-card::after,
  .cp-antenne-card::after,
  .cp-tool-card::after,
  .cp-stat-box::after,
  .cp-article-card::after,
  .cp-card-member::after {
    display: none !important;
  }
}