/* ============================================================
   RKVIST — Color tokens
   Brand palette + accessible semantic aliases.
   Magenta is the functional primary; the magenta→orange
   gradient is reserved for logo + select hero/brand moments.
   ============================================================ */
:root {
  /* ---- Brand palette (raw) ---- */
  --rk-magenta: #e0258e;        /* primary brand accent / CTAs / active */
  --rk-magenta-700: #b71670;    /* darker magenta — hover/press, AA on white */
  --rk-magenta-900: #7d0e4c;    /* deepest magenta — text on light tints */
  --rk-light-magenta: #fbe6b2;  /* soft highlight fill (warm cream, per brand) */
  --rk-light-magenta-tint: #fff6e6; /* faint wash derived from light-magenta */
  --rk-magenta-wash: #fce8f3;   /* cool pink wash for hover tints */

  --rk-orange: #f16b22;         /* gradient terminus / reserved warm accent */
  --rk-orange-700: #c5530f;     /* AA-safe orange for warm secondary emphasis */

  --rk-grey: #6b6f71;           /* secondary text / muted UI */
  --rk-grey-300: #d5d7d8;       /* borders / dividers */
  --rk-grey-100: #f4f4f3;       /* muted surface */
  --rk-grey-500: #54585a;       /* AAA-leaning secondary text on white */
  --rk-white: #ffffff;
  --rk-black: #000000;
  --rk-ink: #14130f;            /* near-black headline ink (warmer than pure) */

  /* ---- Brand gradient (logo + hero moments ONLY) ---- */
  --rk-gradient-brand: linear-gradient(95deg, #e0258e 0%, #ed4a55 45%, #f16b22 100%); /* @kind color */
  --rk-gradient-brand-soft: linear-gradient(95deg, #fbe6b2 0%, #fce8f3 100%); /* @kind color */

  /* ---- Alternate fuller warm palette (decision A — held in reserve) ---- */
  --rk-coral: #f27789;
  --rk-melon: #f79676;
  --rk-yellow: #f4b335;

  /* ---- Semantic aliases ---- */
  --surface: var(--rk-white);
  --surface-muted: var(--rk-grey-100);
  --surface-tint: var(--rk-light-magenta-tint);  /* warm section wash */
  --surface-inverse: var(--rk-ink);

  --text-primary: var(--rk-ink);
  --text-secondary: var(--rk-grey-500);
  --text-muted: var(--rk-grey);
  --text-on-accent: var(--rk-white);
  --text-on-dark: var(--rk-white);

  --border: var(--rk-grey-300);
  --border-strong: var(--rk-grey);

  --accent: var(--rk-magenta);
  --accent-hover: var(--rk-magenta-700);
  --accent-press: var(--rk-magenta-900);
  --accent-soft: var(--rk-magenta-wash);

  --warm-accent: var(--rk-orange-700);   /* secondary warm emphasis (reserved) */

  /* ---- Functional / status (kept off the magenta hue) ---- */
  --success: #1f7a52;
  --success-soft: #e3f3ec;
  --warning: #b06a00;
  --warning-soft: #fbeed2;
  --error: #c02739;
  --error-soft: #fbe4e6;
  --info: #2c5b8a;
  --info-soft: #e4eef7;

  /* ---- Focus ---- */
  --focus-ring: #8a1259;        /* deep magenta, AA visible on white + tints */
  --focus-ring-offset: var(--rk-white);
}