/* --------------------------------------------------------------
   Load Space Grotesk Variable
   -------------------------------------------------------------- */
@font-face {
    font-family: 'Space Grotesk Variable';

    /* name you’ll reference later */
    src: url('SpaceGrotesk-VariableFont_wght.ttf')
       format('truetype');

   /* .ttf file */
   font-display: swap;

    /* same behaviour you used before */
    /* Declare the range of the weight axis that the variable font supports.
     Space Grotesk’s variable file covers the full 100‑900 range. */
    font-weight: 400 700;

    /* full weight spectrum */
    /* If the font had additional axes (width, slant, etc.) you could declare them here,
     e.g. font-stretch: 75% 125%;  font-style: normal italic; */
}

/* Ensure a sensible system fallback while the webfont loads */
.font-sans {
   font-family: 'Space Grotesk Variable', Arial, sans-serif;
}