@charset "UTF-8";
/* ================================================================
   スクロールアニメーション（Motion One + Lenis）本実装
   - 発火: 要素が画面内に入ったら（Motion の inView）
   - 指定: HTML側の data-anim="種類" ほか（下記API）
       data-anim         : fade / fade-up / fade-down / fade-left / fade-right / zoom-in / zoom-out
       data-anim-delay   : 遅延（秒）例 0.15
       data-anim-mode    : once（既定）/ replay（画面外で初期化し再入場で再生）
       data-anim-stagger : 親に付与。子の [data-anim] を順番に（値=間隔秒／省略時0.1）
   - JS無効時: opacity:0 が掛からず通常表示（下の js-motion ガード）
   - reduced-motion時: アニメOFF（即表示）
   ================================================================ */

/* --- Lenis 推奨スタイル（PCのみ慣性スクロール） --- */
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-smooth [data-lenis-prevent] { overscroll-behavior: contain; }
.lenis.lenis-stopped { overflow: clip; }
.lenis.lenis-smooth iframe { pointer-events: none; }

/* --- reveal 初期状態 ---
   JSが付与する html.js-motion がある時だけ opacity を伏せる（JS無効なら表示のまま）。
   reduced-motion 指定時は隠さない（＝アニメ無しで即表示）。
   transform/scale は JS 側でキーフレーム指定するので、ここは opacity のみ。 */
@media (prefers-reduced-motion: no-preference) {
  html.js-motion [data-anim] {
    opacity: 0;
    will-change: transform, opacity;
  }
}