@font-face {
  font-family: "Recht";
  src: url("./recht/Recht-Black.woff2") format("woff2");
  font-style: normal;
  font-weight: 900;
  font-display: swap;
}

@font-face {
  font-family: "Recht";
  src: url("./recht/Recht-BlackItalic.woff2") format("woff2");
  font-style: italic;
  font-weight: 900;
  font-display: swap;
}

@font-face {
  font-family: "Cake Mono";
  src: url("./cake-mono/CakeMono-Light.woff2") format("woff2");
  font-style: normal;
  font-weight: 300;
  font-display: swap;
}

@font-face {
  font-family: "Cake Mono";
  src: url("./cake-mono/CakeMono-Regular.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "Cake Mono";
  src: url("./cake-mono/CakeMono-Bold.woff2") format("woff2");
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}

@font-face {
  font-family: "Geologica";
  src: url("./geologica/Geologica-Regular.ttf") format("truetype");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "Geologica";
  src: url("./geologica/Geologica-Medium.ttf") format("truetype");
  font-style: normal;
  font-weight: 500;
  font-display: swap;
}

@font-face {
  font-family: "Geologica";
  src: url("./geologica/Geologica-SemiBold.ttf") format("truetype");
  font-style: normal;
  font-weight: 600;
  font-display: swap;
}

@font-face {
  font-family: "Geologica";
  src: url("./geologica/Geologica-Bold.ttf") format("truetype");
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}

@font-face {
  font-family: "TA-DA Numbers";
  src:
    url("./tada-numbers/TADA-Regular.woff2") format("woff2"),
    url("./tada-numbers/TA-DA-Regular.otf") format("opentype");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

:root {
  --font-heading: "Recht", "Arial Black", sans-serif;
  --font-subheading: "Cake Mono", Consolas, monospace;
  --font-body: "Geologica", Arial, sans-serif;
  --font-number: "TA-DA Numbers", "Arial Black", sans-serif;
}

.tada-heading {
  font-family: var(--font-heading);
  font-style: normal;
  font-weight: 900;
}

.tada-heading .is-italic {
  font-family: var(--font-heading);
  font-style: italic;
  font-weight: 900;
}

.tada-subheading {
  font-family: var(--font-subheading);
}

.tada-body {
  font-family: var(--font-body);
}

.tada-number {
  font-family: var(--font-number);
  font-variant-numeric: tabular-nums;
}