@font-face {
  font-family: "Bricolage Grotesque";
  src: url("/assets/fonts/bricolage-grotesque.ttf") format("truetype");
  font-weight: 200 800;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Atkinson Hyperlegible Next";
  src: url("/assets/fonts/atkinson-hyperlegible-next.ttf") format("truetype");
  font-weight: 200 800;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: "Cabin Sketch";
  src: url("/assets/fonts/cabin-sketch-bold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

:root {
  --craie-paper: #f7f4ed;
  --craie-ink: #273e35;
  --craie-accent: #365e4e;
  --craie-sage: #dfe7dc;
  --craie-clay: #d7a58b;
  --craie-white: #ffffff;
  --craie-ink-soft: #53665b;
  --craie-line: #cbd3c8;
  --craie-accent-hover: #294b3c;
  --font-display: "Bricolage Grotesque", sans-serif;
  --font-body: "Atkinson Hyperlegible Next", sans-serif;
}