/* =========================================================
   サイト全体で使う値（色・フォント・サイズ）
   全ページで最初に読み込む。色やフォントを変えるときはここだけを直す
   ========================================================= */
:root {
  --color-navy: #0f2441;
  --color-navy-deep: #0d1f3a;
  --color-blue: #1d5fa8;
  --color-blue-light: #eaf1fa;
  --color-text: #1a2433;
  --color-text-sub: #4b5563;
  --color-label: #4a5d78;
  --color-border: #dfe5ee;
  --color-bg: #ffffff;
  --color-bg-soft: #f7f9fc;
  --color-bg-gray: #f4f5f7;
  --color-gray-light: #eceff3;
  --color-error: #c0392b;

  --font-sans: 'Noto Sans JP', sans-serif;
  --font-serif: 'Noto Serif JP', serif;
  --font-script: 'Great Vibes', cursive;

  --container: 1200px;   /* 中身の最大幅 */
  --gutter: 32px;        /* 左右の余白 */
  --container-max: calc(var(--container) + var(--gutter) * 2);  /* 余白込みの最大幅 */
  --radius-sm: 8px;
  --radius-md: 12px;
  --shadow-card: 0 14px 34px rgba(15, 36, 65, 0.08);
}