@font-face {
    font-family: "SFPro";
    src: url("../fonts/SF-Pro-Text-Light.woff2") format("woff2"), url("../fonts/SF-Pro-Text-Light.woff") format("woff");
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "SFPro";
    src: url("../fonts/SF-Pro-Text-Regular.woff2") format("woff2"), url("../fonts/SF-Pro-Text-Regular.woff") format("woff");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "SFPro";
    src: url("../fonts/SF-Pro-Text-Medium.woff2") format("woff2"), url("../fonts/SF-Pro-Text-Medium.woff") format("woff");
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "SFPro";
    src: url("../fonts/SF-Pro-Text-Semibold.woff2") format("woff2"), url("../fonts/SF-Pro-Text-Semibold.woff") format("woff");
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "SFPro";
    src: url("../fonts/SF-Pro-Text-Bold.woff2") format("woff2"), url("../fonts/SF-Pro-Text-Bold.woff") format("woff");
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

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

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

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

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

@font-face {
    font-family: "RedHatDisplay";
    src: url("../fonts/RedHatDisplay-Italic.woff2") format("woff2"), url("../fonts/RedHatDisplay-Italic.woff") format("woff");
    font-weight: 400;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: "SFHello";
    src: url("../fonts/SFHelloRegular.woff2") format("woff2"), url("../fonts/SFHelloRegular.woff") format("woff");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "SFHello";
    src: url("../fonts/SFHelloMedium.woff2") format("woff2"), url("../fonts/SFHelloMedium.woff") format("woff");
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "SFHello";
    src: url("../fonts/SFHelloSemibold.woff2") format("woff2"), url("../fonts/SFHelloSemibold.woff") format("woff");
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "SFHello";
    src: url("../fonts/SFHelloBold.woff2") format("woff2"), url("../fonts/SFHelloBold.woff") format("woff");
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

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

@font-face {
    font-family: "Optima";
    src: url("../fonts/Optima-Italic.woff2") format("woff2"), url("../fonts/Optima-Italic.woff") format("woff");
    font-weight: 400;
    font-style: italic;
    font-display: swap;
}

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

@font-face {
    font-family: "Optima";
    src: url("../fonts/Optima-BoldItalic.woff2") format("woff2"), url("../fonts/Optima-BoldItalic.woff") format("woff");
    font-weight: 700;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: "Optima";
    src: url("../fonts/Optima-ExtraBlack.woff2") format("woff2"), url("../fonts/Optima-ExtraBlack.woff") format("woff");
    font-weight: 800;
    font-style: normal;
    font-display: swap;
}