/* Layer order for the whole site. Colours, fonts, radii and spacing are the only values to edit for a re-brand. */
@layer tokens, base, atoms, layout, sections, scenes;
@layer tokens {
:root {
  --color-1: #f7efe2;
  --color-2: #1f0b08;
  --color-3: #ebe2d3;
  --color-4: #6a5c53;
  --color-5: #f26b45;
  --color-6: #63a4bc;
  --color-7: #dcb155;
  --color-8: #96503f;
  --color-9: #3dac91;
  --color-10: #e2a8d3;
  --color-11: #8e8565;
  --font-1: "Google Sans", "Google Sans Fallback", Arial, sans-serif;
  --radius-1: 32px;
  --radius-2: 999px;
  --radius-3: 14px;
  --radius-4: 220px;
  --space-1: clamp(96px, 11vw, 168px);
  --space-2: clamp(16px, 3.2vw, 44px);
}
}