/* ============================================
   DECILION — Viewpoint Article Overrides
   Layer on top of article.css for op-ed / perspective pieces
   Orange accent · Single-column · Author-forward
   ============================================ */

/* ── Reading Progress Bar — orange ── */
.reading-progress {
  background: linear-gradient(90deg, var(--orange), #e67e00);
}

/* ── Hero: "Viewpoint" label ── */
.article-hero__desk {
  font-size: var(--fs-caption);
  font-weight: 700;
  color: var(--orange);
  text-transform: uppercase;
  letter-spacing: 0.12em;
  margin-bottom: var(--sp-2);
}

/* ── Hero: accent rule — solid orange ── */
.article-hero__rule {
  background: var(--orange);
  width: 60px;
}

/* ── Hero: larger author avatar ── */
.article-hero__avatar {
  width: 52px;
  height: 52px;
  border: 2px solid rgba(247, 148, 29, 0.2);
}

/* ── Layout: single column, no TOC ── */
.article-layout {
  grid-template-columns: 1fr;
}
.toc-sidebar {
  display: none;
}
.article-body {
  margin: 0 auto;
}

/* ── Article Body: orange h2 accents ── */
.article-body h2 {
  border-top-color: var(--orange);
}

/* ── Takeaway boxes — orange accent ── */
.takeaway-box {
  background: rgba(247, 148, 29, 0.06);
  border-left-color: var(--orange);
}
.takeaway-box__heading,
.takeaway-box p.takeaway-box__heading {
  color: var(--orange);
}

/* ── Pull quotes — warm orange tint ── */
.pull-quote {
  border-left-color: var(--orange);
  background: rgba(247, 148, 29, 0.03);
}

/* ── Footnote superscripts — orange ── */
.article-body sup a {
  color: var(--orange);
}

/* ── More articles label ── */
.more-articles__series {
  color: var(--orange);
}

/* ── Responsive ── */
@media (max-width: 768px) {
  .article-hero__avatar {
    width: 44px;
    height: 44px;
  }
}