/* =========================================================
   tokens.css — J's MEN'S 集客LP
   ---------------------------------------------------------
   出典：JsMENS_LP_統合設計書_v1.md §4-2「主案：ウォームニュートラル・ダーク」
   採用理由：岩田さん指定「黒系」＝設計書の主案（暗基調）と一致。
   規律：臙脂 #B23A48・くすみローズ #C98B86 は完全封印
        （採用LP＝女性向けの性格を持ち込まないため）。
        見出しの明朝も廃止（§4-3）。
   ========================================================= */

:root {
  /* ---- 地：ディープチャコール。純黒にせず暖色を残す ---- */
  --bg:        #131417;   /* 調査反映：accentとの色相反発を解消 */
  --bg-2:      #1B1D21;   /* 面。旧#1C1815は地との差が知覚できず */
  --surface:   #21242A;   /* カード面 */
  --surface-2: #2A2E35;   /* カード面の一段上（hover・強調） */

  /* ---- 文字：生成り #FAF6F3 の明度を落として同系を保持 ---- */
  --ink:       #F2ECE7;
  --ink-2:     #B5AEA8;
  --ink-3:     #8E8A86;   /* サブテキスト。装飾用途に限る */

  /* ---- 差し色は1色だけ。低彩度スチールブルー ---- */
  --accent:      #6B8496;   /* 調査反映：旧#5B7080はAA未達(4.40:1) */
  --accent-lift: #8FA9BA;   /* 暗地でのラベル・リンク用に明度を上げる */   /* 暗地でのリンク・強調（コントラスト確保用） */

  /* ---- 罫線：黒地では線が沈むため白側で作る ---- */
  --line:      rgba(242, 236, 231, .14);
  --line-soft: rgba(242, 236, 231, .07);

  /* ---- CV：黒地では「明るい面」が最も強い誘目になる ---- */
  --cv:        #F2ECE7;
  --cv-ink:    #131417;
  --cv-hover:  #FFFFFF;

  /* ---- タイポ：見出しもゴシック（明朝は使わない）---- */
  --ff-ja:  "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Yu Gothic", sans-serif;
  --ff-en:  "Jost", "Helvetica Neue", Arial, sans-serif;

  --fs-hero:  clamp(27px, 7.2vw, 34px);
  --fs-h2:    clamp(22px, 5.8vw, 27px);
  --fs-h3:    clamp(16px, 4.2vw, 19px);
  --fs-body:  15px;
  --fs-sm:    13px;
  --fs-label: 11px;
  --fs-note:  10px;

  /* ---- 余白 ---- */
  --sp-section: clamp(64px, 14vw, 96px);
  --sp-block:   clamp(32px, 8vw, 48px);
  --gut:        22px;

  /* ---- レイアウト：PCでもスマホ幅の縦列を中央に置く ---- */
  --col:      450px;
  --wing-min: 1100px;

  /* ---- 角丸0・影なし（テンプレ感の主因を形式で封じる）---- */
  --radius: 0;

  /* ---- 動き：既存 site.css の実測イージングを継承（§4-5）---- */
  --ease: cubic-bezier(.16, 1, .3, 1);
  --dur:  500ms;

  --sticky-h: 108px;
}