/* Article building blocks (src/Blog/template-functions.php). Uses the theme's
   design tokens from design.css, with fallbacks so they read well anywhere. */

.cf-crumbs ol { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 18px; padding: 0; list-style: none; font-size: 13.5px; color: var(--cf-ink-3, #6F7784); }
.cf-crumbs li + li::before { content: "›"; margin-inline-end: 6px; color: var(--cf-line-2, #CBD2DC); }
[dir="rtl"] .cf-crumbs li + li::before { content: "‹"; }
.cf-crumbs a { color: inherit; text-decoration: none; }
.cf-crumbs a:hover { color: var(--cf-ink, #1E0E24); text-decoration: underline; }
.cf-crumbs [aria-current] { color: var(--cf-ink-2, #4A5160); overflow: hidden; text-overflow: ellipsis; max-width: 32ch; white-space: nowrap; display: inline-block; vertical-align: bottom; }

.cf-toc { margin: 0 0 32px; padding: 16px 20px; border: 1px solid var(--cf-line, #E2E8F0); border-radius: var(--cf-r, 12px); background: var(--cf-paper-2, #F7F7FA); }
.cf-toc summary { cursor: pointer; font-weight: 700; font-size: 14px; letter-spacing: .02em; color: var(--cf-ink, #1E0E24); }
.cf-toc ol { margin: 12px 0 0; padding-inline-start: 20px; display: grid; gap: 6px; font-size: 15px; }
.cf-toc a { color: var(--cf-ink-2, #4A5160); text-decoration: none; }
.cf-toc a:hover { color: var(--cf-orange-ink, #C24400); text-decoration: underline; }
.cf-prose :is(h2, h3)[id] { scroll-margin-top: 96px; }

.cf-author { display: flex; gap: 16px; align-items: flex-start; margin: 40px 0 0; padding: 20px; border: 1px solid var(--cf-line, #E2E8F0); border-radius: var(--cf-r-lg, 16px); background: var(--cf-card, #fff); }
.cf-author__photo { width: 64px; height: 64px; border-radius: 50%; object-fit: cover; flex: none; background: var(--cf-paper-2, #F7F7FA); }
.cf-author p { margin: 0; }
.cf-author__name { font-weight: 800; color: var(--cf-ink, #1E0E24); }
.cf-author__role { font-size: 14px; color: var(--cf-ink-3, #6F7784); margin-top: 2px !important; }
.cf-author__bio { font-size: 15px; color: var(--cf-ink-2, #4A5160); margin-top: 8px !important; line-height: 1.6; }
.cf-author__link { display: inline-block; margin-top: 8px; font-size: 14px; font-weight: 600; color: var(--cf-orange-ink, #C24400); }

.cf-article-cta { margin: 48px 0 0; padding: clamp(24px, 4vw, 40px); border-radius: var(--cf-r-lg, 16px); background: var(--cf-night, #1E0E24); color: #fff; }
.cf-article-cta h2 { margin: 0 0 10px; font-family: var(--cf-font-display, inherit); font-size: clamp(22px, 3vw, 28px); line-height: 1.2; color: #fff; }
.cf-article-cta p { margin: 0 0 20px; color: rgba(255, 255, 255, .78); line-height: 1.6; }
.cf-article-cta .cf-btn--ghost { color: #fff; border-color: rgba(255, 255, 255, .35); }

.cf-related { margin: 64px 0 0; }
.cf-related > h2 { margin: 0 0 20px; }

.cf-newsletter { grid-template-columns: 1fr !important; margin: 48px 0 0; }
.cf-newsletter form { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 16px; }
.cf-newsletter .cf-input { flex: 1 1 240px; min-width: 0; }
.cf-newsletter form[hidden] { display: none; }
.cf-newsletter--compact { padding: 24px; }
.cf-newsletter--compact h2 { font-size: 22px; }