/* shared/reveal.css — 捲動進場動畫（scroll reveal）
   用法：
   - 單一元素：class="reveal"（可加 style="--d:1" 控制延遲層級）
   - 群組（子元素依序進場）：容器加 class="reveal-group"
   自動尊重「減少動態」系統偏好（prefers-reduced-motion）。 */

@media (prefers-reduced-motion: no-preference) {
  .reveal,
  .reveal-group > * {
    opacity: 0;
    transform: translateY(22px);
    transition: opacity .6s ease, transform .6s cubic-bezier(.22, .61, .36, 1);
  }

  .reveal {
    transition-delay: calc(var(--d, 0) * 90ms);
  }

  /* 方向變體：from-left / from-right / from-up / zoom；群組可加 alt（左右交錯） */
  .reveal.from-left,  .reveal-group.from-left  > * { transform: translateX(-32px); }
  .reveal.from-right, .reveal-group.from-right > * { transform: translateX(32px); }
  .reveal.from-up,    .reveal-group.from-up    > * { transform: translateY(-22px); }
  .reveal.zoom,       .reveal-group.zoom       > * { transform: scale(.94); }
  .reveal-group.alt > *:nth-child(odd)  { transform: translateX(-32px); }
  .reveal-group.alt > *:nth-child(even) { transform: translateX(32px); }

  .reveal.is-in,
  .reveal-group.is-in > * {
    opacity: 1;
    transform: none;
  }

  /* 群組子元素：依序錯開進場（最多 6 個，夠用就好） */
  .reveal-group.is-in > *:nth-child(1) { transition-delay: 0ms; }
  .reveal-group.is-in > *:nth-child(2) { transition-delay: 90ms; }
  .reveal-group.is-in > *:nth-child(3) { transition-delay: 180ms; }
  .reveal-group.is-in > *:nth-child(4) { transition-delay: 270ms; }
  .reveal-group.is-in > *:nth-child(5) { transition-delay: 360ms; }
  .reveal-group.is-in > *:nth-child(6) { transition-delay: 450ms; }
  .reveal-group.is-in > *:nth-child(7) { transition-delay: 540ms; }
  .reveal-group.is-in > *:nth-child(8) { transition-delay: 630ms; }
}
