@charset "UTF-8";
/* ============================================================
   neural-bg.css  背景のトーン（ニューラルネットワーク）
   ------------------------------------------------------------
   ニューロン＝節、シナプス＝節をつなぐ線。線の上の小さな明点が
   行き来している信号。柄は make_neural_bg.py で作っている。

   ★このファイルは「後から丸ごと外せる」ことを前提にしている
     外す  ：python neural_bg.py off   全ページの link を外す。見た目は元どおり
     戻す  ：python neural_bg.py on
     状態  ：python neural_bg.py

   ★柄の濃さを変えたいとき
     make_neural_bg.py の o_line（線）／o_node（節）／o_sig（信号）の
     数値を変えて、python make_neural_bg.py を実行し直す。
     数値を下げるほど薄くなる。

   ★重ねる場所
     明るい面（本文・ミスト地・パンくず）→ 紺の線の柄
     濃紺の面（ヒーロー・下層の帯・CTA・数字帯・フッター）→ 白い線の柄
     白地のカードや表には敷かない。内容を読みやすく保つため。
   ============================================================ */

:root{
  --neural-size:760px 560px;
}

/* ------------------------------------------------------------
   1. 明るい面
   背景色は元のまま。その上に柄を重ねる。
   background-attachment:fixed にすることで、ページ全体に1枚の網が
   広がっているように見える（節がセクションの境目で途切れない）。
   ------------------------------------------------------------ */
body,
.sec-mist,
.crumb{
  background-image:url("../img/neural-light.svg");
  background-repeat:repeat;
  background-size:var(--neural-size);
  background-attachment:fixed;
  background-position:center top;
}

/* ------------------------------------------------------------
   2. 濃紺の面
   ------------------------------------------------------------ */
.hero,
.page-head,
.cta,
.numbers,
.ftr{
  background-image:url("../img/neural-dark.svg");
  background-repeat:repeat;
  background-size:var(--neural-size);
  background-attachment:fixed;
  background-position:center top;
}

/* ヒーローには元から方眼の線が入っている。
   柄と二重になって騒がしくなるので、方眼側を消す。 */
.hero-grid{display:none}

/* 下層ページの帯は ::after の濃紺グラデーションが柄を覆うため、
   わずかに透かして柄を見せる。 */
.page-head::after{opacity:.94}

/* ------------------------------------------------------------
   3. 端末ごとの調整
   ------------------------------------------------------------ */
@media(max-width:1000px){
  /* 固定背景は端末によって描画が重くなるため、ふつうの追従に切り替える */
  body,.sec-mist,.crumb,
  .hero,.page-head,.cta,.numbers,.ftr{
    background-attachment:scroll;
  }
  :root{--neural-size:560px 420px}
}

/* 印刷時は柄を出さない */
@media print{
  body,.sec-mist,.crumb,
  .hero,.page-head,.cta,.numbers,.ftr{background-image:none}
}

/* ------------------------------------------------------------
   4. 電気信号（neural-signal.js が作る canvas）
   ------------------------------------------------------------
   画面に貼りつく1枚の板。背景の線の上を光が走る。
   ヘッダー（z-index:50）とドロワー（49）より下に置くので、
   メニューの上には出ない。操作は素通りさせる。
   ------------------------------------------------------------ */
.neural-signal{
  position:fixed;
  inset:0;
  z-index:40;
  pointer-events:none;
  mix-blend-mode:normal;
}
@media(max-width:1000px){ .neural-signal{display:none} }
@media(prefers-reduced-motion:reduce){ .neural-signal{display:none} }
@media print{ .neural-signal{display:none} }