@charset "UTF-8";
/* =======================================================
【3208｜TOP：猫マスク移管（クローン無し版）】
目的：
- mw-intro を上に残したまま、猫穴で mw-section1 を見せる
- 余韻：穴を 5倍まで拡大して「全開」を作る
- 戻り（逆スクロール）対応
依存：
- .mw-intro
- .mw-section1
- .mw-wipe-gap（section1直前のスペーサー）
======================================================= */

.home .mw-intro{
  position: relative;
  z-index: 2;
  will-change: transform, -webkit-mask-size, mask-size;
}

.home .mw-section1{
  position: relative;
  z-index: 1;
  will-change: transform;
}

/* 演出中：クリック等は全部無効（スクロールだけ通す） */
.home.mw-wipe-active .mw-intro,
.home.mw-wipe-active .mw-section1{
  pointer-events: none !important;
}

/* 演出中だけマスクを有効化（逆マスク画像はJSで注入） */
.home.mw-wipe-active .mw-intro{
  -webkit-mask-image: var(--mw-wipe-mask-image);
  mask-image: var(--mw-wipe-mask-image);

  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;

  -webkit-mask-position: center;
  mask-position: center;

  -webkit-mask-size: var(--mw-wipe-mask-size, 1px) var(--mw-wipe-mask-size, 1px);
  mask-size: var(--mw-wipe-mask-size, 1px) var(--mw-wipe-mask-size, 1px);

  -webkit-mask-mode: alpha;
  mask-mode: alpha;
}

/* フォールバック（猫マスク生成失敗時）：丸穴 */
.home.mw-wipe-fallback .mw-intro{
  -webkit-mask-image: radial-gradient(circle, transparent 0 65%, #000 66%);
  mask-image: radial-gradient(circle, transparent 0 65%, #000 66%);
}

/* 低モーション環境では無効化 */
@media (prefers-reduced-motion: reduce){
  .home.mw-wipe-active .mw-intro{
    -webkit-mask-image: none !important;
    mask-image: none !important;
    -webkit-mask-size: auto !important;
    mask-size: auto !important;
  }
}