/* Visual Effects & Animations
 *
 * Raygun mad scientist treatment, word glow effects, scroll reveals.
 * All animations respect prefers-reduced-motion.
 */

/* ============================================
   RAYGUN MAD SCIENTIST TREATMENT
   ============================================ */

.raygun-icon {
  /* Base orange glow */
  filter: drop-shadow(0 0 12px rgba(230, 126, 34, 0.4));
  transition: all 0.3s ease;

  /* Breathing animation - subtle energy pulse */
  animation: raygunBreathing 3s ease-in-out infinite;
}

@keyframes raygunBreathing {
  0%, 100% {
    filter: drop-shadow(0 0 12px rgba(230, 126, 34, 0.4));
    transform: scale(1);
  }
  50% {
    filter: drop-shadow(0 0 20px rgba(230, 126, 34, 0.6));
    transform: scale(1.02);
  }
}

/* Hover: intensify glow (curiosity reward) */
.raygun-icon:hover {
  filter: drop-shadow(0 0 28px rgba(230, 126, 34, 0.8))
          drop-shadow(0 0 14px rgba(201, 169, 97, 0.5));
  transform: scale(1.08);
  cursor: pointer;
}

/* Dark mode: brighter, more radioactive */
[data-theme="dark"] .raygun-icon {
  filter: drop-shadow(0 0 16px rgba(243, 156, 18, 0.6));
}

[data-theme="dark"] .raygun-icon:hover {
  filter: drop-shadow(0 0 36px rgba(243, 156, 18, 1))
          drop-shadow(0 0 18px rgba(212, 175, 55, 0.6));
}

/* ============================================
   WORD GLOW EFFECTS
   ============================================ */

.glow-word {
  position: relative;
  color: var(--color-orange);
  text-shadow: 0 0 8px var(--color-orange-faint);
  transition: all 0.3s ease;
}

.glow-word:hover {
  text-shadow: 0 0 16px var(--color-orange-faint),
               0 0 24px var(--color-orange-faint);
}

/* Emphasis variant (for "ALIVE") */
.glow-word-emphasis {
  font-weight: 700;
  color: var(--color-orange);
  text-shadow: 0 0 12px var(--color-orange-faint);
  animation: emphasisPulse 2s ease-in-out infinite;
}

@keyframes emphasisPulse {
  0%, 100% {
    text-shadow: 0 0 12px var(--color-orange-faint);
  }
  50% {
    text-shadow: 0 0 20px var(--color-orange-faint),
                 0 0 30px var(--color-orange-faint);
  }
}

/* Dark mode: brighter glow */
[data-theme="dark"] .glow-word {
  text-shadow: 0 0 12px rgba(243, 156, 18, 0.4);
}

[data-theme="dark"] .glow-word-emphasis {
  text-shadow: 0 0 16px rgba(243, 156, 18, 0.5);
}

[data-theme="dark"] .glow-word-emphasis {
  animation: emphasisPulseDark 2s ease-in-out infinite;
}

@keyframes emphasisPulseDark {
  0%, 100% {
    text-shadow: 0 0 16px rgba(243, 156, 18, 0.5);
  }
  50% {
    text-shadow: 0 0 24px rgba(243, 156, 18, 0.7),
                 0 0 36px rgba(243, 156, 18, 0.4);
  }
}

/* ============================================
   SCROLL REVEAL ANIMATIONS
   ============================================ */

/* Elements start hidden and fade/slide in */
.reveal {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}

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

/* Staggered reveal 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; }

/* Hero elements reveal on load */
.hero-content > * {
  animation: fadeSlideIn 0.8s ease forwards;
}

.hero-content > *:nth-child(1) { animation-delay: 0.1s; }
.hero-content > *:nth-child(2) { animation-delay: 0.3s; }
.hero-content > *:nth-child(3) { animation-delay: 0.5s; }
.hero-content > *:nth-child(4) { animation-delay: 0.7s; }

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

/* ============================================
   ACCESSIBILITY: REDUCED MOTION
   ============================================ */

@media (prefers-reduced-motion: reduce) {
  /* Disable all animations */
  .raygun-icon,
  .glow-word-emphasis,
  .hero-content > * {
    animation: none !important;
  }

  /* Keep glow effects but no pulse */
  .raygun-icon {
    filter: drop-shadow(0 0 12px rgba(230, 126, 34, 0.4));
    transform: scale(1);
  }

  .glow-word-emphasis {
    text-shadow: 0 0 12px var(--color-orange-faint);
  }

  /* Instant reveal, no transition */
  .reveal,
  .hero-content > * {
    opacity: 1 !important;
    transform: translateY(0) !important;
    transition: none !important;
  }
}

/* ============================================
   MOBILE OPTIMIZATIONS
   ============================================ */

@media (max-width: 768px) {
  /* Reduce glow intensity on mobile (performance) */
  .raygun-icon {
    filter: drop-shadow(0 0 8px rgba(230, 126, 34, 0.3));
  }

  @keyframes raygunBreathing {
    0%, 100% {
      filter: drop-shadow(0 0 8px rgba(230, 126, 34, 0.3));
      transform: scale(1);
    }
    50% {
      filter: drop-shadow(0 0 14px rgba(230, 126, 34, 0.5));
      transform: scale(1.02);
    }
  }

  /* Simplify word glow on mobile */
  .glow-word {
    text-shadow: 0 0 4px var(--color-orange-faint);
  }

  .glow-word-emphasis {
    text-shadow: 0 0 8px var(--color-orange-faint);
    animation: none; /* Static glow on mobile */
  }
}