/* ============================================================
   doslovno.by — Color tokens
   Brand: navy (#14143a) + ochre (#e8a02c). Calm, "magazine"
   trust palette. Elevation = surface contrast, not shadow.
   Ochre is for CTAs and pinpoint accents only — never flood.
   ============================================================ */
:root {
  /* ---- Brand / accent (ochre) ---- */
  --color-primary: #e8a02c;        /* CTA, accents */
  --color-primary-active: #f2b855; /* hover */
  --color-primary-pale: #fbeed3;   /* warm tinted plates */

  /* ---- Dark brand (navy) ---- */
  --color-navy-deep: #14143a;      /* dark sections, footer, hero */
  --color-navy-ink: #1a1a4e;       /* headings variant on light */

  /* ---- Surfaces ---- */
  --color-canvas: #ffffff;
  --color-canvas-soft: #eef0f4;    /* soft "raised" plate, cards */

  /* ---- Text ---- */
  --color-ink: #14143a;            /* headings */
  --color-body: #454552;           /* body copy */
  --color-mute: #86868f;           /* tertiary, captions */
  --color-on-dark: #eef0f4;        /* text on navy */
  --color-on-dark-mute: #9a9ab4;   /* muted text on navy */

  /* ---- Borders ---- */
  --color-border: #e2e4ea;         /* hairline on light */
  --color-border-strong: #cfd2db;
  --color-border-dark: #2b2b57;    /* hairline on navy */

  /* ---- Semantic (Wise standard) ---- */
  --color-positive: #2ead4b;
  --color-positive-deep: #054d28;
  --color-positive-pale: #e3f5e8;
  --color-warning: #ffd11a;
  --color-warning-deep: #b86700;
  --color-warning-pale: #fff3cc;
  --color-negative: #d03238;
  --color-negative-deep: #a72027;
  --color-negative-pale: #fbe4e5;

  /* ---- Semantic surface aliases ---- */
  --surface-page: var(--color-canvas);
  --surface-soft: var(--color-canvas-soft);
  --surface-card: var(--color-canvas);
  --surface-pale: var(--color-primary-pale);
  --surface-dark: var(--color-navy-deep);

  --text-heading: var(--color-ink);
  --text-body: var(--color-body);
  --text-mute: var(--color-mute);

  --accent: var(--color-primary);
  --accent-hover: var(--color-primary-active);
}