/* ==========================================================================
   診療科ページ共通スタイル（department）

   - 対象は投稿メタ `_medisapo_department_page = 1` が立っている singular コンテンツ。
     判定とenqueueは inc/department.php ＋ inc/enqueue.php 側で行う。
     診療科が増えてもこのファイルとenqueue条件は変えない。
   - 全セレクターを .mdp-* 名前空間に閉じる。テーマ共通の .container / .btn /
     .btn-primary には一切依存しない（vk-blocks経由のBootstrap系CSSとの衝突回避）。
   - **訪問診療ページの .msv-*（assets/css/home-visit.css）とは完全に分離する。**
     見た目のトーンは揃えるが、セレクターもファイルも共有しない。片方の調整が
     もう片方へ波及しないようにするため、共通化はCSSの共有ではなく値の一致で行う。
   - alignfull は使わない。page.php / single.php の .site-body-container
     （max-width 1140px）の内側で完結させ、横スクロールを発生させない。

   【詳細度についての注意】
   WordPressコアは .is-layout-flow > * + * { margin-block-start: … } を
   詳細度0-1-0で出力し、その <style id="core-block-supports-inline-css"> は
   テーマがenqueueしたCSSより後ろのhead末尾に置かれる。同詳細度では後勝ちで
   コア側が勝ってしまうため、**このファイルの余白指定はすべて .entry-body を
   前置して詳細度0-2-0にしてある。** セレクターから .entry-body を外すと
   ブロック間の余白がコア既定値に戻るので、リファクタ時に外さないこと。

   【採番について】
   home-visit.css は H2 見出しに自動採番（丸数字）を付けているが、診療科ページは
   セクション内部に 01〜04 の項目採番を持つ構成のため、H2 側は採番しない
   （2種類の採番が同一ページに並ぶのを避ける）。内部採番はCSSカウンターで行い、
   見出しテキストに数字を書かない。管理画面で項目を増減・並べ替えしても崩れない。
   ========================================================================== */

.entry-body {
	--mdp-ink: #2E2A22;
	--mdp-ink-soft: #5C5546;
	--mdp-bg-warm: #FDFBF4;
	--mdp-tint: #F8F5EB;
	--mdp-peach: #F9E3D2;
	--mdp-orange: #EF8F35;
	--mdp-orange-deep: #C86F14;
	--mdp-orange-text: #A85F10;
	--mdp-dark: #2B2620;
	--mdp-line: #E8E2D2;
	--mdp-radius: 14px;
	--mdp-shadow: 0 1px 2px rgba(46, 42, 34, .04);
}

/* コアのブロック間余白を打ち消す（以降のルールで余白を明示的に決める） */
.entry-body .mdp-hero > *,
.entry-body .mdp-section > *,
.entry-body .mdp-card > *,
.entry-body .mdp-cards > *,
.entry-body .mdp-point > *,
.entry-body .mdp-reason > *,
.entry-body .mdp-plans > *,
.entry-body .mdp-plan > *,
.entry-body .mdp-caution > *,
.entry-body .mdp-faq > *,
.entry-body .mdp-faq-a > *,
.entry-body .mdp-cta > *,
.entry-body .mdp-btn-row > * {
	margin-block-start: 0;
	margin-block-end: 0;
}

/* 共通ブロック ------------------------------------------------------------ */
.entry-body .mdp-hero,
.entry-body .mdp-section,
.entry-body .mdp-cta {
	color: var(--mdp-ink);
	line-height: 1.9;
	overflow-wrap: anywhere;
	margin: 0 0 48px;
}

/* 最終CTAはページ末尾のブロックなので自前の下マージンを持たせない
   （最終CTA→共通フッターの余白調整。内訳はファイル末尾「ページ末尾の余白」を参照）。 */
.entry-body .mdp-cta { margin-bottom: 0; }

.entry-body .mdp-hero p,
.entry-body .mdp-section p,
.entry-body .mdp-cta p {
	margin-bottom: 12px;
}

