/* =========================================
   Beaver Innovation - Animations
   滚动入场动画
   ========================================= */

[data-animate] {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.8s var(--ease-out), transform 0.8s var(--ease-out);
  will-change: opacity, transform;
}

[data-animate="fade-up"] {
  transform: translateY(40px);
}

[data-animate="fade-down"] {
  transform: translateY(-40px);
}

[data-animate="fade-left"] {
  transform: translateX(40px);
}

[data-animate="fade-right"] {
  transform: translateX(-40px);
}

[data-animate="zoom-in"] {
  transform: scale(0.92);
}

[data-animate].in-view {
  opacity: 1;
  transform: translate(0, 0) scale(1);
}

/* Stagger delays */
[data-delay="100"] { transition-delay: 100ms; }
[data-delay="200"] { transition-delay: 200ms; }
[data-delay="300"] { transition-delay: 300ms; }
[data-delay="400"] { transition-delay: 400ms; }
[data-delay="500"] { transition-delay: 500ms; }
[data-delay="600"] { transition-delay: 600ms; }

/* Hero entrance */
.hero-eyebrow,
.hero-title,
.hero-subtitle,
.hero-tagline,
.hero-actions,
.hero-stats {
  opacity: 0;
  animation: hero-rise 0.9s var(--ease-out) forwards;
}

.hero-eyebrow { animation-delay: 0.1s; }
.hero-title { animation-delay: 0.25s; }
.hero-subtitle { animation-delay: 0.4s; }
.hero-tagline { animation-delay: 0.55s; }
.hero-actions { animation-delay: 0.7s; }
.hero-stats { animation-delay: 0.85s; }

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

/* Decorative animations */
@keyframes glow-pulse {
  0%, 100% { opacity: 0.4; }
  50% { opacity: 0.8; }
}

@keyframes drift {
  0%, 100% { transform: translate(0, 0); }
  50% { transform: translate(20px, -20px); }
}

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

@keyframes data-flow {
  0% { transform: translateX(-100%); }
  100% { transform: translateX(100%); }
}

/* Text shimmer */
.shimmer-text {
  background: linear-gradient(
    90deg,
    var(--color-text-secondary) 0%,
    var(--color-white) 50%,
    var(--color-text-secondary) 100%
  );
  background-size: 200% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: shimmer 3s linear infinite;
}

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

/* Hover lift */
.hover-lift {
  transition: transform var(--transition-base), box-shadow var(--transition-base);
}

.hover-lift:hover {
  transform: translateY(-6px);
  box-shadow: var(--shadow-lg);
}

/* Tech border (for cards) */
.tech-border {
  position: relative;
}

.tech-border::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--color-cyan), transparent);
  transition: width 0.6s var(--ease-out);
}

.tech-border:hover::after {
  width: 100%;
}