@charset "UTF-8";
/* =========================================================
   パレット単体：案B（紺）
   ---------------------------------------------------------
   :root の変数だけを出力する。出力先は assets/css/palette-navy.css。
   本体（assets/css/style.css）の**後ろ**に読み込むこと。
   色を足すときは scss/palette/ の3ファイル全部に足す。
   1つでも欠けると、その変数を使う宣言が丸ごと無効になる。
   ========================================================= */
/* =========================================================
   パレット：案B 紺（chiba-sougou_palette_v1.md §3）
   ---------------------------------------------------------
   §3-2 の核：紺一色の階調で章を分けない。「生成り」だけを紺に
   差し替え、白い箱は白のまま残す。明度差が 0.042 → 1.0 になり、
   章の切れ目が一目で分かる。

   §3-3 の2段構え：文字色は一律に反転できない。ここでは
   :root に紺の上の値を置き、白い箱の中だけ最後のブロックで
   明るい地のときの並びに戻している。カスタムプロパティは
   継承するので、子孫ひとつずつにセレクタを当てる必要はなく、
   !important も要らない。
   ========================================================= */
:root {
  /* ---------- 面（地） ---------- */
  --bg: #1B2431;
  --bg2: #202937; /* body が参照するのはこちら */
  --panel: #26313F;
  --surface: #FFFFFF; /* 白のまま残す箱（§3-2） */
  --band-blend: #202937;
  --band-works: #243040;
  --band-founder: #202937;
  --band-service: #202937;
  --band-head: #243040; /* 下層ヘッダーの下地・メガメニューの窓 */
  --band-contact: #FFFFFF; /* §3-2：CONTACT の電話ボックスは白箱 */
  /* ---------- 罫線 ---------- */
  --line: #38434F;
  --line-form: #38434F;
  --line-list: #38434F;
  --line-fact: #38434F;
  --line-flow: #38434F;
  --line-panel: #38434F;
  --thumb-rgb: 255, 255, 255;
  /* 明るい地に重ねる白の薄膜は、紺の上では白い箱になってしまう
     （その上に淡い文字が乗って読めなくなる）。紺側は少し明るい
     紺で受ける。→ §5 のコントラスト検証で確認済み */
  --veil-rgb: 38, 49, 63;
  /* ---------- 文字（紺の上）----------
     §3-4：見出しは寒色寄りの白 #EFF3F7、本文 #C8D0D9、補足 #9CA6B0。
     クリーム #E9E5DC を紺に置くと濁るので使わない。 */
  --t-1: #EFF3F7;
  --t-2: #EFF3F7;
  --t-3: #EFF3F7;
  --t-4: #EFF3F7;
  --t-5: #EFF3F7;
  --t-6: #C8D0D9;
  --t-7: #C8D0D9;
  --t-8: #C8D0D9;
  --t-9: #C8D0D9;
  --t-10: #C8D0D9;
  --t-11: #C8D0D9;
  --t-12: #C8D0D9;
  --t-13: #C8D0D9;
  --t-14: #C8D0D9;
  --t-15: #C8D0D9;
  --t-16: #C8D0D9;
  --t-17: #C8D0D9;
  --t-18: #C8D0D9;
  --t-19: #A3ABB4;
  --t-20: #C8D0D9;
  --t-21: #9CA6B0;
  --t-22: #9CA6B0;
  --t-23: #9CA6B0;
  --t-24: #9CA6B0;
  --t-25: #9CA6B0;
  --t-26: #9CA6B0;
  --text: var(--t-2);
  --muted: var(--t-19);
  --placeholder: #9CA6B0; /* 紺地に置く場合。実際の入力欄は白なので下で戻す */
  /* ---------- 文字（暗い面の上）---------- */
  --on-dark: #FFFFFF;
  --on-dark-rgb: 255, 255, 255;
  --on-dark-1: #EFF3F7;
  --on-dark-2: #A9B1B9;
  --on-dark-3: #9CA6B0;
  --on-dark-4: #9CA6B0;
  --on-dark-5: #9CA6B0;
  --on-band-1: #EFF3F7;
  --on-band-2: #EFF3F7;
  --band-line-rgb: 156, 166, 176;
  --footer-line-rgb: 169, 177, 185;
  --loader-sub: rgba(156, 166, 176, .85);
  --ba-arrow-fg: #EFF3F7; /* 丸の地（--bg）と --ink が同値なので、
  --ink のままだと矢印が地に溶けて消える */
  --loader-disc: #2C3A4C; /* §3-5：地色 #1B2431 より明るいスレート。
  同系で暗くすると幕そのものが消える */
  /* ---------- 地の上に置くベタのボタン ----------
     紺では --ink（#1B2431）が地とほぼ同値になり、ボタンの輪郭が
     消えて押せる要素に見えなくなる。ここだけ金のベタで受ける。
     §3-6 の「金の CTA はロゴと競合する」はヘッダー限定の指摘なので、
     白いヘッダーの上の .cta-head は紺のまま据え置く。
     枠は面と同色にして、生成り側の白い縁が紺で浮かないようにする。 */
  --btn-solid-bg: #C9A76A;
  --btn-solid-bg-h: #DFC38E;
  --btn-solid-fg: #161E27;
  --btn-solid-bd: #C9A76A;
  /* ---------- 白いボタン（写真の上）----------
     §3-6：CTA を金にするとロゴの金と競合する。写真の上の
     ボタンだけ金で受け、ヘッダーの CTA は紺のベタ。 */
  --btn-light-bg: #C9A76A;
  --btn-light-bg-h: #DFC38E;
  --btn-light-bd: #C9A76A;
  --btn-light-fg: #161E27;
  /* ---------- 紺のベタ面 ---------- */
  --ink: #1B2431; /* CTA・送信ボタン・ローダーの円盤・電話番号の文字 */
  --ink2: #31425A; /* ホバー */
  --ink-band: #101821; /* 追加サービスの帯 */
  --ink-deep: #131A23; /* フッター */
  --ink-veil: 15, 21, 28; /* 写真に重ねる幕。§3-5 の考え方で地色より暗く */
  --card-veil: 15, 21, 28;
  /* ---------- 影 ---------- */
  --shadow-rgb: 27, 36, 49;
  --shadow-panel-rgb: 15, 21, 28;
  --shadow-card-rgb: 15, 21, 28;
  /* ---------- 金 ----------
     §3-4：金だけは輝度で振らず色相を維持する。
     輝度で振ると金が灰色になり、アクセントが全部死ぬ。 */
  --gold: #C9A76A;
  --gold-l: #E0C591;
  --gold-rgb: 201, 167, 106;
  --gold-kicker: #E0C591;
  --gold-add: #C9A76A;
  --gold-add-l: #C9A76A;
  --gold-arrow: #C9A76A;
  --gold-num: #DFC38E;
  --gold-em: #DFC38E;
  --gold-brand: #DFC38E;
  --gold-fact: #DFC38E;
  --gold-i: #C9A76A;
  --gold-h4: #DFC38E;
  --gold-price: #C9A76A;
  --gold-label: #C9A76A;
  --gold-d: #C9A76A;
  --gold-sub: #9CA6B0;
  --gold-icon: #C9A76A;
  /* ---------- 状態 ----------
     紺の上では現行の赤・緑が沈んで読めないので、明度を上げてある。
     色の意味（赤＝エラー／緑＝完了）は変えていない。 */
  --state-err: #E8938A;
  --state-err-bd: #7C4C46;
  --state-err-fg: #E8938A;
  --state-ok-bd: #4C6E55;
  --state-ok-fg: #A6D2B3;
  --badge-any: #6C7683;
}

