/* =========================================================
   AdvaNceD IoT デザイントークン（色・文字・余白）
   ここにある値以外の色・フォント・余白を各ページで足さないこと。
   ========================================================= */
:root {
  /* ---- 色（device-agency-brand 準拠） ---- */
  --c-blue: #2874fc; /* ブランドブルー：アクセント・大きな文字・図形 */
  --c-blue-deep: #1e5fbe; /* 濃いブルー：リンク文字・小さい青文字・青背景（白文字の可読性を確保） */
  --c-sky: #e8f1fb; /* ライトブルー：セクション背景・情報ボックス */
  --c-mint: #00d084; /* シアン：チェックマーク・稼働中の印だけ（文字色には使わない） */
  --c-ink: #32373c; /* チャコール：本文・ボタン・フッター背景 */
  --c-red: #e60012; /* アクセント赤：注釈・注意・価格の強調 */
  --c-white: #ffffff;
  --c-gray-50: #f5f5f5; /* サブ背景・写真の下地 */
  --c-gray-100: #eeeeee; /* 区切り線・枠線 */
  --c-gray-600: #666666; /* 補足テキスト */

  /* ---- 文字 ---- */
  --font:
    "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Yu Gothic",
    "YuGothic", Meiryo, sans-serif;
  --fs-xs: 0.8125rem; /* 13px 注釈・タグ */
  --fs-sm: 0.875rem; /* 14px キャプション */
  --fs-base: 1rem; /* 16px 本文（これより小さい本文は禁止） */
  --fs-md: 1.125rem; /* 18px リード文 */
  --fs-lg: 1.375rem; /* 22px 小見出し h3 */
  --fs-xl: clamp(
    1.5rem,
    1.1rem + 1.4vw,
    2rem
  ); /* 24→32px セクション見出し h2 */
  --fs-2xl: clamp(
    1.75rem,
    1.1rem + 2.4vw,
    2.75rem
  ); /* 28→44px ページ見出し h1 */
  --fs-3xl: clamp(2rem, 1.1rem + 3.4vw, 3.5rem); /* 32→56px トップのキャッチ */
  --lh-body: 1.85;
  --lh-head: 1.45; /* 見出しは 1.4 未満にしない（はみ出し検査で落ちる） */
  --ls-body: 0.04em;
  --ls-head: 0.02em;

  /* ---- 余白（8px 基準） ---- */
  --sp-1: 4px;
  --sp-2: 8px;
  --sp-3: 12px;
  --sp-4: 16px;
  --sp-5: 24px;
  --sp-6: 32px;
  --sp-7: 48px;
  --sp-8: 64px;
  --sp-9: 96px;
  --section-y: clamp(36px, 2vw + 24px, 52px); /* セクション上下の余白（2026-11-03 田中さん「余白が無駄」で72→52px） */
  --gutter: clamp(16px, 4vw, 32px); /* 画面端の余白 */
  --container: 1200px;
  --container-narrow: 760px; /* 記事・フォーム */

  /* ---- 形 ---- */
  --r-sm: 6px;
  --r-md: 12px;
  --r-lg: 20px;
  --r-pill: 9999px;
  --line: 1px solid var(--c-gray-100);
  --header-h: 72px;
  --focus: 0 0 0 3px var(--c-white), 0 0 0 5px var(--c-blue-deep);
}