/* 全ページ共通の上書き（2026-09-26 ui-layout-review で追加）
   根拠: ~/.claude/site-layout-regulation.md（§1-9b・9c・10、§2c、§4）と ~/.claude/article-ui-regulation.md（§1-6、§4、§5）。
   各ページの <style> の直後に読み込み、ページごとの値より後から効かせる。色は各ページの既存の色（紺・薄いグレー・青）だけを使う。 */
:root{--fp-navy:#0B1228;--fp-paper2:#F4F6FA;--fp-line:rgba(17,21,31,.12);--fp-accent:#3B5BDB}

/* ページ背景を真っ白にしない（§1-9c） */
html,body{background:var(--fp-paper2)}

/* ヘッダーは不透明にする（§1-10） */
header{background:var(--fp-navy)}

/* 記事・運営方針のページ: 本文を白い面に載せる */
.article{padding-left:clamp(8px,2vw,24px);padding-right:clamp(8px,2vw,24px)}
.article>.wrap{background:#fff;border:1px solid var(--fp-line);border-radius:16px;
  padding-top:clamp(24px,4vw,48px);padding-bottom:clamp(28px,4vw,48px);
  padding-left:clamp(18px,4vw,48px);padding-right:clamp(18px,4vw,48px)}

/* 記事の本文は18px・行送り2.0（§2c） */
.article .prose p,.article .prose li,.article .lead,.article .faq-block p,.article .lede-answer{font-size:1.125rem!important;line-height:2!important}

/* h2 は薄いグレーの帯＋左の青い線（記事規約 §4） */
.article h2{background:var(--fp-paper2)!important;border-left:4px solid var(--fp-accent)!important;
  border-radius:0 8px 8px 0;padding:.55rem .9rem!important}
.article .prompt-block h2,.article section[style*="background:var(--paper-2)"] h2{background:#fff!important}
/* 紺色の相談の枠（CTA）の中の見出しは帯を付けない（面そのものが帯の役割） */
.article .cta h2{background:none!important;border:none!important;padding:0!important;border-radius:0}

/* 表の見出し行は紺地に白文字、本文の行は縞（記事規約 §5） */
.article table th{background:var(--fp-navy)!important;color:#fff!important;border-bottom-color:var(--fp-navy)!important}
.article table tr:nth-child(even) td{background:var(--fp-paper2)}

/* コラム一覧: 一覧の面は薄いグレー、カードは白 */
body:not(:has(.hero)) section.columns{background:var(--fp-paper2)}

/* カードのサムネイル（各記事の共有画像。§4） */
.col-card__thumb{display:block;width:100%;height:auto;aspect-ratio:1200/630;object-fit:cover;
  border-radius:10px;border:1px solid var(--fp-line);margin:0 0 1rem;background:var(--fp-paper2)}

/* カードの並び: PCは3列・タブレットは2列・スマホは1列（初めの1.5画面に6件以上。§4） */
.col-grid{display:grid;gap:18px;grid-template-columns:repeat(3,minmax(0,1fr))!important}
@media(max-width:1020px){.col-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:640px){.col-grid{grid-template-columns:1fr!important}}
.col-card h3{font-size:1.1rem!important;line-height:1.6!important}
.col-card__sub{font-size:1rem;line-height:1.7;color:#4A5060;margin:.35rem 0 .7rem}

/* ヘッダーの「お問い合わせ」ボタンの文字は白（青地に対するコントラスト。§2c-2） */
.nav__cta{color:#fff!important}

/* 記事の表の1列目（条件の名前）を細くしすぎない */
.article .table-scroll table td:first-child{min-width:8.5em}
/* 横スクロールの枠に入っていない古い表は、表そのものを横スクロールにする（320pxの横はみ出し対策） */
.article table:not(.table-scroll table){display:block;max-width:100%;overflow-x:auto}

/* トップの見出し:左の線と帯（記事規約 §4 をトップの節見出しにも） */
.sec-head .bar{display:none}
.sec-head h2{background:#EAEEFB;border-left:4px solid var(--fp-accent);border-radius:0 8px 8px 0;padding:.35rem .8rem}

/* トップの冒頭は、何の会社かが分かる高さに収める（§1-9b: 1440pxで260px以下、390pxで380px以下） */
.hero{padding-top:30px!important;padding-bottom:30px!important}
.hero .badge,.hero__visual{display:none!important}
.hero__inner{grid-template-columns:1fr!important}
.hero h1{font-size:clamp(1.75rem,3.2vw,2.75rem)!important;line-height:1.35!important}
.hero__lead{max-width:none!important;margin-top:.7rem!important;font-size:1rem!important;line-height:1.7!important}
.hero__cta{margin-top:.8rem!important}

/* 会社の数字の帯（冒頭の外に出した） */
.stats-strip{background:var(--fp-paper2);padding:28px 0}
.stats-strip .hero__stats{margin-top:0!important;padding-top:0!important;border-top:none!important}
.stats-strip .stat .n{color:var(--fp-navy)!important}
.stats-strip .stat .l{color:#4A5060!important}
.stats-strip .stat .l{word-break:keep-all}
@media(max-width:560px){
  .stats-strip .hero__stats{grid-template-columns:1fr!important;gap:.5rem!important}
  .stats-strip .stat{display:flex;align-items:baseline;gap:.9rem}
  .stats-strip .stat .l{margin-top:0!important}
}
#profile{background:var(--fp-paper2)}