/* H&CO Strategy — color tokens.
   The brand core is still an editorial duet, now touched with two accents:
   an indigo `brand` (masthead, headlines, wordmark) and a pink `accent`
   (eyebrows, ampersand, active state). The inline link blue is retained
   for body-copy hyperlinks. */

:root {
  /* Base ramp ---------------------------------------------------------- */
  --color-ink:            #000000;   /* the brand black — headlines, body */
  --color-ink-soft:       #1a1a1a;   /* strong caption, hover fill */
  --color-body:           #757575;   /* body grey — bylines, timestamps */
  --color-canvas:         #ffffff;
  --color-canvas-soft:    #f5f5f5;   /* rare tinted surface */
  --color-hairline:       #e0e0e0;   /* row / input divider */

  /* Accents ------------------------------------------------------------ */
  --color-brand:          #f25d9c;   /* pink — category eyebrows, tag chips */
  --color-brand-soft:     #fbe7ef;   /* pink wash */
  --color-accent:         #0c056c;   /* indigo — wordmark ampersand, small emphasis */
  --color-accent-soft:    #eeecf7;   /* very light indigo wash */
  --color-link:           #057dbc;   /* inline body-link blue */

  /* Semantic aliases --------------------------------------------------- */
  --color-primary:        var(--color-ink);      /* wordmark, CTAs */
  --color-on-primary:     var(--color-canvas);   /* text on primary fills */
  --color-surface:        var(--color-canvas);   /* default page bg */
  --color-surface-soft:   var(--color-canvas-soft);
  --color-border:         var(--color-hairline);
  --color-border-strong:  var(--color-ink);

  --color-text:           var(--color-ink);      /* default body / heads */
  --color-text-soft:      var(--color-ink-soft); /* strong caption */
  --color-text-muted:     var(--color-body);     /* bylines, timestamps */
  --color-text-inverse:   var(--color-canvas);   /* on-dark surfaces */
  --color-text-link:      var(--color-link);
  --color-text-brand:     var(--color-brand);    /* indigo — category eyebrows */
  --color-text-accent:    var(--color-accent);   /* pink accent as text */
}
