:root { --color-primary-50:  #e8f2f1;
--color-primary-100: #c7e1de;
--color-primary-300: #5fa39d;
--color-primary-500: #0f6d66; --color-primary-700: #0a4d48;
--color-primary-900: #052926;
--color-accent-300:  #e0c568;
--color-accent-500:  #c9a227; --color-accent-700:  #967a1d;
--color-neutral-0:   #ffffff;
--color-neutral-50:  #f7f8f8;
--color-neutral-100: #eceeee;
--color-neutral-200: #d9dcdc;
--color-neutral-300: #b9bfbf;
--color-neutral-400: #8f9797;
--color-neutral-500: #6b7373;
--color-neutral-600: #4f5656;
--color-neutral-700: #383e3e;
--color-neutral-800: #242828;
--color-neutral-900: #141717;
--color-success:     #2e7d32;
--color-success-bg:  #e8f5e9;
--color-error:       #c62828;
--color-error-bg:    #fdecea;
--color-warning:     #b8860b;
--color-warning-bg:  #fdf3d9; --color-text:            var(--color-neutral-800);
--color-text-muted:      var(--color-neutral-500);
--color-text-inverse:    var(--color-neutral-0);
--color-surface:         var(--color-neutral-0);
--color-surface-muted:   var(--color-neutral-50);
--color-border:          var(--color-neutral-200);
--color-action:          var(--color-primary-500);
--color-action-hover:    var(--color-primary-700);
--color-action-disabled: var(--color-neutral-300); --font-heading: 'Manrope Variable', 'Segoe UI', sans-serif;
--font-body:    'Manrope Variable', 'Segoe UI', sans-serif;
--font-serif:   'Source Serif 4', Georgia, serif; --text-h1:       clamp(2rem, 1.5rem + 2vw, 3rem);
--text-h2:       clamp(1.5rem, 1.25rem + 1.2vw, 2.25rem);
--text-h3:       clamp(1.25rem, 1.1rem + 0.6vw, 1.5rem);
--text-h4:       1.25rem;
--text-body-lg:  1.125rem;
--text-body:     1rem;
--text-small:    0.875rem;
--text-caption:  0.75rem;
--line-height-heading: 1.2;
--line-height-body:    1.6;
--font-weight-regular:  400;
--font-weight-medium:   500;
--font-weight-bold:     700; --space-1:  4px;
--space-2:  8px;
--space-3:  12px;
--space-4:  16px;
--space-6:  24px;
--space-8:  32px;
--space-12: 48px;
--space-16: 64px;
--space-24: 96px; --radius-sm:   4px;
--radius-md:   8px;
--radius-lg:   16px;
--radius-full: 999px; --shadow-sm: 0 1px 2px rgba(20, 23, 23, 0.06);
--shadow-md: 0 4px 12px rgba(20, 23, 23, 0.08);
--shadow-lg: 0 12px 32px rgba(20, 23, 23, 0.12); --container-max:   1200px;
--container-pad:   16px; --motion-fast: 150ms;
--motion-base: 250ms;
--motion-ease: ease-out; --z-dropdown:      100;
--z-sticky-header: 200;
--z-offcanvas:     300;
--z-modal:         400;
--z-toast:         500;
}