/* LP / 公開ページ用 — 画面共通デザイン仕様に準拠したトークン */
:root {
  /* ── カラー: 背景 ─────────────────────────────── */
  --sg-bg-base:   #D7DCE1;   /* 曇天の白（黄みなし） */
  --sg-bg-panel:  #C4CBD2;   /* 鉛の面 */
  --sg-bg-panel2: #B8C0C8;   /* もう一段沈む面 */

  /* ── カラー: テキスト ─────────────────────────── */
  --sg-text-main: #1F2429;   /* 主色 */
  --sg-text-sub:  #515A62;   /* 副色・補足 */

  /* ── カラー: アクセント ───────────────────────── */
  --sg-accent:       #4E4649; /* 灯 = 残痕（脱彩色した暗い赤みがかり） */
  --sg-aux-steel:    #4A5459; /* 鋼補助色 */

  /* ── カラー: ボーダー・シャドウ ───────────────── */
  --sg-border:    #AEB6BD;
  --sg-hairline:  rgba(31, 36, 41, 0.18);
  --sg-shadow-sm: 0 4px 12px rgba(0, 0, 0, 0.08);
  --sg-shadow-md: 0 18px 45px rgba(0, 0, 0, 0.12);

  /* ── カラー: 状態色 ───────────────────────────── */
  --sg-error-text:   #7a2b2b;
  --sg-success-text: #2b4f2b;

  /* ── タイポグラフィ ────────────────────────────── */
  --sg-font-sans:  ui-sans-serif, system-ui, -apple-system, "Segoe UI",
                   "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN",
                   "Noto Sans JP", sans-serif;
  --sg-font-serif: "Hiragino Mincho ProN", "Yu Mincho", "YuMincho", "游明朝",
                   "ヒラギノ明朝 ProN", Georgia, "Times New Roman", serif;
  --sg-font-mono: "Impact", "Helvetica Neue", Arial, sans-serif;


  /* ── フォントサイズ ────────────────────────────── */
  --sg-text-xl:   clamp(52px, 7vw, 88px); /* 画面名タイトル（明朝体） */
  --sg-text-lg:   clamp(28px, 4vw, 42px); /* ヒーロー H1 */
  --sg-text-title: 32px;
  --sg-text-h2:   22px;
  --sg-text-body: 14px;
  --sg-text-sm:   13px;
  --sg-text-xs:   12px;
  --sg-text-xxs:  11px;

  /* ── 角丸 ─────────────────────────────────────── */
  --sg-radius-sm:   8px;
  --sg-radius-md:   14px;
  --sg-radius-lg:   20px;
  --sg-radius-pill: 999px;

  /* ── レイアウト ────────────────────────────────── */
  --sg-ui-max:     1200px;   /* メインコンテンツ最大幅 */
  --sg-header-h:   60px;     /* ヘッダー高さ */

  /* ── フォーカスリング ──────────────────────────── */
  --sg-focus-ring: rgba(78, 70, 73, 0.40);
}