/*! * EEHP Pages — neutralise Elementor's kit styling inside ported content. * * The scoped stylesheets (tools/scope-css.php) handle anything the builds set * explicitly. They cannot handle what the builds INHERIT, or leave to the * browser's own defaults. Elementor's kit sets those same things directly on * the tag, and a directly-set value always beats an inherited one no matter how * specific the ancestor rule is. * * Every rule here has to sit in a band: ABOVE the kit, and BELOW whatever the * builds declare themselves. Specificity is written (id, class, element), and * note that `body` and the subject tag are BOTH element selectors — * `body.eehp-ported-page button` is (0,1,2), not (0,1,1). Getting that wrong is * what flattened the results pages' CTA buttons to zero padding on the first * attempt at the third block below. * * The reference points: * * .elementor-kit-165 h1 (0,1,1) * .elementor-kit-165 button (0,1,1) * .elementor-kit-165 input:not([type="button"])… (0,3,1) ← two :not() * body.eehp-ported-page .cta-main (scoped) (0,2,1) * body.eehp-ported-page .calc-qty input (scoped) (0,2,2) * body.eehp-ported-page.…×3 .calc-qty input (boosted) (0,4,2) * * This file is a declared dependency of every ported stylesheet, so WordPress * always prints it first and the builds win any tie. */ /* ------------------------------------------------------------------------- * 1. Typography inheritance — (0,1,2) * * The results builds declare the page font once on body and let headings * inherit it, so `.s-reveal h1` kept rendering the kit's Merriweather even * once its size and colour were correct. * * Font sizes are deliberately left alone: forcing those to inherit would * collapse headings the builds expect to keep the browser's default scale. * ---------------------------------------------------------------------- */ body.eehp-ported-page h1, body.eehp-ported-page h2, body.eehp-ported-page h3, body.eehp-ported-page h4, body.eehp-ported-page h5, body.eehp-ported-page h6, body.eehp-ported-page p, body.eehp-ported-page li, body.eehp-ported-page span, body.eehp-ported-page div, body.eehp-ported-page button, body.eehp-ported-page input, body.eehp-ported-page select, body.eehp-ported-page textarea, body.eehp-ported-page a { font-family: inherit; } body.eehp-ported-page a { color: inherit; } /* ------------------------------------------------------------------------- * 2. Control padding and button line-height — (0,1,2) * * The builds zero padding globally from their own reset: * * *, ::before, ::after { box-sizing: border-box; margin: 0; padding: 0 } * * Scoped that is (0,1,1), a tie with `.elementor-kit-165 button { padding: * 18px 46px }`, which loads later and wins — the savings calculator's per-row * delete control came out 30x30 against the source build's 24x24. * * One class, so this lands at (0,1,2): above the kit, and below every build * rule that pads a control on purpose (`.cta-main` at (0,2,1) keeps its * 16px 24px). A second class would read as (0,2,2) and beat those instead. * * Button line-height rides along here for the same reason. The builds set * it nowhere on a button: `body { line-height: 1.65 }` is a ratio, so each * control resolves it against its own font-size, giving .cta-main 26.4px * and .btn-ghost 23.1px. `.elementor-kit-165 button { line-height: 18px }` * replaced both, costing .s-main-cta 21px and .s-deepdive 6px. `inherit`, * not `normal`: `normal` is the browser's metric, not the build's ratio. * ---------------------------------------------------------------------- */ body.eehp-ported-page button, body.eehp-ported-page input, body.eehp-ported-page select, body.eehp-ported-page textarea { padding: 0; } body.eehp-ported-page button { line-height: inherit; } /* ------------------------------------------------------------------------- * 3. Form-control font and line-height — (0,4,2) * * Block 1 cannot reach the fields, because the kit styles them from * * .elementor-kit-165 input:not([type="button"]):not([type="submit"]) * { font-family: …; line-height: …; padding: 12px 15px } * * and a :not() contributes its argument's specificity, making that (0,3,1) * rather than the (0,1,1) the `h1` case suggests. Under the old single-class * prefix the builds' own `.calc-qty input` rules sat at (0,2,2) and lost: the * calculator rendered in the kit's Satoshi at 12px/15px padding, which took * each .calc-row from 95px to 153px and the section from 2259px to 3012px. * scope-css.php now prefixes form-control selectors three times, putting them * at (0,4,2) — a tie with this block, which loads first, so the builds win. * * line-height applies to fields only, NOT to