@charset "UTF-8";
/* ==========================================================================
   CSS Variables — カラー・フォント・サイズの一元管理
   ※色変更は基本ここだけで完結
   ========================================================================== */

:root {
  /* ----- Brand Colors ----- */
  --color-primary: #096;          /* メイン緑 rgb(0,153,102) */
  --color-primary-dark: #007a55;
  --color-primary-darker: #045c3c; /* FV CTA用：共通緑より一段ダーク */
  --color-primary-light: #edf7f2; /* セクション背景の薄緑 */
  --color-accent: #97aaa3;        /* 英字小見出し */

  /* ----- Neutral Colors ----- */
  --color-text: #333;
  --color-text-sub: #4a5565;
  --color-text-muted: #364153;
  --color-bg: #ffffff;
  --color-bg-soft: #fafefc;
  --color-bg-gradient-start: #fdfffe;
  --color-bg-gradient-end: #ecf7f2;
  --color-border: #e5e7eb;
  --color-white: #ffffff;

  /* ----- Shadows ----- */
  --shadow-card: 0 8px 10px rgba(144, 197, 179, 0.6);
  --shadow-card-soft: 0 10px 14px rgba(179, 218, 198, 0.5);

  /* ----- Fonts ----- */
  --font-jp: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Hiragino Sans",
    "Yu Gothic", "Meiryo", sans-serif;
  --font-en: "Zen Maru Gothic", "Noto Sans JP", sans-serif;
  --font-num: "Oswald", "Noto Sans JP", sans-serif;

  /* ----- Layout ----- */
  --container-max: 1200px;
  --container-pad: 24px;
  --section-pad-y: 96px;
  --section-pad-y-sm: 64px;
  --radius-sm: 4px;
  --radius-md: 10px;
  --radius-lg: 15px;
  --radius-xl: 20px;
  --radius-pill: 100px;

  /* ----- Z-Index ----- */
  --z-header: 100;
  --z-modal: 1000;
}