/* Page-scoped styles extracted from es/blog-predicting-the-future.html. */

/* Blog post page-scoped styles (SHARED block; identical to the EN twin).
   Class prefix bl-. Tokens from site-tokens.css only. Token repair map is
   enumerated in PROGRESS-carryover-2.md. Zero em-dashes / en-dashes here. */
.bl-wrap { max-width: 760px; margin-inline: auto; }
.bl-post-hero { padding-block: var(--s-9) var(--s-6); }
.bl-post-meta { font-family: var(--font-mono); font-size: var(--fs-13); letter-spacing: var(--tracking-eyebrow); text-transform: uppercase; color: var(--ink-soft); margin-bottom: var(--s-4); }
.bl-post-hero h1 { margin: 0 0 var(--s-4); }
.bl-post-hero .lede { max-width: 60ch; margin: 0; }
.bl-post-body { padding-block: var(--s-4) var(--s-9); }
.bl-prose > p { font-size: var(--fs-18); line-height: 1.7; color: var(--ink-muted); margin: 0 0 var(--s-4); max-width: 66ch; }
.bl-prose h2 { margin: var(--s-8) 0 var(--s-4); }
.bl-prose h3 { margin: var(--s-6) 0 var(--s-3); }
.bl-prose strong { color: var(--ink); font-weight: var(--weight-semibold); }
.bl-prose em { color: var(--ink); font-style: italic; }
.bl-prose a { color: var(--blue-deep); text-decoration: underline; text-decoration-color: var(--blue-soft); text-underline-offset: 3px; }
.bl-prose a:hover { color: var(--blue); text-decoration-color: var(--blue); }
.bl-prose ul, .bl-prose ol { font-size: var(--fs-18); line-height: 1.7; color: var(--ink-muted); padding-left: 1.3em; margin: 0 0 var(--s-4); max-width: 66ch; }
.bl-prose li { margin-bottom: var(--s-2); }
.bl-prose hr { border: 0; border-top: 1px solid var(--line); margin: var(--s-7) 0; }
.bl-prose sup { font-size: 0.7em; }
.bl-table-wrap { overflow-x: auto; margin: var(--s-6) 0; -webkit-overflow-scrolling: touch; }
.bl-prose table { width: 100%; border-collapse: collapse; font-size: var(--fs-14); background: var(--bg); border: 1px solid var(--line); border-radius: var(--r-md); overflow: hidden; min-width: 560px; }
.bl-prose thead { background: var(--bg-cream); }
.bl-prose th, .bl-prose td { padding: var(--s-3) var(--s-4); text-align: left; vertical-align: top; border-bottom: 1px solid var(--line); }
.bl-prose th { font-family: var(--font-mono); font-size: var(--fs-12); letter-spacing: 0.08em; text-transform: uppercase; color: var(--ink); font-weight: var(--weight-medium); }
.bl-prose tr:last-child td { border-bottom: 0; }
.bl-diagram { margin: var(--s-6) 0; }
.bl-diagram-ph { display: flex; align-items: center; justify-content: center; min-height: 160px; padding: var(--s-6) var(--s-5); background: var(--bg-cream); border: 1px dashed var(--line); border-radius: var(--r-md); color: var(--ink-soft); font-family: var(--font-mono); font-size: var(--fs-13); text-align: center; letter-spacing: 0.02em; }
.bl-backlink { margin-top: var(--s-7); }
.bl-backlink a { font-family: var(--font-mono); font-size: var(--fs-14); }
