:root {

  --navy:        #0d1b2a;
  --steel:       #1e293b;
  --teal:        #3b82f6;
  --teal-dark:   #2563eb;
  --white:       #ffffff;
  --ice:         #f0f4f8;
  --footer-bg:   #1b2838;
  --text-dark:   #a8b8cc;
  --text-mid:    #374151;
  --text-light:  #64748b;
  --text-head:   #0c1222;
  --teal-muted:  rgba(59,130,246,0.12);
  --border-dark: rgba(255,255,255,0.08);
  --border-ice:  #dfe4ed;

  --font: 'IBM Plex Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-mono: 'IBM Plex Mono', 'SFMono-Regular', Consolas, monospace;
  --w-normal:  400;
  --w-medium:  500;
  --w-semi:    600;
  --w-bold:    700;
  --w-black:   700;

  --t-xs:   0.6875rem;
  --t-sm:   0.8125rem;
  --t-base: 1rem;
  --t-lg:   1.125rem;
  --t-xl:   1.375rem;
  --t-2xl:  1.75rem;
  --t-3xl:  2.25rem;
  --t-4xl:  2.75rem;
  --t-5xl:  3.5rem;
  --t-6xl:  4.5rem;

  --s-1: 4px;
  --s-2: 8px;
  --s-3: 12px;
  --s-4: 16px;
  --s-5: 20px;
  --s-6: 24px;
  --s-8: 32px;
  --s-10: 40px;
  --s-12: 48px;
  --s-16: 64px;
  --s-20: 80px;
  --s-25: 100px;
  --s-30: 120px;

  --max-w:   1200px;
  --gutter:  clamp(24px, 5vw, 80px);
  --col-gap: clamp(16px, 2.5vw, 32px);

  --ease:     cubic-bezier(0.4, 0, 0.2, 1);
  --ease-out: cubic-bezier(0, 0, 0.2, 1);
  --ease-in:  cubic-bezier(0.4, 0, 1, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);

  --d-fast:   150ms;
  --d-base:   300ms;
  --d-slow:   600ms;
  --d-slower: 900ms;

  --surface-glass:  rgba(255,255,255,0.04);
  --surface-raised: rgba(255,255,255,0.06);
  --letter-tight:   -0.03em;
}
