/* Self-hosted faces. Downloaded from Google Fonts at build time (latin + latin-ext
   subsets only) and served from this origin - there is no fonts.googleapis.com
   request anywhere in production. Playfair Display is a variable face (400-900). */

@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 400 900;
  font-display: swap;
  src: url('/assets/fonts/PlayfairDisplay-var-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Playfair Display';
  font-style: normal;
  font-weight: 400 900;
  font-display: swap;
  src: url('/assets/fonts/PlayfairDisplay-var-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/assets/fonts/IBMPlexSans-400-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/assets/fonts/IBMPlexSans-400-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/assets/fonts/IBMPlexSans-500-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'IBM Plex Sans';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/assets/fonts/IBMPlexSans-500-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/assets/fonts/IBMPlexMono-500-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/assets/fonts/IBMPlexMono-500-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* ------------------------------------------------------------------ tokens */

:root {
  /* Palette - the only colours used anywhere on the site.
     Navy is the ground; gold is the single warm accent (buttons, eyebrows,
     rules); cyan/sky carry icons and links so gold never has to do both. */
  --ink:        #071127;   /* deep navy - hero, capabilities, operations, footer */
  --ink-2:      #0C1B3A;   /* raised navy - stats band, cards on ink */
  --ink-3:      #12264D;   /* card border/fill on ink */
  --paper:      #FFFFFF;
  --mist:       #F3F6FB;
  --line:       #DCE3EE;
  --steel:      #5B6678;

  --accent:      #E2B24A;  /* gold */
  --accent-deep: #8A6412;  /* gold as TEXT on light bands (AA: 5.4:1 on white) */
  --accent-on-ink: #F0C45C;
  --accent-text: #8A6412;

  --sky:        #2F7FE0;   /* icon + link blue on light bands */
  --sky-deep:   #1C5FB3;
  --cyan:       #5ED2E8;   /* icon blue on ink */
  --live:       #2ED47A;

  /* On-ink variants: the light palette has no contrast on navy. */
  --line-ink:   rgba(220, 227, 238, 0.16);
  --steel-ink:  #A7B3C7;
  --paper-ink:  #EDF2FA;

  /* Type */
  --display: 'Playfair Display', Georgia, 'Times New Roman', serif;
  --body:    'IBM Plex Sans', 'Segoe UI', Helvetica, Arial, sans-serif;
  --mono:    'IBM Plex Mono', ui-monospace, 'SF Mono', Menlo, Consolas, monospace;

  --fs-h1:    clamp(2.5rem, 1.2rem + 4.2vw, 4.25rem);
  --fs-h2:    clamp(1.9rem, 1.35rem + 1.8vw, 2.75rem);
  --fs-h3:    clamp(1.2rem, 1.1rem + 0.35vw, 1.4rem);
  --fs-body:  clamp(1rem, 0.985rem + 0.05vw, 1.0625rem);
  --fs-small: 0.9375rem;
  --fs-mono:  clamp(0.6875rem, 0.665rem + 0.075vw, 0.75rem);

  --lh-h1: 1.06;
  --lh-h2: 1.14;
  --lh-h3: 1.25;
  --lh-body: 1.6;
  --lh-legal: 1.7;

  --track-h1: -0.01em;
  --track-h3: 0;
  --track-mono: 0.16em;

  /* Structure */
  --maxw: 1280px;
  --maxw-legal: 840px;
  --measure: 66ch;
  --measure-legal: 78ch;
  --gutter: 20px;
  --sec: 72px;          /* section rhythm - one variable, never ad hoc */
  --radius: 10px;
  --rail: 2px;
  --header-h: 104px;   /* two rows below 1000px; one row above */
}

@media (min-width: 768px) {
  :root { --gutter: 32px; --sec: 112px; }
}

@media (min-width: 1000px) {
  :root { --header-h: 76px; }
}

/* The header sits on navy at every scroll position and on every page, so the
   logo and nav tokens are the on-ink set everywhere. */
:root {
  --logo-fg:       #FFFFFF;
  --logo-sub:      rgba(255, 255, 255, .72);
  --logo-accent:   var(--accent);
  --logo-blue:     var(--cyan);
  --nav-fg:        var(--steel-ink);
  --nav-fg-active: #FFFFFF;
}
@media (min-width: 1000px) {
  :root { --nav-fg: #E4EAF4; }
}

/* Film grain: a 128x128 tiled SVG noise, hero imagery only, 3% opacity. */
:root {
  --grain: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='128' height='128'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='128' height='128' filter='url(%23n)'/%3E%3C/svg%3E");
}