/* ============ FX layer (全ページ共通) ============ */

/* カスタムカーソル */
@media(hover:hover) and (pointer:fine){
  .cur-dot{position:fixed;top:0;left:0;width:8px;height:8px;border-radius:50%;background:#1E2A52;z-index:2001;pointer-events:none;transform:translate(-50%,-50%)}
  .cur-ring{position:fixed;top:0;left:0;width:42px;height:42px;border-radius:50%;border:1px solid rgba(30,42,82,.35);z-index:2000;pointer-events:none;transform:translate(-50%,-50%);transition:width .35s cubic-bezier(.22,1,.36,1),height .35s cubic-bezier(.22,1,.36,1),border-color .35s,background .35s}
  .cur-ring.is-link{width:64px;height:64px;background:rgba(30,42,82,.05);border-color:rgba(177,138,60,.9)}
  .cur-ring.is-dark{border-color:rgba(255,255,255,.6)}
}

/* フィルムグレイン */
.grain{position:fixed;inset:-100%;width:300%;height:300%;pointer-events:none;z-index:1999;opacity:.02;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='240' height='240'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");animation:grainShift 9s steps(10) infinite}
@keyframes grainShift{0%,100%{transform:translate(0,0)}10%{transform:translate(-4%,-6%)}20%{transform:translate(-10%,3%)}30%{transform:translate(5%,-8%)}40%{transform:translate(-3%,9%)}50%{transform:translate(-8%,-3%)}60%{transform:translate(7%,2%)}70%{transform:translate(-2%,6%)}80%{transform:translate(4%,-4%)}90%{transform:translate(-6%,7%)}}

/* 巨大アウトライン文字 */
.giant{position:absolute;top:-.14em;right:-.04em;font-family:'Outfit',sans-serif;font-weight:700;font-size:clamp(96px,17vw,250px);line-height:1;color:transparent;-webkit-text-stroke:1.5px rgba(42,76,168,.13);letter-spacing:.02em;pointer-events:none;white-space:nowrap;z-index:0;user-select:none}
.giant.light{-webkit-text-stroke-color:rgba(255,255,255,.12)}

/* ボタン:塗りがスライドするホバー */
.btn{position:relative;overflow:hidden;isolation:isolate}
.btn::before{display:none}
.btn:hover::before{transform:translateX(0) skewX(0)}
.btn-ghost::before,.btn-white::before{background:rgba(217,164,65,.25)}

/* WebGLキャンバス */
.gl-canvas{position:absolute;inset:0;width:100%;height:100%;display:block;z-index:0;pointer-events:none}

/* リンクの下線ホバー(汎用) */
.u-line{background-image:linear-gradient(currentColor,currentColor);background-size:0% 1.5px;background-repeat:no-repeat;background-position:left bottom;transition:background-size .45s cubic-bezier(.22,1,.36,1)}
.u-line:hover{background-size:100% 1.5px}

@media(prefers-reduced-motion:reduce){
  .grain{display:none}
  .cur-dot,.cur-ring{display:none}
}

/* UX底上げ */
:focus-visible{outline:2px solid #B18A3C;outline-offset:3px;border-radius:2px}
[id]{scroll-margin-top:96px}

/* ============ セクション英字:線で描かれる大型タイポ ============ */
.sec-en{display:block;width:100%;overflow:visible;margin:6px 0 16px}
.sec-en text{font-family:'Outfit',sans-serif;font-weight:600;letter-spacing:.05em;
  fill:rgba(30,42,82,0);stroke:#24439E;stroke-width:1.1;stroke-linejoin:round;
  stroke-dasharray:640;stroke-dashoffset:640;opacity:.9;
  transition:stroke-dashoffset 2.4s cubic-bezier(.22,1,.36,1),fill 1s ease 1.9s}
.sec-en.draw text{stroke-dashoffset:0;fill:rgba(30,42,82,.05)}
.reason .sec-en text,.sec-en.light text{stroke:rgba(255,255,255,.75);fill:rgba(255,255,255,0)}
.reason .sec-en.draw text,.sec-en.light.draw text{fill:rgba(255,255,255,.06)}
@media(prefers-reduced-motion:reduce){
  .sec-en text{stroke-dashoffset:0;fill:rgba(30,42,82,.05);transition:none}
}