/* The four static pages. Loaded after styles.css, which brings the self-hosted
   Archivo, the tokens and the shared header/footer classes; this file is only
   the reading column.

   Kept in a file rather than a <style> block because the app's CSP sets
   style-src 'self': an inline block or a style="" attribute is dropped by the
   browser, and the page still answers 200 while rendering bare. Check by eye,
   not by status code. */

.doc { max-width: 720px; margin: 0 auto; padding: 56px var(--pad) 72px; }

.doc h1 {
  font-size: 46px; font-weight: 900; letter-spacing: -0.035em;
  line-height: 1; margin-bottom: 20px; text-wrap: balance;
}
.doc h2 {
  font-size: 13px; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--n600); margin: 40px 0 12px; padding-top: 16px; border-top: var(--hair);
}
.doc p { margin: 0 0 14px; color: var(--n800); line-height: 1.6; }
.doc ul { margin: 0 0 14px; padding-left: 20px; }
.doc li { margin-bottom: 8px; color: var(--n800); line-height: 1.6; }
.doc strong { font-weight: 700; color: var(--ink); }
.doc code {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 0.9em; background: var(--surface); padding: 1px 5px;
}
.doc .updated { margin: -8px 0 28px; font-size: 13px; color: var(--n600); }
.doc .lead { font-size: 18px; line-height: 1.5; color: var(--n800); margin-bottom: 28px; }