/* ═══════════════════════════════════════════════════════
   RELIA RECRU — Animations globales (subtiles)
   ═══════════════════════════════════════════════════════ */

/* ── 1. Scroll reveal ────────────────────────────────── */
.reveal {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 0.55s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.55s cubic-bezier(0.16, 1, 0.3, 1);
}
.reveal.visible {
  opacity: 1;
  transform: translateY(0);
}
.reveal-left {
  opacity: 0;
  transform: translateX(-28px);
  transition: opacity 0.55s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.55s cubic-bezier(0.16, 1, 0.3, 1);
}
.reveal-left.visible { opacity: 1; transform: translateX(0); }

.reveal-right {
  opacity: 0;
  transform: translateX(28px);
  transition: opacity 0.55s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.55s cubic-bezier(0.16, 1, 0.3, 1);
}
.reveal-right.visible { opacity: 1; transform: translateX(0); }

/* Boutons inline rouge génériques */
a[href],
button {
  transition: transform 0.15s ease, opacity 0.15s ease;
}
a[href]:active,
button:active {
  transform: scale(0.97);
}

/* ── 2. Logo — hover rotate légère ──────────────────── */
header img {
  transition: transform 0.3s ease;
}
header img:hover {
  transform: scale(1.04);
}

/* ── 3. Input focus glow ───────────────────────────── */
input[type="text"]:focus,
input[type="email"]:focus,
select:focus {
  transition: box-shadow 0.2s ease;
}

/* ── 4. Hero entrance (home) / save pulse ─────────────── */
@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(30px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes float {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-40px);
  }
}
@keyframes savePulse {
  0% {
    transform: scale(1);
  }
  40% {
    transform: scale(1.35);
  }
  70% {
    transform: scale(0.9);
  }
  100% {
    transform: scale(1);
  }
}

.animate-fade-in-up {
  animation: fadeInUp 0.8s cubic-bezier(0.16, 1, 0.3, 1) forwards;
  opacity: 0;
}
.delay-100 {
  animation-delay: 100ms;
}
.delay-200 {
  animation-delay: 200ms;
}
.delay-300 {
  animation-delay: 300ms;
}

.animate-float {
  animation: float 6s ease-in-out infinite;
}

.animate-save-pulse {
  animation: savePulse 0.4s ease forwards;
}