@font-face {
    font-family: "Chromatic Pro Gothic";
    src: url("/assets/Chromatic-Pro-Gothic-Bold-4b03fc66.ttf") format("truetype");
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Chromatic Pro Gothic";
    src: url("/assets/Chromatic-Pro-Gothic-SemiBold-742f17a5.ttf") format("truetype");
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Chromatic Pro Geometric";
    src: url("/assets/Chromatic-Pro-Geometric-Bold-50cc875e.ttf") format("truetype");
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Chromatic Pro Geometric";
    src: url("/assets/Chromatic-Pro-Geometric-Medium-80f015b4.ttf") format("truetype");
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Chromatic Pro Condensed";
    src: url("/assets/Chromatic-Pro-Condensed-Bold-f9fd5a54.ttf") format("truetype");
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}

body {
    font-family:
        "Roboto", "Chromatic Pro Geometric", "Chromatic Pro Gothic", sans-serif;
    font-weight: 300;
    font-style: normal;
    font-display: swap;
    color: var(--text-brand-black);
}

input[type="text"],
input[type="email"],
input[type="password"],
textarea {
    font-family:
        "Roboto", "Chromatic Pro Geometric", "Chromatic Pro Gothic", sans-serif;
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

.font-inter {
    font-family: "Inter";
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}

.font-chromatic {
    font-family:
        "Chromatic Pro Gothic", "Chromatic Pro Geometric",
        "Chromatic Pro Condensed", sans-serif;
    font-weight: 700;
}

.font-chromatic-semi {
    font-weight: 600;
}

.font-chromatic-light {
    font-weight: 400;
}