/* =========================================================
   デザイントークン（:root 変数）
   ※色は画像からの近似値。Adobe XD で実 HEX を確認して確定すること。
   ========================================================= */
:root {
  /* カラー */
  --c-dark: #262626;        /* ヘッダー/フッターの濃色 */
  --c-navy: #1A1A1A;        /* 基調の黒（見出し/表ヘッダー/ボタン）※変数名は旧ネイビーのまま */
  --c-gold: #00904C;        /* 差し色の緑（罫・矢印・飾り）※変数名は旧ゴールドのまま */
  --c-gold-dark: #007A40;   /* 差し色の緑・濃（白地の文字・ホバー） */
  --c-bg: #FFFFFF;          /* 背景白 */
  --c-bg-gray: #F1F1F1;     /* セクション/フッター帯/プレースホルダ */
  --c-text: #222222;        /* 本文 */
  --c-text-muted: #666666;  /* 補助/日付 */
  --c-border: #DDDDDD;      /* 罫線/フォーム枠 */
  --c-required: #D0021B;    /* 必須ラベル */
  --c-bg-beige: #F7F7F7;    /* 薄いグレーのセクション背景 */
  --c-hero-dark: #2B2B2B;   /* 写真の読み込み前の背景 */
  --c-gold-overlay: rgba( 153, 130, 78, 0.86 ); /* ヒーローのキャッチコピー帯 */
  --c-placeholder: #C9CDD2; /* 画像プレースホルダ */
  --c-dark-2: #1A1A1A;      /* より深い濃色（ヒーロー左パネル等） */
  --c-bg-paper: #FAFAFA;    /* オフホワイト（リード・本文背景） */
  --c-gold-tint: #EEF6F1;   /* 緑の極薄ティント */
  --c-navy-dark: #111111;   /* 黒・濃（ドロワー背景） */
  --c-header-bg: rgba( 255, 255, 255, 0.96 );  /* ヘッダー背景（半透明ネイビー＋blur） */
  --c-header-bg-2: #FFFFFF; /* ドロップダウン背景（ネイビー） */

  --c-sky: #00904C;
  --c-text-nav: #1A1A1A;
  --c-green: #00904C;

  /* 影 */
  --shadow-sm: 0 4px 14px rgba(0,0,0,.06);
  --shadow-md: 0 12px 32px rgba(0,0,0,.10);
  --shadow-lg: 0 24px 60px rgba(0,0,0,.16);
  /* イージング */
  --ease: cubic-bezier(.22,.61,.36,1);

  /* タイポ */
  --font-serif: "Noto Serif JP", serif;                 /* 見出し/ページタイトル（明朝） */
  --font-sans: "Noto Sans JP", system-ui, sans-serif;   /* 本文/UI（ゴシック） */

  /* レイアウト */
  --container: 1120px;
  --section-gap: 80px;
  --section-gap-sp: 48px;
  --radius: 8px;
  --radius-pill: 999px;

  /* フォントサイズ（PC） */
  --fs-page-title: 32px;
  --fs-section-en: 36px;
  --fs-section-ja: 16px;
  --fs-section-ja-main: 30px;
  --fs-body: 16px;
  --fs-small: 14px;
}

/* SP */
@media (max-width: 767px) {
  :root {
    --section-gap: var(--section-gap-sp);
    --fs-page-title: 24px;
    --fs-section-en: 26px;
    --fs-section-ja: 14px;
    --fs-section-ja-main: 23px;
    --fs-body: 15px;
    --fs-small: 13px;
  }
}

/* 最小限のベース（本体は style.css に記述） */
body {
  font-family: var(--font-sans);
  color: var(--c-text);
  font-size: var(--fs-body);
  line-height: 1.8;
}
.container { max-width: var(--container); margin-inline: auto; padding-inline: 5%; }