/* FV ---------------------------------------------------------------------- */
.entry-body .mdp-hero {
	background: var(--mdp-bg-warm);
	border: 1px solid var(--mdp-line);
	border-radius: var(--mdp-radius);
	padding: 32px 32px 28px;
}

/* FVの最上段はサービス訴求（キャッチ）。その下に説明本文、最後にCTAという
   優先順位が一目で分かるよう、キャッチだけ文字サイズ・太さ・区切り線で持ち上げ、
   説明本文は本文色（ink-soft）の等倍にしている。 */
.entry-body .mdp-hero-catch {
	margin-bottom: 16px;
	padding-bottom: 14px;
	border-bottom: 2px solid var(--mdp-peach);
	font-size: 1.5em;
	line-height: 1.5;
	font-weight: 700;
	color: var(--mdp-ink);
}

.entry-body .mdp-hero-text {
	color: var(--mdp-ink-soft);
}

.entry-body .mdp-hero-text:last-of-type {
	margin-bottom: 22px;
}

/* セクション見出し -------------------------------------------------------- */
.entry-body .mdp-section-tint {
	background: var(--mdp-tint);
	border-radius: var(--mdp-radius);
	padding: 28px 28px 20px;
}

.entry-body .mdp-h2 {
	margin-bottom: 14px;
	padding-left: 14px;
	border-left: 5px solid var(--mdp-orange);
	font-size: 1.4em;
	line-height: 1.5;
	font-weight: 700;
	color: var(--mdp-ink);
}

.entry-body .mdp-h3 {
	margin-bottom: 8px;
	font-size: 1.05em;
	line-height: 1.6;
	font-weight: 700;
	color: var(--mdp-ink);
}

.entry-body .mdp-lead {
	margin-bottom: 20px;
	color: var(--mdp-ink-soft);
}

.entry-body .mdp-note {
	margin-bottom: 8px;
	font-size: .92em;
	color: var(--mdp-ink-soft);
}

/* カードグリッド ---------------------------------------------------------- */
.entry-body .mdp-cards {
	display: grid;
	gap: 16px;
	margin-bottom: 16px;
}

.entry-body .mdp-cards-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.entry-body .mdp-cards-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }

.entry-body .mdp-card {
	min-width: 0;
	background: #fff;
	border: 1px solid var(--mdp-line);
	border-radius: var(--mdp-radius);
	padding: 20px;
	box-shadow: var(--mdp-shadow);
}

.entry-body .mdp-card p { margin-bottom: 8px; }
.entry-body .mdp-card p:last-child { margin-bottom: 0; }

/* 悩みカード（見出し＋1文） ------------------------------------------------ */
.entry-body .mdp-worry {
	border-left: 4px solid var(--mdp-peach);
}

.entry-body .mdp-worry .mdp-h3 {
	color: var(--mdp-orange-text);
}

/* 番号付き項目（確認したいポイント／選ばれる理由） -------------------------- */
.entry-body .mdp-points-list,
.entry-body .mdp-reasons-list {
	counter-reset: mdp-item;
	display: grid;
	gap: 16px;
	margin-bottom: 16px;
}

.entry-body .mdp-point,
.entry-body .mdp-reason {
	min-width: 0;
	background: #fff;
	border: 1px solid var(--mdp-line);
	border-radius: var(--mdp-radius);
	padding: 20px 20px 20px 24px;
	box-shadow: var(--mdp-shadow);
	position: relative;
}

.entry-body .mdp-point .mdp-h3,
.entry-body .mdp-reason .mdp-h3 {
	margin-bottom: 10px;
	padding-left: 3.1em;
	position: relative;
	min-height: 1.9em;
	display: flex;
	align-items: center;
}

