.article {
  border-left: var(--status-bar-art) solid transparent;
  padding-left: var(--sp-6);
}

.article__inner {
  max-width: var(--w-content);
  margin: 0 auto;
  padding: var(--sp-12) var(--sp-6);
}

.article__header { margin-bottom: var(--sp-8); }

.article__stamp { margin-bottom: var(--sp-3); }

.article__section {
  font-family: var(--f-mono);
  font-size: var(--t-xs);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--c-text-3);
}
.article__section a { color: inherit; text-decoration: none; }
.article__section a:hover { color: var(--c-accent); }

.article__title {
  font-family: var(--f-serif);
  font-size: var(--t-3xl);
  font-weight: 700;
  line-height: var(--lh-tight);
  margin: var(--sp-3) 0 var(--sp-4);
}

.article__excerpt {
  font-size: var(--t-lg);
  color: var(--c-text-2);
  line-height: var(--lh-snug);
  margin-bottom: var(--sp-5);
  font-style: italic;
}

.article__byline {
  display: flex;
  gap: var(--sp-5);
  font-family: var(--f-mono);
  font-size: var(--t-xs);
  color: var(--c-text-3);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  border-top: var(--bw) solid var(--c-border-light);
  border-bottom: var(--bw) solid var(--c-border-light);
  padding: var(--sp-3) 0;
  margin: var(--sp-4) 0;
  flex-wrap: wrap;
}

.article__badges { display: flex; flex-wrap: wrap; gap: var(--sp-2); margin-bottom: var(--sp-3); }
.article__context-tags { margin-bottom: var(--sp-5); color: var(--c-text-3); font-size: var(--t-xs); }

/* Article body content */
.article__content { line-height: var(--lh-loose); font-size: var(--t-body); }
.article__content p    { margin-bottom: var(--sp-5); }
.article__content h2   { font-size: var(--t-xl); margin: var(--sp-8) 0 var(--sp-4); }
.article__content h3   { font-size: var(--t-lg); margin: var(--sp-6) 0 var(--sp-3); }
.article__content a    { color: var(--c-accent); }
.article__content img  { margin: var(--sp-6) 0; }
.article__content blockquote {
  border-left: 3px solid var(--c-accent);
  padding-left: var(--sp-5);
  color: var(--c-text-2);
  font-style: italic;
  margin: var(--sp-6) 0;
}
.article__content pre {
  background: var(--c-surface);
  padding: var(--sp-5);
  overflow-x: auto;
  font-size: var(--t-sm);
  margin: var(--sp-5) 0;
}

.article__footer { margin-top: var(--sp-8); border-top: var(--bw) solid var(--c-border); padding-top: var(--sp-8); }