/* 選定済みの本文に適用する既定の装飾。
   このファイルは komon.html だけが読み込む。色は site.css のトークンだけを使う。
   寸法の見本は jigyo.html（succession.css）。連番は濃紺の丸ピル、節内の小見出しは
   clamp(19px, 1.75vw, 21px)、締めは上2pxの濃紺、面は「地＋白いベタ面」。 */

/* ── 節見出し ───────────────────────────────────────────────
   near/strong.css の clamp(20px, 2.1vw, 27px) のままだと、1280px で 27px と
   見本（25px）より大きく、狭い幅では逆に小さくなって大小が入れ替わる。
   jigyo と同じ値にそろえる。strong.css は触らずこちらで上書きする。
   理念の見出しは長く2行に割れるので、text-wrap: balance で行長をならす。 */
body.theme-b:not(.page-about) .inheritance .inheritance-section > h3 {
  display: block;
  font-size: clamp(21px, 2.2vw, 25px);
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: 0.03em;
  color: var(--navy);
  margin-bottom: 0.95em;
}
@media (min-width: 840px) {
body.theme-b:not(.page-about) .inheritance .inheritance-section > h3 { text-wrap: balance; }
}

/* ページ冒頭の一文。jigyo の .scn-lead と同じ扱いにして、見出しと節の橋渡しにする。 */
body.theme-b:not(.page-about) .inheritance .kx-lead {
  font-size: clamp(17px, 1.6vw, 19px);
  line-height: 1.75;
  color: var(--navy);
}

/* ── お悩み ⇔ 弊社の強み ─────────────────────────────────────
   白いベタ面のカードを縦に積み、カードの中を左右の対にする。
   列の見出し（お悩み／弊社の強み）はカードの内側の列と同じ割り付けで上に1行。
   840px 未満ではカードが縦積みになるので、列の見出しを消すかわりに
   data-label を各項目の肩に出し、強み側に濃紺の縦線を引いて対を示す
   （site.css の .issue-a が狭い幅で使っている作法と同じ）。 */
body.theme-b:not(.page-about) .inheritance { --kx-card-pad-x: 30px; --kx-pa-indent: 26px; }
body.theme-b:not(.page-about) .inheritance .kx-pair-head { display: none; color: var(--muted); font-size: var(--fs-sm); letter-spacing: 0.1em; padding-bottom: var(--space-3); }
body.theme-b:not(.page-about) .inheritance .kx-pair-list { list-style: none; display: grid; gap: 16px; }
body.theme-b:not(.page-about) .inheritance .kx-pair { display: grid; gap: var(--space-4); background: var(--surface); border-radius: 16px; padding: 26px var(--kx-card-pad-x) 28px; }
body.theme-b:not(.page-about) .inheritance .kx-pq { display: block; font-size: 16.5px; line-height: 1.85; color: var(--muted); }
body.theme-b:not(.page-about) .inheritance .kx-pq::before,
body.theme-b:not(.page-about) .inheritance .kx-pa::before { content: attr(data-label); display: block; margin-bottom: var(--space-1); font-size: var(--fs-sm); letter-spacing: 0.1em; color: var(--muted); }
body.theme-b:not(.page-about) .inheritance .kx-pa { border-left: 1px solid var(--navy); padding-left: var(--space-4); }
body.theme-b:not(.page-about) .inheritance .kx-pa-title { display: grid; grid-template-columns: var(--kx-pa-indent) minmax(0px, 1fr); margin-bottom: var(--gap-tight); font-size: clamp(19px, 1.75vw, 21px); font-weight: 700; line-height: 1.5; letter-spacing: 0.03em; color: var(--navy); }
body.theme-b:not(.page-about) .inheritance .kx-pa-no { color: var(--navy); font-weight: 400; }
body.theme-b:not(.page-about) .inheritance .kx-pa > p { padding-left: var(--kx-pa-indent); font-size: 16.5px; line-height: 1.9; color: var(--ink); }
body.theme-b:not(.page-about) .inheritance .kx-pa > p + p { margin-top: var(--gap-tight); }
@media (min-width: 840px) {
body.theme-b:not(.page-about) .inheritance .kx-pair-head { display: grid; grid-template-columns: minmax(0px, 0.92fr) minmax(0px, 1.28fr); column-gap: var(--space-6a); padding-inline: var(--kx-card-pad-x); }
body.theme-b:not(.page-about) .inheritance .kx-pair-head > span:last-child { grid-column: 2; }
body.theme-b:not(.page-about) .inheritance .kx-pair { grid-template-columns: minmax(0px, 0.92fr) minmax(0px, 1.28fr); column-gap: var(--space-6a); align-items: start; }
body.theme-b:not(.page-about) .inheritance .kx-pq::before,
body.theme-b:not(.page-about) .inheritance .kx-pa::before { content: none; }
body.theme-b:not(.page-about) .inheritance .kx-pa { border-left: 0px; padding-left: 0px; }
}
@media (max-width: 720px) {
body.theme-b:not(.page-about) .inheritance { --kx-card-pad-x: 20px; }
body.theme-b:not(.page-about) .inheritance .kx-pair { padding: 22px var(--kx-card-pad-x) 24px; border-radius: 14px; }
}

