:root {
  /* Colors — extracted from IGNITERA logo */
  --color-navy:        #0B3D8C;
  --color-blue:        #1A6FD4;
  --color-cyan:        #00C6FF;
  --color-cyan-light:  #E0F7FF;
  --color-cyan-ultra:  #F0FBFF;
  --color-green:       #22C55E;
  --color-green-light: #DCFCE7;

  --color-white:       #FFFFFF;
  --color-bg:          #F8FAFB;
  --color-surface:     #FFFFFF;
  --color-border:      #E2E8F0;

  --color-text-primary:   #0F172A;
  --color-text-secondary: #475569;
  --color-text-muted:     #94A3B8;

  /* Typography */
  --font-sans: "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Yu Gothic Medium", "Yu Gothic", "Meiryo", sans-serif;

  --font-display: clamp(2.5rem, 5vw, 4.5rem);
  --font-h1:      clamp(2rem, 3.5vw, 3rem);
  --font-h2:      clamp(1.5rem, 2.5vw, 2.25rem);
  --font-h3:      clamp(1.125rem, 1.5vw, 1.375rem);
  --font-body:    1rem;
  --font-small:   0.875rem;
  --font-xs:      0.75rem;

  /* Spacing (8px grid) */
  --space-1:  0.5rem;
  --space-2:  1rem;
  --space-3:  1.5rem;
  --space-4:  2rem;
  --space-6:  3rem;
  --space-8:  4rem;
  --space-12: 6rem;
  --space-16: 8rem;
  --space-20: 10rem;
  --space-24: 12rem;

  /* Motion */
  --ease-out-expo:  cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out:    cubic-bezier(0.4, 0, 0.2, 1);
  --duration-fast:  200ms;
  --duration-base:  400ms;
  --duration-slow:  700ms;
  --duration-enter: 900ms;

  /* Shadows */
  --shadow-sm: 0 1px 3px rgba(11, 61, 140, 0.06), 0 1px 2px rgba(11, 61, 140, 0.04);
  --shadow-md: 0 4px 16px rgba(11, 61, 140, 0.10), 0 2px 6px rgba(11, 61, 140, 0.06);
  --shadow-lg: 0 12px 40px rgba(11, 61, 140, 0.14);

  /* Radii */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 16px;
  --radius-xl: 24px;
  --radius-full: 9999px;

  /* Layout */
  --container-max: 1160px;
  --container-pad: clamp(1rem, 5vw, 4rem);
  --header-height: 72px;
}
