/* Visit Nuuk color tokens — from Brand book 2025, "Colors" page.
   Red is the single signal color. Base UI stays white/light;
   secondary + complementary colors are for graphics, charts and accents only. */

:root {
  /* ---- Primary / signal ---- */
  --vn-red: #E00034;            /* Pantone 185 — logo, CTAs, links, accents */

  /* ---- Secondary ---- */
  --vn-pink: #FFB7AE;           /* Pantone 169 */
  --vn-coral: #F4587A;          /* Pantone 184 */
  --vn-red-deep: #A71930;       /* Pantone 187 */
  --vn-teal-light: #85CDDB;     /* Pantone 630 */
  --vn-teal: #3CB6CE;           /* Pantone 631 */
  --vn-teal-deep: #007EA3;      /* Pantone 633 */
  --vn-grey-light: #E0E1DD;     /* Pantone Cool Grey 1 */
  --vn-grey: #4D4F53;           /* Pantone Cool Grey 11 */
  --vn-black: #000000;          /* Pantone Black 6 */

  /* ---- Complementary (charts, data, seasonal accents ONLY) ---- */
  --vn-yellow-pale: #F8E498;    /* Pantone 1205 */
  --vn-yellow-soft: #FADD80;    /* Pantone 1215 */
  --vn-yellow: #FFCB4F;         /* Pantone 1225 */
  --vn-yellow-deep: #FFB612;    /* Pantone 1235 */
  --vn-bluegrey-pale: #BED6DB;  /* Pantone 552 */
  --vn-bluegrey-soft: #99BFC2;  /* Pantone 5503 */
  --vn-bluegrey: #589199;       /* Pantone 5483 */
  --vn-bluegrey-deep: #156570;  /* Pantone 5473 */
  --vn-green-pale: #CCDBAE;     /* Pantone 580 */
  --vn-green-soft: #B8CF95;     /* Pantone 578 */
  --vn-green: #ABC785;          /* Pantone 577 */
  --vn-green-deep: #69923A;     /* Pantone 576 */

  /* ---- Tints (allowed: lighter versions of base colors) ---- */
  --vn-red-tint: #FCE5EA;
  --vn-pink-tint: #FFF1EF;
  --vn-teal-tint: #EAF7FA;
  --vn-grey-tint: #F2F2F0;

  /* ---- Semantic aliases ---- */
  --surface-page: #FFFFFF;
  --surface-card: #FFFFFF;
  --surface-subtle: var(--vn-grey-tint);
  --surface-inverse: var(--vn-black);
  --text-heading: var(--vn-black);
  --text-body: var(--vn-grey);
  --text-muted: #8A8C90;
  --text-on-photo: #FFFFFF;
  --text-accent: var(--vn-red);
  --accent-primary: var(--vn-red);
  --accent-primary-hover: var(--vn-red-deep);
  --link-color: var(--vn-red);
  --link-hover: var(--vn-red-deep);
  --border-subtle: var(--vn-grey-light);
  --focus-ring: var(--vn-teal-deep);
}