/* ============================================
   一凡 SPACE — Animations
   ============================================ */

/* ---- Fade Up (Logo elements entering) ---- */
@keyframes fade-up {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* ---- Gentle Drift (Video fallback) ---- */
@keyframes gentle-drift {
  0%, 100% {
    transform: scale(1.05) translate(0, 0);
  }
  50% {
    transform: scale(1.08) translate(-1%, 0.5%);
  }
}

/* ---- Breathe (Red dot pulse) ---- */
@keyframes breathe {
  0%, 100% {
    box-shadow: 0 0 8px rgba(230, 138, 120, 0.3);
    opacity: 0.8;
  }
  50% {
    box-shadow: 0 0 20px rgba(230, 138, 120, 0.6);
    opacity: 1;
  }
}

/* ---- Scroll Reveal ---- */
.scroll-reveal {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity var(--duration-slow) var(--ease-gentle),
              transform var(--duration-slow) var(--ease-gentle);
}

.scroll-reveal.revealed {
  opacity: 1;
  transform: translateY(0);
}

/* Staggered children */
.scroll-reveal-stagger > * {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity var(--duration-slow) var(--ease-gentle),
              transform var(--duration-slow) var(--ease-gentle);
}

.scroll-reveal-stagger.revealed > *:nth-child(1) { transition-delay: 0ms; opacity: 1; transform: translateY(0); }
.scroll-reveal-stagger.revealed > *:nth-child(2) { transition-delay: 100ms; opacity: 1; transform: translateY(0); }
.scroll-reveal-stagger.revealed > *:nth-child(3) { transition-delay: 200ms; opacity: 1; transform: translateY(0); }
.scroll-reveal-stagger.revealed > *:nth-child(4) { transition-delay: 300ms; opacity: 1; transform: translateY(0); }
.scroll-reveal-stagger.revealed > *:nth-child(5) { transition-delay: 400ms; opacity: 1; transform: translateY(0); }
.scroll-reveal-stagger.revealed > *:nth-child(6) { transition-delay: 500ms; opacity: 1; transform: translateY(0); }

/* ---- Water Wave SVG ---- */
.water-wave-path {
  stroke-dasharray: 1000;
  stroke-dashoffset: 1000;
  transition: stroke-dashoffset 2.5s var(--ease-gentle);
}

.water-wave-path.revealed {
  stroke-dashoffset: 0;
}

/* ---- Red Dot Breathing ---- */
.red-dot {
  animation: breathe 3.5s var(--ease-gentle) infinite;
}

/* ---- Logo Story Highlight ---- */
.logo-story__item {
  opacity: 0.5;
  transition: opacity var(--duration-normal) var(--ease-gentle),
              border-color var(--duration-normal) var(--ease-gentle),
              color var(--duration-normal) var(--ease-gentle);
}

.logo-story__item.highlight {
  opacity: 1;
}

/* ---- Reduced Motion Override ---- */
@media (prefers-reduced-motion: reduce) {
  .scroll-reveal,
  .scroll-reveal-stagger > *,
  .logo-story__item {
    opacity: 1;
    transform: none;
    transition: none;
  }

  .hero__logo,
  .hero__title,
  .hero__subtitle,
  .hero__tags,
  .hero__cta {
    opacity: 1;
    animation: none;
  }

  .red-dot {
    animation: none;
  }

  .water-wave-path {
    stroke-dashoffset: 0;
    transition: none;
  }
}