/* Evidentia prototype motion system — scroll reveals, hero entrance, governed-run vignette.
   All motion is gated behind prefers-reduced-motion: no-preference. */

@media (prefers-reduced-motion: no-preference) {

  /* --- Scroll-triggered reveals (auto-tagged by motion.js) --- */
  .reveal {
    opacity: 0;
    transform: translateY(22px);
    transition:
      opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1),
      transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
    transition-delay: var(--reveal-delay, 0ms);
  }
  .reveal.is-visible {
    opacity: 1;
    transform: none;
  }

  /* --- Hero entrance (staged rise on load) --- */
  .hero-enter {
    opacity: 0;
    transform: translateY(18px);
    animation: heroRise 0.9s cubic-bezier(0.16, 1, 0.3, 1) forwards;
    animation-delay: var(--enter-delay, 0ms);
  }
  @keyframes heroRise {
    to { opacity: 1; transform: none; }
  }

  /* --- Ambient hero field (slow emerald drift) --- */
  .drift {
    animation: drift 16s ease-in-out infinite alternate;
  }
  @keyframes drift {
    from { transform: translate3d(-3%, -2%, 0) scale(1); }
    to   { transform: translate3d(3%, 3%, 0) scale(1.07); }
  }

  /* --- Gate pulse (the "paused for a human" beat) --- */
  .gate-pulse {
    animation: gatePulse 1.6s ease-in-out infinite;
  }
  @keyframes gatePulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(217, 119, 6, 0.35); }
    50%      { box-shadow: 0 0 0 7px rgba(217, 119, 6, 0); }
  }

  .vstep, .vstep .vicon, .vstep .vmeta {
    transition: opacity 0.5s ease, background-color 0.5s ease, color 0.5s ease, border-color 0.5s ease;
  }
}

/* --- Vignette step states (apply with or without motion) --- */
.vstep { opacity: 0.45; }
.vstep.is-active, .vstep.is-done, .vstep.is-waiting { opacity: 1; }

.vstep .vicon {
  display: inline-flex; align-items: center; justify-content: center;
  width: 1.75rem; height: 1.75rem; border-radius: 9999px; flex: none;
  border: 1.5px solid #d4d4d8; color: #a1a1aa; background: #fff;
}
.vstep.is-active .vicon  { border-color: #047857; color: #047857; }
.vstep.is-waiting .vicon { border-color: #d97706; color: #d97706; background: #fffbeb; }
.vstep.is-done .vicon    { border-color: #047857; color: #fff; background: #047857; }

.vstep .vcheck, .vstep .vpause { display: none; }
.vstep .vdot { display: block; }
.vstep.is-waiting .vpause { display: block; }
.vstep.is-waiting .vdot   { display: none; }
.vstep.is-done .vcheck    { display: block; }
.vstep.is-done .vdot, .vstep.is-done .vpause { display: none; }

.vstep .vmeta-live { display: none; }
.vstep.show-live .vmeta-live { display: inline; }
.vstep.show-live .vmeta-idle { display: none; }
