Components

Article

The running-text body of a single blog post, with a checklist, a pull-quote, an inline CTA, and an author card.

Markup

<div class="article rv">
  <p>Every January the night line gets the same call…</p>
  <h2>What the $40 buys</h2>
  <p>Forty dollars buys about forty minutes:</p>
  <ul>
    <li>Heat exchanger inspected with a scope, not a flashlight</li>
    <li>Igniter resistance measured and logged against spec</li>
  </ul>
</div>

.article constrains its content to a comfortable reading measure and adds spacing between every direct child. Plain <p>/<h2>/<ul> elements inside it use the article's own type styles — no extra classes needed on ordinary running text.

Pull quote

.pull is a bordered-off blockquote used to break up long article text with a customer quote, matching the same blockquote/figcaption pattern as Reviews.

<figure class="pull">
  <blockquote>&ldquo;Forty-dollar October check, forty minutes.&rdquo;</blockquote>
  <figcaption><b>STAN P. &mdash; BELL CREEK</b> &middot; FURNACE TUNE-UP</figcaption>
</figure>

Inline CTA

.cta-inline pairs a cost chip with a tertiary link mid-article — a lightweight call to action that doesn't need a full section of its own.

Full-width feature image

Above the article body, .feature-full constrains a full-bleed 16:9 frame/stamp photo to the page's content width — the blog post's equivalent of Feature Band.

Author card

.author-card closes the article with the author's name, badge caption, and a short bio — the same name/badge pattern as a Team crew card, in a single-column layout.