:root {
  /* Colors */
  --color-bg:           #f7f4f0;
  --color-surface:      #ffffff;
  --color-surface-alt:  #f0ece7;
  --color-primary:      #3ecf72;
  --color-primary-dark: #2ba55a;
  --color-primary-light:#c6f0d9;
  --color-accent:       #f5c518;
  --color-accent-dark:  #d4a800;
  --color-heading:      #111111;
  --color-text:         #3d3d3d;
  --color-text-muted:   #737373;
  --color-border:       #e2ddd8;
  --color-tag-bg:       #ede9e4;
  --color-footer-bg:    #111111;
  --color-footer-text:  #e0e0e0;
  --color-footer-muted: #888888;
  --color-footer-border:rgba(255,255,255,0.08);
  --color-shadow:       rgba(0,0,0,0.06);
  --color-shadow-md:    rgba(0,0,0,0.10);
  --color-overlay-dark: rgba(17,17,17,0.6);
  --color-icon-green:   #e6f9ee;
  --color-icon-yellow:  #fff9e0;
  --color-icon-orange:  #fff3e0;
  --color-icon-blue:    #e3f2fd;

  /* Spacing */
  --space-xs:  4px;
  --space-sm:  8px;
  --space-md:  16px;
  --space-lg:  24px;
  --space-xl:  40px;
  --space-2xl: 64px;
  --space-3xl: 96px;

  /* Radius */
  --radius-sm:   6px;
  --radius-md:   10px;
  --radius-lg:   16px;
  --radius-xl:   24px;
  --radius-pill: 999px;

  /* Shadow */
  --shadow-sm: 0 1px 3px var(--color-shadow), 0 1px 2px var(--color-shadow);
  --shadow-md: 0 4px 16px var(--color-shadow-md);
  --shadow-lg: 0 8px 32px var(--color-shadow-md);

  /* Typography */
  --font-size-xs:   0.75rem;
  --font-size-sm:   0.875rem;
  --font-size-base: 1rem;
  --font-size-lg:   1.125rem;
  --font-size-xl:   1.25rem;
  --font-size-2xl:  1.5rem;
  --font-size-3xl:  2rem;
  --font-size-4xl:  2.75rem;
  --font-size-5xl:  3.5rem;

  --line-height-tight: 1.2;
  --line-height-snug:  1.4;
  --line-height-base:  1.65;

  --font-weight-normal:  400;
  --font-weight-medium:  500;
  --font-weight-semi:    600;
  --font-weight-bold:    700;
  --font-weight-black:   800;

  /* Layout */
  --container-max:  1200px;
  --header-height:  68px;
  --transition-base: 0.18s ease;

  /* Breakpoints (reference — used only in responsive.css) */
  --bp-tablet:  768px;
  --bp-desktop: 1024px;
}
