/* animation.css
   フェードインアニメーション共通定義
   使い方:
     data-fadein="up"    下から上へ
     data-fadein="down"  上から下へ
     data-fadein="left"  右から左へ
     data-fadein="right" 左から右へ
     data-fadein="fade"  フェードのみ
   オプション:
     data-fadein-delay="0.2"  遅延秒数
     data-fadein-duration="0.8" アニメーション秒数
*/

/* ── 初期状態（非表示） ──────────────────────────── */
[data-fadein] {
  opacity: 0;
  transition-property: opacity, transform;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 0.7s;
}

[data-fadein="up"]    { transform: translateY(32px); }
[data-fadein="down"]  { transform: translateY(-32px); }
[data-fadein="left"]  { transform: translateX(32px); }
[data-fadein="right"] { transform: translateX(-32px); }
[data-fadein="fade"]  { transform: none; }

/* ── 発火後（表示） ─────────────────────────────── */
[data-fadein].is-visible {
  opacity: 1;
  transform: translate(0, 0);
}

/* ── ヘッダーナビ アニメーション ─────────────────── */
.site-nav--pc .site-nav__item {
  opacity: 0;
  transform: translateY(-8px);
  transition: opacity 0.4s ease, transform 0.4s ease;
}
.site-header--ready .site-nav__item {
  opacity: 1;
  transform: translateY(0);
}

/* ナビ項目を順番にずらす */
.site-nav--pc .site-nav__item:nth-child(1) { transition-delay: 0.05s; }
.site-nav--pc .site-nav__item:nth-child(2) { transition-delay: 0.10s; }
.site-nav--pc .site-nav__item:nth-child(3) { transition-delay: 0.15s; }
.site-nav--pc .site-nav__item:nth-child(4) { transition-delay: 0.20s; }
.site-nav--pc .site-nav__item:nth-child(5) { transition-delay: 0.25s; }

/* ── アクセシビリティ：アニメーション無効設定尊重 ── */
@media (prefers-reduced-motion: reduce) {
  [data-fadein],
  .site-nav__item {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}