.entry-body .mdp-point .mdp-h3::before,
.entry-body .mdp-reason .mdp-h3::before {
	counter-increment: mdp-item;
	content: counter(mdp-item, decimal-leading-zero);
	position: absolute;
	left: 0;
	top: 0;
	width: 2.4em;
	height: 1.9em;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 999px;
	background: var(--mdp-orange);
	color: #fff;
	font-size: .85em;
	font-weight: 700;
	letter-spacing: .04em;
}

.entry-body .mdp-point p,
.entry-body .mdp-reason p {
	margin-bottom: 8px;
	color: var(--mdp-ink-soft);
}

.entry-body .mdp-point p:last-child,
.entry-body .mdp-reason p:last-child { margin-bottom: 0; }

/* 支援内容カード ---------------------------------------------------------- */
.entry-body .mdp-support .mdp-h3 {
	margin-bottom: 10px;
	padding-bottom: 8px;
	border-bottom: 2px solid var(--mdp-peach);
	color: var(--mdp-orange-text);
	font-size: 1.1em;
}

.entry-body .mdp-support-note {
	margin-top: 14px;
	margin-bottom: 6px;
	font-size: .92em;
	font-weight: 700;
	color: var(--mdp-ink);
}

.entry-body .mdp-list {
	margin: 0;
	padding-left: 1.2em;
	font-size: .95em;
	color: var(--mdp-ink-soft);
}

.entry-body .mdp-list li { margin-bottom: 4px; }
.entry-body .mdp-list li:last-child { margin-bottom: 0; }

/* 料金 -------------------------------------------------------------------- */
.entry-body .mdp-plans {
	display: grid;
	gap: 16px;
	margin-bottom: 16px;
}

.entry-body .mdp-plans-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }

.entry-body .mdp-plan {
	min-width: 0;
	background: #fff;
	border: 1px solid var(--mdp-line);
	border-radius: var(--mdp-radius);
	padding: 22px 20px;
	box-shadow: var(--mdp-shadow);
}

.entry-body .mdp-plan p { margin-bottom: 8px; }
.entry-body .mdp-plan p:last-child { margin-bottom: 0; }

.entry-body .mdp-plan .mdp-h3 {
	margin-bottom: 10px;
	font-size: 1.1em;
}

.entry-body .mdp-price {
	margin-bottom: 4px;
	font-size: 1.3em;
	font-weight: 700;
	color: var(--mdp-orange-deep);
	line-height: 1.5;
}

/* カルテ点検プランの「＋」行。金額2行のあいだに置く独立した段落。 */
.entry-body .mdp-price-plus {
	margin-bottom: 4px;
	font-size: 1em;
	font-weight: 700;
	color: var(--mdp-ink-soft);
	line-height: 1.4;
}

/* プランの箇条書きは金額から少し離す。 */
.entry-body .mdp-plan .mdp-list { margin-top: 12px; }

.entry-body .mdp-plan-quote {
	background: var(--mdp-tint);
	border-left: 4px solid var(--mdp-orange);
}

.entry-body .mdp-plan-quote p {
	margin-bottom: 0;
	color: var(--mdp-ink-soft);
}

.entry-body .mdp-caution {
	background: #fff;
	border: 1px solid var(--mdp-line);
	border-radius: var(--mdp-radius);
	padding: 18px 20px;
	margin-bottom: 20px;
	font-size: .95em;
}

.entry-body .mdp-caution p {
	margin-bottom: 6px;
	color: var(--mdp-ink-soft);
}

.entry-body .mdp-caution p:last-child { margin-bottom: 0; }

/* 関連する診療科カード ---------------------------------------------------- */
.entry-body .mdp-related .mdp-h3 {
	margin-bottom: 8px;
	font-size: 1.08em;
}

.entry-body .mdp-related .mdp-h3 a {
	color: var(--mdp-orange-text);
	text-decoration: none;
}

.entry-body .mdp-related .mdp-h3 a::after {
	content: " →";
	font-weight: 700;
}

.entry-body .mdp-related .mdp-h3 a:hover,
.entry-body .mdp-related .mdp-h3 a:focus {
	color: var(--mdp-orange-deep);
	text-decoration: underline;
}

