/* ── HP color system ──────────────────────────────────────────────
   One signal color (HP Electric Blue), one ink, gray section bands.
   Primary appears at most twice per viewport. */
:root {
  /* Brand & Accent */
  --color-primary:        #024ad8; /* HP Electric Blue — lone CTA/link/chevron */
  --color-primary-bright: #296ef9; /* lighter variant for dark slabs */
  --color-primary-deep:   #0e3191; /* pressed CTA + visited link */
  --color-primary-soft:   #c9e0fc; /* pale-blue surface, selection chips */
  --color-on-primary:     #ffffff;

  /* Surface */
  --color-canvas:     #ffffff; /* universal page background */
  --color-paper:      #ffffff; /* card surface (lift via border/shadow) */
  --color-cloud:      #f7f7f7; /* lightest gray band */
  --color-fog:        #e8e8e8; /* darker gray band */
  --color-steel:      #c2c2c2; /* stronger hairline / focus border */
  --color-hairline:   #e8e8e8; /* 1px divider / outline */

  /* Bloom (sale / lifestyle accent) */
  --color-bloom-coral: #ff5050; /* sale-tag chip */
  --color-bloom-rose:  #f9d4d2; /* soft pink lifestyle accent */
  --color-bloom-deep:  #b3262b; /* error / discount emphasis */
  --color-bloom-wine:  #5a1313;

  /* Storm (printer-plan illustration tones) */
  --color-storm-mist: #8ebdce;
  --color-storm-sea:  #7fadbe;
  --color-storm-deep: #356373; /* neutral status accent */

  /* Text */
  --color-ink:       #1a1a1a; /* universal text on white */
  --color-ink-deep:  #000000; /* wordmark + hairline strokes */
  --color-ink-soft:  #292929; /* textural shift inside dark slabs */
  --color-on-ink:    #ffffff; /* text on dark-navy slabs */
  --color-charcoal:  #3d3d3d; /* muted body / fine print */
  --color-graphite:  #636363; /* legal lines, metadata */

  /* Semantic aliases */
  --text-default:    var(--color-ink);
  --text-muted:      var(--color-charcoal);
  --text-faint:      var(--color-graphite);
  --text-on-dark:    var(--color-on-ink);
  --text-link:       var(--color-primary);
  --surface-page:    var(--color-canvas);
  --surface-card:    var(--color-paper);
  --surface-band:    var(--color-cloud);
  --surface-band-2:  var(--color-fog);
  --surface-dark:    var(--color-ink);
  --border-default:  var(--color-hairline);
  --border-strong:   var(--color-steel);
  --action:          var(--color-primary);
  --action-pressed:  var(--color-primary-deep);
  --danger:          var(--color-bloom-deep);
  --sale:            var(--color-bloom-coral);
}