/* =========================================================
   §3-3　白い箱の中だけ、明るい地のときの並びに戻す
   ---------------------------------------------------------
   ここに挙げた箱は白のまま残す（§3-2）。中の文字と罫線だけを
   生成りのときの値へ差し戻す。背景（--band-head など）は
   戻さない：メガメニューの窓は紺のままが正しい。
   ========================================================= */
.header,
.nav-panel,
.flow,
.info-strip,
.strength-copy,
.contact-box:not(.dark),
.drawer-tel,
.drawer-close,
.wpcf7 input,
.wpcf7 select,
.wpcf7 textarea {
  --t-1: #2d2925;
  --t-2: #342f2a;
  --t-3: #3b352e;
  --t-4: #3d3731;
  --t-5: #4a433b;
  --t-6: #4e473f;
  --t-7: #4f473e;
  --t-8: #504940;
  --t-9: #5d564d;
  --t-10: #5f584f;
  --t-11: #60564b;
  --t-12: #615a50;
  --t-13: #625b52;
  --t-14: #635c53;
  --t-15: #665f57;
  --t-16: #675f56;
  --t-17: #6a6259;
  --t-18: #6b645b;
  --t-19: #6d665d;
  --t-20: #6e675e;
  --t-21: #777063;
  --t-22: #786f64;
  --t-23: #7b7469;
  --t-24: #7d7466;
  --t-25: #7D7467;
  --t-26: #8b8275;
  /* --text / --muted は :root の時点で値が確定するので、--t-* を
     戻しただけでは追随しない（白い箱の中で白い文字のままになる）。
     同じ別名をここで宣言し直して、上の並びを参照させる。 */
  --text: var(--t-2);
  --muted: var(--t-19);
  --placeholder: #7a7267; /* 白い入力欄の上で 4.74:1 */
  --line: #e7e0d5;
  --line-form: #ddd3c3;
  --line-list: #d8cdbf;
  --line-fact: #ded6ca;
  --line-flow: #e3d9c8;
  --line-panel: #efe9dd;
  --gold-num: #976D32;
  --gold-em: #b18b56;
  --gold-brand: #ab7f3c;
  --gold-fact: #aa824b;
  --gold-i: #a67f49;
  --gold-h4: #a08a5f;
  --gold-price: #9f7a45;
  --gold-label: #9d7c4e;
  --gold-d: #8c6a38;
  --gold-sub: #81745E;
  --gold-icon: #8e7f6a;
  --gold-arrow: #c0a582;
}

/* ---------------------------------------------------------
   文字色そのものも一度置き直す
   ---------------------------------------------------------
   color は「計算済みの色」として継承されるので、上のブロックで
   --t-* を戻しても、箱の中まで降りてこない。自前で色を指定して
   いない部品（INFO のアイコンは currentColor、ドロワーの電話番号
   は継承）が、白い箱の上で紺地用の白のまま残ってしまう。
   置く値は生成りのときと同じなので、現行・案A との差は出ない。
   .contact-box は自前で --t-1 を持っているため触らない。
   .nav-panel も外す：メガメニューは .nav の --t-9 を継いでいるので、
   ここで --text を置くと生成りのときより濃い色になってしまう。
   --------------------------------------------------------- */
.header,
.flow,
.info-strip,
.strength-copy,
.drawer-tel {
  color: var(--text);
}
