/* ============================================================
   animations.css — keyframe motion layer (cinematic atmosphere)
   Loaded after style.css. Pure CSS, no framework.
   ============================================================ */

@keyframes beam-drift-a {
  0%,
  100% {
    opacity: 0.4;
    transform: rotate(11deg) translateX(-1.5vw);
  }
  50% {
    opacity: 0.75;
    transform: rotate(13.5deg) translateX(1.5vw);
  }
}

@keyframes beam-drift-b {
  0%,
  100% {
    opacity: 0.28;
    transform: rotate(-9deg) translateX(1vw);
  }
  50% {
    opacity: 0.55;
    transform: rotate(-11deg) translateX(-1vw);
  }
}

@keyframes bloom-breathe {
  0%,
  100% {
    opacity: 0.75;
  }
  50% {
    opacity: 1;
  }
}

@keyframes haze-a {
  0%,
  100% {
    transform: translate3d(-2%, 1%, 0) scale(1.02);
  }
  50% {
    transform: translate3d(3%, -2%, 0) scale(1.08);
  }
}

@keyframes haze-b {
  0%,
  100% {
    transform: translate3d(2%, -1%, 0) scale(1.05);
  }
  50% {
    transform: translate3d(-3%, 2%, 0) scale(1);
  }
}

@keyframes grain-shift {
  0% {
    transform: translate3d(0, 0, 0);
  }
  33% {
    transform: translate3d(-1.5%, 1%, 0);
  }
  66% {
    transform: translate3d(1%, -1.5%, 0);
  }
  100% {
    transform: translate3d(0, 0, 0);
  }
}

@keyframes page-grain-shift {
  0% {
    transform: translate3d(0, 0, 0);
  }
  33% {
    transform: translate3d(-1%, 0.8%, 0);
  }
  66% {
    transform: translate3d(0.8%, -1%, 0);
  }
  100% {
    transform: translate3d(0, 0, 0);
  }
}