/* ============================================================
   UMNAI Design System v3.0 — tokens + self-hosted fonts (subset)
   DecisionDeck.ai site build. Light is the default surface.
   ============================================================ */

/* ---------- Inter (text / UI) — variable font ---------- */
@font-face { font-family: "Inter"; font-style: normal; font-weight: 100 900; font-display: swap; src: url("../fonts/InterVariable.woff2") format("woff2-variations"); }

/* ---------- Inter Display (headlines / large type) ---------- */
@font-face { font-family: "Inter Display"; font-style: normal; font-weight: 500; font-display: swap; src: url("../fonts/InterDisplay-Medium.woff2") format("woff2"); }
@font-face { font-family: "Inter Display"; font-style: normal; font-weight: 600; font-display: swap; src: url("../fonts/InterDisplay-SemiBold.woff2") format("woff2"); }
@font-face { font-family: "Inter Display"; font-style: normal; font-weight: 700; font-display: swap; src: url("../fonts/InterDisplay-Bold.woff2") format("woff2"); }
@font-face { font-family: "Inter Display"; font-style: normal; font-weight: 800; font-display: swap; src: url("../fonts/InterDisplay-ExtraBold.woff2") format("woff2"); }
@font-face { font-family: "Inter Display"; font-style: normal; font-weight: 900; font-display: swap; src: url("../fonts/InterDisplay-Black.woff2") format("woff2"); }

/* ---------- JetBrains Mono (code / labels / data) ---------- */
@font-face { font-family: "JetBrains Mono"; font-style: normal; font-weight: 400; font-display: swap; src: url("../fonts/JetBrainsMono-Regular.woff2") format("woff2"); }
@font-face { font-family: "JetBrains Mono"; font-style: normal; font-weight: 500; font-display: swap; src: url("../fonts/JetBrainsMono-Medium.woff2") format("woff2"); }
@font-face { font-family: "JetBrains Mono"; font-style: normal; font-weight: 600; font-display: swap; src: url("../fonts/JetBrainsMono-SemiBold.woff2") format("woff2"); }

