/* publish.css — jcalyon.com
 * Scope: typography + measure only. No color, no layout, no chrome.
 *
 * Placement: vault root (not in a subfolder). Upload via the Publish
 * modal alongside your notes. Updates require re-uploading.
 *
 * Obsidian Publish exposes its look through CSS custom properties
 * set on `body`. Overriding them is the cleanest, version-safe
 * approach — no fighting the cascade, no brittle selectors.
 */

/* ─── 1. Font stacks ──────────────────────────────────────────
 * Primary: Hanken Grotesk — neo-grotesque in the Söhne / Haas
 * lineage, variable, OFL, still uncommon enough to feel
 * considered rather than defaulted-into.
 *
 * System fallbacks (Inter → SF Pro → Segoe) keep first paint
 * instant if the web font hasn't loaded.
 *
 * Alternates if Hanken starts feeling too visible:
 *   - "Instrument Sans"  — subtler character, neo-grotesque
 *   - "Public Sans"      — USWDS workhorse, zero cliché
 *   - "Figtree"          — humanist, slightly warmer
 */

@import url("https://fonts.googleapis.com/css2?family=Hanken+Grotesk:ital,wght@0,400..700;1,400..700&display=swap");

body {
  --font-text:
    "Hanken Grotesk", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, system-ui,
    sans-serif;

  --font-interface:
    "Hanken Grotesk", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, system-ui,
    sans-serif;

  --font-monospace:
    ui-monospace, "SF Mono", "JetBrains Mono", Menlo, Consolas, "Liberation Mono", monospace;
}

/* ─── 2. Base size + measure ──────────────────────────────────
 * 17px base is the sans sweet spot — 16px feels UI-ish, 18px
 * starts feeling large-print. Sans packs more characters per rem
 * than serif, so 38rem ≈ 68ch — inside Bringhurst's 45–75 range.
 */

body {
  --font-text-size: 17px;
  --line-height-normal: 1.55;
  --line-height-tight: 1.2;

  --line-width: 38rem;
}

/* ─── 3. Headings — gentle scale, tighter tracking ────────────
 * Sans display wants negative letter-spacing to avoid feeling
 * airy at size. Scale is restrained: hierarchy without shouting.
 */

body {
  --h1-size: 2.1em;
  --h2-size: 1.45em;
  --h3-size: 1.2em;
  --h4-size: 1.05em;
  --h5-size: 1em;
  --h6-size: 0.9em;

  --h1-weight: 600;
  --h2-weight: 600;
  --h3-weight: 600;
  --h4-weight: 500;
  --h5-weight: 500;
  --h6-weight: 500;

  --h1-line-height: 1.1;
  --h2-line-height: 1.2;
  --h3-line-height: 1.3;
}

/* Tighter optical tracking on display headings. */
.markdown-preview-view h1 {
  letter-spacing: -0.022em;
}
.markdown-preview-view h2 {
  letter-spacing: -0.018em;
}
.markdown-preview-view h3 {
  letter-spacing: -0.012em;
}

/* ─── 4. Refinements ──────────────────────────────────────────
 */

/* Kerning + ligatures in body prose. (No `onum` — most sans
 * fallbacks lack old-style figures; lining figures are fine in
 * a sans context anyway.) */
.markdown-preview-view {
  text-rendering: optimizeLegibility;
  font-feature-settings: "kern", "liga";
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Tabular figures in code so columns align. */
.markdown-preview-view code,
.markdown-preview-view pre {
  font-feature-settings: "tnum";
}

/* Tighten paragraph rhythm — let the measure do the work. */
.markdown-preview-view p {
  margin-block: 0.85em;
}

/* Blockquotes: keep upright (italic-by-default reads dated in sans). */
.markdown-preview-view blockquote {
  font-style: normal;
}

/* ─── 5. Sidebar nav — allcaps labels ─────────────────────────
 * Filenames stay lowercase on disk (good convention); this is a
 * purely visual transform. Caps at nav size need positive tracking
 * to avoid shouting, and shrink slightly so they read as labels
 * rather than running text.
 */

.nav-file-title,
.nav-folder-title {
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 0.78em;
  font-weight: 500;
}

/* ─── 6. Site title — treat as logotype ───────────────────────
 * Keeps lowercase (brand identity), but sizes up, tightens
 * tracking, and adds weight so it reads as a wordmark instead
 * of running UI text. Margin below separates it from nav.
 *
 * If you later want unity with the allcaps nav, swap this for:
 *   text-transform: uppercase; letter-spacing: 0.08em;
 *   font-size: 0.95rem; font-weight: 600;
 */

.site-body-left-column-site-name {
  font-size: 1.35rem;
  font-weight: 700;
  letter-spacing: -0.025em;
  line-height: 1.1;
  margin-block-end: 1.25rem;
}