.article-prose { max-width: 760px; }
.article-prose > div[itemprop="articleBody"] > p:first-of-type::first-letter {
  font-family: var(--font-display); font-size: 3.1rem; line-height: .8;
  float: left; margin: 6px 12px 0 0; color: var(--gold-2, #caa43a);
}
.article-prose blockquote { border-left: 3px solid var(--gold, #caa43a); margin: 1.6em 0; padding: .4em 1.4em; font-style: italic; color: var(--ink); }
.article-meta { color: var(--gold-2, #caa43a); font-family: var(--font-display); font-size: .72rem; letter-spacing: .14em; text-transform: uppercase; }
.article-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; margin-top: 3rem; padding-top: 1.6rem; border-top: 1px solid rgba(202,164,58,.25); }
.article-share { display: inline-flex; gap: 10px; flex-wrap: wrap; }
.article-nav { background: var(--ink, #0f0c08); padding: clamp(28px,5vw,56px) 0; border-top: 1px solid rgba(202,164,58,.18); }
.article-nav__inner { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.article-nav__item { display: flex; flex-direction: column; gap: 6px; padding: 20px 24px; border: 1px solid rgba(202,164,58,.22); background: rgba(240,227,196,.03); transition: border-color .2s, background .2s; }
.article-nav__item:hover { border-color: var(--gold, #caa43a); background: rgba(202,164,58,.07); }
.article-nav__item--next { text-align: right; }
.article-nav__item--only { grid-column: 1 / -1; max-width: 520px; }
.article-nav__item--next.article-nav__item--only { margin-left: auto; }
.article-nav__dir { font-family: var(--font-display, serif); font-size: .6rem; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--gold-2, #caa43a); }
.article-nav__cat { font-family: var(--font-display, serif); font-size: .62rem; letter-spacing: .12em; text-transform: uppercase; color: var(--muted, #9a8a6a); }
.article-nav__title { font-family: var(--font-serif, Newsreader, serif); font-size: 1.05rem; color: var(--paper, #f0e3c4); line-height: 1.3; }
@media (max-width: 720px) {
  .article-nav__inner { grid-template-columns: 1fr; }
  .article-nav__item--next { text-align: left; }
}
