/* =============================================
   ANIMATIONS — Scroll Reveals, Hero Entrance
   ============================================= */

/* ---- Base reveal state (hidden) ---- */
.reveal {
  opacity: 0;
  transition: opacity 0.6s ease;
}

/* ---- Visible state ---- */
.reveal--visible {
  opacity: 1;
}

/* ---- Moss & Stone: Gentle fade only ---- */
[data-theme="moss-stone"] .reveal {
  transform: none;
  transition: opacity 0.8s ease;
}

/* =============================================
   HERO ENTRANCE ANIMATION
   ============================================= */

/* All hero content waits for page load */
.hero__content,
.hero__scroll-indicator {
  opacity: 0;
  transition: opacity 0.8s ease;
}

.loaded .hero__content {
  opacity: 1;
}

.loaded .hero__scroll-indicator {
  opacity: 1;
  transition-delay: 1.2s;
}

/* ---- Moss & Stone: Gentle fade ---- */
[data-theme="moss-stone"] .hero__title {
  opacity: 0;
  transition: opacity 1s ease 0.4s;
}

[data-theme="moss-stone"] .loaded .hero__title {
  opacity: 1;
}

/* =============================================
   REDUCED MOTION
   ============================================= */

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }

  .reveal {
    opacity: 1;
    transform: none;
  }

  .hero__content,
  .hero__scroll-indicator,
  .hero__title {
    opacity: 1;
    transform: none;
  }
}