/* 節の締めの一文。jigyo の .scn-close と同じ「上2pxの濃紺」にする。
   以前は左3pxの濃紺で、ページ末尾の .kx-vision-last と同じ装飾だった。
   同じ線が1ページで2つの意味を持つと、読み手がどちらの締めか判断できない。 */
body.theme-b:not(.page-about) .inheritance .kx-closing { margin-top: var(--gap-part); padding-top: var(--gap-row); padding-left: 0px; border-left: 0px; border-top: 2px solid var(--navy); font-size: clamp(18px, 1.7vw, 21px); line-height: 1.6; color: var(--navy); max-width: 47em; }

/* ── 手順（顧問変更のためのSTEP／顧問契約締結の流れ）─────────────
   2つの手順は同じ見え方にする。番号は jigyo の作法どおり濃紺の丸ピルにまとめ、
   題を節内の小見出しの大きさに上げる。以前は番号 22px・題 16px で主従が逆だった。
   ①②③④ の文字そのものは先生の原稿なので変えない。 */
/* 先生がお気に入りのデザイン（確認リスト No47 に貼っていただいた画像）。濃紺の短い横線の下に STEP と番号を置き、題はその下。囲みは付けない。 */
body.theme-b:not(.page-about) .inheritance .kx-step-no { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: var(--space-2); width: fit-content; margin-bottom: var(--space-2); padding-top: 18px; color: var(--navy); font-size: clamp(19px, 1.75vw, 21px); font-weight: 700; line-height: 1.6; letter-spacing: 0.06em; font-variant-numeric: tabular-nums; }
body.theme-b:not(.page-about) .inheritance .kx-step-no::before { content: ""; position: absolute; top: 0px; left: 50%; width: 28px; height: 4px; margin-left: -14px; border-radius: 2px; background: var(--navy); }
body.theme-b:not(.page-about) .inheritance .kx-step-word { font-size: inherit; letter-spacing: 0.18em; color: inherit; }
body.theme-b:not(.page-about) .inheritance .kx-step-fig { display: inline-flex; align-items: center; justify-content: center; font-size: inherit; line-height: 1.6; color: inherit; font-variant-numeric: tabular-nums; }
body.theme-b:not(.page-about) .inheritance .kx-step-title { margin-bottom: 0px; font-size: clamp(19px, 1.75vw, 21px); font-weight: 700; line-height: 1.5; letter-spacing: 0.03em; color: var(--navy); }

/* ── 状況別のご提案 ──────────────────────────────────────────
   原稿は「お客様の状況／ご提案」の2列の表。1件ずつの白いカードに分け、
   カードの中を同じ2列に割り付ける。上の見出し行はその列と対応している。
   以前は見出し行が2列、カードが2列グリッドに6枚で、列の対応が読めなかった。 */
