/* ==========================================================================
   Legal.Digital — Color tokens
   Rebrand of the Runwai-pattern editorial system onto Legal.Digital navy/cyan.
   Only color values change here — typography, spacing, radius, motion and
   component structure are untouched elsewhere in this system.
   ========================================================================== */

:root {
  /* ---- Brand base (raw values, from Legal.Digital brand spec) ---- */
  --bg:            #0A1F4D;  /* brand navy — replaces Runwai's #000000 */
  --surface:       #122C63;  /* one step lighter than bg */
  --surface-warm:  #071433;  /* one step darker than bg */
  --fg:            #F9FAFB;  /* brand off-white — replaces #ffffff */
  --fg-2:          #E9ECF2;
  --muted:         #8B93A6;  /* shifted into navy family */
  --meta:          #8B93A6;
  --border:        #24345C;  /* navy-family border */
  --border-soft:   #172A52;  /* softer navy border */
  --accent:        #00D4FF;  /* brand cyan — replaces #ffffff-as-accent */
  --accent-on:     #0A1F4D;  /* text/icons on top of accent */
  --accent-hover:  #33DFFF;
  --accent-active: #00B8DE;

  /* ---- Semantic aliases (Runwai token names, mapped 1:1 to brand base) ----
     Every alias below carries the exact role it had in the source system;
     only the resolved value has shifted from the black/white Runwai palette
     to the Legal.Digital navy/cyan palette. */

  /* Brand & accent */
  --color-primary:        var(--accent);      /* every primary CTA / pill */
  --color-on-primary:     var(--accent-on);    /* type on primary surfaces */

  /* Surface */
  --color-canvas:         var(--bg);           /* primary reading-page background */
  --color-canvas-warm:    var(--surface-warm); /* studios tile lift */
  --color-hairline:       var(--surface);      /* featured-tier infill */
  --color-hairline-soft:  var(--border-soft);  /* 1px column / table dividers */
  --color-surface-cool:   var(--border);       /* media placeholder fill */
  --color-scrim:          var(--surface-warm); /* atmospheric hero stage */
  --color-footer:         var(--surface-warm); /* footer canvas */

  /* Text */
  --color-ink:            var(--fg);           /* primary heading / body text */
  --color-ink-soft:       var(--fg-2);         /* nav links, secondary headings */
  --color-graphite:       var(--fg-2);         /* standard body copy */
  --color-slate:          var(--muted);        /* tinted neutral, tertiary metadata */
  --color-slate-soft:     var(--muted);
  --color-mute:           var(--muted);        /* disabled / fine print */
  --color-stone:          var(--meta);         /* footer eyebrows, placeholders */
  --color-ash:            var(--meta);         /* lightest readable neutral */

  /* Interaction states (accent-as-CTA pattern) */
  --color-primary-hover:  var(--accent-hover);
  --color-primary-active: var(--accent-active);
}