/* ============================================================
   Lancor Design System — Colors & Type
   Distilled from "The OpsPod" and "Charlesbank PRG Leader"
   pitch decks.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,300;0,400;0,700;0,900;1,300;1,400&display=swap');

:root {
  /* ---------- Brand colors ---------- */
  --lancor-navy:       #293440; /* primary surface, hero band, body text on light */
  --lancor-navy-900:   #1c242e; /* darker pressed state / footers */
  --lancor-navy-700:   #3a4654;
  --lancor-gold:       #B8860B; /* hairline rule under hero, accent labels */
  --lancor-gold-dark:  #8B6F00; /* gold text variant */
  --lancor-teal:       #2A9D8F; /* pillar accent / data viz primary */
  --lancor-teal-dark:  #1f7a70;
  --lancor-plum:       #60136A; /* secondary accent / pillar variant */

  /* ---------- Neutrals ---------- */
  --lancor-white:      #FFFFFF;
  --lancor-paper:      #F5F7FA; /* subtle section background */
  --lancor-line:       #E2E6EA; /* hairline borders */
  --lancor-fg-muted:   #999999; /* page numbers, secondary labels */
  --lancor-fg-soft:    #444444; /* body text alt */
  --lancor-fg:         #293440; /* default body */

  /* ---------- Semantic foreground / background ---------- */
  --fg-1: var(--lancor-navy);     /* primary text */
  --fg-2: var(--lancor-fg-soft);  /* body text */
  --fg-3: var(--lancor-fg-muted); /* tertiary, captions */
  --fg-inv: var(--lancor-white);  /* on dark surfaces */
  --bg-1: var(--lancor-white);
  --bg-2: var(--lancor-paper);
  --bg-dark: var(--lancor-navy);
  --border: var(--lancor-line);
  --rule-accent: var(--lancor-gold);

  /* ---------- Type families ---------- */
  --font-display: 'Lato', 'Helvetica Neue', Arial, sans-serif; /* weight 300 for elegant display */
  --font-body:    'Lato', 'Helvetica Neue', Arial, sans-serif; /* 400/700 */
  --font-mono:    ui-monospace, 'SF Mono', Menlo, Consolas, monospace;

  /* ---------- Type scale (16:9 slide ~ 1280×720 reference) ---------- */
  --fs-eyebrow: 11px;   /* CHARLESBANK CAPITAL PARTNERS — gold, tracked */
  --fs-caption: 12px;
  --fs-meta:    13px;
  --fs-body:    14px;
  --fs-body-lg: 16px;
  --fs-h4:      18px;
  --fs-h3:      22px;
  --fs-h2:      28px;
  --fs-h1:      36px;
  --fs-display: 48px;

  /* ---------- Tracking ---------- */
  --tracking-eyebrow: 0.14em;   /* ALL CAPS section labels */
  --tracking-tight:   -0.01em;
  --tracking-normal:  0;

  /* ---------- Spacing (4pt baseline) ---------- */
  --s-1:  4px;
  --s-2:  8px;
  --s-3:  12px;
  --s-4:  16px;
  --s-5:  20px;
  --s-6:  24px;
  --s-7:  32px;
  --s-8:  40px;
  --s-9:  48px;
  --s-10: 64px;
  --s-12: 96px;

  /* ---------- Radii ---------- */
  --radius-none: 0;          /* default — Lancor is rectilinear */
  --radius-xs:   2px;
  --radius-sm:   4px;
  --radius-md:   8px;        /* pillar number badges */
  --radius-pill: 999px;      /* candidate-of-N pills */

  /* ---------- Elevation (used sparingly; mostly flat) ---------- */
  --shadow-sm: 0 1px 2px rgba(41, 52, 64, 0.06);
  --shadow-md: 0 4px 14px rgba(41, 52, 64, 0.08);
  --shadow-lg: 0 12px 28px rgba(41, 52, 64, 0.12);

  /* ---------- Layout primitives ---------- */
  --rule-thickness: 2px;     /* the signature gold rule under hero bands */
  --slide-pad-x: 56px;
  --slide-pad-y: 48px;
}

/* ============================================================
   Element styles — semantic defaults
   ============================================================ */

body {
  font-family: var(--font-body);
  color: var(--fg-1);
  background: var(--bg-1);
  font-size: var(--fs-body);
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

h1, .h1 {
  font-family: var(--font-display);
  font-weight: 300;          /* Lato Light — the brand voice */
  font-size: var(--fs-h1);
  line-height: 1.15;
  letter-spacing: var(--tracking-tight);
  color: var(--fg-1);
  margin: 0;
}

h2, .h2 {
  font-family: var(--font-display);
  font-weight: 300;
  font-size: var(--fs-h2);
  line-height: 1.2;
  color: var(--fg-1);
  margin: 0;
}

h3, .h3 {
  font-family: var(--font-body);
  font-weight: 700;
  font-size: var(--fs-h3);
  line-height: 1.3;
  color: var(--fg-1);
  margin: 0;
}

h4, .h4 {
  font-family: var(--font-body);
  font-weight: 700;
  font-size: var(--fs-h4);
  line-height: 1.35;
  margin: 0;
}

.eyebrow {
  font-family: var(--font-body);
  font-weight: 700;
  font-size: var(--fs-eyebrow);
  letter-spacing: var(--tracking-eyebrow);
  text-transform: uppercase;
  color: var(--lancor-gold);
}

.eyebrow--light { color: var(--lancor-gold); }
.eyebrow--mute  { color: var(--lancor-fg-muted); }

p {
  font-size: var(--fs-body);
  line-height: 1.55;
  color: var(--fg-2);
  margin: 0 0 var(--s-3) 0;
  text-wrap: pretty;
}

.lede {
  font-family: var(--font-display);
  font-weight: 300;
  font-size: var(--fs-h4);
  line-height: 1.5;
  color: var(--fg-1);
}

small, .caption {
  font-size: var(--fs-caption);
  color: var(--fg-3);
}

hr.lancor-rule {
  border: 0;
  height: var(--rule-thickness);
  background: var(--lancor-gold);
  margin: 0;
}

/* The signature hero band — dark navy with a gold hairline below */
.lancor-hero {
  background: var(--lancor-navy);
  color: var(--fg-inv);
  border-bottom: var(--rule-thickness) solid var(--lancor-gold);
  padding: var(--s-9) var(--slide-pad-x);
}

/* Footer treatment used on every slide */
.lancor-footer {
  font-family: var(--font-body);
  font-weight: 400;
  font-size: var(--fs-caption);
  color: var(--lancor-fg-muted);
  letter-spacing: 0.02em;
}