/* WHITE CHROME — motion.css : reveal / parallax の初期姿勢と reduced-motion */

/* reveal 初期状態（JS が is-in を付与して発火） */
[data-reveal] { opacity: 0; transition: opacity .8s var(--ease), transform .8s var(--ease); will-change: opacity, transform; }
[data-reveal="fade-up"] { transform: translateY(28px); }
[data-reveal="fade-left"] { transform: translateX(-28px); }
[data-reveal="fade-right"] { transform: translateX(28px); }
[data-reveal="fade-in"] { transform: none; }
[data-reveal="scale-soft"] { transform: scale(.94); }
[data-reveal="mask"] { opacity: 1; clip-path: inset(0 100% 0 0); transition: clip-path 1s var(--ease); }
[data-reveal].is-in { opacity: 1; transform: none; }
[data-reveal="mask"].is-in { clip-path: inset(0 0 0 0); }

/* 段階表示（stagger は JS が --d を注入） */
[data-reveal-group] > * { opacity: 0; transform: translateY(26px); transition: opacity .7s var(--ease), transform .7s var(--ease); transition-delay: var(--d, 0ms); will-change: opacity, transform; }
[data-reveal-group].is-in > * { opacity: 1; transform: none; }

/* パララックス対象は transform を JS が書き換える */
[data-parallax] { will-change: transform; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { 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; clip-path: none !important; }
  [data-parallax] { transform: none !important; }
  .hero__glow, .hero__plate { transform: none !important; }
}