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

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

@keyframes pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.5; }
}

/* Splash wow */
@keyframes splashMarkIn {
  0% {
    opacity: 0;
    transform: scale(0.2) rotate(-120deg);
  }
  55% {
    transform: scale(1.12) rotate(8deg);
  }
  100% {
    opacity: 1;
    transform: scale(1) rotate(0deg);
  }
}

@keyframes splashGlow {
  0%, 100% {
    box-shadow: 0 0 0 rgba(229, 255, 0, 0);
  }
  50% {
    box-shadow: 0 0 48px rgba(229, 255, 0, 0.45), 0 0 96px rgba(229, 255, 0, 0.15);
  }
}

@keyframes splashWordIn {
  from {
    opacity: 0;
    transform: translateY(28px);
    filter: blur(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
    filter: blur(0);
  }
}

@keyframes splashLineGrow {
  from { transform: scaleX(0); }
  to { transform: scaleX(1); }
}

@keyframes splashGridPulse {
  0%, 100% { opacity: 0.35; }
  50% { opacity: 0.7; }
}

/* Hero entrance after splash */
@keyframes logoPop {
  from {
    opacity: 0;
    transform: scale(0.6) rotate(-12deg);
  }
  to {
    opacity: 1;
    transform: scale(1) rotate(0);
  }
}

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

@keyframes heroPhotoIn {
  from {
    opacity: 0;
    transform: translateX(40px) scale(0.92);
    filter: blur(6px);
  }
  to {
    opacity: 1;
    transform: translateX(0) scale(1);
    filter: blur(0);
  }
}

@keyframes heroTitleReveal {
  from {
    opacity: 0;
    letter-spacing: 0.02em;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    letter-spacing: -0.05em;
    transform: translateY(0);
  }
}

@keyframes heroAccentFlash {
  0%, 100% { text-shadow: none; }
  40% { text-shadow: 0 0 24px rgba(229, 255, 0, 0.6); }
}

.reveal {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}

.reveal.is-visible {
  opacity: 1;
  transform: none;
}

@media (prefers-reduced-motion: reduce) {
  .reveal {
    opacity: 1;
    transform: none;
    transition: none;
  }
}