:root {
  /* css tokens - define the brand styles */
  --font-body: "HelveticaNeueLTPro", serif;
  --font-headline: "HelveticaNeueLTPro", serif;
  --color-primary: #A3D6C7;
  --color-primary-200: #D2F0E6;
  --color-secondary-100: #A7EFD2;
  --color-secondary-200: #D2F0E6;
  --color-secondary-300: #F2F2F2;
  --color-orange: #EB3300;
  --color-red: #FF0000;
  --color-black: #000000;
  --color-white: #FFFFFF;
  --color-green: #009900;
  --width-logo-header: 9rem;
  --width-logo-header-lg: 10.125rem;

  /* css roles - always reference a css token  */
  --color-button-sku: var(--color-primary-200);
  --star-size: 1rem;
  --star-color: var(--color-white);
  --star-background: var(--color-primary);
  --color-header: var(--color-black);
  --color-header-fg: var(--color-white);
}