@royaloperahouse/harmonic 0.12.0-c → 0.12.1

package/dist/harmonic.cjs.development.js

@@ -59,113 +59,274 @@ function _objectWithoutPropertiesLoose(r, e) {
   }
   return t;
 }
-function _regenerator() {
-  /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/babel/babel/blob/main/packages/babel-helpers/LICENSE */
-  var e,
-    t,
-    r = "function" == typeof Symbol ? Symbol : {},
-    n = r.iterator || "@@iterator",
-    o = r.toStringTag || "@@toStringTag";
-  function i(r, n, o, i) {
-    var c = n && n.prototype instanceof Generator ? n : Generator,
-      u = Object.create(c.prototype);
-    return _regeneratorDefine(u, "_invoke", function (r, n, o) {
-      var i,
-        c,
-        u,
-        f = 0,
-        p = o || [],
-        y = !1,
-        G = {
-          p: 0,
-          n: 0,
-          v: e,
-          a: d,
-          f: d.bind(e, 4),
-          d: function (t, r) {
-            return i = t, c = 0, u = e, G.n = r, a;
-          }
-        };
-      function d(r, n) {
-        for (c = r, u = n, t = 0; !y && f && !o && t < p.length; t++) {
-          var o,
-            i = p[t],
-            d = G.p,
-            l = i[2];
-          r > 3 ? (o = l === n) && (u = i[(c = i[4]) ? 5 : (c = 3, 3)], i[4] = i[5] = e) : i[0] <= d && ((o = r < 2 && d < i[1]) ? (c = 0, G.v = n, G.n = i[1]) : d < l && (o = r < 3 || i[0] > n || n > l) && (i[4] = r, i[5] = n, G.n = l, c = 0));
+function _regeneratorRuntime() {
+  _regeneratorRuntime = function () {
+    return r;
+  };
+  var t,
+    r = {},
+    e = Object.prototype,
+    n = e.hasOwnProperty,
+    o = "function" == typeof Symbol ? Symbol : {},
+    i = o.iterator || "@@iterator",
+    a = o.asyncIterator || "@@asyncIterator",
+    u = o.toStringTag || "@@toStringTag";
+  function c(t, r, e, n) {
+    Object.defineProperty(t, r, {
+      value: e,
+      enumerable: !n,
+      configurable: !n,
+      writable: !n
+    });
+  }
+  try {
+    c({}, "");
+  } catch (t) {
+    c = function (t, r, e) {
+      return t[r] = e;
+    };
+  }
+  function h(r, e, n, o) {
+    var i = e && e.prototype instanceof Generator ? e : Generator,
+      a = Object.create(i.prototype);
+    return c(a, "_invoke", function (r, e, n) {
+      var o = 1;
+      return function (i, a) {
+        if (3 === o) throw Error("Generator is already running");
+        if (4 === o) {
+          if ("throw" === i) throw a;
+          return {
+            value: t,
+            done: !0
+          };
         }
-        if (o || r > 1) return a;
-        throw y = !0, n;
-      }
-      return function (o, p, l) {
-        if (f > 1) throw TypeError("Generator is already running");
-        for (y && 1 === p && d(p, l), c = p, u = l; (t = c < 2 ? e : u) || !y;) {
-          i || (c ? c < 3 ? (c > 1 && (G.n = -1), d(c, u)) : G.n = u : G.v = u);
-          try {
-            if (f = 2, i) {
-              if (c || (o = "next"), t = i[o]) {
-                if (!(t = t.call(i, u))) throw TypeError("iterator result is not an object");
-                if (!t.done) return t;
-                u = t.value, c < 2 && (c = 0);
-              } else 1 === c && (t = i.return) && t.call(i), c < 2 && (u = TypeError("The iterator does not provide a '" + o + "' method"), c = 1);
-              i = e;
-            } else if ((t = (y = G.n < 0) ? u : r.call(n, G)) !== a) break;
-          } catch (t) {
-            i = e, c = 1, u = t;
-          } finally {
-            f = 1;
+        for (n.method = i, n.arg = a;;) {
+          var u = n.delegate;
+          if (u) {
+            var c = d(u, n);
+            if (c) {
+              if (c === f) continue;
+              return c;
+            }
           }
+          if ("next" === n.method) n.sent = n._sent = n.arg;else if ("throw" === n.method) {
+            if (1 === o) throw o = 4, n.arg;
+            n.dispatchException(n.arg);
+          } else "return" === n.method && n.abrupt("return", n.arg);
+          o = 3;
+          var h = s(r, e, n);
+          if ("normal" === h.type) {
+            if (o = n.done ? 4 : 2, h.arg === f) continue;
+            return {
+              value: h.arg,
+              done: n.done
+            };
+          }
+          "throw" === h.type && (o = 4, n.method = "throw", n.arg = h.arg);
         }
-        return {
-          value: t,
-          done: y
-        };
       };
-    }(r, o, i), !0), u;
+    }(r, n, new Context(o || [])), !0), a;
   }
-  var a = {};
+  function s(t, r, e) {
+    try {
+      return {
+        type: "normal",
+        arg: t.call(r, e)
+      };
+    } catch (t) {
+      return {
+        type: "throw",
+        arg: t
+      };
+    }
+  }
+  r.wrap = h;
+  var f = {};
   function Generator() {}
   function GeneratorFunction() {}
   function GeneratorFunctionPrototype() {}
-  t = Object.getPrototypeOf;
-  var c = [][n] ? t(t([][n]())) : (_regeneratorDefine(t = {}, n, function () {
-      return this;
-    }), t),
-    u = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(c);
-  function f(e) {
-    return Object.setPrototypeOf ? Object.setPrototypeOf(e, GeneratorFunctionPrototype) : (e.__proto__ = GeneratorFunctionPrototype, _regeneratorDefine(e, o, "GeneratorFunction")), e.prototype = Object.create(u), e;
+  var l = {};
+  c(l, i, function () {
+    return this;
+  });
+  var p = Object.getPrototypeOf,
+    y = p && p(p(x([])));
+  y && y !== e && n.call(y, i) && (l = y);
+  var v = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(l);
+  function g(t) {
+    ["next", "throw", "return"].forEach(function (r) {
+      c(t, r, function (t) {
+        return this._invoke(r, t);
+      });
+    });
+  }
+  function AsyncIterator(t, r) {
+    function e(o, i, a, u) {
+      var c = s(t[o], t, i);
+      if ("throw" !== c.type) {
+        var h = c.arg,
+          f = h.value;
+        return f && "object" == typeof f && n.call(f, "__await") ? r.resolve(f.__await).then(function (t) {
+          e("next", t, a, u);
+        }, function (t) {
+          e("throw", t, a, u);
+        }) : r.resolve(f).then(function (t) {
+          h.value = t, a(h);
+        }, function (t) {
+          return e("throw", t, a, u);
+        });
+      }
+      u(c.arg);
+    }
+    var o;
+    c(this, "_invoke", function (t, n) {
+      function i() {
+        return new r(function (r, o) {
+          e(t, n, r, o);
+        });
+      }
+      return o = o ? o.then(i, i) : i();
+    }, !0);
+  }
+  function d(r, e) {
+    var n = e.method,
+      o = r.i[n];
+    if (o === t) return e.delegate = null, "throw" === n && r.i.return && (e.method = "return", e.arg = t, d(r, e), "throw" === e.method) || "return" !== n && (e.method = "throw", e.arg = new TypeError("The iterator does not provide a '" + n + "' method")), f;
+    var i = s(o, r.i, e.arg);
+    if ("throw" === i.type) return e.method = "throw", e.arg = i.arg, e.delegate = null, f;
+    var a = i.arg;
+    return a ? a.done ? (e[r.r] = a.value, e.next = r.n, "return" !== e.method && (e.method = "next", e.arg = t), e.delegate = null, f) : a : (e.method = "throw", e.arg = new TypeError("iterator result is not an object"), e.delegate = null, f);
+  }
+  function w(t) {
+    this.tryEntries.push(t);
+  }
+  function m(r) {
+    var e = r[4] || {};
+    e.type = "normal", e.arg = t, r[4] = e;
+  }
+  function Context(t) {
+    this.tryEntries = [[-1]], t.forEach(w, this), this.reset(!0);
   }
-  return GeneratorFunction.prototype = GeneratorFunctionPrototype, _regeneratorDefine(u, "constructor", GeneratorFunctionPrototype), _regeneratorDefine(GeneratorFunctionPrototype, "constructor", GeneratorFunction), GeneratorFunction.displayName = "GeneratorFunction", _regeneratorDefine(GeneratorFunctionPrototype, o, "GeneratorFunction"), _regeneratorDefine(u), _regeneratorDefine(u, o, "Generator"), _regeneratorDefine(u, n, function () {
+  function x(r) {
+    if (null != r) {
+      var e = r[i];
+      if (e) return e.call(r);
+      if ("function" == typeof r.next) return r;
+      if (!isNaN(r.length)) {
+        var o = -1,
+          a = function e() {
+            for (; ++o < r.length;) if (n.call(r, o)) return e.value = r[o], e.done = !1, e;
+            return e.value = t, e.done = !0, e;
+          };
+        return a.next = a;
+      }
+    }
+    throw new TypeError(typeof r + " is not iterable");
+  }
+  return GeneratorFunction.prototype = GeneratorFunctionPrototype, c(v, "constructor", GeneratorFunctionPrototype), c(GeneratorFunctionPrototype, "constructor", GeneratorFunction), c(GeneratorFunctionPrototype, u, GeneratorFunction.displayName = "GeneratorFunction"), r.isGeneratorFunction = function (t) {
+    var r = "function" == typeof t && t.constructor;
+    return !!r && (r === GeneratorFunction || "GeneratorFunction" === (r.displayName || r.name));
+  }, r.mark = function (t) {
+    return Object.setPrototypeOf ? Object.setPrototypeOf(t, GeneratorFunctionPrototype) : (t.__proto__ = GeneratorFunctionPrototype, c(t, u, "GeneratorFunction")), t.prototype = Object.create(v), t;
+  }, r.awrap = function (t) {
+    return {
+      __await: t
+    };
+  }, g(AsyncIterator.prototype), c(AsyncIterator.prototype, a, function () {
     return this;
-  }), _regeneratorDefine(u, "toString", function () {
+  }), r.AsyncIterator = AsyncIterator, r.async = function (t, e, n, o, i) {
+    void 0 === i && (i = Promise);
+    var a = new AsyncIterator(h(t, e, n, o), i);
+    return r.isGeneratorFunction(e) ? a : a.next().then(function (t) {
+      return t.done ? t.value : a.next();
+    });
+  }, g(v), c(v, u, "Generator"), c(v, i, function () {
+    return this;
+  }), c(v, "toString", function () {
     return "[object Generator]";
-  }), (_regenerator = function () {
-    return {
-      w: i,
-      m: f
+  }), r.keys = function (t) {
+    var r = Object(t),
+      e = [];
+    for (var n in r) e.unshift(n);
+    return function t() {
+      for (; e.length;) if ((n = e.pop()) in r) return t.value = n, t.done = !1, t;
+      return t.done = !0, t;
     };
-  })();
-}
-function _regeneratorDefine(e, r, n, t) {
-  var i = Object.defineProperty;
-  try {
-    i({}, "", {});
-  } catch (e) {
-    i = 0;
-  }
-  _regeneratorDefine = function (e, r, n, t) {
-    function o(r, n) {
-      _regeneratorDefine(e, r, function (e) {
-        return this._invoke(r, n, e);
-      });
-    }
-    r ? i ? i(e, r, {
-      value: n,
-      enumerable: !t,
-      configurable: !t,
-      writable: !t
-    }) : e[r] = n : (o("next", 0), o("throw", 1), o("return", 2));
-  }, _regeneratorDefine(e, r, n, t);
+  }, r.values = x, Context.prototype = {
+    constructor: Context,
+    reset: function (r) {
+      if (this.prev = this.next = 0, this.sent = this._sent = t, this.done = !1, this.delegate = null, this.method = "next", this.arg = t, this.tryEntries.forEach(m), !r) for (var e in this) "t" === e.charAt(0) && n.call(this, e) && !isNaN(+e.slice(1)) && (this[e] = t);
+    },
+    stop: function () {
+      this.done = !0;
+      var t = this.tryEntries[0][4];
+      if ("throw" === t.type) throw t.arg;
+      return this.rval;
+    },
+    dispatchException: function (r) {
+      if (this.done) throw r;
+      var e = this;
+      function n(t) {
+        a.type = "throw", a.arg = r, e.next = t;
+      }
+      for (var o = e.tryEntries.length - 1; o >= 0; --o) {
+        var i = this.tryEntries[o],
+          a = i[4],
+          u = this.prev,
+          c = i[1],
+          h = i[2];
+        if (-1 === i[0]) return n("end"), !1;
+        if (!c && !h) throw Error("try statement without catch or finally");
+        if (null != i[0] && i[0] <= u) {
+          if (u < c) return this.method = "next", this.arg = t, n(c), !0;
+          if (u < h) return n(h), !1;
+        }
+      }
+    },
+    abrupt: function (t, r) {
+      for (var e = this.tryEntries.length - 1; e >= 0; --e) {
+        var n = this.tryEntries[e];
+        if (n[0] > -1 && n[0] <= this.prev && this.prev < n[2]) {
+          var o = n;
+          break;
+        }
+      }
+      o && ("break" === t || "continue" === t) && o[0] <= r && r <= o[2] && (o = null);
+      var i = o ? o[4] : {};
+      return i.type = t, i.arg = r, o ? (this.method = "next", this.next = o[2], f) : this.complete(i);
+    },
+    complete: function (t, r) {
+      if ("throw" === t.type) throw t.arg;
+      return "break" === t.type || "continue" === t.type ? this.next = t.arg : "return" === t.type ? (this.rval = this.arg = t.arg, this.method = "return", this.next = "end") : "normal" === t.type && r && (this.next = r), f;
+    },
+    finish: function (t) {
+      for (var r = this.tryEntries.length - 1; r >= 0; --r) {
+        var e = this.tryEntries[r];
+        if (e[2] === t) return this.complete(e[4], e[3]), m(e), f;
+      }
+    },
+    catch: function (t) {
+      for (var r = this.tryEntries.length - 1; r >= 0; --r) {
+        var e = this.tryEntries[r];
+        if (e[0] === t) {
+          var n = e[4];
+          if ("throw" === n.type) {
+            var o = n.arg;
+            m(e);
+          }
+          return o;
+        }
+      }
+      throw Error("illegal catch attempt");
+    },
+    delegateYield: function (r, e, n) {
+      return this.delegate = {
+        i: x(r),
+        r: e,
+        n: n
+      }, "next" === this.method && (this.arg = t), f;
+    }
+  }, r;
 }
 function _taggedTemplateLiteralLoose(e, t) {
   return t || (t = e.slice(0)), e.raw = t, e;
@@ -203,9 +364,9 @@ var createClassNames = function createClassNames(baseClass, options, styles) {
   return classes.filter(Boolean).join(' ');
 };
 
-var typographyStyles = {"display":"typography-module_display__ZHsz9","header":"typography-module_header__FVsLI","subtitle":"typography-module_subtitle__x3sSn","bodycopy":"typography-module_bodycopy__-BY2U","overline":"typography-module_overline__y1yCC","buttontext":"typography-module_buttontext__Gp0W-","captiontext":"typography-module_captiontext__zyA--","navigationtext":"typography-module_navigationtext__Qj6Zw","display--large":"typography-module_display--large__RwPQD","display--small":"typography-module_display--small__XWUSJ","header--large":"typography-module_header--large__2vP3p","header--medium":"typography-module_header--medium__OgzlB","header--small":"typography-module_header--small__zLuFf","subtitle--large":"typography-module_subtitle--large__1Ep9J","subtitle--small":"typography-module_subtitle--small__Vt9bZ","bodycopy--large":"typography-module_bodycopy--large__BNzf2","bodycopy--medium":"typography-module_bodycopy--medium__cwJEu","bodycopy--small":"typography-module_bodycopy--small__fTLSM","overline--large":"typography-module_overline--large__79WUM","overline--small":"typography-module_overline--small__MGEG6","display--primary":"typography-module_display--primary__9sTwU","header--primary":"typography-module_header--primary__KF0PJ","subtitle--primary":"typography-module_subtitle--primary__yL-hS","bodycopy--primary":"typography-module_bodycopy--primary__5Uo2D","overline--primary":"typography-module_overline--primary__a2NSa","buttontext--primary":"typography-module_buttontext--primary__HnmE3","captiontext--primary":"typography-module_captiontext--primary__mmafI","navigationtext--primary":"typography-module_navigationtext--primary__vIsUl","display--black":"typography-module_display--black__8hmsx","header--black":"typography-module_header--black__M3I14","subtitle--black":"typography-module_subtitle--black__IQRSo","bodycopy--black":"typography-module_bodycopy--black__J8BNP","overline--black":"typography-module_overline--black__RUDoj","buttontext--black":"typography-module_buttontext--black__irjmz","captiontext--black":"typography-module_captiontext--black__7axhP","navigationtext--black":"typography-module_navigationtext--black__wDz-G","display--white":"typography-module_display--white__3QA6W","header--white":"typography-module_header--white__mm-ex","subtitle--white":"typography-module_subtitle--white__VzQ3K","bodycopy--white":"typography-module_bodycopy--white__NJ8J8","overline--white":"typography-module_overline--white__cV5QV","buttontext--white":"typography-module_buttontext--white__rrr8U","captiontext--white":"typography-module_captiontext--white__OMFwW","navigationtext--white":"typography-module_navigationtext--white__5YDdY","display--red":"typography-module_display--red__khdLJ","header--red":"typography-module_header--red__hxuj9","subtitle--red":"typography-module_subtitle--red__gSK7d","bodycopy--red":"typography-module_bodycopy--red__P5Mau","overline--red":"typography-module_overline--red__OW5dE","buttontext--red":"typography-module_buttontext--red__mlRi2","captiontext--red":"typography-module_captiontext--red__jMQIK","navigationtext--red":"typography-module_navigationtext--red__-QADV","display--grey":"typography-module_display--grey__RsgTf","header--grey":"typography-module_header--grey__rC0vN","subtitle--grey":"typography-module_subtitle--grey__1nkEx","bodycopy--grey":"typography-module_bodycopy--grey__SNnaU","overline--grey":"typography-module_overline--grey__lGOsK","buttontext--grey":"typography-module_buttontext--grey__1Y4oX","captiontext--grey":"typography-module_captiontext--grey__V0MLc","navigationtext--grey":"typography-module_navigationtext--grey__xi3sz","display--inherit":"typography-module_display--inherit__ZNOHM","header--inherit":"typography-module_header--inherit__qmHQE","subtitle--inherit":"typography-module_subtitle--inherit__mly-X","bodycopy--inherit":"typography-module_bodycopy--inherit__CoC-f","overline--inherit":"typography-module_overline--inherit__Cq4ni","buttontext--inherit":"typography-module_buttontext--inherit__vguWx","captiontext--inherit":"typography-module_captiontext--inherit__ya6gm","navigationtext--inherit":"typography-module_navigationtext--inherit__cJLWf","display--serif":"typography-module_display--serif__C0-Ve","header--serif":"typography-module_header--serif__uTGCc","display--em":"typography-module_display--em__h2bPV","header--em":"typography-module_header--em__UFQIA","display--bold":"typography-module_display--bold__PG-8g","header--bold":"typography-module_header--bold__InvJk","subtitle--bold":"typography-module_subtitle--bold__Subov","bodycopy--bold":"typography-module_bodycopy--bold__nZX3C","overline--bold":"typography-module_overline--bold__3mUXy","buttontext--bold":"typography-module_buttontext--bold__rBKIJ","captiontext--bold":"typography-module_captiontext--bold__ebTyV","navigationtext--bold":"typography-module_navigationtext--bold__SRlV2"};
+var styles = {"display":"typography-module_display__ZHsz9","header":"typography-module_header__FVsLI","subtitle":"typography-module_subtitle__x3sSn","bodycopy":"typography-module_bodycopy__-BY2U","overline":"typography-module_overline__y1yCC","buttontext":"typography-module_buttontext__Gp0W-","captiontext":"typography-module_captiontext__zyA--","navigationtext":"typography-module_navigationtext__Qj6Zw","display--large":"typography-module_display--large__RwPQD","display--small":"typography-module_display--small__XWUSJ","header--large":"typography-module_header--large__2vP3p","header--medium":"typography-module_header--medium__OgzlB","header--small":"typography-module_header--small__zLuFf","subtitle--large":"typography-module_subtitle--large__1Ep9J","subtitle--small":"typography-module_subtitle--small__Vt9bZ","bodycopy--large":"typography-module_bodycopy--large__BNzf2","bodycopy--medium":"typography-module_bodycopy--medium__cwJEu","bodycopy--small":"typography-module_bodycopy--small__fTLSM","overline--large":"typography-module_overline--large__79WUM","overline--small":"typography-module_overline--small__MGEG6","display--primary":"typography-module_display--primary__9sTwU","header--primary":"typography-module_header--primary__KF0PJ","subtitle--primary":"typography-module_subtitle--primary__yL-hS","bodycopy--primary":"typography-module_bodycopy--primary__5Uo2D","overline--primary":"typography-module_overline--primary__a2NSa","buttontext--primary":"typography-module_buttontext--primary__HnmE3","captiontext--primary":"typography-module_captiontext--primary__mmafI","navigationtext--primary":"typography-module_navigationtext--primary__vIsUl","display--black":"typography-module_display--black__8hmsx","header--black":"typography-module_header--black__M3I14","subtitle--black":"typography-module_subtitle--black__IQRSo","bodycopy--black":"typography-module_bodycopy--black__J8BNP","overline--black":"typography-module_overline--black__RUDoj","buttontext--black":"typography-module_buttontext--black__irjmz","captiontext--black":"typography-module_captiontext--black__7axhP","navigationtext--black":"typography-module_navigationtext--black__wDz-G","display--white":"typography-module_display--white__3QA6W","header--white":"typography-module_header--white__mm-ex","subtitle--white":"typography-module_subtitle--white__VzQ3K","bodycopy--white":"typography-module_bodycopy--white__NJ8J8","overline--white":"typography-module_overline--white__cV5QV","buttontext--white":"typography-module_buttontext--white__rrr8U","captiontext--white":"typography-module_captiontext--white__OMFwW","navigationtext--white":"typography-module_navigationtext--white__5YDdY","display--red":"typography-module_display--red__khdLJ","header--red":"typography-module_header--red__hxuj9","subtitle--red":"typography-module_subtitle--red__gSK7d","bodycopy--red":"typography-module_bodycopy--red__P5Mau","overline--red":"typography-module_overline--red__OW5dE","buttontext--red":"typography-module_buttontext--red__mlRi2","captiontext--red":"typography-module_captiontext--red__jMQIK","navigationtext--red":"typography-module_navigationtext--red__-QADV","display--grey":"typography-module_display--grey__RsgTf","header--grey":"typography-module_header--grey__rC0vN","subtitle--grey":"typography-module_subtitle--grey__1nkEx","bodycopy--grey":"typography-module_bodycopy--grey__SNnaU","overline--grey":"typography-module_overline--grey__lGOsK","buttontext--grey":"typography-module_buttontext--grey__1Y4oX","captiontext--grey":"typography-module_captiontext--grey__V0MLc","navigationtext--grey":"typography-module_navigationtext--grey__xi3sz","display--inherit":"typography-module_display--inherit__ZNOHM","header--inherit":"typography-module_header--inherit__qmHQE","subtitle--inherit":"typography-module_subtitle--inherit__mly-X","bodycopy--inherit":"typography-module_bodycopy--inherit__CoC-f","overline--inherit":"typography-module_overline--inherit__Cq4ni","buttontext--inherit":"typography-module_buttontext--inherit__vguWx","captiontext--inherit":"typography-module_captiontext--inherit__ya6gm","navigationtext--inherit":"typography-module_navigationtext--inherit__cJLWf","display--serif":"typography-module_display--serif__C0-Ve","header--serif":"typography-module_header--serif__uTGCc","display--em":"typography-module_display--em__h2bPV","header--em":"typography-module_header--em__UFQIA","display--bold":"typography-module_display--bold__PG-8g","header--bold":"typography-module_header--bold__InvJk","subtitle--bold":"typography-module_subtitle--bold__Subov","bodycopy--bold":"typography-module_bodycopy--bold__nZX3C","overline--bold":"typography-module_overline--bold__3mUXy","buttontext--bold":"typography-module_buttontext--bold__rBKIJ","captiontext--bold":"typography-module_captiontext--bold__ebTyV","navigationtext--bold":"typography-module_navigationtext--bold__SRlV2"};
 
-var _excluded = ["children", "size", "color", "className", "bold", "tag"],
+var _excluded = ["children", "size", "color", "className", "bold"],
   _excluded2 = ["children", "size", "color", "className"];
 /* ~~~ Headers - size and hierarchy set separately ~~~ */
 var HarmonicHeader = function HarmonicHeader(_ref2) {
@@ -223,7 +384,7 @@ var HarmonicHeader = function HarmonicHeader(_ref2) {
     serif: serif,
     em: em,
     className: className
-  }, typographyStyles);
+  }, styles);
   return /*#__PURE__*/React__default.createElement(Tag, {
     className: classNames
   }, children);
@@ -231,24 +392,21 @@ var HarmonicHeader = function HarmonicHeader(_ref2) {
 /* ~~~ Subtitle - (use case) ~~~ */
 var HarmonicSubtitle = function HarmonicSubtitle(_ref3) {
   var children = _ref3.children,
-    _ref3$size = _ref3.size,
-    size = _ref3$size === void 0 ? 'large' : _ref3$size,
+    size = _ref3.size,
     _ref3$color = _ref3.color,
     color = _ref3$color === void 0 ? 'inherit' : _ref3$color,
-    className = _ref3.className,
-    _ref3$tag = _ref3.tag,
-    Tag = _ref3$tag === void 0 ? 'p' : _ref3$tag;
+    className = _ref3.className;
   var classNames = createClassNames('subtitle', {
     size: size,
     color: color,
     className: className
-  }, typographyStyles);
-  return /*#__PURE__*/React__default.createElement(Tag, {
+  }, styles);
+  return /*#__PURE__*/React__default.createElement("p", {
     className: classNames
   }, children);
 };
 /* ~~~ Body Copy Text - (use case) ~~~ */
-var BodyCopyHarmonic = /*#__PURE__*/React__default.forwardRef(function (_ref4, ref) {
+var BodyCopyHarmonic = function BodyCopyHarmonic(_ref4) {
   var children = _ref4.children,
     _ref4$size = _ref4.size,
     size = _ref4$size === void 0 ? 'medium' : _ref4$size,
@@ -256,21 +414,17 @@ var BodyCopyHarmonic = /*#__PURE__*/React__default.forwardRef(function (_ref4, r
     color = _ref4$color === void 0 ? 'inherit' : _ref4$color,
     className = _ref4.className,
     bold = _ref4.bold,
-    _ref4$tag = _ref4.tag,
-    Tag = _ref4$tag === void 0 ? 'p' : _ref4$tag,
     props = _objectWithoutPropertiesLoose(_ref4, _excluded);
   var classNames = createClassNames('bodycopy', {
     size: size,
     color: color,
     bold: bold,
     className: className
-  }, typographyStyles);
-  return /*#__PURE__*/React__default.createElement(Tag, Object.assign({
-    className: classNames,
-    ref: ref
+  }, styles);
+  return /*#__PURE__*/React__default.createElement("p", Object.assign({
+    className: classNames
   }, props), children);
-});
-BodyCopyHarmonic.displayName = 'BodyCopyHarmonic';
+};
 /* ~~~ Overline - (use case) ~~~ */
 var HarmonicOverline = function HarmonicOverline(_ref5) {
   var children = _ref5.children,
@@ -283,7 +437,7 @@ var HarmonicOverline = function HarmonicOverline(_ref5) {
     size: size,
     color: color,
     className: className
-  }, typographyStyles);
+  }, styles);
   return /*#__PURE__*/React__default.createElement("p", Object.assign({
     className: classNames
   }, props), children);
@@ -297,7 +451,7 @@ var ButtonText = function ButtonText(_ref6) {
   var classNames = createClassNames('buttontext', {
     color: color,
     className: className
-  }, typographyStyles);
+  }, styles);
   return /*#__PURE__*/React__default.createElement("span", {
     className: classNames
   }, children);
@@ -306,14 +460,12 @@ var Caption = function Caption(_ref7) {
   var children = _ref7.children,
     _ref7$color = _ref7.color,
     color = _ref7$color === void 0 ? 'inherit' : _ref7$color,
-    _ref7$tag = _ref7.tag,
-    Tag = _ref7$tag === void 0 ? 'p' : _ref7$tag,
     className = _ref7.className;
   var classNames = createClassNames('captiontext', {
     color: color,
     className: className
-  }, typographyStyles);
-  return /*#__PURE__*/React__default.createElement(Tag, {
+  }, styles);
+  return /*#__PURE__*/React__default.createElement("p", {
     className: classNames
   }, children);
 };
@@ -321,14 +473,12 @@ var NavigationText = function NavigationText(_ref8) {
   var children = _ref8.children,
     _ref8$color = _ref8.color,
     color = _ref8$color === void 0 ? 'inherit' : _ref8$color,
-    _ref8$tag = _ref8.tag,
-    Tag = _ref8$tag === void 0 ? 'p' : _ref8$tag,
     className = _ref8.className;
   var classNames = createClassNames('navigationtext', {
     color: color,
     className: className
-  }, typographyStyles);
-  return /*#__PURE__*/React__default.createElement(Tag, {
+  }, styles);
+  return /*#__PURE__*/React__default.createElement("p", {
     className: classNames
   }, children);
 };
@@ -2679,48 +2829,70 @@ var COLORS$1 = {
   hover: 'var(--button-secondary-hover-color)',
   pressed: 'var(--button-secondary-pressed-color)'
 };
+var isObjectWithKey = function isObjectWithKey(object, key) {
+  return typeof object === 'object' && object !== null && key in object;
+};
+var hasSecondaryButtonColor = function hasSecondaryButtonColor(theme) {
+  return isObjectWithKey(theme, 'colors') && isObjectWithKey(theme.colors, 'secondaryButton') && typeof theme.colors.secondaryButton === 'string';
+};
 var getTextColor$1 = function getTextColor(_ref) {
   var disabled = _ref.disabled,
-    textColor = _ref.textColor;
+    textColor = _ref.textColor,
+    theme = _ref.theme;
   if (disabled) {
     return COLORS$1.darkGrey;
   }
   if (textColor) {
     return "var(--color-" + textColor + ")";
   }
+  if (hasSecondaryButtonColor(theme)) {
+    return theme.colors.secondaryButton;
+  }
   return COLORS$1["default"];
 };
 var getBorderColor = function getBorderColor(_ref2) {
   var disabled = _ref2.disabled,
-    borderColor = _ref2.borderColor;
+    borderColor = _ref2.borderColor,
+    theme = _ref2.theme;
   if (disabled) {
     return COLORS$1.disabled;
   }
   if (borderColor) {
     return "var(--color-" + borderColor + ")";
   }
+  if (hasSecondaryButtonColor(theme)) {
+    return theme.colors.secondaryButton;
+  }
   return COLORS$1.border;
 };
 var getHoveredColor$1 = function getHoveredColor(_ref3) {
   var disabled = _ref3.disabled,
-    hoveredColor = _ref3.hoveredColor;
+    hoveredColor = _ref3.hoveredColor,
+    theme = _ref3.theme;
   if (disabled) {
     return COLORS$1.disabled;
   }
   if (hoveredColor) {
     return "var(--color-" + hoveredColor + ")";
   }
+  if (hasSecondaryButtonColor(theme)) {
+    return theme.colors.secondaryButton;
+  }
   return COLORS$1.hover;
 };
 var getPressedColor$1 = function getPressedColor(_ref4) {
   var disabled = _ref4.disabled,
-    pressedColor = _ref4.pressedColor;
+    pressedColor = _ref4.pressedColor,
+    theme = _ref4.theme;
   if (disabled) {
     return COLORS$1.disabled;
   }
   if (pressedColor) {
     return "var(--color-" + pressedColor + ")";
   }
+  if (hasSecondaryButtonColor(theme)) {
+    return theme.colors.secondaryButton;
+  }
   return COLORS$1.pressed;
 };
 
@@ -3431,12 +3603,10 @@ var Radio2Component = function Radio2Component(_ref, ref) {
 };
 var Radio2 = /*#__PURE__*/React.forwardRef(Radio2Component);
 
-var _templateObject$f, _templateObject2$9, _templateObject3$5, _templateObject4$3, _templateObject5$2;
+var _templateObject$f, _templateObject2$9, _templateObject3$5;
 var ButtonsContainer = /*#__PURE__*/styled__default.div(_templateObject$f || (_templateObject$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: row;\n  justify-content: flex-start;\n  align-items: center;\n"])));
-var BaseIconWrapper = /*#__PURE__*/styled__default.div(_templateObject2$9 || (_templateObject2$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  justify-content: center;\n  display: flex;\n  align-items: center;\n  width: var(--rotator-button-width);\n  height: var(--rotator-button-width);\n\n  svg {\n    width: var(--rotator-button-icon-width);\n    height: var(--rotator-button-icon-width);\n  }\n"])));
-var IconWrapper$1 = /*#__PURE__*/styled__default(BaseIconWrapper)(_templateObject3$5 || (_templateObject3$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  background-color: var(--rotator-button-bg-color);\n  color: var(--rotator-button-color);\n\n  svg path {\n    fill: var(--rotator-button-color);\n  }\n\n  :hover {\n    cursor: pointer;\n    background-color: var(--rotator-button-hover-bg-color);\n\n    && svg path {\n      fill: var(--rotator-button-hover-color);\n    }\n  }\n"])));
-var IconUnavailableWrapper = /*#__PURE__*/styled__default(BaseIconWrapper)(_templateObject4$3 || (_templateObject4$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  background-color: var(--color-state-disabled);\n  color: var(--color-primary-black);\n  opacity: 0.2;\n\n  svg path {\n    fill: var(--color-primary-black);\n  }\n\n  @media ", " {\n    pointer-events: none;\n  }\n"])), devices.mobile);
-var FullscreenIconWrapper = /*#__PURE__*/styled__default(IconWrapper$1)(_templateObject5$2 || (_templateObject5$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin-left: 20px;\n\n  @media ", " {\n    display: none;\n    pointer-events: none;\n  }\n"])), devices.mobileAndTablet);
+var IconWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject2$9 || (_templateObject2$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  justify-content: center;\n  display: flex;\n  align-items: center;\n  width: var(--rotator-button-width);\n  height: var(--rotator-button-width);\n  background-color: var(--rotator-button-bg-color);\n  color: var(--rotator-button-color);\n\n  svg {\n    width: var(--rotator-button-icon-width);\n    height: var(--rotator-button-icon-width);\n  }\n\n  svg path {\n    fill: var(--rotator-button-color);\n  }\n\n  :hover {\n    cursor: pointer;\n    background-color: var(--rotator-button-hover-bg-color);\n\n    && svg path {\n      fill: var(--rotator-button-hover-color);\n    }\n  }\n"])));
+var IconUnavailableWrapper = /*#__PURE__*/styled__default.div(_templateObject3$5 || (_templateObject3$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  justify-content: center;\n  display: flex;\n  align-items: center;\n  width: var(--rotator-button-width);\n  height: var(--rotator-button-width);\n  background-color: var(--color-state-disabled);\n  color: var(--color-primary-black);\n  opacity: 0.2;\n\n  svg {\n    width: var(--rotator-button-icon-width);\n    height: var(--rotator-button-icon-width);\n  }\n\n  svg path {\n    fill: var(--color-primary-black);\n  }\n\n  @media ", " {\n    pointer-events: none;\n  }\n"])), devices.mobile);
 
 var RotatorButtons = function RotatorButtons(_ref) {
   var onClickPrev = _ref.onClickPrev,
@@ -3445,11 +3615,6 @@ var RotatorButtons = function RotatorButtons(_ref) {
     availablePrev = _ref$availablePrev === void 0 ? true : _ref$availablePrev,
     _ref$availableNext = _ref.availableNext,
     availableNext = _ref$availableNext === void 0 ? true : _ref$availableNext,
-    _ref$showFullscreen = _ref.showFullscreen,
-    showFullscreen = _ref$showFullscreen === void 0 ? false : _ref$showFullscreen,
-    onClickFullscreen = _ref.onClickFullscreen,
-    _ref$isFullscreen = _ref.isFullscreen,
-    isFullscreen = _ref$isFullscreen === void 0 ? false : _ref$isFullscreen,
     className = _ref.className;
   var onClickLeftHandler = function onClickLeftHandler() {
     if (onClickPrev) {
@@ -3471,11 +3636,6 @@ var RotatorButtons = function RotatorButtons(_ref) {
       onClickRightHandler();
     }
   };
-  var onClickFullscreenHandler = function onClickFullscreenHandler() {
-    if (onClickFullscreen) {
-      onClickFullscreen();
-    }
-  };
   var renderPrevIcon = function renderPrevIcon() {
     return /*#__PURE__*/React__default.createElement(Icon, {
       iconName: "CarouselArrow",
@@ -3487,13 +3647,6 @@ var RotatorButtons = function RotatorButtons(_ref) {
       iconName: "CarouselArrow"
     });
   };
-  var renderFullscreenIcon = function renderFullscreenIcon() {
-    return isFullscreen ? /*#__PURE__*/React__default.createElement(Icon, {
-      iconName: "Minimise"
-    }) : /*#__PURE__*/React__default.createElement(Icon, {
-      iconName: "FullScreen"
-    });
-  };
   return /*#__PURE__*/React__default.createElement(ButtonsContainer, {
     className: className
   }, availablePrev ? (/*#__PURE__*/React__default.createElement(IconWrapper$1, {
@@ -3516,14 +3669,7 @@ var RotatorButtons = function RotatorButtons(_ref) {
     role: "button"
   }, renderNextIcon())) : (/*#__PURE__*/React__default.createElement(IconUnavailableWrapper, {
     "data-testid": "iconnextnoavailable"
-  }, renderNextIcon())), showFullscreen && (/*#__PURE__*/React__default.createElement(FullscreenIconWrapper, {
-    onClick: onClickFullscreenHandler,
-    tabIndex: 0,
-    "data-testid": "iconfullscreen",
-    className: "carousel-icon-wrapper-fullscreen",
-    "aria-label": isFullscreen ? 'Exit fullscreen' : 'Open fullscreen',
-    role: "button"
-  }, renderFullscreenIcon())));
+  }, renderNextIcon())));
 };
 
 var _templateObject$g;
@@ -3554,15 +3700,12 @@ var SecondaryLogo = function SecondaryLogo(_ref) {
 
 var _templateObject$h, _templateObject2$a;
 var SectionSplitterContainer = /*#__PURE__*/styled__default(Grid)(_templateObject$h || (_templateObject$h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  height: 4px;\n"])));
-var Splitter = /*#__PURE__*/styled__default.div(_templateObject2$a || (_templateObject2$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  width: 100%;\n  height: 4px;\n  background: var(--color-base-light-grey);\n"])));
+var Splitter = /*#__PURE__*/styled__default.div(_templateObject2$a || (_templateObject2$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  width: 100%;\n  height: 4px;\n  background: var(--base-color-light-grey);\n"])));
 
 var SectionSplitter = function SectionSplitter(_ref) {
   var _ref$fullWidth = _ref.fullWidth,
-    fullWidth = _ref$fullWidth === void 0 ? true : _ref$fullWidth,
-    className = _ref.className;
-  return /*#__PURE__*/React__default.createElement(SectionSplitterContainer, {
-    className: className
-  }, fullWidth ? (/*#__PURE__*/React__default.createElement(GridItem, {
+    fullWidth = _ref$fullWidth === void 0 ? true : _ref$fullWidth;
+  return /*#__PURE__*/React__default.createElement(SectionSplitterContainer, null, fullWidth ? (/*#__PURE__*/React__default.createElement(GridItem, {
     columnStartDesktop: 1,
     columnSpanDesktop: 16,
     columnStartDevice: 1,
@@ -3603,11 +3746,11 @@ var SponsorLogo = function SponsorLogo(_ref) {
   }) : children));
 };
 
-var _templateObject$j, _templateObject2$b, _templateObject3$6, _templateObject4$4;
+var _templateObject$j, _templateObject2$b, _templateObject3$6, _templateObject4$3;
 var SponsorshipWrapper = /*#__PURE__*/styled__default.div(_templateObject$j || (_templateObject$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  width: 80px;\n  height: 80px;\n  position: relative;\n\n  @media ", " {\n    width: 40px;\n    height: 40px;\n  }\n"])), devices.mobileAndTablet);
 var SponsorshipLinkText = /*#__PURE__*/styled__default.span(_templateObject2$b || (_templateObject2$b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: absolute;\n  width: 1px;\n  height: 1px;\n  padding: 0;\n  margin: -1px;\n  overflow: hidden;\n  clip: rect(0, 0, 0, 0);\n  whitespace: nowrap;\n  borderwidth: 0;\n"])));
 var SponsorshipLink = /*#__PURE__*/styled__default.a(_templateObject3$6 || (_templateObject3$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: absolute;\n  inset: 0;\n  width: 80px;\n  height: 80px;\n  z-index: 2;\n  text-decoration: none;\n  background: transparent;\n\n  @media ", " {\n    width: 40px;\n    height: 40px;\n  }\n"])), devices.mobileAndTablet);
-var SponsorshipStyledIframe = /*#__PURE__*/styled__default.iframe(_templateObject4$4 || (_templateObject4$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  border: none;\n  display: block;\n  width: 80px;\n  height: 80px;\n  position: absolute;\n  top: 0;\n  left: 0;\n  z-index: 1;\n\n  @media ", " {\n    transform: scale(0.5);\n    transform-origin: top left;\n  }\n"])), devices.mobileAndTablet);
+var SponsorshipStyledIframe = /*#__PURE__*/styled__default.iframe(_templateObject4$3 || (_templateObject4$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  border: none;\n  display: block;\n  width: 80px;\n  height: 80px;\n  position: absolute;\n  top: 0;\n  left: 0;\n  z-index: 1;\n\n  @media ", " {\n    transform: scale(0.5);\n    transform-origin: top left;\n  }\n"])), devices.mobileAndTablet);
 
 var DEFAULT_SPONSORSHIP_IFRAME = 'https://static.roh.org.uk/rolex/v4/rolex.html?size=80';
 var DEFAULT_SPONSORSHIP_TITLE = 'rolex';
@@ -3693,7 +3836,6 @@ var Tab = function Tab(_ref) {
     className = _ref.className,
     role = _ref.role,
     ariaLabel = _ref.ariaLabel,
-    tabLinkId = _ref.tabLinkId,
     color = _ref.color;
   var clickHandler = function clickHandler() {
     if (onClick) {
@@ -3724,9 +3866,8 @@ var Tab = function Tab(_ref) {
     tabIndex: 0,
     className: className
   }, /*#__PURE__*/React__default.createElement(TabText, {
-    id: tabLinkId,
-    trimText: trimText,
     color: color,
+    trimText: trimText,
     withTextInMobile: withTextInMobile,
     "aria-hidden": "true"
   }, title), withIcon !== 'none' && /*#__PURE__*/React__default.createElement(Icon, {
@@ -3737,7 +3878,7 @@ var Tab = function Tab(_ref) {
 };
 
 var _templateObject$l, _templateObject2$d;
-var TabLinkWrapper = /*#__PURE__*/styled__default.a(_templateObject$l || (_templateObject$l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  padding: ", ";\n  color: ", ";\n  width: fit-content;\n  display: flex;\n  align-items: center;\n  cursor: pointer;\n  text-decoration: none;\n  border-bottom: ", ";\n\n  && svg path {\n    fill: ", ";\n  }\n\n  @media ", ", ", " {\n    &:hover {\n      color: var(--color-", ");\n      border-bottom: 1px solid var(--color-", ");\n\n      && svg path {\n        fill: var(--color-", ");\n      }\n    }\n  }\n"])), function (_ref) {
+var TabLinkWrapper = /*#__PURE__*/styled__default.a(_templateObject$l || (_templateObject$l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  padding: ", ";\n  font-size: var(--harmonic-font-size-navigation);\n  font-family: var(--font-family-sans);\n  font-weight: var(--font-weight-navigation);\n  letter-spacing: var(--harmonic-letter-spacing-navigation);\n  color: ", ";\n  width: fit-content;\n  display: flex;\n  align-items: center;\n  cursor: pointer;\n  text-decoration: none;\n  border-bottom: ", ";\n\n  && svg path {\n    fill: ", ";\n  }\n\n  @media ", ", ", " {\n    &:hover {\n      color: var(--color-", ");\n      border-bottom: 1px solid var(--color-", ");\n\n      && svg path {\n        fill: var(--color-", ");\n      }\n    }\n  }\n"])), function (_ref) {
   var iconName = _ref.iconName;
   return iconName ? 'calc(var(--text-link-underline-offset) - 4px) 0' : 'var(--text-link-underline-offset) 0';
 }, function (_ref2) {
@@ -3766,7 +3907,7 @@ var TabLinkWrapper = /*#__PURE__*/styled__default.a(_templateObject$l || (_templ
 });
 var TabLinkIconWrapper = /*#__PURE__*/styled__default.span(_templateObject2$d || (_templateObject2$d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  width: var(--button-icon-width);\n  height: var(--button-icon-height);\n  margin-right: var(--button-icon-margin);\n"])));
 
-var _excluded$8 = ["children", "iconName", "iconDirection", "color", "hoverColor", "className"];
+var _excluded$8 = ["children", "iconName", "iconDirection", "color", "hoverColor"];
 var TabLink = function TabLink(_ref) {
   var children = _ref.children,
     iconName = _ref.iconName,
@@ -3775,13 +3916,11 @@ var TabLink = function TabLink(_ref) {
     color = _ref$color === void 0 ? ThemeColor['base-dark-grey'] : _ref$color,
     _ref$hoverColor = _ref.hoverColor,
     hoverColor = _ref$hoverColor === void 0 ? ThemeColor['primary-red'] : _ref$hoverColor,
-    className = _ref.className,
     rest = _objectWithoutPropertiesLoose(_ref, _excluded$8);
   return /*#__PURE__*/React__default.createElement(TabLinkWrapper, Object.assign({
     color: color,
     iconName: iconName,
-    hoverColor: hoverColor,
-    className: "" + typographyStyles.navigationtext + (className ? " " + className : '')
+    hoverColor: hoverColor
   }, rest), iconName ? (/*#__PURE__*/React__default.createElement(TabLinkIconWrapper, {
     "data-testid": "tab-link-icon"
   }, /*#__PURE__*/React__default.createElement(Icon, {
@@ -3791,7 +3930,7 @@ var TabLink = function TabLink(_ref) {
   }))) : null, children);
 };
 
-var _templateObject$m, _templateObject2$e, _templateObject3$7, _templateObject4$5;
+var _templateObject$m, _templateObject2$e, _templateObject3$7, _templateObject4$4;
 var TextAreaWrapper = /*#__PURE__*/styled__default.div(_templateObject$m || (_templateObject$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  width: ", ";\n  height: ", ";\n"])), function (_ref) {
   var width = _ref.width;
   return width ? width + "px;" : '100%;';
@@ -3818,7 +3957,7 @@ var TextAreaBox = /*#__PURE__*/styled__default.textarea(_templateObject3$7 || (_
   var darkMode = _ref7.darkMode;
   return darkMode ? 'var(--base-color-lemonchiffon)' : 'var(--base-color-lapislazuli)';
 });
-var TextAreaError = /*#__PURE__*/styled__default.div(_templateObject4$5 || (_templateObject4$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  ", ";\n  color: ", ";\n  margin-block: 15px 0;\n"])), function (_ref8) {
+var TextAreaError = /*#__PURE__*/styled__default.div(_templateObject4$4 || (_templateObject4$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  ", ";\n  color: ", ";\n  margin-block: 15px 0;\n"])), function (_ref8) {
   var darkMode = _ref8.darkMode;
   return darkMode ? 'color: var(--base-color-white)' : '';
 }, function (_ref9) {
@@ -3914,7 +4053,7 @@ var TextArea = function TextArea(_ref) {
   }, error)))));
 };
 
-var _templateObject$n, _templateObject2$f, _templateObject3$8, _templateObject4$6, _templateObject5$3, _templateObject6$1, _templateObject7;
+var _templateObject$n, _templateObject2$f, _templateObject3$8, _templateObject4$5, _templateObject5$2, _templateObject6$1, _templateObject7;
 var Container$1 = /*#__PURE__*/styled__default.div(_templateObject$n || (_templateObject$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n"])));
 var InputWrapper = /*#__PURE__*/styled__default.div(_templateObject2$f || (_templateObject2$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: relative;\n  width: auto;\n  max-width: ", ";\n"])), function (_ref) {
   var width = _ref.width;
@@ -3934,8 +4073,8 @@ var Input = /*#__PURE__*/styled__default.input(_templateObject3$8 || (_templateO
   if (darkMode) return "4px solid var(--base-color-lemonchiffon)";
   return "3px solid var(--base-color-lapislazuli)";
 }, devices.mobile);
-var ShowHideButton = /*#__PURE__*/styled__default.button(_templateObject4$6 || (_templateObject4$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: absolute;\n  width: 53px;\n  top: 50%;\n  margin-top: calc(var(--line-height-overline-1) / 2 * -1);\n  right: 20px;\n  border: none;\n  background: none;\n  padding: 0;\n  display: block;\n  text-align: left;\n  cursor: pointer;\n  white-space: nowrap;\n  color: var(--color-base-black);\n"])));
-var TextLabel$1 = /*#__PURE__*/styled__default.div(_templateObject5$3 || (_templateObject5$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin-bottom: 20px;\n  color: ", ";\n"])), function (_ref5) {
+var ShowHideButton = /*#__PURE__*/styled__default.button(_templateObject4$5 || (_templateObject4$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: absolute;\n  width: 53px;\n  top: 50%;\n  margin-top: calc(var(--line-height-overline-1) / 2 * -1);\n  right: 20px;\n  border: none;\n  background: none;\n  padding: 0;\n  display: block;\n  text-align: left;\n  cursor: pointer;\n  white-space: nowrap;\n  color: var(--color-base-black);\n"])));
+var TextLabel$1 = /*#__PURE__*/styled__default.div(_templateObject5$2 || (_templateObject5$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin-bottom: 20px;\n  color: ", ";\n"])), function (_ref5) {
   var darkMode = _ref5.darkMode;
   if (darkMode) return "var(--color-base-white)";
   return "var(--base-color-black)";
@@ -4048,7 +4187,7 @@ var TextFieldComponent = function TextFieldComponent(_ref, ref) {
 };
 var TextField = /*#__PURE__*/React.forwardRef(TextFieldComponent);
 
-var _templateObject$o, _templateObject2$g, _templateObject3$9, _templateObject4$7, _templateObject5$4;
+var _templateObject$o, _templateObject2$g, _templateObject3$9, _templateObject4$6, _templateObject5$3;
 var TextFieldContainer = /*#__PURE__*/styled__default.div(_templateObject$o || (_templateObject$o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n"])));
 var textStyles = /*#__PURE__*/styled.css(_templateObject2$g || (_templateObject2$g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  font-family: var(--font-family-body);\n  font-weight: ", ";\n  font-size: ", ";\n  line-height: ", ";\n"])), function (_ref) {
   var theme = _ref.theme;
@@ -4081,12 +4220,12 @@ var Input$1 = /*#__PURE__*/styled__default.input(_templateObject3$9 || (_templat
   if (darkMode) return "4px solid " + theme.colors.lemonChiffon;
   return "3px solid " + theme.colors.lapisLazuli;
 });
-var TextLabel$2 = /*#__PURE__*/styled__default.p(_templateObject4$7 || (_templateObject4$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  ", ";\n\n  color: ", ";\n"])), textStyles, function (_ref9) {
+var TextLabel$2 = /*#__PURE__*/styled__default.p(_templateObject4$6 || (_templateObject4$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  ", ";\n\n  color: ", ";\n"])), textStyles, function (_ref9) {
   var darkMode = _ref9.darkMode,
     theme = _ref9.theme;
   return darkMode ? theme.colors.white : theme.colors.black;
 });
-var ErrorLabel$2 = /*#__PURE__*/styled__default.p(_templateObject5$4 || (_templateObject5$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  ", ";\n\n  color: ", ";\n"])), textStyles, function (_ref0) {
+var ErrorLabel$2 = /*#__PURE__*/styled__default.p(_templateObject5$3 || (_templateObject5$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  ", ";\n\n  color: ", ";\n"])), textStyles, function (_ref0) {
   var darkMode = _ref0.darkMode,
     theme = _ref0.theme;
   return darkMode ? theme.colors.white : theme.colors.error;
@@ -4162,7 +4301,7 @@ var TextLogoProduct;
   TextLogoProduct["Cinema"] = "CINEMA";
 })(TextLogoProduct || (TextLogoProduct = {}));
 
-var _templateObject$q, _templateObject2$i, _templateObject3$a, _templateObject4$8;
+var _templateObject$q, _templateObject2$i, _templateObject3$a, _templateObject4$7;
 var TickboxError = /*#__PURE__*/styled__default.div(_templateObject$q || (_templateObject$q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin-block: 20px;\n  color: var(--base-color-", ");\n"])), function (_ref) {
   var dark = _ref.dark;
   return dark ? 'white' : 'errorstate';
@@ -4192,7 +4331,7 @@ var TickboxCheckmark = /*#__PURE__*/styled__default.span(_templateObject3$a || (
     dark = _ref6.dark;
   return dark && error ? '1px solid var(--base-color-errorstate)' : 'none';
 }, devices.mobile);
-var TickboxInput = /*#__PURE__*/styled__default.input(_templateObject4$8 || (_templateObject4$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: none;\n\n  &:checked ~ ", " {\n    background-color: var(\n      --base-color-", "\n    );\n    & svg {\n      display: block;\n      path {\n        fill: var(\n          --base-color-", "\n        );\n      }\n    }\n  }\n"])), TickboxCheckmark, function (_ref7) {
+var TickboxInput = /*#__PURE__*/styled__default.input(_templateObject4$7 || (_templateObject4$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: none;\n\n  &:checked ~ ", " {\n    background-color: var(\n      --base-color-", "\n    );\n    & svg {\n      display: block;\n      path {\n        fill: var(\n          --base-color-", "\n        );\n      }\n    }\n  }\n"])), TickboxCheckmark, function (_ref7) {
   var dark = _ref7.dark,
     whiteBox = _ref7.whiteBox,
     disabled = _ref7.disabled;
@@ -4283,7 +4422,7 @@ var Tickbox = function Tickbox(_ref) {
   }, error))));
 };
 
-var _templateObject$r, _templateObject2$j, _templateObject3$b, _templateObject4$9, _templateObject5$5, _templateObject6$2;
+var _templateObject$r, _templateObject2$j, _templateObject3$b, _templateObject4$8, _templateObject5$4, _templateObject6$2;
 var Container$2 = /*#__PURE__*/styled__default.div(_templateObject$r || (_templateObject$r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n"])));
 var Tickbox$1 = /*#__PURE__*/styled__default.div(_templateObject2$j || (_templateObject2$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: absolute;\n  top: 1px;\n  left: 0;\n  z-index: 1;\n  box-sizing: border-box;\n  width: 20px;\n  height: 20px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  border: ", ";\n  background-color: ", ";\n  color: ", ";\n"])), function (_ref) {
   var error = _ref.error,
@@ -4319,8 +4458,8 @@ var TickboxLabel$2 = /*#__PURE__*/styled__default.label(_templateObject3$b || (_
   if (darkMode) return '4px solid var(--base-color-lemonchiffon)';
   return '3px solid var(--base-color-lapislazuli)';
 });
-var TickboxIcon = /*#__PURE__*/styled__default.div(_templateObject4$9 || (_templateObject4$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: none;\n  color: inherit;\n  svg {\n    font-size: 12px;\n    width: 1em;\n    height: 1em;\n    fill: currentColor;\n    color: inherit;\n    path {\n      fill: currentColor;\n      color: inherit;\n    }\n  }\n  input[type='checkbox']:checked + ", " & {\n    display: block;\n  }\n"])), Tickbox$1);
-var TextLabel$3 = /*#__PURE__*/styled__default.div(_templateObject5$5 || (_templateObject5$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: ", ";\n"])), function (_ref6) {
+var TickboxIcon = /*#__PURE__*/styled__default.div(_templateObject4$8 || (_templateObject4$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: none;\n  color: inherit;\n  svg {\n    font-size: 12px;\n    width: 1em;\n    height: 1em;\n    fill: currentColor;\n    color: inherit;\n    path {\n      fill: currentColor;\n      color: inherit;\n    }\n  }\n  input[type='checkbox']:checked + ", " & {\n    display: block;\n  }\n"])), Tickbox$1);
+var TextLabel$3 = /*#__PURE__*/styled__default.div(_templateObject5$4 || (_templateObject5$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: ", ";\n"])), function (_ref6) {
   var darkMode = _ref6.darkMode,
     disabled = _ref6.disabled;
   if (darkMode && disabled) return 'var(--base-color-light-grey)';
@@ -4394,7 +4533,7 @@ var Tickbox2Component = function Tickbox2Component(_ref, ref) {
 };
 var Tickbox2 = /*#__PURE__*/React.forwardRef(Tickbox2Component);
 
-var _templateObject$s, _templateObject2$k, _templateObject3$c, _templateObject4$a, _templateObject5$6, _templateObject6$3, _templateObject7$1, _templateObject8;
+var _templateObject$s, _templateObject2$k, _templateObject3$c, _templateObject4$9, _templateObject5$5, _templateObject6$3, _templateObject7$1, _templateObject8;
 var TimerWrapper = /*#__PURE__*/styled__default.div(_templateObject$s || (_templateObject$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: var(--color-", ");\n"])), function (_ref) {
   var color = _ref.color;
   return color;
@@ -4404,8 +4543,8 @@ var Line = /*#__PURE__*/styled__default.div(_templateObject2$k || (_templateObje
   return color;
 }, devices.mobileAndTablet);
 var TitleWrapper = /*#__PURE__*/styled__default.div(_templateObject3$c || (_templateObject3$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin-bottom: 16px;\n\n  @media ", " {\n    margin-bottom: 8px;\n  }\n"])), devices.mobileAndTablet);
-var ValuesWrapper = /*#__PURE__*/styled__default.div(_templateObject4$a || (_templateObject4$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n"])));
-var TimerLabel = /*#__PURE__*/styled__default.div(_templateObject5$6 || (_templateObject5$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin-top: 4px;\n"])));
+var ValuesWrapper = /*#__PURE__*/styled__default.div(_templateObject4$9 || (_templateObject4$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n"])));
+var TimerLabel = /*#__PURE__*/styled__default.div(_templateObject5$5 || (_templateObject5$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin-top: 4px;\n"])));
 var TimerValueSeparator = /*#__PURE__*/styled__default.div(_templateObject6$3 || (_templateObject6$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin: 0 20px;\n\n  @media ", " {\n    margin: 0 12px;\n  }\n"])), devices.mobileAndTablet);
 var TimerValueWrapper = /*#__PURE__*/styled__default.div(_templateObject7$1 || (_templateObject7$1 = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
 var TimerValue = /*#__PURE__*/styled__default.div(_templateObject8 || (_templateObject8 = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
@@ -4505,25 +4644,25 @@ var Timer = function Timer(_ref) {
 };
 
 var _templateObject$t;
-var TypeTagsContainer = /*#__PURE__*/styled__default.ul(_templateObject$t || (_templateObject$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  list-style-type: none;\n  margin: 0;\n  padding: 0;\n\n  p,\n  li {\n    display: inline-block;\n    margin: 0;\n  }\n\n  li:before {\n    content: '\u2013';\n    margin: 0 0.5em;\n  }\n\n  li:first-child:before {\n    display: none;\n  }\n"])));
+var TypeTagsContainer = /*#__PURE__*/styled__default.ul(_templateObject$t || (_templateObject$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  list-style-type: none;\n  margin: 0;\n  padding: 0;\n\n  p,\n  li {\n    display: inline-block;\n    margin: 0;\n  }\n\n  li:before {\n    content: '\u2014';\n    margin: 0 0.5em;\n  }\n\n  li:first-child:before {\n    display: none;\n  }\n"])));
 
 var TypeTags = function TypeTags(_ref) {
   var list = _ref.list;
   return /*#__PURE__*/React__default.createElement(TypeTagsContainer, null, list.map(function (t) {
     return /*#__PURE__*/React__default.createElement("li", {
       key: t
-    }, /*#__PURE__*/React__default.createElement(BodyCopyHarmonic, {
-      size: "medium"
+    }, /*#__PURE__*/React__default.createElement(HarmonicOverline, {
+      size: "large"
     }, t));
   }));
 };
 
-var _templateObject$u, _templateObject2$l, _templateObject3$d, _templateObject4$b, _templateObject5$7, _templateObject6$4, _templateObject7$2, _templateObject8$1, _templateObject9, _templateObject0;
+var _templateObject$u, _templateObject2$l, _templateObject3$d, _templateObject4$a, _templateObject5$6, _templateObject6$4, _templateObject7$2, _templateObject8$1, _templateObject9, _templateObject0;
 var VideoPlayButton = /*#__PURE__*/styled__default.button(_templateObject$u || (_templateObject$u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  width: 48px;\n  height: 48px;\n  border-radius: 50%;\n  background-color: #fff;\n  border: none;\n  padding: 12px;\n  cursor: pointer;\n"])));
 var VideoFullscreenButton = /*#__PURE__*/styled__default.button(_templateObject2$l || (_templateObject2$l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  width: 56px;\n  height: 36px;\n  background-color: rgb(26, 26, 26, 0.6);\n  border-radius: 5px;\n  padding: 5px 14px;\n  border: none;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  cursor: pointer;\n"])));
 var VideoControlsWrapper = /*#__PURE__*/styled__default.div(_templateObject3$d || (_templateObject3$d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: absolute;\n  bottom: 0;\n  width: 100%;\n"])));
-var VideoControlsInnerWrapper = /*#__PURE__*/styled__default.div(_templateObject4$b || (_templateObject4$b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  margin: 0 40px 17px 30px;\n"])));
-var LeftWrapper = /*#__PURE__*/styled__default.div(_templateObject5$7 || (_templateObject5$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: center;\n"])));
+var VideoControlsInnerWrapper = /*#__PURE__*/styled__default.div(_templateObject4$a || (_templateObject4$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  margin: 0 40px 17px 30px;\n"])));
+var LeftWrapper = /*#__PURE__*/styled__default.div(_templateObject5$6 || (_templateObject5$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: center;\n"])));
 var VideoVolume = /*#__PURE__*/styled__default.input(_templateObject6$4 || (_templateObject6$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  width: 100px;\n  margin-left: 24px;\n"])));
 var VideoMute = /*#__PURE__*/styled__default.button(_templateObject7$2 || (_templateObject7$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  width: 17px;\n  height: 17px;\n  background: none;\n  border: none;\n  padding: 0;\n  svg {\n    width: 100%;\n    height: 100%;\n  }\n  cursor: pointer;\n"])));
 var thumbStyles = /*#__PURE__*/styled.css(_templateObject8$1 || (_templateObject8$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  -webkit-appearance: none;\n  appearance: none;\n  border: none;\n  height: 8px;\n  width: 8px;\n  border-radius: 50%;\n  background: #ffffff;\n  border: none;\n  transform: translateY(-25%);\n"])));
@@ -4592,43 +4731,45 @@ var VideoControls = function VideoControls(_ref2) {
       document.removeEventListener('fullscreenchange', handleFullscreenChange);
     };
   }, []);
-  var handleFullscreen = React.useCallback(/*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee() {
+  var handleFullscreen = React.useCallback(/*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
     var videoContainer;
-    return _regenerator().w(function (_context) {
-      while (1) switch (_context.n) {
+    return _regeneratorRuntime().wrap(function _callee$(_context) {
+      while (1) switch (_context.prev = _context.next) {
         case 0:
           videoContainer = document.querySelector("#" + videoContainerId);
           if (videoContainer != null && videoContainer.requestFullscreen) {
-            _context.n = 1;
+            _context.next = 3;
             break;
           }
-          return _context.a(2);
-        case 1:
-          _context.n = 2;
+          return _context.abrupt("return");
+        case 3:
+          _context.next = 5;
           return videoContainer.requestFullscreen();
-        case 2:
+        case 5:
           setIsFullscreen(true);
-        case 3:
-          return _context.a(2);
+        case 6:
+        case "end":
+          return _context.stop();
       }
     }, _callee);
   })), []);
-  var handleMinimise = React.useCallback(/*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee2() {
-    return _regenerator().w(function (_context2) {
-      while (1) switch (_context2.n) {
+  var handleMinimise = React.useCallback(/*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee2() {
+    return _regeneratorRuntime().wrap(function _callee2$(_context2) {
+      while (1) switch (_context2.prev = _context2.next) {
         case 0:
           if (document.fullscreenElement) {
-            _context2.n = 1;
+            _context2.next = 2;
             break;
           }
-          return _context2.a(2);
-        case 1:
-          _context2.n = 2;
-          return document.exitFullscreen();
+          return _context2.abrupt("return");
         case 2:
+          _context2.next = 4;
+          return document.exitFullscreen();
+        case 4:
           setIsFullscreen(false);
-        case 3:
-          return _context2.a(2);
+        case 5:
+        case "end":
+          return _context2.stop();
       }
     }, _callee2);
   })), []);
@@ -4708,7 +4849,7 @@ var VideoControls = function VideoControls(_ref2) {
   }))));
 };
 
-var _templateObject$v, _templateObject2$m, _templateObject3$e, _templateObject4$c, _templateObject5$8;
+var _templateObject$v, _templateObject2$m, _templateObject3$e, _templateObject4$b, _templateObject5$7;
 var StepperWrapper = /*#__PURE__*/styled__default.div(_templateObject$v || (_templateObject$v = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  justify-content: left;\n  align-items: left;\n"])));
 var StepperError = /*#__PURE__*/styled__default.div(_templateObject2$m || (_templateObject2$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: var(--base-color-", ");\n  margin-block: 15px 0;\n\n  * {\n    margin: 0;\n  }\n"])), function (_ref) {
   var darkMode = _ref.darkMode;
@@ -4736,11 +4877,11 @@ var StepperBox = /*#__PURE__*/styled__default.div(_templateObject3$e || (_templa
   var disabled = _ref6.disabled;
   return disabled ? 'midgrey' : 'black';
 });
-var StepperValue = /*#__PURE__*/styled__default.input(_templateObject4$c || (_templateObject4$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  width: 51px;\n  border: 0;\n  text-align: center;\n  font-family: var(--font-family-altHeader);\n  font-size: var(--font-size-altHeader-6);\n  font-weight: var(--font-weight-altHeader-6);\n  background-color: transparent;\n  cursor: ", ";\n"])), function (_ref7) {
+var StepperValue = /*#__PURE__*/styled__default.input(_templateObject4$b || (_templateObject4$b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  width: 51px;\n  border: 0;\n  text-align: center;\n  font-family: var(--font-family-altHeader);\n  font-size: var(--font-size-altHeader-6);\n  font-weight: var(--font-weight-altHeader-6);\n  background-color: transparent;\n  cursor: ", ";\n"])), function (_ref7) {
   var disabled = _ref7.disabled;
   return disabled ? 'not-allowed' : 'text';
 });
-var StepperButton = /*#__PURE__*/styled__default.div(_templateObject5$8 || (_templateObject5$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  cursor: ", ";\n\n  span {\n    display: flex;\n    justify-content: center;\n  }\n\n  svg {\n    width: 40%;\n    height: auto;\n  }\n"])), function (_ref8) {
+var StepperButton = /*#__PURE__*/styled__default.div(_templateObject5$7 || (_templateObject5$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  cursor: ", ";\n\n  span {\n    display: flex;\n    justify-content: center;\n  }\n\n  svg {\n    width: 40%;\n    height: auto;\n  }\n"])), function (_ref8) {
   var disabled = _ref8.disabled;
   return disabled ? 'not-allowed' : 'pointer';
 });
@@ -5024,7 +5165,7 @@ var SocialLinks = function SocialLinks(_ref) {
   }));
 };
 
-var _templateObject$x, _templateObject2$o, _templateObject3$f, _templateObject4$d, _templateObject5$9, _templateObject6$5, _templateObject7$3, _templateObject8$2, _templateObject9$1, _templateObject0$1, _templateObject1, _templateObject10, _templateObject11, _templateObject12, _templateObject13;
+var _templateObject$x, _templateObject2$o, _templateObject3$f, _templateObject4$c, _templateObject5$8, _templateObject6$5, _templateObject7$3, _templateObject8$2, _templateObject9$1, _templateObject0$1, _templateObject1, _templateObject10, _templateObject11, _templateObject12, _templateObject13;
 var NavigationWrapper = /*#__PURE__*/styled__default.div(_templateObject$x || (_templateObject$x = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  padding-top: 4px;\n\n  @media ", " {\n    padding-top: 0px;\n  }\n\n  @media ", " {\n    ", "\n  }\n"])), devices.mobileAndTablet, devices.mobileAndTablet, function (_ref) {
   var isMenuOpen = _ref.isMenuOpen;
   return isMenuOpen && "\n      position: fixed;\n      top: 0;\n      right: 0;\n      bottom: 0;\n      left: 0;\n      z-index: " + zIndexes.overlay + ";\n      background-color: var(--color-base-white);\n      overflow-y: auto;\n      scrollbar-width: none;\n      ::-webkit-scrollbar {\n        display: none;\n      }\n    ";
@@ -5034,7 +5175,7 @@ var FullScreenContainer = /*#__PURE__*/styled__default.div(_templateObject2$o ||
   return isMobile ? zIndexes.overlay : zIndexes.searchOverlay;
 }, devices.mobileAndTablet);
 var NavigationGrid = /*#__PURE__*/styled__default(Grid)(_templateObject3$f || (_templateObject3$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: relative;\n  background-color: var(--color-base-white);\n  height: 140px;\n  justify-content: space-evenly;\n  width: 100%;\n  z-index: ", ";\n\n  @media ", " {\n    height: 60px;\n  }\n"])), zIndexes.navigation, devices.mobileAndTablet);
-var SearchBackground = /*#__PURE__*/styled__default.div(_templateObject4$d || (_templateObject4$d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  visibility: ", ";\n  opacity: ", ";\n  transform: ", ";\n  transition:\n    opacity 0.3s ease,\n    transform 0.3s ease,\n    visibility 0.3s ease;\n  background-color: var(--color-base-white);\n  height: 100px;\n  border-top: 1px solid var(--color-base-light-grey);\n  width: 100%;\n  position: absolute;\n  top: 140px;\n  z-index: ", ";\n\n  @media ", " {\n    height: 86px;\n    top: 144px;\n  }\n"])), function (_ref3) {
+var SearchBackground = /*#__PURE__*/styled__default.div(_templateObject4$c || (_templateObject4$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  visibility: ", ";\n  opacity: ", ";\n  transform: ", ";\n  transition:\n    opacity 0.3s ease,\n    transform 0.3s ease,\n    visibility 0.3s ease;\n  background-color: var(--color-base-white);\n  height: 100px;\n  border-top: 1px solid var(--color-base-light-grey);\n  width: 100%;\n  position: absolute;\n  top: 140px;\n  z-index: ", ";\n\n  @media ", " {\n    height: 86px;\n    top: 144px;\n  }\n"])), function (_ref3) {
   var visible = _ref3.visible;
   return visible ? 'visible' : 'hidden';
 }, function (_ref4) {
@@ -5044,7 +5185,7 @@ var SearchBackground = /*#__PURE__*/styled__default.div(_templateObject4$d || (_
   var visible = _ref5.visible;
   return visible ? 'translateY(0)' : 'translateY(-10px)';
 }, zIndexes.search, devices.mobile);
-var GridItemSearch = /*#__PURE__*/styled__default(GridItem)(_templateObject5$9 || (_templateObject5$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  visibility: ", ";\n  opacity: ", ";\n  transform: ", ";\n  transition:\n    opacity 0.3s ease,\n    transform 0.3s ease,\n    visibility 0.3s ease;\n  background-color: var(--color-base-white);\n  border-top: 1px solid var(--color-base-light-grey);\n  width: 100%;\n  position: absolute;\n  top: 140px;\n  z-index: ", ";\n  height: 100px;\n\n  @media ", " {\n    height: 86px;\n    top: 144px;\n  }\n"])), function (_ref6) {
+var GridItemSearch = /*#__PURE__*/styled__default(GridItem)(_templateObject5$8 || (_templateObject5$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  visibility: ", ";\n  opacity: ", ";\n  transform: ", ";\n  transition:\n    opacity 0.3s ease,\n    transform 0.3s ease,\n    visibility 0.3s ease;\n  background-color: var(--color-base-white);\n  border-top: 1px solid var(--color-base-light-grey);\n  width: 100%;\n  position: absolute;\n  top: 140px;\n  z-index: ", ";\n  height: 100px;\n\n  @media ", " {\n    height: 86px;\n    top: 144px;\n  }\n"])), function (_ref6) {
   var visible = _ref6.visible;
   return visible ? 'visible' : 'hidden';
 }, function (_ref7) {
@@ -5071,7 +5212,7 @@ var NavTopContainerMobile = /*#__PURE__*/styled__default.div(_templateObject13 |
 var _templateObject$y;
 var NavTopContainer$1 = /*#__PURE__*/styled__default.div(_templateObject$y || (_templateObject$y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: row;\n  column-gap: 16px;\n  justify-content: flex-end;\n  height: 100%;\n\n  @media ", " {\n    column-gap: 20px;\n  }\n"])), devices.mobile);
 
-var _templateObject$z, _templateObject2$p, _templateObject3$g, _templateObject4$e, _templateObject5$a, _templateObject6$6;
+var _templateObject$z, _templateObject2$p, _templateObject3$g, _templateObject4$d, _templateObject5$9, _templateObject6$6;
 var BasketContainer = /*#__PURE__*/styled__default.div(_templateObject$z || (_templateObject$z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: inline-flex;\n  flex-direction: row;\n  justify-content: flex-start;\n  align-items: center;\n  cursor: pointer;\n  padding-top: 3px;\n  padding-bottom: 3px;\n\n  & svg path {\n    fill: var(--color-primary-black);\n  }\n\n  ", "\n\n  :hover {\n    border-bottom: 1px solid var(--color-primary-red);\n    padding-bottom: 2px;\n    && a {\n      color: var(--color-primary-red);\n    }\n    && svg path {\n      fill: var(--color-primary-red);\n    }\n  }\n\n  ", "\n"])), function (_ref) {
   var selected = _ref.selected;
   if (selected) {
@@ -5087,8 +5228,8 @@ var BasketContainer = /*#__PURE__*/styled__default.div(_templateObject$z || (_te
 });
 var SvgContainer = /*#__PURE__*/styled__default.div(_templateObject2$p || (_templateObject2$p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: relative;\n\n  svg {\n    width: var(--navigation-large-gap);\n    height: var(--navigation-large-gap);\n  }\n"])));
 var NumContainer = /*#__PURE__*/styled__default.div(_templateObject3$g || (_templateObject3$g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  justify-content: center;\n  width: 12px;\n  height: 12px;\n  position: absolute;\n  top: 8px;\n  margin-left: 6px;\n"])));
-var BasketInfo = /*#__PURE__*/styled__default.div(_templateObject4$e || (_templateObject4$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n\n  @media ", " {\n    width: max-content;\n  }\n"])), devices.mobileAndTablet);
-var BasketNum = /*#__PURE__*/styled__default.span(_templateObject5$a || (_templateObject5$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: var(--color-base-white);\n  font-size: 10px;\n  font-family: var(--font-family-sans);\n"])));
+var BasketInfo = /*#__PURE__*/styled__default.div(_templateObject4$d || (_templateObject4$d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n\n  @media ", " {\n    width: max-content;\n  }\n"])), devices.mobileAndTablet);
+var BasketNum = /*#__PURE__*/styled__default.span(_templateObject5$9 || (_templateObject5$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: var(--color-base-white);\n  font-size: 10px;\n  font-family: var(--font-family-sans);\n"])));
 var BasketText = /*#__PURE__*/styled__default.a(_templateObject6$6 || (_templateObject6$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  font-size: var(--harmonic-font-size-navigation);\n  font-family: var(--font-family-sans);\n  font-weight: var(--font-weight-navigation);\n  color: var(--color-primary-black);\n  margin-left: 6px;\n  text-decoration: none;\n"])));
 
 var getSecondsUntil = function getSecondsUntil(expiryUnixTimestamp) {
@@ -5284,7 +5425,6 @@ var Dropdown = function Dropdown(_ref) {
     className = _ref.className,
     role = _ref.role,
     ariaLabel = _ref.ariaLabel,
-    tabLinkId = _ref.tabLinkId,
     trimTabText = _ref.trimTabText;
   var node = React.useRef();
   var _useState = React.useState(false),
@@ -5381,7 +5521,6 @@ var Dropdown = function Dropdown(_ref) {
   };
   var renderTab = function renderTab() {
     return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(Tab, {
-      tabLinkId: tabLinkId,
       trimText: trimTabText,
       title: title,
       titleLink: titleLink,
@@ -5461,8 +5600,7 @@ var Account = function Account(_ref) {
     iconName: iconName,
     withOptionsInMobile: false,
     withIcon: "left",
-    className: className,
-    tabLinkId: "account-link"
+    className: className
   });
 };
 
@@ -5504,7 +5642,7 @@ var NavTop = function NavTop(_ref) {
   }));
 };
 
-var _templateObject$B, _templateObject2$r, _templateObject3$h, _templateObject4$f;
+var _templateObject$B, _templateObject2$r, _templateObject3$h, _templateObject4$e;
 var TabsContainer = /*#__PURE__*/styled__default.div(_templateObject$B || (_templateObject$B = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: inline-flex;\n  flex-direction: row;\n  column-gap: 32px;\n"])));
 var ItemsContainer = /*#__PURE__*/styled__default.div(_templateObject2$r || (_templateObject2$r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: inline-flex;\n  flex-direction: row;\n  column-gap: 32px;\n\n  @media ", " {\n    column-gap: 15px;\n  }\n\n  @media ", ", ", " {\n    div:last-child > div {\n      right: 1px;\n    }\n  }\n\n  @media ", " {\n    ", "\n  }\n"])), devices.desktop, devices.desktop, devices.largeDesktop, devices.mobileAndTablet, function (props) {
   if (props.showMenu) {
@@ -5513,7 +5651,7 @@ var ItemsContainer = /*#__PURE__*/styled__default.div(_templateObject2$r || (_te
   return "display: none;";
 });
 var MenuContainer$1 = /*#__PURE__*/styled__default.div(_templateObject3$h || (_templateObject3$h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: none;\n  width: 60px;\n\n  & a {\n    font-size: var(--harmonic-font-size-navigation);\n    font-family: var(--font-family-sans);\n    color: var(--color-primary-black);\n    text-decoration: none;\n    cursor: pointer;\n\n    :hover {\n      color: var(--color-primary-red);\n    }\n  }\n\n  && svg path {\n    fill: var(--color-primary-black);\n  }\n\n  :hover {\n    && svg path {\n      fill: var(--color-primary-red);\n    }\n  }\n\n  @media ", " {\n    display: block;\n\n    svg {\n      width: 24px;\n      height: 24px;\n      margin-left: 40px;\n      margin-top: -20px;\n    }\n\n    a {\n      margin-left: 20px;\n    }\n  }\n"])), devices.mobileAndTablet);
-var MenuItem = /*#__PURE__*/styled__default.div(_templateObject4$f || (_templateObject4$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  @media ", " {\n    a {\n      margin-left: 0;\n    }\n  }\n"])), devices.mobileAndTablet);
+var MenuItem = /*#__PURE__*/styled__default.div(_templateObject4$e || (_templateObject4$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  @media ", " {\n    a {\n      margin-left: 0;\n    }\n  }\n"])), devices.mobileAndTablet);
 
 /* eslint-disable jsx-a11y/no-static-element-interactions */
 var Tabs = function Tabs(_ref) {
@@ -5639,11 +5777,11 @@ var Tabs = function Tabs(_ref) {
   }, "Menu"))))));
 };
 
-var _templateObject$C, _templateObject2$s, _templateObject3$i, _templateObject5$b, _templateObject6$7, _templateObject7$4;
+var _templateObject$C, _templateObject2$s, _templateObject3$i, _templateObject5$a, _templateObject6$7, _templateObject7$4;
 var SearchBarContainer = /*#__PURE__*/styled__default.div(_templateObject$C || (_templateObject$C = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: row;\n  column-gap: 64px;\n  justify-content: space-between;\n  align-items: center;\n  height: 100%;\n  background-color: transparent;\n\n  @media ", " {\n    column-gap: 12px;\n  }\n"])), devices.mobile);
 var SvgContainerSearch = /*#__PURE__*/styled__default.div(_templateObject2$s || (_templateObject2$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  svg {\n    width: var(--navigation-xlarge-gap);\n    height: var(--navigation-xlarge-gap);\n  }\n"])));
 var SvgContainerClose = /*#__PURE__*/styled__default.button(_templateObject3$i || (_templateObject3$i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  all: unset;\n\n  svg {\n    width: var(--navigation-large-gap);\n    height: var(--navigation-large-gap);\n  }\n\n  :hover {\n    cursor: pointer;\n    && svg path {\n      fill: var(--color-primary-red);\n    }\n  }\n\n  &:focus {\n    outline: 2px solid var(--color-primary-black);\n    outline-offset: 2px;\n  }\n"])));
-var InputContainer = /*#__PURE__*/styled__default.div(_templateObject5$b || (_templateObject5$b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  background-color: blue;\n  width: 100%;\n\n  input {\n    font-size: var(--font-size-search);\n    font-family: var(--font-family-serif);\n    border: none;\n    border-radius: 0;\n    outline: none;\n    outline-color: var(--color-base-white);\n    height: 48px;\n    box-sizing: border-box;\n    width: 100%;\n    -webkit-appearance: none;\n\n    &.search-input {\n      overflow: hidden;\n      text-overflow: ellipsis;\n      white-space: nowrap;\n    }\n\n    @media ", " {\n      column-gap: 24px;\n    }\n  }\n"])), devices.mobile);
+var InputContainer = /*#__PURE__*/styled__default.div(_templateObject5$a || (_templateObject5$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  background-color: blue;\n  width: 100%;\n\n  input {\n    font-size: var(--font-size-search);\n    font-family: var(--font-family-serif);\n    border: none;\n    border-radius: 0;\n    outline: none;\n    outline-color: var(--color-base-white);\n    height: 48px;\n    box-sizing: border-box;\n    width: 100%;\n    -webkit-appearance: none;\n\n    &.search-input {\n      overflow: hidden;\n      text-overflow: ellipsis;\n      white-space: nowrap;\n    }\n\n    @media ", " {\n      column-gap: 24px;\n    }\n  }\n"])), devices.mobile);
 var TextLinkWrapper$1 = /*#__PURE__*/styled__default(TextLink)(_templateObject6$7 || (_templateObject6$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: var(--color-primary-red);\n"])));
 var SearchArrowContainer = /*#__PURE__*/styled__default.a(_templateObject7$4 || (_templateObject7$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  padding-right: 8px;\n\n  svg {\n    width: var(--navigation-large-gap);\n    height: var(--navigation-large-gap);\n  }\n"])));
 
@@ -5946,12 +6084,12 @@ var Navigation = function Navigation(_ref) {
   })))))));
 };
 
-var _templateObject$D, _templateObject2$t, _templateObject3$j, _templateObject4$g, _templateObject5$c, _templateObject6$8, _templateObject7$5;
+var _templateObject$D, _templateObject2$t, _templateObject3$j, _templateObject4$f, _templateObject5$b, _templateObject6$8, _templateObject7$5;
 var FooterSection = /*#__PURE__*/styled__default(Grid)(_templateObject$D || (_templateObject$D = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  background-color: var(--color-base-black);\n  color: var(--color-base-white);\n  padding: 44px 0px;\n  grid-template-areas: '. . policy policy policy policy social social social social logo logo logo logo . .';\n\n  @media ", " {\n    padding: 40px 0px;\n    gap: 24px;\n  }\n\n  @media ", " {\n    padding: 20px 0px;\n    row-gap: 40px;\n    grid-template-areas:\n      '. social social social social social social social social social social social social .'\n      '. policy policy policy policy policy policy policy policy policy policy policy policy .'\n      '. logo logo logo logo logo logo logo logo logo logo logo logo .';\n  }\n"])), devices.tablet, devices.mobile);
 var PolicyLinksSection = /*#__PURE__*/styled__default(GridItem)(_templateObject2$t || (_templateObject2$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  grid-area: policy;\n  display: flex;\n  flex-direction: column;\n  gap: 16px;\n\n  @media ", " {\n    gap: 20px;\n  }\n\n  @media ", " {\n    gap: 12px;\n  }\n"])), devices.tablet, devices.mobile);
 var SocialAndNewsletterSection = /*#__PURE__*/styled__default(GridItem)(_templateObject3$j || (_templateObject3$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  grid-area: social;\n  display: flex;\n  flex-direction: column;\n  justify-content: space-between;\n  gap: 20px;\n\n  @media ", " {\n    gap: 40px;\n  }\n"])), devices.mobile);
-var SectionWrapper = /*#__PURE__*/styled__default.div(_templateObject4$g || (_templateObject4$g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  gap: 20px;\n\n  @media ", " {\n    gap: 24px;\n  }\n"])), devices.mobile);
-var LogoAndDescriptionSection = /*#__PURE__*/styled__default(GridItem)(_templateObject5$c || (_templateObject5$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  grid-area: logo;\n  display: flex;\n  flex-direction: column;\n  justify-content: space-between;\n\n  @media ", " {\n    gap: 24px;\n  }\n"])), devices.mobile);
+var SectionWrapper = /*#__PURE__*/styled__default.div(_templateObject4$f || (_templateObject4$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  gap: 20px;\n\n  @media ", " {\n    gap: 24px;\n  }\n"])), devices.mobile);
+var LogoAndDescriptionSection = /*#__PURE__*/styled__default(GridItem)(_templateObject5$b || (_templateObject5$b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  grid-area: logo;\n  display: flex;\n  flex-direction: column;\n  justify-content: space-between;\n\n  @media ", " {\n    gap: 24px;\n  }\n"])), devices.mobile);
 var SponsorLogoContainer = /*#__PURE__*/styled__default.div(_templateObject6$8 || (_templateObject6$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  max-width: 290px;\n\n  @media ", " {\n    max-width: unset;\n  }\n"])), devices.mobile);
 var TextLinkWrapper$2 = /*#__PURE__*/styled__default(TextLink)(_templateObject7$5 || (_templateObject7$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  font-family: var(--font-family-sans);\n  font-size: 17px;\n  line-height: 24px;\n  letter-spacing: 0.4px;\n  color: var(--color-base-white);\n  border-bottom: unset;\n  text-decoration: underline;\n  text-underline-offset: 6px;\n  margin-bottom: 0;\n  padding-bottom: 0;\n"])));
 
@@ -6030,110 +6168,30 @@ var Footer = function Footer(_ref) {
   }, additionalInfo))));
 };
 
-var _templateObject$F, _templateObject2$u, _templateObject3$k, _templateObject4$h, _templateObject5$d, _templateObject8$3, _templateObject9$2, _templateObject0$2;
+var _templateObject$F, _templateObject2$u, _templateObject3$k, _templateObject4$g, _templateObject5$c, _templateObject6$9;
 var LIST_ITEM_GAP = 32;
-var AnchorTabbarWrapper = /*#__PURE__*/styled__default.div(_templateObject$F || (_templateObject$F = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: sticky;\n  width: 100%;\n  top: 0;\n  border-bottom: ", ";\n  background-color: var(--color-base-white);\n  z-index: ", ";\n\n  ", "\n"])), function (_ref) {
+var AnchorTabbarWrapper = /*#__PURE__*/styled__default.div(_templateObject$F || (_templateObject$F = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: sticky;\n  width: 100%;\n  top: 0;\n  border-bottom: ", ";\n  background-color: var(--base-color-white);\n  z-index: ", ";\n"])), function (_ref) {
   var bottomBorder = _ref.bottomBorder;
-  return bottomBorder ? '1px solid var(--color-base-light-grey)' : 'none';
-}, zIndexes.anchor, function (_ref2) {
-  var withShadow = _ref2.withShadow;
-  return withShadow && styled.css(_templateObject2$u || (_templateObject2$u = _taggedTemplateLiteralLoose(["\n      box-shadow: var(--shadow-floating);\n    "])));
-});
-var TabsGrid = /*#__PURE__*/styled__default(Grid)(_templateObject3$k || (_templateObject3$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  height: var(--anchor-tabs-height);\n"])));
-var TabsWrapper = /*#__PURE__*/styled__default.div(_templateObject4$h || (_templateObject4$h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n"])));
-var TabsList = /*#__PURE__*/styled__default.ul(_templateObject5$d || (_templateObject5$d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  width: ", ";\n  display: flex;\n  gap: ", "px;\n  justify-content: ", ";\n  align-items: center;\n  list-style: none;\n  padding: 0;\n  margin: 0;\n  height: var(--anchor-tabs-height);\n  white-space: nowrap;\n  overflow: scroll;\n  scrollbar-width: none;\n  ::-webkit-scrollbar {\n    display: none;\n  }\n  scroll-behavior: smooth;\n\n  @media ", " {\n    & {\n      width: ", ";\n    }\n  }\n"])), function (_ref3) {
-  var tabsOverflow = _ref3.tabsOverflow;
+  return bottomBorder ? '2px solid var(--base-color-light-grey)' : 'none';
+}, zIndexes.anchor);
+var TabsGrid = /*#__PURE__*/styled__default(Grid)(_templateObject2$u || (_templateObject2$u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  height: var(--anchor-tabs-height);\n"])));
+var TabsWrapper = /*#__PURE__*/styled__default.div(_templateObject3$k || (_templateObject3$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n"])));
+var TabsList = /*#__PURE__*/styled__default.ul(_templateObject4$g || (_templateObject4$g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  width: ", ";\n  display: flex;\n  gap: ", "px;\n  justify-content: ", ";\n  align-items: center;\n  list-style: none;\n  padding: 0;\n  margin: 0;\n  height: var(--anchor-tabs-height);\n  white-space: nowrap;\n  overflow: scroll;\n  scrollbar-width: none;\n  ::-webkit-scrollbar {\n    display: none;\n  }\n  scroll-behavior: smooth;\n\n  @media ", " {\n    background: linear-gradient(\n      135deg,\n      rgba(255, 255, 255, 1) 0%,\n      rgba(255, 255, 255, 0.48) 85%,\n      rgba(235, 235, 235, 0.4) 99%,\n      rgba(255, 255, 255, 0.39) 100%\n    );\n  }\n\n  @media ", " {\n    & {\n      width: ", ";\n    }\n  }\n"])), function (_ref2) {
+  var tabsOverflow = _ref2.tabsOverflow;
   return tabsOverflow ? 'calc(100% - 74px)' : '100%';
-}, LIST_ITEM_GAP, function (_ref4) {
-  var tabsOverflow = _ref4.tabsOverflow;
+}, LIST_ITEM_GAP, function (_ref3) {
+  var tabsOverflow = _ref3.tabsOverflow;
   return tabsOverflow ? 'start' : 'center';
-}, devices.mobile, function (_ref5) {
-  var tabsOverflow = _ref5.tabsOverflow,
-    hasTwoArrows = _ref5.hasTwoArrows;
+}, devices.mobileAndTablet, devices.mobile, function (_ref4) {
+  var tabsOverflow = _ref4.tabsOverflow,
+    hasTwoArrows = _ref4.hasTwoArrows;
   return tabsOverflow && hasTwoArrows ? 'calc(100% - 50px)' : '100%';
 });
-var ArrowsContainer = /*#__PURE__*/styled__default.div(_templateObject8$3 || (_templateObject8$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  width: 74px;\n  height: var(--anchor-tabs-height);\n  background-color: var(--color-base-white);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 10px;\n\n  ", "\n"])), function (_ref7) {
-  var withShadow = _ref7.withShadow;
-  return withShadow && styled.css(_templateObject9$2 || (_templateObject9$2 = _taggedTemplateLiteralLoose(["\n      box-shadow: var(--shadow-floating);\n    "])));
-});
-var ArrowWrapper = /*#__PURE__*/styled__default.div(_templateObject0$2 || (_templateObject0$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  width: 24px;\n  height: 24px;\n  cursor: ", ";\n  pinter-events: ", ";\n  display: flex;\n  align-items: center;\n  justify-content: flex-center;\n\n  && svg path {\n    fill: ", ";\n  }\n"])), function (_ref8) {
-  var disabled = _ref8.disabled;
-  return disabled ? 'not-allowed' : 'pointer';
-}, function (_ref9) {
-  var disabled = _ref9.disabled;
-  return disabled ? 'none' : 'auto';
-}, function (_ref0) {
-  var disabled = _ref0.disabled;
-  return disabled ? 'var(--color-state-disabled)' : 'var(--button-anchor-tab-color)';
+var ArrowsContainer = /*#__PURE__*/styled__default.div(_templateObject5$c || (_templateObject5$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  width: ", ";\n  height: var(--anchor-tabs-height);\n  background-color: var(--base-color-white);\n  display: flex;\n  align-items: center;\n  justify-content: flex-end;\n  gap: 10px;\n"])), function (_ref5) {
+  var fullWidth = _ref5.fullWidth;
+  return fullWidth ? '74px' : '46px';
 });
-
-/* eslint-disable no-shadow */
-(function (CarouselType) {
-  CarouselType["Image"] = "image";
-  CarouselType["SmallCard"] = "SmallCard";
-  CarouselType["LargeCard"] = "LargeCard";
-})(exports.CarouselType || (exports.CarouselType = {}));
-
-// eslint-disable-next-line no-shadow
-(function (ButtonType) {
-  ButtonType["Primary"] = "Primary";
-  ButtonType["Secondary"] = "Secondary";
-  ButtonType["Tertiary"] = "Tertiary";
-})(exports.ButtonType || (exports.ButtonType = {}));
-
-var coreThemeStyles = {"coreTheme":"core-theme-module_coreTheme__pWxYB"};
-
-var streamThemeStyles = {"streamTheme":"stream-theme-module_streamTheme__lTfqQ"};
-
-var cinemaThemeStyles = {"cinemaTheme":"cinema-theme-module_cinemaTheme__f5QFs"};
-
-var schoolsThemeStyles = {"schoolsTheme":"schools-theme-module_schoolsTheme__CWHba"};
-
-/* eslint-disable react/jsx-no-useless-fragment */
-var DEFAULT_THEME = exports.ThemeType.Core;
-var getThemeClass = function getThemeClass(theme) {
-  // Always include the base (core) theme class
-  var baseThemeClass = coreThemeStyles.coreTheme;
-  var overrideClass = '';
-  switch (theme) {
-    case exports.ThemeType.Core:
-      overrideClass = '';
-      break;
-    case exports.ThemeType.Stream:
-      overrideClass = streamThemeStyles.streamTheme;
-      break;
-    case exports.ThemeType.Cinema:
-      overrideClass = cinemaThemeStyles.cinemaTheme;
-      break;
-    case exports.ThemeType.Schools:
-      overrideClass = schoolsThemeStyles.schoolsTheme;
-      break;
-    default:
-      overrideClass = '';
-  }
-  // Return the combined classes
-  return [baseThemeClass, overrideClass].filter(Boolean).join(' ');
-};
-var HarmonicThemeContext = /*#__PURE__*/React__default.createContext(DEFAULT_THEME);
-var useHarmonicTheme = function useHarmonicTheme() {
-  return React__default.useContext(HarmonicThemeContext);
-};
-var HarmonicThemeProvider = function HarmonicThemeProvider(_ref) {
-  var _ref$theme = _ref.theme,
-    theme = _ref$theme === void 0 ? DEFAULT_THEME : _ref$theme,
-    children = _ref.children;
-  var themeClass = getThemeClass(theme);
-  // Convert children to an array (assuming they accept a className prop)
-  var childrenArray = React__default.Children.toArray(children);
-  var themedChildren = childrenArray.map(function (child) {
-    return /*#__PURE__*/React__default.cloneElement(child, {
-      className: ((child.props.className || '') + " " + themeClass).trim()
-    });
-  });
-  return /*#__PURE__*/React__default.createElement(HarmonicThemeContext.Provider, {
-    value: theme
-  }, themedChildren.length === 1 ? themedChildren[0] : /*#__PURE__*/React__default.createElement(React__default.Fragment, null, themedChildren));
-};
+var ArrowWrapper = /*#__PURE__*/styled__default.div(_templateObject6$9 || (_templateObject6$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  width: 24px;\n  height: 24px;\n  cursor: pointer;\n  display: flex;\n  align-items: center;\n  justify-content: flex-center;\n\n  :hover {\n    && svg path {\n      fill: var(--base-color-primary);\n    }\n  }\n"])));
 
 var _excluded$e = ["id", "text"];
 var AnchorTabBar = function AnchorTabBar(_ref) {
@@ -6142,10 +6200,7 @@ var AnchorTabBar = function AnchorTabBar(_ref) {
     activeTab = _ref.activeTab,
     absolutePositionParams = _ref.absolutePositionParams,
     _ref$bottomBorder = _ref.bottomBorder,
-    bottomBorder = _ref$bottomBorder === void 0 ? false : _ref$bottomBorder,
-    _ref$withShadow = _ref.withShadow,
-    withShadow = _ref$withShadow === void 0 ? false : _ref$withShadow,
-    className = _ref.className;
+    bottomBorder = _ref$bottomBorder === void 0 ? false : _ref$bottomBorder;
   var tabListRef = React.useRef(null);
   var wrapperRef = React.useRef(null);
   var _useState = React.useState(activeTab || ''),
@@ -6165,15 +6220,11 @@ var AnchorTabBar = function AnchorTabBar(_ref) {
   var isSelectedItem = function isSelectedItem(id) {
     return id === selectedItem;
   };
-  var onClickTab = function onClickTab(e, id) {
+  var onClicktab = function onClicktab(e, id) {
     if (onTabClick) {
       onTabClick(e, id);
     }
     setSelectedItem(id);
-    var clickedTab = document.getElementById("tablink-" + selectedItem);
-    if (clickedTab) {
-      clickedTab.focus();
-    }
   };
   var getScrollWidth = function getScrollWidth() {
     var width = 0;
@@ -6231,19 +6282,11 @@ var AnchorTabBar = function AnchorTabBar(_ref) {
     }, 500);
   }, []);
   React.useEffect(function () {
-    if (typeof window === 'undefined') return undefined;
-    var handleResize = function handleResize() {
-      var _tabListRef$current, _tabListRef$current2;
-      var tabsIsOverflowed = (((_tabListRef$current = tabListRef.current) == null ? void 0 : _tabListRef$current.scrollWidth) || 0) > (((_tabListRef$current2 = tabListRef.current) == null ? void 0 : _tabListRef$current2.clientWidth) || 0);
-      setTabsOverflow(tabsIsOverflowed);
-      setCanScrollToRight(tabsIsOverflowed);
-    };
-    window.addEventListener('resize', handleResize);
-    handleResize(); // Initial check
-    return function () {
-      window.removeEventListener('resize', handleResize);
-    };
-  }, []);
+    var _tabListRef$current, _tabListRef$current2;
+    var tabsIsOverflowed = (((_tabListRef$current = tabListRef.current) == null ? void 0 : _tabListRef$current.scrollWidth) || 0) > (((_tabListRef$current2 = tabListRef.current) == null ? void 0 : _tabListRef$current2.clientWidth) || 0);
+    setTabsOverflow(tabsIsOverflowed);
+    setCanScrollToRight(tabsIsOverflowed);
+  }, [tabListRef]);
   React.useEffect(function () {
     var scrollTriggerCheck = function scrollTriggerCheck() {
       var elementGap = 100;
@@ -6324,13 +6367,10 @@ var AnchorTabBar = function AnchorTabBar(_ref) {
     setCanScrollToLeft(scrollLeft > LIST_ITEM_GAP);
     setCanScrollToRight(scrollLeft + clientWidth + LIST_ITEM_GAP < scrollWidth);
   };
-  var theme = useHarmonicTheme();
   return /*#__PURE__*/React__default.createElement(AnchorTabbarWrapper, {
     bottomBorder: bottomBorder,
-    withShadow: withShadow,
     ref: wrapperRef,
-    id: "AnchorTabbarWrapper",
-    className: className
+    id: "AnchorTabbarWrapper"
   }, /*#__PURE__*/React__default.createElement(TabsGrid, null, /*#__PURE__*/React__default.createElement(GridItem, {
     columnStartDesktop: tabsColumnStart,
     columnSpanDesktop: tabsColumnSpan,
@@ -6354,32 +6394,25 @@ var AnchorTabBar = function AnchorTabBar(_ref) {
       className: "anchor-tab-bar-tablink",
       id: "tablink-" + id,
       onClick: function onClick(e) {
-        return onClickTab(e, id);
+        return onClicktab(e, id);
       },
-      tabIndex: 0,
-      hoverColor: theme === exports.ThemeType.Core ? ThemeColor['primary-red'] : ThemeColor['primary-black']
+      tabIndex: 0
     }, rest), text));
   })), tabsOverflow ? (/*#__PURE__*/React__default.createElement(ArrowsContainer, {
-    withShadow: withShadow
-  }, /*#__PURE__*/React__default.createElement(ArrowWrapper, {
-    onClick: scrollToLeft,
-    disabled: !canScrollToLeft,
-    "aria-label": "Previous section",
-    role: "button"
+    fullWidth: hasTwoArrows
+  }, canScrollToLeft ? (/*#__PURE__*/React__default.createElement(ArrowWrapper, {
+    onClick: scrollToLeft
   }, /*#__PURE__*/React__default.createElement(Icon, {
     iconName: "Arrow",
     direction: "reverse"
-  })), /*#__PURE__*/React__default.createElement(ArrowWrapper, {
-    onClick: scrollToRight,
-    disabled: !canScrollToRight,
-    "aria-label": "Next section",
-    role: "button"
+  }))) : null, canScrollToRight ? (/*#__PURE__*/React__default.createElement(ArrowWrapper, {
+    onClick: scrollToRight
   }, /*#__PURE__*/React__default.createElement(Icon, {
     iconName: "Arrow"
-  })))) : null))));
+  }))) : null)) : null))));
 };
 
-var _templateObject$G, _templateObject2$v, _templateObject3$l, _templateObject4$i, _templateObject6$9, _templateObject7$6, _templateObject8$4, _templateObject9$3, _templateObject0$3;
+var _templateObject$G, _templateObject2$v, _templateObject3$l, _templateObject4$h, _templateObject6$a, _templateObject7$6, _templateObject8$3, _templateObject9$2, _templateObject0$2;
 var TitleCTAGridWrapper = /*#__PURE__*/styled__default.div(_templateObject$G || (_templateObject$G = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: ", ";\n  top: -1px;\n  background-color: var(--base-color-white);\n  z-index: ", ";\n"])), function (_ref) {
   var sticky = _ref.sticky;
   return sticky ? 'sticky' : 'initial';
@@ -6389,10 +6422,10 @@ var TitleCTAGridItem = /*#__PURE__*/styled__default.div(_templateObject3$l || (_
   var title = _ref2.title;
   return title ? 'row' : 'row-reverse';
 }, devices.tablet, devices.mobile);
-var AnchorTitle = /*#__PURE__*/styled__default.div(_templateObject4$i || (_templateObject4$i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: center;\n  min-height: var(--button-height);\n\n  h5 {\n    padding: 0;\n    margin: 0;\n  }\n\n  @media ", " {\n    & {\n      min-height: 50px;\n    }\n  }\n"])), devices.mobile);
-var ButtonsDesktopWrapper = /*#__PURE__*/styled__default.div(_templateObject6$9 || (_templateObject6$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  justify-content: flex-end;\n\n  @media ", " {\n    display: none;\n  }\n\n  a {\n    width: max-content;\n  }\n"])), devices.mobile);
+var AnchorTitle = /*#__PURE__*/styled__default.div(_templateObject4$h || (_templateObject4$h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: center;\n  min-height: var(--button-height);\n\n  h5 {\n    padding: 0;\n    margin: 0;\n  }\n\n  @media ", " {\n    & {\n      min-height: 50px;\n    }\n  }\n"])), devices.mobile);
+var ButtonsDesktopWrapper = /*#__PURE__*/styled__default.div(_templateObject6$a || (_templateObject6$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  justify-content: flex-end;\n\n  @media ", " {\n    display: none;\n  }\n\n  a {\n    width: max-content;\n  }\n"])), devices.mobile);
 var ButtonsMobileWrapper = /*#__PURE__*/styled__default.div(_templateObject7$6 || (_templateObject7$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: none;\n\n  @media ", " {\n    & {\n      display: block;\n    }\n  }\n"])), devices.mobile);
-var PrimaryButtonReverse = /*#__PURE__*/styled__default(PrimaryButton)(_templateObject8$4 || (_templateObject8$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  && {\n    background-color: ", ";\n    border-color: ", ";\n    color: ", ";\n    svg path {\n      fill: ", ";\n    }\n  }\n"])), function (_ref3) {
+var PrimaryButtonReverse = /*#__PURE__*/styled__default(PrimaryButton)(_templateObject8$3 || (_templateObject8$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  && {\n    background-color: ", ";\n    border-color: ", ";\n    color: ", ";\n    svg path {\n      fill: ", ";\n    }\n  }\n"])), function (_ref3) {
   var theme = _ref3.theme;
   return theme.colors.primaryButtonReverseBg;
 }, function (_ref4) {
@@ -6405,8 +6438,8 @@ var PrimaryButtonReverse = /*#__PURE__*/styled__default(PrimaryButton)(_template
   var theme = _ref6.theme;
   return theme.colors.primaryButtonReverse;
 });
-var MessageWrapper = /*#__PURE__*/styled__default.div(_templateObject9$3 || (_templateObject9$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: center;\n  margin-right: var(--grid-outer-margin);\n  height: var(--button-height);\n\n  h6 {\n    margin: 0;\n    padding: 0;\n  }\n\n  @media ", " {\n    & {\n      margin-right: var(--grid-margin);\n    }\n  }\n\n  @media ", " {\n    & {\n      display: none;\n    }\n  }\n"])), devices.tablet, devices.mobile);
-var MessageWrapperMobile = /*#__PURE__*/styled__default.div(_templateObject0$3 || (_templateObject0$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  h6 {\n    margin: 0;\n    padding: 0;\n  }\n  display: none;\n\n  @media ", " {\n    & {\n      display: flex;\n      align-items: center;\n      margin-left: var(--grid-margin);\n      padding: 12px 0;\n    }\n  }\n"])), devices.mobile);
+var MessageWrapper = /*#__PURE__*/styled__default.div(_templateObject9$2 || (_templateObject9$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: center;\n  margin-right: var(--grid-outer-margin);\n  height: var(--button-height);\n\n  h6 {\n    margin: 0;\n    padding: 0;\n  }\n\n  @media ", " {\n    & {\n      margin-right: var(--grid-margin);\n    }\n  }\n\n  @media ", " {\n    & {\n      display: none;\n    }\n  }\n"])), devices.tablet, devices.mobile);
+var MessageWrapperMobile = /*#__PURE__*/styled__default.div(_templateObject0$2 || (_templateObject0$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  h6 {\n    margin: 0;\n    padding: 0;\n  }\n  display: none;\n\n  @media ", " {\n    & {\n      display: flex;\n      align-items: center;\n      margin-left: var(--grid-margin);\n      padding: 12px 0;\n    }\n  }\n"])), devices.mobile);
 
 var _excluded$f = ["text"],
   _excluded2$1 = ["text"];
@@ -7008,12 +7041,12 @@ var Theme = function Theme(_ref) {
 };
 
 var _templateObject$I;
-var TextContainer$1 = /*#__PURE__*/styled__default.div(_templateObject$I || (_templateObject$I = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: var(--color-base-black);\n  font-feature-settings: var(--font-feature-settings-body);\n  text-transform: var(--text-transform-body);\n\n  & h1,\n  h2,\n  h3,\n  h4 {\n    font-feature-settings: var(--font-feature-settings-header);\n    text-transform: var(--text-transform-header);\n    white-space: break-spaces;\n    overflow-wrap: break-word;\n    margin: 60px 0 16px;\n\n    + p {\n      margin-top: 0px;\n    }\n  }\n\n  & h5,\n  h6 {\n    font-feature-settings: var(--font-feature-settings-subtitle);\n    text-transform: var(--text-transform-subtitle);\n    white-space: break-spaces;\n    overflow-wrap: break-word;\n    margin: 60px 0 16px;\n\n    + p {\n      margin-top: 10px;\n    }\n  }\n\n  & a {\n    color: var(--color-base-black);\n    text-decoration: underline;\n    cursor: pointer;\n\n    &:hover {\n      color: var(--color-rbo-black-hovered);\n    }\n\n    &:active {\n      color: var(--color-rbo-black-pressed);\n    }\n  }\n\n  p {\n    margin: 30px 0;\n  }\n\n  p:has(+ ul),\n  p:has(+ ol) {\n    margin-bottom: 12px;\n  }\n\n  & ul,\n  & ol {\n    padding: 0;\n    list-style: none;\n    margin-block-start: 0;\n    margin-block-end: 0;\n  }\n\n  & ul li,\n  & ol li {\n    line-height: var(--line-height-listing);\n    position: relative;\n    padding-left: 32px;\n\n    @media ", " {\n      padding-left: 28px;\n    }\n  }\n\n  & ul > li:before {\n    display: inline-block;\n    content: '\u2014';\n    position: absolute;\n    left: 0;\n    width: 20px;\n    text-align: right;\n    margin-right: 12px;\n\n    @media ", " {\n      width: 16px;\n      margin-right: 12px;\n    }\n  }\n\n  & ol {\n    counter-reset: custom-ol;\n  }\n\n  & ol > li {\n    counter-increment: custom-ol;\n  }\n\n  & ol > li::before {\n    content: counter(custom-ol, decimal-leading-zero) '';\n    position: absolute;\n    left: 0;\n    min-width: 20px;\n    text-align: right;\n    margin-right: 12px;\n    display: inline-block;\n\n    @media ", " {\n      min-width: 16px;\n      margin-right: 12px;\n    }\n  }\n"])), devices.mobile, devices.mobile, devices.mobile);
+var TextContainer$1 = /*#__PURE__*/styled__default.div(_templateObject$I || (_templateObject$I = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  font-size: var(--font-size-body-1);\n  font-family: var(--font-family-body);\n  font-feature-settings: var(--font-feature-settings-body);\n  font-weight: var(--font-weight-body-1);\n  letter-spacing: var(--letter-spacing-body-1);\n  line-height: var(--line-height-body-1);\n  text-transform: var(--text-transform-body);\n\n  & h1,\n  h2,\n  h3,\n  h4 {\n    font-size: var(--font-size-header-4);\n    font-family: var(--font-family-header);\n    font-feature-settings: var(--font-feature-settings-header);\n    font-weight: var(--font-weight-header-4);\n    letter-spacing: var(--letter-spacing-header-4);\n    line-height: var(--line-height-header-4);\n    text-transform: var(--text-transform-header);\n    white-space: break-spaces;\n    overflow-wrap: break-word;\n    margin: 80px 0 16px;\n\n    @media ", " {\n      margin-top: 60px;\n    }\n\n    + p {\n      margin-top: 0px;\n    }\n  }\n\n  & h5,\n  h6 {\n    font-size: var(--font-size-subtitle-1);\n    font-family: var(--font-family-subtitle);\n    font-feature-settings: var(--font-feature-settings-subtitle);\n    font-weight: var(--font-weight-subtitle-1);\n    letter-spacing: var(--letter-spacing-subtitle-1);\n    line-height: var(--line-height-subtitle-1);\n    text-transform: var(--text-transform-subtitle);\n    white-space: break-spaces;\n    overflow-wrap: break-word;\n    margin: 80px 0 16px;\n\n    @media ", " {\n      margin-top: 60px;\n    }\n\n    + p {\n      margin-top: 10px;\n    }\n  }\n\n  & a {\n    color: ", ";\n    text-decoration: underline;\n    cursor: pointer;\n  }\n\n  p {\n    margin: 30px 0;\n  }\n\n  & em {\n    font-family: var(--font-family-body-italics);\n  }\n\n  & strong {\n    font-weight: bold;\n  }\n\n  & u {\n    font-size: var(--font-size-body-1);\n    font-family: var(--font-family-body);\n  }\n\n  & ul {\n    padding: 0;\n    list-style: none;\n    margin: 0 0 0 30px;\n\n    li {\n      text-indent: -20px;\n      line-height: var(--line-height-listing);\n    }\n  }\n\n  & ol {\n    padding: 0;\n    margin: 0 0 0 20px;\n\n    li {\n      line-height: var(--line-height-listing);\n    }\n  }\n\n  & ul > li:before {\n    display: inline-block;\n    content: '\u2014';\n    width: 0px;\n    margin-left: 12px;\n    margin-right: 8px;\n  }\n"])), devices.mobileAndTablet, devices.mobileAndTablet, function (_ref) {
+  var theme = _ref.theme;
+  return theme.colors.primary;
+});
 
-var addTypographyClasses = function addTypographyClasses(html) {
-  return html.replace(/<h1>/g, "<h1 class=\"" + typographyStyles.header + " " + typographyStyles['header--large'] + "\">").replace(/<h2>/g, "<h2 class=\"" + typographyStyles.header + " " + typographyStyles['header--large'] + "\">").replace(/<h3>/g, "<h3 class=\"" + typographyStyles.header + " " + typographyStyles['header--medium'] + "\">").replace(/<h4>/g, "<h4 class=\"" + typographyStyles.header + " " + typographyStyles['header--medium'] + "\">").replace(/<h5>/g, "<h5 class=\"" + typographyStyles.header + " " + typographyStyles['header--small'] + "\">").replace(/<h6>/g, "<h6 class=\"" + typographyStyles.header + " " + typographyStyles['header--small'] + "\">");
-};
-var BodyContent = function BodyContent(_ref) {
+var TextOnly = function TextOnly(_ref) {
   var _ref$text = _ref.text,
     text = _ref$text === void 0 ? '' : _ref$text,
     _ref$columnStartDeskt = _ref.columnStartDesktop,
@@ -7023,42 +7056,51 @@ var BodyContent = function BodyContent(_ref) {
     _ref$columnStartDevic = _ref.columnStartDevice,
     columnStartDevice = _ref$columnStartDevic === void 0 ? 2 : _ref$columnStartDevic,
     _ref$columnSpanDevice = _ref.columnSpanDevice,
-    columnSpanDevice = _ref$columnSpanDevice === void 0 ? 12 : _ref$columnSpanDevice,
-    className = _ref.className;
-  return /*#__PURE__*/React__default.createElement(Grid, {
-    className: className
-  }, /*#__PURE__*/React__default.createElement(GridItem, {
+    columnSpanDevice = _ref$columnSpanDevice === void 0 ? 12 : _ref$columnSpanDevice;
+  return /*#__PURE__*/React__default.createElement(Grid, null, /*#__PURE__*/React__default.createElement(GridItem, {
     columnStartDesktop: columnStartDesktop,
     columnSpanDesktop: columnSpanDesktop,
     columnStartDevice: columnStartDevice,
     columnSpanDevice: columnSpanDevice
   }, /*#__PURE__*/React__default.createElement(TextContainer$1, {
-    "data-testid": "text-container",
-    className: typographyStyles.bodycopy + " " + typographyStyles['bodycopy--large'],
     dangerouslySetInnerHTML: {
-      __html: addTypographyClasses(text)
+      __html: text
     }
   })));
 };
 
-var _templateObject$J, _templateObject2$x, _templateObject3$n, _templateObject4$j, _templateObject5$e, _templateObject6$a, _templateObject7$7, _templateObject8$5;
+/* eslint-disable no-shadow */
+(function (CarouselType) {
+  CarouselType["Image"] = "image";
+  CarouselType["SmallCard"] = "SmallCard";
+  CarouselType["LargeCard"] = "LargeCard";
+})(exports.CarouselType || (exports.CarouselType = {}));
+
+// eslint-disable-next-line no-shadow
+(function (ButtonType) {
+  ButtonType["Primary"] = "Primary";
+  ButtonType["Secondary"] = "Secondary";
+  ButtonType["Tertiary"] = "Tertiary";
+})(exports.ButtonType || (exports.ButtonType = {}));
+
+var _templateObject$J, _templateObject2$x, _templateObject3$n, _templateObject4$i, _templateObject5$d, _templateObject6$b, _templateObject7$7, _templateObject8$4;
 var Wrapper$2 = /*#__PURE__*/styled__default.div(_templateObject$J || (_templateObject$J = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  background-color: var(--base-color-lightgrey);\n  padding: 40px;\n\n  display: block;\n  position: relative;\n\n  @media ", " {\n    margin-top: 0;\n    padding: 40px 20px;\n  }\n"])), devices.tablet);
 var PromoLabelWrapper = /*#__PURE__*/styled__default.div(_templateObject2$x || (_templateObject2$x = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: row;\n  justify-content: flex-end;\n  align-self: flex-end;\n  height: 15px;\n"])));
 var PromoLabel = /*#__PURE__*/styled__default.div(_templateObject3$n || (_templateObject3$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  background: ", ";\n  color: ", ";\n  padding: 6px 8px;\n  width: fit-content;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  position: absolute;\n  right: 20px;\n  top: 0;\n  width: auto;\n  margin: auto;\n  font-family: var(--font-family-header);\n  font-feature-settings:\n    'tnum' on,\n    'lnum' on,\n    'liga' off,\n    'calt' off;\n  font-size: var(--font-size-overline-2);\n  line-height: 12px;\n  text-align: center;\n  letter-spacing: 1px;\n  text-transform: uppercase;\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.colors.primary;
 }, exports.Colors.White);
-var ButtonContainer = /*#__PURE__*/styled__default.div(_templateObject4$j || (_templateObject4$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin-top: 2em;\n  width: fit-content;\n  display: flex;\n  flex-direction: row;\n  gap: 20px;\n\n  @media ", " {\n    width: 100%;\n    flex-direction: column;\n    gap: 16px;\n  }\n\n  ", "\n"])), function (_ref2) {
+var ButtonContainer = /*#__PURE__*/styled__default.div(_templateObject4$i || (_templateObject4$i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin-top: 2em;\n  width: fit-content;\n  display: flex;\n  flex-direction: row;\n  gap: 20px;\n\n  @media ", " {\n    width: 100%;\n    flex-direction: column;\n    gap: 16px;\n  }\n\n  ", "\n"])), function (_ref2) {
   var stackCtasEarly = _ref2.stackCtasEarly;
   return stackCtasEarly ? devices.smallDesktop + ", " + devices.mobileAndTablet : devices.mobile;
 }, function (_ref3) {
   var stackCtasEarly = _ref3.stackCtasEarly;
   return stackCtasEarly && "\n      @media " + devices.smallDesktop + ", " + devices.mobileAndTablet + " {\n        * {\n          width: 100%;\n        }\n      }\n    ";
 });
-var TitleContainer$2 = /*#__PURE__*/styled__default.div(_templateObject5$e || (_templateObject5$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  & > * {\n    margin-top: 0;\n    margin-bottom: 0.5em;\n  }\n"])));
-var OfferTextWrapper = /*#__PURE__*/styled__default.div(_templateObject6$a || (_templateObject6$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  & > * {\n    margin-bottom: 0.5em;\n  }\n  margin-bottom: 1em;\n"])));
+var TitleContainer$2 = /*#__PURE__*/styled__default.div(_templateObject5$d || (_templateObject5$d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  & > * {\n    margin-top: 0;\n    margin-bottom: 0.5em;\n  }\n"])));
+var OfferTextWrapper = /*#__PURE__*/styled__default.div(_templateObject6$b || (_templateObject6$b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  & > * {\n    margin-bottom: 0.5em;\n  }\n  margin-bottom: 1em;\n"])));
 var PriceRow = /*#__PURE__*/styled__default.div(_templateObject7$7 || (_templateObject7$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-wrap: wrap;\n  gap: 6px 12px;\n  padding: 5px 0 8px 0;\n"])));
-var LineThrough = /*#__PURE__*/styled__default.div(_templateObject8$5 || (_templateObject8$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  text-decoration-line: line-through;\n  color: var(--base-color-darkgrey);\n"])));
+var LineThrough = /*#__PURE__*/styled__default.div(_templateObject8$4 || (_templateObject8$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  text-decoration-line: line-through;\n  color: var(--base-color-darkgrey);\n"])));
 
 // Set max. character length
 var setMaxCharLength = function setMaxCharLength(value, maxLength) {
@@ -7186,7 +7228,7 @@ var UpsellSection = function UpsellSection(_ref) {
     columnSpanSmallDevice: 14
   }, /*#__PURE__*/React__default.createElement(UpsellBorderBox, null, /*#__PURE__*/React__default.createElement(TitleContainer$1, null, /*#__PURE__*/React__default.createElement(AltHeader, {
     level: 4
-  }, title)), /*#__PURE__*/React__default.createElement(TextContainer, null, /*#__PURE__*/React__default.createElement(BodyContent, {
+  }, title)), /*#__PURE__*/React__default.createElement(TextContainer, null, /*#__PURE__*/React__default.createElement(TextOnly, {
     text: richText != null ? richText : '',
     columnStartDesktop: 1,
     columnSpanDesktop: 14,
@@ -7200,10 +7242,10 @@ var UpsellSection = function UpsellSection(_ref) {
 };
 
 var _templateObject$L, _templateObject2$y;
-var StickyBarWrapper = /*#__PURE__*/styled__default.div(_templateObject$L || (_templateObject$L = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  top: 0;\n  position: sticky;\n  z-index: ", ";\n  background-color: var(--color-base-white);\n"])), zIndexes.anchor);
+var StickyBarWrapper = /*#__PURE__*/styled__default.div(_templateObject$L || (_templateObject$L = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  top: 0;\n  position: sticky;\n  z-index: ", ";\n  background-color: var(--base-color-white);\n"])), zIndexes.anchor);
 var StickyBarGrid = /*#__PURE__*/styled__default(Grid)(_templateObject2$y || (_templateObject2$y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  ", "\n  padding: 28px 0 26px;\n\n  @media ", " {\n    padding: 24px 0 28px;\n  }\n\n  @media ", " {\n    border-bottom: none;\n  }\n"])), function (_ref) {
-  var bottomBorder = _ref.bottomBorder;
-  return bottomBorder && 'border-bottom: 1px solid var(--color-base-light-grey);';
+  var hideBottomBorder = _ref.hideBottomBorder;
+  return !hideBottomBorder && 'border-bottom: 2px solid var(--base-color-light-grey);';
 }, devices.mobileAndTablet, devices.mobile);
 
 var StickyBar = function StickyBar(_ref) {
@@ -7215,15 +7257,12 @@ var StickyBar = function StickyBar(_ref) {
     columnStartDevice = _ref$columnStartDevic === void 0 ? 2 : _ref$columnStartDevic,
     _ref$columnSpanDevice = _ref.columnSpanDevice,
     columnSpanDevice = _ref$columnSpanDevice === void 0 ? 12 : _ref$columnSpanDevice,
-    _ref$bottomBorder = _ref.bottomBorder,
-    bottomBorder = _ref$bottomBorder === void 0 ? true : _ref$bottomBorder,
-    children = _ref.children,
-    className = _ref.className;
+    hideBottomBorder = _ref.hideBottomBorder,
+    children = _ref.children;
   return /*#__PURE__*/React__default.createElement(StickyBarWrapper, {
-    "data-testid": "sticky-bar-block",
-    className: className
+    "data-testid": "sticky-bar-block"
   }, /*#__PURE__*/React__default.createElement(StickyBarGrid, {
-    bottomBorder: bottomBorder
+    hideBottomBorder: hideBottomBorder != null ? hideBottomBorder : false
   }, /*#__PURE__*/React__default.createElement(GridItem, {
     columnStartDesktop: columnStartDesktop,
     columnSpanDesktop: columnSpanDesktop,
@@ -7232,11 +7271,11 @@ var StickyBar = function StickyBar(_ref) {
   }, children)));
 };
 
-var _templateObject$M, _templateObject2$z, _templateObject3$o, _templateObject4$k;
+var _templateObject$M, _templateObject2$z, _templateObject3$o, _templateObject4$j;
 var InnerModal = /*#__PURE__*/styled__default.div(_templateObject$M || (_templateObject$M = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  padding: 62px;\n  background-color: var(--base-color-white);\n  z-index: ", ";\n  position: relative;\n\n  @media ", ", ", " {\n    height: 100vh;\n    padding: 62px 0 0;\n  }\n"])), zIndexes.popup, devices.smallMobile, devices.mobile);
 var CloseButton = /*#__PURE__*/styled__default.button(_templateObject2$z || (_templateObject2$z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: absolute;\n  top: 0;\n  right: 0;\n  margin: 15px;\n  height: 26px;\n  width: 26px;\n  padding: 0;\n  background-color: transparent;\n  border: none;\n  cursor: pointer;\n  @media ", " {\n    margin: 25px;\n  }\n  @media ", ", ", " {\n    margin: 30px;\n  }\n"])), devices.tablet, devices.desktop, devices.largeDesktop);
 var ContentWrapper = /*#__PURE__*/styled__default.div(_templateObject3$o || (_templateObject3$o = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
-var Overlay = /*#__PURE__*/styled__default(Grid)(_templateObject4$k || (_templateObject4$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: fixed;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100vh;\n  align-content: center;\n  background-color: rgba(0, 0, 0, 0.4);\n"])));
+var Overlay = /*#__PURE__*/styled__default(Grid)(_templateObject4$j || (_templateObject4$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: fixed;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100vh;\n  align-content: center;\n  background-color: rgba(0, 0, 0, 0.4);\n"])));
 
 var _excluded$g = ["isOpen", "setIsOpen", "children", "appElementId"];
 var MAX_Z_INDEX = 9999999999;
@@ -7413,8 +7452,8 @@ var getImageSlideStyles = function getImageSlideStyles(imageHeight) {
   return "height: calc(" + imageHeight + "px + var(--carousel-image-caption-height) + 12px);";
 };
 
-var _templateObject$N, _templateObject2$A, _templateObject3$p, _templateObject4$l, _templateObject5$f, _templateObject6$b, _templateObject7$8, _templateObject8$6, _templateObject9$4;
-var ImageCarouselWrapper = /*#__PURE__*/styled__default.div(_templateObject$N || (_templateObject$N = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  ", "\n\n  @media ", " {\n    ", "\n  }}\n  \n  &:fullscreen {\n    background: var(--color-base-white);\n    padding-top: 44px;\n    padding-bottom: 84px;\n\n    .swipe-slide > figure {\n       height: var(--fullscreen-figure-height);\n    }\n  }\n"])), function (_ref) {
+var _templateObject$N, _templateObject2$A, _templateObject3$p, _templateObject4$k, _templateObject5$e, _templateObject6$c, _templateObject7$8, _templateObject8$5;
+var ImageCarouselWrapper = /*#__PURE__*/styled__default.div(_templateObject$N || (_templateObject$N = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  ", "\n\n  @media ", " {\n    ", "\n  }}\n"])), function (_ref) {
   var imagesHeightDesktop = _ref.imagesHeightDesktop;
   return "& {\n      .swipe-slide {\n        height: fit-content;\n        width: auto;\n        margin-right: var(--grid-column-gap);\n\n        > figure {\n          margin: 0px;\n          " + getImageSlideStyles(imagesHeightDesktop) + "\n        }\n      }\n    }";
 }, devices.mobile, function (_ref2) {
@@ -7427,15 +7466,14 @@ var CardsCarouselWrapper = /*#__PURE__*/styled__default.div(_templateObject2$A |
   return "\n      & {\n        .swipe-slide {\n          " + getCardSlideDesktopStyles(type, isActive) + "\n        }\n      }\n\n      @media " + devices.tablet + " {\n        & {\n          .swipe-slide {\n            width: " + (type === exports.CarouselType.SmallCard ? '30%' : '40%') + ";\n          }\n        }\n      }\n    ";
 }, devices.mobile, /*#__PURE__*/getCardSlideMobileStyles());
 var TitleButtonsGrid = /*#__PURE__*/styled__default(Grid)(_templateObject3$p || (_templateObject3$p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin-bottom: 28px;\n\n  @media ", " {\n    padding-bottom: 0;\n  }\n\n  @media ", " {\n    margin-bottom: 20px;\n  }\n"])), devices.mobile, devices.mobile);
-var CarouselInfoWrapper = /*#__PURE__*/styled__default.div(_templateObject4$l || (_templateObject4$l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  user-select: text;\n"])));
-var TitleWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject5$f || (_templateObject5$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  ", ";\n"])), function (_ref4) {
+var CarouselInfoWrapper = /*#__PURE__*/styled__default.div(_templateObject4$k || (_templateObject4$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  user-select: text;\n"])));
+var TitleWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject5$e || (_templateObject5$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  ", ";\n"])), function (_ref4) {
   var isDescriptionPresent = _ref4.isDescriptionPresent;
   return isDescriptionPresent && 'margin: 20px 0';
 });
-var TitleText = /*#__PURE__*/styled__default(HarmonicHeader)(_templateObject6$b || (_templateObject6$b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  overflow: hidden;\n  display: -webkit-box;\n  -webkit-line-clamp: 2;\n  -webkit-box-orient: vertical;\n  text-overflow: ellipsis;\n"])));
-var ButtonsWrapper = /*#__PURE__*/styled__default.div(_templateObject7$8 || (_templateObject7$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  justify-content: flex-end;\n  align-items: start;\n"])));
-var TitleGridItem = /*#__PURE__*/styled__default(GridItem)(_templateObject8$6 || (_templateObject8$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  @media ", " {\n    grid-column: 2 / span 10;\n  }\n"])), devices.tablet);
-var SwipeGridWrapper = /*#__PURE__*/styled__default(GridItem)(_templateObject9$4 || (_templateObject9$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  ", ";\n\n  @media ", " {\n    grid-column: ", ";\n  }\n\n  @media ", " {\n    grid-column: 2 / span 13;\n  }\n"])), function (_ref5) {
+var ButtonsWrapper = /*#__PURE__*/styled__default.div(_templateObject6$c || (_templateObject6$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  justify-content: flex-end;\n  align-items: start;\n\n  @media ", " {\n    display: none;\n  }\n"])), devices.mobile);
+var TitleGridItem = /*#__PURE__*/styled__default(GridItem)(_templateObject7$8 || (_templateObject7$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  @media ", " {\n    grid-column: 2 / span 10;\n  }\n"])), devices.tablet);
+var SwipeGridWrapper = /*#__PURE__*/styled__default(GridItem)(_templateObject8$5 || (_templateObject8$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  ", ";\n\n  @media ", " {\n    grid-column: ", ";\n  }\n\n  @media ", " {\n    grid-column: 2 / span 13;\n  }\n"])), function (_ref5) {
   var active = _ref5.active;
   return active ? 'grid-column: 1 / span 16' : '';
 }, devices.tablet, function (_ref6) {
@@ -7782,7 +7820,6 @@ var GRID_OFFSET_MARGIN = {
   tablet: 15,
   desktop: 3
 };
-var FULLSCREEN_FIGCAPTION_HEIGHT = 34;
 var Carousel = function Carousel(_ref) {
   var children = _ref.children,
     type = _ref.type,
@@ -7800,39 +7837,12 @@ var Carousel = function Carousel(_ref) {
     _ref$useOffset = _ref.useOffset,
     useOffset = _ref$useOffset === void 0 ? true : _ref$useOffset;
   var _useState = React.useState(false),
-    isFullscreen = _useState[0],
-    setIsFullscreen = _useState[1];
-  var _useState2 = React.useState(false),
-    active = _useState2[0],
-    setActive = _useState2[1];
-  var _useState3 = React.useState(0),
-    slidesOffsetBefore = _useState3[0],
-    setSlidesOffsetBefore = _useState3[1];
+    active = _useState[0],
+    setActive = _useState[1];
+  var _useState2 = React.useState(0),
+    slidesOffsetBefore = _useState2[0],
+    setSlidesOffsetBefore = _useState2[1];
   var swipeRef = React.useRef(null);
-  var carouselRef = React.useRef(null);
-  var titleButtonsGridRef = React.useRef(null);
-  React.useEffect(function () {
-    if (type !== exports.CarouselType.Image) return undefined;
-    var handleFullscreenChange = function handleFullscreenChange() {
-      var isFs = document.fullscreenElement === carouselRef.current;
-      setIsFullscreen(isFs);
-      if (isFs && titleButtonsGridRef.current && carouselRef.current) {
-        var _titleButtonsGridRef$, _carouselRef$current;
-        var carouselStyle = getComputedStyle(carouselRef.current);
-        var paddingTop = parseInt(carouselStyle.paddingTop, 10) || 0;
-        var paddingBottom = parseInt(carouselStyle.paddingBottom, 10) || 0;
-        var titleButtonsGridHeight = ((_titleButtonsGridRef$ = titleButtonsGridRef.current) == null ? void 0 : _titleButtonsGridRef$.getBoundingClientRect().height) || 0;
-        var titleButtonsGridStyle = getComputedStyle(titleButtonsGridRef.current);
-        var titleButtonsGridMarginBottom = parseInt(titleButtonsGridStyle.marginBottom, 10) || 0;
-        var height = window.screen.height - titleButtonsGridHeight - titleButtonsGridMarginBottom - FULLSCREEN_FIGCAPTION_HEIGHT - paddingTop - paddingBottom;
-        (_carouselRef$current = carouselRef.current) == null || _carouselRef$current.style.setProperty('--fullscreen-figure-height', height + "px");
-      }
-    };
-    document.addEventListener('fullscreenchange', handleFullscreenChange);
-    return function () {
-      document.removeEventListener('fullscreenchange', handleFullscreenChange);
-    };
-  }, []);
   React.useEffect(function () {
     if (!useOffset || !active) return undefined;
     var updateWindowDimensions = function updateWindowDimensions() {
@@ -7858,13 +7868,6 @@ var Carousel = function Carousel(_ref) {
     var _swipeRef$current2;
     (_swipeRef$current2 = swipeRef.current) == null || _swipeRef$current2.prevSlide();
   };
-  var onClickFullscreen = function onClickFullscreen() {
-    if (!isFullscreen && carouselRef.current) {
-      carouselRef.current.requestFullscreen();
-    } else if (isFullscreen) {
-      document.exitFullscreen();
-    }
-  };
   var onActiveChangeHandler = function onActiveChangeHandler(value) {
     if (useOffset && !active) {
       setActive(value);
@@ -7880,21 +7883,18 @@ var Carousel = function Carousel(_ref) {
     imagesHeightDevice: imagesHeightDevice,
     imagesHeightDesktop: imagesHeightDesktop,
     role: "region",
-    "aria-labelledby": carouselTitleId,
-    ref: carouselRef
-  }, /*#__PURE__*/React__default.createElement(TitleButtonsGrid, {
-    ref: titleButtonsGridRef
-  }, /*#__PURE__*/React__default.createElement(TitleGridItem, {
+    "aria-labelledby": carouselTitleId
+  }, /*#__PURE__*/React__default.createElement(TitleButtonsGrid, null, /*#__PURE__*/React__default.createElement(TitleGridItem, {
     columnStartDesktop: 3,
     columnSpanDesktop: 10,
     columnStartDevice: 2,
-    columnSpanDevice: 9
+    columnSpanDevice: 12
   }, title && (/*#__PURE__*/React__default.createElement(CarouselInfoWrapper, {
     "data-testid": "carousel-title-wrapper"
   }, /*#__PURE__*/React__default.createElement(TitleWrapper$1, {
     id: carouselTitleId,
     isDescriptionPresent: !!description
-  }, /*#__PURE__*/React__default.createElement(TitleText, {
+  }, /*#__PURE__*/React__default.createElement(HarmonicHeader, {
     size: "medium",
     serif: true,
     hierarchy: titleSemanticLevelValue
@@ -7903,17 +7903,14 @@ var Carousel = function Carousel(_ref) {
   }, description)))), /*#__PURE__*/React__default.createElement(GridItem, {
     columnStartDesktop: 14,
     columnSpanDesktop: 2,
-    columnStartDevice: 13,
+    columnStartDevice: 12,
     columnSpanDevice: 2
   }, /*#__PURE__*/React__default.createElement(ButtonsWrapper, {
     "data-testid": "carousel-buttons-wrapper"
   }, /*#__PURE__*/React__default.createElement(RotatorButtons, {
     onClickNext: onNext,
     onClickPrev: onPrev,
-    availablePrev: true,
-    showFullscreen: type === exports.CarouselType.Image,
-    onClickFullscreen: onClickFullscreen,
-    isFullscreen: isFullscreen
+    availablePrev: true
   })))), /*#__PURE__*/React__default.createElement(Grid, null, /*#__PURE__*/React__default.createElement(SwipeGridWrapper, {
     active: active,
     columnStartDesktop: 3,
@@ -7931,17 +7928,17 @@ var Carousel = function Carousel(_ref) {
   }, children))));
 };
 
-var _templateObject$P, _templateObject2$C, _templateObject3$q, _templateObject4$m, _templateObject5$g, _templateObject6$c, _templateObject7$9, _templateObject8$7, _templateObject9$5, _templateObject0$4, _templateObject1$1, _templateObject10$1, _templateObject11$1, _templateObject12$1, _templateObject13$1, _templateObject14, _templateObject15;
+var _templateObject$P, _templateObject2$C, _templateObject3$q, _templateObject4$l, _templateObject5$f, _templateObject6$d, _templateObject7$9, _templateObject8$6, _templateObject9$3, _templateObject0$3, _templateObject1$1, _templateObject10$1, _templateObject11$1, _templateObject12$1, _templateObject13$1, _templateObject14, _templateObject15;
 var HighlightsGrid = /*#__PURE__*/styled__default(Grid)(_templateObject$P || (_templateObject$P = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: relative;\n  grid-template-rows: max-content minmax(0, 1fr);\n  gap: 0 var(--grid-column-gap);\n  background-color: var(--color-base-black);\n  user-select: none;\n\n  .highlight-carousel-text {\n    color: var(--color-base-white);\n  }\n\n  @media ", " {\n    & {\n      grid-template-rows: min-content max-content max-content;\n    }\n  }\n"])), devices.mobile);
 var CarouselTitleWrapper = /*#__PURE__*/styled__default.div(_templateObject2$C || (_templateObject2$C = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  grid-area: 1 / 1 / 1 / 7;\n  box-sizing: border-box;\n  width: calc(100% + var(--grid-column-gap));\n  padding-top: 40px;\n  padding-left: 50px;\n  padding-right: 36px;\n  user-select: text;\n\n  @media ", " {\n    & {\n      grid-area: 1 / 1 / 2 / 12;\n      padding: 12px 0 12px var(--grid-margin);\n      min-height: 64px;\n      box-sizing: border-box;\n      width: 100%;\n    }\n  }\n\n  @media ", " {\n    & {\n      grid-area: 1 / 1 / 2 / 11;\n      width: 100%;\n      padding: 8px 0 8px 20px;\n      min-height: 28px;\n    }\n  }\n"])), devices.tablet, devices.mobile);
 var HeaderWrapper = /*#__PURE__*/styled__default.div(_templateObject3$q || (_templateObject3$q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin: 0;\n  padding: 0;\n"])));
-var InfoWrapper = /*#__PURE__*/styled__default.div(_templateObject4$m || (_templateObject4$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  grid-area: 2 / 1 / 2 / 7;\n  box-sizing: border-box;\n  width: calc(100% + var(--grid-column-gap));\n  align-self: center;\n  padding: 36px 36px 36px 50px;\n\n  @media ", " {\n    & {\n      grid-area: 2 / 1 / 2 / 7;\n      padding: 0 12px 12px var(--grid-margin);\n    }\n  }\n\n  @media ", " {\n    & {\n      grid-area: 3 / 1 / 4 / 15;\n      width: 100%;\n      padding: 0 20px;\n      margin: 24px 0;\n    }\n  }\n"])), devices.tablet, devices.mobile);
-var InfoLogoWrapper = /*#__PURE__*/styled__default.div(_templateObject5$g || (_templateObject5$g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin-bottom: 32px;\n  width: 132px;\n  height: 36px;\n\n  @media ", " {\n    & {\n      margin-bottom: 16px;\n      width: 102px;\n      height: 28px;\n    }\n  }\n\n  @media ", " {\n    & {\n      margin-bottom: 20px;\n      width: 102px;\n      height: 28px;\n    }\n  }\n"])), devices.tablet, devices.mobile);
-var InfoTitleWrapper = /*#__PURE__*/styled__default.div(_templateObject6$c || (_templateObject6$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  user-select: text;\n\n  h1,\n  h2,\n  h3 {\n    margin-bottom: 8px;\n  }\n"])));
+var InfoWrapper = /*#__PURE__*/styled__default.div(_templateObject4$l || (_templateObject4$l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  grid-area: 2 / 1 / 2 / 7;\n  box-sizing: border-box;\n  width: calc(100% + var(--grid-column-gap));\n  align-self: center;\n  padding: 36px 36px 36px 50px;\n\n  @media ", " {\n    & {\n      grid-area: 2 / 1 / 2 / 7;\n      padding: 0 12px 12px var(--grid-margin);\n    }\n  }\n\n  @media ", " {\n    & {\n      grid-area: 3 / 1 / 4 / 15;\n      width: 100%;\n      padding: 0 20px;\n      margin: 24px 0;\n    }\n  }\n"])), devices.tablet, devices.mobile);
+var InfoLogoWrapper = /*#__PURE__*/styled__default.div(_templateObject5$f || (_templateObject5$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin-bottom: 32px;\n  width: 132px;\n  height: 36px;\n\n  @media ", " {\n    & {\n      margin-bottom: 16px;\n      width: 102px;\n      height: 28px;\n    }\n  }\n\n  @media ", " {\n    & {\n      margin-bottom: 20px;\n      width: 102px;\n      height: 28px;\n    }\n  }\n"])), devices.tablet, devices.mobile);
+var InfoTitleWrapper = /*#__PURE__*/styled__default.div(_templateObject6$d || (_templateObject6$d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  user-select: text;\n\n  h1,\n  h2,\n  h3 {\n    margin-bottom: 8px;\n  }\n"])));
 var InfoTextWrapper = /*#__PURE__*/styled__default.div(_templateObject7$9 || (_templateObject7$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin-top: 24px;\n  user-select: text;\n\n  @media ", " {\n    & {\n      margin-top: 20px;\n    }\n  }\n"])), devices.mobileAndTablet);
-var InfoLinkWrapper = /*#__PURE__*/styled__default.div(_templateObject8$7 || (_templateObject8$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin-top: 32px;\n  display: flex;\n  flex-direction: row;\n\n  @media ", " {\n    & {\n      margin-top: 16px;\n    }\n  }\n\n  @media ", " {\n    & {\n      margin-top: 20px;\n    }\n    display: flex;\n    flex-direction: column;\n  }\n"])), devices.tablet, devices.mobile);
-var CarouselWrapper = /*#__PURE__*/styled__default.div(_templateObject9$5 || (_templateObject9$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  grid-area: 1 / 7 / 3 / 17;\n  position: relative;\n  height: 100%;\n  width: 100%;\n\n  .swipe-slide {\n    width: calc(100% - 50px - var(--rotator-button-width));\n    -webkit-transform: translate3d(0, 0, 0);\n  }\n\n  @media ", " {\n    & {\n      grid-area: 2 / 7 / 3 / 15;\n\n      .swipe-slide {\n        width: 100%;\n        -webkit-transform: translate3d(0, 0, 0);\n      }\n    }\n  }\n\n  @media ", " {\n    & {\n      grid-area: 2 / 1 / 3 / 15;\n\n      .swipe-slide {\n        width: 100%;\n        -webkit-transform: translate3d(0, 0, 0);\n      }\n    }\n  }\n"])), devices.tablet, devices.mobile);
-var RotatorButtonsWrapper = /*#__PURE__*/styled__default.div(_templateObject0$4 || (_templateObject0$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: absolute;\n  right: 50px;\n  top: calc(50% - calc(var(--rotator-button-width) / 2));\n  z-index: 2;\n\n  @media ", " {\n    & {\n      display: none;\n    }\n  }\n"])), devices.mobileAndTablet);
+var InfoLinkWrapper = /*#__PURE__*/styled__default.div(_templateObject8$6 || (_templateObject8$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin-top: 32px;\n  display: flex;\n  flex-direction: row;\n\n  @media ", " {\n    & {\n      margin-top: 16px;\n    }\n  }\n\n  @media ", " {\n    & {\n      margin-top: 20px;\n    }\n    display: flex;\n    flex-direction: column;\n  }\n"])), devices.tablet, devices.mobile);
+var CarouselWrapper = /*#__PURE__*/styled__default.div(_templateObject9$3 || (_templateObject9$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  grid-area: 1 / 7 / 3 / 17;\n  position: relative;\n  height: 100%;\n  width: 100%;\n\n  .swipe-slide {\n    width: calc(100% - 50px - var(--rotator-button-width));\n    -webkit-transform: translate3d(0, 0, 0);\n  }\n\n  @media ", " {\n    & {\n      grid-area: 2 / 7 / 3 / 15;\n\n      .swipe-slide {\n        width: 100%;\n        -webkit-transform: translate3d(0, 0, 0);\n      }\n    }\n  }\n\n  @media ", " {\n    & {\n      grid-area: 2 / 1 / 3 / 15;\n\n      .swipe-slide {\n        width: 100%;\n        -webkit-transform: translate3d(0, 0, 0);\n      }\n    }\n  }\n"])), devices.tablet, devices.mobile);
+var RotatorButtonsWrapper = /*#__PURE__*/styled__default.div(_templateObject0$3 || (_templateObject0$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: absolute;\n  right: 50px;\n  top: calc(50% - calc(var(--rotator-button-width) / 2));\n  z-index: 2;\n\n  @media ", " {\n    & {\n      display: none;\n    }\n  }\n"])), devices.mobileAndTablet);
 var RotatorButtonsWrapperMobile = /*#__PURE__*/styled__default.div(_templateObject1$1 || (_templateObject1$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: none;\n\n  @media ", " {\n    div {\n      background-color: var(--color-base-black);\n    }\n    svg path {\n      fill: var(--color-base-white);\n    }\n\n    & {\n      display: flex;\n      grid-area: 1 / 12 / 2 / 14;\n      align-self: center;\n      justify-content: flex-end;\n    }\n  }\n\n  @media ", " {\n    div {\n      background-color: var(--color-base-black);\n    }\n    svg path {\n      fill: var(--color-base-white);\n    }\n\n    & {\n      display: flex;\n      grid-area: 1 / 11 / 2 / 14;\n      align-self: center;\n      justify-content: flex-end;\n    }\n  }\n"])), devices.tablet, devices.mobile);
 var HtmlBodyText = /*#__PURE__*/styled__default.p(_templateObject10$1 || (_templateObject10$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  padding: 0;\n  margin: 0;\n"])));
 var FirstButtonComponentWrapper = /*#__PURE__*/styled__default.div(_templateObject11$1 || (_templateObject11$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin-right: 16px;\n\n  @media ", " {\n    & {\n      display: flex;\n      flex-direction: column;\n      margin-right: 0;\n      margin-bottom: 10px;\n    }\n  }\n"])), devices.mobile);
@@ -8113,30 +8110,19 @@ var InfoSection = function InfoSection(_ref) {
   }, additionalInfo)))));
 };
 
-var _templateObject$R, _templateObject2$D, _templateObject3$r, _templateObject4$n, _templateObject5$h, _templateObject6$d, _templateObject7$a;
-var AccordionContainer = /*#__PURE__*/styled__default.div(_templateObject$R || (_templateObject$R = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  div {\n    overflow: hidden;\n  }\n  border-top: 2px solid var(--color-base-light-grey);\n  border-bottom: ", ";\n"])), function (_ref) {
-  var showLine = _ref.showLine;
-  return showLine ? '2px solid var(--color-base-light-grey)' : 'none';
-});
-var ChildrenContainer = /*#__PURE__*/styled__default.div(_templateObject2$D || (_templateObject2$D = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin: 0px 20px 28px 20px;\n\n  opacity: ", ";\n  transition: opacity 0.2s ease;\n  pointer-events: ", ";\n\n\n  @media ", " {\n    margin: 12px 0px 24px 0px;\n  }\n  \n  @media print { \n    visibility: visible;\n  }\n}\n"])), function (_ref2) {
-  var isVisible = _ref2.isVisible;
-  return isVisible ? 1 : 0;
-}, function (_ref3) {
-  var isVisible = _ref3.isVisible;
-  return isVisible ? 'auto' : 'none';
+var _templateObject$R, _templateObject2$D, _templateObject3$r, _templateObject4$m, _templateObject5$g, _templateObject6$e;
+var AccordionContainer = /*#__PURE__*/styled__default.div(_templateObject$R || (_templateObject$R = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  div {\n    overflow: hidden;\n  }\n"])));
+var LineContainer = /*#__PURE__*/styled__default.div(_templateObject2$D || (_templateObject2$D = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  height: 2px;\n  background-color: var(--base-color-light-grey);\n  width: 100%;\n"])));
+var ChildrenContainer = /*#__PURE__*/styled__default.div(_templateObject3$r || (_templateObject3$r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin: 0px 20px 28px 20px;\n\n  visibility: ", ";\n\n  @media ", " {\n    margin: 12px 0px 24px 0px;\n  }\n  \n  @media print { \n    visibility: visible;\n  }\n}\n"])), function (_ref) {
+  var isVisible = _ref.isVisible;
+  return isVisible ? 'visible' : 'hidden';
 }, devices.mobile);
-var TitleContainer$3 = /*#__PURE__*/styled__default.div(_templateObject3$r || (_templateObject3$r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: row;\n  justify-content: space-between;\n  align-items: center;\n  padding-top: 28px;\n  padding-bottom: 28px;\n  color: var(--color-primary-black);\n\n  && svg {\n    width: 24px;\n    height: 24px;\n  }\n\n  :hover {\n    cursor: pointer;\n  }\n"])));
-var TitleText$1 = /*#__PURE__*/styled__default(HarmonicSubtitle)(_templateObject4$n || (_templateObject4$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: -webkit-box;\n  -webkit-line-clamp: 2;\n  -webkit-box-orient: vertical;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  max-width: calc(100% - 32px);\n"])));
-var ExtendedBodyCopyHarmonic = /*#__PURE__*/styled__default(BodyCopyHarmonic)(_templateObject5$h || (_templateObject5$h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  overflow: auto;\n  transition: max-height 0.2s ease;\n  font-feature-settings: var(--font-feature-settings-body);\n  text-transform: var(--text-transform-body);\n"])));
-var ContentContainer = /*#__PURE__*/styled__default(ExtendedBodyCopyHarmonic).withConfig({
-  shouldForwardProp: function shouldForwardProp(prop) {
-    return prop !== 'textHeight';
-  }
-})(_templateObject6$d || (_templateObject6$d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  max-height: ", ";\n\n  @media print {\n    max-height: max-content;\n  }\n\n  & em {\n    font-family: var(--font-family-body-italics);\n  }\n\n  & u {\n    font-size: var(--font-size-body-1);\n    font-family: var(--font-family-body);\n  }\n\n  @media ", " {\n    transition: 100% 0.2s ease;\n  }\n"])), function (_ref4) {
-  var textHeight = _ref4.textHeight;
+var TitleContainer$3 = /*#__PURE__*/styled__default.div(_templateObject4$m || (_templateObject4$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: row;\n  justify-content: space-between;\n  align-items: center;\n\n  && h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  h6,\n  div {\n    margin: 21px 20px;\n    white-space: break-spaces;\n    overflow-wrap: break-word;\n\n    @media ", " {\n      margin: 12px 20px 12px 0px;\n    }\n  }\n\n  && svg {\n    width: var(--navigation-middle-gap);\n    height: var(--navigation-middle-gap);\n    margin-right: 20px;\n\n    @media ", " {\n      margin-right: 0px;\n    }\n  }\n\n  :hover {\n    cursor: pointer;\n  }\n"])), devices.mobile, devices.mobile);
+var ContentContainer = /*#__PURE__*/styled__default.div(_templateObject5$g || (_templateObject5$g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  overflow: auto;\n  transition: max-height 0.2s ease;\n  font-size: var(--font-size-body-1);\n  font-family: var(--font-family-body);\n  font-feature-settings: var(--font-feature-settings-body);\n  font-weight: var(--font-weight-body-1);\n  letter-spacing: var(--letter-spacing-body-1);\n  line-height: var(--line-height-body-1);\n  text-transform: var(--text-transform-body);\n  max-height: ", ";\n\n  @media print {\n    max-height: max-content;\n  }\n\n  & h1 {\n    font-size: var(--font-size-header-4);\n    font-family: var(--font-family-header);\n    font-feature-settings: var(--font-feature-settings-header);\n    font-weight: var(--font-weight-header-4);\n    letter-spacing: var(--letter-spacing-header-4);\n    line-height: var(--line-height-header-4);\n    text-transform: var(--text-transform-header);\n    white-space: break-spaces;\n    overflow-wrap: break-word;\n  }\n\n  & h2 {\n    font-size: var(--font-size-subtitle-1);\n    font-family: var(--font-family-subtitle);\n    font-feature-settings: var(--font-feature-settings-subtitle);\n    font-weight: var(--font-weight-subtitle-1);\n    letter-spacing: var(--letter-spacing-subtitle-1);\n    line-height: var(--line-height-subtitle-1);\n    text-transform: var(--text-transform-subtitle);\n    white-space: break-spaces;\n    overflow-wrap: break-word;\n  }\n\n  & em {\n    font-family: var(--font-family-body-italics);\n  }\n\n  & u {\n    font-size: var(--font-size-body-1);\n    font-family: var(--font-family-body);\n  }\n\n  @media ", " {\n    transition: 100% 0.2s ease;\n  }\n"])), function (_ref2) {
+  var textHeight = _ref2.textHeight;
   return textHeight;
 }, devices.mobile);
-var PrintHideWrapper = /*#__PURE__*/styled__default.div(_templateObject7$a || (_templateObject7$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  @media print {\n    display: none;\n  }\n"])));
+var PrintHideWrapper = /*#__PURE__*/styled__default.div(_templateObject6$e || (_templateObject6$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  @media print {\n    display: none;\n  }\n"])));
 
 /* eslint-disable react/no-unstable-nested-components */
 var Accordion = function Accordion(_ref) {
@@ -8145,9 +8131,15 @@ var Accordion = function Accordion(_ref) {
     _ref$showLine = _ref.showLine,
     showLine = _ref$showLine === void 0 ? true : _ref$showLine,
     children = _ref.children,
+    visibleStandfirst = _ref.visibleStandfirst,
     _ref$initOpen = _ref.initOpen,
     initOpen = _ref$initOpen === void 0 ? false : _ref$initOpen,
-    className = _ref.className;
+    _ref$contentType = _ref.contentType,
+    contentType = _ref$contentType === void 0 ? 'subtitle' : _ref$contentType,
+    _ref$semanticLevel = _ref.semanticLevel,
+    semanticLevel = _ref$semanticLevel === void 0 ? 4 : _ref$semanticLevel,
+    _ref$displayLevel = _ref.displayLevel,
+    displayLevel = _ref$displayLevel === void 0 ? 1 : _ref$displayLevel;
   var _useState = React.useState(initOpen),
     openAccordion = _useState[0],
     setOpenAccordion = _useState[1];
@@ -8179,31 +8171,60 @@ var Accordion = function Accordion(_ref) {
       toggleAccordion();
     }
   };
+  var Standfirst = function Standfirst() {
+    return visibleStandfirst ? (/*#__PURE__*/React__default.createElement(ContentContainer, null, /*#__PURE__*/React__default.createElement(ChildrenContainer, {
+      isVisible: childrenVisibility
+    }, visibleStandfirst))) : null;
+  };
   var contentContainerId = title + "-accordion-content";
+  var AccordionTitle = function AccordionTitle(_ref2) {
+    var level = _ref2.level,
+      localSemanticLevel = _ref2.semanticLevel;
+    var subtitleLevel = level;
+    if (contentType === 'header') {
+      return /*#__PURE__*/React__default.createElement(Header, {
+        semanticLevel: localSemanticLevel,
+        level: level
+      }, title);
+    }
+    if (contentType === 'subtitle') {
+      if (contentType === 'subtitle') {
+        if (![1, 2].includes(level)) {
+          console.warn('Invalid Subtitle level:', level);
+          subtitleLevel = level > 2 ? 2 : level;
+        }
+      }
+      return /*#__PURE__*/React__default.createElement(Subtitle, Object.assign({}, {
+        level: subtitleLevel,
+        semanticLevel: localSemanticLevel
+      }), title);
+    }
+    return null;
+  };
   return /*#__PURE__*/React__default.createElement(AccordionContainer, {
-    showLine: showLine,
     tabIndex: 0,
-    onKeyDown: keyDown,
-    className: className
-  }, /*#__PURE__*/React__default.createElement(TitleContainer$3, {
+    onKeyDown: keyDown
+  }, /*#__PURE__*/React__default.createElement(LineContainer, null), /*#__PURE__*/React__default.createElement(TitleContainer$3, {
     onClick: toggleAccordion,
     tabIndex: -1,
     role: "button",
     "aria-label": title,
     "aria-expanded": openAccordion,
     "aria-controls": contentContainerId
-  }, /*#__PURE__*/React__default.createElement(TitleText$1, null, title), children && (/*#__PURE__*/React__default.createElement(PrintHideWrapper, null, /*#__PURE__*/React__default.createElement(Icon, {
+  }, /*#__PURE__*/React__default.createElement(AccordionTitle, {
+    level: displayLevel,
+    semanticLevel: semanticLevel
+  }, title), children && (/*#__PURE__*/React__default.createElement(PrintHideWrapper, null, /*#__PURE__*/React__default.createElement(Icon, {
     iconName: iconName
-  })))), /*#__PURE__*/React__default.createElement(ContentContainer, {
+  })))), visibleStandfirst && /*#__PURE__*/React__default.createElement(Standfirst, null), /*#__PURE__*/React__default.createElement(ContentContainer, {
     "data-testid": "richcontainer",
     ref: content,
     textHeight: textHeight,
     id: contentContainerId,
-    "aria-live": "polite",
-    tag: "div"
+    "aria-live": "polite"
   }, /*#__PURE__*/React__default.createElement(ChildrenContainer, {
     isVisible: childrenVisibility
-  }, children)));
+  }, children)), showLine && /*#__PURE__*/React__default.createElement(LineContainer, null));
 };
 
 var _templateObject$S;
@@ -8211,23 +8232,24 @@ var AccordionsContainer = /*#__PURE__*/styled__default.div(_templateObject$S ||
 
 var Accordions = function Accordions(_ref) {
   var _ref$items = _ref.items,
-    items = _ref$items === void 0 ? [] : _ref$items,
-    className = _ref.className;
+    items = _ref$items === void 0 ? [] : _ref$items;
   var isLastAccordion = function isLastAccordion(index) {
     return items.length - 1 === index;
   };
-  return /*#__PURE__*/React__default.createElement(AccordionsContainer, {
-    className: className
-  }, items.map(function (accordion, index) {
+  return /*#__PURE__*/React__default.createElement(AccordionsContainer, null, items.map(function (accordion, index) {
     return /*#__PURE__*/React__default.createElement(Accordion, {
       key: accordion.title + "-" + index,
       title: accordion.title,
-      showLine: isLastAccordion(index)
+      showLine: isLastAccordion(index),
+      visibleStandfirst: accordion.visibleStandfirst,
+      contentType: accordion.contentType,
+      displayLevel: accordion.displayLevel,
+      semanticLevel: accordion.semanticLevel
     }, accordion.children);
   }));
 };
 
-var _templateObject$T, _templateObject2$E, _templateObject3$s, _templateObject4$o, _templateObject5$i;
+var _templateObject$T, _templateObject2$E, _templateObject3$s, _templateObject4$n, _templateObject5$h;
 var AnnouncementBannerWrapper = /*#__PURE__*/styled__default.div(_templateObject$T || (_templateObject$T = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  padding: 28px 0;\n  background-color: var(--announcement-banner-bg-color);\n  color: var(--announcement-banner-color);\n\n  @media ", " {\n    padding: 20px 0;\n  }\n"])), devices.mobile);
 var SvgContainer$2 = /*#__PURE__*/styled__default.div(_templateObject2$E || (_templateObject2$E = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  height: 100%;\n  display: flex;\n  cursor: ", ";\n\n  ", "\n\n  svg {\n    width: var(--navigation-large-gap);\n    height: var(--navigation-large-gap);\n\n    path {\n      fill: var(--announcement-banner-color);\n    }\n  }\n"])), function (_ref) {
   var isClickable = _ref.isClickable;
@@ -8237,8 +8259,8 @@ var SvgContainer$2 = /*#__PURE__*/styled__default.div(_templateObject2$E || (_te
   return isClickable && "\n    :hover:not(:active) {\n      && svg path {\n        fill: var(--announcement-banner-hover-color);\n      }\n    }\n    :active {\n      && svg path {\n        fill: var(--announcement-banner-pressed-color);\n      }\n    }\n  ";
 });
 var ContentContainer$1 = /*#__PURE__*/styled__default.div(_templateObject3$s || (_templateObject3$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  overflow: auto;\n  transition: max-height 0.2s ease;\n  font-size: var(--font-size-body-1);\n  font-family: var(--font-family-sans);\n  font-feature-settings: var(--font-feature-settings-body);\n  font-weight: var(--font-weight-body-1);\n  letter-spacing: var(--letter-spacing-body-1);\n  line-height: var(--line-height-body-1);\n  text-transform: var(--text-transform-body);\n  color: var(--announcement-banner-color);\n  a {\n    color: var(--announcement-banner-color);\n    text-decoration: underline;\n  }\n\n  * {\n    margin-block-start: 0;\n    margin-block-end: 0;\n    margin-inline-start: 0;\n    margin-inline-end: 0;\n  }\n"])));
-var OverlineWrapper = /*#__PURE__*/styled__default(HarmonicOverline)(_templateObject4$o || (_templateObject4$o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  padding-bottom: 4px;\n  && {\n    color: var(--announcement-banner-color);\n  }\n"])));
-var BannerContentWrapper = /*#__PURE__*/styled__default(GridItem)(_templateObject5$i || (_templateObject5$i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  && {\n    grid-column: 3 / span 10;\n  }\n\n  @media ", ", ", " {\n    && {\n      grid-column: 3 / span 12;\n    }\n  }\n\n  @media ", " {\n    margin-left: ", ";\n    margin-right: ", ";\n  }\n"])), devices.desktop, devices.largeDesktop, devices.mobile, function (_ref3) {
+var OverlineWrapper = /*#__PURE__*/styled__default(HarmonicOverline)(_templateObject4$n || (_templateObject4$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  padding-bottom: 4px;\n  && {\n    color: var(--announcement-banner-color);\n  }\n"])));
+var BannerContentWrapper = /*#__PURE__*/styled__default(GridItem)(_templateObject5$h || (_templateObject5$h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  && {\n    grid-column: 3 / span 10;\n  }\n\n  @media ", ", ", " {\n    && {\n      grid-column: 3 / span 12;\n    }\n  }\n\n  @media ", " {\n    margin-left: ", ";\n    margin-right: ", ";\n  }\n"])), devices.desktop, devices.largeDesktop, devices.mobile, function (_ref3) {
   var variant = _ref3.variant;
   return variant === BannerVariants['service-persistent'] ? '8px' : '0px';
 }, function (_ref4) {
@@ -8310,7 +8332,7 @@ var AnnouncementBanner = function AnnouncementBanner(_ref) {
   }))))));
 };
 
-var _templateObject$U, _templateObject2$F, _templateObject3$t, _templateObject4$p, _templateObject5$j, _templateObject6$e, _templateObject7$b, _templateObject8$8, _templateObject9$6, _templateObject0$5, _templateObject1$2, _templateObject10$2, _templateObject11$2, _templateObject12$2;
+var _templateObject$U, _templateObject2$F, _templateObject3$t, _templateObject4$o, _templateObject5$i, _templateObject6$f, _templateObject7$a, _templateObject8$7, _templateObject9$4, _templateObject0$4, _templateObject1$2, _templateObject10$2, _templateObject11$2, _templateObject12$2;
 var LENGTH_LARGE_TEXT = 28;
 var LENGTH_SMALL_TEXT$1 = 19;
 var LENGTH_TEXT_TABLET = 10;
@@ -8326,19 +8348,19 @@ var HoverContainer = /*#__PURE__*/styled__default.div(_templateObject2$F || (_te
   return lineColor ? "var(--color-" + lineColor + ")" : 'var(--color-primary-background)';
 }, zIndexes.contentOverlay);
 var ProgressContainer = /*#__PURE__*/styled__default.div(_templateObject3$t || (_templateObject3$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin-top: -6px;\n"])));
-var ContentContainer$2 = /*#__PURE__*/styled__default.div(_templateObject4$p || (_templateObject4$p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  margin-top: 24px;\n\n  @media ", " {\n    margin-left: ", ";\n    margin-right: ", ";\n  }\n"])), devices.mobile, function (_ref4) {
+var ContentContainer$2 = /*#__PURE__*/styled__default.div(_templateObject4$o || (_templateObject4$o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  margin-top: 24px;\n\n  @media ", " {\n    margin-left: ", ";\n    margin-right: ", ";\n  }\n"])), devices.mobile, function (_ref4) {
   var fullWidth = _ref4.fullWidth;
   return fullWidth ? '0' : '20px';
 }, function (_ref5) {
   var fullWidth = _ref5.fullWidth;
   return fullWidth ? '0' : '20px';
 });
-var TitleContainer$4 = /*#__PURE__*/styled__default.div(_templateObject5$j || (_templateObject5$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin: 12px 0;\n\n  @media ", " {\n    display: none;\n  }\n"])), devices.mobile);
-var TitleContainerMobile = /*#__PURE__*/styled__default.div(_templateObject6$e || (_templateObject6$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin: 12px 0;\n  display: none;\n\n  @media ", " {\n    display: block;\n  }\n"])), devices.mobile);
-var TextContainer$2 = /*#__PURE__*/styled__default(BodyCopyHarmonic)(_templateObject7$b || (_templateObject7$b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  white-space: break-spaces;\n  overflow-wrap: break-word;\n"])));
-var HighlightTextContainer = /*#__PURE__*/styled__default.div(_templateObject8$8 || (_templateObject8$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin-top: 24px;\n"])));
-var SubtitleContainer = /*#__PURE__*/styled__default.span(_templateObject9$6 || (_templateObject9$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin-bottom: 4px;\n  overflow-wrap: break-word;\n"])));
-var LabelContainer = /*#__PURE__*/styled__default.div(_templateObject0$5 || (_templateObject0$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  visibility: ", ";\n  width: fit-content;\n  height: 25px;\n\n  @media ", " {\n    margin-left: ", ";\n  }\n"])), function (_ref6) {
+var TitleContainer$4 = /*#__PURE__*/styled__default.div(_templateObject5$i || (_templateObject5$i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin: 12px 0;\n\n  @media ", " {\n    display: none;\n  }\n"])), devices.mobile);
+var TitleContainerMobile = /*#__PURE__*/styled__default.div(_templateObject6$f || (_templateObject6$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin: 12px 0;\n  display: none;\n\n  @media ", " {\n    display: block;\n  }\n"])), devices.mobile);
+var TextContainer$2 = /*#__PURE__*/styled__default.div(_templateObject7$a || (_templateObject7$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  white-space: break-spaces;\n  overflow-wrap: break-word;\n"])));
+var HighlightTextContainer = /*#__PURE__*/styled__default.div(_templateObject8$7 || (_templateObject8$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin-top: 24px;\n"])));
+var SubtitleContainer = /*#__PURE__*/styled__default.span(_templateObject9$4 || (_templateObject9$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin-bottom: 4px;\n  overflow-wrap: break-word;\n"])));
+var LabelContainer = /*#__PURE__*/styled__default.div(_templateObject0$4 || (_templateObject0$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  visibility: ", ";\n  width: fit-content;\n  height: 25px;\n\n  @media ", " {\n    margin-left: ", ";\n  }\n"])), function (_ref6) {
   var isVisible = _ref6.isVisible;
   return isVisible ? "visible" : 'hidden';
 }, devices.mobile, function (_ref7) {
@@ -8521,14 +8543,14 @@ var Card = function Card(_ref) {
     size: "medium"
   }, title)), subtitle ? (/*#__PURE__*/React__default.createElement(SubtitleContainer, null, /*#__PURE__*/React__default.createElement(HarmonicOverline, {
     size: "large"
-  }, subtitle))) : null, /*#__PURE__*/React__default.createElement(TextContainer$2, {
-    tag: "div",
-    size: "large",
+  }, subtitle))) : null, /*#__PURE__*/React__default.createElement(BodyCopyHarmonic, {
+    size: "large"
+  }, /*#__PURE__*/React__default.createElement(TextContainer$2, {
     id: cardDescriptionId,
     dangerouslySetInnerHTML: {
       __html: truncatedText
     }
-  }), highlightText && (/*#__PURE__*/React__default.createElement(HighlightTextContainer, null, /*#__PURE__*/React__default.createElement(BodyCopyHarmonic, {
+  })), highlightText && (/*#__PURE__*/React__default.createElement(HighlightTextContainer, null, /*#__PURE__*/React__default.createElement(BodyCopyHarmonic, {
     size: "large",
     color: "red"
   }, highlightText))))), auxiliaryCTA && (/*#__PURE__*/React__default.createElement(ExtraActionsContainer, {
@@ -8593,44 +8615,54 @@ var Cards = function Cards(_ref) {
   }));
 };
 
-var _templateObject$W, _templateObject2$H, _templateObject3$u, _templateObject4$q, _templateObject5$k, _templateObject6$f, _templateObject7$c;
-var ContentWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject$W || (_templateObject$W = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  @media ", " {\n    grid-column: 2 / span 12;\n  }\n"])), devices.mobileAndTablet);
-var Wrapper$4 = /*#__PURE__*/styled__default.div(_templateObject2$H || (_templateObject2$H = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  @media ", " {\n    display: grid;\n    grid-template-columns: var(--grid-template-columns);\n    grid-template-rows: max-content;\n    gap: var(--grid-column-gap);\n    margin: 0;\n  }\n"])), devices.mobileAndTablet);
-var AddressWrapper = /*#__PURE__*/styled__default.div(_templateObject3$u || (_templateObject3$u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin-top: 4px;\n"])));
-var TitleWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject4$q || (_templateObject4$q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: baseline;\n  gap: 3px;\n"])));
-var MobileSuffixWrapper = /*#__PURE__*/styled__default.div(_templateObject5$k || (_templateObject5$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: none;\n\n  @media ", " {\n    display: block;\n  }\n"])), devices.mobile);
-var DesktopSuffixWrapper = /*#__PURE__*/styled__default.div(_templateObject6$f || (_templateObject6$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: block;\n\n  @media ", " {\n    display: none;\n  }\n"])), devices.mobile);
-var DetailsWrapper = /*#__PURE__*/styled__default.div(_templateObject7$c || (_templateObject7$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  a {\n    font-family: var(--font-family-sans);\n    font-weight: 400;\n    font-size: 19px;\n    line-height: 26px;\n    letter-spacing: -0.5px;\n    color: var(--color-base-black);\n    text-decoration: underline;\n    text-underline-offset: 4px;\n    margin-right: 13px;\n    display: inline-block;\n\n    &:last-child {\n      margin-right: 0;\n    }\n\n    @media ", " {\n      font-size: 17px;\n      line-height: 24px;\n    }\n  }\n"])), devices.mobile);
+var _templateObject$W, _templateObject2$H, _templateObject3$u, _templateObject4$p, _templateObject5$j;
+var ContentWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject$W || (_templateObject$W = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  & > div {\n    margin-bottom: 2px;\n\n    &:first-child {\n      margin-bottom: 4px;\n\n      @media ", " {\n        margin-bottom: 6px;\n      }\n    }\n  }\n\n  @media ", " {\n    grid-column: 2 / span 12;\n  }\n"])), devices.mobile, devices.mobileAndTablet);
+var Wrapper$4 = /*#__PURE__*/styled__default.div(_templateObject2$H || (_templateObject2$H = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  ", "\n  ", "\n  padding: 30px 0;\n\n  @media ", " {\n    display: grid;\n    grid-template-columns: var(--grid-template-columns);\n    grid-template-rows: max-content;\n    gap: var(--grid-column-gap);\n    margin: 0;\n  }\n"])), function (_ref) {
+  var hideBottomBorder = _ref.hideBottomBorder;
+  return "border-bottom: " + (hideBottomBorder ? 'none' : '2px solid var(--base-color-mid-grey)') + ";";
+}, function (_ref2) {
+  var hideTopBorder = _ref2.hideTopBorder;
+  return "border-top: " + (hideTopBorder ? 'none' : '2px solid var(--base-color-mid-grey)') + ";";
+}, devices.mobileAndTablet);
+var AddressWrapperDesktop = /*#__PURE__*/styled__default.div(_templateObject3$u || (_templateObject3$u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  @media ", " {\n    display: none;\n  }\n"])), devices.mobile);
+var AddressWrapperMobile = /*#__PURE__*/styled__default.div(_templateObject4$p || (_templateObject4$p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: none;\n\n  & > div {\n    margin-bottom: 2px;\n  }\n\n  @media ", " {\n    display: block;\n  }\n"])), devices.mobile);
+var DetailsWrapper = /*#__PURE__*/styled__default.div(_templateObject5$j || (_templateObject5$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n\n  @media ", " {\n    flex-direction: column;\n    margin: 4px 0;\n  }\n\n  a {\n    font-size: var(--font-size-body-1);\n    font-family: var(--font-family-body);\n    font-feature-settings: var(--font-feature-settings-body);\n    font-weight: var(--font-weight-body-1);\n    letter-spacing: var(--letter-spacing-body-1);\n    line-height: var(--line-height-body-1);\n    text-transform: var(--text-transform-body);\n    color: var(--base-color-black);\n    text-decoration: underline;\n\n    &:before {\n      display: inline-block;\n      content: '';\n      background-color: var(--base-color-black);\n      width: 1px;\n      height: 18px;\n      margin: 0 8px -4px;\n\n      @media ", " {\n        display: none;\n      }\n    }\n\n    &:first-child:before {\n      display: none;\n    }\n  }\n"])), devices.mobile, devices.mobile);
 
+var divideAddressString = function divideAddressString(address) {
+  return address.split(',').map(function (chunk, i) {
+    return /*#__PURE__*/React__default.createElement(BodyText, {
+      level: 1,
+      key: i
+    }, chunk.trim());
+  });
+};
 var ContactCard = function ContactCard(_ref) {
-  var title = _ref.title,
-    titleSuffix = _ref.titleSuffix,
+  var name = _ref.name,
     description = _ref.description,
     email = _ref.email,
     phone = _ref.phone,
     website = _ref.website,
     address = _ref.address,
-    className = _ref.className;
+    _ref$hideBottomBorder = _ref.hideBottomBorder,
+    hideBottomBorder = _ref$hideBottomBorder === void 0 ? false : _ref$hideBottomBorder,
+    _ref$hideTopBorder = _ref.hideTopBorder,
+    hideTopBorder = _ref$hideTopBorder === void 0 ? false : _ref$hideTopBorder;
   var hasDetails = email || phone || website;
   var addressString = address == null ? void 0 : address.substring(0, 110);
   var descriptionText = description == null ? void 0 : description.substring(0, 110);
-  return /*#__PURE__*/React__default.createElement("div", {
-    className: className
-  }, /*#__PURE__*/React__default.createElement(Grid, null, /*#__PURE__*/React__default.createElement(GridItem, {
+  return /*#__PURE__*/React__default.createElement(Grid, null, /*#__PURE__*/React__default.createElement(GridItem, {
     columnStartDesktop: 3,
-    columnSpanDesktop: 12,
+    columnSpanDesktop: 8,
     columnStartDevice: 1,
     columnSpanDevice: 14
   }, /*#__PURE__*/React__default.createElement(Wrapper$4, {
-    "data-testid": "contact-card-wrapper"
-  }, /*#__PURE__*/React__default.createElement(ContentWrapper$1, null, /*#__PURE__*/React__default.createElement(TitleWrapper$2, null, /*#__PURE__*/React__default.createElement(HarmonicSubtitle, {
-    size: "large"
-  }, title), /*#__PURE__*/React__default.createElement(MobileSuffixWrapper, null, /*#__PURE__*/React__default.createElement(BodyCopyHarmonic, {
-    size: "small"
-  }, titleSuffix)), /*#__PURE__*/React__default.createElement(DesktopSuffixWrapper, null, /*#__PURE__*/React__default.createElement(HarmonicOverline, {
-    size: "small"
-  }, titleSuffix))), descriptionText && /*#__PURE__*/React__default.createElement(HarmonicSubtitle, {
-    size: "large"
+    "data-testid": "contact-card-wrapper",
+    hideBottomBorder: hideBottomBorder,
+    hideTopBorder: hideTopBorder
+  }, /*#__PURE__*/React__default.createElement(ContentWrapper$1, null, /*#__PURE__*/React__default.createElement(BodyText, {
+    level: 1
+  }, name), descriptionText && /*#__PURE__*/React__default.createElement(Subtitle, {
+    level: 2
   }, descriptionText), hasDetails && (/*#__PURE__*/React__default.createElement(DetailsWrapper, {
     "data-testid": "contact-card-details-block"
   }, email && (/*#__PURE__*/React__default.createElement("a", {
@@ -8646,21 +8678,21 @@ var ContactCard = function ContactCard(_ref) {
     rel: "noreferrer"
   }, website)))), addressString && (/*#__PURE__*/React__default.createElement("div", {
     "data-testid": "contact-card-address-block"
-  }, /*#__PURE__*/React__default.createElement(AddressWrapper, null, /*#__PURE__*/React__default.createElement(BodyCopyHarmonic, {
-    size: "large"
-  }, addressString)))))))));
+  }, /*#__PURE__*/React__default.createElement(AddressWrapperDesktop, null, /*#__PURE__*/React__default.createElement(BodyText, {
+    level: 1
+  }, addressString)), /*#__PURE__*/React__default.createElement(AddressWrapperMobile, null, divideAddressString(addressString))))))));
 };
 
-var _templateObject$X, _templateObject2$I, _templateObject3$v, _templateObject4$r, _templateObject5$l, _templateObject6$g;
+var _templateObject$X, _templateObject2$I, _templateObject3$v, _templateObject4$q, _templateObject5$k, _templateObject6$g;
 var BodyTextRelative = /*#__PURE__*/styled__default(BodyCopyHarmonic)(_templateObject$X || (_templateObject$X = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: relative;\n"])));
 var ContentSummaryWrapper = /*#__PURE__*/styled__default.article(_templateObject2$I || (_templateObject2$I = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  position: relative;\n  justify-items: start;\n  align-items: center;\n  margin: 20px 0;\n  gap: 36px;\n  cursor: ", ";\n\n  @media ", " {\n    display: flex;\n    flex-direction: column;\n    gap: 24px;\n  }\n"])), function (props) {
   return props.clickable ? 'pointer' : 'default';
 }, devices.mobile);
 var ContentSummaryImageWrapper = /*#__PURE__*/styled__default.div(_templateObject3$v || (_templateObject3$v = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  flex: 0 0 33.3%;\n"])));
-var ContentSummaryTextWrapper = /*#__PURE__*/styled__default.div(_templateObject4$r || (_templateObject4$r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  grid-column: ", ";\n  display: flex;\n  flex-direction: column;\n  justify-content: space-around;\n  gap: 20px;\n\n  & * {\n    margin-block-start: 0;\n    margin-block-end: 0;\n  }\n\n  @media ", " {\n    margin: 0 20px;\n  }\n\n  & .content-summary-text-link {\n    height: unset;\n  }\n"])), function (props) {
+var ContentSummaryTextWrapper = /*#__PURE__*/styled__default.div(_templateObject4$q || (_templateObject4$q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  grid-column: ", ";\n  display: flex;\n  flex-direction: column;\n  justify-content: space-around;\n  gap: 20px;\n\n  & * {\n    margin-block-start: 0;\n    margin-block-end: 0;\n  }\n\n  @media ", " {\n    margin: 0 20px;\n  }\n\n  & .content-summary-text-link {\n    height: unset;\n  }\n"])), function (props) {
   return props.showImage ? 2 : '1 / span 4';
 }, devices.mobile);
-var BodyTextLimit = /*#__PURE__*/styled__default.div(_templateObject5$l || (_templateObject5$l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: block;\n  position: relative;\n"])));
+var BodyTextLimit = /*#__PURE__*/styled__default.div(_templateObject5$k || (_templateObject5$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: block;\n  position: relative;\n"])));
 var ContentSummaryBodyTextWrapper = /*#__PURE__*/styled__default.div(_templateObject6$g || (_templateObject6$g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  & p:not(:last-child):after {\n    content: '\\A\\A';\n    white-space: pre;\n  }\n\n  ", "\n"], ["\n  & p:not(:last-child):after {\n    content: '\\\\A\\\\A';\n    white-space: pre;\n  }\n\n  ", "\n"])), function (props) {
   return !!props.truncate && "\n    overflow: hidden;\n    position: relative;\n    display: -webkit-box;\n    -webkit-line-clamp: " + props.truncate + ";\n    -webkit-box-orient: vertical;\n    text-overflow: ellipsis;\n    min-height: 1em;\n    max-height: 3em;\n  ";
 });
@@ -8735,7 +8767,7 @@ var ContentSummary = function ContentSummary(_ref) {
   }), link.text))));
 };
 
-var _templateObject$Y, _templateObject2$J, _templateObject3$w, _templateObject4$s, _templateObject5$m;
+var _templateObject$Y, _templateObject2$J, _templateObject3$w, _templateObject4$r, _templateObject5$l;
 var EditorialGrid = /*#__PURE__*/styled__default.div(_templateObject$Y || (_templateObject$Y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: grid;\n  grid-template-columns: repeat(12, minmax(0, 1fr));\n  gap: var(--grid-column-gap);\n  grid-template-areas: ", ";\n\n  @media ", " {\n    & {\n      display: grid;\n      grid-template-columns: 100%;\n      grid-template-rows: min-content 24px min-content;\n      grid-template-areas:\n        'row1'\n        '.'\n        'row2';\n    }\n  }\n"])), function (_ref) {
   var imageToLeft = _ref.imageToLeft;
   return imageToLeft ? "'left left left left left . right right right right right right'" : "'left left left left left left . right right right right right'";
@@ -8748,21 +8780,17 @@ var EditorialTextWrapper = /*#__PURE__*/styled__default.div(_templateObject3$w |
   var imageToLeft = _ref3.imageToLeft;
   return imageToLeft ? 'right' : 'left';
 }, devices.mobile);
-var EditorialSubtitle = /*#__PURE__*/styled__default(HarmonicSubtitle)(_templateObject4$s || (_templateObject4$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  font-feature-settings: var(--font-feature-settings-subtitle);\n  text-transform: var(--text-transform-subtitle);\n  margin-bottom: var(--editorial-subtitle-margin-bottom);\n  display: block;\n  overflow-wrap: break-word;\n"])));
-var EditorialText = /*#__PURE__*/styled__default(BodyCopyHarmonic)(_templateObject5$m || (_templateObject5$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  font-feature-settings: var(--font-feature-settings-body);\n  text-transform: var(--text-transform-body);\n  margin: 0;\n  padding: 0;\n  white-space: break-spaces;\n  overflow-wrap: break-word;\n\n  em {\n    font-family: var(--font-family-body-italics);\n  }\n"])));
+var EditorialSubtitle = /*#__PURE__*/styled__default.span(_templateObject4$r || (_templateObject4$r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  font-family: var(--font-family-subtitle);\n  font-feature-settings: var(--font-feature-settings-subtitle);\n  font-size: var(--font-size-subtitle-1);\n  font-weight: var(--font-weight-subtitle-1);\n  line-height: var(--line-height-subtitle-1);\n  letter-spacing: var(--letter-spacing-subtitle-1);\n  text-transform: var(--text-transform-subtitle);\n  margin-bottom: var(--editorial-subtitle-margin-bottom);\n  display: block;\n  overflow-wrap: break-word;\n"])));
+var EditorialText = /*#__PURE__*/styled__default.div(_templateObject5$l || (_templateObject5$l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  font-family: var(--font-family-body);\n  font-feature-settings: var(--font-feature-settings-body);\n  font-size: var(--font-size-body-1);\n  font-weight: var(--font-weight-body-1);\n  line-height: var(--line-height-body-1);\n  letter-spacing: var(--letter-spacing-body-1);\n  text-transform: var(--text-transform-body);\n  margin: 0;\n  padding: 0;\n  white-space: break-spaces;\n  overflow-wrap: break-word;\n\n  em {\n    font-family: var(--font-family-body-italics);\n  }\n"])));
 
 var Editorial = function Editorial(_ref) {
   var _ref$imagePosition = _ref.imagePosition,
     imagePosition = _ref$imagePosition === void 0 ? 'left' : _ref$imagePosition,
     subtitle = _ref.subtitle,
     text = _ref.text,
-    children = _ref.children,
-    className = _ref.className;
+    children = _ref.children;
   var imageToLeft = imagePosition === 'left';
-  return /*#__PURE__*/React__default.createElement(Grid, {
-    className: className,
-    "data-testid": "editorial-component"
-  }, /*#__PURE__*/React__default.createElement(GridItem, {
+  return /*#__PURE__*/React__default.createElement(Grid, null, /*#__PURE__*/React__default.createElement(GridItem, {
     columnStartDesktop: 3,
     columnSpanDesktop: 12,
     columnStartDevice: 2,
@@ -8777,10 +8805,7 @@ var Editorial = function Editorial(_ref) {
   }, children)), /*#__PURE__*/React__default.createElement(EditorialTextWrapper, {
     "data-testid": "text-wrapper",
     imageToLeft: imageToLeft
-  }, subtitle ? /*#__PURE__*/React__default.createElement(EditorialSubtitle, {
-    tag: "span"
-  }, subtitle) : null, /*#__PURE__*/React__default.createElement(EditorialText, {
-    tag: "div",
+  }, subtitle ? /*#__PURE__*/React__default.createElement(EditorialSubtitle, null, subtitle) : null, /*#__PURE__*/React__default.createElement(EditorialText, {
     dangerouslySetInnerHTML: {
       __html: text
     }
@@ -8854,7 +8879,7 @@ var getBorderColor$1 = function getBorderColor(variant, colorValue) {
   return variant === InformationCtaVariants.Primary || variant === InformationCtaVariants.Secondary || variant === undefined ? "border-color: " + colorValue + ";" : '';
 };
 
-var _templateObject$_, _templateObject2$L, _templateObject3$y, _templateObject4$t;
+var _templateObject$_, _templateObject2$L, _templateObject3$y, _templateObject4$s;
 var InfoWrapper$1 = /*#__PURE__*/styled__default(Grid)(_templateObject$_ || (_templateObject$_ = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  padding: 60px 0;\n  color: var(--information-panel-color);\n  background-color: var(--information-panel-bg-color);\n\n  @media ", " {\n    padding: 40px 0;\n  }\n"])), devices.mobile);
 var InfoTitle = /*#__PURE__*/styled__default('div')(_templateObject2$L || (_templateObject2$L = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  * {\n    margin-block: 0;\n  }\n"])));
 var InfoCTAWrapper = /*#__PURE__*/styled__default('div')(_templateObject3$y || (_templateObject3$y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin-top: 32px;\n\n  @media ", " {\n    margin-top: 16px;\n  }\n\n  a {\n    color: ", ";\n    ", "\n    ", "\n\n    svg path {\n      fill: ", ";\n    }\n\n    :hover:not(:active) {\n      color: ", ";\n      ", "\n      ", "\n\n      svg path {\n        fill: ", ";\n      }\n    }\n\n    :active {\n      color: ", ";\n      ", "\n      ", "\n\n      svg path {\n        fill: ", ";\n      }\n    }\n  }\n"])), devices.mobile, function (_ref) {
@@ -8900,7 +8925,7 @@ var InfoCTAWrapper = /*#__PURE__*/styled__default('div')(_templateObject3$y || (
     theme = _ref10.theme;
   return getTextColor$4(variant, theme, COLORS$4.pressed);
 });
-var InfoBodyWrapper = /*#__PURE__*/styled__default(BodyCopyHarmonic)(_templateObject4$t || (_templateObject4$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: var(--information-panel-color);\n\n  a {\n    text-decoration: underline;\n    color: var(--information-panel-color);\n  }\n\n  @media ", " {\n    padding-top: 4px;\n  }\n"])), devices.mobile);
+var InfoBodyWrapper = /*#__PURE__*/styled__default(BodyCopyHarmonic)(_templateObject4$s || (_templateObject4$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: var(--information-panel-color);\n\n  a {\n    text-decoration: underline;\n    color: var(--information-panel-color);\n  }\n\n  @media ", " {\n    padding-top: 4px;\n  }\n"])), devices.mobile);
 
 // Helper function for rendering buttons based on the variant
 var renderButton = function renderButton(_ref) {
@@ -8951,8 +8976,8 @@ var InfoCta = function InfoCta(_ref2) {
     iconName = _ref2.iconName,
     iconDirection = _ref2.iconDirection,
     _ref2$target = _ref2.target,
-    target = _ref2$target === void 0 ? LinkTarget.Self : _ref2$target;
-  var theme = useHarmonicTheme();
+    target = _ref2$target === void 0 ? LinkTarget.Self : _ref2$target,
+    theme = _ref2.theme;
   return /*#__PURE__*/React__default.createElement(InfoCTAWrapper, {
     variant: variant,
     theme: theme
@@ -8966,7 +8991,6 @@ var InfoCta = function InfoCta(_ref2) {
   }));
 };
 
-/* eslint-disable react/no-danger */
 var defaultColumnSpan = 6;
 var smallColumnSpan = 4;
 var largeColumnSpan = 9;
@@ -8981,7 +9005,8 @@ var Information = function Information(_ref) {
   var body = _ref.body,
     title = _ref.title,
     cta = _ref.cta,
-    className = _ref.className;
+    className = _ref.className,
+    theme = _ref.theme;
   var _useViewport = useViewport(),
     hydrated = _useViewport.hydrated;
   var safeTitle = title || {
@@ -9022,11 +9047,12 @@ var Information = function Information(_ref) {
     text: cta.text,
     iconName: cta.iconName,
     iconDirection: cta.iconDirection,
-    target: cta.target
+    target: cta.target,
+    theme: theme
   })))));
 };
 
-var _templateObject$$, _templateObject2$M, _templateObject3$z, _templateObject4$u, _templateObject5$n, _templateObject6$h, _templateObject7$d, _templateObject8$9;
+var _templateObject$$, _templateObject2$M, _templateObject3$z, _templateObject4$t, _templateObject5$m, _templateObject6$h, _templateObject7$b, _templateObject8$8;
 var PageHeadingWrapper = /*#__PURE__*/styled__default('div')(_templateObject$$ || (_templateObject$$ = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  padding-bottom: 80px;\n  background-color: var(--page-header-bg-color);\n  color: var(--color-base-white);\n\n  ", ";\n\n  h1,\n  h2,\n  h3 {\n    margin: 0;\n    padding: 0;\n  }\n\n  @media ", " {\n    padding-bottom: 0;\n  }\n"])), function (_ref) {
   var isPageHeadingWithoutTitle = _ref.isPageHeadingWithoutTitle;
   return isPageHeadingWithoutTitle && "\n    padding-bottom: 42px;\n  ";
@@ -9036,23 +9062,23 @@ var BadgeWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject3$z || (_te
   var isPageHeadingWithoutTitle = _ref2.isPageHeadingWithoutTitle;
   return isPageHeadingWithoutTitle && "\n    height: 50px;\n    padding-bottom: 0;\n    margin: 10px 0;\n  ";
 });
-var TitleWrapper$3 = /*#__PURE__*/styled__default.div(_templateObject4$u || (_templateObject4$u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  grid-area: title;\n  margin-top: 80px;\n\n  ", ";\n\n  @media ", " {\n    & {\n      margin-top: 0;\n    }\n  }\n"])), function (_ref3) {
+var TitleWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject4$t || (_templateObject4$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  grid-area: title;\n  margin-top: 80px;\n\n  ", ";\n\n  @media ", " {\n    & {\n      margin-top: 0;\n    }\n  }\n"])), function (_ref3) {
   var isPageHeadingWithoutTitle = _ref3.isPageHeadingWithoutTitle;
   return isPageHeadingWithoutTitle && "\n    margin-top: 42px;\n  ";
 }, devices.mobile);
-var ChildrenWrapper = /*#__PURE__*/styled__default.div(_templateObject5$n || (_templateObject5$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin-bottom: 20px;\n  width: fit-content;\n  height: 43px;\n\n  ", ";\n\n  @media ", " {\n    & {\n      height: 33px;\n      margin-top: 10px;\n      margin-bottom: 20px;\n    }\n  }\n"])), function (_ref4) {
+var ChildrenWrapper = /*#__PURE__*/styled__default.div(_templateObject5$m || (_templateObject5$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin-bottom: 20px;\n  width: fit-content;\n  height: 43px;\n\n  ", ";\n\n  @media ", " {\n    & {\n      height: 33px;\n      margin-top: 10px;\n      margin-bottom: 20px;\n    }\n  }\n"])), function (_ref4) {
   var isPageHeadingWithoutTitle = _ref4.isPageHeadingWithoutTitle;
   return isPageHeadingWithoutTitle && "\n    margin: 10px 0;\n  ";
 }, devices.mobile);
 var TextWrapper = /*#__PURE__*/styled__default.div(_templateObject6$h || (_templateObject6$h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: var(--color-base-white);\n  grid-area: text;\n  align-self: end;\n  margin-top: 12px;\n\n  h6 {\n    margin: 0;\n    padding: 0;\n  }\n"])));
-var LogoWrapper = /*#__PURE__*/styled__default.div(_templateObject7$d || (_templateObject7$d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  grid-area: logo;\n  justify-self: end;\n  margin-top: 20px;\n  position: relative;\n\n  > div {\n    position: absolute;\n    top: 0;\n    right: 0;\n  }\n\n  ", ";\n\n  @media ", " {\n    & {\n      align-self: start;\n      margin-top: 0;\n\n      ", ";\n    }\n  }\n"])), function (_ref5) {
+var LogoWrapper = /*#__PURE__*/styled__default.div(_templateObject7$b || (_templateObject7$b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  grid-area: logo;\n  justify-self: end;\n  margin-top: 20px;\n  position: relative;\n\n  > div {\n    position: absolute;\n    top: 0;\n    right: 0;\n  }\n\n  ", ";\n\n  @media ", " {\n    & {\n      align-self: start;\n      margin-top: 0;\n\n      ", ";\n    }\n  }\n"])), function (_ref5) {
   var isPageHeadingWithoutTitle = _ref5.isPageHeadingWithoutTitle;
   return isPageHeadingWithoutTitle && "\n    margin-top: 40px;\n  ";
 }, devices.mobile, function (_ref6) {
   var isPageHeadingWithoutTitle = _ref6.isPageHeadingWithoutTitle;
   return isPageHeadingWithoutTitle && "\n    margin-top: 15px;\n   ";
 });
-var ButtonWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject8$9 || (_templateObject8$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  grid-area: button;\n  justify-self: end;\n  align-self: end;\n\n  @media ", " {\n    & {\n      justify-self: center;\n      align-self: center;\n      width: 100%;\n      margin-top: 16px;\n    }\n  }\n"])), devices.mobile);
+var ButtonWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject8$8 || (_templateObject8$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  grid-area: button;\n  justify-self: end;\n  align-self: end;\n\n  @media ", " {\n    & {\n      justify-self: center;\n      align-self: center;\n      width: 100%;\n      margin-top: 16px;\n    }\n  }\n"])), devices.mobile);
 
 var PageHeading = function PageHeading(_ref) {
   var title = _ref.title,
@@ -9102,7 +9128,7 @@ var PageHeading = function PageHeading(_ref) {
     className: className,
     "data-testid": "page-heading-wrapper",
     isPageHeadingWithoutTitle: isTitleUnAvailable
-  }, /*#__PURE__*/React__default.createElement(PageHeadingGrid, null, /*#__PURE__*/React__default.createElement(TitleWrapper$3, {
+  }, /*#__PURE__*/React__default.createElement(PageHeadingGrid, null, /*#__PURE__*/React__default.createElement(TitleWrapper$2, {
     "data-testid": "page-heading-title",
     isPageHeadingWithoutTitle: isTitleUnAvailable
   }, renderBadge(theme), children ? (/*#__PURE__*/React__default.createElement(ChildrenWrapper, {
@@ -9127,15 +9153,15 @@ var PageHeading = function PageHeading(_ref) {
   }, /*#__PURE__*/React__default.createElement(PrimaryButton, Object.assign({}, themedLink), linkText))) : null));
 };
 
-var _templateObject$10, _templateObject2$N, _templateObject3$A, _templateObject4$v, _templateObject5$o, _templateObject6$i, _templateObject7$e, _templateObject8$a;
+var _templateObject$10, _templateObject2$N, _templateObject3$A, _templateObject4$u, _templateObject5$n, _templateObject6$i, _templateObject7$c, _templateObject8$9;
 var ImpactWrapper = /*#__PURE__*/styled__default.div(_templateObject$10 || (_templateObject$10 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  aspect-ratio: 16 / 9;\n  @supports not (aspect-ratio: 16 / 9) {\n    height: 56.25vw;\n  }\n\n  position: relative;\n  display: flex;\n  background: var(--base-color-black);\n\n  @media ", " {\n    aspect-ratio: 1 / 1;\n    @supports not (aspect-ratio: 1 / 1) {\n      height: 100vw;\n    }\n  }\n"])), devices.mobile);
 var ImpactHeaderImageWrapper = /*#__PURE__*/styled__default.div(_templateObject2$N || (_templateObject2$N = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  width: 100%;\n  overflow: hidden;\n  aspect-ratio: 16 / 9;\n  @supports not (aspect-ratio: 16 / 9) {\n    height: 56.25vw;\n  }\n\n  img {\n    width: 100%;\n    filter: brightness(0.7);\n    opacity: 0.95;\n  }\n\n  @media ", " {\n    height: fit-content;\n    aspect-ratio: 1 / 1;\n    @supports not (aspect-ratio: 1 / 1) {\n      height: 100vw;\n    }\n\n    img {\n      height: 100%;\n      object-fit: cover;\n    }\n  }\n"])), devices.mobile);
 var ImpactGrid = /*#__PURE__*/styled__default(Grid)(_templateObject3$A || (_templateObject3$A = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: absolute;\n  align-self: center;\n  width: 100%;\n  z-index: ", ";\n  gap: 0 var(--grid-column-gap);\n  grid-template-rows: min-content min-content min-content;\n  grid-template-areas:\n    '. . . . . logo logo logo logo logo logo . . . . .'\n    '. . . text text text text text text text text text text . . .'\n    '. . . button button button button button button button button button button . . .';\n\n  @media ", " {\n    & {\n      height: 100%;\n      grid-template-rows: 1fr max-content 1fr;\n      grid-template-areas:\n        '. . . logo logo logo logo logo logo logo logo . . .'\n        '. text text text text text text text text text text text text .'\n        '. button button button button button button button button button button button button .';\n    }\n  }\n\n  @media ", " {\n    align-content: center;\n\n    & {\n      grid-template-areas:\n        '. . . logo logo logo logo logo logo logo logo . . .'\n        '. . text text text text text text text text text text . .'\n        '. . button button button button button button button button button button . .';\n    }\n  }\n"])), zIndexes.contentOverlay, devices.mobile, devices.tablet);
-var SponsorWrapper = /*#__PURE__*/styled__default.div(_templateObject4$v || (_templateObject4$v = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: absolute;\n  top: 20px;\n  right: var(--grid-outer-margin);\n  width: fit-content;\n  z-index: ", ";\n\n  @media ", " {\n    & {\n      right: var(--grid-margin);\n    }\n  }\n"])), zIndexes.sponsorship, devices.mobileAndTablet);
-var LogoWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject5$o || (_templateObject5$o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  grid-area: logo;\n  align-self: end;\n"])));
+var SponsorWrapper = /*#__PURE__*/styled__default.div(_templateObject4$u || (_templateObject4$u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: absolute;\n  top: 20px;\n  right: var(--grid-outer-margin);\n  width: fit-content;\n  z-index: ", ";\n\n  @media ", " {\n    & {\n      right: var(--grid-margin);\n    }\n  }\n"])), zIndexes.sponsorship, devices.mobileAndTablet);
+var LogoWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject5$n || (_templateObject5$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  grid-area: logo;\n  align-self: end;\n"])));
 var TextWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject6$i || (_templateObject6$i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  grid-area: text;\n  color: var(--base-color-white);\n  text-align: center;\n  margin-top: 40px;\n  max-height: calc(2 * var(--line-height-header-3));\n  overflow: hidden;\n\n  h3 {\n    margin: 0;\n    padding: 0;\n  }\n\n  @media ", " {\n    & {\n      max-height: calc(4 * var(--line-height-header-3));\n    }\n  }\n\n  @media ", " {\n    & {\n      margin-top: 12px;\n      max-height: calc(4 * var(--line-height-header-3));\n    }\n\n    h3 {\n      font-size: var(--font-size-header-3);\n      letter-spacing: var(--letter-spacing-header-5);\n      line-height: var(--line-height-header-5);\n    }\n  }\n"])), devices.tablet, devices.mobile);
-var ButtonWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject7$e || (_templateObject7$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  grid-area: button;\n  align-self: end;\n  display: flex;\n  justify-content: center;\n  margin-top: 40px;\n\n  @media ", " {\n    & {\n      margin-top: 0px;\n      margin-bottom: 20px;\n    }\n  }\n"])), devices.mobile);
-var ScrollDownWrapper = /*#__PURE__*/styled__default.div(_templateObject8$a || (_templateObject8$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: absolute;\n  bottom: 20px;\n  left: var(--grid-outer-margin);\n  width: fit-content;\n  z-index: ", ";\n\n  @keyframes UpDown {\n    0%,\n    100% {\n      transform: translateY(0);\n    }\n    50% {\n      transform: translateY(8px);\n    }\n  }\n\n  a {\n    font-size: var(--font-size-overline-1);\n    font-weight: var(--font-weight-overline-1);\n    letter-spacing: var(--letter-spacing-overline-1);\n    border: none;\n    padding: 0;\n    :hover {\n      border: none;\n\n      > span {\n        animation: UpDown 1500ms linear infinite;\n      }\n    }\n  }\n\n  @media ", " {\n    & {\n      display: none;\n    }\n  }\n\n  @media ", " {\n    & {\n      display: none;\n    }\n  }\n"])), zIndexes.contentOverlay, devices.mobile, devices.tablet);
+var ButtonWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject7$c || (_templateObject7$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  grid-area: button;\n  align-self: end;\n  display: flex;\n  justify-content: center;\n  margin-top: 40px;\n\n  @media ", " {\n    & {\n      margin-top: 0px;\n      margin-bottom: 20px;\n    }\n  }\n"])), devices.mobile);
+var ScrollDownWrapper = /*#__PURE__*/styled__default.div(_templateObject8$9 || (_templateObject8$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: absolute;\n  bottom: 20px;\n  left: var(--grid-outer-margin);\n  width: fit-content;\n  z-index: ", ";\n\n  @keyframes UpDown {\n    0%,\n    100% {\n      transform: translateY(0);\n    }\n    50% {\n      transform: translateY(8px);\n    }\n  }\n\n  a {\n    font-size: var(--font-size-overline-1);\n    font-weight: var(--font-weight-overline-1);\n    letter-spacing: var(--letter-spacing-overline-1);\n    border: none;\n    padding: 0;\n    :hover {\n      border: none;\n\n      > span {\n        animation: UpDown 1500ms linear infinite;\n      }\n    }\n  }\n\n  @media ", " {\n    & {\n      display: none;\n    }\n  }\n\n  @media ", " {\n    & {\n      display: none;\n    }\n  }\n"])), zIndexes.contentOverlay, devices.mobile, devices.tablet);
 
 var _excluded$m = ["text"];
 var PageHeadingImpact = function PageHeadingImpact(_ref) {
@@ -9198,7 +9224,7 @@ var PageHeadingImpact = function PageHeadingImpact(_ref) {
   }, "Scroll Down"))) : null);
 };
 
-var _templateObject$11, _templateObject2$O, _templateObject3$B, _templateObject4$w, _templateObject5$p;
+var _templateObject$11, _templateObject2$O, _templateObject3$B, _templateObject4$v, _templateObject5$o;
 var PanelGrid = /*#__PURE__*/styled__default(Grid)(_templateObject$11 || (_templateObject$11 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  gap: 0 var(--grid-column-gap);\n\n  ", "\n\n  @media ", " {\n    grid-template-rows: 48px max-content max-content;\n  }\n"])), function (_ref) {
   var color = _ref.color;
   return "\n    background-color: " + (color ? "var(--base-color-" + color + ")" : 'var(--base-color-core)') + ";\n    color: " + (color === exports.Colors.White ? 'var(--base-color-black)' : 'var(--base-color-white)') + ";\n  ";
@@ -9211,8 +9237,8 @@ var LeftPanel = /*#__PURE__*/styled__default.div(_templateObject2$O || (_templat
   return hasImage ? '3 / 1 / 4 / 15' : '1 / 1 / 3 / 15';
 });
 var RightPanel = /*#__PURE__*/styled__default.div(_templateObject3$B || (_templateObject3$B = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  grid-area: 1 / 7 / 3 / 17;\n  position: relative;\n  height: 100%;\n  width: 100%;\n  background-color: var(--base-color-black);\n\n  @media ", " {\n    grid-area: 2 / 1 / 3 / 15;\n  }\n"])), devices.mobileAndTablet);
-var InfoWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject4$w || (_templateObject4$w = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin: 36px;\n  max-height: 33vw;\n  overflow: hidden;\n\n  :first-child * {\n    margin-block-start: 0;\n  }\n\n  @media ", " {\n    margin: 36px 20px;\n    max-height: unset;\n  }\n"])), devices.mobileAndTablet);
-var ScrollDownWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject5$p || (_templateObject5$p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  padding: 0 0 25px 36px;\n\n  @keyframes UpDown {\n    0%,\n    100% {\n      transform: translateY(0);\n    }\n    50% {\n      transform: translateY(8px);\n    }\n  }\n\n  a {\n    font-size: var(--font-size-overline-1);\n    font-weight: var(--font-weight-overline-1);\n    letter-spacing: var(--letter-spacing-overline-1);\n    border: none;\n    padding: 0;\n\n    :hover {\n      border: none;\n\n      > span {\n        animation: UpDown 1500ms linear infinite;\n      }\n    }\n  }\n\n  @media ", " {\n    display: none;\n  }\n"])), devices.mobileAndTablet);
+var InfoWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject4$v || (_templateObject4$v = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin: 36px;\n  max-height: 33vw;\n  overflow: hidden;\n\n  :first-child * {\n    margin-block-start: 0;\n  }\n\n  @media ", " {\n    margin: 36px 20px;\n    max-height: unset;\n  }\n"])), devices.mobileAndTablet);
+var ScrollDownWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject5$o || (_templateObject5$o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  padding: 0 0 25px 36px;\n\n  @keyframes UpDown {\n    0%,\n    100% {\n      transform: translateY(0);\n    }\n    50% {\n      transform: translateY(8px);\n    }\n  }\n\n  a {\n    font-size: var(--font-size-overline-1);\n    font-weight: var(--font-weight-overline-1);\n    letter-spacing: var(--letter-spacing-overline-1);\n    border: none;\n    padding: 0;\n\n    :hover {\n      border: none;\n\n      > span {\n        animation: UpDown 1500ms linear infinite;\n      }\n    }\n  }\n\n  @media ", " {\n    display: none;\n  }\n"])), devices.mobileAndTablet);
 
 var PageHeadingPanel = function PageHeadingPanel(_ref) {
   var _image$src, _image$alt;
@@ -9242,12 +9268,12 @@ var PageHeadingPanel = function PageHeadingPanel(_ref) {
   })))));
 };
 
-var _templateObject$12, _templateObject2$P, _templateObject3$C, _templateObject4$x, _templateObject5$q, _templateObject6$j, _templateObject7$f, _templateObject8$b, _templateObject9$7, _templateObject0$6, _templateObject1$3;
+var _templateObject$12, _templateObject2$P, _templateObject3$C, _templateObject4$w, _templateObject5$p, _templateObject6$j, _templateObject7$d, _templateObject8$a, _templateObject9$5, _templateObject0$5, _templateObject1$3;
 var Wrapper$5 = /*#__PURE__*/styled__default.section(_templateObject$12 || (_templateObject$12 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  width: 100%;\n"])));
 var ImageWrapper = /*#__PURE__*/styled__default.div(_templateObject2$P || (_templateObject2$P = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: relative;\n\n  picture,\n  img {\n    width: 100%;\n    height: 100%;\n  }\n"])));
 var SponsorWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject3$C || (_templateObject3$C = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: absolute;\n  top: 20px;\n  right: var(--grid-outer-margin);\n  width: fit-content;\n  z-index: ", ";\n\n  @media ", " {\n    & {\n      right: var(--grid-margin);\n    }\n  }\n"])), zIndexes.sponsorship, devices.mobileAndTablet);
-var ImageButtonWrapper = /*#__PURE__*/styled__default.div(_templateObject4$x || (_templateObject4$x = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: absolute;\n  right: var(--grid-outer-margin);\n  bottom: 20px;\n  z-index: 10;\n\n  @media ", " {\n    right: var(--grid-margin);\n    bottom: 10px;\n  }\n"])), devices.tablet);
-var ContentSection = /*#__PURE__*/styled__default.div(_templateObject5$q || (_templateObject5$q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  background-color: var(--heading-promo-bg-color);\n  border-bottom: ", ";\n  display: ", ";\n\n  @media ", " {\n    padding: 12px 0 20px;\n  }\n"])), function (_ref) {
+var ImageButtonWrapper = /*#__PURE__*/styled__default.div(_templateObject4$w || (_templateObject4$w = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: absolute;\n  right: var(--grid-outer-margin);\n  bottom: 20px;\n  z-index: 10;\n\n  @media ", " {\n    right: var(--grid-margin);\n    bottom: 10px;\n  }\n"])), devices.tablet);
+var ContentSection = /*#__PURE__*/styled__default.div(_templateObject5$p || (_templateObject5$p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  background-color: var(--heading-promo-bg-color);\n  border-bottom: ", ";\n  display: ", ";\n\n  @media ", " {\n    padding: 12px 0 20px;\n  }\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme == exports.ThemeType.Cinema ? '2px solid var(--color-base-light-grey)' : 'none';
 }, function (_ref2) {
@@ -9255,16 +9281,16 @@ var ContentSection = /*#__PURE__*/styled__default.div(_templateObject5$q || (_te
   return showBlock ? 'block' : 'none';
 }, devices.mobile);
 var BadgeWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject6$j || (_templateObject6$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  svg {\n    height: 32px;\n  }\n\n  @media ", " {\n    margin-bottom: 12px;\n  }\n"])), devices.mobile);
-var AdditionalContentWrapper = /*#__PURE__*/styled__default.div(_templateObject7$f || (_templateObject7$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  justify-content: start;\n  align-items: center;\n  width: 200px;\n\n  @media ", " {\n    order: ", ";\n    width: 100%;\n    justify-content: center;\n  }\n"])), devices.mobile, function (_ref3) {
+var AdditionalContentWrapper = /*#__PURE__*/styled__default.div(_templateObject7$d || (_templateObject7$d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  justify-content: start;\n  align-items: center;\n  width: 200px;\n\n  @media ", " {\n    order: ", ";\n    width: 100%;\n    justify-content: center;\n  }\n"])), devices.mobile, function (_ref3) {
   var isBadgePresent = _ref3.isBadgePresent;
   return isBadgePresent ? '1' : '4';
 });
-var MainButtonWrapper = /*#__PURE__*/styled__default.div(_templateObject8$b || (_templateObject8$b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  justify-content: end;\n  width: 200px;\n\n  @media ", " {\n    margin-bottom: ", ";\n    width: 100%;\n    order: 3;\n  }\n"])), devices.mobile, function (_ref4) {
+var MainButtonWrapper = /*#__PURE__*/styled__default.div(_templateObject8$a || (_templateObject8$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  justify-content: end;\n  width: 200px;\n\n  @media ", " {\n    margin-bottom: ", ";\n    width: 100%;\n    order: 3;\n  }\n"])), devices.mobile, function (_ref4) {
   var isAdditionalButtonPresent = _ref4.isAdditionalButtonPresent;
   return isAdditionalButtonPresent ? '20px' : '0';
 });
-var AdditionalButtonWrapper = /*#__PURE__*/styled__default.div(_templateObject9$7 || (_templateObject9$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  @media ", " {\n    width: 100%;\n    display: flex;\n    justify-content: center;\n  }\n"])), devices.mobile);
-var TitleWrapper$4 = /*#__PURE__*/styled__default.div(_templateObject0$6 || (_templateObject0$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  text-align: center;\n  padding: 10px 0;\n\n  h1,\n  h2,\n  h3 {\n    color: ", ";\n  }\n\n  @media ", " {\n    padding: 0;\n    order: 2;\n    margin-bottom: ", ";\n  }\n"])), function (_ref5) {
+var AdditionalButtonWrapper = /*#__PURE__*/styled__default.div(_templateObject9$5 || (_templateObject9$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  @media ", " {\n    width: 100%;\n    display: flex;\n    justify-content: center;\n  }\n"])), devices.mobile);
+var TitleWrapper$3 = /*#__PURE__*/styled__default.div(_templateObject0$5 || (_templateObject0$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  text-align: center;\n  padding: 10px 0;\n\n  h1,\n  h2,\n  h3 {\n    color: ", ";\n  }\n\n  @media ", " {\n    padding: 0;\n    order: 2;\n    margin-bottom: ", ";\n  }\n"])), function (_ref5) {
   var theme = _ref5.theme;
   return theme == exports.ThemeType.Cinema ? 'var(--color-base-black)' : 'var(--color-base-white)';
 }, devices.mobile, function (_ref6) {
@@ -9368,17 +9394,17 @@ var TITLE_MAX_LENGTH = 40;
 var PageHeadingPromo = function PageHeadingPromo(_ref) {
   var _ref$sponsor = _ref.sponsor,
     sponsor = _ref$sponsor === void 0 ? true : _ref$sponsor,
+    className = _ref.className,
+    theme = _ref.theme,
     badge = _ref.badge,
     mainLink = _ref.mainLink,
     title = _ref.title,
     titleSemanticLevel = _ref.titleSemanticLevel,
     additionalLink = _ref.additionalLink,
-    image = _ref.image,
-    className = _ref.className;
+    image = _ref.image;
   var _useViewport = useViewport(),
     isMobile = _useViewport.isMobile,
     hydrated = _useViewport.hydrated;
-  var theme = useHarmonicTheme();
   var showImageButton = !title && !badge && !additionalLink && !isMobile;
   var showContentBlock = !!title || !!additionalLink || !!mainLink && isMobile;
   var truncatedTitle = title ? truncate(title, TITLE_MAX_LENGTH) : null;
@@ -9418,7 +9444,7 @@ var PageHeadingPromo = function PageHeadingPromo(_ref) {
   }), !badge && (/*#__PURE__*/React__default.createElement(AdditionalButtonWrapper, null, /*#__PURE__*/React__default.createElement(Button$1, {
     theme: theme,
     link: additionalLink
-  }))))), title && (/*#__PURE__*/React__default.createElement(TitleWrapper$4, {
+  }))))), title && (/*#__PURE__*/React__default.createElement(TitleWrapper$3, {
     theme: theme,
     isButtonPresent: !!mainLink || !!additionalLink
   }, /*#__PURE__*/React__default.createElement(HarmonicHeader, {
@@ -9436,7 +9462,7 @@ var PageHeadingPromo = function PageHeadingPromo(_ref) {
     theme: theme,
     badge: badge,
     isMobile: isMobile
-  }))), title && (/*#__PURE__*/React__default.createElement(TitleWrapper$4, {
+  }))), title && (/*#__PURE__*/React__default.createElement(TitleWrapper$3, {
     theme: theme,
     isButtonPresent: !!mainLink || !!additionalLink
   }, /*#__PURE__*/React__default.createElement(HarmonicHeader, {
@@ -9456,59 +9482,11 @@ var PageHeadingPromo = function PageHeadingPromo(_ref) {
   })))))))))));
 };
 
-var _templateObject$13, _templateObject2$Q, _templateObject3$D, _templateObject4$y;
-var GRID = {
-  desktop: {
-    leftWithImage: '1 / 1 / 3 / 7',
-    leftNoImage: '1 / 1 / 3 / 12',
-    right: '1 / 7 / 3 / 17'
-  },
-  mobile: {
-    leftWithImage: '3 / 1 / 4 / 15',
-    leftNoImage: '1 / 1 / 3 / 15',
-    right: '2 / 1 / 3 / 15'
-  }
-};
-var HighlightPanelGrid = /*#__PURE__*/styled__default(Grid)(_templateObject$13 || (_templateObject$13 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  gap: 0 var(--grid-column-gap);\n  background-color: ", ";\n  color: var(--color-base-white);\n"])), function (_ref) {
-  var $background = _ref.$background;
-  return "var(--color-" + $background + ")";
-});
-var LeftPanel$1 = /*#__PURE__*/styled__default.div(_templateObject2$Q || (_templateObject2$Q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  grid-area: ", ";\n\n  box-sizing: border-box;\n  height: 100%;\n  display: grid;\n  grid-auto-rows: 90% 1fr;\n  gap: 0 36px;\n  align-items: center;\n\n  @media ", " {\n    grid-area: ", ";\n  }\n"])), function (_ref2) {
-  var hasImage = _ref2.hasImage;
-  return hasImage ? GRID.desktop.leftWithImage : GRID.desktop.leftNoImage;
-}, devices.mobileAndTablet, function (_ref3) {
-  var hasImage = _ref3.hasImage;
-  return hasImage ? GRID.mobile.leftWithImage : GRID.mobile.leftNoImage;
-});
-var RightPanel$1 = /*#__PURE__*/styled__default.div(_templateObject3$D || (_templateObject3$D = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  grid-area: ", ";\n  position: relative;\n  height: 100%;\n  width: 100%;\n  background-color: var(--color-base-black);\n\n  @media ", " {\n    grid-area: ", ";\n  }\n"])), GRID.desktop.right, devices.mobileAndTablet, GRID.mobile.right);
-var Wrapper$6 = /*#__PURE__*/styled__default.div(_templateObject4$y || (_templateObject4$y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin: 36px 36px 36px 50px;\n  overflow: hidden;\n\n  :first-child * {\n    margin-block-start: 0;\n  }\n\n  @media ", " {\n    margin: 36px 20px 5px 20px;\n    max-height: unset;\n  }\n"])), devices.mobileAndTablet);
-
-var PageHeadingHighlight = function PageHeadingHighlight(_ref) {
-  var _image$src, _image$alt;
-  var image = _ref.image,
-    children = _ref.children,
-    _ref$background = _ref.background,
-    background = _ref$background === void 0 ? 'base-black' : _ref$background,
-    className = _ref.className;
-  return /*#__PURE__*/React__default.createElement(HighlightPanelGrid, {
-    className: className,
-    "$background": background,
-    "data-testid": "highlight-heading-wrapper"
-  }, /*#__PURE__*/React__default.createElement(LeftPanel$1, {
-    hasImage: !!image
-  }, /*#__PURE__*/React__default.createElement(Wrapper$6, null, children)), image && (/*#__PURE__*/React__default.createElement(RightPanel$1, null, /*#__PURE__*/React__default.createElement(ImageAspectRatioWrapper, {
-    aspectRatio: exports.AspectRatio['4:3']
-  }, /*#__PURE__*/React__default.createElement("img", {
-    src: (_image$src = image == null ? void 0 : image.src) != null ? _image$src : '',
-    alt: (_image$alt = image == null ? void 0 : image.alt) != null ? _image$alt : ''
-  })))));
-};
-
-var _templateObject$14, _templateObject2$R, _templateObject3$E, _templateObject5$r, _templateObject6$k, _templateObject7$g, _templateObject8$c, _templateObject9$8, _templateObject0$7;
-var BrandingTextBlock = /*#__PURE__*/styled__default.div(_templateObject$14 || (_templateObject$14 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  font-size: var(--font-size-body-2);\n  font-family: var(--font-family-header);\n  text-transform: uppercase;\n  margin: 0;\n  white-space: nowrap;\n  @media screen and (max-width: 920px) {\n    white-space: normal;\n  }\n  @media ", " {\n    white-space: nowrap;\n  }\n"])), devices.mobile);
-var BrandingTextBody = /*#__PURE__*/styled__default.div(_templateObject2$R || (_templateObject2$R = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  font-family: var(--font-family-body);\n  font-size: var(--font-size-heading-6);\n  line-height: var(--line-height-heading-6);\n"])));
-var ComapctHeaderWrapper = /*#__PURE__*/styled__default.div(_templateObject3$E || (_templateObject3$E = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: relative;\n  display: block;\n"])));
-var CompactHeaderAssetWrapper = /*#__PURE__*/styled__default.div(_templateObject5$r || (_templateObject5$r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  height: 37.5vw;\n  width: 100%;\n  position: relative;\n  overflow: hidden;\n  background-color: #000;\n  img {\n    position: relative;\n    height: 100%;\n    width: 100%;\n    object-fit: cover;\n  }\n  video {\n    position: absolute;\n    top: 0;\n    left: 0;\n    height: 100%;\n    width: 100%;\n    object-fit: contain;\n    @media ", " {\n      position: absolute;\n      top: 0;\n      left: 0;\n      bottom: 0;\n      margin: auto;\n      height: auto;\n      max-height: 100vh;\n      width: 100%;\n      object-fit: contain;\n    }\n  }\n  @media ", " {\n    height: 85vw;\n    max-height: 100vh;\n  }\n"])), devices.mobile, devices.mobile);
+var _templateObject$13, _templateObject2$Q, _templateObject3$D, _templateObject5$q, _templateObject6$k, _templateObject7$e, _templateObject8$b, _templateObject9$6, _templateObject0$6;
+var BrandingTextBlock = /*#__PURE__*/styled__default.div(_templateObject$13 || (_templateObject$13 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  font-size: var(--font-size-body-2);\n  font-family: var(--font-family-header);\n  text-transform: uppercase;\n  margin: 0;\n  white-space: nowrap;\n  @media screen and (max-width: 920px) {\n    white-space: normal;\n  }\n  @media ", " {\n    white-space: nowrap;\n  }\n"])), devices.mobile);
+var BrandingTextBody = /*#__PURE__*/styled__default.div(_templateObject2$Q || (_templateObject2$Q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  font-family: var(--font-family-body);\n  font-size: var(--font-size-heading-6);\n  line-height: var(--line-height-heading-6);\n"])));
+var ComapctHeaderWrapper = /*#__PURE__*/styled__default.div(_templateObject3$D || (_templateObject3$D = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: relative;\n  display: block;\n"])));
+var CompactHeaderAssetWrapper = /*#__PURE__*/styled__default.div(_templateObject5$q || (_templateObject5$q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  height: 37.5vw;\n  width: 100%;\n  position: relative;\n  overflow: hidden;\n  background-color: #000;\n  img {\n    position: relative;\n    height: 100%;\n    width: 100%;\n    object-fit: cover;\n  }\n  video {\n    position: absolute;\n    top: 0;\n    left: 0;\n    height: 100%;\n    width: 100%;\n    object-fit: contain;\n    @media ", " {\n      position: absolute;\n      top: 0;\n      left: 0;\n      bottom: 0;\n      margin: auto;\n      height: auto;\n      max-height: 100vh;\n      width: 100%;\n      object-fit: contain;\n    }\n  }\n  @media ", " {\n    height: 85vw;\n    max-height: 100vh;\n  }\n"])), devices.mobile, devices.mobile);
 var CompactHeaderCopyWrapper = /*#__PURE__*/styled__default(Grid)(_templateObject6$k || (_templateObject6$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: relative;\n  height: 160px;\n  grid-template-rows: min-content min-content;\n  grid-template-rows: min-content min-content;\n  grid-template-columns: [logo] 1fr [title] 3fr [cta] 1fr;\n  align-content: center;\n  gap: 0;\n  background-color: ", ";\n  color: ", ";\n\n  svg {\n    width: 210px;\n    fill: ", ";\n  }\n\n  h1::selection,\n  div::selection {\n    ", ";\n  }\n\n  @media ", " {\n    svg {\n      width: 145px;\n    }\n  }\n\n  @media ", " {\n    display: flex;\n    flex-direction: column;\n    height: auto;\n    padding: 32px 20px;\n\n    svg {\n      width: 180px;\n    }\n  }\n"])), function (_ref) {
   var invert = _ref.invert,
     theme = _ref.theme;
@@ -9525,10 +9503,10 @@ var CompactHeaderCopyWrapper = /*#__PURE__*/styled__default(Grid)(_templateObjec
   var theme = _ref4.theme;
   return theme.colors.primary === theme.colors.stream && "\n      color: " + theme.colors.stream + ";\n      background-color: " + theme.colors.white + ";\n    ";
 }, devices.tablet, devices.mobile);
-var CompactHeaderLogoWrapper = /*#__PURE__*/styled__default.div(_templateObject7$g || (_templateObject7$g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  grid-area: logo;\n  padding-left: 50px;\n  justify-content: left;\n  align-items: center;\n  width: 100%;\n  @media ", " {\n    padding-left: 0px;\n    justify-content: center;\n  }\n  @media ", " {\n    width: fit-content;\n  }\n"])), devices.mobile, devices.tablet);
-var CompactHeaderTitleWrapper = /*#__PURE__*/styled__default.div(_templateObject8$c || (_templateObject8$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  grid-area: title;\n  align-items: center;\n  justify-content: center;\n  font-family: var(--font-family-header);\n  text-transform: uppercase;\n  text-align: center;\n  padding: 0 2em;\n  @media ", " {\n    justify-content: center;\n  }\n"])), devices.mobile);
-var CompactHeaderCTAWrapper = /*#__PURE__*/styled__default.div(_templateObject9$8 || (_templateObject9$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  grid-area: cta;\n  justify-content: right;\n  align-items: center;\n  padding-right: 50px;\n  @media ", " {\n    padding-right: 0px;\n    justify-content: center;\n  }\n"])), devices.mobile);
-var PrimaryButtonWithInversion = /*#__PURE__*/styled__default(PrimaryButton)(_templateObject0$7 || (_templateObject0$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  background-color: ", ";\n  color: ", ";\n  svg {\n    fill: ", ";\n    path {\n      fill: ", ";\n    }\n  }\n  min-width: 145px;\n"])), function (_ref5) {
+var CompactHeaderLogoWrapper = /*#__PURE__*/styled__default.div(_templateObject7$e || (_templateObject7$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  grid-area: logo;\n  padding-left: 50px;\n  justify-content: left;\n  align-items: center;\n  width: 100%;\n  @media ", " {\n    padding-left: 0px;\n    justify-content: center;\n  }\n  @media ", " {\n    width: fit-content;\n  }\n"])), devices.mobile, devices.tablet);
+var CompactHeaderTitleWrapper = /*#__PURE__*/styled__default.div(_templateObject8$b || (_templateObject8$b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  grid-area: title;\n  align-items: center;\n  justify-content: center;\n  font-family: var(--font-family-header);\n  text-transform: uppercase;\n  text-align: center;\n  padding: 0 2em;\n  @media ", " {\n    justify-content: center;\n  }\n"])), devices.mobile);
+var CompactHeaderCTAWrapper = /*#__PURE__*/styled__default.div(_templateObject9$6 || (_templateObject9$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  grid-area: cta;\n  justify-content: right;\n  align-items: center;\n  padding-right: 50px;\n  @media ", " {\n    padding-right: 0px;\n    justify-content: center;\n  }\n"])), devices.mobile);
+var PrimaryButtonWithInversion = /*#__PURE__*/styled__default(PrimaryButton)(_templateObject0$6 || (_templateObject0$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  background-color: ", ";\n  color: ", ";\n  svg {\n    fill: ", ";\n    path {\n      fill: ", ";\n    }\n  }\n  min-width: 145px;\n"])), function (_ref5) {
   var invert = _ref5.invert,
     theme = _ref5.theme;
   return invert ? theme.colors.primary : theme.colors.white;
@@ -9758,14 +9736,14 @@ var PageHeadingCompact = function PageHeadingCompact(_ref4) {
   }), linkText))))));
 };
 
-var _templateObject$15, _templateObject2$S, _templateObject3$F, _templateObject5$s, _templateObject6$l, _templateObject7$h, _templateObject8$d;
-var linkButtonStyles = /*#__PURE__*/styled.css(_templateObject$15 || (_templateObject$15 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  margin-left: 0;\n  background: none;\n  border: none;\n  color: inherit;\n  text-decoration: none;\n  cursor: pointer;\n  font: inherit;\n  padding: 0;\n\n  span {\n    height: 1.5em;\n    width: 1.5em;\n\n    svg > path {\n      fill: var(--color-base-black);\n    }\n  }\n\n  &:hover {\n    outline: none;\n  }\n"])));
-var PageNav = /*#__PURE__*/styled__default.a(_templateObject2$S || (_templateObject2$S = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  ", "\n"])), linkButtonStyles);
-var PaginationLink = /*#__PURE__*/styled__default.a(_templateObject3$F || (_templateObject3$F = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  ", "\n"])), linkButtonStyles);
-var PageNumberWrapper = /*#__PURE__*/styled__default.ol(_templateObject5$s || (_templateObject5$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  min-width: fit-content;\n  align-items: center;\n  justify-content: center;\n  flex-wrap: nowrap;\n  flex-direction: row;\n  list-style: none;\n  padding: 0;\n  max-width: fit-content;\n  margin: 0 auto;\n\n  li {\n    margin-left: 24px;\n    color: var(--color-base-black);\n    display: flex;\n    justify-content: flex-start;\n    align-items: center;\n  }\n\n  li:first-child {\n    margin-left: 0px;\n  }\n"])));
+var _templateObject$14, _templateObject2$R, _templateObject3$E, _templateObject5$r, _templateObject6$l, _templateObject7$f, _templateObject8$c;
+var linkButtonStyles = /*#__PURE__*/styled.css(_templateObject$14 || (_templateObject$14 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  margin-left: 0;\n  background: none;\n  border: none;\n  color: inherit;\n  text-decoration: none;\n  cursor: pointer;\n  font: inherit;\n  padding: 0;\n\n  span {\n    height: 1.5em;\n    width: 1.5em;\n\n    svg > path {\n      fill: var(--color-base-black);\n    }\n  }\n\n  &:hover {\n    outline: none;\n  }\n"])));
+var PageNav = /*#__PURE__*/styled__default.a(_templateObject2$R || (_templateObject2$R = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  ", "\n"])), linkButtonStyles);
+var PaginationLink = /*#__PURE__*/styled__default.a(_templateObject3$E || (_templateObject3$E = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  ", "\n"])), linkButtonStyles);
+var PageNumberWrapper = /*#__PURE__*/styled__default.ol(_templateObject5$r || (_templateObject5$r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  min-width: fit-content;\n  align-items: center;\n  justify-content: center;\n  flex-wrap: nowrap;\n  flex-direction: row;\n  list-style: none;\n  padding: 0;\n  max-width: fit-content;\n  margin: 0 auto;\n\n  li {\n    margin-left: 24px;\n    color: var(--color-base-black);\n    display: flex;\n    justify-content: flex-start;\n    align-items: center;\n  }\n\n  li:first-child {\n    margin-left: 0px;\n  }\n"])));
 var LastPageItem = /*#__PURE__*/styled__default.li(_templateObject6$l || (_templateObject6$l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  && {\n    margin-left: 12px;\n  }\n"])));
-var PreviousPageItem = /*#__PURE__*/styled__default.li(_templateObject7$h || (_templateObject7$h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  && {\n    margin-left: 12px;\n  }\n"])));
-var TextLinkPagination = /*#__PURE__*/styled__default(BodyCopyHarmonic)(_templateObject8$d || (_templateObject8$d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  && {\n    color: ", ";\n    border-bottom: ", ";\n  }\n\n  :hover {\n    cursor: pointer;\n    color: var(--color-primary-red);\n    border-bottom: 1px solid var(--color-primary-red);\n    svg > path {\n      fill: var(--color-base-black);\n    }\n  }\n"])), function (_ref) {
+var PreviousPageItem = /*#__PURE__*/styled__default.li(_templateObject7$f || (_templateObject7$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  && {\n    margin-left: 12px;\n  }\n"])));
+var TextLinkPagination = /*#__PURE__*/styled__default(BodyCopyHarmonic)(_templateObject8$c || (_templateObject8$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  && {\n    color: ", ";\n    border-bottom: ", ";\n  }\n\n  :hover {\n    cursor: pointer;\n    color: var(--color-primary-red);\n    border-bottom: 1px solid var(--color-primary-red);\n    svg > path {\n      fill: var(--color-base-black);\n    }\n  }\n"])), function (_ref) {
   var active = _ref.active;
   return active ? "var(--color-primary-red)" : 'inherit';
 }, function (_ref2) {
@@ -9913,14 +9891,14 @@ var Pagination = function Pagination(_ref) {
   }))))));
 };
 
-var _templateObject$16, _templateObject2$T, _templateObject3$G, _templateObject4$z, _templateObject5$t, _templateObject6$m, _templateObject7$i;
-var PeopleListingGrid = /*#__PURE__*/styled__default(Grid)(_templateObject$16 || (_templateObject$16 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  gap: var(--line-height-people-listing-gap) var(--grid-column-gap);\n\n  p {\n    margin: 0;\n  }\n\n  grid-template-columns: 1fr 1fr 1fr;\n\n  @media ", " {\n    grid-template-columns: 1fr;\n  }\n\n  @media ", " {\n    grid-template-columns: 1fr 1fr;\n  }\n\n  @media ", " {\n    grid-template-columns: 1fr 1fr 1fr 1fr;\n  }\n"])), devices.mobile, devices.tablet, devices.largeDesktop);
-var PersonWrapper = /*#__PURE__*/styled__default.div(_templateObject2$T || (_templateObject2$T = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: grid;\n  grid-template-columns: 60px 1fr;\n  grid-template-areas: 'headshot role-person';\n  grid-column-gap: 10px;\n"])));
-var HeadshotWrapper = /*#__PURE__*/styled__default.div(_templateObject3$G || (_templateObject3$G = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  grid-area: headshot;\n  img {\n    width: 60px;\n    height: 60px;\n  }\n"])));
-var RoleWrapper = /*#__PURE__*/styled__default.div(_templateObject4$z || (_templateObject4$z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: var(--base-color-dark-grey);\n  overflow-wrap: break-word;\n  margin-bottom: 4px;\n"])));
-var TextWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject5$t || (_templateObject5$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  grid-area: role-person;\n  break-inside: avoid;\n"])));
+var _templateObject$15, _templateObject2$S, _templateObject3$F, _templateObject4$x, _templateObject5$s, _templateObject6$m, _templateObject7$g;
+var PeopleListingGrid = /*#__PURE__*/styled__default(Grid)(_templateObject$15 || (_templateObject$15 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  gap: var(--line-height-people-listing-gap) var(--grid-column-gap);\n\n  p {\n    margin: 0;\n  }\n\n  grid-template-columns: 1fr 1fr 1fr;\n\n  @media ", " {\n    grid-template-columns: 1fr;\n  }\n\n  @media ", " {\n    grid-template-columns: 1fr 1fr;\n  }\n\n  @media ", " {\n    grid-template-columns: 1fr 1fr 1fr 1fr;\n  }\n"])), devices.mobile, devices.tablet, devices.largeDesktop);
+var PersonWrapper = /*#__PURE__*/styled__default.div(_templateObject2$S || (_templateObject2$S = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: grid;\n  grid-template-columns: 60px 1fr;\n  grid-template-areas: 'headshot role-person';\n  grid-column-gap: 10px;\n"])));
+var HeadshotWrapper = /*#__PURE__*/styled__default.div(_templateObject3$F || (_templateObject3$F = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  grid-area: headshot;\n  img {\n    width: 60px;\n    height: 60px;\n  }\n"])));
+var RoleWrapper = /*#__PURE__*/styled__default.div(_templateObject4$x || (_templateObject4$x = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: var(--base-color-dark-grey);\n  overflow-wrap: break-word;\n  margin-bottom: 4px;\n"])));
+var TextWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject5$s || (_templateObject5$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  grid-area: role-person;\n  break-inside: avoid;\n"])));
 var PersonLink = /*#__PURE__*/styled__default.a(_templateObject6$m || (_templateObject6$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: var(--base-color-black);\n  text-decoration: underline;\n\n  :hover {\n    color: var(--base-color-primary);\n    :after {\n      color: var(--base-color-black);\n    }\n  }\n\n  :visited {\n    color: var(--base-color-black);\n  }\n"])));
-var ReplacementWrapper = /*#__PURE__*/styled__default.span(_templateObject7$i || (_templateObject7$i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: var(--base-color-dark-grey);\n"])));
+var ReplacementWrapper = /*#__PURE__*/styled__default.span(_templateObject7$g || (_templateObject7$g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: var(--base-color-dark-grey);\n"])));
 
 var Person = function Person(_ref) {
   var person = _ref.person,
@@ -9977,14 +9955,14 @@ var PeopleListing = function PeopleListing(_ref) {
   }));
 };
 
-var _templateObject$17, _templateObject2$U, _templateObject3$H, _templateObject4$A;
-var ReplacementWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject$17 || (_templateObject$17 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: var(--base-color-darkgrey);\n"])));
-var CreditListingWrapper = /*#__PURE__*/styled__default(PeopleListingGrid)(_templateObject2$U || (_templateObject2$U = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  p {\n    line-height: 1.5;\n  }\n\n  grid-template-columns: ", ";\n\n  @media ", " {\n    grid-template-columns: 1fr;\n  }\n\n  @media ", " {\n    grid-template-columns: repeat(2, 1fr);\n  }\n"])), function (_ref) {
+var _templateObject$16, _templateObject2$T, _templateObject3$G, _templateObject4$y;
+var ReplacementWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject$16 || (_templateObject$16 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: var(--base-color-darkgrey);\n"])));
+var CreditListingWrapper = /*#__PURE__*/styled__default(PeopleListingGrid)(_templateObject2$T || (_templateObject2$T = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  p {\n    line-height: 1.5;\n  }\n\n  grid-template-columns: ", ";\n\n  @media ", " {\n    grid-template-columns: 1fr;\n  }\n\n  @media ", " {\n    grid-template-columns: repeat(2, 1fr);\n  }\n"])), function (_ref) {
   var columnCount = _ref.columnCount;
   return "repeat(" + columnCount + ", 1fr)";
 }, devices.mobile, devices.tablet);
-var DescriptionWrapper = /*#__PURE__*/styled__default.div(_templateObject3$H || (_templateObject3$H = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: var(--base-color-darkgrey);\n  p {\n    line-height: 25px;\n    margin-bottom: 3px;\n  }\n"])));
-var RoleWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject4$A || (_templateObject4$A = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: var(--base-color-darkgrey);\n  overflow-wrap: break-word;\n  min-height: 1.5em;\n"])));
+var DescriptionWrapper = /*#__PURE__*/styled__default.div(_templateObject3$G || (_templateObject3$G = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: var(--base-color-darkgrey);\n  p {\n    line-height: 25px;\n    margin-bottom: 3px;\n  }\n"])));
+var RoleWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject4$y || (_templateObject4$y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: var(--base-color-darkgrey);\n  overflow-wrap: break-word;\n  min-height: 1.5em;\n"])));
 
 // Get the total character length of a property in an array of objects
 var getConcatenatedPropLength = function getConcatenatedPropLength(array, prop) {
@@ -10111,14 +10089,14 @@ var CreditListing = function CreditListing(_ref) {
   }, creditEntries);
 };
 
-var _templateObject$18, _templateObject3$I, _templateObject4$B, _templateObject5$u, _templateObject6$n, _templateObject7$j, _templateObject8$e, _templateObject9$9, _templateObject0$8, _templateObject1$4, _templateObject10$3, _templateObject11$3, _templateObject12$3, _templateObject13$2, _templateObject14$1, _templateObject15$1, _templateObject16;
+var _templateObject$17, _templateObject2$U, _templateObject3$H, _templateObject4$z, _templateObject5$t, _templateObject6$n, _templateObject7$h, _templateObject8$d, _templateObject9$7, _templateObject0$7, _templateObject1$4, _templateObject10$3, _templateObject11$3, _templateObject12$3, _templateObject13$2, _templateObject14$1, _templateObject15$1, _templateObject16, _templateObject17, _templateObject18, _templateObject19;
 var LENGTH_TEXT = 28;
 var LENGTH_TEXT_TABLET$1 = 12;
 var GridTemplateImageToLeft = "'left left left left left left left left . right right right right right . .'";
 var GridTemplateImageToRight = "'. . left left left left left . right right right right right right right right'";
 var GridTemplateAsCard = "'. . left left left left left right right right right right right right . . '";
 var GridTemplateAsCardTablet = "'. . left left left left left left left right right right right right . . '";
-var PromoWithTagsGrid = /*#__PURE__*/styled__default(Grid)(_templateObject$18 || (_templateObject$18 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  grid-template-areas: ", ";\n\n  @media ", " {\n    & {\n      grid-template-areas: ", ";\n    }\n  }\n\n  @media ", " {\n    & {\n      grid-template-columns: var(--grid-margin) minmax(0, 1fr) var(--grid-margin);\n      grid-template-rows: min-content 24px min-content;\n      gap: 0;\n      grid-template-areas:\n        'row1 row1 row1'\n        '. . .'\n        '. row2 .';\n    }\n  }\n\n  /* Overwrite template for card */\n  ", "\n"])), function (_ref) {
+var PromoWithTagsGrid = /*#__PURE__*/styled__default(Grid)(_templateObject$17 || (_templateObject$17 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  grid-template-areas: ", ";\n\n  @media ", " {\n    & {\n      grid-template-areas: ", ";\n    }\n  }\n\n  @media ", " {\n    & {\n      grid-template-columns: var(--grid-margin) minmax(0, 1fr) var(--grid-margin);\n      grid-template-rows: min-content 24px min-content;\n      gap: 0;\n      grid-template-areas:\n        'row1 row1 row1'\n        '. . .'\n        '. row2 .';\n    }\n  }\n\n  /* Overwrite template for card */\n  ", "\n"])), function (_ref) {
   var imageToLeft = _ref.imageToLeft;
   return imageToLeft ? GridTemplateImageToLeft : GridTemplateImageToRight;
 }, devices.tablet, function (_ref2) {
@@ -10128,7 +10106,9 @@ var PromoWithTagsGrid = /*#__PURE__*/styled__default(Grid)(_templateObject$18 ||
   var asCard = _ref3.asCard;
   return asCard ? "\n    grid-template-areas: " + GridTemplateAsCard + ";\n    @media " + devices.tablet + " {\n      grid-template-areas: " + GridTemplateAsCardTablet + ";\n    }\n  " : "";
 });
-var ButtonsContainer$2 = /*#__PURE__*/styled__default.div(_templateObject3$I || (_templateObject3$I = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  gap: 16px;\n  margin-top: 24px;\n\n  ", ";\n\n  ", "\n\n  @media ", " {\n    gap: 24px;\n    flex-direction: column;\n    align-items: center;\n  }\n\n  @media ", " {\n    gap: 24px;\n    align-items: flex-start;\n\n    ", "\n  }\n"])), function (_ref4) {
+var PromoWithTagsSubtitle = /*#__PURE__*/styled__default.span(_templateObject2$U || (_templateObject2$U = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  font-family: var(--font-family-subtitle);\n  font-feature-settings: var(--font-feature-settings-subtitle);\n  font-size: var(--font-size-subtitle-1);\n  font-weight: var(--font-weight-subtitle-1);\n  line-height: var(--line-height-subtitle-1);\n  letter-spacing: var(--letter-spacing-subtitle-1);\n  text-transform: var(--text-transform-subtitle);\n  margin-bottom: var(--editorial-subtitle-margin-bottom);\n  display: block;\n  overflow-wrap: break-word;\n"])));
+var PromoWithTagsText = /*#__PURE__*/styled__default.div(_templateObject3$H || (_templateObject3$H = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  font-family: var(--font-family-body);\n  font-feature-settings: var(--font-feature-settings-body);\n  font-size: var(--font-size-body-1);\n  font-weight: var(--font-weight-body-1);\n  line-height: var(--line-height-body-1);\n  letter-spacing: var(--letter-spacing-body-1);\n  text-transform: var(--text-transform-body);\n  margin: 0;\n  padding: 0;\n  white-space: break-spaces;\n  overflow-wrap: break-word;\n\n  h5,\n  h6 {\n    margin: 0 0 4px 0;\n    font-family: var(--font-family-subtitle);\n    font-feature-settings: var(--font-feature-settings-subtitle);\n    font-size: var(--font-size-subtitle-2);\n    font-weight: var(--font-weight-subtitle-2);\n    line-height: var(--line-height-subtitle-2);\n    letter-spacing: var(--letter-spacing-subtitle-2);\n    text-transform: var(--text-transform-subtitle);\n    overflow-wrap: break-word;\n  }\n\n  em {\n    font-family: var(--font-family-body-italics);\n  }\n\n  a {\n    text-decoration: underline;\n    cursor: pointer;\n\n    &[href^='tel:'] {\n      text-decoration: none;\n    }\n\n    &:link {\n      color: var(--color-primary-black);\n    }\n\n    &:visited {\n      color: var(--color-base-dark-grey);\n    }\n\n    &:hover {\n      color: var(--color-primary-red);\n    }\n  }\n"])));
+var ButtonsContainer$2 = /*#__PURE__*/styled__default.div(_templateObject4$z || (_templateObject4$z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  gap: 16px;\n  margin-top: 24px;\n\n  ", ";\n\n  ", "\n\n  @media ", " {\n    gap: 24px;\n    flex-direction: column;\n    align-items: center;\n  }\n\n  @media ", " {\n    gap: 24px;\n    align-items: flex-start;\n\n    ", "\n  }\n"])), function (_ref4) {
   var hasTextLinks = _ref4.hasTextLinks;
   return "margin-top: " + (hasTextLinks ? '0' : '24px') + ";";
 }, function (_ref5) {
@@ -10152,39 +10132,38 @@ var ButtonsContainer$2 = /*#__PURE__*/styled__default.div(_templateObject3$I ||
   }
   return '';
 });
-var PromoWithTagsTagWrapper = /*#__PURE__*/styled__default.div(_templateObject4$B || (_templateObject4$B = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin-bottom: ", ";\n\n  ", "\n"])), function (_ref7) {
+var PromoWithTagsTagWrapper = /*#__PURE__*/styled__default.div(_templateObject5$t || (_templateObject5$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin-bottom: ", ";\n"])), function (_ref7) {
   var marginBottom = _ref7.marginBottom;
   return marginBottom + "px";
-}, function (_ref8) {
-  var mobileMarginBottom = _ref8.mobileMarginBottom;
-  return mobileMarginBottom && "\n      @media " + devices.mobile + " {\n        margin-bottom: " + mobileMarginBottom + "px;\n      }\n    ";
-});
-var TextLinksContainer = /*#__PURE__*/styled__default.div(_templateObject5$u || (_templateObject5$u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-wrap: wrap;\n  margin: 24px 0 4px 0;\n"])));
-var TextLinkWrapper$3 = /*#__PURE__*/styled__default.div(_templateObject6$n || (_templateObject6$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin-right: 24px;\n  margin-bottom: 20px;\n\n  &:last-child {\n    margin-right: 0;\n  }\n"])));
-var ExtraContentWrapper = /*#__PURE__*/styled__default.div(_templateObject7$j || (_templateObject7$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: relative;\n  padding-right: 68px;\n\n  iframe {\n    height: 800px;\n  }\n\n  @media ", " {\n    padding: 30px 0 0;\n  }\n\n  @media ", " {\n    padding: 0;\n    position: initial;\n  }\n"])), devices.tablet, devices.mobile);
-var IconWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject8$e || (_templateObject8$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  cursor: pointer;\n  position: absolute;\n  top: 25px;\n  right: 35px;\n  width: 24px;\n  height: 24px;\n\n  @media ", " {\n    top: 30px;\n    right: 30px;\n  }\n\n  @media ", " {\n    top: 3px;\n    right: 20px;\n  }\n"])), devices.tablet, devices.mobile);
-var PrimaryButtonWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject9$9 || (_templateObject9$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  height: var(--button-height);\n\n  @media ", " {\n    width: 100%;\n  }\n"])), devices.mobile);
-var MobileTitleWrapper = /*#__PURE__*/styled__default.div(_templateObject0$8 || (_templateObject0$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: none;\n  margin: 0 50px 0 20px;\n\n  h2,\n  h3 {\n    margin: 0;\n  }\n\n  @media ", " {\n    display: block;\n  }\n"])), devices.mobile);
-var asCardOverrides = /*#__PURE__*/styled.css(_templateObject1$4 || (_templateObject1$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  ", " {\n    flex-direction: row;\n    @media ", " {\n      flex-direction: row;\n    }\n  }\n"])), ButtonsContainer$2, devices.tablet);
-var PromoWithTagsExtraContentWrapper = /*#__PURE__*/styled__default.div(_templateObject10$3 || (_templateObject10$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: relative;\n  grid-area: left;\n  grid-area: ", ";\n  align-self: center;\n  @media ", " {\n    & {\n      grid-area: row1;\n    }\n  }\n"])), function (_ref9) {
-  var imageToLeft = _ref9.imageToLeft;
+});
+var PromoWithTagsAdditionalText = /*#__PURE__*/styled__default(PromoWithTagsText)(_templateObject6$n || (_templateObject6$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin: 24px 0;\n"])));
+var TextLinksContainer = /*#__PURE__*/styled__default.div(_templateObject7$h || (_templateObject7$h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-wrap: wrap;\n  margin: 24px 0 4px 0;\n"])));
+var TextLinkWrapper$3 = /*#__PURE__*/styled__default.div(_templateObject8$d || (_templateObject8$d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin-right: 24px;\n  margin-bottom: 20px;\n\n  &:last-child {\n    margin-right: 0;\n  }\n"])));
+var ExtraContentWrapper = /*#__PURE__*/styled__default.div(_templateObject9$7 || (_templateObject9$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: relative;\n  padding-right: 68px;\n\n  iframe {\n    height: 800px;\n  }\n\n  @media ", " {\n    padding: 30px 0 0;\n  }\n\n  @media ", " {\n    padding: 0;\n    position: initial;\n  }\n"])), devices.tablet, devices.mobile);
+var IconWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject0$7 || (_templateObject0$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  cursor: pointer;\n  position: absolute;\n  top: 25px;\n  right: 35px;\n  width: 24px;\n  height: 24px;\n\n  @media ", " {\n    top: 30px;\n    right: 30px;\n  }\n\n  @media ", " {\n    top: 3px;\n    right: 20px;\n  }\n"])), devices.tablet, devices.mobile);
+var PrimaryButtonWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject1$4 || (_templateObject1$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  height: var(--button-height);\n\n  @media ", " {\n    width: 100%;\n  }\n"])), devices.mobile);
+var MobileTitleWrapper = /*#__PURE__*/styled__default.div(_templateObject10$3 || (_templateObject10$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: none;\n  margin: 0 50px 0 20px;\n\n  h2,\n  h3 {\n    margin: 0;\n  }\n\n  @media ", " {\n    display: block;\n  }\n"])), devices.mobile);
+var PromoWithTagsTypeTags = /*#__PURE__*/styled__default(TypeTags)(_templateObject11$3 || (_templateObject11$3 = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
+var PromoWithTagsHeader = /*#__PURE__*/styled__default(Header)(_templateObject12$3 || (_templateObject12$3 = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
+var PromoWithTagsTextLink = /*#__PURE__*/styled__default(TextLink)(_templateObject13$2 || (_templateObject13$2 = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
+var asCardOverrides = /*#__PURE__*/styled.css(_templateObject14$1 || (_templateObject14$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  ", " {\n    font-size: var(--font-size-subtitle-2);\n  }\n\n  ", " {\n    font-size: var(--font-size-overline-1);\n  }\n\n  ", " {\n    flex-direction: row;\n    @media ", " {\n      flex-direction: row;\n    }\n  }\n\n  ", " {\n    font-size: var(--font-size-overline-2);\n    font-weight: var(--font-weight-overline-2);\n    line-height: var(--line-height-overline-2);\n    letter-spacing: var(--letter-spacing-overline-2);\n  }\n"])), PromoWithTagsSubtitle, PromoWithTagsTypeTags, ButtonsContainer$2, devices.tablet, PromoWithTagsTextLink);
+var PromoWithTagsExtraContentWrapper = /*#__PURE__*/styled__default.div(_templateObject15$1 || (_templateObject15$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: relative;\n  grid-area: left;\n  grid-area: ", ";\n  align-self: center;\n  @media ", " {\n    & {\n      grid-area: row1;\n    }\n  }\n"])), function (_ref8) {
+  var imageToLeft = _ref8.imageToLeft;
   return imageToLeft ? 'left' : 'right';
 }, devices.mobile);
-var PromoWithTagsContentWrapper = /*#__PURE__*/styled__default.div(_templateObject11$3 || (_templateObject11$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  grid-area: ", ";\n  align-self: center;\n  @media ", " {\n    & {\n      display: ", ";\n      grid-area: row2;\n      align-self: start;\n    }\n  }\n\n  ", "\n"])), function (_ref0) {
-  var imageToLeft = _ref0.imageToLeft;
+var PromoWithTagsContentWrapper = /*#__PURE__*/styled__default.div(_templateObject16 || (_templateObject16 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  grid-area: ", ";\n  align-self: center;\n  @media ", " {\n    & {\n      display: ", ";\n      grid-area: row2;\n      align-self: start;\n    }\n  }\n\n  ", "\n"])), function (_ref9) {
+  var imageToLeft = _ref9.imageToLeft;
   return imageToLeft ? 'right' : 'left';
-}, devices.mobile, function (_ref1) {
-  var hideSection = _ref1.hideSection;
+}, devices.mobile, function (_ref0) {
+  var hideSection = _ref0.hideSection;
   return hideSection ? 'none' : 'block';
-}, function (_ref10) {
-  var asCard = _ref10.asCard;
+}, function (_ref1) {
+  var asCard = _ref1.asCard;
   return asCard && asCardOverrides;
 });
-var TimerWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject12$3 || (_templateObject12$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin-bottom: 32px;\n"])));
-var EndDateText = /*#__PURE__*/styled__default.div(_templateObject13$2 || (_templateObject13$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  border-bottom: 1px solid var(--color-base-black);\n  padding-bottom: 32px;\n  margin-bottom: 32px;\n\n  @media ", " {\n    padding-bottom: 20px;\n    margin-bottom: 20px;\n  }\n"])), devices.mobile);
-var HarmonicHeaderWithWrapper = /*#__PURE__*/styled__default(HarmonicHeader)(_templateObject14$1 || (_templateObject14$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin: 0;\n  padding-bottom: 32px;\n\n  @media ", " {\n    padding-bottom: 24px;\n  }\n"])), devices.mobileAndTablet);
-var BodyCopyHarmonicWithWrapper$1 = /*#__PURE__*/styled__default(BodyCopyHarmonic)(_templateObject15$1 || (_templateObject15$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  padding: 0;\n  margin: 0;\n  margin-bottom: 32px;\n  whiete-space: break-spaces;\n  overflow-wrap: break-word;\n\n  a {\n    text-decoration: underline;\n    cursor: pointer;\n\n    &[href^='tel:'] {\n      text-decoration: none;\n    }\n\n    &:link {\n      color: var(--color-primary-black);\n    }\n\n    &:visited {\n      color: var(--color-base-dark-grey);\n    }\n\n    &:hover {\n      color: var(--color-primary-red);\n    }\n  }\n  @media ", " {\n    margin-bottom: 24px;\n  }\n"])), devices.mobile);
-var HarmonicSubtitleWithWrapper = /*#__PURE__*/styled__default(HarmonicSubtitle)(_templateObject16 || (_templateObject16 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  overflow-wrap: break-word;\n  margin-bottom: 16px;\n"])));
+var PromoWithTagsContainer = /*#__PURE__*/styled__default.div(_templateObject17 || (_templateObject17 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  h2,\n  h3 {\n    margin: 0 0 16px;\n  }\n"])));
+var TimerWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject18 || (_templateObject18 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin-bottom: 32px;\n"])));
+var EndDateText = /*#__PURE__*/styled__default.div(_templateObject19 || (_templateObject19 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  border-bottom: 1px solid var(--base-color-black);\n  padding-bottom: 32px;\n  margin-bottom: 32px;\n\n  @media ", " {\n    padding-bottom: 20px;\n    margin-bottom: 20px;\n  }\n"])), devices.mobile);
 
 var _excluded$o = ["text"],
   _excluded2$4 = ["text"],
@@ -10200,7 +10179,6 @@ var PromoWithTags = function PromoWithTags(_ref) {
     title = _ref$title === void 0 ? '' : _ref$title,
     _ref$titleSize = _ref.titleSize,
     titleSize = _ref$titleSize === void 0 ? 'large' : _ref$titleSize,
-    titleHierarchy = _ref.titleHierarchy,
     subtitle = _ref.subtitle,
     text = _ref.text,
     textLinks = _ref.textLinks,
@@ -10227,12 +10205,15 @@ var PromoWithTags = function PromoWithTags(_ref) {
     setIsTimerActive = _useState2[1];
   var getTitleLevel = function getTitleLevel(size, isCard) {
     if (isCard) {
-      return 'medium';
+      return 5;
     }
-    return size;
+    if (size === 'large') {
+      return 2;
+    }
+    return 3;
   };
-  var titleLevel = getTitleLevel(titleSize, asCard);
   var imageToLeft = imagePosition === 'left';
+  var titleLevel = getTitleLevel(titleSize, asCard);
   var isExtraContentPresent = !!children;
   var anchorLink = title.replace(' ', '-').toLocaleLowerCase() + "-content";
   var handleExtraContent = function handleExtraContent(e) {
@@ -10264,15 +10245,15 @@ var PromoWithTags = function PromoWithTags(_ref) {
       restTextLink = _objectWithoutPropertiesLoose(link, _excluded3);
     return /*#__PURE__*/React__default.createElement(TextLinkWrapper$3, {
       key: index
-    }, /*#__PURE__*/React__default.createElement(TextLink, Object.assign({}, restTextLink), textLinkText));
+    }, /*#__PURE__*/React__default.createElement(PromoWithTagsTextLink, Object.assign({}, restTextLink), textLinkText));
   }) : null;
   var renderTimerBlock = function renderTimerBlock() {
     if (!timerParams) return null;
     if (!isTimerActive && timerParams.endDateText) {
       return /*#__PURE__*/React__default.createElement(EndDateText, {
         "data-testid": "promo-with-tags-timer-end-date-text"
-      }, /*#__PURE__*/React__default.createElement(BodyCopyHarmonic, {
-        size: "medium"
+      }, /*#__PURE__*/React__default.createElement(AltHeader, {
+        level: 5
       }, timerParams.endDateText));
     }
     return /*#__PURE__*/React__default.createElement(TimerWrapper$2, {
@@ -10296,36 +10277,30 @@ var PromoWithTags = function PromoWithTags(_ref) {
     imageToLeft: imageToLeft,
     hideSection: showExtraContent,
     asCard: asCard
-  }, renderTimerBlock(), /*#__PURE__*/React__default.createElement(React__default.Fragment, null, !!(aboveTitleTags != null && aboveTitleTags.length) && (/*#__PURE__*/React__default.createElement(PromoWithTagsTagWrapper, {
-    marginBottom: 24
-  }, /*#__PURE__*/React__default.createElement(TypeTags, {
+  }, renderTimerBlock(), /*#__PURE__*/React__default.createElement(PromoWithTagsContainer, null, !!(aboveTitleTags != null && aboveTitleTags.length) && (/*#__PURE__*/React__default.createElement(PromoWithTagsTagWrapper, {
+    marginBottom: 16
+  }, /*#__PURE__*/React__default.createElement(PromoWithTagsTypeTags, {
     list: aboveTitleTags
-  }))), /*#__PURE__*/React__default.createElement(HarmonicHeaderWithWrapper, {
-    size: titleLevel,
-    hierarchy: titleHierarchy
-  }, title)), !!(belowTitleTags != null && belowTitleTags.length) && (/*#__PURE__*/React__default.createElement(PromoWithTagsTagWrapper, {
-    marginBottom: 16,
-    mobileMarginBottom: 24
-  }, /*#__PURE__*/React__default.createElement(TypeTags, {
+  }))), /*#__PURE__*/React__default.createElement(PromoWithTagsHeader, {
+    semanticLevel: 2,
+    level: titleLevel
+  }, title)), subtitle && /*#__PURE__*/React__default.createElement(PromoWithTagsSubtitle, null, subtitle), !!(belowTitleTags != null && belowTitleTags.length) && (/*#__PURE__*/React__default.createElement(PromoWithTagsTagWrapper, {
+    marginBottom: 8
+  }, /*#__PURE__*/React__default.createElement(PromoWithTagsTypeTags, {
     list: belowTitleTags
-  }))), subtitle ? /*#__PURE__*/React__default.createElement(HarmonicSubtitleWithWrapper, {
-    size: "large"
-  }, subtitle) : null, /*#__PURE__*/React__default.createElement(BodyCopyHarmonicWithWrapper$1, {
-    size: "large",
+  }))), /*#__PURE__*/React__default.createElement(PromoWithTagsText, {
     dangerouslySetInnerHTML: {
       __html: textTruncate
     }
-  }), middleText && (/*#__PURE__*/React__default.createElement(BodyCopyHarmonicWithWrapper$1, {
-    size: "large",
+  }), middleText && /*#__PURE__*/React__default.createElement(PromoWithTagsAdditionalText, {
     dangerouslySetInnerHTML: {
       __html: middleText
     }
-  })), bottomText && (/*#__PURE__*/React__default.createElement(BodyCopyHarmonicWithWrapper$1, {
-    size: "large",
+  }), bottomText && /*#__PURE__*/React__default.createElement(PromoWithTagsAdditionalText, {
     dangerouslySetInnerHTML: {
       __html: bottomText
     }
-  })), !!(textLinks != null && textLinks.length) && /*#__PURE__*/React__default.createElement(TextLinksContainer, null, textLinkItems), links && (/*#__PURE__*/React__default.createElement(ButtonsContainer$2, {
+  }), !!(textLinks != null && textLinks.length) && /*#__PURE__*/React__default.createElement(TextLinksContainer, null, textLinkItems), links && (/*#__PURE__*/React__default.createElement(ButtonsContainer$2, {
     hasTextLinks: !!(textLinks != null && textLinks.length),
     "data-testid": "buttons-wrapper",
     primaryButtonTextLength: firstButtonText.length,
@@ -10340,9 +10315,9 @@ var PromoWithTags = function PromoWithTags(_ref) {
   }, restFirstButton), primaryButtonTextTruncate)))), secondButton && (/*#__PURE__*/React__default.createElement(SecondButtonComponent, Object.assign({}, restSecondButton), secondButtonTextTruncate))))), /*#__PURE__*/React__default.createElement(PromoWithTagsExtraContentWrapper, {
     "data-testid": "extra-content-wrapper",
     imageToLeft: imageToLeft
-  }, showExtraContent && (/*#__PURE__*/React__default.createElement(MobileTitleWrapper, null, /*#__PURE__*/React__default.createElement(HarmonicHeaderWithWrapper, {
-    size: titleSize,
-    hierarchy: titleHierarchy
+  }, showExtraContent && (/*#__PURE__*/React__default.createElement(MobileTitleWrapper, null, /*#__PURE__*/React__default.createElement(PromoWithTagsHeader, {
+    semanticLevel: 2,
+    level: titleLevel
   }, title))), /*#__PURE__*/React__default.createElement(ImageAspectRatioWrapper, {
     aspectRatio: exports.AspectRatio['4:3']
   }, isExtraContentPresent && showExtraContent ? (/*#__PURE__*/React__default.createElement(ExtraContentWrapper, null, children, /*#__PURE__*/React__default.createElement(IconWrapper$2, {
@@ -10366,10 +10341,10 @@ var PromoWithTags = function PromoWithTags(_ref) {
   }))));
 };
 
-var _templateObject$19, _templateObject2$V, _templateObject3$J, _templateObject4$C, _templateObject5$v, _templateObject6$o, _templateObject7$k;
+var _templateObject$18, _templateObject2$V, _templateObject3$I, _templateObject4$A, _templateObject5$u, _templateObject6$o, _templateObject7$i;
 var LENGTH_TEXT$2 = 28;
 var LENGTH_TEXT_TABLET$2 = 10;
-var PromoWithTitleGrid = /*#__PURE__*/styled__default(Grid)(_templateObject$19 || (_templateObject$19 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  grid-template-areas: ", ";\n\n  @media ", " {\n    & {\n      grid-template-areas: ", ";\n    }\n  }\n\n  @media ", " {\n    & {\n      grid-template-columns: var(--grid-margin) minmax(0, 1fr) var(--grid-margin);\n      grid-template-rows: min-content 24px min-content;\n      gap: 0;\n      grid-template-areas:\n        'row1 row1 row1'\n        '. . .'\n        '. row2 .';\n    }\n  }\n"])), function (_ref) {
+var PromoWithTitleGrid = /*#__PURE__*/styled__default(Grid)(_templateObject$18 || (_templateObject$18 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  grid-template-areas: ", ";\n\n  @media ", " {\n    & {\n      grid-template-areas: ", ";\n    }\n  }\n\n  @media ", " {\n    & {\n      grid-template-columns: var(--grid-margin) minmax(0, 1fr) var(--grid-margin);\n      grid-template-rows: min-content 24px min-content;\n      gap: 0;\n      grid-template-areas:\n        'row1 row1 row1'\n        '. . .'\n        '. row2 .';\n    }\n  }\n"])), function (_ref) {
   var imageToLeft = _ref.imageToLeft;
   return imageToLeft ? "'left left left left left left left left . right right right right right . .'" : "'. . left left left left left . right right right right right right right right'";
 }, devices.tablet, function (_ref2) {
@@ -10380,14 +10355,14 @@ var PromoWithTitleImageWrapper = /*#__PURE__*/styled__default.div(_templateObjec
   var imageToLeft = _ref3.imageToLeft;
   return imageToLeft ? 'left' : 'right';
 }, devices.mobile);
-var PromoWithTitleContentWrapper = /*#__PURE__*/styled__default.div(_templateObject3$J || (_templateObject3$J = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  grid-area: ", ";\n  align-self: center;\n\n  @media ", " {\n    & {\n      grid-area: row2;\n      align-self: start;\n    }\n  }\n"])), function (_ref4) {
+var PromoWithTitleContentWrapper = /*#__PURE__*/styled__default.div(_templateObject3$I || (_templateObject3$I = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  grid-area: ", ";\n  align-self: center;\n\n  @media ", " {\n    & {\n      grid-area: row2;\n      align-self: start;\n    }\n  }\n"])), function (_ref4) {
   var imageToLeft = _ref4.imageToLeft;
   return imageToLeft ? 'right' : 'left';
 }, devices.mobile);
-var HarmonicHeaderWithWrapper$1 = /*#__PURE__*/styled__default(HarmonicHeader)(_templateObject4$C || (_templateObject4$C = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  padding-bottom: 32px;\n\n  @media ", " {\n    padding-bottom: 24px;\n  }\n"])), devices.mobile);
-var HarmonicSubtitleWithWrapper$1 = /*#__PURE__*/styled__default(HarmonicSubtitle)(_templateObject5$v || (_templateObject5$v = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  overflow-wrap: break-word;\n  margin-bottom: 16px;\n"])));
-var BodyCopyHarmonicWithWrapper$2 = /*#__PURE__*/styled__default(BodyCopyHarmonic)(_templateObject6$o || (_templateObject6$o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  padding: 0;\n  margin: 0;\n  margin-bottom: 32px;\n  whiete-space: break-spaces;\n  overflow-wrap: break-word;\n\n  a {\n    text-decoration: underline;\n    cursor: pointer;\n\n    &[href^='tel:'] {\n      text-decoration: none;\n    }\n\n    &:link {\n      color: var(--color-primary-black);\n    }\n\n    &:visited {\n      color: var(--color-base-dark-grey);\n    }\n\n    &:hover {\n      color: var(--color-primary-red);\n    }\n  }\n  @media ", " {\n    margin-bottom: 24px;\n  }\n"])), devices.mobile);
-var ButtonsContainer$3 = /*#__PURE__*/styled__default.div(_templateObject7$k || (_templateObject7$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  gap: 16px;\n  margin-top: 32px;\n\n  ", "\n\n  @media ", " {\n    gap: 24px;\n    margin-top: 24px;\n    flex-direction: column;\n    align-items: center;\n  }\n\n  @media ", " {\n    gap: 24px;\n    margin-top: 24px;\n    align-items: flex-start;\n\n    ", "\n  }\n"])), function (_ref5) {
+var HarmonicHeaderWithWrapper = /*#__PURE__*/styled__default(HarmonicHeader)(_templateObject4$A || (_templateObject4$A = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  padding-bottom: 32px;\n\n  @media ", " {\n    padding-bottom: 24px;\n  }\n"])), devices.mobile);
+var HarmonicSubtitleWithWrapper = /*#__PURE__*/styled__default(HarmonicSubtitle)(_templateObject5$u || (_templateObject5$u = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  overflow-wrap: break-word;\n  margin-bottom: 16px;\n"])));
+var BodyCopyHarmonicWithWrapper$1 = /*#__PURE__*/styled__default(BodyCopyHarmonic)(_templateObject6$o || (_templateObject6$o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  padding: 0;\n  margin: 0;\n  margin-bottom: 32px;\n  whiete-space: break-spaces;\n  overflow-wrap: break-word;\n\n  a {\n    text-decoration: underline;\n    cursor: pointer;\n\n    &[href^='tel:'] {\n      text-decoration: none;\n    }\n\n    &:link {\n      color: var(--color-primary-black);\n    }\n\n    &:visited {\n      color: var(--color-base-dark-grey);\n    }\n\n    &:hover {\n      color: var(--color-primary-red);\n    }\n  }\n  @media ", " {\n    margin-bottom: 24px;\n  }\n"])), devices.mobile);
+var ButtonsContainer$3 = /*#__PURE__*/styled__default.div(_templateObject7$i || (_templateObject7$i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  gap: 16px;\n  margin-top: 32px;\n\n  ", "\n\n  @media ", " {\n    gap: 24px;\n    margin-top: 24px;\n    flex-direction: column;\n    align-items: center;\n  }\n\n  @media ", " {\n    gap: 24px;\n    margin-top: 24px;\n    align-items: flex-start;\n\n    ", "\n  }\n"])), function (_ref5) {
   var _ref5$primaryButtonTe = _ref5.primaryButtonTextLength,
     primaryButtonTextLength = _ref5$primaryButtonTe === void 0 ? 0 : _ref5$primaryButtonTe,
     _ref5$tertiaryButtonT = _ref5.tertiaryButtonTextLength,
@@ -10409,8 +10384,8 @@ var ButtonsContainer$3 = /*#__PURE__*/styled__default.div(_templateObject7$k ||
   return '';
 });
 
-var _templateObject$1a;
-var VideoContainer = /*#__PURE__*/styled__default.div(_templateObject$1a || (_templateObject$1a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: relative;\n  aspect-ratio: ", ";\n\n  @supports not (aspect-ratio: ", ") {\n    width: 100%;\n    padding-top: ", "%;\n  }\n\n  video {\n    display: block;\n    width: 100%;\n    height: 100%;\n    object-fit: cover;\n\n    @supports not (aspect-ratio: ", ") {\n      position: absolute;\n      top: 0;\n      left: 0;\n    }\n  }\n"])), function (_ref) {
+var _templateObject$19;
+var VideoContainer = /*#__PURE__*/styled__default.div(_templateObject$19 || (_templateObject$19 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: relative;\n  aspect-ratio: ", ";\n\n  @supports not (aspect-ratio: ", ") {\n    width: 100%;\n    padding-top: ", "%;\n  }\n\n  video {\n    display: block;\n    width: 100%;\n    height: 100%;\n    object-fit: cover;\n\n    @supports not (aspect-ratio: ", ") {\n      position: absolute;\n      top: 0;\n      left: 0;\n    }\n  }\n"])), function (_ref) {
   var _ref$aspectRatio = _ref.aspectRatio,
     aspectRatio = _ref$aspectRatio === void 0 ? exports.AspectRatio['1:1'] : _ref$aspectRatio;
   return aspectRatio;
@@ -10575,12 +10550,12 @@ var PromoWithTitle = function PromoWithTitle(_ref) {
   }, children), /*#__PURE__*/React__default.createElement(PromoWithTitleContentWrapper, {
     "data-testid": "content-wrapper",
     imageToLeft: imageToLeft
-  }, /*#__PURE__*/React__default.createElement(HarmonicHeaderWithWrapper$1, {
+  }, /*#__PURE__*/React__default.createElement(HarmonicHeaderWithWrapper, {
     size: titleSize,
     hierarchy: titleHierarchy
-  }, title), subtitle ? /*#__PURE__*/React__default.createElement(HarmonicSubtitleWithWrapper$1, {
+  }, title), subtitle ? /*#__PURE__*/React__default.createElement(HarmonicSubtitleWithWrapper, {
     size: "medium"
-  }, subtitle) : null, /*#__PURE__*/React__default.createElement(BodyCopyHarmonicWithWrapper$2, {
+  }, subtitle) : null, /*#__PURE__*/React__default.createElement(BodyCopyHarmonicWithWrapper$1, {
     size: "large",
     dangerouslySetInnerHTML: {
       __html: text
@@ -10592,8 +10567,8 @@ var PromoWithTitle = function PromoWithTitle(_ref) {
   }, primaryButton ? /*#__PURE__*/React__default.createElement(PrimaryButton, Object.assign({}, restPrimaryButton), primaryButtonTextTruncate) : null, tertiaryButton ? (/*#__PURE__*/React__default.createElement(TertiaryButton, Object.assign({}, restTertiaryButton), tertiaryButtonTextTruncate)) : null)) : null));
 };
 
-var _templateObject$1b;
-var RadioGroupContainer = /*#__PURE__*/styled__default.div(_templateObject$1b || (_templateObject$1b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  gap: 30px;\n"])));
+var _templateObject$1a;
+var RadioGroupContainer = /*#__PURE__*/styled__default.div(_templateObject$1a || (_templateObject$1a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  gap: 30px;\n"])));
 
 /**
  * DEPRECATED. Use RadioGroup2 instead
@@ -10648,8 +10623,8 @@ var RadioGroup = function RadioGroup(_ref) {
   })));
 };
 
-var _templateObject$1c, _templateObject2$W, _templateObject3$K;
-var Container$3 = /*#__PURE__*/styled__default.div(_templateObject$1c || (_templateObject$1c = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
+var _templateObject$1b, _templateObject2$W, _templateObject3$J;
+var Container$3 = /*#__PURE__*/styled__default.div(_templateObject$1b || (_templateObject$1b = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
 var RadioGroup$1 = /*#__PURE__*/styled__default.div(_templateObject2$W || (_templateObject2$W = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: flex-start;\n  justify-content: flex-start;\n  flex-direction: ", ";\n  gap: ", ";\n"])), function (_ref) {
   var horizontalMode = _ref.horizontalMode;
   if (horizontalMode) return 'row';
@@ -10658,7 +10633,7 @@ var RadioGroup$1 = /*#__PURE__*/styled__default.div(_templateObject2$W || (_temp
   var gap = _ref2.gap;
   return gap + "px";
 });
-var ErrorLabel$4 = /*#__PURE__*/styled__default.div(_templateObject3$K || (_templateObject3$K = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin-top: 20px;\n  color: ", ";\n"])), function (_ref3) {
+var ErrorLabel$4 = /*#__PURE__*/styled__default.div(_templateObject3$J || (_templateObject3$J = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin-top: 20px;\n  color: ", ";\n"])), function (_ref3) {
   var darkMode = _ref3.darkMode;
   if (darkMode) return 'var(--base-color-white)';
   return 'var(--base-color-errorstate)';
@@ -10735,10 +10710,10 @@ var RadioGroup2 = function RadioGroup2(_ref) {
   }, error))));
 };
 
-var _templateObject$1d, _templateObject2$X, _templateObject3$L;
-var StatusBannerWrapper = /*#__PURE__*/styled__default.div(_templateObject$1d || (_templateObject$1d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  padding: 26px 150px;\n  display: flex;\n  justify-content: space-between;\n  background-color: var(--base-color-light-grey);\n  transition: transform 0.3s ease;\n  transform-origin: top;\n\n  @media ", " {\n    padding: 20px 20px;\n  }\n\n  @media ", " {\n    padding: 20px 50px;\n  }\n\n  &.closing {\n    transform: scaleY(0);\n  }\n"])), devices.mobile, devices.tablet);
+var _templateObject$1c, _templateObject2$X, _templateObject3$K;
+var StatusBannerWrapper = /*#__PURE__*/styled__default.div(_templateObject$1c || (_templateObject$1c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  padding: 26px 150px;\n  display: flex;\n  justify-content: space-between;\n  background-color: var(--base-color-light-grey);\n  transition: transform 0.3s ease;\n  transform-origin: top;\n\n  @media ", " {\n    padding: 20px 20px;\n  }\n\n  @media ", " {\n    padding: 20px 50px;\n  }\n\n  &.closing {\n    transform: scaleY(0);\n  }\n"])), devices.mobile, devices.tablet);
 var ContentContainer$3 = /*#__PURE__*/styled__default.div(_templateObject2$X || (_templateObject2$X = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  overflow: auto;\n  transition: max-height 0.3s ease-in-out;\n  font-size: var(--font-size-body-1);\n  font-family: var(--font-family-body);\n  font-feature-settings: var(--font-feature-settings-body);\n  font-weight: var(--font-weight-body-1);\n  letter-spacing: var(--letter-spacing-body-1);\n  line-height: var(--line-height-body-1);\n"])));
-var SvgContainer$3 = /*#__PURE__*/styled__default.div(_templateObject3$L || (_templateObject3$L = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  height: 100%;\n  display: flex;\n  align-items: end;\n\n  svg {\n    width: var(--navigation-large-gap);\n    height: var(--navigation-large-gap);\n    padding-left: 50px;\n  }\n\n  cursor: pointer;\n\n  @media ", " {\n    padding-left: 20px;\n  }\n"])), devices.mobile);
+var SvgContainer$3 = /*#__PURE__*/styled__default.div(_templateObject3$K || (_templateObject3$K = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  height: 100%;\n  display: flex;\n  align-items: end;\n\n  svg {\n    width: var(--navigation-large-gap);\n    height: var(--navigation-large-gap);\n    padding-left: 50px;\n  }\n\n  cursor: pointer;\n\n  @media ", " {\n    padding-left: 20px;\n  }\n"])), devices.mobile);
 
 /* eslint-disable react/no-danger */
 var StatusBanner = function StatusBanner(_ref) {
@@ -10794,51 +10769,37 @@ var StatusBanner = function StatusBanner(_ref) {
   return null;
 };
 
-var _templateObject$1e;
-var SectionTitleWrapper = /*#__PURE__*/styled__default.div(_templateObject$1e || (_templateObject$1e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin: 30px 0;\n\n  & > div {\n    row-gap: 0;\n  }\n\n  & h1,\n  & h2 {\n    margin: 16px 0;\n    white-space: pre-wrap;\n  }\n\n  @media ", " {\n    & h1,\n    & h2 {\n      margin: 12px 0;\n    }\n  }\n\n  & div {\n    margin-block-start: 0;\n  }\n"])), devices.mobile);
-
-/* ~~~~~~~ new harmonic types ~~~~~~~ */
-var HarmonicSize = {
-  Small: 'small',
-  Medium: 'medium',
-  Large: 'large'
-};
-var HeaderHierarchy = {
-  H1: 'h1',
-  H2: 'h2',
-  H3: 'h3'
-};
+var _templateObject$1d;
+var SectionTitleWrapper = /*#__PURE__*/styled__default.div(_templateObject$1d || (_templateObject$1d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin: 30px 0;\n\n  & > div {\n    row-gap: 0;\n  }\n\n  & h1,\n  & h2 {\n    margin: 16px 0;\n    white-space: pre-wrap;\n  }\n\n  @media ", " {\n    & h1,\n    & h2 {\n      margin: 12px 0;\n    }\n  }\n\n  & div {\n    font-size: var(--font-size-title-description);\n    line-height: var(--line-height-title-description);\n    margin-block-start: 0;\n  }\n"])), devices.mobile);
 
 var SectionTitle = function SectionTitle(_ref) {
   var title = _ref.title,
     _ref$size = _ref.size,
     size = _ref$size === void 0 ? 'small' : _ref$size,
     description = _ref.description,
-    className = _ref.className;
-  var headingLevel = size === 'large' ? HeaderHierarchy.H1 : HeaderHierarchy.H2;
-  var headingSize = size === 'large' ? HarmonicSize.Large : HarmonicSize.Medium;
-  return /*#__PURE__*/React__default.createElement(SectionTitleWrapper, {
-    className: className
-  }, /*#__PURE__*/React__default.createElement(Grid, null, /*#__PURE__*/React__default.createElement(GridItem, {
+    semanticLevel = _ref.semanticLevel;
+  var headingLevel = size === 'large' ? 1 : 2;
+  return /*#__PURE__*/React__default.createElement(SectionTitleWrapper, null, /*#__PURE__*/React__default.createElement(Grid, null, /*#__PURE__*/React__default.createElement(GridItem, {
     columnStartDesktop: 3,
     columnSpanDesktop: 12,
     columnStartDevice: 2,
     columnSpanDevice: 12
-  }, /*#__PURE__*/React__default.createElement(HarmonicHeader, {
-    hierarchy: headingLevel,
-    size: headingSize
+  }, /*#__PURE__*/React__default.createElement(Header, {
+    level: headingLevel,
+    semanticLevel: semanticLevel != null ? semanticLevel : headingLevel
   }, title)), description && (/*#__PURE__*/React__default.createElement(GridItem, {
     columnStartDesktop: 3,
     columnSpanDesktop: 8,
     columnStartDevice: 2,
     columnSpanDevice: 12
-  }, /*#__PURE__*/React__default.createElement(BodyCopyHarmonic, {
-    size: "large"
+  }, /*#__PURE__*/React__default.createElement(BodyText, {
+    level: 1,
+    tag: "div"
   }, description)))));
 };
 
-var _templateObject$1f, _templateObject2$Y, _templateObject3$M, _templateObject4$D, _templateObject5$w, _templateObject6$p, _templateObject7$l, _templateObject8$f, _templateObject9$a, _templateObject0$9, _templateObject1$5;
-var stateStyles = /*#__PURE__*/styled.css(_templateObject$1f || (_templateObject$1f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  &:focus,\n  &.focus {\n    outline: ", ";\n  }\n\n  &.disabled {\n    background-color: ", ";\n    color: ", ";\n    pointer-events: none;\n    cursor: none;\n  }\n"])), function (_ref) {
+var _templateObject$1e, _templateObject2$Y, _templateObject3$L, _templateObject4$B, _templateObject5$v, _templateObject6$p, _templateObject7$j, _templateObject8$e, _templateObject9$8, _templateObject0$8, _templateObject1$5;
+var stateStyles = /*#__PURE__*/styled.css(_templateObject$1e || (_templateObject$1e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  &:focus,\n  &.focus {\n    outline: ", ";\n  }\n\n  &.disabled {\n    background-color: ", ";\n    color: ", ";\n    pointer-events: none;\n    cursor: none;\n  }\n"])), function (_ref) {
   var theme = _ref.theme;
   return "3px solid " + theme.colors.lapisLazuli;
 }, function (_ref2) {
@@ -10852,8 +10813,8 @@ var borderStyles = /*#__PURE__*/styled.css(_templateObject2$Y || (_templateObjec
   var theme = _ref4.theme;
   return theme.colors.darkgrey;
 });
-var noMarginAndPaddingStyles = /*#__PURE__*/styled.css(_templateObject3$M || (_templateObject3$M = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin: 0;\n  padding: 0;\n"])));
-var listItemStyles = /*#__PURE__*/styled.css(_templateObject4$D || (_templateObject4$D = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  list-style: none;\n  user-select: none;\n"])));
+var noMarginAndPaddingStyles = /*#__PURE__*/styled.css(_templateObject3$L || (_templateObject3$L = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin: 0;\n  padding: 0;\n"])));
+var listItemStyles = /*#__PURE__*/styled.css(_templateObject4$B || (_templateObject4$B = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  list-style: none;\n  user-select: none;\n"])));
 var ArrowIcon = /*#__PURE__*/styled__default(Icon).attrs(function (_ref5) {
   var theme = _ref5.theme;
   return {
@@ -10861,11 +10822,11 @@ var ArrowIcon = /*#__PURE__*/styled__default(Icon).attrs(function (_ref5) {
     color: theme.colors.black,
     title: 'Select Arrow'
   };
-})(_templateObject5$w || (_templateObject5$w = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  pointer-events: none;\n\n  max-width: 24px;\n  max-height: 24px;\n\n  svg {\n    width: 24px;\n    height: 24px;\n  }\n"])));
-var Wrapper$7 = /*#__PURE__*/styled__default.div(_templateObject6$p || (_templateObject6$p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  ", "\n  height: initial;\n\n  display: flex;\n  flex-direction: column;\n  gap: 20px;\n"])), noMarginAndPaddingStyles);
-var SelectWrapper = /*#__PURE__*/styled__default.div(_templateObject7$l || (_templateObject7$l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  ", "\n  height: inherit;\n"])), noMarginAndPaddingStyles);
-var Options = /*#__PURE__*/styled__default.div(_templateObject8$f || (_templateObject8$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  z-index: 1;\n\n  ", "\n  ", "\n"])), noMarginAndPaddingStyles, borderStyles);
-var Option = /*#__PURE__*/styled__default.li(_templateObject9$a || (_templateObject9$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  ", "\n  ", "\n\n  ", "\n"])), noMarginAndPaddingStyles, listItemStyles, function (_ref6) {
+})(_templateObject5$v || (_templateObject5$v = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  pointer-events: none;\n\n  max-width: 24px;\n  max-height: 24px;\n\n  svg {\n    width: 24px;\n    height: 24px;\n  }\n"])));
+var Wrapper$6 = /*#__PURE__*/styled__default.div(_templateObject6$p || (_templateObject6$p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  ", "\n  height: initial;\n\n  display: flex;\n  flex-direction: column;\n  gap: 20px;\n"])), noMarginAndPaddingStyles);
+var SelectWrapper = /*#__PURE__*/styled__default.div(_templateObject7$j || (_templateObject7$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  ", "\n  height: inherit;\n"])), noMarginAndPaddingStyles);
+var Options = /*#__PURE__*/styled__default.div(_templateObject8$e || (_templateObject8$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  z-index: 1;\n\n  ", "\n  ", "\n"])), noMarginAndPaddingStyles, borderStyles);
+var Option = /*#__PURE__*/styled__default.li(_templateObject9$8 || (_templateObject9$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  ", "\n  ", "\n\n  ", "\n"])), noMarginAndPaddingStyles, listItemStyles, function (_ref6) {
   var theme = _ref6.theme,
     hover = _ref6.hover;
   var _theme$colors = theme.colors,
@@ -10875,7 +10836,7 @@ var Option = /*#__PURE__*/styled__default.li(_templateObject9$a || (_templateObj
   return "\n        background-color: " + lightgrey + ";\n        &:hover { background-color: " + midgrey + " }\n    ";
 });
 var selectStyles = function selectStyles(width, height) {
-  return styled.css(_templateObject0$9 || (_templateObject0$9 = _taggedTemplateLiteralLoose(["\n  position: relative;\n  z-index: ", ";\n\n  width: ", ";\n  height: ", ";\n\n  * {\n    width: ", ";\n  }\n\n  ", " {\n    position: absolute;\n    top: ", ";\n  }\n  ", " {\n    height: ", ";\n  }\n  p {\n    height: ", ";\n    padding-inline: 20px;\n\n    display: flex;\n    align-items: center;\n  }\n"])), zIndexes[3], width, height, width, Options, height, Option, height, height);
+  return styled.css(_templateObject0$8 || (_templateObject0$8 = _taggedTemplateLiteralLoose(["\n  position: relative;\n  z-index: ", ";\n\n  width: ", ";\n  height: ", ";\n\n  * {\n    width: ", ";\n  }\n\n  ", " {\n    position: absolute;\n    top: ", ";\n  }\n  ", " {\n    height: ", ";\n  }\n  p {\n    height: ", ";\n    padding-inline: 20px;\n\n    display: flex;\n    align-items: center;\n  }\n"])), zIndexes[3], width, height, width, Options, height, Option, height, height);
 };
 var SelectList = /*#__PURE__*/styled__default.ul(_templateObject1$5 || (_templateObject1$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  ", "\n\n  ", "\n  ", "\n  ", "\n  ", "\n\n  & ", " {\n    position: absolute;\n\n    top: 13px;\n    right: 16px;\n  }\n"])), function (_ref7) {
   var width = _ref7.width,
@@ -11171,7 +11132,7 @@ function Select(_ref3) {
     }
     setSelectedValue(options[0]);
   }, [options, resetWhenOptionsUpdate]);
-  return /*#__PURE__*/React__default.createElement(Wrapper$7, null, label !== '' && (/*#__PURE__*/React__default.createElement(BodyText, {
+  return /*#__PURE__*/React__default.createElement(Wrapper$6, null, label !== '' && (/*#__PURE__*/React__default.createElement(BodyText, {
     level: 1,
     tag: "p",
     "data-testid": "select-label"
@@ -11218,8 +11179,8 @@ function Select(_ref3) {
   })))), /*#__PURE__*/React__default.createElement(ArrowIcon, null)));
 }
 
-var _templateObject$1g, _templateObject2$Z, _templateObject3$N, _templateObject4$E;
-var Container$4 = /*#__PURE__*/styled__default.div(_templateObject$1g || (_templateObject$1g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n"])));
+var _templateObject$1f, _templateObject2$Z, _templateObject3$M, _templateObject4$C;
+var Container$4 = /*#__PURE__*/styled__default.div(_templateObject$1f || (_templateObject$1f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n"])));
 var SelectWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject2$Z || (_templateObject2$Z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: relative;\n  width: auto;\n  max-width: ", ";\n\n  .harmonic-select__control {\n    min-height: 48px;\n    border-radius: 0;\n    transition: none;\n    border: ", ";\n    &:hover {\n      border-color: ", ";\n    }\n  }\n  .harmonic-select__control--is-focused {\n    border-color: var(--base-color-dark-grey);\n    box-shadow: ", ";\n  }\n  .harmonic-select__control--menu-is-open {\n    .harmonic-select__indicator {\n      svg {\n        transform: rotate(180deg);\n      }\n    }\n  }\n  .harmonic-select__indicator {\n    font-size: 25px;\n    padding: 0;\n    margin-right: 12px;\n    color: var(--base-color-black);\n    svg {\n      height: 1em;\n      width: 1em;\n      color: inherit;\n      path {\n        fill: currentColor;\n        color: inherit;\n      }\n    }\n  }\n  .harmonic-select__single-value,\n  .harmonic-select__placeholder {\n    margin-left: 0;\n    margin-right: 0;\n    font-family: var(--font-family-altHeader);\n    font-feature-settings: var(--font-feature-settings-altHeader);\n    font-size: var(--font-size-altHeader-6);\n    font-weight: var(--font-weight-altHeader-6);\n    letter-spacing: var(--letter-spacing-altHeader-6);\n    line-height: var(--line-height-altHeader-6);\n    text-transform: var(--text-transform-altHeader);\n  }\n  .harmonic-select__placeholder {\n    color: var(--base-color-dark-grey);\n  }\n  .harmonic-select__single-value {\n    color: var(--base-color-black);\n  }\n  .harmonic-select__value-container {\n    padding-left: 20px;\n    padding-right: 20px;\n    padding-top: 1px;\n    padding-bottom: 0px;\n  }\n  .harmonic-select--is-disabled {\n    .harmonic-select__control {\n      border: 1px solid var(--base-color-light-grey);\n      background: var(--base-color-light-grey);\n    }\n    .harmonic-select__indicator,\n    .harmonic-select__single-value {\n      color: var(--base-color-dark-grey);\n    }\n  }\n  .harmonic-select__menu {\n    margin-top: -1px;\n    box-shadow: none;\n    border-radius: 0;\n    border: 1px solid var(--base-color-dark-grey);\n    background: var(--base-color-light-grey);\n  }\n  .harmonic-select__menu-list {\n    padding-top: 0;\n    padding-bottom: 0;\n  }\n  .harmonic-select__option {\n    padding: 10px 20px;\n    font-family: var(--font-family-altHeader);\n    font-feature-settings: var(--font-feature-settings-altHeader);\n    font-size: var(--font-size-altHeader-6);\n    font-weight: var(--font-weight-altHeader-6);\n    letter-spacing: var(--letter-spacing-altHeader-6);\n    line-height: var(--line-height-altHeader-6);\n    text-transform: var(--text-transform-altHeader);\n    color: var(--base-color-black);\n    &:active,\n    &.harmonic-select__option--is-focused {\n      background: var(--base-color-mid-grey);\n    }\n  }\n  .harmonic-select__option--is-selected {\n    color: var(--base-color-black);\n    background: none;\n  }\n  .harmonic-select__input-container {\n    margin: 0;\n    padding-top: 0;\n    padding-bottom: 0;\n    font-family: var(--font-family-altHeader);\n    font-feature-settings: var(--font-feature-settings-altHeader);\n    font-size: var(--font-size-altHeader-6);\n    font-weight: var(--font-weight-altHeader-6);\n    letter-spacing: var(--letter-spacing-altHeader-6);\n    line-height: var(--line-height-altHeader-6);\n    text-transform: var(--text-transform-altHeader);\n    color: var(--base-color-black);\n  }\n  .harmonic-select__menu-notice {\n    padding: 20px 20px;\n    font-family: var(--font-family-body);\n    font-feature-settings: var(--font-feature-settings-body);\n    font-size: var(--font-size-body-1);\n    font-weight: var(--font-weight-body-1);\n    letter-spacing: var(--letter-spacing-body-1);\n    line-height: var(--line-height-body-1);\n    text-transform: var(--text-transform-body);\n    color: var(--base-color-black);\n    text-align: left;\n  }\n  .harmonic-select__menu-notice--loading {\n    font-style: italic;\n  }\n"])), function (_ref) {
   var width = _ref.width;
   if (!width) return 'none';
@@ -11237,12 +11198,12 @@ var SelectWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject2$Z || (_t
   if (darkMode) return "0 0 0 4px var(--base-color-lemonchiffon)";
   return "0 0 0 3px var(--base-color-lapislazuli)";
 });
-var TextLabel$4 = /*#__PURE__*/styled__default.div(_templateObject3$N || (_templateObject3$N = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin: 0 0 20px;\n  color: ", ";\n"])), function (_ref5) {
+var TextLabel$4 = /*#__PURE__*/styled__default.div(_templateObject3$M || (_templateObject3$M = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin: 0 0 20px;\n  color: ", ";\n"])), function (_ref5) {
   var darkMode = _ref5.darkMode;
   if (darkMode) return "var(--base-color-white)";
   return "var(--base-color-black)";
 });
-var ErrorLabel$5 = /*#__PURE__*/styled__default.div(_templateObject4$E || (_templateObject4$E = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin: 20px 0 0;\n  color: ", ";\n"])), function (_ref6) {
+var ErrorLabel$5 = /*#__PURE__*/styled__default.div(_templateObject4$C || (_templateObject4$C = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin: 20px 0 0;\n  color: ", ";\n"])), function (_ref6) {
   var darkMode = _ref6.darkMode;
   if (darkMode) return "var(--base-color-white)";
   return "var(--base-color-errorstate)";
@@ -11356,8 +11317,8 @@ var SelectComponent$1 = function SelectComponent(_ref) {
   })));
 };
 
-var _templateObject$1h, _templateObject2$_;
-var Wrapper$8 = /*#__PURE__*/styled__default.figure(_templateObject$1h || (_templateObject$1h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  width: fit-content;\n\n  ", " {\n    height: calc(100% - 34px);\n    @supports not (aspect-ratio: ", ") {\n      width: ", ";\n    }\n\n    @media ", " {\n      height: calc(100% - 30px);\n      @supports not (aspect-ratio: ", ") {\n        width: ", ";\n      }\n    }\n  }\n"])), StyledImageAspectRatioWrapper, function (_ref) {
+var _templateObject$1g, _templateObject2$_;
+var Wrapper$7 = /*#__PURE__*/styled__default.figure(_templateObject$1g || (_templateObject$1g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  height: 100%;\n  width: fit-content;\n\n  ", " {\n    height: calc(100% - 12px - var(--line-height-body-2));\n    @supports not (aspect-ratio: ", ") {\n      width: ", ";\n    }\n  }\n"])), StyledImageAspectRatioWrapper, function (_ref) {
   var _ref$aspectRatio = _ref.aspectRatio,
     aspectRatio = _ref$aspectRatio === void 0 ? exports.AspectRatio['1:1'] : _ref$aspectRatio;
   return aspectRatio;
@@ -11365,18 +11326,9 @@ var Wrapper$8 = /*#__PURE__*/styled__default.figure(_templateObject$1h || (_temp
   var _ref2$aspectRatio = _ref2.aspectRatio,
     aspectRatio = _ref2$aspectRatio === void 0 ? exports.AspectRatio['1:1'] : _ref2$aspectRatio,
     height = _ref2.height;
-  return "calc(calc(" + height + "px - 34px) * " + AspectRatioWidth[aspectRatio] + ")";
-}, devices.mobile, function (_ref3) {
-  var _ref3$aspectRatio = _ref3.aspectRatio,
-    aspectRatio = _ref3$aspectRatio === void 0 ? exports.AspectRatio['1:1'] : _ref3$aspectRatio;
-  return aspectRatio;
-}, function (_ref4) {
-  var _ref4$aspectRatio = _ref4.aspectRatio,
-    aspectRatio = _ref4$aspectRatio === void 0 ? exports.AspectRatio['1:1'] : _ref4$aspectRatio,
-    height = _ref4.height;
-  return "calc(calc(" + height + "px - 30px) * " + AspectRatioWidth[aspectRatio] + ")";
+  return "calc(calc(" + height + "px - 12px - var(--line-height-body-2)) * " + AspectRatioWidth[aspectRatio] + ")";
 });
-var CaptionWrapper = /*#__PURE__*/styled__default(Caption)(_templateObject2$_ || (_templateObject2$_ = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin-top: 12px;\n  height: 22px;\n  font-feature-settings: var(--font-feature-settings-body);\n  text-transform: var(--text-transform-body);\n  word-break: var(--word-break-body);\n  font-style: italic;\n\n  @media ", " {\n    height: 18px;\n  }\n"])), devices.mobile);
+var CaptionWrapper = /*#__PURE__*/styled__default.figcaption(_templateObject2$_ || (_templateObject2$_ = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin-top: 12px;\n  height: var(--line-height-body-2);\n  font-family: var(--font-family-body);\n  font-feature-settings: var(--font-feature-settings-body);\n  font-size: var(--font-size-body-2);\n  font-weight: var(--font-weight-body-2);\n  letter-spacing: var(--letter-spacing-body-2);\n  line-height: var(--line-height-body-2);\n  text-transform: var(--text-transform-body-2);\n  word-break: var(--word-break-body-2);\n  font-style: italic;\n"])));
 
 var ImageWithCaption = function ImageWithCaption(_ref) {
   var caption = _ref.caption,
@@ -11397,7 +11349,7 @@ var ImageWithCaption = function ImageWithCaption(_ref) {
       return window.removeEventListener('resize', setWrapperHeight);
     };
   }, []);
-  return /*#__PURE__*/React__default.createElement(Wrapper$8, {
+  return /*#__PURE__*/React__default.createElement(Wrapper$7, {
     aspectRatio: aspectRatio,
     ref: wrapperRef,
     height: height
@@ -11407,18 +11359,16 @@ var ImageWithCaption = function ImageWithCaption(_ref) {
     return /*#__PURE__*/React__default.isValidElement(child) ? /*#__PURE__*/React__default.cloneElement(child, {
       alt: child.props.alt || 'Visual representation'
     }) : child;
-  })), caption && /*#__PURE__*/React__default.createElement(CaptionWrapper, {
-    tag: "figcaption"
-  }, caption));
+  })), caption && /*#__PURE__*/React__default.createElement(CaptionWrapper, null, caption));
 };
 
-var _templateObject$1i, _templateObject2$$, _templateObject3$O;
-var TextWrapper$3 = /*#__PURE__*/styled__default.div(_templateObject$1i || (_templateObject$1i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  h4 {\n    margin: 0;\n  }\n"])));
+var _templateObject$1h, _templateObject2$$, _templateObject3$N;
+var TextWrapper$3 = /*#__PURE__*/styled__default.div(_templateObject$1h || (_templateObject$1h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  h4 {\n    margin: 0;\n  }\n"])));
 var AttributionWrapper = /*#__PURE__*/styled__default.div(_templateObject2$$ || (_templateObject2$$ = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  ", "\n"])), function (_ref) {
   var displayAttribution = _ref.displayAttribution;
   return "display: " + (displayAttribution ? 'block' : 'none') + ";";
 });
-var Line$1 = /*#__PURE__*/styled__default.div(_templateObject3$O || (_templateObject3$O = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  background-color: var(--base-color-black);\n  height: 2px;\n  width: 62px;\n  margin: 32px 0;\n\n  @media ", " {\n    height: 1px;\n    width: 46px;\n    margin: 24px 0;\n  }\n"])), devices.mobile);
+var Line$1 = /*#__PURE__*/styled__default.div(_templateObject3$N || (_templateObject3$N = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  background-color: var(--base-color-black);\n  height: 2px;\n  width: 62px;\n  margin: 32px 0;\n\n  @media ", " {\n    height: 1px;\n    width: 46px;\n    margin: 24px 0;\n  }\n"])), devices.mobile);
 
 /* eslint-disable react/no-danger */
 var Quote = function Quote(_ref) {
@@ -11443,13 +11393,13 @@ var Quote = function Quote(_ref) {
   }, attribution))));
 };
 
-var _templateObject$1j, _templateObject2$10, _templateObject3$P, _templateObject4$F, _templateObject5$x, _templateObject6$q;
-var CardContainer$1 = /*#__PURE__*/styled__default.div(_templateObject$1j || (_templateObject$1j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  cursor: pointer;\n  width: 100%;\n  display: grid;\n  grid-template-columns: repeat(7, minmax(0, 1fr));\n  gap: 15px;\n  min-height: 50px;\n"])));
+var _templateObject$1i, _templateObject2$10, _templateObject3$O, _templateObject4$D, _templateObject5$w, _templateObject6$q;
+var CardContainer$1 = /*#__PURE__*/styled__default.div(_templateObject$1i || (_templateObject$1i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  cursor: pointer;\n  width: 100%;\n  display: grid;\n  grid-template-columns: repeat(7, minmax(0, 1fr));\n  gap: 15px;\n  min-height: 50px;\n"])));
 var ContentContainer$4 = /*#__PURE__*/styled__default.div(_templateObject2$10 || (_templateObject2$10 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n"])));
-var StyledImage = /*#__PURE__*/styled__default.img(_templateObject3$P || (_templateObject3$P = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  border: 1px solid var(--base-color-white);\n"])));
-var ImageWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject4$F || (_templateObject4$F = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: relative;\n"])));
-var IconWrapper$3 = /*#__PURE__*/styled__default.div(_templateObject5$x || (_templateObject5$x = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  background: rgba(0, 0, 0, 0.4);\n  position: absolute;\n  top: 0;\n  width: 100%;\n  height: 100%;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  span {\n    width: 40px;\n    height: 40px;\n    @media ", " {\n      width: 24px;\n      height: 24px;\n    }\n    @media ", " {\n      width: 18px;\n      height: 18px;\n    }\n  }\n"])), devices.tablet, devices.mobile);
-var TitleWrapper$5 = /*#__PURE__*/styled__default.div(_templateObject6$q || (_templateObject6$q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin-top: 8px;\n  div {\n    @media ", " {\n      display: -webkit-box;\n      -webkit-line-clamp: 2;\n      -webkit-box-orient: vertical;\n      overflow: hidden;\n      text-overflow: ellipsis;\n    }\n  }\n"])), devices.mobile);
+var StyledImage = /*#__PURE__*/styled__default.img(_templateObject3$O || (_templateObject3$O = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  border: 1px solid var(--base-color-white);\n"])));
+var ImageWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject4$D || (_templateObject4$D = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: relative;\n"])));
+var IconWrapper$3 = /*#__PURE__*/styled__default.div(_templateObject5$w || (_templateObject5$w = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  background: rgba(0, 0, 0, 0.4);\n  position: absolute;\n  top: 0;\n  width: 100%;\n  height: 100%;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  span {\n    width: 40px;\n    height: 40px;\n    @media ", " {\n      width: 24px;\n      height: 24px;\n    }\n    @media ", " {\n      width: 18px;\n      height: 18px;\n    }\n  }\n"])), devices.tablet, devices.mobile);
+var TitleWrapper$4 = /*#__PURE__*/styled__default.div(_templateObject6$q || (_templateObject6$q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin-top: 8px;\n  div {\n    @media ", " {\n      display: -webkit-box;\n      -webkit-line-clamp: 2;\n      -webkit-box-orient: vertical;\n      overflow: hidden;\n      text-overflow: ellipsis;\n    }\n  }\n"])), devices.mobile);
 
 var MiniCard = function MiniCard(_ref) {
   var _ref$title = _ref.title,
@@ -11482,23 +11432,23 @@ var MiniCard = function MiniCard(_ref) {
     columnSpanDesktop: 4
   }, /*#__PURE__*/React__default.createElement(ContentContainer$4, null, /*#__PURE__*/React__default.createElement(Overline, {
     level: 4
-  }, subtitle), /*#__PURE__*/React__default.createElement(TitleWrapper$5, null, /*#__PURE__*/React__default.createElement(Overline, {
+  }, subtitle), /*#__PURE__*/React__default.createElement(TitleWrapper$4, null, /*#__PURE__*/React__default.createElement(Overline, {
     level: 2
   }, title)))));
 };
 
-var _templateObject$1k, _templateObject2$11, _templateObject3$Q, _templateObject4$G, _templateObject5$y;
-var ReadMoreContainer = /*#__PURE__*/styled__default.div(_templateObject$1k || (_templateObject$1k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  h6 {\n    margin: 0px 0px 12px 0px !important;\n  }\n  width: 100%;\n"])));
+var _templateObject$1j, _templateObject2$11, _templateObject3$P, _templateObject4$E, _templateObject5$x;
+var ReadMoreContainer = /*#__PURE__*/styled__default.div(_templateObject$1j || (_templateObject$1j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  h1,\n  h2,\n  h3,\n  h4,\n  h5,\n  h6 {\n    margin: 0px 0px 12px 0px !important;\n  }\n  width: 100%;\n"])));
 var LinkContainer = /*#__PURE__*/styled__default.div(_templateObject2$11 || (_templateObject2$11 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  padding-top: 24px;\n  gap: 8px;\n\n  :hover {\n    cursor: pointer;\n  }\n\n  @media print {\n    visibility: hidden;\n  }\n"])));
-var FullTextContainer = /*#__PURE__*/styled__default.div(_templateObject3$Q || (_templateObject3$Q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  visibility: ", ";\n\n  @media print {\n    visibility: visible;\n  }\n"])), function (_ref) {
+var FullTextContainer = /*#__PURE__*/styled__default.div(_templateObject3$P || (_templateObject3$P = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  visibility: ", ";\n\n  @media print {\n    visibility: visible;\n  }\n"])), function (_ref) {
   var isVisible = _ref.isVisible;
   return isVisible ? 'visible' : 'hidden';
 });
-var IntroTextContainer = /*#__PURE__*/styled__default.div(_templateObject4$G || (_templateObject4$G = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  visibility: ", ";\n\n  @media print {\n    visibility: hidden;\n  }\n"])), function (_ref2) {
+var IntroTextContainer = /*#__PURE__*/styled__default.div(_templateObject4$E || (_templateObject4$E = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  visibility: ", ";\n\n  @media print {\n    visibility: hidden;\n  }\n"])), function (_ref2) {
   var isVisible = _ref2.isVisible;
   return isVisible ? 'visible' : 'hidden';
 });
-var ContentContainer$5 = /*#__PURE__*/styled__default.div(_templateObject5$y || (_templateObject5$y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  overflow: auto;\n  transition: max-height 0.4s ease;\n  font-size: var(--font-size-body-1);\n  font-family: var(--font-family-body);\n  font-feature-settings: var(--font-feature-settings-body);\n  font-weight: var(--font-weight-body-1);\n  letter-spacing: var(--letter-spacing-body-1);\n  line-height: var(--line-height-body-1);\n  text-transform: var(--text-transform-body);\n\n  & h1 {\n    font-size: var(--font-size-header-4);\n    font-family: var(--font-family-header);\n    font-feature-settings: var(--font-feature-settings-header);\n    font-weight: var(--font-weight-header-4);\n    letter-spacing: var(--letter-spacing-header-4);\n    line-height: var(--line-height-header-4);\n    text-transform: var(--text-transform-header);\n    white-space: break-spaces;\n    overflow-wrap: break-word;\n  }\n\n  & h2 {\n    font-size: var(--font-size-subtitle-1);\n    font-family: var(--font-family-subtitle);\n    font-feature-settings: var(--font-feature-settings-subtitle);\n    font-weight: var(--font-weight-subtitle-1);\n    letter-spacing: var(--letter-spacing-subtitle-1);\n    line-height: var(--line-height-subtitle-1);\n    text-transform: var(--text-transform-subtitle);\n    white-space: break-spaces;\n    overflow-wrap: break-word;\n  }\n\n  & em {\n    font-family: var(--font-family-body-italics);\n  }\n\n  & u {\n    font-size: var(--font-size-body-1);\n    font-family: var(--font-family-body);\n  }\n  @media print {\n    visibility: visible;\n    max-height: 900px !important;\n  }\n"])));
+var ContentContainer$5 = /*#__PURE__*/styled__default.div(_templateObject5$x || (_templateObject5$x = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  overflow: auto;\n  transition: max-height 0.4s ease;\n  font-size: var(--font-size-body-1);\n  font-family: var(--font-family-body);\n  font-feature-settings: var(--font-feature-settings-body);\n  font-weight: var(--font-weight-body-1);\n  letter-spacing: var(--letter-spacing-body-1);\n  line-height: var(--line-height-body-1);\n  text-transform: var(--text-transform-body);\n\n  & h1 {\n    font-size: var(--font-size-header-4);\n    font-family: var(--font-family-header);\n    font-feature-settings: var(--font-feature-settings-header);\n    font-weight: var(--font-weight-header-4);\n    letter-spacing: var(--letter-spacing-header-4);\n    line-height: var(--line-height-header-4);\n    text-transform: var(--text-transform-header);\n    white-space: break-spaces;\n    overflow-wrap: break-word;\n  }\n\n  & h2 {\n    font-size: var(--font-size-subtitle-1);\n    font-family: var(--font-family-subtitle);\n    font-feature-settings: var(--font-feature-settings-subtitle);\n    font-weight: var(--font-weight-subtitle-1);\n    letter-spacing: var(--letter-spacing-subtitle-1);\n    line-height: var(--line-height-subtitle-1);\n    text-transform: var(--text-transform-subtitle);\n    white-space: break-spaces;\n    overflow-wrap: break-word;\n  }\n\n  & em {\n    font-family: var(--font-family-body-italics);\n  }\n\n  & u {\n    font-size: var(--font-size-body-1);\n    font-family: var(--font-family-body);\n  }\n  @media print {\n    visibility: visible;\n    max-height: 900px !important;\n  }\n"])));
 
 var keyDown = function keyDown(e, toggleFunction) {
   if (e.key === 'Enter' || e.key === 'Space') {
@@ -11579,15 +11529,15 @@ var ReadMore = function ReadMore(_ref) {
   }, isFullTextOpen ? "" + hideText : "" + showMoreText))));
 };
 
-var _templateObject$1l, _templateObject2$12, _templateObject3$R, _templateObject4$H, _templateObject5$z;
-var MenuContainer$2 = /*#__PURE__*/styled__default.nav(_templateObject$1l || (_templateObject$1l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: relative;\n  padding: 0;\n  margin: 0;\n"])));
+var _templateObject$1k, _templateObject2$12, _templateObject3$Q, _templateObject4$F, _templateObject5$y;
+var MenuContainer$2 = /*#__PURE__*/styled__default.nav(_templateObject$1k || (_templateObject$1k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: relative;\n  padding: 0;\n  margin: 0;\n"])));
 var MenuList = /*#__PURE__*/styled__default.ul(_templateObject2$12 || (_templateObject2$12 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  padding: 0;\n  margin: 0;\n  list-style: none;\n  border-right: 1px solid var(--base-color-", ");\n  li {\n    margin-left: -5px;\n  }\n"])), exports.Colors.LightGrey);
-var MobileButton = /*#__PURE__*/styled__default.button(_templateObject3$R || (_templateObject3$R = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  line-height: var(--line-height-navigation);\n  font-size: var(--font-size-navigation);\n  font-family: var(--font-family-navigation);\n  font-weight: var(--font-weight-navigation);\n  letter-spacing: var(--letter-spacing-navigation);\n  color: var(--base-color-", ");\n  text-transform: uppercase;\n  margin: 0;\n  padding: 16px 46px 14px 20px;\n  background: var(--base-color-", ");\n  border: 1px solid var(--base-color-", ");\n  border-radius: 0;\n  display: block;\n  width: 100%;\n  text-align: left;\n  cursor: pointer;\n  position: relative;\n  span {\n    width: 25px;\n    height: 25px;\n    position: absolute;\n    top: 50%;\n    margin-top: -12px;\n    right: 10px;\n  }\n"])), exports.Colors.Black, exports.Colors.White, exports.Colors.DarkGrey);
-var MenuItem$1 = /*#__PURE__*/styled__default.a(_templateObject4$H || (_templateObject4$H = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  line-height: var(--line-height-navigation);\n  font-size: var(--font-size-navigation);\n  font-family: var(--font-family-navigation);\n  font-weight: var(--font-weight-navigation);\n  letter-spacing: var(--letter-spacing-navigation);\n  color: var(--base-color-", ");\n  text-transform: uppercase;\n  text-decoration: none;\n  margin: 0;\n  padding: 16px 20px 15px 5px;\n  display: block;\n  background: ", ";\n  cursor: pointer;\n  &:hover {\n    background: var(--base-color-", ");\n  }\n"])), exports.Colors.Black, function (_ref) {
+var MobileButton = /*#__PURE__*/styled__default.button(_templateObject3$Q || (_templateObject3$Q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  line-height: var(--line-height-navigation);\n  font-size: var(--font-size-navigation);\n  font-family: var(--font-family-navigation);\n  font-weight: var(--font-weight-navigation);\n  letter-spacing: var(--letter-spacing-navigation);\n  color: var(--base-color-", ");\n  text-transform: uppercase;\n  margin: 0;\n  padding: 16px 46px 14px 20px;\n  background: var(--base-color-", ");\n  border: 1px solid var(--base-color-", ");\n  border-radius: 0;\n  display: block;\n  width: 100%;\n  text-align: left;\n  cursor: pointer;\n  position: relative;\n  span {\n    width: 25px;\n    height: 25px;\n    position: absolute;\n    top: 50%;\n    margin-top: -12px;\n    right: 10px;\n  }\n"])), exports.Colors.Black, exports.Colors.White, exports.Colors.DarkGrey);
+var MenuItem$1 = /*#__PURE__*/styled__default.a(_templateObject4$F || (_templateObject4$F = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  line-height: var(--line-height-navigation);\n  font-size: var(--font-size-navigation);\n  font-family: var(--font-family-navigation);\n  font-weight: var(--font-weight-navigation);\n  letter-spacing: var(--letter-spacing-navigation);\n  color: var(--base-color-", ");\n  text-transform: uppercase;\n  text-decoration: none;\n  margin: 0;\n  padding: 16px 20px 15px 5px;\n  display: block;\n  background: ", ";\n  cursor: pointer;\n  &:hover {\n    background: var(--base-color-", ");\n  }\n"])), exports.Colors.Black, function (_ref) {
   var isActive = _ref.isActive;
   return isActive ? "var(--base-color-" + exports.Colors.MidGrey + ")" : 'none';
 }, exports.Colors.MidGrey);
-var MobileMenuList = /*#__PURE__*/styled__default.ul(_templateObject5$z || (_templateObject5$z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  padding: 0;\n  margin: 0;\n  list-style: none;\n  display: ", ";\n  background: var(--base-color-", ");\n  border: 1px solid var(--base-color-", ");\n  border-top: 0;\n  position: absolute;\n  top: 100%;\n  left: 0;\n  right: 0;\n  ", " {\n    padding: 16px 20px 15px 20px;\n  }\n"])), function (_ref2) {
+var MobileMenuList = /*#__PURE__*/styled__default.ul(_templateObject5$y || (_templateObject5$y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  padding: 0;\n  margin: 0;\n  list-style: none;\n  display: ", ";\n  background: var(--base-color-", ");\n  border: 1px solid var(--base-color-", ");\n  border-top: 0;\n  position: absolute;\n  top: 100%;\n  left: 0;\n  right: 0;\n  ", " {\n    padding: 16px 20px 15px 20px;\n  }\n"])), function (_ref2) {
   var isOpen = _ref2.isOpen;
   return isOpen ? 'block' : 'none';
 }, exports.Colors.White, exports.Colors.DarkGrey, MenuItem$1);
@@ -11743,15 +11693,15 @@ var AuxiliaryNav = function AuxiliaryNav(_ref6) {
   });
 };
 
-var _templateObject$1m, _templateObject2$13, _templateObject3$S, _templateObject4$I, _templateObject5$A, _templateObject6$r;
-var Container$5 = /*#__PURE__*/styled__default.div(_templateObject$1m || (_templateObject$1m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  gap: 10px;\n"])));
+var _templateObject$1l, _templateObject2$13, _templateObject3$R, _templateObject4$G, _templateObject5$z, _templateObject6$r;
+var Container$5 = /*#__PURE__*/styled__default.div(_templateObject$1l || (_templateObject$1l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  gap: 10px;\n"])));
 var Sections = /*#__PURE__*/styled__default.div(_templateObject2$13 || (_templateObject2$13 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: row;\n  gap: 8px;\n"])));
-var Section = /*#__PURE__*/styled__default.div(_templateObject3$S || (_templateObject3$S = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  flex: 1;\n  height: 2px;\n  background-color: ", ";\n"])), function (_ref) {
+var Section = /*#__PURE__*/styled__default.div(_templateObject3$R || (_templateObject3$R = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  flex: 1;\n  height: 2px;\n  background-color: ", ";\n"])), function (_ref) {
   var color = _ref.color;
   return "var(--base-color-" + color + ")";
 });
-var BottomLine = /*#__PURE__*/styled__default.div(_templateObject4$I || (_templateObject4$I = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: space-between;\n  gap: 20px;\n"])));
-var Text = /*#__PURE__*/styled__default.div(_templateObject5$A || (_templateObject5$A = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: ", ";\n"])), function (_ref2) {
+var BottomLine = /*#__PURE__*/styled__default.div(_templateObject4$G || (_templateObject4$G = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: space-between;\n  gap: 20px;\n"])));
+var Text = /*#__PURE__*/styled__default.div(_templateObject5$z || (_templateObject5$z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: ", ";\n"])), function (_ref2) {
   var color = _ref2.color;
   return "var(--base-color-" + color + ")";
 });
@@ -11837,19 +11787,19 @@ var PasswordStrength = function PasswordStrength(_ref) {
   }, strengthLabel))));
 };
 
-var _templateObject$1n, _templateObject2$14, _templateObject3$T, _templateObject4$J, _templateObject5$B, _templateObject6$s, _templateObject7$m, _templateObject8$g;
-var TableContainer = /*#__PURE__*/styled__default.table(_templateObject$1n || (_templateObject$1n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  border-collapse: collapse;\n"])));
+var _templateObject$1m, _templateObject2$14, _templateObject3$S, _templateObject4$H, _templateObject5$A, _templateObject6$s, _templateObject7$k, _templateObject8$f;
+var TableContainer = /*#__PURE__*/styled__default.table(_templateObject$1m || (_templateObject$1m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  border-collapse: collapse;\n"])));
 var Container$6 = /*#__PURE__*/styled__default.div(_templateObject2$14 || (_templateObject2$14 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  overflow-x: auto;\n"])));
-var Wrapper$9 = /*#__PURE__*/styled__default.div(_templateObject3$T || (_templateObject3$T = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  width: 100%;\n"])));
-var TableHeader = /*#__PURE__*/styled__default.th(_templateObject4$J || (_templateObject4$J = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  padding: 12px;\n  text-align: left;\n  text-transform: capitalize;\n  border: 1px solid var(--color-primary-black);\n\n  &:last-child {\n    white-space: nowrap;\n    width: auto;\n  }\n\n  &:not(:last-child) {\n    width: ", ";\n  }\n\n  @media ", " {\n    &:last-child {\n      white-space: nowrap;\n    }\n  }\n\n  @media ", " {\n    min-width: 150px;\n\n    &:last-child {\n      white-space: normal;\n    }\n  }\n"])), function (props) {
+var Wrapper$8 = /*#__PURE__*/styled__default.div(_templateObject3$S || (_templateObject3$S = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  width: 100%;\n"])));
+var TableHeader = /*#__PURE__*/styled__default.th(_templateObject4$H || (_templateObject4$H = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  padding: 12px;\n  text-align: left;\n  text-transform: capitalize;\n  border: 1px solid var(--color-primary-black);\n\n  &:last-child {\n    white-space: nowrap;\n    width: auto;\n  }\n\n  &:not(:last-child) {\n    width: ", ";\n  }\n\n  @media ", " {\n    &:last-child {\n      white-space: nowrap;\n    }\n  }\n\n  @media ", " {\n    min-width: 150px;\n\n    &:last-child {\n      white-space: normal;\n    }\n  }\n"])), function (props) {
   return "calc(100% / " + (props.columns - 1) + ")";
 }, devices.tablet, devices.mobile);
-var TableCell = /*#__PURE__*/styled__default.td(_templateObject5$B || (_templateObject5$B = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  padding: 12px;\n  text-align: left;\n  vertical-align: middle;\n  border: 1px solid var(--color-primary-black);\n\n  &:last-child {\n    width: auto;\n  }\n\n  &:not(:last-child) {\n    width: ", ";\n  }\n\n  > span > svg {\n    width: 24px;\n    height: 24px;\n  }\n\n  @media ", " {\n    min-width: 150px;\n  }\n"])), function (props) {
+var TableCell = /*#__PURE__*/styled__default.td(_templateObject5$A || (_templateObject5$A = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  padding: 12px;\n  text-align: left;\n  vertical-align: middle;\n  border: 1px solid var(--color-primary-black);\n\n  &:last-child {\n    width: auto;\n  }\n\n  &:not(:last-child) {\n    width: ", ";\n  }\n\n  > span > svg {\n    width: 24px;\n    height: 24px;\n  }\n\n  @media ", " {\n    min-width: 150px;\n  }\n"])), function (props) {
   return "calc(100% / " + (props.columns - 1) + ")";
 }, devices.mobile);
 var PaginationWrapper = /*#__PURE__*/styled__default(Pagination)(_templateObject6$s || (_templateObject6$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  padding-top: 40px;\n  padding-bottom: 80px;\n\n  @media ", " {\n    padding-top: 24px;\n    padding-bottom: 60px;\n  }\n"])), devices.mobile);
-var ScrollButtons = /*#__PURE__*/styled__default.div(_templateObject7$m || (_templateObject7$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  justify-content: flex-end;\n  padding: 60px 0 24px 0;\n\n  div:hover {\n    background-color: var(--color-base-light-grey);\n  }\n\n  > div > div {\n    background-color: var(--color-base-light-grey);\n  }\n\n  svg path {\n    fill: var(--color-base-black) !important;\n  }\n"])));
-var AriaDescription$2 = /*#__PURE__*/styled__default.span(_templateObject8$g || (_templateObject8$g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: absolute;\n  left: -9999px;\n  width: 1px;\n  height: 1px;\n  overflow: hidden;\n"])));
+var ScrollButtons = /*#__PURE__*/styled__default.div(_templateObject7$k || (_templateObject7$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  justify-content: flex-end;\n  padding: 60px 0 24px 0;\n\n  div:hover {\n    background-color: var(--color-base-light-grey);\n  }\n\n  > div > div {\n    background-color: var(--color-base-light-grey);\n  }\n\n  svg path {\n    fill: var(--color-base-black) !important;\n  }\n"])));
+var AriaDescription$2 = /*#__PURE__*/styled__default.span(_templateObject8$f || (_templateObject8$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: absolute;\n  left: -9999px;\n  width: 1px;\n  height: 1px;\n  overflow: hidden;\n"])));
 
 /* eslint-disable react/no-danger */
 var Content = function Content(_ref) {
@@ -12022,7 +11972,7 @@ var Table = function Table(_ref) {
   } else {
     visibleRows = totalRows;
   }
-  return /*#__PURE__*/React__default.createElement(Wrapper$9, {
+  return /*#__PURE__*/React__default.createElement(Wrapper$8, {
     className: className
   }, showScrollButtons && (/*#__PURE__*/React__default.createElement(ScrollButtons, null, /*#__PURE__*/React__default.createElement(RotatorButtons, {
     onClickPrev: handlePrev,
@@ -12052,8 +12002,8 @@ var Table = function Table(_ref) {
   }))));
 };
 
-var _templateObject$1o, _templateObject2$15, _templateObject3$U, _templateObject4$K, _templateObject5$C, _templateObject6$t, _templateObject7$n, _templateObject8$h, _templateObject9$b, _templateObject0$a, _templateObject1$6, _templateObject10$4, _templateObject11$4, _templateObject12$4, _templateObject13$3;
-var Wrapper$a = /*#__PURE__*/styled__default('div')(_templateObject$1o || (_templateObject$1o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: relative;\n  border-top: 4px solid ", ";\n  border-bottom: 4px solid ", ";\n"])), function (_ref) {
+var _templateObject$1n, _templateObject2$15, _templateObject3$T, _templateObject4$I, _templateObject5$B, _templateObject6$t, _templateObject7$l, _templateObject8$g, _templateObject9$9, _templateObject0$9, _templateObject1$6, _templateObject10$4, _templateObject11$4, _templateObject12$4, _templateObject13$3;
+var Wrapper$9 = /*#__PURE__*/styled__default('div')(_templateObject$1n || (_templateObject$1n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: relative;\n  border-top: 4px solid ", ";\n  border-bottom: 4px solid ", ";\n"])), function (_ref) {
   var theme = _ref.theme;
   return "var(--color-" + theme + ")";
 }, function (_ref2) {
@@ -12061,14 +12011,14 @@ var Wrapper$a = /*#__PURE__*/styled__default('div')(_templateObject$1o || (_temp
   return "var(--color-" + theme + ")";
 });
 var SignUpFormWrapper = /*#__PURE__*/styled__default(Grid)(_templateObject2$15 || (_templateObject2$15 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  gap: 0 var(--grid-column-gap);\n  margin-bottom: 32px;\n\n  @media ", " {\n    margin-bottom: 30px;\n  }\n"])), devices.mobile);
-var SignUpTitleWrapper = /*#__PURE__*/styled__default('div')(_templateObject3$U || (_templateObject3$U = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  text-align: left;\n  position: relative;\n  top: -25px;\n  left: -20px;\n  height: 52px;\n  background: var(--color-base-white);\n  display: inline-block;\n  padding: 0 20px;\n\n  @media ", " {\n    top: -18px;\n    height: 37px;\n    padding: 0 13px;\n    left: -13px;\n  }\n"])), devices.mobile);
-var Error = /*#__PURE__*/styled__default.div(_templateObject4$K || (_templateObject4$K = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin-top: 20px;\n  color: var(--color-base-errorstate);\n\n  a {\n    text-decoration: underline;\n    color: inherit;\n  }\n"])));
-var Form = /*#__PURE__*/styled__default.form(_templateObject5$C || (_templateObject5$C = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin-top: 32px;\n  align-items: center;\n  ", " {\n    margin-top: -20px;\n  }\n  a[href] {\n    color: inherit;\n  }\n"])), Error);
+var SignUpTitleWrapper = /*#__PURE__*/styled__default('div')(_templateObject3$T || (_templateObject3$T = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  text-align: left;\n  position: relative;\n  top: -25px;\n  left: -20px;\n  height: 52px;\n  background: var(--color-base-white);\n  display: inline-block;\n  padding: 0 20px;\n\n  @media ", " {\n    top: -18px;\n    height: 37px;\n    padding: 0 13px;\n    left: -13px;\n  }\n"])), devices.mobile);
+var Error$1 = /*#__PURE__*/styled__default.div(_templateObject4$I || (_templateObject4$I = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin-top: 20px;\n  color: var(--color-base-errorstate);\n\n  a {\n    text-decoration: underline;\n    color: inherit;\n  }\n"])));
+var Form = /*#__PURE__*/styled__default.form(_templateObject5$B || (_templateObject5$B = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin-top: 32px;\n  align-items: center;\n  ", " {\n    margin-top: -20px;\n  }\n  a[href] {\n    color: inherit;\n  }\n"])), Error$1);
 var FormFooterWrapper = /*#__PURE__*/styled__default.div(_templateObject6$t || (_templateObject6$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin-top: 32px;\n  display: flex;\n  gap: 28px;\n  align-items: center;\n\n  @media ", " {\n    flex-direction: column;\n    align-items: flex-start;\n  }\n"])), devices.mobile);
-var ServerError = /*#__PURE__*/styled__default.div(_templateObject7$n || (_templateObject7$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  text-align: left;\n  color: var(--color-base-errorstate);\n"])));
-var CTALinkWrapper = /*#__PURE__*/styled__default.a(_templateObject8$h || (_templateObject8$h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  text-decoration: none;\n\n  @media ", " {\n    text-decoration: underline;\n  }\n"])), devices.mobile);
-var ButtonWrapper$3 = /*#__PURE__*/styled__default.div(_templateObject9$b || (_templateObject9$b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  all: unset;\n  width: fit-content;\n  color: var(--base-color-white);\n  text-decoration: none;\n\n  @media ", " {\n    width: 100%;\n  }\n"])), devices.mobile);
-var FieldsWrapper = /*#__PURE__*/styled__default.div(_templateObject0$a || (_templateObject0$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: grid;\n  grid-template-columns: repeat(3, 1fr);\n  gap: 36px;\n\n  @media ", " {\n    grid-template-columns: 1fr;\n    gap: 20px;\n  }\n"])), devices.mobile);
+var ServerError = /*#__PURE__*/styled__default.div(_templateObject7$l || (_templateObject7$l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  text-align: left;\n  color: var(--color-base-errorstate);\n"])));
+var CTALinkWrapper = /*#__PURE__*/styled__default.a(_templateObject8$g || (_templateObject8$g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  text-decoration: none;\n\n  @media ", " {\n    text-decoration: underline;\n  }\n"])), devices.mobile);
+var ButtonWrapper$3 = /*#__PURE__*/styled__default.div(_templateObject9$9 || (_templateObject9$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  all: unset;\n  width: fit-content;\n  color: var(--base-color-white);\n  text-decoration: none;\n\n  @media ", " {\n    width: 100%;\n  }\n"])), devices.mobile);
+var FieldsWrapper = /*#__PURE__*/styled__default.div(_templateObject0$9 || (_templateObject0$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: grid;\n  grid-template-columns: repeat(3, 1fr);\n  gap: 36px;\n\n  @media ", " {\n    grid-template-columns: 1fr;\n    gap: 20px;\n  }\n"])), devices.mobile);
 var MessageWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject1$6 || (_templateObject1$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  div > p {\n    margin: 0;\n  }\n"])));
 var DropdownAreaWrapper = /*#__PURE__*/styled__default.div(_templateObject10$4 || (_templateObject10$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  grid-column: 1 / -1;\n  display: grid;\n  grid-template-columns: var(--grid-template-columns);\n  gap: var(--grid-column-gap);\n  cursor: pointer;\n"])));
 var DropdownWrapper = /*#__PURE__*/styled__default.div(_templateObject11$4 || (_templateObject11$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: center;\n  width: fit-content;\n  transform: rotate(", ");\n  .dropdown-icon > div {\n    border-bottom: none;\n    color: var(--color-base-black);\n    margin: 0;\n  }\n"])), function (_ref3) {
@@ -12244,18 +12194,18 @@ var SignUpForm = function SignUpForm(_ref) {
     };
   };
   var handleFormSubmit = /*#__PURE__*/function () {
-    var _ref2 = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee(e) {
+    var _ref2 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee(e) {
       var formErrors, response;
-      return _regenerator().w(function (_context) {
-        while (1) switch (_context.n) {
+      return _regeneratorRuntime().wrap(function _callee$(_context) {
+        while (1) switch (_context.prev = _context.next) {
           case 0:
             e.preventDefault();
             if (!isSuccess) {
-              _context.n = 1;
+              _context.next = 3;
               break;
             }
-            return _context.a(2);
-          case 1:
+            return _context.abrupt("return");
+          case 3:
             formErrors = {};
             if (!isLoggedIn) {
               if (!formValues.firstName) {
@@ -12273,16 +12223,16 @@ var SignUpForm = function SignUpForm(_ref) {
               }
             }
             if (!(Object.keys(formErrors).length > 0)) {
-              _context.n = 2;
+              _context.next = 8;
               break;
             }
             setErrors(formErrors);
-            return _context.a(2);
-          case 2:
-            _context.n = 3;
+            return _context.abrupt("return");
+          case 8:
+            _context.next = 10;
             return submitHandler(isLoggedIn ? {} : formValues);
-          case 3:
-            response = _context.v;
+          case 10:
+            response = _context.sent;
             if (response.success) {
               setIsSuccess(true);
             } else {
@@ -12292,8 +12242,9 @@ var SignUpForm = function SignUpForm(_ref) {
                 });
               });
             }
-          case 4:
-            return _context.a(2);
+          case 12:
+          case "end":
+            return _context.stop();
         }
       }, _callee);
     }));
@@ -12410,7 +12361,7 @@ var SignUpFormComponent = function SignUpFormComponent(_ref) {
   React.useEffect(function () {
     setDropdownOpen(isOpened);
   }, [isOpened]);
-  return /*#__PURE__*/React__default.createElement(Wrapper$a, {
+  return /*#__PURE__*/React__default.createElement(Wrapper$9, {
     theme: themeToColor(theme),
     className: className
   }, /*#__PURE__*/React__default.createElement(SignUpFormWrapper, null, isMobile && !isLoggedIn && !isSuccess ? (/*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(HiddenInstructions, {
@@ -12475,13 +12426,13 @@ var SignUpFormComponent = function SignUpFormComponent(_ref) {
   }))))));
 };
 
-var _templateObject$1p, _templateObject2$16, _templateObject4$L, _templateObject5$D;
-var AnchorBarContainer = /*#__PURE__*/styled__default(Grid)(_templateObject$1p || (_templateObject$1p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: sticky;\n  top: 0;\n  min-height: 70px;\n  background: var(--color-base-white);\n  z-index: ", ";\n  align-content: center;\n  border-bottom: 1px solid var(--color-base-light-grey);\n\n  ", "\n\n  @media ", " {\n    min-height: 60px;\n  }\n"])), zIndexes.anchor, function (_ref) {
+var _templateObject$1o, _templateObject2$16, _templateObject4$J, _templateObject5$C;
+var AnchorBarContainer = /*#__PURE__*/styled__default(Grid)(_templateObject$1o || (_templateObject$1o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: sticky;\n  top: 0;\n  min-height: 70px;\n  background: var(--color-base-white);\n  z-index: ", ";\n  align-content: center;\n  border-bottom: 1px solid var(--color-base-light-grey);\n\n  ", "\n\n  @media ", " {\n    min-height: 60px;\n  }\n"])), zIndexes.anchor, function (_ref) {
   var withShadow = _ref.withShadow;
   return withShadow && styled.css(_templateObject2$16 || (_templateObject2$16 = _taggedTemplateLiteralLoose(["\n      box-shadow: var(--shadow-floating);\n    "])));
 }, devices.mobile);
-var CloseButtonWrapper = /*#__PURE__*/styled__default.a(_templateObject4$L || (_templateObject4$L = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  text-decoration: none;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  min-height: 24px;\n  min-width: 24px;\n  max-height: 24px;\n  max-width: 24px;\n  border: none;\n  padding: 0;\n  background: none;\n\n  :hover {\n    cursor: pointer;\n  }\n\n  @media ", " {\n    min-height: 12px;\n    min-width: 12px;\n    max-height: 12px;\n    max-width: 12px;\n  }\n"])), devices.mobile);
-var ContentWrapper$3 = /*#__PURE__*/styled__default.a(_templateObject5$D || (_templateObject5$D = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n"])));
+var CloseButtonWrapper = /*#__PURE__*/styled__default.a(_templateObject4$J || (_templateObject4$J = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  text-decoration: none;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  min-height: 24px;\n  min-width: 24px;\n  max-height: 24px;\n  max-width: 24px;\n  border: none;\n  padding: 0;\n  background: none;\n\n  :hover {\n    cursor: pointer;\n  }\n\n  @media ", " {\n    min-height: 12px;\n    min-width: 12px;\n    max-height: 12px;\n    max-width: 12px;\n  }\n"])), devices.mobile);
+var ContentWrapper$3 = /*#__PURE__*/styled__default.a(_templateObject5$C || (_templateObject5$C = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n"])));
 
 var AnchorBar = function AnchorBar(_ref) {
   var cta = _ref.cta,
@@ -12690,6 +12641,53 @@ var HighlightsCarousel = function HighlightsCarousel(_ref) {
   })));
 };
 
+var coreThemeStyles = {"coreTheme":"core-theme-module_coreTheme__pWxYB"};
+
+var streamThemeStyles = {"streamTheme":"stream-theme-module_streamTheme__lTfqQ"};
+
+var cinemaThemeStyles = {"cinemaTheme":"cinema-theme-module_cinemaTheme__f5QFs"};
+
+var schoolsThemeStyles = {"schoolsTheme":"schools-theme-module_schoolsTheme__CWHba"};
+
+/* eslint-disable react/jsx-no-useless-fragment */
+var getThemeClass = function getThemeClass(theme) {
+  // Always include the base (core) theme class
+  var baseThemeClass = coreThemeStyles.coreTheme;
+  var overrideClass = '';
+  switch (theme) {
+    case exports.ThemeType.Core:
+      overrideClass = '';
+      break;
+    case exports.ThemeType.Stream:
+      overrideClass = streamThemeStyles.streamTheme;
+      break;
+    case exports.ThemeType.Cinema:
+      overrideClass = cinemaThemeStyles.cinemaTheme;
+      break;
+    case exports.ThemeType.Schools:
+      overrideClass = schoolsThemeStyles.schoolsTheme;
+      break;
+    default:
+      overrideClass = '';
+  }
+  // Return the combined classes
+  return [baseThemeClass, overrideClass].filter(Boolean).join(' ');
+};
+var HarmonicThemeProvider = function HarmonicThemeProvider(_ref) {
+  var theme = _ref.theme,
+    children = _ref.children;
+  var themeClass = getThemeClass(theme);
+  // Convert children to an array (assuming they accept a className prop)
+  var childrenArray = React__default.Children.toArray(children);
+  var themedChildren = childrenArray.map(function (child) {
+    return /*#__PURE__*/React__default.cloneElement(child, {
+      className: ((child.props.className || '') + " " + themeClass).trim(),
+      theme: theme
+    });
+  });
+  return themedChildren.length === 1 ? themedChildren[0] : /*#__PURE__*/React__default.createElement(React__default.Fragment, null, themedChildren);
+};
+
 var _excluded$s = ["logo", "slides"];
 var HighlightsCinema = function HighlightsCinema(_ref) {
   var logo = _ref.logo,
@@ -12749,9 +12747,9 @@ var HighlightsStream = function HighlightsStream(_ref) {
   })));
 };
 
-var _templateObject$1q, _templateObject3$V;
-var CarouselWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject$1q || (_templateObject$1q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  user-select: none;\n  display: flex;\n\n  .swipe-slide {\n    width: 100%;\n  }\n"])));
-var ButtonsWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject3$V || (_templateObject3$V = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  justify-content: center;\n  flex-direction: column;\n  margin-left: 6px;\n"])));
+var _templateObject$1p, _templateObject3$U;
+var CarouselWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject$1p || (_templateObject$1p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  user-select: none;\n  display: flex;\n\n  .swipe-slide {\n    width: 100%;\n  }\n"])));
+var ButtonsWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject3$U || (_templateObject3$U = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  justify-content: center;\n  flex-direction: column;\n  margin-left: 6px;\n"])));
 
 var MinimalCarousel = function MinimalCarousel(_ref) {
   var children = _ref.children;
@@ -12786,8 +12784,8 @@ var MinimalCarousel = function MinimalCarousel(_ref) {
   }))));
 };
 
-var _templateObject$1r;
-var GlobalStyles = /*#__PURE__*/styled.createGlobalStyle(_templateObject$1r || (_templateObject$1r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  html {\n    --base-color-primary: ", ";\n    --base-color-core: ", ";\n    --base-color-stream: ", ";\n    --base-color-cinema: ", ";\n    --base-color-white: ", ";\n    --base-color-black: ", ";\n    --base-color-dark-grey: ", ";\n    --base-color-mid-grey: ", ";\n    --base-color-light-grey: ", ";\n    --error-color-state: ", ";\n    --medium-color-state: ", ";\n    --good-color-state: ", ";\n    --base-color-darkgrey: ", ";\n    --base-color-midgrey: ", ";\n    --base-color-lightgrey: ", ";\n    --base-color-transparent: transparent;\n    --base-color-errorstate: ", ";\n    --base-color-mediumstate: ", ";\n    --base-color-goodstate: ", ";\n    --base-color-progress: ", ";\n    --base-color-navigation: ", ";\n    --base-color-lapislazuli: ", ";\n    --base-color-lemonchiffon: ", ";\n\n    --button-height: ", ";\n    --button-line-height: ", ";\n    --button-padding-x: ", ";\n    --button-padding-y: ", ";\n    --button-padding-y-icon: ", ";\n    --button-icon-margin: ", ";\n    --button-icon-width: ", ";\n    --button-icon-height: ", ";\n    --button-font-size: ", ";\n    --button-font-weight: ", ";\n\n    --font-size-header-1: ", ";\n    --font-weight-header-1: ", ";\n    --letter-spacing-header-1: ", ";\n    --line-height-header-1: ", ";\n    --margin-header-1: ", ";\n\n    --font-size-header-2: ", ";\n    --font-weight-header-2: ", ";\n    --letter-spacing-header-2: ", ";\n    --line-height-header-2: ", ";\n    --margin-header-2: ", ";\n\n    --font-size-header-3: ", ";\n    --font-weight-header-3: ", ";\n    --letter-spacing-header-3: ", ";\n    --line-height-header-3: ", ";\n    --margin-header-3: ", ";\n\n    --font-size-header-4: ", ";\n    --font-weight-header-4: ", ";\n    --letter-spacing-header-4: ", ";\n    --line-height-header-4: ", ";\n    --margin-header-4: ", ";\n\n    --font-size-header-5: ", ";\n    --font-weight-header-5: ", ";\n    --letter-spacing-header-5: ", ";\n    --line-height-header-5: ", ";\n    --margin-header-5: ", ";\n\n    --font-size-header-6: ", ";\n    --font-weight-header-6: ", ";\n    --letter-spacing-header-6: ", ";\n    --line-height-header-6: ", ";\n    --margin-header-6: ", ";\n\n    --font-size-altHeader-3: ", ";\n    --font-weight-altHeader-3: ", ";\n    --letter-spacing-altHeader-3: ", ";\n    --line-height-altHeader-3: ", ";\n\n    --font-size-altHeader-4: ", ";\n    --font-weight-altHeader-4: ", ";\n    --letter-spacing-altHeader-4: ", ";\n    --line-height-altHeader-4: ", ";\n\n    --font-size-altHeader-5: ", ";\n    --font-weight-altHeader-5: ", ";\n    --letter-spacing-altHeader-5: ", ";\n    --line-height-altHeader-5: ", ";\n\n    --font-size-altHeader-6: ", ";\n    --font-weight-altHeader-6: ", ";\n    --letter-spacing-altHeader-6: ", ";\n    --line-height-altHeader-6: ", ";\n\n    --font-size-overline-1: ", ";\n    --font-weight-overline-1: ", ";\n    --letter-spacing-overline-1: ", ";\n    --line-height-overline-1: ", ";\n\n    --font-size-overline-2: ", ";\n    --font-weight-overline-2: ", ";\n    --letter-spacing-overline-2: ", ";\n    --line-height-overline-2: ", ";\n\n    --font-size-overline-3: ", ";\n    --font-weight-overline-3: ", ";\n    --letter-spacing-overline-3: ", ";\n    --line-height-overline-3: ", "; \n\n    --font-size-overline-4: ", ";\n    --font-weight-overline-4: ", ";\n    --letter-spacing-overline-4: ", ";\n    --line-height-overline-4: ", ";\n\n    --font-size-body-1: ", ";\n    --font-weight-body-1: ", ";\n    --letter-spacing-body-1: ", ";\n    --line-height-body-1: ", ";\n\n    --font-size-body-2: ", ";\n    --font-weight-body-2: ", ";\n    --letter-spacing-body-2: ", ";\n    --line-height-body-2: ", ";\n\n    --font-size-body-3: ", ";\n    --font-weight-body-3: ", ";\n    --letter-spacing-body-3: ", ";\n    --line-height-body-3: ", ";\n\n    --font-size-subtitle-1: ", ";\n    --font-weight-subtitle-1: ", ";\n    --letter-spacing-subtitle-1: ", ";\n    --line-height-subtitle-1: ", ";\n    \n    --font-size-subtitle-2: ", ";\n    --font-weight-subtitle-2: ", ";\n    --letter-spacing-subtitle-2: ", ";\n    --line-height-subtitle-2: ", ";\n\n    --font-size-title-description: ", ";\n    --line-height-title-description: ", ";\n    --line-height-listing: ", ";\n    --font-size-individual-listing-name: ", ";\n    --line-height-individual-listing-name: ", ";\n    --line-height-people-listing-gap: ", ";\n\n    --font-family-header: ", ";\n    --font-family-altHeader: ", ";\n    --font-family-body: ", ";\n    --font-family-body-italics: ", ";\n    --font-family-buttons: ", ";\n    --font-family-overline: ", ";\n    --font-family-subtitle: ", ";\n    --font-family-people-listing-role: ", ";\n    --font-family-people-listing-name: ", ";\n\n    --font-feature-settings-header: ", ";\n    --font-feature-settings-altHeader: ", ";\n    --font-feature-settings-overline: ", ";\n    --font-feature-settings-subtitle: ", ";\n    --font-feature-settings-body: ", ";\n    --font-feature-settings-navigation: ", ";\n\n    --text-transform-header: ", ";\n    --text-transform-altHeader: ", ";\n    --text-transform-body: ", ";\n    --text-transform-overline: ", ";\n    --text-transform-subtitle: ", ";\n\n    --word-break-header: ", ";\n    --word-break-altHeader: ", ";\n    --word-break-body: ", ";\n    --word-break-overline: ", ";\n    --word-break-subtitle: ", ";\n\n    --font-family-navigation: ", ";\n    --font-size-navigation: ", ";\n    --font-weight-navigation: ", ";\n    --line-height-navigation: ", ";\n    --text-transform-navigation: ", ";\n    --letter-spacing-navigation: ", ";\n\n    --navigation-small-gap: ", ";\n    --navigation-middle-gap: ", ";\n    --navigation-large-gap: ", ";\n    --navigation-xlarge-gap: ", ";\n    --navigation-large-margin: ", ";\n\n    --rotator-button-width: ", ";\n    --rotator-button-icon-width: ", ";\n\n    --font-size-search: ", ";\n    --font-family-search: ", ";\n\n    --grid-margin: ", ";\n    --grid-outer-margin: ", ";\n    --grid-template-columns: calc(", " - ", ") calc(", " - ", " - ", ") repeat(12, minmax(0,1fr)) calc(", " - ", " - ", ") calc(", " - ", ");\n    --grid-column-gap: ", ";\n    --grid-margin: 0;\n\n    --footer-height: ", ";\n    --footer-padding-top: ", ";\n    --footer-padding-bottom: ", ";\n    --footer-items-gap: ", ";\n    --footer-media-gap: ", ";\n    --footer-media-icon-width: ", ";\n    --footer-media-icon-height: ", ";\n    --footer-vertical-spacing-lg: ", ";\n    --footer-vertical-spacing-sm: ", ";\n\n    --text-link-underline-offset: ", ";\n\n    --cards-spacing-stack: ", ";\n\n    --editorial-subtitle-margin-bottom: ", ";\n    --editorial-margin-between: ", ";\n    --editorial-spacing-hover: ", ";\n    --anchor-tabs-height: 70px;\n    \n    --harmonic-font-family-sans: 'Grey LL Bold', 'Roboto', sans-serif;\n    --harmonic-font-family-serif: 'Victor Serif Medium', 'Inria Serif Regular', serif;\n    --harmonic-text-link-underline-offset: 6px;\n    --harmonic-text-transform-navigation: capitalize;\n    --harmonic-font-size-navigation: 19px;\n\n    @media ", " {\n\n      --font-size-header-1: ", ";\n      --font-weight-header-1: ", ";\n      --letter-spacing-header-1: ", ";\n      --line-height-header-1: ", ";\n  \n      --font-size-header-2: ", ";\n      --font-weight-header-2: ", ";\n      --letter-spacing-header-2: ", ";\n      --line-height-header-2: ", ";\n  \n      --font-size-header-3: ", ";\n      --font-weight-header-3: ", ";\n      --letter-spacing-header-3: ", ";\n      --line-height-header-3: ", ";\n  \n      --font-size-header-4: ", ";\n      --font-weight-header-4: ", ";\n      --letter-spacing-header-4: ", ";\n      --line-height-header-4: ", ";\n  \n      --font-size-header-5: ", ";\n      --font-weight-header-5: ", ";\n      --letter-spacing-header-5: ", ";\n      --line-height-header-5: ", ";\n  \n      --font-size-header-6: ", ";\n      --font-weight-header-6: ", ";\n      --letter-spacing-header-6: ", ";\n      --line-height-header-6: ", ";\n  \n      --font-size-altHeader-3: ", ";\n      --font-weight-altHeader-3: ", ";\n      --letter-spacing-altHeader-3: ", ";\n      --line-height-altHeader-3: ", ";\n  \n      --font-size-altHeader-4: ", ";\n      --font-weight-altHeader-4: ", ";\n      --letter-spacing-altHeader-4: ", ";\n      --line-height-altHeader-4: ", ";\n  \n      --font-size-altHeader-5: ", ";\n      --font-weight-altHeader-5: ", ";\n      --letter-spacing-altHeader-5: ", ";\n      --line-height-altHeader-5: ", ";\n  \n      --font-size-altHeader-6: ", ";\n      --font-weight-altHeader-6: ", ";\n      --letter-spacing-altHeader-6: ", ";\n      --line-height-altHeader-6: ", ";\n  \n      --font-size-overline-1: ", ";\n      --font-weight-overline-1: ", ";\n      --letter-spacing-overline-1: ", ";\n      --line-height-overline-1: ", ";\n  \n      --font-size-overline-2: ", ";\n      --font-weight-overline-2: ", ";\n      --letter-spacing-overline-2: ", ";\n      --line-height-overline-2: ", ";\n  \n      --font-size-body-1: ", ";\n      --font-weight-body-1: ", ";\n      --letter-spacing-body-1: ", ";\n      --line-height-body-1: ", ";\n  \n      --font-size-body-2: ", ";\n      --font-weight-body-2: ", ";\n      --letter-spacing-body-2: ", ";\n      --line-height-body-2: ", ";\n  \n      --font-size-body-3: ", ";\n      --font-weight-body-3: ", ";\n      --letter-spacing-body-3: ", ";\n      --line-height-body-3: ", ";\n  \n      --font-size-subtitle-1: ", ";\n      --font-weight-subtitle-1: ", ";\n      --letter-spacing-subtitle-1: ", ";\n      --line-height-subtitle-1: ", ";\n      \n      --font-size-subtitle-2: ", ";\n      --font-weight-subtitle-2: ", ";\n      --letter-spacing-subtitle-2: ", ";\n      --line-height-subtitle-2: ", ";\n\n      --font-size-title-description: ", ";\n      --line-height-title-description: ", ";\n      --line-height-people-listing-gap: ", ";\n\n      --font-size-search: ", ";\n      --font-family-search: ", ";\n\n      --font-family-header: ", ";\n      --font-family-altHeader: ", ";\n      --font-family-body: ", ";\n      --font-family-body-italics: ", ";\n      --font-family-buttons: ", ";\n      --font-family-overline: ", ";\n      --font-family-subtitle: ", ";\n      --font-family-people-listing-role: ", ";\n      --font-family-people-listing-name: ", ";\n  \n      --font-feature-settings-header: ", ";\n      --font-feature-settings-altHeader: ", ";\n      --font-feature-settings-overline: ", ";\n      --font-feature-settings-subtitle: ", ";\n      --font-feature-settings-body: ", ";\n      --font-feature-settings-navigation: ", ";\n  \n      --text-transform-header: ", ";\n      --text-transform-altHeader: ", ";\n      --text-transform-body: ", ";\n      --text-transform-overline: ", ";\n      --text-transform-subtitle: ", ";\n  \n      --word-break-header: ", ";\n      --word-break-altHeader: ", ";\n      --word-break-body: ", ";\n      --word-break-overline: ", ";\n      --word-break-subtitle: ", ";\n  \n      --grid-template-columns: calc(", " - ", ") repeat(12, minmax(0, 1fr)) calc(", " - ", ");\n      --grid-column-gap: ", ";\n      --grid-margin: ", ";\n\n      --footer-height: ", ";\n      --footer-padding-top: ", ";\n      --footer-padding-bottom: ", ";\n      --footer-items-gap: ", ";\n      --footer-media-gap: ", ";\n      --footer-media-icon-width: ", ";\n      --footer-media-icon-height: ", ";\n      --footer-vertical-spacing-lg: ", ";\n      --footer-vertical-spacing-sm: ", ";\n\n      --anchor-tabs-height: 60px;\n      --rotator-button-width: ", ";\n      --rotator-button-icon-width: ", ";\n    }\n\n    @media ", " {\n      --grid-template-columns: calc(", " - ", ") repeat(12, minmax(0, 1fr)) calc(", " - ", ");\n      --grid-column-gap: ", ";\n      --grid-margin: ", ";\n      --rotator-button-width: ", ";\n      --rotator-button-icon-width: ", ";\n\n      --font-size-header-6: ", ";\n\n      --font-size-altHeader-4: ", ";\n\n      --font-size-body-1: ", ";\n\n      --footer-padding-top: ", ";\n      --footer-padding-bottom: ", ";\n    }\n\n    @media ", " {\n      \n    }\n\n    @media ", " {\n      \n    }\n  }\n"])), function (_ref) {
+var _templateObject$1q;
+var GlobalStyles = /*#__PURE__*/styled.createGlobalStyle(_templateObject$1q || (_templateObject$1q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  html {\n    --base-color-primary: ", ";\n    --base-color-core: ", ";\n    --base-color-stream: ", ";\n    --base-color-cinema: ", ";\n    --base-color-white: ", ";\n    --base-color-black: ", ";\n    --base-color-dark-grey: ", ";\n    --base-color-mid-grey: ", ";\n    --base-color-light-grey: ", ";\n    --error-color-state: ", ";\n    --medium-color-state: ", ";\n    --good-color-state: ", ";\n    --base-color-darkgrey: ", ";\n    --base-color-midgrey: ", ";\n    --base-color-lightgrey: ", ";\n    --base-color-transparent: transparent;\n    --base-color-errorstate: ", ";\n    --base-color-mediumstate: ", ";\n    --base-color-goodstate: ", ";\n    --base-color-progress: ", ";\n    --base-color-navigation: ", ";\n    --base-color-lapislazuli: ", ";\n    --base-color-lemonchiffon: ", ";\n\n    --button-height: ", ";\n    --button-line-height: ", ";\n    --button-padding-x: ", ";\n    --button-padding-y: ", ";\n    --button-padding-y-icon: ", ";\n    --button-icon-margin: ", ";\n    --button-icon-width: ", ";\n    --button-icon-height: ", ";\n    --button-font-size: ", ";\n    --button-font-weight: ", ";\n\n    --font-size-header-1: ", ";\n    --font-weight-header-1: ", ";\n    --letter-spacing-header-1: ", ";\n    --line-height-header-1: ", ";\n    --margin-header-1: ", ";\n\n    --font-size-header-2: ", ";\n    --font-weight-header-2: ", ";\n    --letter-spacing-header-2: ", ";\n    --line-height-header-2: ", ";\n    --margin-header-2: ", ";\n\n    --font-size-header-3: ", ";\n    --font-weight-header-3: ", ";\n    --letter-spacing-header-3: ", ";\n    --line-height-header-3: ", ";\n    --margin-header-3: ", ";\n\n    --font-size-header-4: ", ";\n    --font-weight-header-4: ", ";\n    --letter-spacing-header-4: ", ";\n    --line-height-header-4: ", ";\n    --margin-header-4: ", ";\n\n    --font-size-header-5: ", ";\n    --font-weight-header-5: ", ";\n    --letter-spacing-header-5: ", ";\n    --line-height-header-5: ", ";\n    --margin-header-5: ", ";\n\n    --font-size-header-6: ", ";\n    --font-weight-header-6: ", ";\n    --letter-spacing-header-6: ", ";\n    --line-height-header-6: ", ";\n    --margin-header-6: ", ";\n\n    --font-size-altHeader-3: ", ";\n    --font-weight-altHeader-3: ", ";\n    --letter-spacing-altHeader-3: ", ";\n    --line-height-altHeader-3: ", ";\n\n    --font-size-altHeader-4: ", ";\n    --font-weight-altHeader-4: ", ";\n    --letter-spacing-altHeader-4: ", ";\n    --line-height-altHeader-4: ", ";\n\n    --font-size-altHeader-5: ", ";\n    --font-weight-altHeader-5: ", ";\n    --letter-spacing-altHeader-5: ", ";\n    --line-height-altHeader-5: ", ";\n\n    --font-size-altHeader-6: ", ";\n    --font-weight-altHeader-6: ", ";\n    --letter-spacing-altHeader-6: ", ";\n    --line-height-altHeader-6: ", ";\n\n    --font-size-overline-1: ", ";\n    --font-weight-overline-1: ", ";\n    --letter-spacing-overline-1: ", ";\n    --line-height-overline-1: ", ";\n\n    --font-size-overline-2: ", ";\n    --font-weight-overline-2: ", ";\n    --letter-spacing-overline-2: ", ";\n    --line-height-overline-2: ", ";\n\n    --font-size-overline-3: ", ";\n    --font-weight-overline-3: ", ";\n    --letter-spacing-overline-3: ", ";\n    --line-height-overline-3: ", "; \n\n    --font-size-overline-4: ", ";\n    --font-weight-overline-4: ", ";\n    --letter-spacing-overline-4: ", ";\n    --line-height-overline-4: ", ";\n\n    --font-size-body-1: ", ";\n    --font-weight-body-1: ", ";\n    --letter-spacing-body-1: ", ";\n    --line-height-body-1: ", ";\n\n    --font-size-body-2: ", ";\n    --font-weight-body-2: ", ";\n    --letter-spacing-body-2: ", ";\n    --line-height-body-2: ", ";\n\n    --font-size-body-3: ", ";\n    --font-weight-body-3: ", ";\n    --letter-spacing-body-3: ", ";\n    --line-height-body-3: ", ";\n\n    --font-size-subtitle-1: ", ";\n    --font-weight-subtitle-1: ", ";\n    --letter-spacing-subtitle-1: ", ";\n    --line-height-subtitle-1: ", ";\n    \n    --font-size-subtitle-2: ", ";\n    --font-weight-subtitle-2: ", ";\n    --letter-spacing-subtitle-2: ", ";\n    --line-height-subtitle-2: ", ";\n\n    --font-size-title-description: ", ";\n    --line-height-title-description: ", ";\n    --line-height-listing: ", ";\n    --font-size-individual-listing-name: ", ";\n    --line-height-individual-listing-name: ", ";\n    --line-height-people-listing-gap: ", ";\n\n    --font-family-header: ", ";\n    --font-family-altHeader: ", ";\n    --font-family-body: ", ";\n    --font-family-body-italics: ", ";\n    --font-family-buttons: ", ";\n    --font-family-overline: ", ";\n    --font-family-subtitle: ", ";\n    --font-family-people-listing-role: ", ";\n    --font-family-people-listing-name: ", ";\n\n    --font-feature-settings-header: ", ";\n    --font-feature-settings-altHeader: ", ";\n    --font-feature-settings-overline: ", ";\n    --font-feature-settings-subtitle: ", ";\n    --font-feature-settings-body: ", ";\n    --font-feature-settings-navigation: ", ";\n\n    --text-transform-header: ", ";\n    --text-transform-altHeader: ", ";\n    --text-transform-body: ", ";\n    --text-transform-overline: ", ";\n    --text-transform-subtitle: ", ";\n\n    --word-break-header: ", ";\n    --word-break-altHeader: ", ";\n    --word-break-body: ", ";\n    --word-break-overline: ", ";\n    --word-break-subtitle: ", ";\n\n    --font-family-navigation: ", ";\n    --font-size-navigation: ", ";\n    --font-weight-navigation: ", ";\n    --line-height-navigation: ", ";\n    --text-transform-navigation: ", ";\n    --letter-spacing-navigation: ", ";\n\n    --navigation-small-gap: ", ";\n    --navigation-middle-gap: ", ";\n    --navigation-large-gap: ", ";\n    --navigation-xlarge-gap: ", ";\n    --navigation-large-margin: ", ";\n\n    --rotator-button-width: ", ";\n    --rotator-button-icon-width: ", ";\n\n    --font-size-search: ", ";\n    --font-family-search: ", ";\n\n    --grid-margin: ", ";\n    --grid-outer-margin: ", ";\n    --grid-template-columns: calc(", " - ", ") calc(", " - ", " - ", ") repeat(12, minmax(0,1fr)) calc(", " - ", " - ", ") calc(", " - ", ");\n    --grid-column-gap: ", ";\n    --grid-margin: 0;\n\n    --footer-height: ", ";\n    --footer-padding-top: ", ";\n    --footer-padding-bottom: ", ";\n    --footer-items-gap: ", ";\n    --footer-media-gap: ", ";\n    --footer-media-icon-width: ", ";\n    --footer-media-icon-height: ", ";\n    --footer-vertical-spacing-lg: ", ";\n    --footer-vertical-spacing-sm: ", ";\n\n    --text-link-underline-offset: ", ";\n\n    --cards-spacing-stack: ", ";\n\n    --editorial-subtitle-margin-bottom: ", ";\n    --editorial-margin-between: ", ";\n    --editorial-spacing-hover: ", ";\n    --anchor-tabs-height: 70px;\n    \n    --harmonic-font-family-sans: 'Grey LL Bold', 'Roboto', sans-serif;\n    --harmonic-font-family-serif: 'Victor Serif Medium', 'Inria Serif Regular', serif;\n    --harmonic-text-link-underline-offset: 6px;\n    --harmonic-text-transform-navigation: capitalize;\n    --harmonic-font-size-navigation: 19px;\n\n    @media ", " {\n\n      --font-size-header-1: ", ";\n      --font-weight-header-1: ", ";\n      --letter-spacing-header-1: ", ";\n      --line-height-header-1: ", ";\n  \n      --font-size-header-2: ", ";\n      --font-weight-header-2: ", ";\n      --letter-spacing-header-2: ", ";\n      --line-height-header-2: ", ";\n  \n      --font-size-header-3: ", ";\n      --font-weight-header-3: ", ";\n      --letter-spacing-header-3: ", ";\n      --line-height-header-3: ", ";\n  \n      --font-size-header-4: ", ";\n      --font-weight-header-4: ", ";\n      --letter-spacing-header-4: ", ";\n      --line-height-header-4: ", ";\n  \n      --font-size-header-5: ", ";\n      --font-weight-header-5: ", ";\n      --letter-spacing-header-5: ", ";\n      --line-height-header-5: ", ";\n  \n      --font-size-header-6: ", ";\n      --font-weight-header-6: ", ";\n      --letter-spacing-header-6: ", ";\n      --line-height-header-6: ", ";\n  \n      --font-size-altHeader-3: ", ";\n      --font-weight-altHeader-3: ", ";\n      --letter-spacing-altHeader-3: ", ";\n      --line-height-altHeader-3: ", ";\n  \n      --font-size-altHeader-4: ", ";\n      --font-weight-altHeader-4: ", ";\n      --letter-spacing-altHeader-4: ", ";\n      --line-height-altHeader-4: ", ";\n  \n      --font-size-altHeader-5: ", ";\n      --font-weight-altHeader-5: ", ";\n      --letter-spacing-altHeader-5: ", ";\n      --line-height-altHeader-5: ", ";\n  \n      --font-size-altHeader-6: ", ";\n      --font-weight-altHeader-6: ", ";\n      --letter-spacing-altHeader-6: ", ";\n      --line-height-altHeader-6: ", ";\n  \n      --font-size-overline-1: ", ";\n      --font-weight-overline-1: ", ";\n      --letter-spacing-overline-1: ", ";\n      --line-height-overline-1: ", ";\n  \n      --font-size-overline-2: ", ";\n      --font-weight-overline-2: ", ";\n      --letter-spacing-overline-2: ", ";\n      --line-height-overline-2: ", ";\n  \n      --font-size-body-1: ", ";\n      --font-weight-body-1: ", ";\n      --letter-spacing-body-1: ", ";\n      --line-height-body-1: ", ";\n  \n      --font-size-body-2: ", ";\n      --font-weight-body-2: ", ";\n      --letter-spacing-body-2: ", ";\n      --line-height-body-2: ", ";\n  \n      --font-size-body-3: ", ";\n      --font-weight-body-3: ", ";\n      --letter-spacing-body-3: ", ";\n      --line-height-body-3: ", ";\n  \n      --font-size-subtitle-1: ", ";\n      --font-weight-subtitle-1: ", ";\n      --letter-spacing-subtitle-1: ", ";\n      --line-height-subtitle-1: ", ";\n      \n      --font-size-subtitle-2: ", ";\n      --font-weight-subtitle-2: ", ";\n      --letter-spacing-subtitle-2: ", ";\n      --line-height-subtitle-2: ", ";\n\n      --font-size-title-description: ", ";\n      --line-height-title-description: ", ";\n      --line-height-people-listing-gap: ", ";\n\n      --font-size-search: ", ";\n      --font-family-search: ", ";\n\n      --font-family-header: ", ";\n      --font-family-altHeader: ", ";\n      --font-family-body: ", ";\n      --font-family-body-italics: ", ";\n      --font-family-buttons: ", ";\n      --font-family-overline: ", ";\n      --font-family-subtitle: ", ";\n      --font-family-people-listing-role: ", ";\n      --font-family-people-listing-name: ", ";\n  \n      --font-feature-settings-header: ", ";\n      --font-feature-settings-altHeader: ", ";\n      --font-feature-settings-overline: ", ";\n      --font-feature-settings-subtitle: ", ";\n      --font-feature-settings-body: ", ";\n      --font-feature-settings-navigation: ", ";\n  \n      --text-transform-header: ", ";\n      --text-transform-altHeader: ", ";\n      --text-transform-body: ", ";\n      --text-transform-overline: ", ";\n      --text-transform-subtitle: ", ";\n  \n      --word-break-header: ", ";\n      --word-break-altHeader: ", ";\n      --word-break-body: ", ";\n      --word-break-overline: ", ";\n      --word-break-subtitle: ", ";\n  \n      --grid-template-columns: calc(", " - ", ") repeat(12, minmax(0, 1fr)) calc(", " - ", ");\n      --grid-column-gap: ", ";\n      --grid-margin: ", ";\n\n      --footer-height: ", ";\n      --footer-padding-top: ", ";\n      --footer-padding-bottom: ", ";\n      --footer-items-gap: ", ";\n      --footer-media-gap: ", ";\n      --footer-media-icon-width: ", ";\n      --footer-media-icon-height: ", ";\n      --footer-vertical-spacing-lg: ", ";\n      --footer-vertical-spacing-sm: ", ";\n\n      --anchor-tabs-height: 60px;\n      --rotator-button-width: ", ";\n      --rotator-button-icon-width: ", ";\n    }\n\n    @media ", " {\n      --grid-template-columns: calc(", " - ", ") repeat(12, minmax(0, 1fr)) calc(", " - ", ");\n      --grid-column-gap: ", ";\n      --grid-margin: ", ";\n      --rotator-button-width: ", ";\n      --rotator-button-icon-width: ", ";\n\n      --font-size-header-6: ", ";\n\n      --font-size-altHeader-4: ", ";\n\n      --font-size-body-1: ", ";\n\n      --footer-padding-top: ", ";\n      --footer-padding-bottom: ", ";\n    }\n\n    @media ", " {\n      \n    }\n\n    @media ", " {\n      \n    }\n  }\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.colors.primary;
 }, function (_ref2) {
@@ -13734,6 +13732,13 @@ var GlobalStyles = /*#__PURE__*/styled.createGlobalStyle(_templateObject$1r || (
   return theme.footer.tablet.paddingBottom;
 }, devices.desktop, devices.largeDesktop);
 
+/* ~~~~~~~ new harmonic types ~~~~~~~ */
+var HarmonicSize = {
+  Small: 'small',
+  Medium: 'medium',
+  Large: 'large'
+};
+
 exports.Accordion = Accordion;
 exports.Accordions = Accordions;
 exports.AltHeader = AltHeader;
@@ -13742,7 +13747,6 @@ exports.AnchorTabBar = AnchorTabBar;
 exports.AnnouncementBanner = AnnouncementBanner;
 exports.AuxiliaryButton = AuxiliaryButton;
 exports.AuxiliaryNav = AuxiliaryNav;
-exports.BodyContent = BodyContent;
 exports.BodyCopyHarmonic = BodyCopyHarmonic;
 exports.BodyText = BodyText;
 exports.ButtonText = ButtonText;
@@ -13783,7 +13787,6 @@ exports.NavigationText = NavigationText;
 exports.Overline = Overline;
 exports.PageHeading = PageHeading;
 exports.PageHeadingCompact = PageHeadingCompact;
-exports.PageHeadingHighlight = PageHeadingHighlight;
 exports.PageHeadingImpact = PageHeadingImpact;
 exports.PageHeadingPanel = PageHeadingPanel;
 exports.PageHeadingPromo = PageHeadingPromo;
@@ -13825,6 +13828,7 @@ exports.TextArea = TextArea;
 exports.TextField = TextField;
 exports.TextFieldLegacy = TextFieldLegacy;
 exports.TextLink = TextLink;
+exports.TextOnly = TextOnly;
 exports.ThemeColor = ThemeColor;
 exports.ThemeProvider = Theme;
 exports.Tickbox = Tickbox;
@@ -13838,6 +13842,5 @@ exports.VideoControls = VideoControls;
 exports.VideoWithControls = VideoWithControls$1;
 exports.breakpoints = breakpoints;
 exports.devices = devices;
-exports.useHarmonicTheme = useHarmonicTheme;
 exports.zIndexes = zIndexes;
 //# sourceMappingURL=harmonic.cjs.development.js.map