@charset "UTF-8";
/* StyleDoc デザインテーマ：Webサイト（td-website）
   Web ページらしい見え方にする。狙いは「余白のメリハリ」:
     ・縦の余白（セクション間・見出しまわり・パーツ間）はかなり広く取る
     ・見出しは階層ごとの文字の大きさの差を大きくする（見ただけで階層が分かる）
     ・表・リストなど情報が詰まる要素は広げない → 余白の広い読み物と密度のある情報の対比が出る
   構成: トークンのみ。色には触れない（カラーテーマと直交）。
   ★2026-09-05 に「.td-website .title-* で上書きする見出しのスキン」を core.css の見出しトークン
     （--h-<種>-*）の値へ書き直した。見た目は不変（置き換え前後で全パーツの computed style が一致することを実測）。 */
.td-website{
  /* ---- 縦の余白：広げるのは「まとまりの境目」だけ ----
     セクション・コンテナ・見出しは大きく空け、個々のパーツ（ナビ・ヒーロー・KPI・パネル・表など）は
     コンフォート並みに詰める。こうすると「記事のかたまり」がはっきりし、中身は詰まって見える。 */
  --space:20px;
  --block-gap:22px;         /* パーツ段（ナビ・ヒーロー・KPI・パネル・表など）＝コンフォート相当 */
  --gap-block:44px;         /* コンテナ(.block)＝記事のまとまり */
  --gap-section:76px;       /* セクション段はさらに大きく空ける＝Webページの区切り感 */
  --gap-head:26px;          /* 見出しの下（hero/大/中/小 が 1.2/1/.8/.6 倍で参照） */

  /* ---- 表・リストは広げない：ここが「詰まっている側」＝メリハリの相手 ---- */
  --gap-text:.8em;          /* 段落・リスト・用語リストなどテキスト段 */
  --pad-cell-y:8px; --pad-cell-x:12px;

  --pad-panel:20px; --gap-cols:26px; --gap-card:20px;
  --radius:12px; --radius-sm:8px; --rule-weight:1px; --rule-style:solid;
  --shadow:0 1px 2px rgba(20,40,80,.04), 0 14px 40px rgba(20,40,80,.08);
  --shadow-sm:0 2px 12px rgba(20,40,80,.06);
  --font-head:var(--font-body); --font-base:16px; --scale:1; --leading:1.9; --tracking:.01em; --head-weight:800;

  /* ---- 見出し：階層ごとの大きさの差を大きく取る（既定より段差が大きい） ----
     倍率は core.css の hero 1.8 / 大 1.55 / 中 1.18 に対して 2.2 / 2.1 / 1.45（--fs-mul も既定どおり掛かる）。
     ドキュメントタイトルは**大見出しと同じくらい**にする（2.1 に対して 2.2）。Webページではページ内の
     見出しとして使うので、3 倍（48px）は大きすぎた。もっと大きく見せたいときは .fs-x* で個別に上げる。
     セクション見出しは大見出しより一段小さく（既定の関係と同じ並び）。
     結果の階段は hero 48 / 大 33.6 / セクション 28 / 中 23.2 / 小 17.9px（--font-base:16px のとき）。 */
  --h-hero-size:2.2; --h-hero-lh:1.25;
  --h-lg-size:2.1; --h-md-size:1.45; --h-sm-fs:1.12em;
  --h-sec-size:1.75;

  /* ---- 見出しの「上」にも大きく空ける（倍率×--gap-head） ----
     StyleDoc は「各パーツが自分の下マージンを持つ」方式なので見出しに上マージンは無いが、
     Web ページらしい区切り感には見出しの手前の余白が要る。器の先頭にあるときは空けない
     （core.css の :not(:first-child) ルールが読む）ので、パネルやインデントの中に置いても頭が落ちない。
     直前の要素の下マージンとは相殺（margin collapse）されるため二重に空くこともない。
     上下は**同じ値**にする（見出しが上下から等しく離れて、まとまりの頭として読める）。
     倍率は既定の下マージン（1.2/1/.8/.6）と、当初上に付けていた値（2.2/1.8/1.4/1.0）の中間。
     ★ドキュメントタイトル（.title-hero）だけは上マージンを付けない。文書やページの
       いちばん上に置く見出しで、上に離すべき相手（前のまとまり）がそもそも無いため。 */
  --h-hero-mb:1.4;                       /* 大見出しと同値 */
  --h-lg-mb:1.4; --h-lg-mt:1.4;
  --h-md-mb:1.1; --h-md-mt:1.1;
  --h-sm-mb:.8;  --h-sm-mt:.8;
  /* ★見出しの下は全種類とも「見出しの下（基準）＝--gap-head」×倍率で決まる（core.css / parts.css）。
     このテーマの見え方（従来どおり）を保つための倍率＝基準 26px に対する比。
     ここを持つことで、カスタムデザインで「見出しの下（基準）」を変えると**全見出しが同じ比で動く**。 */
  --h-sec-mb:0.7692307692307693;   /* 20px */
  --h-eye-mb:0.38461538461538464;  /* 10px */
  --h-cap-mb:0.23076923076923078;  /* 6px  */
  --h-pt-mb:0.3076923076923077;    /* 8px  */
  --h-imp-mb:0.38461538461538464;  /* 10px */
  --h-sub-mb:0.38461538461538464;  /* 10px */
  --h-rb-mb:0.46153846153846156;   /* 12px */
  --h-kick-mb:0.3076923076923077;  /* 8px  */
  /* セクション見出しの上。.title-section は section.block の先頭に置くのが基本形なので、
     自身に付けても :not(:first-child) で効かない。**セクション要素の側**（--sec-mt）にも付けておく
     （子の上マージンは親へ抜けて、直前のセクションの下マージンと相殺される＝二重には空かない）。
     対象は section.block だけ（parts.css）＝Webパーツの section.web-hero / section.web-cta を巻き込まない。 */
  --h-sec-mt:1.4; --sec-mt:1.4;
}