/* ==========================================================================
   Animations
   ========================================================================== */

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

@keyframes pulseGlow {
  0%, 100% { opacity: 0.5; }
  50% { opacity: 0.9; }
}

@keyframes spin-slow {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

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

.hero__kicker .dot {
  animation: pulseGlow 2.4s ease-in-out infinite;
}

.hero__portrait-glow {
  animation: floatY 7s ease-in-out infinite;
}

.scroll-cue__line {
  width: 1px;
  height: 34px;
  background: linear-gradient(var(--accent), transparent);
  position: relative;
  overflow: hidden;
}

.scroll-cue__line::after {
  content: '';
  position: absolute;
  top: -100%;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(var(--text-primary), transparent);
  animation: scrollLine 2s var(--ease-in-out) infinite;
}

@keyframes scrollLine {
  to { top: 100%; }
}

/* Canvas particles sit behind everything, subtle */
#hero-canvas {
  width: 100%;
  height: 100%;
  opacity: 0.55;
}

/* Button shimmer */
.btn--primary {
  position: relative;
  overflow: hidden;
}

.btn--primary::before {
  content: '';
  position: absolute;
  top: 0;
  left: -60%;
  width: 40%;
  height: 100%;
  background: linear-gradient(120deg, transparent, rgba(255, 255, 255, 0.45), transparent);
  transform: skewX(-20deg);
  transition: left 0.7s var(--ease-out);
}

.btn--primary:hover::before {
  left: 130%;
}