/* ==========================================================================
   TPC — Design tokens
   Identity comes from TPC_Brand_Guidelines_2026.pdf: the five palette colours,
   the three typefaces, the Contour Line. Layout, scale and motion belong to
   the site. Change a token here, not in a component.
   ========================================================================== */

:root {
  /* ---- Brand palette ---------------------------------------------------- */
  --navy:   #0A3F7F;   /* Deep Field Navy  PANTONE 294 C */
  --red:    #C6233B;   /* Signal Crimson   PANTONE 200 C: CTAs, rules, small accents; under 0.5% of the page */
  --ink:    #10161D;   /* Graphite         PANTONE Black 6 C */
  --steel:  #5A6673;   /* Steel            PANTONE 432 C */
  --fog:    #F3F5F7;   /* Fog              PANTONE 663 C */
  --white:  #FFFFFF;

  /* Working shades */
  --navy-deep: #072F60;
  --red-deep:  #A81B30;
  --ink-2:     #19212B;   /* raised surfaces on Graphite */
  --signal:    #6DA8DB;   /* Contour Line trace on dark grounds (guidelines p9) */

  /* ---- Text ------------------------------------------------------------- */
  --t-strong:      var(--ink);
  --t-body:        var(--steel);
  --t-on-dark:     rgba(255,255,255,.80);
  --t-on-dark-dim: rgba(255,255,255,.64);   /* ≥ 4.5:1 on Navy and Graphite */

  /* ---- Lines ------------------------------------------------------------ */
  --line:      #DCE2E8;
  --line-dark: rgba(255,255,255,.14);

  /* ---- Type --------------------------------------------------------------
     Display: Poppins SemiBold/Bold only. Body: Liberation Sans (Arial
     permitted). Labels: TeX Gyre Heros Condensed, stand-in Archivo Narrow.  */
  --f-display: 'Poppins', system-ui, sans-serif;
  --f-body:    'Liberation Sans', Arial, Helvetica, sans-serif;
  --f-label:   'TeX Gyre Heros Cn', 'Archivo Narrow', 'Arial Narrow', Arial, sans-serif;

  --fs-hero:  clamp(2.5rem, 5.4vw, 5.25rem);
  --fs-h2:    clamp(1.9rem, 3.5vw, 3.25rem);
  --fs-h3:    clamp(1.35rem, 2vw, 1.875rem);
  --fs-lead:  clamp(1.05rem, 1.3vw, 1.25rem);
  --fs-body:  1rem;
  --fs-sm:    .9375rem;
  --fs-label: .78rem;
  --ls-label: .17em;

  /* ---- Layout ----------------------------------------------------------- */
  --container: 1240px;
  --gutter:    clamp(1.25rem, 4vw, 3rem);
  --inset:     clamp(8px, 1.6vw, 24px);   /* colour bands sit inset, square-cornered */
  --band-y:    clamp(4.5rem, 9vw, 8.5rem);
  --radius-pill: 999px;

  /* ---- Elevation -------------------------------------------------------- */
  --shadow-card: 0 1px 2px rgba(16,22,29,.05), 0 18px 48px rgba(16,22,29,.10);
  --shadow-nav:  0 2px 8px rgba(8,30,60,.10), 0 18px 40px rgba(8,30,60,.16);

  /* ---- Motion ----------------------------------------------------------- */
  --ease:        cubic-bezier(.22,.61,.36,1);
  --ease-out:    cubic-bezier(.16,1,.3,1);
  --ease-in-out: cubic-bezier(.65,0,.35,1);
  --dur-fast: .2s;
  --dur:      .4s;
  --dur-slow: .8s;

  /* ---- Focus ------------------------------------------------------------ */
  --focus-ring: var(--red);   /* light grounds; dark grounds switch to white */
}