/* 下層ページ（/for-professionals/・/disease/*）専用。トークンは theme.css の :root を使う（角丸0・影0・アイコン0。新しい色・サイズは定義しない） */
.page { background: var(--c-kinari); }

/* パンくず（2階層。区切りは装飾なので読み上げない） */
.crumb { padding-block: var(--sp-4); }
.crumb__list {
  list-style: none; display: flex; flex-wrap: wrap; align-items: center;
  max-width: var(--wide); margin: 0 auto; padding: 0 var(--gutter);
  font-size: var(--fs-small); line-height: 1.5; color: var(--c-text-muted);
}
.crumb li { display: inline-flex; align-items: center; min-height: 44px; margin: 0; }
.crumb li + li::before { content: "／"; content: "／" / ""; margin-inline: var(--sp-2); color: var(--c-text-muted); }
.crumb a { display: inline-flex; align-items: center; min-height: 44px; color: var(--c-text); }

/* ページ見出し（H1 は H2 と同じ段で静かに置く。英字は小さなラベルのみ） */
.page-head { padding-block: var(--sp-5) var(--sp-8); }
.page-head__eyebrow {
  margin: 0 0 var(--sp-3);
  font-family: var(--f-serif); font-size: var(--fs-small); line-height: 1.4; letter-spacing: .16em;
  text-transform: uppercase; color: var(--c-text-muted);
}
.page-head h1 {
  margin: 0;
  font-family: var(--f-serif); font-weight: 500; font-size: var(--fs-h2); line-height: var(--lh-heading);
  letter-spacing: .06em; color: var(--c-text);
  text-wrap: balance; word-break: auto-phrase;
}
.page-head__lead {
  max-width: 30em; margin: var(--sp-6) 0 0;
  font-family: var(--f-serif); font-weight: 500; font-size: var(--fs-lead); line-height: var(--lh-lead);
  letter-spacing: .02em; color: var(--c-text);
  text-wrap: pretty; word-break: auto-phrase;
}
.page-head__lead::before {
  content: ""; display: block; width: 28px; height: var(--accent-rule);
  margin-bottom: var(--sp-4); background: var(--c-terra);
}

/* 罫線区切りのリスト（リンクではない）。.dlist の見た目に寄せる */
.checklist { list-style: none; margin: 0 0 var(--sp-6); padding: 0; border-top: var(--rule-strong); }
.checklist li { margin: 0; padding: var(--sp-4) 0; border-bottom: var(--rule); line-height: var(--lh-body); }

@media (min-width: 768px) {
  .page-head { padding-block: var(--sp-6) var(--sp-9); }
}

@media (min-width: 1024px) {
  /* .sec__grid と同じ列: 左 200px、右に本文列。H1 とリードを右列に置き、セクションの本文列と左端を揃える */
  .page-head__inner {
    display: grid; align-items: start;
    grid-template-columns: 200px minmax(0, var(--measure));
    column-gap: calc(var(--sp-7) + var(--sp-2));
  }
  .page-head__eyebrow { grid-column: 1; grid-row: 1 / span 2; margin: 0; padding-top: var(--sp-2); }
  .page-head h1, .page-head__lead { grid-column: 2; }
}