.entry-body .mdp-related p {
	color: var(--mdp-ink-soft);
	font-size: .95em;
}

/* FAQ --------------------------------------------------------------------- */
.entry-body .mdp-faq {
	background: #fff;
	border: 1px solid var(--mdp-line);
	border-radius: var(--mdp-radius);
	padding: 4px 20px 12px;
}

.entry-body .mdp-faq-q {
	margin-top: 16px;
	margin-bottom: 8px;
	padding-left: 1.7em;
	position: relative;
	font-size: 1em;
	font-weight: 700;
	line-height: 1.6;
}

.entry-body .mdp-faq-q::before {
	content: "Q";
	position: absolute;
	left: 0;
	top: 0;
	color: var(--mdp-orange-text);
	font-weight: 700;
}

/* 回答は複数段落になることがあるためグループブロックにしている
   （管理画面で段落を足しても「A」マークと区切り線は1回だけ出る）。 */
.entry-body .mdp-faq-a {
	margin-bottom: 16px;
	padding: 0 0 16px 1.7em;
	position: relative;
	color: var(--mdp-ink-soft);
	border-bottom: 1px solid var(--mdp-line);
}

.entry-body .mdp-faq-a p {
	margin-bottom: 8px;
	color: var(--mdp-ink-soft);
}

.entry-body .mdp-faq-a p:last-child { margin-bottom: 0; }

.entry-body .mdp-faq-a::before {
	content: "A";
	position: absolute;
	left: 0;
	top: 0;
	color: var(--mdp-ink-soft);
	font-weight: 700;
}

.entry-body .mdp-faq-a:last-child { border-bottom: 0; margin-bottom: 4px; }

/* CTA --------------------------------------------------------------------- */
.entry-body .mdp-cta {
	background: var(--mdp-dark);
	border-radius: var(--mdp-radius);
	padding: 36px 28px 30px;
	text-align: center;
	color: #fff;
}

.entry-body .mdp-cta-title {
	margin-bottom: 12px;
	font-size: 1.3em;
	line-height: 1.6;
	font-weight: 700;
	color: #fff;
	display: block;
}

.entry-body .mdp-cta-lead {
	margin-bottom: 8px;
	color: #E8E2D2;
}

.entry-body .mdp-cta-lead-last {
	margin-bottom: 22px;
	color: #E8E2D2;
}

/* ボタン（coreのwp-block-buttonを名前空間側で上書きする） ------------------ */
.entry-body .mdp-btn-row {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin: 0;
}

.entry-body .mdp-cta .mdp-btn-row,
.entry-body .mdp-btn-row-center { justify-content: center; }

.entry-body .mdp-btn .wp-block-button__link {
	background-color: var(--mdp-orange);
	color: #26190A;
	border-radius: 999px;
	padding: 14px 28px;
	font-weight: 700;
	font-size: 1em;
	line-height: 1.4;
	text-decoration: none;
	box-shadow: 0 4px 14px rgba(200, 111, 20, .25);
}

.entry-body .mdp-btn .wp-block-button__link:hover,
.entry-body .mdp-btn .wp-block-button__link:focus {
	background-color: var(--mdp-orange-deep);
	color: #fff;
}

/* ページ末尾の余白 --------------------------------------------------------
   最終CTA下端 → 共通フッター上端の実測内訳（medisapo 1.1.7時点・PC 1440／SP 390）：

     .mdp-cta の margin-bottom        48px（SP 36px） … 診療科ページ固有
   ＋ .site-body の padding-bottom    40px            … base.css（サイト共通）
   ＋ footer.site-footer の margin-top 60px           … base.css（サイト共通）
   ＝ PC 148px ／ SP 136px

   訪問診療ページ（/home-visit/）も同じ148px／136pxで、診療科ページ固有の不具合ではない。
   このうち診療科ページ側だけで安全に詰められるのは前の2つ。

   - .mdp-cta の下マージン … このファイル内なのでそのまま0にした（上の「CTA」を参照）。
   - .site-body の下パディング … base.css由来だが、body.medisapo-department で
     スコープを限定して上書きする。このファイル内で完結するので他ページには影響しない。
   - footer.site-footer の margin-top 60px … サイト共通の縦リズムのため変更しない。
   - body の padding-bottom（SP 76px）… SP固定CTAバーが本文・フッターを隠さないための
     安全余白。**絶対に変更しない。**

   結果：PC 148px → 76px ／ SP 136px → 76px。 */
