/* ============================================================
   Lenavix Design System — Colors & Typography tokens
   ------------------------------------------------------------
   Two surfaces:
   - Marketing  : near-white page + deep-navy hero panel
   - Workspace  : deep-navy chrome (sidebar/header) + ivory canvas
   Editorial serif for display, humanist sans for UI/body,
   mono for evidence/IDs.
   ============================================================ */

/* ---- Fonts ------------------------------------------------
   Display: EB Garamond (Google) — classical book-style serif used for
     all headings, the wordmark, and editorial flourishes.
   Body:    Merriweather (Google) — humanist slab-leaning serif tuned
     for screen reading; carries general copy.
   Mono:    JetBrains Mono — evidence IDs, eyebrows, monospace meta.
   ------------------------------------------------------------ */
@import url('https://fonts.googleapis.com/css2?family=EB+Garamond:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600;1,700&family=Merriweather:ital,wght@0,300;0,400;0,700;0,900;1,300;1,400;1,700&family=JetBrains+Mono:wght@400;500&display=swap');

:root {
  /* ============ PRIMITIVE COLORS ============ */

  /* Ink / navy (chrome, display text) */
  --lnx-ink-950: #070D16;    /* deepest — bottom of hero gradient */
  --lnx-ink-900: #0E1A2B;    /* sidebar, hero, headlines */
  --lnx-ink-800: #152338;
  --lnx-ink-700: #1E3049;
  --lnx-ink-600: #2B3F5B;

  /* Ivory / parchment (workspace canvas — warm off-white) */
  --lnx-ivory-50:  #FAF7F1;
  --lnx-ivory-100: #F5F1E8;  /* workspace canvas */
  --lnx-ivory-200: #EDE7D8;
  --lnx-ivory-300: #DED5BF;

  /* Paper (marketing canvas — cooler, cleaner) */
  --lnx-paper-0:   #FFFFFF;
  --lnx-paper-50:  #FAFAF9;
  --lnx-paper-100: #F2F1EE;

  /* Neutral gray (body copy on light, borders) */
  --lnx-gray-900: #1A1F29;
  --lnx-gray-700: #4A5260;
  --lnx-gray-500: #7C8494;
  --lnx-gray-400: #9AA1AE;
  --lnx-gray-300: #C3C7CE;
  --lnx-gray-200: #DCDEE3;
  --lnx-gray-100: #EAECEF;

  /* On-dark text tiers (when atop ink-900) */
  --lnx-on-dark-1: #F5F1E8;  /* primary text on navy */
  --lnx-on-dark-2: rgba(245, 241, 232, 0.82);
  --lnx-on-dark-3: rgba(245, 241, 232, 0.64);

  /* ============ BRAND ACCENT ============ */
  /* Wine / burgundy — the true Lenavix accent. Deeper and more
     legal-serious than a hot red. Paired with a soft blush for
     callout fills, and a warm cream page background. */
  --lnx-accent-red:      #F87171;  /* mid red — legible on dark navy without screaming */
  --lnx-accent-red-soft: #F3D9D6;  /* blush — callout fills */
  --lnx-accent-red-ink:  #991B1B;  /* darkest — hover / pressed */
  --lnx-blush-50:        #FBEEEB;  /* faintest — page wash */
  --lnx-cream:           #F6EEE6;  /* warm cream canvas */

  /* Muted gold — secondary accent borrowed from the duotone artwork.
     Used for highlights, sparkles, editorial flourishes only. */
  --lnx-gold:      #B79268;
  --lnx-gold-soft: #E8DCC7;

  /* ============ SEMANTIC (status pills) ============ */
  /* Warm, desaturated — legal-professional, not SaaS-bright */
  --lnx-status-critical-bg: #F4D9D6;
  --lnx-status-critical-fg: #9B2520;

  --lnx-status-material-bg: #F4E2CC;
  --lnx-status-material-fg: #8A5418;

  --lnx-status-standard-bg: #D9E4EC;
  --lnx-status-standard-fg: #2F4A61;

  --lnx-status-approved-bg: #D9E8DC;
  --lnx-status-approved-fg: #2A6041;

  --lnx-status-review-bg:   #F3E6C5;
  --lnx-status-review-fg:   #7A5A15;

  --lnx-status-routed-bg:   #E5E1D6;
  --lnx-status-routed-fg:   #4A4636;

  --lnx-status-privileged-bg: #F7DBD6;
  --lnx-status-privileged-fg: #9B2520;

  /* ============ SEMANTIC ALIASES ============ */
  --lnx-bg:           var(--lnx-ivory-100);
  --lnx-bg-elevated: var(--lnx-paper-0);
  --lnx-bg-chrome:   var(--lnx-ink-900);
  --lnx-bg-hero:     var(--lnx-ink-900);

  --lnx-fg-1:  var(--lnx-ink-900);        /* primary */
  --lnx-fg-2:  var(--lnx-gray-700);       /* secondary body */
  --lnx-fg-3:  var(--lnx-gray-500);       /* tertiary / meta */
  --lnx-fg-4:  var(--lnx-gray-400);       /* disabled / hairline label */

  --lnx-border-1: rgba(14, 26, 43, 0.10); /* hairline on light */
  --lnx-border-2: rgba(14, 26, 43, 0.18);
  --lnx-border-dark-1: rgba(245, 241, 232, 0.10);
  --lnx-border-dark-2: rgba(245, 241, 232, 0.18);

  /* ============ TYPOGRAPHY ============ */
  --lnx-font-serif: "EB Garamond", "Garamond", "Adobe Garamond Pro", "Cormorant Garamond", "Didot", Georgia, serif;
  --lnx-font-sans:  "Merriweather", "Iowan Old Style", "Charter", "Sitka Text", Georgia, "Times New Roman", serif;
  --lnx-font-mono:  "JetBrains Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;

  /* Scale */
  --lnx-text-xs:   11px;
  --lnx-text-sm:   13px;
  --lnx-text-base: 15px;
  --lnx-text-md:   17px;
  --lnx-text-lg:   20px;
  --lnx-text-xl:   24px;
  --lnx-text-2xl:  32px;
  --lnx-text-3xl:  44px;
  --lnx-text-4xl:  60px;
  --lnx-text-5xl:  84px;

  /* Leading */
  --lnx-leading-tight:  1.08;
  --lnx-leading-snug:   1.22;
  --lnx-leading-normal: 1.5;
  --lnx-leading-relaxed:1.65;

  /* Tracking */
  --lnx-track-display: -0.02em;
  --lnx-track-body:     0;
  --lnx-track-label:    0.14em;   /* for small-caps eyebrows */
  --lnx-track-caps:     0.08em;

  /* ============ SPACING / RADIUS / SHADOWS ============ */
  --lnx-space-1: 4px;
  --lnx-space-2: 8px;
  --lnx-space-3: 12px;
  --lnx-space-4: 16px;
  --lnx-space-5: 20px;
  --lnx-space-6: 24px;
  --lnx-space-8: 32px;
  --lnx-space-10:40px;
  --lnx-space-12:56px;
  --lnx-space-16:80px;
  --lnx-space-20:120px;

  --lnx-radius-xs: 3px;    /* pills sometimes are sharper */
  --lnx-radius-sm: 6px;    /* inputs, buttons */
  --lnx-radius-md: 10px;   /* cards */
  --lnx-radius-lg: 14px;
  --lnx-radius-pill: 999px;

  --lnx-shadow-1: 0 1px 2px rgba(14,26,43,0.04), 0 1px 0 rgba(14,26,43,0.02);
  --lnx-shadow-2: 0 6px 20px -8px rgba(14,26,43,0.12), 0 2px 4px rgba(14,26,43,0.04);
  --lnx-shadow-3: 0 20px 48px -20px rgba(14,26,43,0.28), 0 4px 10px rgba(14,26,43,0.06);
  /* Inset hairline — used on serious cards */
  --lnx-shadow-inset-hairline: inset 0 0 0 1px rgba(14,26,43,0.08);
}

