/* Keytra brand tokens — v1 (2026-10-01). Drop in before site styles. */
/* Font: Archivo variable (width + weight axes). Load once in <head>:
   <link rel="preconnect" href="https://fonts.googleapis.com">
   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
   <link href="https://fonts.googleapis.com/css2?family=Archivo:wdth,wght@62..125,100..900&display=swap" rel="stylesheet">
*/
:root {
  /* colour — contrast ratios measured against the paired background */
  --k-ink: #15181A;          /* primary text + logo. 15.8:1 on paper, 17.8:1 on white */
  --k-paper: #F3F1ED;        /* default page background */
  --k-white: #FFFFFF;        /* cards / raised surfaces on paper */
  --k-muted: #5E6266;        /* secondary text. 5.5:1 on paper (AA) */
  --k-line: #D9D6D0;         /* hairlines, borders (decorative only) */
  --k-surface-dark: #2A2E31; /* cards on ink */
  --k-muted-on-ink: #A3A7AB; /* secondary text on ink. 7.4:1 (AAA) */

  /* type */
  --k-font: "Archivo", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --k-wdth-text: 100;        /* body + headlines */
  --k-wdth-display: 125;     /* eyebrows, labels, nav — echoes the wordmark */
  --k-weight-body: 400;
  --k-weight-strong: 600;
  --k-weight-head: 650;
  --k-weight-label: 600;
  --k-track-label: 0.12em;   /* uppercase expanded labels */
  --k-track-head: -0.01em;

  /* shape — echoes the mark's r12 corners */
  --k-radius-s: 8px;
  --k-radius-m: 12px;
  --k-radius-l: 20px;

  /* logo sizing */
  --k-logo-h-nav: 24px;      /* horizontal lockup height in header */
  --k-logo-h-min: 18px;      /* never smaller on screen */
  --k-mark-min: 16px;        /* mark alone */
}

/* Expanded uppercase label — use for eyebrows, nav, small section labels */
.k-label {
  font-family: var(--k-font);
  font-variation-settings: "wdth" var(--k-wdth-display);
  font-weight: var(--k-weight-label);
  letter-spacing: var(--k-track-label);
  text-transform: uppercase;
}
.k-head {
  font-family: var(--k-font);
  font-variation-settings: "wdth" var(--k-wdth-text);
  font-weight: var(--k-weight-head);
  letter-spacing: var(--k-track-head);
}
/* Logo inherits text colour: set color on the parent (ink on paper, white on ink) */
.k-logo { display: inline-block; height: var(--k-logo-h-nav); width: auto; color: inherit; }
.k-logo svg { height: 100%; width: auto; display: block; }