:root {
  --color-orange: #f27f0d;
  --color-brown: #4f401b;
  --color-cream: #f5eee1;
  --color-primary-light: #fff4e8;
  --color-primary-light-hover: #ffead4;
  --color-primary-light-active: #ffd3a8;
  --color-primary: #f27f0d;
  --color-primary-hover: #d96f08;
  --color-primary-active: #bf6005;
  --color-primary-dark: #9a4e06;
  --color-brown-light: #f3efe4;
  --color-brown-light-hover: #e8dec8;
  --color-brown-light-active: #d2be95;
  --color-brown-normal: #4f401b;
  --color-brown-hover: #463817;
  --color-brown-active: #392e13;
  --color-brown-dark: #261f0d;
  --color-cream-light: #ffffff;
  --color-cream-light-hover: #fff9f0;
  --color-cream-light-active: #f9f1e6;
  --color-cream-normal: #f5eee1;
  --color-cream-hover: #eaddcb;
  --color-cream-active: #ddcdb8;
  --color-cream-dark: #bca98e;
  --text-on-light: #4f401b;
  --text-on-dark: #fff9f0;
  --font-family: "Outfit", sans-serif;;
  --font-size-h1: 80px;
  --font-size-h2: 40px;
  --font-size-h3: 30px;
  --font-size-h4: 20px;
  --font-size-h5: 16px;
  --font-size-h6: 14px;
  --font-size-body-large: 18px;
  --font-size-body-base: 16px;
  --font-size-body-small: 14px;
  --font-weight-bold: 700;
  --font-weight-regular: 400;
  --spacing-xs: 4px;
  --spacing-sm: 8px;
  --spacing-md: 16px;
  --spacing-lg: 24px;
  --spacing-xl: 32px;
  --spacing-xxl: 48px;
  --radius-sm: 6px;
  --radius-md: 12px;
  --radius-lg: 24px;
  --card-radius-brand: 32px 96px 32px 32px;
}