@font-face {
    font-family: 'HKGrotesk-Black';
    src: local('HK Grotesk Black'), local('HKGrotesk-Black'),
        url('HKGrotesk-Black.woff2') format('woff2'),
        url('HKGrotesk-Black.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'HKGrotesk-Bold';
    src: local('HK Grotesk Bold'), local('HKGrotesk-Bold'),
        url('HKGrotesk-Bold.woff2') format('woff2'),
        url('HKGrotesk-Bold.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'HKGrotesk-ExtraBold';
    src: local('HK Grotesk ExtraBold'), local('HKGrotesk-ExtraBold'),
        url('HKGrotesk-ExtraBold.woff2') format('woff2'),
        url('HKGrotesk-ExtraBold.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'HKGrotesk-SemiBold';
    src: local('HK Grotesk SemiBold'), local('HKGrotesk-SemiBold'),
        url('HKGrotesk-SemiBold.woff2') format('woff2'),
        url('HKGrotesk-SemiBold.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'HKGrotesk-Italic';
    src: local('HK Grotesk Italic'), local('HKGrotesk-Italic'),
        url('HKGrotesk-Italic.woff2') format('woff2'),
        url('HKGrotesk-Italic.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'HKGrotesk-Regular';
    src: local('HK Grotesk Regular'), local('HKGrotesk-Regular'),
        url('HKGrotesk-Regular.woff2') format('woff2'),
        url('HKGrotesk-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'HKGrotesk-MediumItalic';
    src: local('HK Grotesk Medium Italic'), local('HKGrotesk-MediumItalic'),
        url('HKGrotesk-MediumItalic.woff2') format('woff2'),
        url('HKGrotesk-MediumItalic.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'HKGrotesk-LightItalic';
    src: local('HK Grotesk Light Italic'), local('HKGrotesk-LightItalic'),
        url('HKGrotesk-LightItalic.woff2') format('woff2'),
        url('HKGrotesk-LightItalic.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'HKGrotesk-SemiBoldItalic';
    src: local('HK Grotesk SemiBold Italic'), local('HKGrotesk-SemiBoldItalic'),
        url('HKGrotesk-SemiBoldItalic.woff2') format('woff2'),
        url('HKGrotesk-SemiBoldItalic.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'HKGrotesk-Light';
    src: local('HK Grotesk Light'), local('HKGrotesk-Light'),
        url('HKGrotesk-Light.woff2') format('woff2'),
        url('HKGrotesk-Light.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'HKGrotesk-Medium';
    src: local('HK Grotesk Medium'), local('HKGrotesk-Medium'),
        url('HKGrotesk-Medium.woff2') format('woff2'),
        url('HKGrotesk-Medium.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}