(cherry-pick) Hotfix: Major: Deprecate .x-overlay-- classes

Affects Frontera and UTRC. Both are updated in this commit.

Cherry-picked from:
- 17d5174
- `task/GH-93-GH-142-GH-133-article-list-plugins-and-styles--no-reverts`

taccsite_cms/static/site_cms/css/src/_imports/tools/x-overlay.css

@@ -9,7 +9,7 @@ Colored boxes that appear atop a large image (like a banner).
 Styleguide Tools.ExtendsAndMixins.Overlay
 */
 
-.x-overlay--curtain {
+%x-overlay--curtain {
   --color-text: inherit;
   --color-bkgd-rgb: var(--global-color-primary--normal);
 
@@ -19,7 +19,7 @@ Styleguide Tools.ExtendsAndMixins.Overlay
   -webkit-backdrop-filter: blur(6px);
 }
 
-.x-overlay--callout {
+%x-overlay--callout {
   --color-text: inherit;
   --color-bkgd-rgb: var(--global-color-primary--normal);