Layout and Typography Broken | Builder vs. Front-End (Ethos Stack)

Hi Team,

I’m experiencing a significant layout and typography breakdown on my site https://casabonitabeach.com.

The Issue: The site looks perfect within the Cornerstone builder, but on the live front-end, the layout collapses, columns layouts are non-existant and typography becomes much larger. Additionally, Rows and Columns are losing their Flex/Grid properties, causing elements to stack vertically.

What I’ve already tried:

  • Cleared Style Cache via Cornerstone | Settings | System.
  • Cleared WP Rocket cache and tested in Incognito.
  • Deactivated all non-essential plugins (issue persists).
  • Toggled “Enable Font Manager” On/Off.
  • Re-saved Permalink structure and Theme Options.

Theme: Pro
Stack: Ethos

It appears the generated CSS for V2 elements isn’t being prioritized or loaded correctly on the front-end, allowing the legacy Ethos stack styles to take over. Could you please take a look and let me know if this is a known pathing issue or a breakdown in the CSS orchestration?

I will provide login credentials in a secure note.

Best, Michael

Hello Michael,

Thanks for writing in! Following a meticulous character-by-character audit of the site, I have identified a malformed RGBA color code in your implementation that is compromising the entire page.
image

You have inserted: rgba(0,0,0,0.5; in one of the Section background colors.

Check the page now.