/* ============================================================
   shiritsu-k.css ── 私立小・国立小LP（shiritsu/index.html 専用・V17）
   出典: V17_shiritsu改稿設計.md（§4）。施主口頭レビュー 2026-07-22。
   思想: h1が他トップと比べ大きすぎ／節の上下余白が過多／日本語斜体の廃止／
         領域グリッドは列でなく行方向／作り手言葉の排除。
   規範: 色・寸法は tokens.css の var() のみ参照（clamp 値は jukengo-k.css 前例に倣う）。
         site.css の後に読み込む。全て .sh-page スコープ。
   ============================================================ */

/* 4-1. ヒーロー見出しの縮小（--fs-hero は最大75px。他トップと比べ大きすぎ＝施主指摘） */
.sh-page .lane-hero h1 { font-size: clamp(28px, 4.6vw, 54px); }

/* G-A 孤立行対策: 改行後に1〜3字の孤立行を作らない。本文は最終行の調整をブラウザに任せる
   （jukengo-k.css 前例。text-wrap:pretty は日本語のぶら下がりに効く。未対応環境は現状維持で劣化なし）。 */
.sh-page p,
.sh-page li,
.sh-page dt,
.sh-page dd,
.sh-page blockquote { text-wrap: pretty; }

/* 4-2. 余白の圧縮（節の上下が空きすぎ＝施主指摘。境界が読めるだけの余白は残す）
   規範6「セクション縦paddingは --sp-section 系のみ・任意値禁止」に従い、em直値でなく
   トークン --sp-section を このページスコープで小さめに再定義する（元 clamp(80px,12vh,140px)）。
   .section も .selection（.section 併用）も同じトークンを参照するため一括で縮む。 */
.sh-page { --sp-section: clamp(56px, 8vh, 96px); }
.sh-page .chapter-head { margin-bottom: 1.4em; }
.sh-page .section-lead { margin-bottom: 1.6em; }

/* 4-3. 領域グリッド → 行方向（列でなく行で3つ＝施主指摘。HTML側は .domain-grid → .domain-rows へ）
   h3 を固定幅、p を可変にして「1行=1項目」として読ませる。 */
.sh-page .domain-rows { display: flex; flex-direction: column; gap: 1em; }
.sh-page .domain-rows .domain-item { display: flex; gap: 1.4em; align-items: baseline; }
.sh-page .domain-rows .domain-item h3 { flex: 0 0 9em; }
.sh-page .domain-rows .domain-item p { margin-top: 0; }

/* 4-4. コースは二つ（発表会・コンクール単独の通い方はない＝施主指摘。events は下部リンクへ降格） */
/* G-D(2026-07-22 施主指示): 講座系は全站「行要素」に統一（列カードをやめ全幅の行を縦積み） */
.sh-page .course-grid { display: flex; flex-direction: column; gap: 1.2em; max-width: 44em; }

/* 4-5. blockquote 直下の「言葉の力」定義リンク行 */
.sh-page .bq-link { text-align: center; margin-top: 1.2em; }

/* C-3 ヒーロー内の定義リンク（.lead 直後の独立行） */
.sh-page .hero-link { margin-top: 1.4em; }

/* C-9 国際校セクション冒頭の対象者ラベル（.eyebrow は lane-hero 限定のため専用に用意） */
.sh-page .intl-target {
  font-family: var(--font-gothic);
  font-weight: 700;
  font-size: var(--fs-small);
  letter-spacing: var(--ls-label);
  color: var(--alpe-gold);
  margin-bottom: 1em;
}

/* §5-3 表示確認用サンプル事例の注記（実例でない旨を小字で明示） */
.sh-page .sample-note {
  display: block;
  font-size: var(--fs-small);
  color: var(--alpe-ink-faint);
  margin-top: .5em;
}

/* 320px級の微調整（jukengo-k.css 前例に倣う） */
@media (max-width: 22em) {
  .sh-page .lane-hero h1 { font-size: 22px; }
  /* 狭幅では領域アイテムを縦積みに戻す（h3固定幅だと p が潰れるため） */
  .sh-page .domain-rows .domain-item { flex-direction: column; gap: .3em; }
  .sh-page .domain-rows .domain-item h3 { flex: none; }
}