/* ==========================================================================
   演出 — 正：演出仕様書.md（効果ID単位）
   初期状態を隠す指定は html.fx 配下のみ（JS無効・prefers-reduced-motion では付かない）
   ========================================================================== */
:root { --ease-ogino: cubic-bezier(0, 0.56, 0.44, 1); }

/* ---------- FX-01 セクション出現（荻野：親トリガー＋子の順出し） ---------- */
@keyframes fadeInUp { 0% { opacity: 0; transform: translate3d(0, 30px, 0); } 100% { opacity: 1; transform: translate3d(0, 0, 0); } }
@keyframes fadeInUpMobile { 0% { opacity: 0; transform: translate3d(0, 15px, 0); } 100% { opacity: 1; transform: translate3d(0, 0, 0); } }
.fx [data-fx="up"] { opacity: 0; backface-visibility: hidden; }
.fx .is-shown [data-fx="up"],
.fx [data-fx="up"].is-shown {
  animation-name: fadeInUp;
  animation-duration: 1.2s;
  animation-timing-function: var(--ease-ogino);
  animation-fill-mode: both;
  animation-delay: calc(.3s + (var(--n, 1) - 1) * .1s);
}
@media (max-width: 767px) {
  .fx .is-shown [data-fx="up"],
  .fx [data-fx="up"].is-shown { animation-name: fadeInUpMobile; }
}

/* ---------- FX-02 装飾・背景のフェード（荻野 .c-fade-in） ---------- */
.fx [data-fx="fade"] { opacity: 0; transition: opacity .8s var(--ease-ogino); transition-delay: calc(.3s + (var(--n, 1) - 1) * .1s); }
.fx .is-shown [data-fx="fade"], .fx [data-fx="fade"].is-shown { opacity: 1; }

/* ---------- FX-03 FV写真のズームアウト：2026-09-11 FV写真の削除（ユーザー指示）により廃止 ---------- */

/* ---------- FX-04（2026-09-11 オーナー指示で変更）FV見出しを左からスライドイン
   1行ずつ opacity 0→1・translateX -48px→0（SP は -32px）、1.0s・荻野の ease、2行目は .15s 遅らせる。紙の出現（.2s）の後に開始 ---------- */
.fx .fv__line { opacity: 0; translate: -48px 0; transition: opacity 1s var(--ease-ogino), translate 1s var(--ease-ogino); }
.fx .fv.is-arrived .fv__line { opacity: 1; translate: 0 0; transition-delay: .2s; }
.fx .fv.is-arrived .fv__line + .fv__line { transition-delay: .35s; }
@media (max-width: 767px) { .fx .fv__line { translate: -32px 0; } .fx .fv.is-arrived .fv__line { translate: 0 0; } }
/* ラベルは荻野 .p-index-kv-label__item と同じ opacity .4s（見出しが入った後） */
.fx .fv__label { opacity: 0; transition: opacity .4s; }
.fx .fv.is-arrived .fv__label { opacity: 1; transition-delay: 1.2s; }

/* ---------- FX-14 FVの紙の出現（シンクワイア .js-c-anime-elem：opacity 0→1・translateY 30px→0・.6s） ---------- */
.fx .paper { opacity: 0; translate: 0 30px; transition: opacity .6s, translate .6s; }
.fx .fv.is-arrived .paper { opacity: 1; translate: 0 0; }
.fx .fv.is-arrived .paper--ledger { transition-delay: .12s; }
.fx .fv.is-arrived .paper--report { transition-delay: .24s; }
/* FX-14 を FV の3つのポイントにも適用：見出しの落下が進んだ 1.4s から .12s 刻み */
.fx .fv__point { opacity: 0; translate: 0 30px; transition: opacity .6s, translate .6s; }
.fx .fv.is-arrived .fv__point { opacity: 1; translate: 0 0; }
.fx .fv.is-arrived .fv__point:nth-child(1) { transition-delay: 1.4s; }
.fx .fv.is-arrived .fv__point:nth-child(2) { transition-delay: 1.52s; }
.fx .fv.is-arrived .fv__point:nth-child(3) { transition-delay: 1.64s; }

/* ---------- FX-05 問いかけカード（シンクワイア：.6s） ---------- */
.ask.is-interactive .ask__card { transition: opacity .6s, transform .6s, visibility .6s; }
.ask.is-interactive .ask__circle { transition: opacity .6s, transform .6s; }
.ask.is-interactive .ask__circle.is-hidden { transform: scale(.96); }
.ask.is-interactive .ask__close { transition: opacity .6s, visibility .6s; }

/* ---------- FX-06 番号付きタイムライン（バクラク：トグル opacity .3s） ---------- */
.tl__toggle { transition: opacity .3s; }

/* ---------- FX-07 追従CTA（荻野 .p-global-contact-fixed：右下の円形・読み込み時に opacity 1.6s / delay .2s、外すと即時） ---------- */
.js .sticky { opacity: 0; visibility: hidden; pointer-events: none; transition-property: opacity, visibility; transition-duration: 0s; }
.js .sticky.is-shown { opacity: 1; visibility: visible; pointer-events: auto; }
.fx .sticky.is-shown { transition-duration: 1.6s, 0s; transition-delay: .2s, 0s; }

/* ---------- FX-08 ピルタブ／FX-09 ヘッダー：2026-09-11 要素の削除（ユーザー指示）により廃止 ---------- */

/* ---------- FX-10 線画のふわふわ浮遊（たけだ fuwafuwa：3s ease infinite） ---------- */
@keyframes fuwafuwa { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-10px); } }
@keyframes fuwafuwa2 { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(10px); } }
.fx .illust { animation: fuwafuwa 3s ease 1.5s infinite; }
.fx .point:nth-child(even) .illust { animation-name: fuwafuwa2; }

/* ---------- FX-11 写真のスケールリビール（一色：scale 1.2→1 / 1.8s） ---------- */
.fx [data-fx="photo"] img { opacity: 0; transform: scale(1.2); transition: opacity 1.8s, transform 1.8s; }
.fx [data-fx="photo"].is-in img { opacity: 1; transform: scale(1); }

/* ---------- FX-12 ボタンのホバー反転（一色：.3s cubic-bezier(.45,0,.55,1)） ---------- */
@media (hover: hover) {
  .btn { transition: background-color .3s cubic-bezier(.45, 0, .55, 1), color .3s cubic-bezier(.45, 0, .55, 1), border-color .3s cubic-bezier(.45, 0, .55, 1); }
  .btn--ink:hover { background: var(--white); color: var(--ink); border-color: var(--ink); }
  .fab { transition: background-color .3s cubic-bezier(.45, 0, .55, 1), color .3s cubic-bezier(.45, 0, .55, 1); }
  .fab:hover { background: var(--white); color: var(--ink); }
  .fab:hover::before { border-color: rgba(28,47,78,.35); }
}

/* ---------- FX-13 テキストリンクのホバー（湘南：.3s cubic-bezier(.4,.4,0,1)） ---------- */
@media (hover: hover) {
  .ask__next { transition: opacity .3s cubic-bezier(.4, .4, 0, 1); }
  .ask__next:hover { opacity: .6; }
}

/* 動画のエンドカード：opacity 0→1 .4s（FV ラベルと同じ値。新しい動きの種類は足さない） */
.fx .video__end { opacity: 0; transition: opacity .4s; }
.fx .video__end.is-shown { opacity: 1; }

/* ---------- prefers-reduced-motion：すべて静止 ---------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}