/* ============================================================================
   OneMediaKit — the blog (10 Sept 2026): the index list and the article
   typography. Loaded by OMK_Blog on /blog/ and on posts only, after site.css,
   so the marketing pages never pay for it and nothing here can leak into
   them: every rule sits under .omk-posts, .omk-blog-* or .omk-article*.
   Tokens only, mobile first, same rules as site.css.
   ============================================================================ */

/* ---------------------------------------------------------------- index */
.omk-posts { display: grid; gap: var(--space-6); }
.omk-post { padding-bottom: var(--space-6); border-bottom: 1px solid var(--line); }
.omk-post:last-child { border-bottom: 0; padding-bottom: 0; }
.omk-post-title a { text-decoration: none; }
.omk-post-title a:hover { text-decoration: underline; text-decoration-color: var(--accent); text-decoration-thickness: 2px; text-underline-offset: 3px; }
.omk-post-excerpt { color: var(--ink-2); margin-top: var(--space-2); max-width: var(--measure); line-height: var(--leading-loose); }
.omk-post-meta { font-size: var(--text-small); font-weight: var(--weight-medium); color: var(--ink-2); margin-top: var(--space-3); }
.omk-blog-empty-link { margin-top: var(--space-4); }
.omk-blog-pages { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); margin-top: var(--space-7); padding-top: var(--space-5); border-top: 1px solid var(--line); font-size: var(--text-small); }
.omk-blog-pages-count { color: var(--ink-2); }

/* -------------------------------------------------------------- article */
/* Everything the block editor can emit, under .omk-article-body only (the
   marketing pages reset lists and paragraphs; these rules restore them here). */
.omk-article-head .omk-h1 { max-width: 24ch; }
.omk-article-meta { display: flex; flex-wrap: wrap; gap: var(--space-2); margin-top: var(--space-4); font-size: var(--text-small); font-weight: var(--weight-medium); color: var(--ink-2); }
.omk-article-head .omk-eyebrow a { color: inherit; }
.omk-article-head .omk-eyebrow a:hover { color: var(--accent-strong); }
.omk-article-cover { margin: 0 auto var(--space-6); padding: 0 var(--gutter); }
.omk-article-cover img { display: block; width: 100%; height: auto; border-radius: var(--radius-3); border: 1px solid var(--line); }
.omk-article-body { padding: 0 var(--gutter) var(--space-7); font-size: 1.0625rem; line-height: var(--leading-loose); color: var(--ink); }
.omk-article-body > * { margin: 0 0 var(--space-5); }
.omk-article-body > *:last-child { margin-bottom: 0; }
.omk-article-body h2, .omk-article-body h3, .omk-article-body h4 { font-family: var(--font-display); font-weight: var(--weight-display); line-height: var(--leading-heading); letter-spacing: var(--tracking-heading); color: var(--ink); margin: var(--space-8) 0 var(--space-4); text-wrap: balance; }
.omk-article-body h2 { font-size: var(--text-h2); }
.omk-article-body h3 { font-size: var(--text-h3); }
.omk-article-body h4 { font-size: var(--text-lede); }
.omk-article-body h2:first-child, .omk-article-body h3:first-child { margin-top: 0; }
.omk-article-body p { margin: 0 0 var(--space-5); text-wrap: pretty; }
.omk-article-body a:not(.omk-btn) { color: inherit; text-decoration: underline; text-decoration-color: var(--accent); text-decoration-thickness: 2px; text-underline-offset: 3px; }
.omk-article-body a:not(.omk-btn):hover { color: var(--accent-strong); }
.omk-article-body strong { font-weight: var(--weight-semibold); }
.omk-article-body ul, .omk-article-body ol { padding-left: 1.4em; margin: 0 0 var(--space-5); }
.omk-article-body ul li { list-style: disc; }
.omk-article-body ol li { list-style: decimal; }
.omk-article-body li { margin: 0 0 var(--space-2); padding-left: 0.2em; }
.omk-article-body li > ul, .omk-article-body li > ol { margin: var(--space-2) 0 0; }
.omk-article-body blockquote { margin: var(--space-6) 0; padding: var(--space-2) 0 var(--space-2) var(--space-5); border-left: 3px solid var(--accent); font-size: var(--text-lede); color: var(--ink-2); }
.omk-article-body blockquote p:last-child { margin-bottom: 0; }
.omk-article-body blockquote cite { display: block; margin-top: var(--space-2); font-size: var(--text-small); font-style: normal; color: var(--ink-2); }
.omk-article-body img { display: block; max-width: 100%; height: auto; border-radius: var(--radius-2); }
.omk-article-body figure { margin: var(--space-6) 0; }
.omk-article-body figcaption { margin-top: var(--space-2); font-size: var(--text-small); color: var(--ink-2); }
.omk-article-body .alignwide, .omk-article-body .alignfull { max-width: 100%; }
.omk-article-body pre { margin: var(--space-6) 0; padding: var(--space-4) var(--space-5); overflow-x: auto; -webkit-overflow-scrolling: touch; background: var(--ink); color: var(--on-ink); border-radius: var(--radius-2); font-family: var(--font-mono); font-size: var(--text-small); line-height: 1.6; }
.omk-article-body pre code { background: none; padding: 0; font-size: inherit; color: inherit; }
.omk-article-body code { font-family: var(--font-mono); font-size: 0.9em; background: var(--paper-2); padding: 0.1em 0.4em; border-radius: var(--radius-1); }
.omk-article-body hr { border: 0; border-top: 1px solid var(--line); margin: var(--space-7) 0; }
.omk-article-body .wp-block-table, .omk-article-body table { width: 100%; overflow-x: auto; }
.omk-article-body table { border-collapse: collapse; font-size: var(--text-small); }
.omk-article-body th, .omk-article-body td { padding: var(--space-2) var(--space-3); text-align: left; vertical-align: top; border-bottom: 1px solid var(--line); }
.omk-article-body th { font-weight: var(--weight-semibold); }
.omk-article-body .post-password-form input[type="password"] { min-height: 2.75rem; padding: var(--space-2) var(--space-3); font: inherit; border: 1px solid var(--line-2); border-radius: var(--radius-2); }
.omk-article-body .post-password-form input[type="submit"] { min-height: 2.75rem; padding: var(--space-2) var(--space-4); font: inherit; font-weight: var(--weight-semibold); background: var(--accent-strong); color: var(--on-accent); border: 0; border-radius: var(--radius-2); cursor: pointer; }
.omk-article-foot { padding: 0 var(--gutter) var(--section-y); }
.omk-article-author { font-size: var(--text-small); color: var(--ink-2); padding-top: var(--space-5); border-top: 1px solid var(--line); }
.omk-article-nav { display: grid; gap: var(--space-4); margin-top: var(--space-6); }
.omk-article-nav-link { display: grid; gap: var(--space-1); padding: var(--space-4) var(--space-5); background: var(--paper-0); border: 1px solid var(--line); border-radius: var(--radius-3); transition: border-color var(--dur-1) var(--ease-out); }
.omk-article-nav-link:hover { border-color: var(--ink); }
.omk-article-nav-next { text-align: right; }
.omk-article-nav-label { font-size: var(--text-micro); font-weight: var(--weight-medium); letter-spacing: var(--tracking-eyebrow); text-transform: uppercase; color: var(--ink-2); }
.omk-article-nav-title { font-weight: var(--weight-semibold); }
@media (min-width: 640px) {
  .omk-article-nav { grid-template-columns: 1fr 1fr; }
  .omk-article-nav-next:only-child { grid-column: 2; }
}