/*
 * Self-hosted webfonts. Source TTF files in /assets/fonts/.
 *
 * Three families are registered across their full weight range plus italics.
 * A face is only downloaded when the CSS actually references that family +
 * weight + style, so registering everything here is free until used. That
 * means new weights/styles from the designs can be used straight from the
 * SCSS (font-weight / font-style) without adding anything here.
 *
 *   Archivo        - primary site font (body default, headings)     100-900
 *   Hanken Grotesk - available for use where the designs call for it 100-900
 *   IBM Plex Mono  - technical labels on the product cards           100-700
 *
 * IBM Plex Mono ships no 800/900 weight, so those two rungs are absent; it is
 * only used at 400 (see the `mono-badge` / `mono-spec` mixins). Licensed under
 * the SIL Open Font License, see assets/fonts/IBMPlexMono-OFL.txt.
 */

/* ------------------------------------------------------------------ Archivo */

@font-face { font-family: "Archivo"; font-style: normal; font-weight: 100; font-display: swap; src: url("../fonts/Archivo-Thin.ttf") format("truetype"); }
@font-face { font-family: "Archivo"; font-style: normal; font-weight: 200; font-display: swap; src: url("../fonts/Archivo-ExtraLight.ttf") format("truetype"); }
@font-face { font-family: "Archivo"; font-style: normal; font-weight: 300; font-display: swap; src: url("../fonts/Archivo-Light.ttf") format("truetype"); }
@font-face { font-family: "Archivo"; font-style: normal; font-weight: 400; font-display: swap; src: url("../fonts/Archivo-Regular.ttf") format("truetype"); }
@font-face { font-family: "Archivo"; font-style: normal; font-weight: 500; font-display: swap; src: url("../fonts/Archivo-Medium.ttf") format("truetype"); }
@font-face { font-family: "Archivo"; font-style: normal; font-weight: 600; font-display: swap; src: url("../fonts/Archivo-SemiBold.ttf") format("truetype"); }
@font-face { font-family: "Archivo"; font-style: normal; font-weight: 700; font-display: swap; src: url("../fonts/Archivo-Bold.ttf") format("truetype"); }
@font-face { font-family: "Archivo"; font-style: normal; font-weight: 800; font-display: swap; src: url("../fonts/Archivo-ExtraBold.ttf") format("truetype"); }
@font-face { font-family: "Archivo"; font-style: normal; font-weight: 900; font-display: swap; src: url("../fonts/Archivo-Black.ttf") format("truetype"); }

@font-face { font-family: "Archivo"; font-style: italic; font-weight: 100; font-display: swap; src: url("../fonts/Archivo-ThinItalic.ttf") format("truetype"); }
@font-face { font-family: "Archivo"; font-style: italic; font-weight: 200; font-display: swap; src: url("../fonts/Archivo-ExtraLightItalic.ttf") format("truetype"); }
@font-face { font-family: "Archivo"; font-style: italic; font-weight: 300; font-display: swap; src: url("../fonts/Archivo-LightItalic.ttf") format("truetype"); }
@font-face { font-family: "Archivo"; font-style: italic; font-weight: 400; font-display: swap; src: url("../fonts/Archivo-Italic.ttf") format("truetype"); }
@font-face { font-family: "Archivo"; font-style: italic; font-weight: 500; font-display: swap; src: url("../fonts/Archivo-MediumItalic.ttf") format("truetype"); }
@font-face { font-family: "Archivo"; font-style: italic; font-weight: 600; font-display: swap; src: url("../fonts/Archivo-SemiBoldItalic.ttf") format("truetype"); }
@font-face { font-family: "Archivo"; font-style: italic; font-weight: 700; font-display: swap; src: url("../fonts/Archivo-BoldItalic.ttf") format("truetype"); }
@font-face { font-family: "Archivo"; font-style: italic; font-weight: 800; font-display: swap; src: url("../fonts/Archivo-ExtraBoldItalic.ttf") format("truetype"); }
@font-face { font-family: "Archivo"; font-style: italic; font-weight: 900; font-display: swap; src: url("../fonts/Archivo-BlackItalic.ttf") format("truetype"); }

/* ----------------------------------------------------------- Hanken Grotesk */

@font-face { font-family: "Hanken Grotesk"; font-style: normal; font-weight: 100; font-display: swap; src: url("../fonts/HankenGrotesk-Thin.ttf") format("truetype"); }
@font-face { font-family: "Hanken Grotesk"; font-style: normal; font-weight: 200; font-display: swap; src: url("../fonts/HankenGrotesk-ExtraLight.ttf") format("truetype"); }
@font-face { font-family: "Hanken Grotesk"; font-style: normal; font-weight: 300; font-display: swap; src: url("../fonts/HankenGrotesk-Light.ttf") format("truetype"); }
@font-face { font-family: "Hanken Grotesk"; font-style: normal; font-weight: 400; font-display: swap; src: url("../fonts/HankenGrotesk-Regular.ttf") format("truetype"); }
@font-face { font-family: "Hanken Grotesk"; font-style: normal; font-weight: 500; font-display: swap; src: url("../fonts/HankenGrotesk-Medium.ttf") format("truetype"); }
@font-face { font-family: "Hanken Grotesk"; font-style: normal; font-weight: 600; font-display: swap; src: url("../fonts/HankenGrotesk-SemiBold.ttf") format("truetype"); }
@font-face { font-family: "Hanken Grotesk"; font-style: normal; font-weight: 700; font-display: swap; src: url("../fonts/HankenGrotesk-Bold.ttf") format("truetype"); }
@font-face { font-family: "Hanken Grotesk"; font-style: normal; font-weight: 800; font-display: swap; src: url("../fonts/HankenGrotesk-ExtraBold.ttf") format("truetype"); }
@font-face { font-family: "Hanken Grotesk"; font-style: normal; font-weight: 900; font-display: swap; src: url("../fonts/HankenGrotesk-Black.ttf") format("truetype"); }

