/* Article page — auto-loaded for the article-view snippet (site/snippets/article-view.php) */

.article {
  display: grid;
  grid-template-columns: var(--col-side) minmax(0, 1fr) var(--col-side);
  min-height: calc(100vh - var(--menubar-h));
}

/* centre column */
.article__main {
  padding: var(--space-l) var(--space-l) var(--space-xl);
  /* red gradient accent bar across the top of the reading column */
  background:
    linear-gradient(var(--color-note), transparent) top / 100% 6px no-repeat var(--color-white);
}
.article__header { text-align: center; margin-bottom: var(--space-xl); }
.article__title {
  font-size: var(--fs-title);
  font-weight: 400;
  line-height: var(--leading-tight);
}
.article__byline { margin-top: var(--space-2xs); }

.article__body {
  max-width: var(--measure);
  margin-inline: auto;
  text-align: justify;
  hyphens: auto;
}
.article__body > * + * { margin-top: var(--space-s); }

/* right footnotes column */
.article__notes {
  padding: var(--space-l) var(--space-s);
  border-left: var(--border);
  font-size: var(--fs-small);
}

@media (max-width: 60rem) {
  /* Mobile: single reading column; meta and notes stack (Figma: "Article Page - Mobile"). */
  .article { grid-template-columns: 1fr; }
  .article__notes { border-left: 0; border-top: var(--border); }
}