/* Die Grotesk Variable Font */

/* Roman */
@font-face {
	font-family: 'Die Grotesk';
	src: url('./die-grotesk/test-die-grotesk-vf-roman.woff2') format('woff2-variations');
	font-weight: 100 900;
	font-style: normal;
	font-display: swap;
}

/* Italic */
@font-face {
	font-family: 'Die Grotesk';
	src: url('./die-grotesk/test-die-grotesk-vf-italic.woff2') format('woff2-variations');
	font-weight: 100 900;
	font-style: italic;
	font-display: swap;
}

/*
 * Weight mapping (use font-weight):
 * Hairline: 100
 * Thin:     200
 * Light:    300
 * Regular:  400
 * Medium:   500
 * Bold:     700
 * Black:    800
 * Heavy:    900
 *
 * Optical size axis (use font-variation-settings 'opsz'):
 * A (body, tighter):  use opsz ~8-12
 * B (body, normal):   use opsz ~14-18
 * C (display, wide):  use opsz ~24-48
 * D (display, wider): use opsz ~72+
 *
 * Example usage:
 * .body-text { font-variation-settings: 'opsz' 14; }
 * .title { font-variation-settings: 'opsz' 72; font-weight: 700; }
 */

/* Utility classes for optical sizes */
.die-grotesk-a { font-variation-settings: 'opsz' 10; }
.die-grotesk-b { font-variation-settings: 'opsz' 16; }
.die-grotesk-c { font-variation-settings: 'opsz' 36; }
.die-grotesk-d { font-variation-settings: 'opsz' 72; }
