/* ============================================================
   Carol S. Grant — Color System
   "Quiet power": restraint always wins. Two-color discipline
   (plum + cream) with hot pink as the single accent. The full
   palette exists, but most layouts use 2-3 values at a time.
   Lavender lives ONLY in the CG monogram mark.
   ============================================================ */

:root {
  /* --- Darks (three grounding darks) --- */
  --plum-deep:       #1F0C26;  /* darkest ground */
  --deep-plum:       #2E1338;  /* primary dark brand ground */
  --warm-charcoal:   #1E1B17;  /* warm third dark + grounding neutral + text ink */

  /* --- Accent --- */
  --hot-pink:        #FF2D78;  /* single brand accent */
  --soft-pink:       #FF6BA3;  /* hover / soft accent only */

  /* --- Light --- */
  --warm-cream:      #FBF7F4;  /* primary light background */
  --cream-deep:      #F2EAE3;  /* secondary cream surface */

  /* --- Mark-only --- */
  --lavender:        #C9A8D4;  /* CG monogram mark ONLY, nowhere else */
  --orchid:          #A85BB5;  /* favicon-safe C: deepened lavender that reads on light AND dark tabs. Favicon/favarea only. */

  /* --- Neutral steps (warm-charcoal derived) --- */
  --ink-900:         #1E1B17;
  --ink-700:         #3A352F;
  --ink-500:         #6B655C;
  --ink-300:         #A8A199;
  --ink-100:         #DED7CE;

  /* ============================================================
     Semantic aliases — reference these in components / layouts
     ============================================================ */

  /* Surfaces */
  --surface-page:        var(--warm-cream);
  --surface-raised:      #FFFFFF;
  --surface-sunken:      var(--cream-deep);
  --surface-dark:        var(--deep-plum);
  --surface-darkest:     var(--plum-deep);
  --surface-charcoal:    var(--warm-charcoal);

  /* Text on light */
  --text-ink:            var(--warm-charcoal);
  --text-muted:          var(--ink-500);
  --text-soft:           var(--ink-700);

  /* Text on dark */
  --text-on-dark:        var(--warm-cream);
  --text-on-dark-muted:  rgba(251, 247, 244, 0.62);

  /* Accent roles */
  --accent:              var(--hot-pink);
  --accent-hover:        var(--soft-pink);
  --accent-ink:          #FFFFFF;        /* text on hot-pink fills */

  /* Lines & borders */
  --line:                rgba(30, 27, 23, 0.12);
  --line-strong:         rgba(30, 27, 23, 0.22);
  --line-on-dark:        rgba(251, 247, 244, 0.16);

  /* Focus */
  --focus-ring:          rgba(255, 45, 120, 0.45);
}