/* ===================================================================== enhance.css - a typographer's refinement layer over the Instrument build. Loads last, so it wins the cascade. CSS only (CSP-safe: no scripts). Additive only: the Instrument layer already owns the motion language, the consent bar, nav underlines, row accents, folios and the hero title reveal, so none of that is repeated here. This file adds the typographic polish it did not: optical sizing, balanced headings, pretty body wrapping, hanging punctuation, and an editorial drop-cap that opens each long-form note. ===================================================================== */ /* --- optical sizing + steadier rendering ----------------------- */ html{-webkit-text-size-adjust:100%} body{font-optical-sizing:auto;text-rendering:optimizeLegibility} /* --- balanced headings ----------------------------------------- */ h1,h2,h3, .section-title,.entry-title,.dive-title,.article-title,.an-title, .skill-row-copy h3,.pillar-jump-title{ text-wrap:balance; } /* --- pretty paragraphs: no orphans, evener rag ----------------- */ p,.hero-sub,.section-sub,.dive-desc,.entry-body,.article-lede, .article-body p,.article-body li{ text-wrap:pretty; } /* --- long-form notes read like set type ------------------------ */ .article-body{hanging-punctuation:first allow-end last} /* An editorial drop-cap opens each long-form note. Scoped to LTR note articles only: notes ship
, the privacy page ships a
inside .article-page (so it is excluded), and Arabic notes set dir="rtl" on . */ html:not([dir="rtl"]) article.article-body>p:first-of-type::first-letter{ float:left; margin:.02em .12em 0 0; color:var(--cyan); font-family:var(--font-display); font-weight:400; font-size:3.2em; line-height:.72; } @media (max-width:560px){ html:not([dir="rtl"]) article.article-body>p:first-of-type::first-letter{ font-size:2.7em; } }