/* =========================================================
   tokens.css — ブランドガイド v1 準拠のデザイントークン
   色はここで定義した変数以外を使わない。
   禁止: クリーム/ベージュ/アイボリー/黄みのある白/くすみパステル
   ========================================================= */
:root {
  /* Brand Colors */
  --c-yellow:   #EBD519; /* Eagle Yellow   役割: 焦点・発見・行動(CTA・強調のみ) */
  --c-charcoal: #3F3A39; /* Eagle Charcoal 役割: 見出し文字・安定感・濃色背景 */
  --c-white:    #FFFFFF; /* Pure White     役割: 背景・余白(白を使うなら純白) */
  /* Support Colors */
  --c-black:    #111111; /* Impact Black   役割: 強調・最重要要素 */
  --c-text:     #5A5757; /* Text Gray      役割: 本文・補助テキスト */
  --c-line:     #D9D9D9; /* Line Gray      役割: 罫線・区切り線 */
  --c-surface:  #F3F4F5; /* Cool Surface   役割: ブロック背景・UI背景 */

  /* Typography — Noto Sans JP。使用ウェイトは 400/500/700/900 のみ */
  --font-base: "Noto Sans JP", sans-serif;
  --fw-regular: 400; --fw-medium: 500; --fw-bold: 700; --fw-black: 900;
  --fs-hero:  clamp(30px, 4.4vw, 48px);
  --fs-h1:    clamp(26px, 3.6vw, 40px);
  --fs-h2:    clamp(22px, 3vw, 32px);
  --fs-h3:    clamp(17px, 2vw, 20px);
  --fs-body:  16px;
  --fs-small: 13px;

  /* Layout */
  --container: 1120px;
  --container-narrow: 760px;
  --space: 8px;              /* 8pxスケール */
  --section-pad: clamp(64px, 9vw, 120px); /* 余白は情報の呼吸。埋めない */
  --radius: 10px;
  --header-h: 72px;
}