/* ============================================================
   THOMAS MATTHEW TIMBER — content/article pages (SEO landing pages)
   ============================================================ */

.article { padding-top: 140px; padding-bottom: 5rem; }
.article .container { max-width: 760px; }
.article h1 { font-size: clamp(1.8rem, 4vw, 2.4rem); margin: 0.4rem 0 1rem; }
.article .lead { font-size: 1.1rem; color: var(--grey-700); font-weight: 300; line-height: 1.7; margin-bottom: 2rem; }
.article h2 { font-size: 1.3rem; margin: 2.4rem 0 0.7rem; }
.article p, .article li { color: var(--grey-700); font-weight: 300; line-height: 1.85; margin-bottom: 0.9rem; }
.article ul { padding-left: 1.25rem; }
.article li { margin-bottom: 0.4rem; }
.article a { color: var(--amber-dark); text-decoration: underline; }

.spec-table { width: 100%; border-collapse: collapse; margin: 1.25rem 0 1.75rem; font-size: 0.9rem; }
.spec-table td { padding: 0.55rem 0; border-bottom: 1px solid var(--grey-200); }
.spec-table td:first-child { color: var(--grey-500); width: 42%; }

.cta-box {
  background: var(--grey-100); border-left: 3px solid var(--amber);
  padding: 1.5rem 1.75rem; margin: 2.5rem 0;
}
.cta-box strong { display: block; margin-bottom: 0.35rem; color: var(--black); }
.cta-box p { margin-bottom: 1rem; }

.related { margin-top: 3rem; border-top: 1px solid var(--grey-200); padding-top: 1.5rem; }
.related-label { font-size: 0.75rem; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; color: var(--amber); margin-bottom: 0.75rem; }
.related a { display: inline-block; margin: 0 1.25rem 0.5rem 0; font-size: 0.9rem; }