/* =========================================================
   KYABEL SITE 64 — motion.css
   reveal（fade-right 基調＝採寸線が引かれる方向）＋ stagger。
   1回再生（is-in で確定）。reduce では全停止（初期表示＝可視）。
   ========================================================= */
[data-reveal] {
  opacity: 0;
  transform: translateX(-22px);
  transition: opacity .72s var(--ease), transform .72s var(--ease);
  transition-delay: var(--d, 0ms);
  will-change: opacity, transform;
}
[data-reveal="fade-up"]    { transform: translateY(26px); }
[data-reveal="fade-left"]  { transform: translateX(22px); }
[data-reveal="fade-in"]    { transform: none; }
[data-reveal="scale-soft"] { transform: scale(.965); }

[data-reveal].is-in { opacity: 1; transform: none; }

/* グループ子要素の段階表示（stagger 60〜100ms） */
[data-reveal-group] > * {
  opacity: 0; transform: translateX(-18px);
  transition: opacity .66s var(--ease), transform .66s var(--ease);
}
[data-reveal-group].is-in > * { opacity: 1; transform: none; }
[data-reveal-group].is-in > *:nth-child(1) { transition-delay: 40ms; }
[data-reveal-group].is-in > *:nth-child(2) { transition-delay: 120ms; }
[data-reveal-group].is-in > *:nth-child(3) { transition-delay: 200ms; }
[data-reveal-group].is-in > *:nth-child(4) { transition-delay: 280ms; }
[data-reveal-group].is-in > *:nth-child(5) { transition-delay: 360ms; }
[data-reveal-group].is-in > *:nth-child(6) { transition-delay: 440ms; }
[data-reveal-group].is-in > *:nth-child(7) { transition-delay: 520ms; }
[data-reveal-group].is-in > *:nth-child(8) { transition-delay: 600ms; }

/* パララックス層の初期状態（JS が transform を上書き） */
[data-parallax] { will-change: transform; }

@media (prefers-reduced-motion: reduce) {
  * { animation-duration: .001ms !important; animation-iteration-count: 1 !important;
      transition-duration: .001ms !important; scroll-behavior: auto !important; }
  [data-reveal], [data-reveal-group] > * { opacity: 1 !important; transform: none !important; }
  [data-parallax] { transform: none !important; }
}