/* =============================================================
   animations.css — Animations professionnelles & discrètes
   Page : Médias — Site Dr. C. Joscky Ibrahim AHO
   ============================================================= */


/* ─────────────────────────────────────────────
   1. PRÉFÉRENCE ACCESSIBILITÉ
   ───────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}


/* ─────────────────────────────────────────────
   2. ÉTAT INITIAL — éléments cachés avant révélation
   ───────────────────────────────────────────── */
.anim-reveal {
  opacity: 0;
  transition:
    opacity 0.65s cubic-bezier(0.22, 0.61, 0.36, 1),
    transform 0.65s cubic-bezier(0.22, 0.61, 0.36, 1);
  transition-delay: var(--anim-delay, 0s);
  will-change: opacity, transform;
}

.anim-reveal[data-anim="fade-up"]    { transform: translateY(28px); }
.anim-reveal[data-anim="fade-left"]  { transform: translateX(-28px); }
.anim-reveal[data-anim="fade-right"] { transform: translateX(28px); }
.anim-reveal[data-anim="fade-in"]    { transform: none; }

.anim-reveal.is-visible {
  opacity: 1;
  transform: translate(0, 0);
}


/* ─────────────────────────────────────────────
   3. HERO — animation au chargement immédiat
   ───────────────────────────────────────────── */
.anim-fade-up {
  animation: fadeUpIn 0.75s cubic-bezier(0.22, 0.61, 0.36, 1) both;
  animation-delay: var(--anim-delay, 0s);
}

@keyframes fadeUpIn {
  from {
    opacity: 0;
    transform: translateY(22px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}


/* ─────────────────────────────────────────────
   4. TALK CARDS — hover premium
   ───────────────────────────────────────────── */
/* Image de la card : légère scale au hover */
.talk-card__image {
  transition: transform 0.45s cubic-bezier(0.22, 0.61, 0.36, 1);
  overflow: hidden;
}

.talk-card:hover .talk-card__image {
  transform: scale(1.03);
}

/* Lien de la card */
.talk-card__link {
  transition: opacity 0.2s ease, transform 0.2s ease;
  display: inline-block;
}

.talk-card__link:hover {
  opacity: 0.75;
  transform: translateX(3px);
}


/* ─────────────────────────────────────────────
   5. PRESS ITEMS — hover discret
   ───────────────────────────────────────────── */
/* Logo presse */
.press-item__logo {
  transition: opacity 0.25s ease, transform 0.25s ease;
}

.press-item:hover .press-item__logo {
  opacity: 0.85;
  transform: scale(1.04);
}

/* Lien presse */
.press-item__link {
  transition: opacity 0.2s ease, transform 0.2s ease;
  display: inline-block;
}

.press-item__link:hover {
  opacity: 0.7;
  transform: translateX(3px);
}


/* ─────────────────────────────────────────────
   6. GALERIE — zoom au hover sur chaque item
   ───────────────────────────────────────────── */
.gallery__item {
  overflow: hidden;
}

.gallery__image {
  transition: transform 0.5s cubic-bezier(0.22, 0.61, 0.36, 1);
  display: block;
  width: 100%;
}

.gallery__item:hover .gallery__image {
  transform: scale(1.06);
}


/* ─────────────────────────────────────────────
   7. MICRO-INTERACTIONS PARTAGÉES
   ───────────────────────────────────────────── */

/* Footer links */
.footer__link {
  transition: opacity 0.2s ease;
}
.footer__link:hover {
  opacity: 0.7;
}

/* Liens sociaux footer — icône uniquement */
.footer__social-link i {
  display: inline-block;
  transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
}
.footer__social-link:hover i {
  transform: rotate(-10deg) scale(1.12);
}