/* ── Tokens · UMNAI Design System v3.0 ───────── */
:root {
  /* Typefaces */
  --font-display: "Inter Display", "Inter", system-ui, sans-serif;
  --font-text:    "Inter", system-ui, sans-serif;
  --font-sans:    "Inter", system-ui, sans-serif;
  --font-mono:    "JetBrains Mono", ui-monospace, monospace;

  /* Brand base */
  --brand-bg:    #0E0E0E;
  --brand-white: #FFFFFF;
  --brand-green: #0E0E0E; /* DEPRECATED — use --neutral-900 or --text. Removed next pass. */

  /* Dark-section semantic aliases (used by hero/dark panels site-wide) */
  --surface-dark:         #0E0E0E; /* neutral-900 */
  --surface-dark-raised:  #1A1A1A; /* neutral-800 */
  --surface-dark-sunken:  #0A0A0A;
  --border-dark:          #2E2E2E; /* neutral-700 */
  --border-dark-strong:   #3A3A3A;
  --text-on-dark:         #FFFFFF;
  --text-on-dark-muted:   #888888; /* neutral-400 */
  --brand-cream: #F7F7F7;

  /* Lime — primary accent */
  --lime-50:#F8FFD6; --lime-100:#F0FF9E; --lime-200:#E8FF66; --lime-300:#DCFF50; --lime-400:#C8F030;
  --lime-500:#AADA14; --lime-600:#85B000; --lime-700:#608200; --lime-800:#3E5500; --lime-900:#1F2B00;

  /* Cerulean — secondary accent */
  --cer-50:#E0F5FE; --cer-100:#B9E8FB; --cer-200:#7DD5F8; --cer-300:#38BEF4; --cer-400:#12ABEF;
  --cer-500:#0EA5E9; --cer-600:#0280BB; --cer-700:#015D8C; --cer-800:#013B5C; --cer-900:#001D2E;

  /* Amber — data & metrics */
  --amber-50:#FFF8E6; --amber-100:#FDEFC4; --amber-200:#FAD98A; --amber-300:#F5BE45; --amber-400:#EFA118;
  --amber-500:#D98A00; --amber-600:#AE6E00; --amber-700:#845300; --amber-800:#5A3800; --amber-900:#2E1C00;

  /* Violet — strategy & IP */
  --violet-50:#F2EFFE; --violet-100:#E0D8FC; --violet-200:#C4B5F8; --violet-300:#A48DF2; --violet-400:#8466E8;
  --violet-500:#6B47DC; --violet-600:#5232B8; --violet-700:#3B2292; --violet-800:#261566; --violet-900:#130A38;

  /* Coral — people & market */
  --coral-50:#FFF0EE; --coral-100:#FFD8D2; --coral-200:#FFB3A8; --coral-300:#FF8573; --coral-400:#F5614E;
  --coral-500:#E04030; --coral-600:#B82E20; --coral-700:#8F1E14; --coral-800:#62100A; --coral-900:#350500;

  /* Neutral */
  --neutral-50:#F7F7F7; --neutral-100:#EBEBEB; --neutral-200:#D4D4D4; --neutral-300:#B0B0B0; --neutral-400:#888888;
  --neutral-500:#636363; --neutral-600:#444444; --neutral-700:#2E2E2E; --neutral-800:#1A1A1A; --neutral-900:#0E0E0E;

  /* Semantic */
  --success-light:#EDFCE8; --success-base:#3DB549; --success-dark:#1A6B26;
  --warning-light:#FFFBDF; --warning-base:#D4A000; --warning-dark:#7A5800;
  --error-light:#FFF0EE;   --error-base:#B82E20;   --error-dark:#62100A;
  --info-light:#E0F5FE;    --info-base:#0280BB;     --info-dark:#013B5C;

  /* Role aliases */
  --color-primary:var(--lime-300);   --color-primary-hover:var(--lime-400);  --color-primary-active:var(--lime-500);
  --color-primary-subtle:var(--lime-50); --color-primary-text:var(--lime-700); --color-primary-border:var(--lime-200);
  --color-secondary:var(--cer-500);  --color-secondary-hover:var(--cer-600); --color-secondary-text:var(--cer-600);
  --color-secondary-subtle:var(--cer-50); --color-secondary-border:var(--cer-200);
  --color-accent-amber:var(--amber-400);  --color-accent-violet:var(--violet-400);  --color-accent-coral:var(--coral-400);
  --color-success:var(--success-base); --color-warning:var(--warning-base);
  --color-error:var(--error-base);     --color-info:var(--info-base);

  /* ── Theme · LIGHT default ── */
  color-scheme: light;
  --bg:             #FFFFFF;
  --surface:        #FFFFFF;
  --surface-sunken: #F7F7F7;
  --surface-raised: #FFFFFF;
  --border:         #EBEBEB;
  --border-strong:  #D4D4D4;
  --text:           #0E0E0E;
  --text-body:      #636363;
  --text-muted:     #888888;
  --link:           #0280BB;
  --link-hover:     #015D8C;
  --accent:         #0280BB;
  --accent-fill:    #DCFF50;
  --accent-on-fill: #0E0E0E;
  --focus-ring:     #0280BB;

  /* Spacing */
  --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px; --space-5:20px; --space-6:24px;
  --space-8:32px; --space-10:40px; --space-12:48px; --space-16:64px;

  /* Radii */
  --radius-sm:4px; --radius-md:8px; --radius-lg:12px; --radius-xl:16px; --radius-full:9999px;
  --radius-panel:24px;

  /* Soft shadows */
  --shadow-xs:0 1px 2px rgba(14,14,14,0.05);
  --shadow-sm:0 2px 8px rgba(14,14,14,0.05), 0 1px 2px rgba(14,14,14,0.04);
  --shadow-panel:0 6px 28px rgba(14,14,14,0.06), 0 1px 3px rgba(14,14,14,0.04);
  --shadow-panel-lg:0 18px 56px rgba(14,14,14,0.09), 0 2px 6px rgba(14,14,14,0.05);
}

/* ── Theme · DARK override ── */
[data-theme="dark"], .theme-dark {
  color-scheme: dark;
  --bg:             #0E0E0E;
  --surface:        #1A1A1A;
  --surface-sunken: #0E0E0E;
  --surface-raised: #2E2E2E;
  --border:         #2E2E2E;
  --border-strong:  #444444;
  --text:           #FFFFFF;
  --text-body:      #BBBBBB;
  --text-muted:     #888888;
  --link:           #DCFF50;
  --link-hover:     #E8FF66;
  --accent:         #DCFF50;
  --accent-fill:    #DCFF50;
  --accent-on-fill: #0E0E0E;
  --focus-ring:     #DCFF50;
}
