/* ============================================================
   ANIMATIONS.CSS — Garnazelle LP
   Reveal au scroll, transitions, états
   ============================================================ */

/* --- REVEAL AU SCROLL --- */
.reveal {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity var(--transition-slow), transform var(--transition-slow);
}

.reveal.visible {
  opacity: 1;
  transform: translateY(0);
}

/* Délais en cascade pour les grilles */
.reveal-delay-1 { transition-delay: 0.1s; }
.reveal-delay-2 { transition-delay: 0.22s; }
.reveal-delay-3 { transition-delay: 0.34s; }
.reveal-delay-4 { transition-delay: 0.46s; }

/* --- FADE IN SIMPLE (sans translation) --- */
.fade-in {
  opacity: 0;
  transition: opacity 1.1s ease-out;
}
.fade-in.visible {
  opacity: 1;
}

/* --- HEADER : apparition au chargement --- */
header {
  animation: headerFade 0.8s ease-out both;
}

@keyframes headerFade {
  from { opacity: 0; transform: translateY(-10px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* --- HERO : entrée progressive --- */
.hero-left .badge        { animation: fadeUp 0.7s ease-out 0.2s both; }
.hero-left h1            { animation: fadeUp 0.8s ease-out 0.35s both; }
.hero-left .hero-sub     { animation: fadeUp 0.8s ease-out 0.5s both; }
.hero-left .wip-hero     { animation: fadeUp 0.9s ease-out 0.6s both; }
.hero-right .form-card   { animation: fadeUp 0.9s ease-out 0.45s both; }

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

/* --- HOVER TÉMOIGNAGES --- */
.testi-card {
  transition: background var(--transition);
  position: relative;
}

.testi-card::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 0;
  height: 2px;
  background: var(--vert-ecrin);
  transition: width 0.5s ease-out;
}

.testi-card:hover::after {
  width: 100%;
}

/* --- HOVER GALERIE --- */
.gallery-item {
  overflow: hidden;
  position: relative;
}

.gallery-item img {
  transition: transform 0.7s ease-out;
}

.gallery-item:hover img {
  transform: scale(1.03);
}