:root {
  /* Colors from Figma style.txt */
  --color-primary: #42AE45;       /* Accent/60_Prime */
  --color-primary-dark: #257427;  /* Accent/70, Accent/80_Prime */
  --color-primary-40: #7AC67C;    /* Accent/40 */
  --color-primary-20: #D9EFDA;    /* Accent/20 */
  --color-primary-10: #ECF6EE;    /* Accent/10 */
  
  --color-orange: #FF8935;        /* Carrot/90 */
  --color-orange-50: #FFAD72;     /* Carrot/50 */
  --color-orange-10: #FDF2EB;     /* Carrot/10 */
  
  --color-red: #E83B43;           /* Red/50 */
  --color-red-10: #FDEBEC;        /* Red/10 */
  
  --color-dark: #282828;          /* Main/Almost_Black */
  --color-dark-grey: #676767;     /* Main/Dark_Grey */
  --color-mid-grey: #B6B6B6;      /* Main/Middle_Grey */
  --color-light-grey: #E7E9ED;    /* Main/Light_Grey */
  --color-almost-white: #F4F6F7;  /* Main/AlmostWhite */
  --color-white: #FFFFFF;         /* Main/White */

  /* Legacy mappings for backward compatibility */
  --color-primary-hover: #369c39;
  --color-primary-light: #ECF6EE;
  --color-primary-subtle: #D9EFDA;
  --color-accent-orange: #FF8935;
  --color-accent-orange-hover: #e67625;
  --color-bg-body: #F4F6F7;
  --color-bg-white: #FFFFFF;
  --color-bg-gray: #E7E9ED;
  --color-bg-dark: #282828;
  --color-text-main: #282828;
  --color-text-muted: #676767;
  --color-text-white: #FFFFFF;
  --color-border: #B6B6B6;
  --color-badge-green: #D9EFDA;
  --color-badge-orange: #FFAD72;

  /* Typography */
  --font-heading: 'Geologica Roman', 'Geologica', sans-serif;
  --font-main: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-alt: 'Onest', -apple-system, BlinkMacSystemFont, sans-serif;
  
  /* Sizing & Spacing */
  --site-width: 1440px;
  --container-width: 1320px;
  --header-padding: 12px 60px;
  --section-gap: 42px;
  
  /* Radii from Figma */
  --radius-xs: 4px;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-btn: 16px;
  --radius-lg: 20px;
  --radius-pill: 100px;
  
  /* Shadows */
  --shadow-header: drop-shadow(0px 0px 15px rgba(50, 75, 15, 0.2));
  --shadow-card: 0px 4px 20px rgba(0, 0, 0, 0.04);
  --shadow-hover: 0px 8px 30px rgba(0, 0, 0, 0.08);
  --transition: all 0.2s ease-in-out;
}