/* AE Blue Capital — colors & type tokens
 * Load once, then use the CSS variables or the semantic element styles.
 *
 * TYPOGRAPHY (committed picks):
 *   Display serif — Newsreader (Google Fonts, OFL).
 *     A literary, optical-sized serif designed for long-form reading. Slight
 *     Didone contrast at display sizes; humanist warmth at text sizes. Reads
 *     as serious magazine / journal — fits the firm's editorial voice and
 *     the "ancient systems" frame better than Cormorant.
 *   Body sans — Switzer (Fontshare, OFL).
 *     A warm Söhne-adjacent grotesque with nine weights and a true italic.
 *     Avoids the Inter/Roboto/Helvetica trap; reads modern but not techy.
 *   Mono — JetBrains Mono (Google Fonts, OFL).
 *     Used sparingly for dates, addresses, metrics. Quiet at small sizes.
 */

/* Newsreader (serif) + JetBrains Mono (mono) — self-hosted (OFL, variable
 * woff2 from Google Fonts). Local files in /fonts so the design system renders
 * identically with NO remote font dependency. */
@font-face {
  font-family: 'Newsreader'; font-style: normal; font-weight: 300 700; font-display: swap;
  src: url('fonts/newsreader-var-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Newsreader'; font-style: normal; font-weight: 300 700; font-display: swap;
  src: url('fonts/newsreader-var-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Newsreader'; font-style: italic; font-weight: 400 500; font-display: swap;
  src: url('fonts/newsreader-italic-var-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Newsreader'; font-style: italic; font-weight: 400 500; font-display: swap;
  src: url('fonts/newsreader-italic-var-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'JetBrains Mono'; font-style: normal; font-weight: 400 500; font-display: swap;
  src: url('fonts/jetbrainsmono-var-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'JetBrains Mono'; font-style: normal; font-weight: 400 500; font-display: swap;
  src: url('fonts/jetbrainsmono-var-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* Switzer — self-hosted (OFL, via Fontshare). Local files in /fonts so the
 * design system carries its own body face with no remote dependency. */
@font-face {
  font-family: 'Switzer'; font-weight: 400; font-style: normal; font-display: swap;
  src: url('fonts/switzer-400.woff2') format('woff2');
}
@font-face {
  font-family: 'Switzer'; font-weight: 400; font-style: italic; font-display: swap;
  src: url('fonts/switzer-400i.woff2') format('woff2');
}
@font-face {
  font-family: 'Switzer'; font-weight: 500; font-style: normal; font-display: swap;
  src: url('fonts/switzer-500.woff2') format('woff2');
}
@font-face {
  font-family: 'Switzer'; font-weight: 600; font-style: normal; font-display: swap;
  src: url('fonts/switzer-600.woff2') format('woff2');
}
@font-face {
  font-family: 'Switzer'; font-weight: 700; font-style: normal; font-display: swap;
  src: url('fonts/switzer-700.woff2') format('woff2');
}

:root {
  /* ——— Colors ——— */

  /* Core neutrals (warm) */
  --paper:     #F5EFE6;   /* warm cream — secondary surface, off-ink panels */
  --ivory:     #FBF8F2;   /* highest-contrast text on ink */
  --sand:      #D9C7AF;   /* warm secondary */
  --dune:      #B89B74;   /* deeper warm neutral */
  --graphite:  #3B3530;   /* secondary text on light grounds */

  /* Ink (navy — the "Blue", and the dominant page ground) */
  --ink:       #0B1B2D;   /* PRIMARY BACKGROUND — deep navy, slide-matched */
  --ink-2:     #122438;   /* lifted ink — cards, raised surfaces */
  --ink-3:     #1B3050;   /* highest ink lift — hover, selected */
  --ink-line:  rgba(245, 239, 230, 0.14);   /* hairline on ink */
  --ink-hair:  rgba(245, 239, 230, 0.07);
  --ink-muted: rgba(11, 27, 45, 0.64);      /* legacy: ink at 64% — for use ON paper */
  --ink-soft:  rgba(11, 27, 45, 0.32);

  /* Foreground colors when on ink ground */
  --on-ink-1:  #F4ECDB;   /* primary text on ink — warm ivory */
  --on-ink-2:  rgba(244, 236, 219, 0.72);  /* secondary text on ink */
  --on-ink-3:  rgba(244, 236, 219, 0.44);  /* tertiary / footnote on ink */

  /* Accents — gilt is the single emphasis color (per Fund I deck) */
  --gilt:      #C9A66B;   /* warm gold — eyebrows, highlights, "Top 10%" callouts */
  --gilt-2:    #B08F4E;   /* deeper gilt for hover */
  --rust:      #8E3A2E;   /* reserved — rare emphasis only */
  --ember:     #C64B34;   /* reserved — rare emphasis only */

  /* Semantic foregrounds / backgrounds — DEFAULT IS DARK MODE */
  --fg-1:      var(--on-ink-1);
  --fg-2:      var(--on-ink-2);
  --fg-3:      var(--on-ink-3);
  --fg-inv:    var(--ink);

  --bg-1:      var(--ink);    /* page ground */
  --bg-2:      var(--ink-2);  /* card */
  --bg-3:      var(--ink-3);  /* raised */

  --border:    var(--ink-line);
  --hairline:  var(--ink-hair);

  /* ——— Type families ——— */
  --font-serif:  'Newsreader', 'Source Serif 4', 'Iowan Old Style', Georgia, 'Times New Roman', serif;
  --font-sans:   'Switzer', 'Söhne', 'Inter Tight', -apple-system, BlinkMacSystemFont, 'Helvetica Neue', Arial, sans-serif;
  --font-mono:   'JetBrains Mono', 'SF Mono', Menlo, Consolas, monospace;

  /* ——— Type scale (editorial, large display) ——— */
  --fs-hero:    clamp(64px, 9vw, 144px);  /* @kind font */ /* hero display */
  --fs-display: clamp(48px, 6vw, 88px);   /* @kind font */ /* section display */
  --fs-h1:      clamp(36px, 4.5vw, 64px); /* @kind font */
  --fs-h2:      clamp(28px, 3.2vw, 44px); /* @kind font */
  --fs-h3:      clamp(22px, 2.2vw, 30px); /* @kind font */
  --fs-h4:      20px;  /* @kind font */
  --fs-body:    18px;  /* @kind font */
  --fs-body-sm: 15px;  /* @kind font */
  --fs-label:   13px;  /* @kind font */
  --fs-mono:    14px;  /* @kind font */

  /* ——— Spacing ——— */
  --sp-1: 4px;  --sp-2: 8px;  --sp-3: 12px; --sp-4: 16px;
  --sp-5: 24px; --sp-6: 32px; --sp-7: 48px; --sp-8: 64px;
  --sp-9: 96px; --sp-10: 128px; --sp-11: 160px;

  /* ——— Radii (small, editorial) ——— */
  --r-0: 0;   /* @kind radius */
  --r-1: 2px; /* @kind radius */
  --r-2: 4px; /* @kind radius */
  --r-3: 8px; /* @kind radius */

  /* ——— Shadows (soft, rare) ——— */
  --shadow-1: 0 1px 2px rgba(0, 0, 0, 0.18);
  --shadow-2: 0 1px 2px rgba(0, 0, 0, 0.18), 0 8px 24px rgba(0, 0, 0, 0.28);
  --shadow-photo: 0 24px 64px -16px rgba(0, 0, 0, 0.5);

  /* ——— Motion ——— */
  --ease: cubic-bezier(0.2, 0.8, 0.2, 1); /* @kind other */
  --dur-fast: 200ms; /* @kind other */
  --dur-med:  400ms; /* @kind other */
  --dur-slow: 800ms; /* @kind other */

  /* ——— Layout ——— */
  --page-max: 1280px; /* @kind spacing */
  --page-gutter: clamp(20px, 4vw, 48px); /* @kind spacing */
  --measure: 60ch; /* @kind spacing */
}

/* ——— Reset-ish defaults ——— */
html { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

body {
  background: var(--bg-1);
  color: var(--fg-1);
  font-family: var(--font-sans);
  font-size: var(--fs-body);
  line-height: 1.65;
  font-feature-settings: 'ss01', 'cv11';
}

/* ——— Semantic type styles ——— */

.hero, h1.hero {
  font-family: var(--font-serif);
  font-weight: 400;
  font-size: var(--fs-hero);
  line-height: 1.02;
  letter-spacing: -0.015em;
  color: var(--fg-1);
}

h1, .h1 {
  font-family: var(--font-serif);
  font-weight: 400;
  font-size: var(--fs-h1);
  line-height: 1.08;
  letter-spacing: -0.012em;
  margin: 0 0 var(--sp-5);
}

h2, .h2 {
  font-family: var(--font-serif);
  font-weight: 400;
  font-size: var(--fs-h2);
  line-height: 1.14;
  letter-spacing: -0.008em;
  margin: 0 0 var(--sp-4);
}

h3, .h3 {
  font-family: var(--font-serif);
  font-weight: 500;
  font-size: var(--fs-h3);
  line-height: 1.2;
  letter-spacing: -0.004em;
  margin: 0 0 var(--sp-3);
}

h4, .h4 {
  font-family: var(--font-sans);
  font-weight: 600;
  font-size: var(--fs-h4);
  line-height: 1.3;
  margin: 0 0 var(--sp-3);
}

p, .body {
  font-family: var(--font-sans);
  font-size: var(--fs-body);
  line-height: 1.65;
  color: var(--fg-2);
  max-width: var(--measure);
  margin: 0 0 var(--sp-4);
}

.body-serif {
  font-family: var(--font-serif);
  font-weight: 400;
  font-size: calc(var(--fs-body) + 1px);
  line-height: 1.55;
  color: var(--fg-1);
  max-width: var(--measure);
}

.lede {
  font-family: var(--font-serif);
  font-style: italic;
  font-weight: 400;
  font-size: clamp(22px, 2.4vw, 30px);
  line-height: 1.4;
  color: var(--fg-1);
  max-width: 30ch;
}

/* Eyebrow / section label — small-caps sans */
.eyebrow, .label {
  font-family: var(--font-sans);
  font-size: var(--fs-label);
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  color: var(--fg-3);
}

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

code, .mono {
  font-family: var(--font-mono);
  font-size: var(--fs-mono);
  color: var(--ink);
}

/* ——— Links ——— */
a {
  color: inherit;
  text-decoration: none;
  text-underline-offset: 4px;
  text-decoration-thickness: 1px;
  transition: color var(--dur-fast) var(--ease);
}
a:hover { text-decoration: underline; }

/* ——— Rules ——— */
hr {
  border: 0;
  border-top: 1px solid var(--border);
  margin: var(--sp-7) 0;
}

/* ——— Selection ——— */
::selection { background: var(--gilt); color: var(--ink); }

/* ——— Eyebrow gilt variant — used heavily on ink ground ——— */
.eyebrow-gilt {
  font-family: var(--font-sans);
  font-size: var(--fs-label);
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.16em;
  color: var(--gilt);
}
.eyebrow-gilt::before { content: "§ "; }