/* ============================================================
   KOGATEX コーポレートLP — Design Tokens
   色 / 余白 / タイポgrafィを一元管理。値の変更はここだけで完結。
   ============================================================ */
:root {
  /* --- Brand: Navy（信頼・堅実） --- */
  --navy-900: #081a30;
  --navy-800: #0d2645;
  --navy-700: #143458;
  --navy-600: #1c4878;
  --navy-500: #2a5d92;

  /* --- Steel Gray（金属・工業） --- */
  --steel-50:  #f6f8fa;
  --steel-100: #eef1f5;
  --steel-200: #e1e6ed;
  --steel-300: #cbd3df;
  --steel-400: #9fabbd;
  --steel-500: #6b7888;
  --steel-600: #4a5667;
  --steel-700: #2f3a47;

  /* --- Accent: Orange（金属の熱・安全色） --- */
  --orange-400: #ff7d3a;
  --orange-500: #f0641e;
  --orange-600: #d4540f;

  --white: #ffffff;
  --ink:   #16212f;

  /* --- Semantic --- */
  --color-bg:          var(--white);
  --color-bg-alt:      var(--steel-50);
  --color-bg-dark:     var(--navy-800);
  --color-text:        #1d2a3a;
  --color-text-soft:   #586675;
  --color-text-invert: #e6ecf3;
  --color-text-invert-soft: #9fb0c2;
  --color-accent:      var(--orange-500);
  --color-accent-hover:var(--orange-600);
  --color-border:      var(--steel-200);
  --color-border-dark: rgba(255, 255, 255, 0.12);

  /* --- Typography --- */
  --font-sans: "Noto Sans JP", -apple-system, BlinkMacSystemFont, "Segoe UI",
               "Hiragino Sans", "Yu Gothic UI", Meiryo, sans-serif;
  --fs-xs:   0.75rem;   /* 12 */
  --fs-sm:   0.875rem;  /* 14 */
  --fs-base: 1rem;      /* 16 */
  --fs-md:   1.125rem;  /* 18 */
  --fs-lg:   1.375rem;  /* 22 */
  --fs-xl:   1.75rem;   /* 28 */
  --fs-2xl:  2.25rem;   /* 36 */
  --fs-3xl:  3rem;      /* 48 */
  --lh-tight: 1.3;
  --lh-base:  1.85;

  /* --- Spacing --- */
  --space-1:  4px;
  --space-2:  8px;
  --space-3:  12px;
  --space-4:  16px;
  --space-5:  24px;
  --space-6:  32px;
  --space-7:  48px;
  --space-8:  64px;
  --space-9:  96px;
  --space-10: 128px;

  /* --- Layout --- */
  --container: 1140px;
  --header-h:  72px;

  /* --- Radius --- */
  --radius-sm: 4px;
  --radius:    10px;
  --radius-lg: 18px;

  /* --- Shadow --- */
  --shadow-sm: 0 1px 3px rgba(13, 38, 69, 0.08);
  --shadow-md: 0 8px 24px rgba(13, 38, 69, 0.10);
  --shadow-lg: 0 20px 48px rgba(13, 38, 69, 0.16);

  /* --- Motion --- */
  --ease: cubic-bezier(0.22, 0.61, 0.36, 1);
}