/* ── Audacious Duo · Colour tokens ─────────────────────────────────────────
   Deep navy is the primary and does the heavy lifting. Nautical red is an
   ACCENT ONLY — buttons, the wordmark, small highlights. Never large red
   fills. Warm off-white grounds everything; sand and a turquoise drawn from
   the water photography are supporting tones.
   ────────────────────────────────────────────────────────────────────────── */

:root {
  /* ---- Brand primitives ---- */
  --navy-900: #16133b;   /* deepest, for shadows / overlays */
  --navy-800: #1d1a4d;
  --navy-700: #272361;   /* PRIMARY — the brand navy/indigo */
  --navy-600: #353072;
  --navy-500: #4a4690;
  --navy-300: #8a87b4;
  --navy-100: #d7d6e6;
  --navy-050: #ecebf3;

  --red-700: #8f1825;
  --red-600: #b01e2e;    /* ACCENT — nautical red, the wordmark red */
  --red-500: #c63a48;
  --red-100: #f3d6d9;

  /* ---- Warm neutrals (off-white paper + sand) ---- */
  --paper:    #faf7f1;   /* primary warm off-white background */
  --paper-2:  #f3eee4;   /* slightly deeper panel */
  --sand-200: #e8ddc7;
  --sand-300: #d9c8a6;
  --sand-500: #c2a878;   /* sand / gold from the beaches */
  --sand-700: #8a7245;   /* deep sand, for text on light sand */

  /* ---- Supporting sea tones (from the aerial photography) ---- */
  --sea-500: #2f8fb0;    /* turquoise, decorative use only */
  --sea-300: #7cc0d4;
  --sea-100: #d6ecf2;

  --ink-900: #1b1a2e;    /* near-black warm ink for body on paper */
  --ink-600: #4a4860;
  --ink-400: #76748c;

  --white:   #ffffff;
  --black:   #14121f;

  /* ---- Semantic aliases ---- */
  --color-primary:        var(--navy-700);
  --color-primary-hover:  var(--navy-800);
  --color-primary-press:  var(--navy-900);
  --color-accent:         var(--red-600);
  --color-accent-hover:   var(--red-700);

  --surface-page:    var(--paper);
  --surface-panel:   var(--paper-2);
  --surface-card:    var(--white);
  --surface-inverse: var(--navy-700);
  --surface-sand:    var(--sand-200);

  --text-strong:   var(--navy-700);   /* headings on light */
  --text-body:     var(--ink-900);
  --text-muted:    var(--ink-600);
  --text-faint:    var(--ink-400);
  --text-on-dark:  #f4f2ec;
  --text-on-dark-muted: #b9b7cf;
  --text-accent:   var(--red-600);

  --border-hair:   rgba(39, 35, 97, 0.12);
  --border-soft:   rgba(39, 35, 97, 0.20);
  --border-strong: rgba(39, 35, 97, 0.40);
  --border-on-dark: rgba(255, 255, 255, 0.20);

  --focus-ring: rgba(176, 30, 46, 0.45);
}