@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes revealUp {
  from {
    opacity: 0;
    transform: translate3d(0, 24px, 0);
    filter: blur(6px);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
    filter: blur(0);
  }
}

@keyframes revealScale {
  from {
    opacity: 0;
    transform: scale(0.96);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}

@keyframes float {
  0%, 100% { transform: translate3d(0, 0, 0); }
  50% { transform: translate3d(0, -10px, 0); }
}

@keyframes pulseDot {
  0%, 100% {
    box-shadow: 0 0 0 4px rgba(225, 29, 42, 0.18), 0 0 14px var(--color-primary-glow);
  }
  50% {
    box-shadow: 0 0 0 8px rgba(225, 29, 42, 0.06), 0 0 22px rgba(225, 29, 42, 0.55);
  }
}

@keyframes shine {
  0% { transform: translateX(-120%) skewX(-20deg); }
  100% { transform: translateX(220%) skewX(-20deg); }
}

@keyframes gradientShift {
  0%, 100% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
}

@keyframes marqueeX {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}

@keyframes nudgeRight {
  0%, 100% { transform: translate3d(0, 0, 0); }
  50% { transform: translate3d(6px, 0, 0); }
}

.reveal {
  opacity: 0;
  transform: translate3d(0, 24px, 0);
  filter: blur(6px);
  transition:
    opacity var(--duration-xslow) var(--ease-out-expo),
    transform var(--duration-xslow) var(--ease-out-expo),
    filter var(--duration-xslow) var(--ease-out-expo);
  will-change: opacity, transform, filter;
}

.reveal.is-visible {
  opacity: 1;
  transform: translate3d(0, 0, 0);
  filter: blur(0);
}

.reveal[data-delay="1"] { transition-delay: 80ms; }
.reveal[data-delay="2"] { transition-delay: 160ms; }
.reveal[data-delay="3"] { transition-delay: 240ms; }
.reveal[data-delay="4"] { transition-delay: 320ms; }
.reveal[data-delay="5"] { transition-delay: 400ms; }
.reveal[data-delay="6"] { transition-delay: 480ms; }