/* 見出しひらひら用キーフレーム */
@keyframes hh-wave-y {
  0%   { opacity:0; transform:rotateY(70deg) translateY(14px); filter:blur(2px); }
  60%  { opacity:1; transform:rotateY(-10deg) translateY(0);  filter:blur(0.5px); }
  100% { opacity:1; transform:rotateY(0deg)  translateY(0);   filter:blur(0); }
}
@keyframes hh-wave-x {
  0%   { opacity:0; transform:rotateX(70deg) translateY(14px); filter:blur(2px); }
  60%  { opacity:1; transform:rotateX(-10deg) translateY(0);   filter:blur(0.5px); }
  100% { opacity:1; transform:rotateX(0) translateY(0);        filter:blur(0); }
}

/* ひらひら（文字） */
[data-reveal-chars] .char {
  display:inline-block;
  opacity:0;
  transform:rotateY(70deg) translateY(14px);
  transform-origin:50% 100%;
  filter:blur(2px);
  transition:opacity .55s ease, filter .55s ease;
}

/* 1行ずつ */
:root { --line-stagger: 90ms; }

[data-reveal-lines] .line {
  display:block;
  opacity:0;
  transform:translateY(0.7em);
  filter:blur(2px);
  transition:opacity .55s ease, transform .65s cubic-bezier(.2,.65,.2,1), filter .65s ease;
}
[data-reveal-lines] .line.in {
  opacity:1;
  transform:translateY(0);
  filter:blur(0);
}

/* 動きを減らす設定の尊重 */
@media (prefers-reduced-motion: reduce) {
  [data-reveal-chars] .char {
    transform:none !important; filter:none !important;
    animation:none !important; transition:opacity .25s ease !important; opacity:1 !important;
  }
  [data-reveal-lines] .line {
    transform:none; filter:none; transition:opacity .25s ease;
  }
}

/* 文字分割の表示安定用 */
.SplitText-line{ display:inline-block; overflow:hidden; }
.charWrap{ display:inline-block; }
.SplitText-srText{display: none;}
.char{ display:inline-block; will-change:contents; pointer-events:none; }
@media (prefers-reduced-motion: reduce) {
  .Menu-pageLinks-link::after{ transition:none; }
}

/* sr-only（スクリーンリーダーのみ読み上げ） */
.SplitText-srText {
  position:absolute !important;
  width:1px;height:1px;
  padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;
}

.SplitText-line { display:inline-block; overflow:hidden; vertical-align:baseline; }
.charWrap { display:inline-block; }
.char { display:inline-block; will-change:contents; pointer-events:none; }

/* hover で発火させたい親（more-btn）に合わせてカーソル */
.more-btn { cursor: pointer; }

/*==================================================
背景色が伸びて出現
===================================*/

/* ▼ 基本：フェードインしながら表示 */
.bgextend{
  animation-name:bgextendAnimeBase;
  animation-duration:1s;
  animation-fill-mode:forwards;
  animation-timing-function: ease-in-out;
  position: relative;
  overflow: hidden; /* はみ出た色要素を隠す */
  opacity:0;
}

@keyframes bgextendAnimeBase{
  from {
    opacity:0;
  }
  to {
    opacity:1;
  }
}

/* ▼ 中の要素：後からフェード表示 */
.bgappear{
  animation-name:bgextendAnimeSecond;
  animation-duration:1s;
  animation-delay: 0.6s;
  animation-fill-mode:forwards;
  animation-timing-function: ease-in-out;
  opacity: 0;
}

@keyframes bgextendAnimeSecond{
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

/* ▼ 左→右に背景色が伸びて縮むアニメ */
.bgLRextend::before{
  animation-name:bgLRextendAnime;
  animation-duration:1s;
  animation-fill-mode:forwards;
  animation-timing-function: ease-in-out;
  background-color: #8D1C17;
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  transform-origin: left;
  transform: scaleX(0); /* ← 初期状態を明示して安定化 */
}

@keyframes bgLRextendAnime{
  0% {
    transform-origin:left;
    transform:scaleX(0);
  }
  50% {
    transform-origin:left;
    transform:scaleX(1);
  }
  50.001% {
    transform-origin:right; /* 起点を切り替え */
  }
  100% {
    transform-origin:right;
    transform:scaleX(0);
  }
}

/* ▼ スクロール開始前は透明 */
.bgappearTrigger,
.bgLRextendTrigger{
  opacity: 0;
}
/* 汎用ベース */
.sweep{
--base-color:transparent;     /* 非表示時（戻る側）の色 */
--fill-color:#111;            /* 表示時に塗る色       */
--sweep-duration:900ms;       /* 速度 */
--easing:cubic-bezier(.22,.61,.36,1);

position:relative; isolation:isolate;
background:var(--base-color);
}
.sweep > *{position:relative; z-index:2} /* コンテンツは最前面 */

/* 入り：塗りレイヤー（下地の上） */
.sweep::before{
content:""; position:absolute; inset:0; z-index:0;
background:var(--fill-color);
transition:transform var(--sweep-duration) var(--easing);
transform:scaleY(0); transform-origin:top; /* dir-*で上書き */
}
.sweep.is-inview::before{ transform:scaleY(1) }

/* 出：戻しレイヤー（塗りの上、コンテンツの下） */
.sweep::after{
content:""; position:absolute; inset:0; z-index:1;
background:var(--base-color);
transition:transform var(--sweep-duration) var(--easing);
transform:scaleY(0); transform-origin:bottom; /* dir-*で上書き */
}
.sweep.is-exiting::after{ transform:scaleY(1) }

/* 方向バリエーション */
.dir-down::before{ transform-origin:top }    /* 入り：上→下 */
.dir-down::after { transform-origin:bottom } /* 出：下→上 */
.dir-up::before  { transform-origin:bottom } /* 入り：下→上 */
.dir-up::after   { transform-origin:top }    /* 出：上→下 */
.dir-right::before{ transform:scaleX(0); transform-origin:left }
.dir-right.is-inview::before{ transform:scaleX(1) }
.dir-right::after { transform:scaleX(0); transform-origin:right }
.dir-right.is-exiting::after{ transform:scaleX(1) }
.dir-left::before{ transform:scaleX(0); transform-origin:right }
.dir-left.is-inview::before{ transform:scaleX(1) }
.dir-left::after { transform:scaleX(0); transform-origin:left }
.dir-left.is-exiting::after{ transform:scaleX(1) }