/* gisanalytics.uk — typography
   ==========================================================================
   Before this file the marketing site had no typeface of its own: index and
   workshops fell back to the system stack, and every other page rendered in the
   browser default. Two pages pulled Inter from Google Fonts and nothing else did.
   This gives the whole site one face, self-hosted.

   The tokens mirror the Hippo design system at
   UCL/hippo-design-system/tokens.css so the product and the company that makes
   it are set in the same type. Colour is deliberately NOT imported: Hippo's
   Deep Water palette is the product's identity, not the consultancy's.

   Self-hosted rather than Google Fonts on purpose. One request instead of two,
   no third-party DNS on the critical path, and no visitor IP handed to Google,
   which is the part that matters under GDPR.

   VERSION THIS FILE when you change it. It is served with a long cache, so the
   ?v= in every <link> is what makes a change reach returning visitors. Same
   procedure as css/mobile.css.
   ========================================================================== */

@font-face {
  font-family: 'DM Sans';
  src: url('/fonts/DMSans-var.woff2') format('woff2');
  font-weight: 100 1000;              /* variable: one file covers every weight */
  font-style: normal;
  font-display: swap;                 /* show fallback text immediately, swap when ready */
}
@font-face {
  font-family: 'JetBrains Mono';
  src: url('/fonts/JetBrainsMono-var.woff2') format('woff2');
  font-weight: 400 600;
  font-style: normal;
  font-display: swap;
}

:root {
  --font-sans: 'DM Sans', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, Menlo, Consolas, monospace;

  --weight-body: 400;
  --weight-medium: 500;
  --weight-strong: 700;

  /* DM Sans runs loose at display sizes, so tracking tightens as size grows */
  --tracking-display: -0.03em;
  --tracking-head: -0.02em;
  --tracking-body: 0;
  --tracking-mono: 0.09em;
}

/* Base. Kept to font properties only: this file must not move anything, or it
   would fight the per-page Tailwind and hand-written layout across 60 pages. */
body {
  font-family: var(--font-sans);
  font-weight: var(--weight-body);
  letter-spacing: var(--tracking-body);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-sans);
  letter-spacing: var(--tracking-head);
}
h1 { letter-spacing: var(--tracking-display); }

/* Form controls do not inherit the page font in any browser unless told to */
button, input, select, textarea { font-family: inherit; }

/* Machine-flavoured text: code, metrics, terminal output, running heads */
code, kbd, samp, pre, .mono {
  font-family: var(--font-mono);
}

/* Utility, for labels and running heads that want the mono treatment */
.type-label {
  font-family: var(--font-mono);
  font-size: 0.72rem;
  letter-spacing: var(--tracking-mono);
  text-transform: uppercase;
}