Token sheet

/* Triway Brand Guidelines v2.0 "Interlock" · design tokens */
:root {
  /* Brand (fixed, from the logo) */
  --brand-navy: #2F3A75;  --brand-orange: #F26521;  --brand-green: #00A650;

  /* Navy · structure */
  --navy-50:#F0F2FA; --navy-100:#DEE2F3; --navy-200:#C0C7E6; --navy-300:#97A1D3;
  --navy-400:#6B78B7; --navy-500:#47549B; --navy-600:#37438A; --navy-700:#2F3A75;
  --navy-800:#232C59; --navy-900:#181F40; --navy-950:#0C1023;

  /* Orange · action */
  --orange-50:#FEF2EA; --orange-100:#FDE0CD; --orange-200:#FAC09C; --orange-300:#F79763;
  --orange-400:#F47B3C; --orange-500:#F26521; --orange-600:#D14F10; --orange-700:#A8420F;

  /* Green · success only */
  --green-50:#EDFAF3; --green-100:#D6F4E3; --green-500:#00A650; --green-600:#008E44; --green-700:#00753A;

  /* Mist neutrals */
  --mist-0:#FFFFFF; --mist-25:#FBFCFE; --mist-50:#F6F7FB; --mist-100:#EDEFF6;
  --mist-200:#DFE2EC; --mist-300:#C5CAD9; --mist-400:#9BA2B8; --mist-500:#737B93;
  --mist-600:#565D73; --mist-700:#3F4557; --mist-800:#2B3040; --mist-900:#1B1F2B;

  /* Semantic */
  --success:#008E44; --warning:#8F5B06; --danger:#CE2F3E; --info:#37438A;

  /* Type */
  --font-display:'Archivo',sans-serif;        /* headings · wght 650 · wdth 105-115% */
  --font-body:'Hanken Grotesk',sans-serif;    /* UI and body · 400/600 */
  --font-mono:'IBM Plex Mono',monospace;      /* labels and data · 500 */
  --font-arabic:'IBM Plex Sans Arabic',sans-serif;

  /* Shape and space */
  --r-xs:4px; --r-sm:8px; --r-md:14px; --r-lg:22px; --r-full:999px;
  --s-1:4px; --s-2:8px; --s-3:12px; --s-4:16px; --s-5:24px;
  --s-6:32px; --s-7:48px; --s-8:64px; --s-9:96px; --s-10:128px;

  /* Motion */
  --dur-fast:150ms; --dur-base:250ms; --dur-slow:450ms; --dur-page:700ms;
  --ease-out:cubic-bezier(.22,.7,.24,1); --ease-in-out:cubic-bezier(.6,0,.2,1);

  /* Elevation (Day only) */
  --shadow-sm:0 1px 2px rgba(12,16,35,.06),0 1px 6px rgba(12,16,35,.04);
  --shadow-md:0 2px 6px rgba(12,16,35,.06),0 10px 28px rgba(12,16,35,.08);
}