/* --- Reveal animation --- */
.reveal {
    opacity: 0;
    transform: translate3d(0, 16px, 0);
    transition:
      opacity .6s ease,
      transform .6s cubic-bezier(.2,.65,.3,1);
    will-change: opacity, transform;
  }
  .reveal[data-dir="left"]  { transform: translate3d(-28px, 0, 0); }
  .reveal[data-dir="right"] { transform: translate3d( 28px, 0, 0); }
  .reveal[data-dir="up"]    { transform: translate3d( 0, 28px, 0); }
  .reveal[data-dir="down"]  { transform: translate3d( 0,-28px, 0); }

  .reveal.in-view {
    opacity: 1;
    transform: translate3d(0,0,0);
  }

  /* per-element delay via CSS var */
  .reveal[data-delay] { transition-delay: var(--reveal-delay, 0ms); }

  /* アクセシビリティ: OSの「視差効果を減らす」設定を尊重 */
  @media (prefers-reduced-motion: reduce) {
    .reveal {
      opacity: 1;
      transform: none;
      transition: none;
    }
  }