/* ==========================================
   HYLEK ANIMATIONS & METALLIC LIGHT SWEEP
   ========================================== */

/* Keyframe Animations */
@keyframes fadeInDown {
  from {
    opacity: 0;
    transform: translateY(-20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

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

@keyframes planetRise {
  from {
    opacity: 0;
    transform: translateY(60px) scale(0.97);
  }
  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@keyframes rimLightSweep {
  0% {
    stroke-dashoffset: 1200;
    opacity: 0.15;
  }
  50% {
    stroke-dashoffset: 0;
    opacity: 0.45;
  }
  100% {
    stroke-dashoffset: -1200;
    opacity: 0.15;
  }
}

@keyframes trustedMarqueeScroll {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}

@keyframes marqueeLoop {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}

@keyframes starTwinkle {
  0%, 100% {
    opacity: 0.2;
    transform: scale(0.8);
  }
  50% {
    opacity: 0.9;
    transform: scale(1.3);
    box-shadow: 0 0 6px rgba(255, 255, 255, 0.9), 0 0 10px rgba(245, 255, 0, 0.4);
  }
}

@keyframes floatSubtle {
  0%, 100% {
    transform: translateY(0) rotate(0deg);
  }
  50% {
    transform: translateY(-4px) rotate(0.5deg);
  }
}

/* Staggered Load Classes */
.animate-nav {
  animation: fadeInDown 600ms var(--ease-out-expo) 100ms both;
}

.animate-planet {
  animation: planetRise 1000ms var(--ease-out-expo) 200ms both;
}

.animate-eyebrow {
  animation: fadeInUp 600ms var(--ease-out-expo) 350ms both;
}

.animate-headline {
  animation: fadeInUp 750ms var(--ease-out-expo) 450ms both;
}

.animate-supporting {
  animation: fadeInUp 750ms var(--ease-out-expo) 550ms both;
}

.animate-cta {
  animation: fadeInUp 750ms var(--ease-out-expo) 650ms both;
}

.animate-handwritten {
  animation: fadeInUp 900ms var(--ease-out-expo) 750ms both;
}

.animate-marquee {
  animation: fadeInUp 800ms var(--ease-out-expo) 850ms both;
}

/* Rim Glow Animation Loop */
.rim-sweep-path {
  stroke-dasharray: 600 600;
  animation: rimLightSweep 8s ease-in-out infinite alternate;
}

/* Continuous Service Marquee Track */
.marquee-track {
  display: flex;
  align-items: center;
  width: max-content;
  animation: marqueeLoop 32s linear infinite;
}

.marquee-container:hover .marquee-track {
  animation-play-state: paused;
}