/* =============================================
   ANIMATIONS — ESIC Online
   ============================================= */

/* --- FADE UP (scroll reveal) --- */
.esic-reveal {
  opacity: 0;
  transform: translateY(32px);
  transition: opacity 0.65s cubic-bezier(0.22,1,0.36,1),
              transform 0.65s cubic-bezier(0.22,1,0.36,1);
}
.esic-reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* Cascade delay sur les grilles */
.esic-reveal-cascade > * {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 0.55s cubic-bezier(0.22,1,0.36,1),
              transform 0.55s cubic-bezier(0.22,1,0.36,1);
}
.esic-reveal-cascade.is-visible > *:nth-child(1) { opacity:1; transform:translateY(0); transition-delay: 0ms; }
.esic-reveal-cascade.is-visible > *:nth-child(2) { opacity:1; transform:translateY(0); transition-delay: 90ms; }
.esic-reveal-cascade.is-visible > *:nth-child(3) { opacity:1; transform:translateY(0); transition-delay: 180ms; }
.esic-reveal-cascade.is-visible > *:nth-child(4) { opacity:1; transform:translateY(0); transition-delay: 270ms; }
.esic-reveal-cascade.is-visible > *:nth-child(5) { opacity:1; transform:translateY(0); transition-delay: 360ms; }
.esic-reveal-cascade.is-visible > *:nth-child(6) { opacity:1; transform:translateY(0); transition-delay: 450ms; }

/* --- SECTION TITLE DIVIDER DRAW --- */
.esic-section-title__divider {
  width: 0;
  transition: width 0.8s cubic-bezier(0.22,1,0.36,1) 0.3s;
}
.esic-reveal.is-visible .esic-section-title__divider,
.esic-section-title.is-visible .esic-section-title__divider {
  width: 4rem;
}

/* --- FLOATING BADGES (hero) --- */
.esic-hero__badge-ceh {
  animation: floatBadge1 4s ease-in-out infinite;
}
.esic-hero__badge-cpf {
  animation: floatBadge2 4.5s ease-in-out infinite;
}
@keyframes floatBadge1 {
  0%, 100% { transform: translateY(0px) rotate(-1deg); }
  50%       { transform: translateY(-10px) rotate(1deg); }
}
@keyframes floatBadge2 {
  0%, 100% { transform: translateY(0px) rotate(1deg); }
  50%       { transform: translateY(-8px) rotate(-1deg); }
}

/* --- HERO CARD PULSE (progress fill) --- */
.esic-progress__fill {
  position: relative;
  overflow: hidden;
}
.esic-progress__fill::after {
  content: '';
  position: absolute;
  top: 0; left: -100%;
  width: 60%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.35), transparent);
  animation: shimmerBar 2.5s ease-in-out infinite 1s;
}
@keyframes shimmerBar {
  0%   { left: -60%; }
  100% { left: 140%; }
}

/* --- HERO GRADIENT SHIFT --- */
.esic-hero {
  background-size: 200% 200%;
  animation: heroGradient 8s ease infinite;
}
@keyframes heroGradient {
  0%   { background-position: 0% 50%; }
  50%  { background-position: 100% 50%; }
  100% { background-position: 0% 50%; }
}

/* --- HERO EYEBROW PULSE --- */
.esic-eyebrow__dot {
  animation: eyebrowPulse 2s ease-in-out infinite;
}
@keyframes eyebrowPulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50%       { opacity: 0.5; transform: scale(0.8); }
}

/* --- CTA SHIMMER BUTTON --- */
.esic-btn--primary,
.esic-btn--violet,
.esic-btn--cyan {
  position: relative;
  overflow: hidden;
}
.esic-btn--primary::after,
.esic-btn--violet::after,
.esic-btn--cyan::after {
  content: '';
  position: absolute;
  top: 0; left: -100%;
  width: 60%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.25), transparent);
  transition: none;
}
.esic-btn--primary:hover::after,
.esic-btn--violet:hover::after,
.esic-btn--cyan:hover::after {
  animation: btnShimmer 0.6s ease forwards;
}
@keyframes btnShimmer {
  0%   { left: -60%; }
  100% { left: 140%; }
}

/* --- CATEGORY CARD ICON BOUNCE --- */
.esic-cat-card:hover .esic-cat-card__icon {
  animation: iconBounce 0.5s cubic-bezier(0.36,0.07,0.19,0.97);
}
@keyframes iconBounce {
  0%, 100% { transform: translateY(0); }
  30%       { transform: translateY(-6px); }
  60%       { transform: translateY(-2px); }
}

/* --- STATS COUNTER (classe ajoutée par JS) --- */
.esic-stats__number {
  transition: transform 0.3s ease;
}
.esic-stats__number.counting {
  transform: scale(1.1);
}

/* --- HERO CIRCLES PARALLAX SLOW ROTATE --- */
.esic-hero__circle--1 {
  animation: rotateSlow 20s linear infinite;
  transform-origin: center;
}
.esic-hero__circle--2 {
  animation: rotateSlow 28s linear infinite reverse;
}
@keyframes rotateSlow {
  from { transform: translate(33%, -50%) rotate(0deg); }
  to   { transform: translate(33%, -50%) rotate(360deg); }
}

/* --- FORMATION CARD HOVER TITLE COLOR --- */
.esic-formation-card__title a {
  background-size: 0% 2px;
  background-repeat: no-repeat;
  background-position: left bottom;
  background-image: linear-gradient(90deg, var(--primary), var(--primary-l));
  padding-bottom: 1px;
  transition: background-size 0.3s ease, color 0.2s;
}
.esic-formation-card:hover .esic-formation-card__title a {
  background-size: 100% 2px;
  color: var(--primary);
}

/* --- CERTIF BADGES STAGGER --- */
.esic-certif__badge {
  opacity: 0;
  transform: translateY(16px);
  transition: opacity 0.5s ease, transform 0.5s ease;
}
.esic-certif.is-visible .esic-certif__badge:nth-child(1) { opacity:1; transform:translateY(0); transition-delay:0ms; }
.esic-certif.is-visible .esic-certif__badge:nth-child(2) { opacity:1; transform:translateY(0); transition-delay:100ms; }
.esic-certif.is-visible .esic-certif__badge:nth-child(3) { opacity:1; transform:translateY(0); transition-delay:200ms; }
.esic-certif.is-visible .esic-certif__badge:nth-child(4) { opacity:1; transform:translateY(0); transition-delay:300ms; }

/* --- LOGO HOVER --- */
.esic-logo__icon {
  transition: transform 0.3s cubic-bezier(0.36,0.07,0.19,0.97);
}
.esic-logo:hover .esic-logo__icon {
  transform: rotate(-8deg) scale(1.1);
}

/* --- NAV CTA PULSE (attention getter) --- */
@keyframes ctaPulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(37,99,235,0.4); }
  50%       { box-shadow: 0 0 0 8px rgba(37,99,235,0); }
}
.esic-header__actions .esic-btn--primary {
  animation: ctaPulse 3s ease-in-out infinite 4s;
}