@font-face {
    font-family: "CircularXXWeb";
    font-style: normal;
    font-weight: 900; /* Black */
    src: url("../fonts/circular/CircularXXWeb-Black.woff2") format("woff2"),
         url("../fonts/circular/CircularXXWeb-Black.woff") format("woff");
}

@font-face {
    font-family: "CircularXXWeb";
    font-style: normal;
    font-weight: 700; /* Bold */
    src: url("../fonts/circular/CircularXXWeb-Bold.woff2") format("woff2"),
         url("../fonts/circular/CircularXXWeb-Bold.woff") format("woff");
}

@font-face {
    font-family: "CircularXXWeb";
    font-style: normal;
    font-weight: 400; /* Book (often treated as regular) */
    src: url("../fonts/circular/CircularXXWeb-Book.woff2") format("woff2"),
         url("../fonts/circular/CircularXXWeb-Book.woff") format("woff");
}

@font-face {
    font-family: "CircularXXWeb";
    font-style: normal;
    font-weight: 300; /* Light */
    src: url("../fonts/circular/CircularXXWeb-Light.woff2") format("woff2"),
         url("../fonts/circular/CircularXXWeb-Light.woff") format("woff");
}

@font-face {
    font-family: "CircularXXWeb";
    font-style: normal;
    font-weight: 500; /* Medium */
    src: url("../fonts/circular/CircularXXWeb-Medium.woff2") format("woff2"),
         url("../fonts/circular/CircularXXWeb-Medium.woff") format("woff");
}

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

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