Per Element Overrides

The Override Variables tab in the properties panel (the $ tab) sets a different
value for a variable on one element — and, because variables are CSS custom properties,
on everything inside it. This is how you re-theme a section: override "Brand Primary" on a
Container, and every element inside that container that uses the variable picks up the new
value, while the rest of the page keeps the global one.

1. Select the element and open the Override Variables tab.
2. Click Add Variable, choose which variable to override, and set the value.

Override values can also come from dynamic data — click the database icon next to the
value field to pull the value from a data source such as a custom field. Combined with the
cascade, this enables per-post theming: override a color variable on a template's outer
container with an ACF color field, and each post renders in its own color.

Overrides don't change the variable itself — the value in the
Variables panel is untouched, and every
element outside the one you overrode still uses it.