/**
 * Melora Organic Design Tokens
 * Source of Truth: DESIGN.md
 *
 * @package Melora
 * @version 1.0.0
 */

:root {
  /* Colors */
  --color-primary: #1E5328;       /* Deep farm green (organic credibility) */
  --color-primary-90: #174121;    /* Deep hover green */
  --color-primary-70: #3B6A46;    /* Soft supporting green */
  --color-primary-20: #DCE7DE;    /* Botanical wash / badge tint */
  --color-secondary: #555555;     /* Soft neutral body text */
  --color-tertiary: #F4A51C;      /* Warm harvest orange (primary conversion CTA) */
  --color-neutral: #E5E7EB;       /* Clean border & divider */
  --color-surface: #FFFFFF;       /* Card and clean background */
  --color-on-surface: #111111;    /* High contrast dark text */
  --color-background: #FFFFFF;
  --color-error: #C73A2F;         /* Validation & destructive */

  /* Typography: General Sans with modern clean system stack fallback */
  --font-family-base: 'General Sans', 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;

  /* Headline Display: 42px / 54.6px / 600 */
  --font-size-headline-display: 42px;
  --line-height-headline-display: 54.6px;
  --font-weight-headline-display: 600;

  /* Headline Lg: 33px / 46.8px / 600 */
  --font-size-headline-lg: 33px;
  --line-height-headline-lg: 46.8px;
  --font-weight-headline-lg: 600;

  /* Headline Md: 26px / 31px / 500 */
  --font-size-headline-md: 26px;
  --line-height-headline-md: 31px;
  --font-weight-headline-md: 500;

  /* Headline Sm: 20px / 24px / 500 */
  --font-size-headline-sm: 20px;
  --line-height-headline-sm: 24px;
  --font-weight-headline-sm: 500;

  /* Body Lg: 18px / 28px / 400 */
  --font-size-body-lg: 18px;
  --line-height-body-lg: 28px;
  --font-weight-body-lg: 400;

  /* Body Md: 16px / 24px / 400 */
  --font-size-body-md: 16px;
  --line-height-body-md: 24px;
  --font-weight-body-md: 400;

  /* Body Sm: 14px / 20px / 400 */
  --font-size-body-sm: 14px;
  --line-height-body-sm: 20px;
  --font-weight-body-sm: 400;

  /* Label Lg: 16px / 24px / 600 */
  --font-size-label-lg: 16px;
  --line-height-label-lg: 24px;
  --font-weight-label-lg: 600;

  /* Label Md: 12px / 18px / 600 */
  --font-size-label-md: 12px;
  --line-height-label-md: 18px;
  --font-weight-label-md: 600;

  /* Label Sm: 12px / 16px / 500 */
  --font-size-label-sm: 12px;
  --line-height-label-sm: 16px;
  --font-weight-label-sm: 500;

  /* Eyebrow: 12px / 16px / 600 / 0.08em tracking */
  --font-size-eyebrow: 12px;
  --line-height-eyebrow: 16px;
  --font-weight-eyebrow: 600;
  --letter-spacing-eyebrow: 0.08em;

  /* Spacing Scale */
  --space-xs: 8px;
  --space-sm: 16px;
  --space-md: 34px;
  --space-lg: 50px;
  --space-xl: 60px;

  /* Border Radii */
  --radius-none: 0px;
  --radius-sm: 4px;
  --radius-md: 8px;      /* Cards and Inputs per design.md */
  --radius-lg: 16px;
  --radius-xl: 30px;     /* Pill buttons per design.md */
  --radius-full: 9999px;

  /* Depth & Elevation: Mostly flat per design.md */
  --border-subtle: 1px solid var(--color-neutral);
  --shadow-none: none;
  --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.04);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.07);
  --shadow-drawer: -4px 0 28px rgba(0, 0, 0, 0.12);

  /* Transitions */
  --transition-fast: 150ms ease-in-out;
  --transition-normal: 250ms ease-in-out;
}