/* ==========================================================================
   CSS Custom Properties — Plain Planning
   ========================================================================== */

:root {
  /* ---- Colors ---- */
  --color-primary:        #133b4e;
  --color-accent:         #0097b2;
  --color-white:          #ffffff;
  --color-bg:             #f8fafb;
  --color-accent-light:   rgba(0, 151, 178, 0.15);
  --color-primary-90:     rgba(19, 59, 78, 0.9);
  --color-primary-0:      rgba(19, 59, 78, 0);

  /* ---- Typography ---- */
  --font-family:          "Inter", system-ui, -apple-system, sans-serif;

  /* ---- Spacing (8px grid) ---- */
  --space-1:   8px;
  --space-2:  16px;
  --space-3:  24px;
  --space-4:  32px;
  --space-5:  40px;
  --space-6:  48px;
  --space-7:  56px;
  --space-8:  64px;

  /* ---- Border Radius ---- */
  --radius-sm:  8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-full: 50%;

  /* ---- Transitions ---- */
  --ease-default: cubic-bezier(0.25, 0.46, 0.45, 0.94);
  --duration-fast:   0.15s;
  --duration-normal: 0.3s;
  --duration-slow:   0.6s;
}