/** * Long-form content typography — CollabX 446. * Loaded by inc/content-typography.php on pages carrying body.dws-longform. * * WHY THIS EXISTS * Betheme writes its theme-option heading scale into * uploads/betheme/css/static.css as bare element selectors (`h2 { font-size:65px }`). * That scale is hero-first and not monotonic — measured at 1400px against 15px * body text: h1 48, h2 65, h3 30, h4 19, h5 17, h6 15. A normal sub-heading in * a text page therefore rendered at 65px/78px, bigger than h1. * * SPECIFICITY, NOT !important * static.css's `h2` is (0,0,1). `body.dws-longform #Content h2` is (0,2,2), so * it wins on specificity and still loses to anything genuinely more specific — * which matters because Betheme also emits page-local styles inline in * AFTER enqueued stylesheets, where equal specificity would lose on order. * (Same trap documented for the Barn2 price collision in css/product-options.css.) * * Scale below is a 1.25 ratio off the 15px body size, rounded: 15 / 19 / 23 / 29. */ body.dws-longform #Content h1, body.dws-longform #Content h2, body.dws-longform #Content h3, body.dws-longform #Content h4, body.dws-longform #Content h5, body.dws-longform #Content h6 { font-weight: 500; letter-spacing: 0; } body.dws-longform #Content h1 { font-size: 29px; line-height: 1.3; margin: 0 0 18px; } body.dws-longform #Content h2 { font-size: 23px; line-height: 1.35; /* Generous space above, tight below, so a heading binds to the text it owns. */ margin: 38px 0 10px; } body.dws-longform #Content h3 { font-size: 19px; line-height: 1.4; margin: 28px 0 8px; } body.dws-longform #Content h4, body.dws-longform #Content h5, body.dws-longform #Content h6 { font-size: 16px; line-height: 1.45; margin: 24px 0 8px; } /* First heading in the body shouldn't push the whole column down. */ body.dws-longform #Content .post-content > h2:first-child, body.dws-longform #Content .post-content > h3:first-child { margin-top: 0; } /* Body copy: measure and rhythm. Betheme's default 15px/1.65 is fine; these just stop lists from running flush against the paragraphs around them. */ body.dws-longform #Content ul, body.dws-longform #Content ol { margin: 0 0 18px; padding-left: 22px; } body.dws-longform #Content ul li, body.dws-longform #Content ol li { margin-bottom: 7px; line-height: 1.65; } /* Testimonials: 20 consecutive blockquotes need to read as separate cards, and Betheme's default quote styling is built for a single pull-quote. */ body.dws-longform #Content blockquote { margin: 0 0 20px; padding: 18px 22px; border-left: 3px solid rgba( 0, 0, 0, 0.12 ); background: rgba( 0, 0, 0, 0.02 ); font-size: 15px; font-style: normal; line-height: 1.65; } body.dws-longform #Content blockquote p { margin: 0 0 8px; font-size: inherit; line-height: inherit; } body.dws-longform #Content blockquote cite { display: block; font-size: 13px; font-style: normal; font-weight: 600; opacity: 0.75; } /* The [TO BE CONFIRMED] client-review markers — visible, not decorative. */ body.dws-longform #Content strong:only-child { line-height: 1.6; } @media only screen and ( max-width: 767px ) { body.dws-longform #Content h1 { font-size: 25px; } body.dws-longform #Content h2 { font-size: 21px; margin-top: 30px; } body.dws-longform #Content h3 { font-size: 18px; } }