/*
 * /role（看板＝社外の事業推進責任者）固有スタイル。
 * 版面の正＝下層サブページ標準形（common/css/subpage.css）。本ファイルは /role 固有の
 * 署名ビジュアル「weave 図版」（散らばる外注先→ひとつの窓口→御社）だけを定義する。
 * 旧・左スパイン型ロングリードの版面定義（.role-hero/.role-section/.role-split 等）は
 * 標準形への作り直し（2026-06-30）で撤去。共通部品・レイアウトは tokens/base/common/subpage に集約。
 */

/* ===== S4 weave＝「間に落ちる役割」を束ねる図版（墨×白・文書内の図として静かに置く） ===== */
.role-weave{max-width:560px; margin:34px auto 6px; padding:0;}
/* 相関図はsec-mainの外（section直下）・グリッド1列目＝本文カラムの中央に置く。
   全幅（1 / -1）中央だと右レール150px分だけ本文より右に寄って見える＝代表指摘（2026-07-19）で1列目へ変更。
   SPは920px以下でグリッドが1カラム化するため挙動不変。
   width:100%必須＝グリッドアイテムはmargin:autoがあると内容依存幅になり、中のSVGが既定300pxへ縮むため */
.sub-doc > section > .role-weave{grid-column:1; width:100%;}
.role-weave svg{width:100%; height:auto; overflow:visible; display:block;}
.role-weave .lnk{fill:none; stroke:var(--ink); stroke-width:1.25; opacity:.26;}
.role-weave .lnk.r{stroke:var(--red); opacity:.86; stroke-width:1.9;}
.role-weave .nd,
.role-weave .client{fill:var(--ink);}
.role-weave .hubn,
.role-weave .arrow{fill:var(--red);}
.role-weave .hub-ring{fill:none; stroke:var(--red); stroke-width:1.4; opacity:.45;}
.role-weave text{font-family:var(--sans); fill:var(--ink); font-weight:700; font-size:22px;}
.role-weave text.s{fill:var(--ink-sub); font-weight:500; font-size:15px;}
.role-weave .hublab{font-family:var(--serif); fill:var(--ink); font-weight:600; font-size:24px;}
.role-weave .hubsub{fill:var(--red); font-weight:600; font-size:18px;}
.role-weave .clientlab{font-family:var(--serif); font-size:22px; fill:var(--ink); font-weight:600;}
.role-weave .flow circle{fill:var(--ink);}
.role-weave .flow .back{fill:var(--ink-sub);}
.role-weave .flow .forward{fill:var(--red);}

@media(max-width:860px){
  .role-weave{margin-top:28px;}
}

/* 動きを減らす設定では、流れる玉（SMIL）を止める */
@media(prefers-reduced-motion:reduce){
  .role-weave .flow{display:none;}
}