Hi @ashley_c, answering here as well so the solution sits in the right topic.
When some text turns white and some refuses to, it’s almost never a CSS problem; it’s a priority problem inside the editor. Text color can be set at three levels, and the most specific one wins:
- Site-wide: Styles > Colors, or Styles > Blocks > Heading / Paragraph.
- On a container: a Group, Columns or Column block with its own Text color.
- On the block itself: the Heading or Paragraph has its own Text color, or part of the text has an inline “Highlight” color (the A-with-a-bar button in the text toolbar).
Setting white on the Group (level 2) does nothing for a heading that has its own color (level 3), and nothing at all for a Highlight, which is applied to the words themselves. Patterns and imported starter content very often set colors at level 3, which is exactly the “I changed the parent, nothing happened” experience.
How to fix each one:
- Click directly on the text, e.g. “essential services”. The sidebar shows Heading or Paragraph. Open the Styles tab (half-moon icon) > Color > Text. If a swatch is set, that’s the override: click it and choose Clear, or pick white.
- If Text is empty but the words still don’t change, select the words themselves, open the toolbar’s “More” (⌄) > Highlight, and clear the color there. Highlighted text shows as a <mark> element.
- If the text is a link or a button, it’s controlled by Color > Link (or the Button block’s own colors), not by Text.
- The “READY TO TAKE THE NEXT STEP?” section directly above the footer: if you can’t select it while editing the page, it belongs to the template or the Footer template part, not to the page. Edit it in Appearance > Editor; the fix is the same once you’re in the right place.
CSS as a last resort, if you prefer: select the Group that contains the section, Advanced > Additional CSS class(es): white-text. Then in Appearance > Editor > Styles > (three dots) > Additional CSS:
.white-text,
.white-text :is(h1, h2, h3, h4, h5, h6, p, li, a, mark) {
color: #fff !important;
}
!important is needed only because the editor writes those block and highlight colors as inline styles, which beat any normal rule. Clearing them in the editor is the cleaner fix.
