:root {

    /*
      One hue family (~215°): jacket navy → mid blue.
      Neutrals from the wall. No red, no random accents.
    */

    --hue: 215;

    --navy: hsl(var(--hue), 55%, 12%);
    --navy-soft: hsl(var(--hue), 40%, 22%);
    --blue: hsl(var(--hue), 58%, 42%);
    --blue-soft: hsl(var(--hue), 55%, 62%);

    --paper: hsl(40, 14%, 96%);
    --paper-2: hsl(40, 10%, 92%);

    --ink: hsl(var(--hue), 30%, 10%);
    --ink-muted: hsl(var(--hue), 12%, 38%);
    --line: hsla(var(--hue), 30%, 10%, 0.12);

    --on-dark: #ffffff;
    --on-dark-muted: hsla(0, 0%, 100%, 0.68);

    /* legacy aliases */
    --surface: var(--paper);
    --surface-2: var(--paper-2);
    --surface-raised: var(--paper-2);
    --surface-3: var(--paper-2);
    --ink-soft: var(--ink-muted);
    --accent: var(--navy);
    --accent-hover: var(--navy-soft);
    --primary: var(--blue);
    --primary-light: var(--blue);
    --blue-dark: var(--navy-soft);
    --blue-deep: var(--paper);
    --white: var(--paper);
    --black: var(--ink);
    --grey-100: var(--paper-2);
    --grey-200: hsl(40, 8%, 86%);
    --grey-500: var(--ink-muted);
    --grey-700: var(--ink);

    --font-sans: 'Manrope', sans-serif;
    --font-display: 'Manrope', sans-serif;
    --font-mono: 'Manrope', sans-serif;

    --ease: cubic-bezier(.25, .1, .25, 1);
    --ease-out: var(--ease);
    --ease-in-out: var(--ease);
    --ease-snap: var(--ease);

    --duration: .35s;

    --header-height: 72px;

    --radius-small: 0;
    --radius-medium: 0;
    --radius-large: 0;

    /* Optional CMS brand overrides (injected via #pcms-brand) */
    --nav-bg: transparent;
    --nav-ink: inherit;

}
