:root {
  /* The six brand-book colors. */
  --navy-900: #16324F;
  --teal-600: #1F6F78;
  --gold-500: #C89B3C;
  --steel-400: #A7B0B7;
  --ink-950: #111417;
  --paper: #F7F8F5;

  /* Functional shades: contrast, surfaces and states. */
  --navy-950: #071522;
  --teal-700: #195A61;
  --gold-300: #E7C679;
  --steel-600: #52616c;
  --line: #d7dcde;
  --white: #ffffff;

  --surface-page: var(--paper);
  --surface-raised: var(--white);
  --surface-muted: #EDF0EF;
  --surface-hover: #E4EBEA;
  --text-primary: var(--ink-950);
  --text-secondary: var(--steel-600);
  --text-heading: var(--navy-900);
  --text-inverse-muted: #E3EFF0;
  --link-color: var(--teal-600);
  --link-hover: var(--teal-700);
  --label-color: var(--teal-600);
  --focus-ring: var(--teal-600);
  --action-bg: var(--teal-600);
  --action-bg-hover: var(--teal-700);
  --action-text: var(--paper);
  --accent-primary: var(--teal-600);
  --accent-highlight: var(--gold-500);
  --border-subtle: var(--line);
  --border-control: #7E9098;
  --border-inverse: rgba(247,248,245,.24);
  --error-text: #A02C20;
  --error-surface: #FFF4EE;

  --font-display: Georgia, "Times New Roman", serif;
  --font-sans: Inter, Aptos, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;

  --shell: 82.5rem;
  --page-gutter: 3rem;
  --radius-sm: 2px;
  --radius-md: 6px;
  --space-section: clamp(4rem, 6.5vw, 6.5rem);
  --shadow-raised: 0 8px 24px rgba(7, 21, 34, 0.055);
  --ease-out: cubic-bezier(0.22, 1, 0.36, 1);
  --header-height: 5rem;
  --header-offset: calc(var(--header-height) + env(safe-area-inset-top, 0px));
}