/* ============================================================
   PRIME SPECTRUM — Animations
   ============================================================ */

/* ── Keyframes ─────────────────────────────────────────────── */
@keyframes fadeSlideUp {
  from { opacity: 0; transform: translateY(30px); }
  to   { opacity: 1; transform: translateY(0); }
}

@keyframes fadeSlideLeft {
  from { opacity: 0; transform: translateX(-30px); }
  to   { opacity: 1; transform: translateX(0); }
}

@keyframes fadeSlideRight {
  from { opacity: 0; transform: translateX(30px); }
  to   { opacity: 1; transform: translateX(0); }
}

@keyframes slideInRight {
  from { opacity: 0; transform: translateX(60px); }
  to   { opacity: 1; transform: translateX(0); }
}

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

@keyframes pulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.6; transform: scale(0.85); }
}

@keyframes scrollDot {
  0%   { opacity: 1; transform: translateX(-50%) translateY(0); }
  80%  { opacity: 0; transform: translateX(-50%) translateY(14px); }
  100% { opacity: 0; transform: translateX(-50%) translateY(14px); }
}

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

@keyframes shimmer {
  0%   { background-position: -200% 0; }
  100% { background-position: 200% 0; }
}

@keyframes floatY {
  0%, 100% { transform: translateY(0px); }
  50%       { transform: translateY(-12px); }
}

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

@keyframes orbFloat1 {
  0%, 100% { transform: translateY(0px) translateX(0px); }
  50% { transform: translateY(-30px) translateX(20px); }
}

@keyframes orbFloat2 {
  0%, 100% { transform: translateY(0px) translateX(0px); }
  50% { transform: translateY(25px) translateX(-15px); }
}

@keyframes textGlitch {
  0% { transform: translate(0); }
  20% { transform: translate(-2px, 2px); }
  40% { transform: translate(-2px, -2px); }
  60% { transform: translate(2px, 2px); }
  80% { transform: translate(2px, -2px); }
  100% { transform: translate(0); }
}

@keyframes slideInScale {
  0% { opacity: 0; transform: scale(0.8) translateY(20px); }
  100% { opacity: 1; transform: scale(1) translateY(0); }
}

@keyframes countUp {
  0% { opacity: 0; transform: translateY(10px); }
  100% { opacity: 1; transform: translateY(0); }
}

@keyframes heroPulseRing {
  0%   { transform: translate(-50%, -50%) scale(0.05); opacity: 0.7; }
  100% { transform: translate(-50%, -50%) scale(1);    opacity: 0; }
}

@keyframes heroGridDrift {
  from { transform: translateY(0); }
  to   { transform: translateY(80px); }
}

@keyframes heroParticleRise {
  0%   { transform: translateY(0)     scale(1);   opacity: 0; }
  8%   { opacity: 0.85; }
  80%  { opacity: 0.5; }
  100% { transform: translateY(-55vh) scale(0.2); opacity: 0; }
}

@keyframes heroShapeAnim {
  0%, 100% { transform: translateY(0px)   rotate(0deg);  opacity: 0; }
  8%        { opacity: 0.4; }
  50%       { transform: translateY(-20px) rotate(45deg); opacity: 0.65; }
  92%       { opacity: 0.4; }
}

@keyframes heroShapeAnimDiamond {
  0%, 100% { transform: translateY(0px)   rotate(45deg); opacity: 0; }
  8%        { opacity: 0.4; }
  50%       { transform: translateY(-20px) rotate(90deg); opacity: 0.6; }
  92%       { opacity: 0.4; }
}

@keyframes heroBeamSweep {
  from { transform: translateX(-70vw); opacity: 0; }
  6%   { opacity: 0.7; }
  94%  { opacity: 0.7; }
  to   { transform: translateX(70vw);  opacity: 0; }
}

/* ── Scroll Reveal ─────────────────────────────────────────── */
.reveal {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity 0.65s cubic-bezier(0.4,0,0.2,1),
              transform 0.65s cubic-bezier(0.4,0,0.2,1);
}

.reveal.visible {
  opacity: 1;
  transform: translateY(0);
}

.reveal-left {
  opacity: 0;
  transform: translateX(-28px);
  transition: opacity 0.65s cubic-bezier(0.4,0,0.2,1),
              transform 0.65s cubic-bezier(0.4,0,0.2,1);
}
.reveal-left.visible { opacity: 1; transform: translateX(0); }

.reveal-right {
  opacity: 0;
  transform: translateX(28px);
  transition: opacity 0.65s cubic-bezier(0.4,0,0.2,1),
              transform 0.65s cubic-bezier(0.4,0,0.2,1);
}
.reveal-right.visible { opacity: 1; transform: translateX(0); }

/* Stagger delays */
.reveal-delay-1 { transition-delay: 0.1s; }
.reveal-delay-2 { transition-delay: 0.2s; }
.reveal-delay-3 { transition-delay: 0.3s; }
.reveal-delay-4 { transition-delay: 0.4s; }
.reveal-delay-5 { transition-delay: 0.5s; }
.reveal-delay-6 { transition-delay: 0.6s; }

/* ── Hover micro-interactions ──────────────────────────────── */
.hover-lift {
  transition: transform 0.3s cubic-bezier(0.4,0,0.2,1),
              box-shadow 0.3s cubic-bezier(0.4,0,0.2,1);
}
.hover-lift:hover {
  transform: translateY(-5px);
  box-shadow: 0 12px 40px rgba(0,0,0,0.12);
}

/* ── Floating element ──────────────────────────────────────── */
.float-anim { animation: floatY 4s ease-in-out infinite; }

/* ── Page transition fade ──────────────────────────────────── */
.page-fade-in { animation: fadeIn 0.5s ease; }