:root {
  --font-heading: "Mohave", sans-serif;
  --font-paragraph: "Supreme", sans-serif;
}

@font-face {
  font-family: "Mohave";
  src: url("../fonts/Mohave-Light.ttf") format("truetype");
  font-weight: 300;
  font-display: swap;
  font-style: normal;
}

@font-face {
  font-family: "Mohave";
  src: url("../fonts/Mohave-LightItalic.ttf") format("truetype");
  font-weight: 300;
  font-display: swap;
  font-style: italic;
}

@font-face {
  font-family: "Mohave";
  src: url("../fonts/Mohave-Regular.ttf") format("truetype");
  font-weight: 400;
  font-display: swap;
  font-style: normal;
}

@font-face {
  font-family: "Mohave";
  src: url("../fonts/Mohave-Italic.ttf") format("truetype");
  font-weight: 400;
  font-display: swap;
  font-style: italic;
}

@font-face {
  font-family: "Mohave";
  src: url("../fonts/Mohave-Medium.ttf") format("truetype");
  font-weight: 500;
  font-display: swap;
  font-style: normal;
}

@font-face {
  font-family: "Mohave";
  src: url("../fonts/Mohave-MediumItalic.ttf") format("truetype");
  font-weight: 500;
  font-display: swap;
  font-style: italic;
}

@font-face {
  font-family: "Mohave";
  src: url("../fonts/Mohave-SemiBold.ttf") format("truetype");
  font-weight: 600;
  font-display: swap;
  font-style: normal;
}

@font-face {
  font-family: "Mohave";
  src: url("../fonts/Mohave-SemiBoldItalic.ttf") format("truetype");
  font-weight: 600;
  font-display: swap;
  font-style: italic;
}

@font-face {
  font-family: "Mohave";
  src: url("../fonts/Mohave-Bold.ttf") format("truetype");
  font-weight: 700;
  font-display: swap;
  font-style: normal;
}

@font-face {
  font-family: "Mohave";
  src: url("../fonts/Mohave-BoldItalic.ttf") format("truetype");
  font-weight: 700;
  font-display: swap;
  font-style: italic;
}

@font-face {
  font-family: "Supreme";
  src:
    url("../fonts/Supreme-Thin.woff2") format("woff2"),
    url("../fonts/Supreme-Thin.woff") format("woff"),
    url("../fonts/Supreme-Thin.ttf") format("truetype");
  font-weight: 100;
  font-display: swap;
  font-style: normal;
}

@font-face {
  font-family: "Supreme";
  src:
    url("../fonts/Supreme-ThinItalic.woff2") format("woff2"),
    url("../fonts/Supreme-ThinItalic.woff") format("woff"),
    url("../fonts/Supreme-ThinItalic.ttf") format("truetype");
  font-weight: 100;
  font-display: swap;
  font-style: italic;
}

@font-face {
  font-family: "Supreme";
  src:
    url("../fonts/Supreme-ExtraLight.woff2") format("woff2"),
    url("../fonts/Supreme-ExtraLight.woff") format("woff"),
    url("../fonts/Supreme-ExtraLight.ttf") format("truetype");
  font-weight: 200;
  font-display: swap;
  font-style: normal;
}

@font-face {
  font-family: "Supreme";
  src:
    url("../fonts/Supreme-ExtraLightItalic.woff2") format("woff2"),
    url("../fonts/Supreme-ExtraLightItalic.woff") format("woff"),
    url("../fonts/Supreme-ExtraLightItalic.ttf") format("truetype");
  font-weight: 200;
  font-display: swap;
  font-style: italic;
}

@font-face {
  font-family: "Supreme";
  src:
    url("../fonts/Supreme-Light.woff2") format("woff2"),
    url("../fonts/Supreme-Light.woff") format("woff"),
    url("../fonts/Supreme-Light.ttf") format("truetype");
  font-weight: 300;
  font-display: swap;
  font-style: normal;
}

@font-face {
  font-family: "Supreme";
  src:
    url("../fonts/Supreme-LightItalic.woff2") format("woff2"),
    url("../fonts/Supreme-LightItalic.woff") format("woff"),
    url("../fonts/Supreme-LightItalic.ttf") format("truetype");
  font-weight: 300;
  font-display: swap;
  font-style: italic;
}

@font-face {
  font-family: "Supreme";
  src:
    url("../fonts/Supreme-Regular.woff2") format("woff2"),
    url("../fonts/Supreme-Regular.woff") format("woff"),
    url("../fonts/Supreme-Regular.ttf") format("truetype");
  font-weight: 400;
  font-display: swap;
  font-style: normal;
}

@font-face {
  font-family: "Supreme";
  src:
    url("../fonts/Supreme-Italic.woff2") format("woff2"),
    url("../fonts/Supreme-Italic.woff") format("woff"),
    url("../fonts/Supreme-Italic.ttf") format("truetype");
  font-weight: 400;
  font-display: swap;
  font-style: italic;
}

@font-face {
  font-family: "Supreme";
  src:
    url("../fonts/Supreme-Medium.woff2") format("woff2"),
    url("../fonts/Supreme-Medium.woff") format("woff"),
    url("../fonts/Supreme-Medium.ttf") format("truetype");
  font-weight: 500;
  font-display: swap;
  font-style: normal;
}

@font-face {
  font-family: "Supreme";
  src:
    url("../fonts/Supreme-MediumItalic.woff2") format("woff2"),
    url("../fonts/Supreme-MediumItalic.woff") format("woff"),
    url("../fonts/Supreme-MediumItalic.ttf") format("truetype");
  font-weight: 500;
  font-display: swap;
  font-style: italic;
}

@font-face {
  font-family: "Supreme";
  src:
    url("../fonts/Supreme-Bold.woff2") format("woff2"),
    url("../fonts/Supreme-Bold.woff") format("woff"),
    url("../fonts/Supreme-Bold.ttf") format("truetype");
  font-weight: 700;
  font-display: swap;
  font-style: normal;
}

@font-face {
  font-family: "Supreme";
  src:
    url("../fonts/Supreme-BoldItalic.woff2") format("woff2"),
    url("../fonts/Supreme-BoldItalic.woff") format("woff"),
    url("../fonts/Supreme-BoldItalic.ttf") format("truetype");
  font-weight: 700;
  font-display: swap;
  font-style: italic;
}

@font-face {
  font-family: "Supreme";
  src:
    url("../fonts/Supreme-Extrabold.woff2") format("woff2"),
    url("../fonts/Supreme-Extrabold.woff") format("woff"),
    url("../fonts/Supreme-Extrabold.ttf") format("truetype");
  font-weight: 800;
  font-display: swap;
  font-style: normal;
}

@font-face {
  font-family: "Supreme";
  src:
    url("../fonts/Supreme-ExtraboldItalic.woff2") format("woff2"),
    url("../fonts/Supreme-ExtraboldItalic.woff") format("woff"),
    url("../fonts/Supreme-ExtraboldItalic.ttf") format("truetype");
  font-weight: 800;
  font-display: swap;
  font-style: italic;
}
