/* ============================================================
   DXHero DS — Brand Colors
   Quiet confidence. Deep indigo + electric blue. Indigo on white.
   Source of truth for color. Reference tokens by ROLE, never raw hex.
   ============================================================ */
:root {
  /* === Brand — indigo through electric blue (the logo palette) === */
  --dx-indigo-950: #0E0A2A;   /* near-black indigo, gradient anchor */
  --dx-indigo-900: #1A1A2E;   /* deep ink */
  --dx-indigo-800: #261956;   /* PRIMARY brand color (logo wordmark) */
  --dx-indigo-700: #1A1147;   /* gradient interpolation */
  --dx-indigo-600: #2D2D86;   /* SECONDARY — bullets, rules, accents */
  --dx-indigo-500: #5454B8;   /* tertiary lift */
  --dx-blue-500:   #3450E0;   /* bright royal accent (logo) */
  --dx-blue-400:   #6E7AE8;
  --dx-blue-200:   #C4B8E8;
  --dx-blue-100:   #EEECFF;   /* pale lavender wash, callout bg */

  /* === Neutrals — ~80% of every slide lives here === */
  --dx-ink:         #1A1A2E;  /* primary text on light */
  --dx-fg-1:        #3C3C3C;  /* body text */
  --dx-fg-2:        #646464;  /* muted text, captions, subtitles */
  --dx-fg-3:        #9FA0A0;  /* hint, disabled, axis labels */
  --dx-line-strong: #C8C8CC;  /* dividing rules */
  --dx-line:        #E0E0E0;  /* default border, table h-rules */
  --dx-line-soft:   #ECECEE;  /* card border on white */
  --dx-bg-1:        #FFFFFF;  /* canvas */
  --dx-bg-2:        #F8F8FA;  /* page wash */
  --dx-bg-3:        #F5F5F7;  /* panel wash, table head */
  --dx-bg-inv:      #1A1A2E;  /* inverted surface */

  /* === Semantic — muted, never neon === */
  --dx-success: #3D7B6A;  --dx-success-bg: #E8F0EE;  /* on track (forest) */
  --dx-warning: #B8862B;  --dx-warning-bg: #F6EEDC;  /* at risk (amber) */
  --dx-danger:  #B85450;  --dx-danger-bg:  #F5E4E3;  /* behind (terracotta) */
  --dx-info:    #2D2D86;  --dx-info-bg:    #EEECFF;

  /* === Accent fills (charts only, never primary) === */
  --dx-accent-lavender: #C4A0FF;
  --dx-accent-amber:    #D4922A;

  /* === Chart ramp — ONE hue, five intensities. Fill series in order 1→5.
         Never rainbow/categorical. For a second series that must read apart,
         use --dx-accent-lavender or --dx-accent-amber. === */
  --dx-chart-1: var(--dx-indigo-800);
  --dx-chart-2: var(--dx-indigo-600);
  --dx-chart-3: var(--dx-indigo-500);
  --dx-chart-4: var(--dx-blue-400);
  --dx-chart-5: var(--dx-blue-200);

  /* === Text on dark surface — single white + alpha ladder === */
  --dx-on-dark:   #FFFFFF;
  --dx-on-dark-1: rgba(255,255,255,0.92);  /* hero lede */
  --dx-on-dark-2: rgba(255,255,255,0.88);
  --dx-on-dark-3: rgba(255,255,255,0.82);  /* divider / closing paragraph */
  --dx-on-dark-4: rgba(255,255,255,0.72);  /* subtitle on dark */
  --dx-on-dark-5: rgba(255,255,255,0.65);  /* eyebrow on dark */
  --dx-on-dark-6: rgba(255,255,255,0.55);  /* role / confidential */
  --dx-on-dark-7: rgba(255,255,255,0.45);
  --dx-on-dark-rule:        rgba(255,255,255,0.18);
  --dx-on-dark-rule-strong: rgba(255,255,255,0.35);
  --dx-on-dark-ghost:       rgba(255,255,255,0.16);  /* oversized decorative numeral / quote mark */

  /* === Signature gradients === */
  --dx-grad-cover: linear-gradient(135deg, #060418 0%, #14103A 45%, #261956 100%); /* @kind color */
  --dx-grad-panel: linear-gradient(180deg, #060418 0%, #14103A 55%, #261956 100%); /* @kind color */
  --dx-grad-cover-soft: linear-gradient(135deg, #0E0A2A 0%, #1A1147 55%, #261956 100%); /* @kind color */
  --dx-grad-still:
    radial-gradient(ellipse 80% 60% at 18% 30%, rgba(60,46,140,0.35) 0%, transparent 60%),
    linear-gradient(180deg, #0E0A2A 0%, #14103A 50%, #14103A 100%); /* @kind color */

  /* === Radius — SHARP CORNERS ONLY. Non-negotiable. === */
  --dx-radius: 0;

  /* === Borders === */
  --dx-border:        1px solid var(--dx-line);
  --dx-border-strong: 1px solid var(--dx-line-strong);
  --dx-border-ink:    1px solid var(--dx-ink);
}
