/* ═══════════════════════════════════════
   ANIMATIONS.CSS — All Keyframes
═══════════════════════════════════════ */

@keyframes shimmer-drift{
  0%{transform:translateX(0) translateY(0)}
  100%{transform:translateX(60px) translateY(60px)}
}
@keyframes wave-move{
  0%{transform:translateX(0)}
  100%{transform:translateX(-20%)}
}
@keyframes float-particle{
  0%{opacity:0;transform:translateY(0) scale(0)}
  10%{opacity:0.6}
  90%{opacity:0.2}
  100%{opacity:0;transform:translateY(-100vh) scale(1.5)}
}
@keyframes skull-pulse{
  0%,100%{filter:drop-shadow(0 0 8px rgba(192,39,45,0.8))}
  50%{filter:drop-shadow(0 0 16px rgba(232,52,59,1)) drop-shadow(0 0 30px rgba(201,168,76,0.4))}
}
@keyframes skull-float{
  0%,100%{transform:translateY(0) rotate(-3deg)}
  50%{transform:translateY(-12px) rotate(3deg)}
}
@keyframes crown-float{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-6px)}
}
@keyframes btn-breathe{
  0%,100%{box-shadow:0 0 15px rgba(192,39,45,0.4),inset 0 1px 0 rgba(255,255,255,0.1)}
  50%{box-shadow:0 0 25px rgba(192,39,45,0.6),0 0 50px rgba(192,39,45,0.2),inset 0 1px 0 rgba(255,255,255,0.1)}
}
@keyframes fade-up{
  from{opacity:0;transform:translateY(20px)}
  to{opacity:1;transform:translateY(0)}
}
@keyframes section-in{
  from{opacity:0;transform:translateY(16px)}
  to{opacity:1;transform:translateY(0)}
}
@keyframes scroll-bob{
  0%,100%{transform:translateX(-50%) translateY(0)}
  50%{transform:translateX(-50%) translateY(6px)}
}
@keyframes live-blink{
  0%,100%{opacity:1}
  50%{opacity:0.2}
}
@keyframes caustic-shift{
  0%  {transform:translateX(0) translateY(0) scale(1)}
  33% {transform:translateX(3%) translateY(-2%) scale(1.04)}
  66% {transform:translateX(-2%) translateY(3%) scale(0.97)}
  100%{transform:translateX(4%) translateY(-1%) scale(1.02)}
}
@keyframes ripple-drift{
  0%  {transform:translateY(0)}
  100%{transform:translateY(-40px)}
}
@keyframes bubble-rise{
  0%  {opacity:0;transform:translateY(0) translateX(0) scale(0.6)}
  8%  {opacity:0.75}
  50% {transform:translateY(-50vh) translateX(12px) scale(1)}
  75% {transform:translateY(-75vh) translateX(-8px) scale(1.1)}
  92% {opacity:0.3}
  100%{opacity:0;transform:translateY(-102vh) translateX(5px) scale(1.2)}
}

/* Hero entrance animations */
.hero-top-line{animation:fade-up 1s ease-out 0.2s both}
.hero-skull-wrap{animation:fade-up 1s ease-out 0.4s both}
.hero-title{animation:fade-up 1s ease-out 0.6s both}
.hero-sub{animation:fade-up 1s ease-out 0.8s both}
.hero-tagline{animation:fade-up 1s ease-out 1s both}
.hero-badges{animation:fade-up 1s ease-out 1.1s both}
.hero-cta{animation:fade-up 1s ease-out 1.3s both}

/* Bubble / particle element style */
.particle{
  position:absolute;border-radius:50%;
  background:radial-gradient(circle at 35% 35%, rgba(255,255,255,0.55) 0%, rgba(20,196,175,0.25) 40%, transparent 75%);
  border:1px solid rgba(20,196,175,0.35);
  box-shadow:inset 0 0 4px rgba(255,255,255,0.2), 0 0 6px rgba(13,155,138,0.2);
  animation:bubble-rise ease-in infinite;
  opacity:0;
}