:root {
    --color-primary-base: #5E644F;
    --color-primary-50: color-mix(in srgb, var(--color-primary-base) 5%, white);
    --color-primary-100: color-mix(in srgb, var(--color-primary-base) 10%, white);
    --color-primary-200: color-mix(in srgb, var(--color-primary-base) 25%, white);
    --color-primary-300: color-mix(in srgb, var(--color-primary-base) 45%, white);
    --color-primary-400: color-mix(in srgb, var(--color-primary-base) 70%, white);
    --color-primary-500: var(--color-primary-base);
    --color-primary-600: color-mix(in srgb, var(--color-primary-base) 85%, black);
    --color-primary-700: color-mix(in srgb, var(--color-primary-base) 70%, black);
    --color-primary-800: color-mix(in srgb, var(--color-primary-base) 50%, black);
    --color-primary-900: color-mix(in srgb, var(--color-primary-base) 35%, black);
    --color-primary-950: color-mix(in srgb, var(--color-primary-base) 20%, black);
    --color-primary: var(--color-primary-500);

    --color-complementary-base: #373F65;
    --color-complementary-50: color-mix(in srgb, var(--color-complementary-base) 5%, white);
    --color-complementary-100: color-mix(in srgb, var(--color-complementary-base) 10%, white);
    --color-complementary-200: color-mix(in srgb, var(--color-complementary-base) 25%, white);
    --color-complementary-300: color-mix(in srgb, var(--color-complementary-base) 45%, white);
    --color-complementary-400: color-mix(in srgb, var(--color-complementary-base) 70%, white);
    --color-complementary-500: var(--color-complementary-base);
    --color-complementary-600: color-mix(in srgb, var(--color-complementary-base) 85%, black);
    --color-complementary-700: color-mix(in srgb, var(--color-complementary-base) 70%, black);
    --color-complementary-800: color-mix(in srgb, var(--color-complementary-base) 50%, black);
    --color-complementary-900: color-mix(in srgb, var(--color-complementary-base) 35%, black);
    --color-complementary-950: color-mix(in srgb, var(--color-complementary-base) 20%, black);
    --color-complementary: var(--color-complementary-500);

    --color-accent-base: #E67E22;
    --color-accent-50: color-mix(in srgb, var(--color-accent-base) 5%, white);
    --color-accent-100: color-mix(in srgb, var(--color-accent-base) 10%, white);
    --color-accent-200: color-mix(in srgb, var(--color-accent-base) 25%, white);
    --color-accent-300: color-mix(in srgb, var(--color-accent-base) 45%, white);
    --color-accent-400: color-mix(in srgb, var(--color-accent-base) 70%, white);
    --color-accent-500: var(--color-accent-base);
    --color-accent-600: color-mix(in srgb, var(--color-accent-base) 85%, black);
    --color-accent-700: color-mix(in srgb, var(--color-accent-base) 70%, black);
    --color-accent-800: color-mix(in srgb, var(--color-accent-base) 50%, black);
    --color-accent-900: color-mix(in srgb, var(--color-accent-base) 35%, black);
    --color-accent-950: color-mix(in srgb, var(--color-accent-base) 20%, black);
    --color-accent: var(--color-accent-500);

  --color-primary: #5E644F;
  --color-secondary: #373F65;
  --color-accent: #E67E22;
  --color-surface: #FFF2E9;
  --color-card: #FFF0E4;
  --color-primary-strong: #505543;
  --color-accent-strong: #C46B1D;
  --color-surface-strong: #EBDFD6;
  --color-card-strong: #EBDDD2;
  --color-on-primary: #FFFFFF;
  --color-on-primary-soft: #111827;
  --color-on-primary-muted: #CECFCA;
  --color-on-accent: #111827;
  --color-on-surface: #111827;
  --color-on-surface-muted: #54555D;
  --color-on-card: #111827;
  --color-on-card-muted: #54545C;
  --color-border-surface: #ECECEA;
  --color-border-card: #E2E3DF;
  --button-primary-bg: #505543;
  --button-primary-bg-hover: #464B3B;
  --button-primary-fg: #FFFFFF;
  --button-accent-bg: #E67E22;
  --button-accent-bg-hover: #C46B1D;
  --button-accent-fg: #111827;
  --button-whatsapp-bg: #25D366;
  --button-whatsapp-bg-hover: #1DA851;
  --button-whatsapp-fg: #FFFFFF;
  --button-surface-bg: #FFFFFF;
  --button-surface-fg: #111827;
  --button-outline-light-fg: #FFFFFF;
  --button-outline-light-border: rgba(255, 255, 255, 0.5);
  --icon-button-bg: #FFFFFF;
  --icon-button-fg: #505543;
  --icon-button-hover-bg: #505543;
  --icon-button-hover-fg: #FFFFFF;
  --font-heading: "EB Garamond", Georgia, serif;
  --font-body: "Nunito Sans", ui-sans-serif, system-ui, sans-serif;
  --font-sans: "Nunito Sans", ui-sans-serif, system-ui, sans-serif;
  --font-serif: "EB Garamond", Georgia, serif;
  --radius-card: 2rem;
  --radius-button: 9999px;
  --shadow-soft: 0 20px 60px rgba(55, 63, 101, 0.12);
  --spacing-density: 1;
}