/* Article layout fix (Ben, 2026-09-18). Loaded LAST in so it beats inline page styles. */ /* Phones: text sat 40px in from each edge (24px page padding + 16px article padding). Now 16px. */ @media (max-width: 600px) { .article-page .container { padding-left: 16px; padding-right: 16px; } .article-page .article-body, .article-page .article-header { padding-left: 0; padding-right: 0; } } /* Tablets and phones in landscape / desktop-site mode (601-1023px): the header was capped at 700px and pinned LEFT while the body was centred, so the title sat off-centre, and both left wide empty gutters. Both now use the full width and centre together. */ @media (min-width: 601px) and (max-width: 1023px) { .article-page .article-body, .article-page .article-header { max-width: none; margin-left: auto; margin-right: auto; padding-left: 0; padding-right: 0; } div[style*="max-width:720px"], div[style*="max-width: 720px"] { max-width: none !important; } } /* Phones: 3-across "related articles" link grids (69 pages) squeezed each card to ~100px and pushed the last one off the screen. Stack them instead. */ @media (max-width: 600px) { div[style*="grid-template-columns:repeat(3,1fr)"], div[style*="grid-template-columns: repeat(3, 1fr)"] { grid-template-columns: 1fr !important; } }