@font-face {
  font-family: "Google Sans Flex";
  src: url("../assets/fonts/GoogleSansFlex-Variable.woff2") format("woff2"),
    url("../assets/fonts/GoogleSansFlex-Variable.ttf") format("truetype");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
  /* Variable font axes:
     - wght (weight): 100-900 - automatically supported via font-weight property
     - opsz (optical size): automatically adjusted by browser based on font-size
     - slnt (slant): -12 to 0 degrees - can be used via font-style: italic or font-variation-settings
     - wdth (width): available via font-variation-settings if needed
     - GRAD, ROND: additional design axes available via font-variation-settings
  */
}

/* Italic variant using the same variable font with slant axis */
@font-face {
  font-family: "Google Sans Flex";
  src: url("../assets/fonts/GoogleSansFlex-Variable.woff2") format("woff2"),
    url("../assets/fonts/GoogleSansFlex-Variable.ttf") format("truetype");
  font-weight: 100 900;
  font-style: italic;
  font-display: swap;
}