/* ============================================================
   SEMANTIC TYPE CLASSES — apply these, don't redefine elsewhere
   ============================================================ */

.lnx-wordmark {
  font-family: var(--lnx-font-serif);
  font-weight: 400;
  letter-spacing: var(--lnx-track-label);
  text-transform: uppercase;
  font-size: 13px;
  line-height: 1.1;
}

.lnx-display {
  font-family: var(--lnx-font-serif);
  font-weight: 400;
  font-size: var(--lnx-text-5xl);
  line-height: var(--lnx-leading-tight);
  letter-spacing: var(--lnx-track-display);
  color: var(--lnx-fg-1);
}

.lnx-h1 {
  font-family: var(--lnx-font-serif);
  font-weight: 400;
  font-size: var(--lnx-text-4xl);
  line-height: var(--lnx-leading-tight);
  letter-spacing: var(--lnx-track-display);
}

.lnx-h2 {
  font-family: var(--lnx-font-serif);
  font-weight: 400;
  font-size: var(--lnx-text-3xl);
  line-height: var(--lnx-leading-snug);
  letter-spacing: var(--lnx-track-display);
}

.lnx-h3 {
  font-family: var(--lnx-font-serif);
  font-weight: 400;
  font-size: var(--lnx-text-2xl);
  line-height: var(--lnx-leading-snug);
}

/* Sub-headings inside app UI are sans, not serif */
.lnx-ui-h {
  font-family: var(--lnx-font-sans);
  font-weight: 600;
  font-size: var(--lnx-text-md);
  line-height: var(--lnx-leading-snug);
  color: var(--lnx-fg-1);
}

.lnx-body {
  font-family: var(--lnx-font-sans);
  font-weight: 400;
  font-size: var(--lnx-text-base);
  line-height: var(--lnx-leading-relaxed);
  color: var(--lnx-fg-2);
}

.lnx-body-sm {
  font-family: var(--lnx-font-sans);
  font-weight: 400;
  font-size: var(--lnx-text-sm);
  line-height: var(--lnx-leading-relaxed);
  color: var(--lnx-fg-2);
}

/* Eyebrow / metadata — the signature small-caps label */
.lnx-eyebrow {
  font-family: var(--lnx-font-sans);
  font-weight: 500;
  font-size: var(--lnx-text-xs);
  line-height: 1.1;
  letter-spacing: var(--lnx-track-label);
  text-transform: uppercase;
  color: var(--lnx-accent-red);
}

.lnx-eyebrow--muted {
  color: var(--lnx-fg-3);
}

/* Matter / evidence ID — monospace, dim */
.lnx-evidence {
  font-family: var(--lnx-font-mono);
  font-weight: 400;
  font-size: var(--lnx-text-xs);
  letter-spacing: 0.02em;
  color: var(--lnx-fg-3);
  text-transform: uppercase;
}

.lnx-quote {
  font-family: var(--lnx-font-serif);
  font-style: italic;
  font-size: var(--lnx-text-2xl);
  line-height: var(--lnx-leading-snug);
  color: var(--lnx-fg-1);
}