/* Pieces a few blog articles need that the shared article styles do not
   carry: an author byline in the hero, and a comparison table inside the
   numbered body sections.

   Kept out of inner.css on purpose: that file is linked by hundreds of
   pages and each would need its ?v= bumped. A new file only needs the
   pages that load it. */

/* Byline, under the hero lede. Set at label scale so it reads as
   attribution rather than as a second deck line. The hero is a dark band,
   so the colours are set against that rather than through --muted and
   --ink, which are mixed for the white body. */
.insight-hero .insight-byline{margin:22px 0 0;font-size:.875rem;letter-spacing:.02em;
  color:rgba(255,255,255,.62)}
.insight-hero .insight-byline strong{color:#fff;font-weight:700}

/* The hero graphic is a square artwork on its own dark gradient, shown
   whole by .hero-fit-whole. Repeating that gradient behind it makes the
   band read as one surface instead of artwork floating on flat black. */
.insight-hero-media.hero-fit-gradient{background:linear-gradient(#11233d,#081526)}

/* Comparison table. Mirrors .equipment-table in inner.css, minus its
   1080px min-width: four short columns do not need to force a scroll on
   a phone. */
.insight-table-wrap{overflow-x:auto;border:1px solid var(--line);background:#fff;margin:26px 0 0}
.insight-table{width:100%;min-width:340px;border-collapse:collapse;font-variant-numeric:tabular-nums}
.insight-table th{background:#242423;color:#fff;font-size:.8125rem;text-transform:uppercase;
  letter-spacing:.09em;text-align:left;padding:15px 18px}
.insight-table td{font-size:.875rem;line-height:1.5;padding:16px 18px;border-top:1px solid var(--line);
  vertical-align:top;color:var(--muted)}
.insight-table td:first-child{color:var(--ink);font-weight:700}
/* The row for our own system carries the comparison, so it is marked
   rather than left for the reader to find. */
.insight-table tr.is-finepart td{background:#faf8f3;color:var(--ink)}
.insight-table-note{margin:14px 0 0;font-size:.8125rem;line-height:1.6;color:var(--muted)}
.insight-table-note sup{font-weight:700}
