/* ─── Design Tokens ─── */
:root {
  /* Backgrounds */
  --color-bg:        #070D1A;
  --color-bg-2:      #0D1628;
  --color-bg-3:      #111E35;

  /* Borders */
  --color-border:    #1A2A45;

  /* Accent */
  --color-teal:      #00C9A7;
  --color-teal-dim:  #00A88C;
  --color-teal-glow: rgba(0, 201, 167, .15);

  /* Text */
  --color-text:       #E8EDF5;
  --color-text-muted: #7A93B4;

  /* Light-mode tokens */
  --color-light-bg:         #FFFFFF;
  --color-light-bg-2:       #F6F8FB;
  --color-light-text:       #121218;
  --color-light-text-muted: #61646B;
  --color-light-border:     #E2E6ED;

  /* Typography */
  --font-display: 'Instrument Sans', sans-serif;
  --font-body:    'Inter', sans-serif;

  /* Fluid type scale */
  --text-xs:   clamp(.75rem,  .7rem  + .25vw, .875rem);
  --text-sm:   clamp(.875rem, .83rem + .2vw,  1rem);
  --text-base: clamp(1rem,    .95rem + .25vw, 1.125rem);
  --text-lg:   clamp(1.125rem,1rem   + .5vw,  1.375rem);
  --text-xl:   clamp(1.25rem, 1rem   + 1vw,   1.75rem);
  --text-2xl:  clamp(1.5rem,  1.1rem + 1.5vw, 2.25rem);
  --text-3xl:  clamp(2rem,    1.4rem + 2vw,   3rem);
  --text-4xl:  clamp(2.5rem,  1.6rem + 3vw,   4rem);

  /* Spacing */
  --space-xs:  .5rem;
  --space-sm:  1rem;
  --space-md:  1.5rem;
  --space-lg:  2.5rem;
  --space-xl:  4rem;
  --space-2xl: 6rem;
  --space-3xl: 8rem;

  /* Misc */
  --radius:    .75rem;
  --radius-lg: 1.25rem;
  --nav-h:     4.5rem;
  --max-w:     1200px;
  --transition: 300ms ease;
}