/* 相続税・贈与税のコラムだけの柔らかい書式（2026-10-17 嶋田さんが見本Aを選択）。
   50〜60代以上の方に読んでいただく前提: 丸ゴシック（相続サイト /souzoku/ と同じ Zen Maru Gothic と緑）・本文17px・行間2。
   柔らかくしても文字の色は薄くしない（年配の方には薄い文字が読みにくい）。
   src/lib/articles.ts（softenWrapper）がページ見出しに .artSoftHd、本文に .artSoft を付け、このファイルをテーマの CSS の後に読ませる */
.artSoftHd, .artSoft {
  --sf-ink: #2e3a35; --sf-sub: #5d6b64; --sf-green: #3f6e55; --sf-green2: #5c8f74; --sf-deep: #2f5641;
  --sf-pale: #e7f0e9; --sf-pale2: #f4f8f5; --sf-line: #cfe0d4; --sf-line2: #dfeae2; --sf-dot: #9cc3ad;
  --sf-font: "Zen Maru Gothic", "Hiragino Maru Gothic ProN", "Noto Sans JP", sans-serif;
}

/* ---- ページ見出し: ビルの写真と紺の帯をやめ、淡い緑の角丸の帯 ---- */
.pageHeader.artSoftHd { height: auto; margin-bottom: 32px !important; }
.pageHeader.artSoftHd .img { display: none; }
.pageHeader.artSoftHd .content,
.pageHeader.artSoftHd .content:has(.title.long) {
  position: static; display: block; width: auto; min-width: 0; max-width: 1160px; height: auto; min-height: 0; margin: 0 auto;
  background: var(--sf-pale); color: var(--sf-deep); border-radius: 0 0 28px 28px; text-align: left;
  padding: 34px clamp(20px, 5vw, 56px) 26px;
}
.artSoftHd .artSoftCat {
  display: block; width: fit-content; margin: 0 auto 12px 0; padding: 2px 14px; border-radius: 999px; background: #fff;
  color: var(--sf-green); font-family: var(--sf-font); font-weight: 700; font-size: 13px; line-height: 1.7; letter-spacing: .04em;
}
.pageHeader.artSoftHd .content .title,
.pageHeader.artSoftHd .content .title.long {
  font-family: var(--sf-font); font-weight: 700; font-size: clamp(22px, 3.2vw, 30px); line-height: 1.55;
  color: var(--sf-deep); margin: 0; text-wrap: pretty;
}
.pageHeader.artSoftHd .content #breadcrumb { position: static; margin: 16px 0 0; justify-content: flex-start; text-align: left; }
.pageHeader.artSoftHd .content #breadcrumb,
.pageHeader.artSoftHd .content #breadcrumb * { color: var(--sf-green); font-size: 13px; font-family: var(--sf-font); }

/* ---- 本文 ---- */
.editable.artSoft { font-family: var(--sf-font); color: var(--sf-ink); }
.editable.artSoft > p:not([class]),
.editable.artSoft > ul > li,
.editable.artSoft > ol > li {
  font-family: var(--sf-font); font-weight: 500; font-size: 17px; line-height: 2; color: var(--sf-ink);
}
.editable.artSoft > ul > li::before { background: var(--sf-green2); width: 8px; height: 8px; top: 1em; }
.editable.artSoft strong { color: var(--sf-deep); }
.editable.artSoft > p a, .editable.artSoft > ul a, .editable.artSoft > ol a { color: var(--sf-green); }

/* 見出し: 淡い緑の角丸の帯＋丸い点（h2）・点線の下線（h3） */
.editable.artSoft h2 {
  font-family: var(--sf-font); font-weight: 700; font-size: clamp(19px, 2.2vw, 23px); line-height: 1.55; color: var(--sf-deep);
  background: var(--sf-pale); border-radius: 14px; padding: 12px 18px 12px 42px; margin: 2.4em 0 1.1em; letter-spacing: .01em;
}
.editable.artSoft h2::before {
  left: 18px; top: calc(12px + .775em - 6px); transform: none; width: 12px; height: 12px; border-radius: 50%; background: var(--sf-green2);
}
.editable.artSoft h3 {
  font-family: var(--sf-font); font-weight: 700; font-size: clamp(18px, 2vw, 20px); line-height: 1.55; color: var(--sf-green);
  border-bottom: 2px dotted var(--sf-dot); padding: 0 0 6px; margin: 2em 0 .9em; letter-spacing: .02em;
}

/* 日付・執筆者・目次 */
.editable.artSoft .art-meta { font-family: var(--sf-font); color: var(--sf-sub); border-bottom-color: var(--sf-line); font-size: 14px; }
.editable.artSoft .art-toc { background: var(--sf-pale2); border: none; border-radius: 18px; }
.editable.artSoft .art-toc__title { font-family: var(--sf-font); color: var(--sf-green); letter-spacing: .06em; }
.editable.artSoft .art-toc ol:not(#breadcrumb) li { font-family: var(--sf-font); font-size: 16px; line-height: 1.75; }
.editable.artSoft .art-toc a { color: var(--sf-ink); border-bottom: 1px dotted var(--sf-dot); }
.editable.artSoft .art-toc a:hover { color: var(--sf-green); border-color: var(--sf-green); }

/* 表: 角の丸い淡い緑 */
.editable.artSoft table { border-collapse: separate; border-spacing: 0; width: 100%; border: 1px solid var(--sf-line); border-radius: 14px; overflow: hidden; margin: 1em 0 1.4em; }
.editable.artSoft th, .editable.artSoft td {
  font-family: var(--sf-font); font-size: 15.5px; line-height: 1.75; color: var(--sf-ink); text-align: left; vertical-align: top;
  border: none; border-bottom: 1px solid var(--sf-line2); padding: 10px 12px;
}
.editable.artSoft tr:last-child > th, .editable.artSoft tr:last-child > td { border-bottom: none; }
.editable.artSoft th { background: var(--sf-pale); color: var(--sf-deep); font-weight: 700; }

/* 執筆者・相談の案内 */
.editable.artSoft .art-author { border-color: var(--sf-line); border-radius: 18px; }
.editable.artSoft .art-author__label { color: var(--sf-sub); }
.editable.artSoft .art-author__name { color: var(--sf-ink); }
.editable.artSoft .art-cta { background: var(--sf-green); border-radius: 18px; }
.editable.artSoft .art-cta__text { color: var(--sf-pale); }
.editable.artSoft .art-btn { color: var(--sf-deep); border-radius: 999px; font-family: var(--sf-font); }
.editable.artSoft .art-btn.is-line { color: #fff; border-color: #a9cbb6; }

@media screen and (max-width: 768px) {
  .pageHeader.artSoftHd { margin-bottom: 24px !important; }
  .pageHeader.artSoftHd .content,
  .pageHeader.artSoftHd .content:has(.title.long) { border-radius: 0 0 22px 22px; padding: 26px 20px 20px; }
  .editable.artSoft h2 { padding: 11px 14px 11px 36px; border-radius: 12px; }
  .editable.artSoft h2::before { left: 15px; top: calc(11px + .775em - 6px); width: 11px; height: 11px; }
  .editable.artSoft th, .editable.artSoft td { padding: 9px 10px; font-size: 15px; }
}