@font-face { font-family: "Hanken Grotesk"; font-style: italic; font-weight: 100; font-display: swap; src: url("../fonts/HankenGrotesk-ThinItalic.ttf") format("truetype"); }
@font-face { font-family: "Hanken Grotesk"; font-style: italic; font-weight: 200; font-display: swap; src: url("../fonts/HankenGrotesk-ExtraLightItalic.ttf") format("truetype"); }
@font-face { font-family: "Hanken Grotesk"; font-style: italic; font-weight: 300; font-display: swap; src: url("../fonts/HankenGrotesk-LightItalic.ttf") format("truetype"); }
@font-face { font-family: "Hanken Grotesk"; font-style: italic; font-weight: 400; font-display: swap; src: url("../fonts/HankenGrotesk-Italic.ttf") format("truetype"); }
@font-face { font-family: "Hanken Grotesk"; font-style: italic; font-weight: 500; font-display: swap; src: url("../fonts/HankenGrotesk-MediumItalic.ttf") format("truetype"); }
@font-face { font-family: "Hanken Grotesk"; font-style: italic; font-weight: 600; font-display: swap; src: url("../fonts/HankenGrotesk-SemiBoldItalic.ttf") format("truetype"); }
@font-face { font-family: "Hanken Grotesk"; font-style: italic; font-weight: 700; font-display: swap; src: url("../fonts/HankenGrotesk-BoldItalic.ttf") format("truetype"); }
@font-face { font-family: "Hanken Grotesk"; font-style: italic; font-weight: 800; font-display: swap; src: url("../fonts/HankenGrotesk-ExtraBoldItalic.ttf") format("truetype"); }
@font-face { font-family: "Hanken Grotesk"; font-style: italic; font-weight: 900; font-display: swap; src: url("../fonts/HankenGrotesk-BlackItalic.ttf") format("truetype"); }

/* ------------------------------------------------------------ IBM Plex Mono */

@font-face { font-family: "IBM Plex Mono"; font-style: normal; font-weight: 100; font-display: swap; src: url("../fonts/IBMPlexMono-Thin.ttf") format("truetype"); }
@font-face { font-family: "IBM Plex Mono"; font-style: normal; font-weight: 200; font-display: swap; src: url("../fonts/IBMPlexMono-ExtraLight.ttf") format("truetype"); }
@font-face { font-family: "IBM Plex Mono"; font-style: normal; font-weight: 300; font-display: swap; src: url("../fonts/IBMPlexMono-Light.ttf") format("truetype"); }
@font-face { font-family: "IBM Plex Mono"; font-style: normal; font-weight: 400; font-display: swap; src: url("../fonts/IBMPlexMono-Regular.ttf") format("truetype"); }
@font-face { font-family: "IBM Plex Mono"; font-style: normal; font-weight: 500; font-display: swap; src: url("../fonts/IBMPlexMono-Medium.ttf") format("truetype"); }
@font-face { font-family: "IBM Plex Mono"; font-style: normal; font-weight: 600; font-display: swap; src: url("../fonts/IBMPlexMono-SemiBold.ttf") format("truetype"); }
@font-face { font-family: "IBM Plex Mono"; font-style: normal; font-weight: 700; font-display: swap; src: url("../fonts/IBMPlexMono-Bold.ttf") format("truetype"); }

@font-face { font-family: "IBM Plex Mono"; font-style: italic; font-weight: 100; font-display: swap; src: url("../fonts/IBMPlexMono-ThinItalic.ttf") format("truetype"); }
@font-face { font-family: "IBM Plex Mono"; font-style: italic; font-weight: 200; font-display: swap; src: url("../fonts/IBMPlexMono-ExtraLightItalic.ttf") format("truetype"); }
@font-face { font-family: "IBM Plex Mono"; font-style: italic; font-weight: 300; font-display: swap; src: url("../fonts/IBMPlexMono-LightItalic.ttf") format("truetype"); }
@font-face { font-family: "IBM Plex Mono"; font-style: italic; font-weight: 400; font-display: swap; src: url("../fonts/IBMPlexMono-Italic.ttf") format("truetype"); }
@font-face { font-family: "IBM Plex Mono"; font-style: italic; font-weight: 500; font-display: swap; src: url("../fonts/IBMPlexMono-MediumItalic.ttf") format("truetype"); }
@font-face { font-family: "IBM Plex Mono"; font-style: italic; font-weight: 600; font-display: swap; src: url("../fonts/IBMPlexMono-SemiBoldItalic.ttf") format("truetype"); }
@font-face { font-family: "IBM Plex Mono"; font-style: italic; font-weight: 700; font-display: swap; src: url("../fonts/IBMPlexMono-BoldItalic.ttf") format("truetype"); }