/* =========================================================
   ARTICLE TEMPLATE — only what Elements can't set (OE 2026-10-02)
   Banner size, padding, overlay, alignment and colours, and the article
   spacing, are set in Elements on the elements themselves.
   ========================================================= */

/* OE CSS: balanced line breaks in the banner heading — Elements has no text-wrap setting */
#article-hero-copy h1 { text-wrap: balance; }

/* OE CSS: hide the lead paragraph when a page or CMS item leaves it empty — Elements can't hide an empty field */
#article-hero-copy > p:empty { display: none; }

/* OE CSS: type inside the article body comes from CMS Markdown — Elements styles the Markdown block, not each tag inside it */
[id^="article-body"] { font-size: 1.125rem; line-height: 1.75; }
[id^="article-body"] > :first-child { margin-top: 0; }
[id^="article-body"] p, [id^="article-body"] li { font-size: inherit; line-height: inherit; }
[id^="article-body"] p { margin-bottom: 1.25rem; }
[id^="article-body"] h2 { font-size: clamp(1.65rem, 2.5vw, 2.25rem); line-height: 1.25; margin-top: 2rem; }
[id^="article-body"] h3 { font-size: 1.4rem; line-height: 1.3; }
[id^="article-body"] img { max-width: 100%; height: auto; border-radius: 0.5rem; }
[id^="article-body"] table { display: block; overflow-x: auto; }
@media (max-width: 639px) { [id^="article-body"] { font-size: 1rem; } }