body.medisapo-department .site-body {
	padding-bottom: 16px;
}

/* 日本語の改行位置 -------------------------------------------------------- */
/* 日本語は既定でほぼ全ての文字間が改行可能なため、狭い画面では
   「レセプ／ト代行」のように語の途中で割れる。本文・投稿タイトルへ表示専用の
   文字や強制改行を入れず、CSSだけで解消する。

   - 全ブラウザ共通のフォールバック … word-break: keep-all で「・」「、」等の
     区切り位置でのみ改行させ、text-wrap: balance で行長を均す。
   - Chrome / Edge 119+ … @supports で word-break: auto-phrase（文節解析）へ格上げ。
     Safari は preview のみ・Firefox は未対応（2026-09時点）のため、
     keep-all 側が実際のフォールバックになる。

   セレクターはこのファイル（診療科ページ限定enqueue）に閉じているので他ページへ波及しない。 */
.page-header-title,
.entry-body .mdp-hero-catch,
.entry-body .mdp-h2,
.entry-body .mdp-h3,
.entry-body .mdp-cta-title {
	word-break: keep-all;
	text-wrap: balance;
}

@supports (word-break: auto-phrase) {
	.page-header-title,
	.entry-body .mdp-hero-catch,
	.entry-body .mdp-h2,
	.entry-body .mdp-h3,
	.entry-body .mdp-cta-title,
	.entry-body .mdp-cta-lead,
	.entry-body .mdp-cta-lead-last,
	.entry-body .mdp-faq-q,
	.entry-body .mdp-support-note,
	.entry-body .mdp-price {
		word-break: auto-phrase;
	}
}

/* タブレット -------------------------------------------------------------- */
@media (max-width: 900px) {
	.entry-body .mdp-cards-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* スマートフォン ---------------------------------------------------------- */
@media (max-width: 600px) {
	.entry-body .mdp-hero {
		padding: 24px 20px 22px;
	}

	.entry-body .mdp-hero-catch { font-size: 1.25em; padding-bottom: 12px; }

	.entry-body .mdp-section-tint {
		padding: 22px 18px 16px;
	}

	.entry-body .mdp-h2 {
		font-size: 1.22em;
		padding-left: 11px;
		border-left-width: 4px;
	}

	.entry-body .mdp-cards-2,
	.entry-body .mdp-cards-3,
	.entry-body .mdp-plans-2 { grid-template-columns: minmax(0, 1fr); }

	.entry-body .mdp-card,
	.entry-body .mdp-plan { padding: 18px 16px; }

	.entry-body .mdp-point,
	.entry-body .mdp-reason { padding: 18px 16px; }

	.entry-body .mdp-price { font-size: 1.2em; }

	.entry-body .mdp-faq { padding: 4px 16px 12px; }

	.entry-body .mdp-cta {
		padding: 28px 20px 24px;
	}

	.entry-body .mdp-cta-title { font-size: 1.18em; }

	.entry-body .mdp-btn .wp-block-button__link {
		display: block;
		padding: 14px 20px;
	}

	/* 最終CTA（.mdp-cta）はここに含めない。ページ末尾のブロックなので
	   下マージンは0のまま（ファイル中ほどの「ページ末尾の余白」を参照）。 */
	.entry-body .mdp-hero,
	.entry-body .mdp-section { margin-bottom: 36px; }
}