/* hux-bind.css — Tailwind由来部品(.hux)をサイトの意匠へ束縛する。
 *
 * ★これは正本。ensure-component-css.js が本番ページへ、render-check-hux.js が検査土台へ、
 *   同じこのファイルを読み込む。2箇所に書き写すと検査と本番がずれる。
 *
 * ★.lgx(旧テーマ基盤 module-base.css)とは別系統。float グリッドは一切継承しない。
 *   .lgx を併用すると .lgx .col{float:left} が flex/grid に勝って全列が全幅化する。
 *
 * 効き方: 部品CSS側は `.<key> .text-sm{...}`(クラス2つ=0,2,0)、ここは `.hux p`(0,1,1)。
 *   ユーティリティを明示的に持つ要素は部品の意匠が勝ち、持たない素の要素だけがここで揃う。
 *   = 「見出しの表情は部品ごと・本文の読み心地はサイト統一」という .lgx と同じ方針。 */

/* フォント: 部品側はフォントを持たない(--font-sans は変換時に --font-body へ束縛済み)が、
   素の要素がブラウザ既定に落ちるのを防ぐ。 */
.hux, .hux * { font-family: var(--font-body); }
.hux h1, .hux h2, .hux h3, .hux h4, .hux dt { font-family: var(--font-heading); }

/* 本文サイズ(design.md No.35 タイポSSOT)。ユーティリティ未指定の素の要素だけに効く。 */
.hux p, .hux li, .hux dd, .hux td, .hux th, .hux figcaption { font-size: var(--fs-body); line-height: 1.8; }

/* 見出しスケールの2段階統一 (2026-07-24 ユーザー確定)。.lgx 側(ensure-component-css.js)と同じ規則。
   Tailwind は text-3xl 等でサイズをクラスに焼き込む(詳細度0,2,0)ので !important で束縛する。
   is-section-head の付与は scripts/mark-section-heads.js。 */
.hux h2 { font-size: var(--fs-mod-title) !important; }
.hux h3, .hux h4 { font-size: var(--fs-h3) !important; }
.hux .is-section-head { font-size: var(--fs-h2) !important; }

/* 写真サイズ上限(design.md No.17)。Tailwind部品は h-56/h-full 等を自前で持つが、
   器が伸びると青天井になるため .lgx と同じ上限で抑える。 */
.hux img { max-height: 460px; }

/* 素背景の保証(design.md No.12/No.13と同型): 部品は自前の面色を持つが、面色が付かない
   ルート直下に置かれたとき、写真背景セクションの上に乗ると文字が透ける。
   .hux は独立セクションとして素背景の上に置く契約なので、背景色を明示しておく。 */
.hux { background-color: var(--color-bg); }
.hux.bg-alt, main > section.hux.bg-alt { background-color: var(--color-surface); }

/* 幅: 部品の max-w-7xl 等はサイトの .container(1440px)より狭い。狭窄して見えるのを防ぐ
   (旧モジュールで .lgx .container を広げたのと同じ扱い)。 */
.hux [class*="max-w-7xl"], .hux [class*="max-w-screen-"] { max-width: min(1440px, 94vw); }

/* 縦リズム: 部品は自前の py-8(32px) を持つが、サイトのセクション余白は 96px 前後。
   ルート要素に付けた `.section` が正しい余白を出すので、【直下の器】の上下paddingだけ潰して
   二重取りを防ぐ。★padding-block だけを 0 にすること(横paddingは器の左右余白として必要)。
   孫要素(例 banner-cta の p-8/lg:py-24 のテキスト箱)は部品の意匠なので触らない。 */
.hux > [class*="py-"], .hux > [class*="p-"] { padding-block: 0; }