/* FONTS */
@font-face {
  font-family: "Items Text Regular";
  src: url("../fonts/ItemsText-Regular.woff2") format("woff2"),
       url("../fonts/ItemsText-Regular.woff") format("woff");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "Items Text Regular Italic";
  src: url("../fonts/ItemsText-RegularItalic.woff2") format("woff2"),
       url("../fonts/ItemsText-RegularItalic.woff") format("woff");
  font-weight: normal;
  font-style: italic;
}

@font-face {
  font-family: "Items Text Bold";
  src: url("../fonts/ItemsText-Bold.woff2") format("woff2"),
       url("../fonts/ItemsText-Bold.woff") format("woff");
  font-weight: bold;
  font-style: normal;
}

@font-face {
  font-family: "Items Text Bold Italic";
  src: url("../fonts/ItemsText-BoldItalic.woff2") format("woff2"),
       url("../fonts/ItemsText-BoldItalic.woff") format("woff");
  font-weight: bold;
  font-style: italic;
}

@font-face {
  font-family: "Phonic";
  src: url("../fonts/Phonic-Regular.woff2") format("woff2"),
       url("../fonts/Phonic-Regular.woff") format("woff");
  font-weight: normal;
  font-style: normal;
}

:root {
  --font-family-ui-sans: "Phonic", ui-sans-serif, system-ui, Roboto, Helvetica, Arial, sans-serif;
  --font-family-ui-mono: ui-monospace, monospace;
  --font-family-serif: "Items Text Regular", serif;
  --font-family-serif-italic: "Items Text Regular Italic", serif;
  --font-family-serif-bold: "Items Text Bold", serif;
  --font-family-serif-bold-italic: "Items Text Bold Italic", serif;
  --font-family-sans: "Phonic", sans-serif;
  --font-family-script: "Astloch", cursive;
}