/* Shared type scale for blog posts and comparison pages (staged 2026-10-23).
   Five sizes only. Page <style> blocks no longer set font-size on article content. */
:root{--t-title:clamp(30px,4.2vw,44px);--t-h2:24px;--t-lead:18px;--t-body:16px;--t-small:13px}

/* 1. title */
.post-title,.vs-title{font-size:var(--t-title)}
.vs-title em{font-size:inherit}

/* 2. section heading */
article h2,.vs-sub,.post-cta h3,.cta-inner h3,.stat-num{font-size:var(--t-h2)}

/* 3. lead (also the legend marks) */
.post-sub,.vs-hero .vs-lead,article h3,.pullquote,.mk,.vs-legend .mk{font-size:var(--t-lead)}

/* 4. body */
.post-hero,article,.vs-hero,.compare,.cta-band,
article p,article li,article td,article th,.reg-ref-t,.sig,.by-mark,
.compare .vs-lead,.vs-close,.compare-table,.compare-table td,.compare-table td.row-label,
.post-cta p,.cta-inner p{font-size:var(--t-body)}

/* 5. small: labels, captions, notes, sources, buttons */
.section-kicker,.vs-eyebrow,.by-name,.by-meta,figcaption,.post-figure figcaption,
.post-note,.post-note li,.post-sources li,.table-note,.post-tldr h2,.stat-txt,
.reg-ref-k,.reg-ref-m,.reg-ref-cta,.fig-label,
article thead th,.cmp thead th,.compare-table th,.q,.vs-legend,
.vs-update,.vs-note,.vs-foot,.cta-btn,.vs-link,sup,sub,small{font-size:var(--t-small)}
.section-kicker,.vs-eyebrow{letter-spacing:.14em}

/* Mobile (2026-10-23 review). Long source URLs wrap instead of widening the page. */
article p,article li,.post-note,.post-sources,.vs-foot,.vs-note{overflow-wrap:break-word}
/* Phones: 20px gutter (matches the nav) instead of 40px, so the text column is 335px, not 295px, at 375px. */
@media(max-width:640px){
.post-hero,article{padding-left:20px;padding-right:20px}
.post-hero+figure{padding-left:20px!important;padding-right:20px!important} /* hero figure carries an inline 40px padding */
.post-tldr{padding:16px}
.pullquote{padding:16px 18px}
.reg-ref{padding:14px;flex-direction:column;gap:6px}
.post-cta{padding:26px 22px}
.compare-table td.row-label{min-width:150px}
.vs-link{padding-top:11px;padding-bottom:11px}
.fig-label{max-width:calc(100% - 28px)}.fig-label[style*="top:"]{max-width:calc(50% - 20px);line-height:1.35} /* VIP hero: the two top HUD labels overlapped at 375px */
.cmp{min-width:0}.cmp td,.cmp th{padding:10px} /* 3-column tables fit, so the highlighted column is not off-screen */
}
