/* =============================================================================
   reveal.css - The Reveal Pattern (C0 · Spec §4) - SITE-WIDE ENTRANCE CONTRACT
   Depends on tokens.css. Entrance = toggling .is-visible on an already-laid-out
   node. NEVER mount-then-animate. Stagger via per-element --reveal-delay.
   ============================================================================= */

.reveal {
  opacity: 0;
  transform: translateY(var(--reveal-distance));
  transition: opacity var(--dur-slow) var(--ease),
              transform var(--dur-slow) var(--ease);
  transition-delay: var(--reveal-delay, 0ms);
  will-change: opacity, transform;
}
.reveal.is-visible { opacity: 1; transform: none; }

/* Directional variants (still opacity+transform only - GPU compositable) */
.reveal--left  { transform: translateX(calc(-1 * var(--reveal-distance))); }
.reveal--right { transform: translateX(var(--reveal-distance)); }
.reveal--scale { transform: scale(0.96); }
.reveal--left.is-visible,
.reveal--right.is-visible,
.reveal--scale.is-visible { transform: none; }

/* Stagger helpers - set on children of a revealing group (no JS churn) */
.stagger > *  { --reveal-delay: 0ms; }
.stagger > :nth-child(2) { --reveal-delay: 80ms; }
.stagger > :nth-child(3) { --reveal-delay: 160ms; }
.stagger > :nth-child(4) { --reveal-delay: 240ms; }
.stagger > :nth-child(5) { --reveal-delay: 320ms; }
.stagger > :nth-child(6) { --reveal-delay: 400ms; }
.stagger > :nth-child(7) { --reveal-delay: 480ms; }
.stagger > :nth-child(8) { --reveal-delay: 560ms; }

@media (prefers-reduced-motion: reduce) {
  .reveal, .reveal--left, .reveal--right, .reveal--scale {
    opacity: 1; transform: none; transition: none;
  }
}