:root {
  /* ------------------------------------------------------------------------
     COLOR TOKENS
     ------------------------------------------------------------------------ */

  
  --color-bg: #FBF6EF;              
  --color-surface: #FFFFFF;         
  --color-border: #E5DED4;          

  /* Section background (for .section-soft base fill) */
  --color-section-soft: #e8ebec;    

  
  --color-primary: #B7D6DE;         
  --color-primary-soft: #CFE3EA;    
  --color-primary-softer: #E7F2F6;  

  
  --color-secondary: #9FC4CF;       
  --color-secondary-soft: #E6F1EE;  

  
  --color-earth: #D6DAD6;           

  
  --color-text-primary: #2F3336;
  --color-text-secondary: #565C61;
  --color-text-muted: #7F878D;

--color-primary-600: #4E6F7B;
--color-primary-700: #3F5B64;

--color-link: var(--color-primary-600);
--color-link-hover: var(--color-primary-700);

  /* ------------------------------------------------------------------------
     TYPOGRAPHY TOKENS
     ------------------------------------------------------------------------ */

  --font-heading: "Libre Baskerville", Georgia, serif;
  --font-body: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;

  --text-xs: 0.75rem;               
  --text-sm: 0.875rem;              
  --text-base: 1rem;                
  --text-lg: 1.125rem;              
  --text-xl: 1.375rem;              
  --text-2xl: 1.75rem;              
  --text-3xl: 2.25rem;              

  --leading-tight: 1.25;
  --leading-normal: 1.6;
  --leading-loose: 1.75;

  --tracking-tight: -0.01em;
  --tracking-normal: 0;
  --tracking-wide: 0.03em;

  /* ------------------------------------------------------------------------
     SPACING TOKENS
     ------------------------------------------------------------------------ */

  --space-1: 0.25rem;               
  --space-2: 0.5rem;                
  --space-3: 0.75rem;               
  --space-4: 1rem;                  
  --space-5: 1.5rem;                
  --space-6: 2rem;                  
  --space-7: 3rem;                  
  --space-8: 4rem;                  
  --space-9: 6rem;                  

  /* ------------------------------------------------------------------------
     LAYOUT TOKENS
     ------------------------------------------------------------------------ */

  --max-width-content: 64rem;       
  --max-width-narrow: 48rem;        

  --radius-sm: 0.25rem;
  --radius-md: 0.5rem;
  --radius-lg: 0.75rem;

  --shadow-soft: 0 10px 28px rgba(63, 66, 69, 0.07);

  /* ------------------------------------------------------------------------
     BUTTON TOKENS
     ------------------------------------------------------------------------ */

  
--btn-bg: var(--color-primary-soft);     
--btn-bg-hover: var(--color-primary);    
--btn-text: var(--color-primary-700);    

--btn-secondary-bg: transparent;
--btn-secondary-border: var(--color-primary-600);
--btn-secondary-text: var(--color-primary-600);

  --btn-padding-y: 0.75rem;
  --btn-padding-x: 1.5rem;

  /* ------------------------------------------------------------------------
     CARD & SECTION TOKENS
     ------------------------------------------------------------------------ */

  --card-bg: var(--color-surface);
  --card-border: var(--color-border);
  --card-radius: var(--radius-lg);
  --card-padding: var(--space-6);

  --section-padding-y: var(--space-9);
  --section-padding-x: var(--space-6);

  /* ------------------------------------------------------------------------
     MOTION TOKENS
     ------------------------------------------------------------------------ */

  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1);
  --transition-fast: 150ms var(--ease-standard);
  --transition-normal: 300ms var(--ease-standard);
}