/*
 * SCEO: what the pages of this deployment take from the brand.
 *
 * Served at /brand/brand.css and linked from index.html before the app's
 * own stylesheet, so the type and the mark are there on the first paint.
 * The app names only the variables; the values live here.
 */

/* Aeonik: CoType Foundry, licensed to SCEO (webfont EULA in the order
 * folder). Self-hosted rather than fetched: the pages that matter most
 * are printed by a headless browser on the server, and a document whose
 * type depends on somebody else's CDN is a document that eventually
 * prints in Arial. This directory ships only in the SCEO images.
 *
 * `swap` deliberately: a paragraph readable in the fallback beats a
 * paragraph that isn't there yet. The printed pages wait for the fonts
 * before they say they are ready, so nothing is photographed mid-swap. */
@font-face {
  font-family: 'Aeonik';
  src:
    url('/brand/fonts/aeonik-regular.woff2') format('woff2'),
    url('/brand/fonts/aeonik-regular.woff') format('woff');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Aeonik';
  src:
    url('/brand/fonts/aeonik-medium.woff2') format('woff2'),
    url('/brand/fonts/aeonik-medium.woff') format('woff');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Aeonik Mono';
  src:
    url('/brand/fonts/aeonikmono-regular.woff2') format('woff2'),
    url('/brand/fonts/aeonikmono-regular.woff') format('woff');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

:root {
  --font-sans: 'Aeonik', Arial, sans-serif;
  --font-mono: 'Aeonik Mono', Arial, monospace;
  /* The mark: logo.svg's viewBox, width over height, so its box has its
   * size before the file arrives. Single colour, so it is drawn through
   * a mask in the text colour of wherever it sits (dark on the light
   * pages, white on the dark bars), as it was when the SVG was inlined. */
  --brand-logo-ratio: 1122 / 324;
  --brand-logo-paint: currentColor;
  --brand-logo-mask: url('/brand/logo.svg') center / contain no-repeat;
}
