:root{
  /* Base palette — huisstijlkaart Newblend */
  --nb-red:#EC4424;
  --nb-orange:#F16F22;
  --nb-yellow:#EFDF10;
  --nb-green:#22A26D;
  --nb-lime:#89BA38;
  --nb-teal:#005661;
  --nb-ink:#00161E;
  --nb-grey:#CED3D8;
  --nb-white:#FFFFFF;

  /* Tints & shades (derived, oklch-harmonised with the base palette) */
  --nb-red-dark:oklch(from var(--nb-red) calc(l - .07) c h);
  --nb-red-soft:oklch(from var(--nb-red) .96 .04 h);
  --nb-teal-dark:oklch(from var(--nb-teal) calc(l - .06) c h);
  --nb-teal-soft:oklch(from var(--nb-teal) .95 .03 h);
  --nb-green-soft:oklch(from var(--nb-green) .95 .04 h);
  --nb-yellow-soft:oklch(from var(--nb-yellow) .96 .06 h);
  --nb-grey-50:#F6F7F8;
  --nb-grey-100:#EDEFF1;
  --nb-grey-200:var(--nb-grey);
  --nb-grey-400:#9AA5AC;
  --nb-grey-600:#5C6B72;

  /* Semantic — text */
  --text-heading:var(--nb-teal);
  --text-body:var(--nb-ink);
  --text-muted:var(--nb-grey-600);
  --text-accent:var(--nb-red);
  --text-inverse:var(--nb-white);
  --text-link:var(--nb-red);
  --text-link-hover:var(--nb-red-dark);

  /* Semantic — surfaces */
  --surface-page:var(--nb-white);
  --surface-subtle:var(--nb-grey-50);
  --surface-card:var(--nb-white);
  --surface-inverse:var(--nb-teal);
  --surface-inverse-deep:var(--nb-ink);
  --surface-accent:var(--nb-red);
  --surface-highlight:var(--nb-yellow);

  /* Semantic — lines */
  --border-subtle:var(--nb-grey-100);
  --border-default:var(--nb-grey-200);
  --border-strong:var(--nb-teal);
  --focus-ring:var(--nb-teal);

  /* Semantic — status */
  --status-success:var(--nb-green);
  --status-success-surface:var(--nb-green-soft);
  --status-warning:var(--nb-orange);
  --status-warning-surface:var(--nb-yellow-soft);
  --status-danger:var(--nb-red);
  --status-danger-surface:var(--nb-red-soft);
  --status-info:var(--nb-teal);
  --status-info-surface:var(--nb-teal-soft);

  /* Brand gradient — the blend in the logo mark, warm top to cool bottom */
  --nb-blend:linear-gradient(160deg,var(--nb-red) 0%,var(--nb-orange) 32%,var(--nb-lime) 58%,var(--nb-green) 78%,var(--nb-teal) 100%); /* @kind color */
  --nb-blend-warm:linear-gradient(135deg,var(--nb-yellow) 0%,var(--nb-orange) 55%,var(--nb-red) 100%); /* @kind color */
}