body.theme-b:not(.page-about) .inheritance .kx-cases { list-style: none; display: grid; gap: 16px; }
body.theme-b:not(.page-about) .inheritance .kx-legend { display: none; color: var(--muted); font-size: var(--fs-sm); letter-spacing: 0.1em; padding-bottom: var(--space-3); }
body.theme-b:not(.page-about) .inheritance .kx-case { display: grid; grid-template-columns: minmax(0px, 1fr); gap: var(--space-4); padding: 22px var(--kx-card-pad-x) 24px; border: 0px; border-radius: 16px; background: var(--surface); }
body.theme-b:not(.page-about) .inheritance .kx-case-q::before,
body.theme-b:not(.page-about) .inheritance .kx-case-a::before { content: attr(data-label); display: block; margin-bottom: var(--space-1); font-size: var(--fs-sm); letter-spacing: 0.1em; color: var(--muted); }
body.theme-b:not(.page-about) .inheritance .kx-case-q { font-size: 16.5px; line-height: var(--lh-base); color: var(--navy); font-weight: 700; }
body.theme-b:not(.page-about) .inheritance .kx-case-a { font-size: 16.5px; line-height: var(--lh-base); color: var(--ink); font-weight: 400; }
@media (min-width: 840px) {
body.theme-b:not(.page-about) .inheritance .kx-legend { display: grid; grid-template-columns: minmax(0px, 0.92fr) minmax(0px, 1.28fr); column-gap: var(--space-6a); padding-inline: var(--kx-card-pad-x); }
body.theme-b:not(.page-about) .inheritance .kx-legend > span:last-child { grid-column: 2; }
body.theme-b:not(.page-about) .inheritance .kx-case { grid-template-columns: minmax(0px, 0.92fr) minmax(0px, 1.28fr); column-gap: var(--space-6a); align-items: baseline; }
body.theme-b:not(.page-about) .inheritance .kx-case-q::before,
body.theme-b:not(.page-about) .inheritance .kx-case-a::before { content: none; }
}
@media (max-width: 720px) {
body.theme-b:not(.page-about) .inheritance .kx-case { padding: 20px var(--kx-card-pad-x) 22px; border-radius: 14px; }
}

/* ── 税理士へ依頼している主な業務内容（1〜18）────────────────────
   地色の上に細い罫線だけの一覧だと18項目を追いにくく、番号も灰色の極小で
   連番に見えなかった。白いベタ面に載せ、番号は他の節と同じ濃紺の丸ピルにする。
   1〜18 という表記そのものは先生の原稿なので変えない。 */
body.theme-b:not(.page-about) .inheritance .kx-tasks { list-style: none; display: grid; grid-auto-flow: column; grid-template-rows: repeat(18, auto); column-gap: var(--space-6b); background: var(--surface); border-radius: 16px; padding: 8px 30px 10px; }
body.theme-b:not(.page-about) .inheritance .kx-tasks > li { display: grid; grid-template-columns: auto minmax(0px, 1fr); align-items: center; gap: var(--space-3); padding: var(--space-3) 0; border-bottom: 1px solid var(--line); }
body.theme-b:not(.page-about) .inheritance .kx-tasks > li:last-child { border-bottom: 0px; }
body.theme-b:not(.page-about) .inheritance .kx-task-no { display: inline-flex; align-items: center; justify-content: center; min-width: 2.6em; padding: 2px var(--space-2); background: var(--navy); border-radius: var(--radius-pill); color: var(--surface); font-size: var(--fs-xs); font-weight: 700; line-height: 1.7; letter-spacing: 0.06em; font-variant-numeric: tabular-nums; }
body.theme-b:not(.page-about) .inheritance .kx-task-name { font-size: 16.5px; line-height: var(--lh-base); color: var(--ink); text-wrap: pretty; }
@media (min-width: 1024px) {
body.theme-b:not(.page-about) .inheritance .kx-tasks { grid-template-rows: repeat(9, auto); column-gap: var(--space-7); }
body.theme-b:not(.page-about) .inheritance .kx-tasks > li:nth-child(9) { border-bottom: 0px; }
}
@media (max-width: 720px) {
body.theme-b:not(.page-about) .inheritance .kx-tasks { padding: 6px 20px 8px; border-radius: 14px; }
}

/* ── 理念 ───────────────────────────────────────────────────
   読み物なので白い面には載せず、地色のまま置く。最後の一文は濃紺にして
   ページの締めとする。左3pxの縦線は .kx-closing と重複するので外した。 */
body.theme-b:not(.page-about) .inheritance .kx-vision { max-width: 47em; margin-inline: 0px; }
body.theme-b:not(.page-about) .inheritance .kx-vision > p { font-size: 17px; line-height: var(--lh-loose); letter-spacing: 0.02em; color: var(--ink); }
body.theme-b:not(.page-about) .inheritance .kx-vision > p + p { margin-top: 1.75em; }
body.theme-b:not(.page-about) .inheritance .kx-vision > p.kx-vision-last { margin-top: 1.8em; padding-left: 0px; border-left: 0px; font-size: clamp(18px, 1.7vw, 21px); line-height: 1.6; color: var(--navy); }
