@royaloperahouse/harmonic 0.9.3 → 0.10.0-a

package/dist/harmonic.cjs.development.js

@@ -59,274 +59,113 @@ function _objectWithoutPropertiesLoose(r, e) {
   }
   return t;
 }
-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
-          };
-        }
-        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;
-            }
+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;
           }
-          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
-            };
+        };
+      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));
+        }
+        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;
           }
-          "throw" === h.type && (o = 4, n.method = "throw", n.arg = h.arg);
         }
+        return {
+          value: t,
+          done: y
+        };
       };
-    }(r, n, new Context(o || [])), !0), a;
-  }
-  function s(t, r, e) {
-    try {
-      return {
-        type: "normal",
-        arg: t.call(r, e)
-      };
-    } catch (t) {
-      return {
-        type: "throw",
-        arg: t
-      };
-    }
+    }(r, o, i), !0), u;
   }
-  r.wrap = h;
-  var f = {};
+  var a = {};
   function Generator() {}
   function GeneratorFunction() {}
   function GeneratorFunctionPrototype() {}
-  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;
+  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;
   }
-  function Context(t) {
-    this.tryEntries = [[-1]], t.forEach(w, this), this.reset(!0);
-  }
-  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;
-  }), 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 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 () {
     return this;
-  }), c(v, "toString", function () {
+  }), _regeneratorDefine(u, "toString", function () {
     return "[object Generator]";
-  }), 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;
+  }), (_regenerator = function () {
+    return {
+      w: i,
+      m: f
     };
-  }, 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 _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);
 }
 function _taggedTemplateLiteralLoose(e, t) {
   return t || (t = e.slice(0)), e.raw = t, e;
@@ -364,9 +203,9 @@ var createClassNames = function createClassNames(baseClass, options, styles) {
   return classes.filter(Boolean).join(' ');
 };
 
-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 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 _excluded = ["children", "size", "color", "className", "bold"],
+var _excluded = ["children", "size", "color", "className", "bold", "tag"],
   _excluded2 = ["children", "size", "color", "className"];
 /* ~~~ Headers - size and hierarchy set separately ~~~ */
 var HarmonicHeader = function HarmonicHeader(_ref2) {
@@ -384,7 +223,7 @@ var HarmonicHeader = function HarmonicHeader(_ref2) {
     serif: serif,
     em: em,
     className: className
-  }, styles);
+  }, typographyStyles);
   return /*#__PURE__*/React__default.createElement(Tag, {
     className: classNames
   }, children);
@@ -400,7 +239,7 @@ var HarmonicSubtitle = function HarmonicSubtitle(_ref3) {
     size: size,
     color: color,
     className: className
-  }, styles);
+  }, typographyStyles);
   return /*#__PURE__*/React__default.createElement("p", {
     className: classNames
   }, children);
@@ -414,14 +253,16 @@ var BodyCopyHarmonic = function BodyCopyHarmonic(_ref4) {
     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
-  }, styles);
-  return /*#__PURE__*/React__default.createElement("p", Object.assign({
+  }, typographyStyles);
+  return /*#__PURE__*/React__default.createElement(Tag, Object.assign({
     className: classNames
   }, props), children);
 };
@@ -437,7 +278,7 @@ var HarmonicOverline = function HarmonicOverline(_ref5) {
     size: size,
     color: color,
     className: className
-  }, styles);
+  }, typographyStyles);
   return /*#__PURE__*/React__default.createElement("p", Object.assign({
     className: classNames
   }, props), children);
@@ -451,7 +292,7 @@ var ButtonText = function ButtonText(_ref6) {
   var classNames = createClassNames('buttontext', {
     color: color,
     className: className
-  }, styles);
+  }, typographyStyles);
   return /*#__PURE__*/React__default.createElement("span", {
     className: classNames
   }, children);
@@ -464,7 +305,7 @@ var Caption = function Caption(_ref7) {
   var classNames = createClassNames('captiontext', {
     color: color,
     className: className
-  }, styles);
+  }, typographyStyles);
   return /*#__PURE__*/React__default.createElement("p", {
     className: classNames
   }, children);
@@ -477,7 +318,7 @@ var NavigationText = function NavigationText(_ref8) {
   var classNames = createClassNames('navigationtext', {
     color: color,
     className: className
-  }, styles);
+  }, typographyStyles);
   return /*#__PURE__*/React__default.createElement("p", {
     className: classNames
   }, children);
@@ -3833,6 +3674,7 @@ 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) {
@@ -3863,8 +3705,9 @@ var Tab = function Tab(_ref) {
     tabIndex: 0,
     className: className
   }, /*#__PURE__*/React__default.createElement(TabText, {
-    color: color,
+    id: tabLinkId,
     trimText: trimText,
+    color: color,
     withTextInMobile: withTextInMobile,
     "aria-hidden": "true"
   }, title), withIcon !== 'none' && /*#__PURE__*/React__default.createElement(Icon, {
@@ -4728,45 +4571,43 @@ var VideoControls = function VideoControls(_ref2) {
       document.removeEventListener('fullscreenchange', handleFullscreenChange);
     };
   }, []);
-  var handleFullscreen = React.useCallback(/*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
+  var handleFullscreen = React.useCallback(/*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee() {
     var videoContainer;
-    return _regeneratorRuntime().wrap(function _callee$(_context) {
-      while (1) switch (_context.prev = _context.next) {
+    return _regenerator().w(function (_context) {
+      while (1) switch (_context.n) {
         case 0:
           videoContainer = document.querySelector("#" + videoContainerId);
           if (videoContainer != null && videoContainer.requestFullscreen) {
-            _context.next = 3;
+            _context.n = 1;
             break;
           }
-          return _context.abrupt("return");
-        case 3:
-          _context.next = 5;
+          return _context.a(2);
+        case 1:
+          _context.n = 2;
           return videoContainer.requestFullscreen();
-        case 5:
+        case 2:
           setIsFullscreen(true);
-        case 6:
-        case "end":
-          return _context.stop();
+        case 3:
+          return _context.a(2);
       }
     }, _callee);
   })), []);
-  var handleMinimise = React.useCallback(/*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee2() {
-    return _regeneratorRuntime().wrap(function _callee2$(_context2) {
-      while (1) switch (_context2.prev = _context2.next) {
+  var handleMinimise = React.useCallback(/*#__PURE__*/_asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee2() {
+    return _regenerator().w(function (_context2) {
+      while (1) switch (_context2.n) {
         case 0:
           if (document.fullscreenElement) {
-            _context2.next = 2;
+            _context2.n = 1;
             break;
           }
-          return _context2.abrupt("return");
-        case 2:
-          _context2.next = 4;
+          return _context2.a(2);
+        case 1:
+          _context2.n = 2;
           return document.exitFullscreen();
-        case 4:
+        case 2:
           setIsFullscreen(false);
-        case 5:
-        case "end":
-          return _context2.stop();
+        case 3:
+          return _context2.a(2);
       }
     }, _callee2);
   })), []);
@@ -5422,6 +5263,7 @@ 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),
@@ -5518,6 +5360,7 @@ 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,
@@ -5597,7 +5440,8 @@ var Account = function Account(_ref) {
     iconName: iconName,
     withOptionsInMobile: false,
     withIcon: "left",
-    className: className
+    className: className,
+    tabLinkId: "account-link"
   });
 };
 
@@ -6081,14 +5925,13 @@ var Navigation = function Navigation(_ref) {
   })))))));
 };
 
-var _templateObject$D, _templateObject2$t, _templateObject3$j, _templateObject4$f, _templateObject5$b, _templateObject6$8, _templateObject7$5;
-var FooterSection = /*#__PURE__*/styled__default.footer(_templateObject$D || (_templateObject$D = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  background-color: var(--color-base-black);\n  color: var(--color-base-white);\n  padding: 44px 50px;\n\n  @media ", " {\n    padding: 40px 32px;\n  }\n\n  @media ", " {\n    padding: 20px;\n  }\n"])), devices.tablet, devices.mobile);
-var FooterContainer = /*#__PURE__*/styled__default.div(_templateObject2$t || (_templateObject2$t = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: grid;\n  grid-template-columns: repeat(12, 1fr);\n  gap: 40px;\n  max-width: 1140px;\n  margin: 0 auto;\n\n  @media ", " {\n    gap: 24px;\n  }\n\n  @media ", " {\n    grid-template-columns: 1fr;\n    gap: 40px;\n  }\n"])), devices.tablet, devices.mobile);
-var PolicyLinksSection = /*#__PURE__*/styled__default.div(_templateObject3$j || (_templateObject3$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  grid-column: span 4;\n  display: flex;\n  flex-direction: column;\n  gap: 16px;\n\n  @media ", " {\n    gap: 20px;\n  }\n\n  @media ", " {\n    gap: 12px;\n    order: 2;\n  }\n"])), devices.tablet, devices.mobile);
-var SocialAndNewsletterSection = /*#__PURE__*/styled__default.div(_templateObject4$f || (_templateObject4$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  grid-column: span 4;\n  display: flex;\n  flex-direction: column;\n  justify-content: space-between;\n  gap: 20px;\n\n  @media ", " {\n    order: 1;\n    gap: 40px;\n  }\n"])), devices.mobile);
-var SectionWrapper = /*#__PURE__*/styled__default.div(_templateObject5$b || (_templateObject5$b = /*#__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.div(_templateObject6$8 || (_templateObject6$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  grid-column: span 4;\n  display: flex;\n  flex-direction: column;\n  justify-content: space-between;\n\n  img {\n    margin-bottom: 12px;\n  }\n\n  @media ", " {\n    order: 3;\n    gap: 24px;\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"])));
+var _templateObject$D, _templateObject2$t, _templateObject3$j, _templateObject4$f, _templateObject5$b, _templateObject6$8;
+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$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  img {\n    margin-bottom: 12px;\n  }\n\n  @media ", " {\n    gap: 24px;\n  }\n"])), devices.mobile);
+var TextLinkWrapper$2 = /*#__PURE__*/styled__default(TextLink)(_templateObject6$8 || (_templateObject6$8 = /*#__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"])));
 
 var _templateObject$E;
 var PolicyLinksTextLinkWrapper = /*#__PURE__*/styled__default(TextLink)(_templateObject$E || (_templateObject$E = /*#__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"])));
@@ -6125,8 +5968,9 @@ var Footer = function Footer(_ref) {
   return /*#__PURE__*/React__default.createElement(FooterSection, {
     className: className,
     "aria-label": "Footer",
-    role: "contentinfo"
-  }, /*#__PURE__*/React__default.createElement(FooterContainer, null, /*#__PURE__*/React__default.createElement(PolicyLinksSection, {
+    role: "contentinfo",
+    as: "footer"
+  }, /*#__PURE__*/React__default.createElement(PolicyLinksSection, {
     "data-testid": "policy-links"
   }, /*#__PURE__*/React__default.createElement(PolicyLinks, {
     items: policyLinks
@@ -6160,7 +6004,7 @@ var Footer = function Footer(_ref) {
   }, /*#__PURE__*/React__default.createElement(BodyCopyHarmonic, {
     size: isMobile ? 'medium' : 'small',
     color: "white"
-  }, additionalInfo)))));
+  }, additionalInfo))));
 };
 
 var _templateObject$F, _templateObject2$u, _templateObject3$k, _templateObject4$g, _templateObject5$c, _templateObject6$9;
@@ -6407,7 +6251,7 @@ var AnchorTabBar = function AnchorTabBar(_ref) {
   }))) : null)) : null))));
 };
 
-var _templateObject$G, _templateObject2$v, _templateObject3$l, _templateObject4$h, _templateObject6$a, _templateObject7$6, _templateObject8$3, _templateObject9$2, _templateObject0$2;
+var _templateObject$G, _templateObject2$v, _templateObject3$l, _templateObject4$h, _templateObject6$a, _templateObject7$5, _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';
@@ -6419,7 +6263,7 @@ var TitleCTAGridItem = /*#__PURE__*/styled__default.div(_templateObject3$l || (_
 }, devices.tablet, 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 ButtonsMobileWrapper = /*#__PURE__*/styled__default.div(_templateObject7$5 || (_templateObject7$5 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: none;\n\n  @media ", " {\n    & {\n      display: block;\n    }\n  }\n"])), devices.mobile);
 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;
@@ -7036,11 +6880,11 @@ var Theme = function Theme(_ref) {
 };
 
 var _templateObject$I;
-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 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\n  p {\n    margin: 30px 0;\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"])));
 
+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 TextOnly = function TextOnly(_ref) {
   var _ref$text = _ref.text,
     text = _ref$text === void 0 ? '' : _ref$text,
@@ -7051,15 +6895,20 @@ var TextOnly = function TextOnly(_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;
-  return /*#__PURE__*/React__default.createElement(Grid, null, /*#__PURE__*/React__default.createElement(GridItem, {
+    columnSpanDevice = _ref$columnSpanDevice === void 0 ? 12 : _ref$columnSpanDevice,
+    className = _ref.className;
+  return /*#__PURE__*/React__default.createElement(Grid, {
+    className: className
+  }, /*#__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: text
+      __html: addTypographyClasses(text)
     }
   })));
 };
@@ -7078,7 +6927,7 @@ var TextOnly = function TextOnly(_ref) {
   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 _templateObject$J, _templateObject2$x, _templateObject3$n, _templateObject4$i, _templateObject5$d, _templateObject6$b, _templateObject7$6, _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) {
@@ -7094,7 +6943,7 @@ var ButtonContainer = /*#__PURE__*/styled__default.div(_templateObject4$i || (_t
 });
 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 PriceRow = /*#__PURE__*/styled__default.div(_templateObject7$6 || (_templateObject7$6 = /*#__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$4 || (_templateObject8$4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  text-decoration-line: line-through;\n  color: var(--base-color-darkgrey);\n"])));
 
 // Set max. character length
@@ -7447,7 +7296,7 @@ var getImageSlideStyles = function getImageSlideStyles(imageHeight) {
   return "height: calc(" + imageHeight + "px + var(--carousel-image-caption-height) + 12px);";
 };
 
-var _templateObject$N, _templateObject2$A, _templateObject3$p, _templateObject4$k, _templateObject5$e, _templateObject6$c, _templateObject7$8, _templateObject8$5;
+var _templateObject$N, _templateObject2$A, _templateObject3$p, _templateObject4$k, _templateObject5$e, _templateObject6$c, _templateObject7$7, _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    }";
@@ -7467,7 +7316,7 @@ var TitleWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject5$e || (_te
   return isDescriptionPresent && 'margin: 20px 0';
 });
 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 TitleGridItem = /*#__PURE__*/styled__default(GridItem)(_templateObject7$7 || (_templateObject7$7 = /*#__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' : '';
@@ -7923,14 +7772,14 @@ var Carousel = function Carousel(_ref) {
   }, children))));
 };
 
-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 _templateObject$P, _templateObject2$C, _templateObject3$q, _templateObject4$l, _templateObject5$f, _templateObject6$d, _templateObject7$8, _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$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 InfoTextWrapper = /*#__PURE__*/styled__default.div(_templateObject7$8 || (_templateObject7$8 = /*#__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$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);
@@ -8327,7 +8176,7 @@ var AnnouncementBanner = function AnnouncementBanner(_ref) {
   }))))));
 };
 
-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 _templateObject$U, _templateObject2$F, _templateObject3$t, _templateObject4$o, _templateObject5$i, _templateObject6$f, _templateObject7$9, _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;
@@ -8352,7 +8201,7 @@ var ContentContainer$2 = /*#__PURE__*/styled__default.div(_templateObject4$o ||
 });
 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 TextContainer$2 = /*#__PURE__*/styled__default.div(_templateObject7$9 || (_templateObject7$9 = /*#__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) {
@@ -8610,54 +8459,44 @@ var Cards = function Cards(_ref) {
   }));
 };
 
-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 _templateObject$W, _templateObject2$H, _templateObject3$u, _templateObject4$p, _templateObject5$j, _templateObject6$g, _templateObject7$a;
+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$p || (_templateObject4$p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: baseline;\n  gap: 3px;\n"])));
+var MobileSuffixWrapper = /*#__PURE__*/styled__default.div(_templateObject5$j || (_templateObject5$j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: none;\n\n  @media ", " {\n    display: block;\n  }\n"])), devices.mobile);
+var DesktopSuffixWrapper = /*#__PURE__*/styled__default.div(_templateObject6$g || (_templateObject6$g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: block;\n\n  @media ", " {\n    display: none;\n  }\n"])), devices.mobile);
+var DetailsWrapper = /*#__PURE__*/styled__default.div(_templateObject7$a || (_templateObject7$a = /*#__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 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 name = _ref.name,
+  var title = _ref.title,
+    titleSuffix = _ref.titleSuffix,
     description = _ref.description,
     email = _ref.email,
     phone = _ref.phone,
     website = _ref.website,
     address = _ref.address,
-    _ref$hideBottomBorder = _ref.hideBottomBorder,
-    hideBottomBorder = _ref$hideBottomBorder === void 0 ? false : _ref$hideBottomBorder,
-    _ref$hideTopBorder = _ref.hideTopBorder,
-    hideTopBorder = _ref$hideTopBorder === void 0 ? false : _ref$hideTopBorder;
+    className = _ref.className;
   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(Grid, null, /*#__PURE__*/React__default.createElement(GridItem, {
+  return /*#__PURE__*/React__default.createElement("div", {
+    className: className
+  }, /*#__PURE__*/React__default.createElement(Grid, null, /*#__PURE__*/React__default.createElement(GridItem, {
     columnStartDesktop: 3,
-    columnSpanDesktop: 8,
+    columnSpanDesktop: 12,
     columnStartDevice: 1,
     columnSpanDevice: 14
   }, /*#__PURE__*/React__default.createElement(Wrapper$4, {
-    "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
+    "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"
   }, descriptionText), hasDetails && (/*#__PURE__*/React__default.createElement(DetailsWrapper, {
     "data-testid": "contact-card-details-block"
   }, email && (/*#__PURE__*/React__default.createElement("a", {
@@ -8673,12 +8512,12 @@ var ContactCard = function ContactCard(_ref) {
     rel: "noreferrer"
   }, website)))), addressString && (/*#__PURE__*/React__default.createElement("div", {
     "data-testid": "contact-card-address-block"
-  }, /*#__PURE__*/React__default.createElement(AddressWrapperDesktop, null, /*#__PURE__*/React__default.createElement(BodyText, {
-    level: 1
-  }, addressString)), /*#__PURE__*/React__default.createElement(AddressWrapperMobile, null, divideAddressString(addressString))))))));
+  }, /*#__PURE__*/React__default.createElement(AddressWrapper, null, /*#__PURE__*/React__default.createElement(BodyCopyHarmonic, {
+    size: "large"
+  }, addressString)))))))));
 };
 
-var _templateObject$X, _templateObject2$I, _templateObject3$v, _templateObject4$q, _templateObject5$k, _templateObject6$g;
+var _templateObject$X, _templateObject2$I, _templateObject3$v, _templateObject4$q, _templateObject5$k, _templateObject6$h;
 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';
@@ -8688,7 +8527,7 @@ var ContentSummaryTextWrapper = /*#__PURE__*/styled__default.div(_templateObject
   return props.showImage ? 2 : '1 / span 4';
 }, devices.mobile);
 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) {
+var ContentSummaryBodyTextWrapper = /*#__PURE__*/styled__default.div(_templateObject6$h || (_templateObject6$h = /*#__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  ";
 });
 
@@ -9047,7 +8886,7 @@ var Information = function Information(_ref) {
   })))));
 };
 
-var _templateObject$$, _templateObject2$M, _templateObject3$z, _templateObject4$t, _templateObject5$m, _templateObject6$h, _templateObject7$b, _templateObject8$8;
+var _templateObject$$, _templateObject2$M, _templateObject3$z, _templateObject4$t, _templateObject5$m, _templateObject6$i, _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  ";
@@ -9057,7 +8896,7 @@ 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$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 TitleWrapper$3 = /*#__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);
@@ -9065,7 +8904,7 @@ var ChildrenWrapper = /*#__PURE__*/styled__default.div(_templateObject5$m || (_t
   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 TextWrapper = /*#__PURE__*/styled__default.div(_templateObject6$i || (_templateObject6$i = /*#__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$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  ";
@@ -9123,7 +8962,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$2, {
+  }, /*#__PURE__*/React__default.createElement(PageHeadingGrid, null, /*#__PURE__*/React__default.createElement(TitleWrapper$3, {
     "data-testid": "page-heading-title",
     isPageHeadingWithoutTitle: isTitleUnAvailable
   }, renderBadge(theme), children ? (/*#__PURE__*/React__default.createElement(ChildrenWrapper, {
@@ -9148,13 +8987,13 @@ var PageHeading = function PageHeading(_ref) {
   }, /*#__PURE__*/React__default.createElement(PrimaryButton, Object.assign({}, themedLink), linkText))) : null));
 };
 
-var _templateObject$10, _templateObject2$N, _templateObject3$A, _templateObject4$u, _templateObject5$n, _templateObject6$i, _templateObject7$c, _templateObject8$9;
+var _templateObject$10, _templateObject2$N, _templateObject3$A, _templateObject4$u, _templateObject5$n, _templateObject6$j, _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$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 TextWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject6$j || (_templateObject6$j = /*#__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$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);
 
@@ -9263,7 +9102,7 @@ var PageHeadingPanel = function PageHeadingPanel(_ref) {
   })))));
 };
 
-var _templateObject$12, _templateObject2$P, _templateObject3$C, _templateObject4$w, _templateObject5$p, _templateObject6$j, _templateObject7$d, _templateObject8$a, _templateObject9$5, _templateObject0$5, _templateObject1$3;
+var _templateObject$12, _templateObject2$P, _templateObject3$C, _templateObject4$w, _templateObject5$p, _templateObject6$k, _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);
@@ -9275,7 +9114,7 @@ var ContentSection = /*#__PURE__*/styled__default.div(_templateObject5$p || (_te
   var showBlock = _ref2.showBlock;
   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 BadgeWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject6$k || (_templateObject6$k = /*#__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$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';
@@ -9285,7 +9124,7 @@ var MainButtonWrapper = /*#__PURE__*/styled__default.div(_templateObject8$a || (
   return isAdditionalButtonPresent ? '20px' : '0';
 });
 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 TitleWrapper$4 = /*#__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) {
@@ -9439,7 +9278,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$3, {
+  }))))), title && (/*#__PURE__*/React__default.createElement(TitleWrapper$4, {
     theme: theme,
     isButtonPresent: !!mainLink || !!additionalLink
   }, /*#__PURE__*/React__default.createElement(HarmonicHeader, {
@@ -9457,7 +9296,7 @@ var PageHeadingPromo = function PageHeadingPromo(_ref) {
     theme: theme,
     badge: badge,
     isMobile: isMobile
-  }))), title && (/*#__PURE__*/React__default.createElement(TitleWrapper$3, {
+  }))), title && (/*#__PURE__*/React__default.createElement(TitleWrapper$4, {
     theme: theme,
     isButtonPresent: !!mainLink || !!additionalLink
   }, /*#__PURE__*/React__default.createElement(HarmonicHeader, {
@@ -9477,12 +9316,12 @@ var PageHeadingPromo = function PageHeadingPromo(_ref) {
   })))))))))));
 };
 
-var _templateObject$13, _templateObject2$Q, _templateObject3$D, _templateObject5$q, _templateObject6$k, _templateObject7$e, _templateObject8$b, _templateObject9$6, _templateObject0$6;
+var _templateObject$13, _templateObject2$Q, _templateObject3$D, _templateObject5$q, _templateObject6$l, _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 CompactHeaderCopyWrapper = /*#__PURE__*/styled__default(Grid)(_templateObject6$l || (_templateObject6$l = /*#__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;
   return invert ? theme.colors.white : theme.colors.primary;
@@ -9731,21 +9570,76 @@ var PageHeadingCompact = function PageHeadingCompact(_ref4) {
   }), linkText))))));
 };
 
-var _templateObject$14, _templateObject2$R, _templateObject3$E, _templateObject4$x, _templateObject5$r, _templateObject6$l, _templateObject7$f;
-// Keep MorePages for Table component until restyle
-var MorePages = /*#__PURE__*/styled__default.span(_templateObject$14 || (_templateObject$14 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  cursor: not-allowed;\n  pointer-events: none;\n"])));
-var PaginationLink = /*#__PURE__*/styled__default.a(_templateObject2$R || (_templateObject2$R = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  text-decoration: none;\n  color: inherit;\n"])));
-var PageNumberWrapper = /*#__PURE__*/styled__default.ol(_templateObject3$E || (_templateObject3$E = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  min-width: fit-content;\n  align-items: center;\n  justify-content: center;\n  margin-top: 40px;\n  margin-bottom: 40px;\n  flex-wrap: nowrap;\n  flex-direction: row;\n  list-style: none;\n  padding: 0;\n  max-width: fit-content;\n  margin: auto;\n  li {\n    margin-left: 24px;\n    color: var(--color-base-black);\n    display: flex;\n    align-items: center;\n  }\n  li:first-child {\n    margin-left: 0px;\n  }\n"])));
-var LastPageItem = /*#__PURE__*/styled__default.li(_templateObject4$x || (_templateObject4$x = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  && {\n    margin-left: 12px;\n  }\n"])));
-var PreviousPageItem = /*#__PURE__*/styled__default.li(_templateObject5$r || (_templateObject5$r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  && {\n    margin-left: 12px;\n  }\n"])));
-var TextLinkPagination = /*#__PURE__*/styled__default(BodyCopyHarmonic)(_templateObject6$l || (_templateObject6$l = /*#__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 _templateObject$14, _templateObject2$R, _templateObject3$E, _templateObject5$r, _templateObject6$m, _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$m || (_templateObject6$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  && {\n    margin-left: 12px;\n  }\n"])));
+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) {
   var active = _ref2.active;
   return "1px solid " + (active ? 'var(--color-primary-red)' : 'transparent');
 });
-var PageNav = /*#__PURE__*/styled__default.a(_templateObject7$f || (_templateObject7$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: inline-flex;\n  width: 25px;\n  align-items: center;\n  justify-content: center;\n  margin-left: 0;\n  span {\n    height: 1.5em;\n    svg > path {\n      fill: var(--color-base-black);\n    }\n  }\n"])));
+
+var NavButtonOrLink = function NavButtonOrLink(_ref) {
+  var page = _ref.page,
+    children = _ref.children,
+    onPageChange = _ref.onPageChange,
+    baseUrl = _ref.baseUrl,
+    keyProp = _ref.keyProp,
+    testId = _ref.testId,
+    ariaLabel = _ref.ariaLabel;
+  if (onPageChange) {
+    return /*#__PURE__*/React__default.createElement(PageNav, {
+      "aria-label": ariaLabel,
+      as: "button",
+      type: "button",
+      onClick: function onClick() {
+        return onPageChange(page);
+      },
+      key: keyProp,
+      "data-testid": testId
+    }, children);
+  }
+  return /*#__PURE__*/React__default.createElement(PageNav, {
+    "aria-label": ariaLabel,
+    href: "" + (baseUrl != null ? baseUrl : '') + page,
+    key: keyProp,
+    "data-testid": testId
+  }, children);
+};
+
+var PageLinkOrButton = function PageLinkOrButton(_ref) {
+  var page = _ref.page,
+    children = _ref.children,
+    onPageChange = _ref.onPageChange,
+    baseUrl = _ref.baseUrl,
+    keyProp = _ref.keyProp,
+    testId = _ref.testId,
+    ariaLabel = _ref.ariaLabel;
+  if (onPageChange) {
+    return /*#__PURE__*/React__default.createElement(PaginationLink, {
+      "aria-label": ariaLabel,
+      as: "button",
+      type: "button",
+      onClick: function onClick() {
+        return onPageChange(page);
+      },
+      key: keyProp,
+      "data-testid": testId
+    }, children);
+  }
+  return /*#__PURE__*/React__default.createElement(PaginationLink, {
+    "aria-label": ariaLabel,
+    href: "" + (baseUrl != null ? baseUrl : '') + page,
+    key: keyProp,
+    "data-testid": testId
+  }, children);
+};
 
 var reducePages = function reducePages(pages, currentPage) {
   // If there are less than 6 pages, return all pages
@@ -9767,33 +9661,42 @@ var Pagination = function Pagination(_ref) {
   var pageCount = _ref.pageCount,
     currentPage = _ref.currentPage,
     baseUrl = _ref.baseUrl,
-    className = _ref.className;
-  // Array of page numbers starting at 1
+    className = _ref.className,
+    onPageChange = _ref.onPageChange;
   var pageNumbers = Array.from(Array(pageCount + 1).keys()).slice(1);
   var reducedPageNumbers = reducePages(pageNumbers, currentPage);
   return /*#__PURE__*/React__default.createElement(PageNumberWrapper, {
     className: className
-  },
-  // {/* Left arrow only appears after page 1 */
-  currentPage > 1 && (/*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("li", null, /*#__PURE__*/React__default.createElement(PageNav, {
-    href: baseUrl + "1"
+  }, currentPage > 1 && (/*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("li", null, /*#__PURE__*/React__default.createElement(NavButtonOrLink, {
+    ariaLabel: "Backward arrow, skip to first page",
+    page: 1,
+    onPageChange: onPageChange,
+    baseUrl: baseUrl
   }, /*#__PURE__*/React__default.createElement(Icon, {
+    "aria-hidden": "true",
     iconName: "LastPageArrow",
     direction: "right"
   }))), /*#__PURE__*/React__default.createElement(PreviousPageItem, {
     key: "previous-page",
     "data-testid": "left-arrow"
-  }, /*#__PURE__*/React__default.createElement(PageNav, {
-    href: "" + baseUrl + (currentPage - 1)
+  }, /*#__PURE__*/React__default.createElement(NavButtonOrLink, {
+    ariaLabel: "Backward arrow, skip one page back",
+    page: currentPage - 1,
+    onPageChange: onPageChange,
+    baseUrl: baseUrl
   }, /*#__PURE__*/React__default.createElement(Icon, {
+    "aria-hidden": "true",
     iconName: "ArrowPagination",
     direction: "right"
   }))))), reducedPageNumbers.map(function (page) {
     return /*#__PURE__*/React__default.createElement("li", {
       key: page
-    }, /*#__PURE__*/React__default.createElement(PaginationLink, {
-      href: "" + baseUrl + page,
-      "data-testid": "page-number"
+    }, /*#__PURE__*/React__default.createElement(PageLinkOrButton, {
+      ariaLabel: "Page " + page + ", " + (page === currentPage ? 'it is a current page' : "skip to page " + page),
+      page: page,
+      onPageChange: onPageChange,
+      baseUrl: baseUrl,
+      testId: "page-number"
     }, /*#__PURE__*/React__default.createElement(TextLinkPagination, {
       size: "large",
       active: page === currentPage
@@ -9801,26 +9704,34 @@ var Pagination = function Pagination(_ref) {
   }), currentPage < pageCount && (/*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("li", {
     key: "next-page",
     "data-testid": "right-arrow"
-  }, /*#__PURE__*/React__default.createElement(PageNav, {
-    href: "" + baseUrl + (currentPage + 1)
+  }, /*#__PURE__*/React__default.createElement(NavButtonOrLink, {
+    ariaLabel: "Forward arrow, skip one page forward",
+    page: currentPage + 1,
+    onPageChange: onPageChange,
+    baseUrl: baseUrl
   }, /*#__PURE__*/React__default.createElement(Icon, {
+    "aria-hidden": "true",
     iconName: "ArrowPagination",
     direction: "left"
-  }))), /*#__PURE__*/React__default.createElement(LastPageItem, null, /*#__PURE__*/React__default.createElement(PageNav, {
-    href: "" + baseUrl + pageCount
+  }))), /*#__PURE__*/React__default.createElement(LastPageItem, null, /*#__PURE__*/React__default.createElement(NavButtonOrLink, {
+    ariaLabel: "Forward arrow, skip to last page",
+    page: pageCount,
+    onPageChange: onPageChange,
+    baseUrl: baseUrl
   }, /*#__PURE__*/React__default.createElement(Icon, {
+    "aria-hidden": "true",
     iconName: "LastPageArrow",
     direction: "left"
   }))))));
 };
 
-var _templateObject$15, _templateObject2$S, _templateObject3$F, _templateObject4$y, _templateObject5$s, _templateObject6$m, _templateObject7$g;
+var _templateObject$15, _templateObject2$S, _templateObject3$F, _templateObject4$x, _templateObject5$s, _templateObject6$n, _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$y || (_templateObject4$y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: var(--base-color-dark-grey);\n  overflow-wrap: break-word;\n  margin-bottom: 4px;\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 PersonLink = /*#__PURE__*/styled__default.a(_templateObject6$n || (_templateObject6$n = /*#__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$g || (_templateObject7$g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: var(--base-color-dark-grey);\n"])));
 
 var Person = function Person(_ref) {
@@ -9878,14 +9789,14 @@ var PeopleListing = function PeopleListing(_ref) {
   }));
 };
 
-var _templateObject$16, _templateObject2$T, _templateObject3$G, _templateObject4$z;
+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$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$z || (_templateObject4$z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  color: var(--base-color-darkgrey);\n  overflow-wrap: break-word;\n  min-height: 1.5em;\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) {
@@ -10003,7 +9914,7 @@ var CreditListing = function CreditListing(_ref) {
   }, creditEntries);
 };
 
-var _templateObject$17, _templateObject2$U, _templateObject3$H, _templateObject4$A, _templateObject5$t, _templateObject6$n, _templateObject7$h, _templateObject8$c, _templateObject9$7, _templateObject0$7, _templateObject1$4, _templateObject10$3, _templateObject11$3, _templateObject12$3, _templateObject13$2, _templateObject14$1, _templateObject15$1, _templateObject16, _templateObject17, _templateObject18, _templateObject19;
+var _templateObject$17, _templateObject2$U, _templateObject3$H, _templateObject4$z, _templateObject5$t, _templateObject6$o, _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 . .'";
@@ -10022,7 +9933,7 @@ var PromoWithTagsGrid = /*#__PURE__*/styled__default(Grid)(_templateObject$17 ||
 });
 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$A || (_templateObject4$A = /*#__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 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) {
@@ -10050,9 +9961,9 @@ var PromoWithTagsTagWrapper = /*#__PURE__*/styled__default.div(_templateObject5$
   var marginBottom = _ref7.marginBottom;
   return marginBottom + "px";
 });
-var PromoWithTagsAdditionalText = /*#__PURE__*/styled__default(PromoWithTagsText)(_templateObject6$n || (_templateObject6$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin: 24px 0;\n"])));
+var PromoWithTagsAdditionalText = /*#__PURE__*/styled__default(PromoWithTagsText)(_templateObject6$o || (_templateObject6$o = /*#__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$c || (_templateObject8$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin-right: 24px;\n  margin-bottom: 20px;\n\n  &:last-child {\n    margin-right: 0;\n  }\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);
@@ -10255,7 +10166,7 @@ var PromoWithTags = function PromoWithTags(_ref) {
   }))));
 };
 
-var _templateObject$18, _templateObject2$V, _templateObject3$I, _templateObject4$B, _templateObject5$u, _templateObject6$o, _templateObject7$i;
+var _templateObject$18, _templateObject2$V, _templateObject3$I, _templateObject4$A, _templateObject5$u, _templateObject6$p, _templateObject7$i;
 var LENGTH_TEXT$2 = 28;
 var LENGTH_TEXT_TABLET$2 = 10;
 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) {
@@ -10273,9 +10184,9 @@ var PromoWithTitleContentWrapper = /*#__PURE__*/styled__default.div(_templateObj
   var imageToLeft = _ref4.imageToLeft;
   return imageToLeft ? 'right' : 'left';
 }, devices.mobile);
-var HarmonicHeaderWithWrapper = /*#__PURE__*/styled__default(HarmonicHeader)(_templateObject4$B || (_templateObject4$B = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  padding-bottom: 32px;\n\n  @media ", " {\n    padding-bottom: 24px;\n  }\n"])), devices.mobile);
+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 BodyCopyHarmonicWithWrapper$1 = /*#__PURE__*/styled__default(BodyCopyHarmonic)(_templateObject6$p || (_templateObject6$p = /*#__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,
@@ -10709,7 +10620,7 @@ var SectionTitle = function SectionTitle(_ref) {
   }, description)))));
 };
 
-var _templateObject$1e, _templateObject2$Y, _templateObject3$L, _templateObject4$C, _templateObject5$v, _templateObject6$p, _templateObject7$j, _templateObject8$d, _templateObject9$8, _templateObject0$8, _templateObject1$5;
+var _templateObject$1e, _templateObject2$Y, _templateObject3$L, _templateObject4$B, _templateObject5$v, _templateObject6$q, _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;
@@ -10725,7 +10636,7 @@ var borderStyles = /*#__PURE__*/styled.css(_templateObject2$Y || (_templateObjec
   return theme.colors.darkgrey;
 });
 var noMarginAndPaddingStyles = /*#__PURE__*/styled.css(_templateObject3$L || (_templateObject3$L = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin: 0;\n  padding: 0;\n"])));
-var listItemStyles = /*#__PURE__*/styled.css(_templateObject4$C || (_templateObject4$C = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  list-style: none;\n  user-select: none;\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 {
@@ -10734,9 +10645,9 @@ var ArrowIcon = /*#__PURE__*/styled__default(Icon).attrs(function (_ref5) {
     title: 'Select Arrow'
   };
 })(_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 Wrapper$6 = /*#__PURE__*/styled__default.div(_templateObject6$q || (_templateObject6$q = /*#__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$d || (_templateObject8$d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  z-index: 1;\n\n  ", "\n  ", "\n"])), noMarginAndPaddingStyles, borderStyles);
+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;
@@ -11090,7 +11001,7 @@ function Select(_ref3) {
   })))), /*#__PURE__*/React__default.createElement(ArrowIcon, null)));
 }
 
-var _templateObject$1f, _templateObject2$Z, _templateObject3$M, _templateObject4$D;
+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;
@@ -11114,7 +11025,7 @@ var TextLabel$4 = /*#__PURE__*/styled__default.div(_templateObject3$M || (_templ
   if (darkMode) return "var(--base-color-white)";
   return "var(--base-color-black)";
 });
-var ErrorLabel$5 = /*#__PURE__*/styled__default.div(_templateObject4$D || (_templateObject4$D = /*#__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)";
@@ -11304,13 +11215,13 @@ var Quote = function Quote(_ref) {
   }, attribution))));
 };
 
-var _templateObject$1i, _templateObject2$10, _templateObject3$O, _templateObject4$E, _templateObject5$w, _templateObject6$q;
+var _templateObject$1i, _templateObject2$10, _templateObject3$O, _templateObject4$D, _templateObject5$w, _templateObject6$r;
 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$O || (_templateObject3$O = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  border: 1px solid var(--base-color-white);\n"])));
-var ImageWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject4$E || (_templateObject4$E = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: relative;\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 TitleWrapper$5 = /*#__PURE__*/styled__default.div(_templateObject6$r || (_templateObject6$r = /*#__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,
@@ -11343,19 +11254,19 @@ 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$4, null, /*#__PURE__*/React__default.createElement(Overline, {
+  }, subtitle), /*#__PURE__*/React__default.createElement(TitleWrapper$5, null, /*#__PURE__*/React__default.createElement(Overline, {
     level: 2
   }, title)))));
 };
 
-var _templateObject$1j, _templateObject2$11, _templateObject3$P, _templateObject4$F, _templateObject5$x;
+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$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$F || (_templateObject4$F = /*#__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';
 });
@@ -11440,11 +11351,11 @@ var ReadMore = function ReadMore(_ref) {
   }, isFullTextOpen ? "" + hideText : "" + showMoreText))));
 };
 
-var _templateObject$1k, _templateObject2$12, _templateObject3$Q, _templateObject4$G, _templateObject5$y;
+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$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$G || (_templateObject4$G = /*#__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 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);
@@ -11604,19 +11515,19 @@ var AuxiliaryNav = function AuxiliaryNav(_ref6) {
   });
 };
 
-var _templateObject$1l, _templateObject2$13, _templateObject3$R, _templateObject4$H, _templateObject5$z, _templateObject6$r;
+var _templateObject$1l, _templateObject2$13, _templateObject3$R, _templateObject4$G, _templateObject5$z, _templateObject6$s;
 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$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$H || (_templateObject4$H = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  justify-content: space-between;\n  gap: 20px;\n"])));
+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 + ")";
 });
-var LabelText = /*#__PURE__*/styled__default.div(_templateObject6$r || (_templateObject6$r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin-top: 1px;\n  white-space: nowrap;\n  color: ", ";\n"])), function (_ref3) {
+var LabelText = /*#__PURE__*/styled__default.div(_templateObject6$s || (_templateObject6$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  margin-top: 1px;\n  white-space: nowrap;\n  color: ", ";\n"])), function (_ref3) {
   var color = _ref3.color;
   return "var(--base-color-" + color + ")";
 });
@@ -11698,28 +11609,19 @@ var PasswordStrength = function PasswordStrength(_ref) {
   }, strengthLabel))));
 };
 
-var _templateObject$1m, _templateObject2$14, _templateObject3$S, _templateObject4$I, _templateObject5$A, _templateObject6$s, _templateObject7$k, _templateObject8$e, _templateObject9$9, _templateObject0$9;
+var _templateObject$1m, _templateObject2$14, _templateObject3$S, _templateObject4$H, _templateObject5$A, _templateObject6$t, _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$8 = /*#__PURE__*/styled__default.div(_templateObject3$S || (_templateObject3$S = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  width: 100%;\n"])));
-var TableHeader = /*#__PURE__*/styled__default.th(_templateObject4$I || (_templateObject4$I = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  font-size: var(--font-size-subtitle-2);\n  font-family: var(--font-family-subtitle);\n  font-feature-settings: var(--font-feature-settings-subtitle);\n  font-weight: var(--font-weight-subtitle-2);\n  letter-spacing: var(--letter-spacing-subtitle-2);\n  line-height: var(--line-height-subtitle-2);\n  padding: 30px 30px 30px 0;\n  text-align: left;\n  text-transform: uppercase;\n  border-bottom: 1px solid;\n  border-top: 1px solid;\n  border-color: ", ";\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    padding: 20px 20px 20px 0;\n\n    &:last-child {\n      white-space: normal;\n    }\n  }\n"])), function (props) {
-  return "var(--base-color-" + props.lineColor + ")";
-}, function (props) {
+var TableHeader = /*#__PURE__*/styled__default.th(_templateObject4$H || (_templateObject4$H = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  padding: 12px;\n  text-align: left;\n  text-transform: uppercase;\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$A || (_templateObject5$A = /*#__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  padding: 30px 30px 30px 0;\n  text-align: left;\n  vertical-align: top;\n  border-bottom: 1px solid;\n  border-color: ", ";\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    padding: 20px 20px 20px 0;\n  }\n"])), function (props) {
-  return "var(--base-color-" + props.lineColor + ")";
-}, 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 Pagination$1 = /*#__PURE__*/styled__default.div(_templateObject6$s || (_templateObject6$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 40px 0;\n  flex-wrap: nowrap;\n  flex-direction: row;\n  list-style: none;\n  max-width: fit-content;\n  margin: auto;\n  li {\n    font-size: var(--font-size-subtitle-1);\n    font-weight: var(--font-weight-body-1);\n    line-height: var(--line-height-subtitle-1);\n    letter-spacing: var(--letter-spacing-subtitle-1);\n    margin-left: 16px;\n    color: var(--base-color-dark-grey);\n    display: flex;\n    align-items: center;\n    border-bottom: none;\n  }\n"])));
-var PageNumber = /*#__PURE__*/styled__default.button(_templateObject7$k || (_templateObject7$k = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  background: none;\n  border: none;\n  padding: 0;\n  font-size: inherit;\n  color: inherit;\n  cursor: pointer;\n  display: inline-block;\n  margin: 0;\n  border-bottom: 1px solid var(--base-color-transparent);\n  line-height: var(--base-line-height);\n  text-decoration: none;\n  font-family: var(--font-family-body-1);\n\n  :hover {\n    outline: none;\n    color: var(--base-color-core);\n    border-bottom: 1px solid var(--base-color-core);\n    svg > path {\n      fill: var(--base-color-core);\n    }\n  }\n\n  /* Active state */\n  ", "\n"])), function (_ref) {
-  var active = _ref.active;
-  return active === 'true' && "\n      color: var(--base-color-core);\n      border-bottom: 1px solid var(--base-color-core);\n    ";
-});
-var Next = /*#__PURE__*/styled__default.span(_templateObject8$e || (_templateObject8$e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: inline-flex;\n  width: 25px;\n  align-items: center;\n  justify-content: center;\n  margin-left: 0;\n  span {\n    height: 1.5em;\n    svg > path {\n      fill: var(--base-color-dark-grey);\n    }\n  }\n"])));
-var ScrollButtons = /*#__PURE__*/styled__default.div(_templateObject9$9 || (_templateObject9$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  justify-content: flex-end;\n  padding: 0 0 24px 0;\n\n  div:hover {\n    background-color: var(--base-color-light-grey);\n  }\n\n  > div > div {\n    background-color: var(--base-color-light-grey);\n  }\n\n  svg path {\n    fill: var(--base-color-black) !important;\n  }\n"])));
-var AriaDescription$2 = /*#__PURE__*/styled__default.span(_templateObject0$9 || (_templateObject0$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  position: absolute;\n  left: -9999px;\n  width: 1px;\n  height: 1px;\n  overflow: hidden;\n"])));
+var PaginationWrapper = /*#__PURE__*/styled__default(Pagination)(_templateObject6$t || (_templateObject6$t = /*#__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$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) {
@@ -11744,23 +11646,25 @@ var scrollTable = function scrollTable(tableRef, direction) {
 var Cell = function Cell(_ref) {
   var cell = _ref.cell,
     cellIndex = _ref.cellIndex,
-    columns = _ref.columns,
-    lineColor = _ref.lineColor;
+    columns = _ref.columns;
+  var isText = typeof cell === 'string' || typeof cell === 'number';
   return /*#__PURE__*/React__default.createElement(TableCell, {
     key: cellIndex,
     columns: columns,
-    role: "gridcell",
-    lineColor: lineColor
+    role: "gridcell"
+  }, isText ? (/*#__PURE__*/React__default.createElement(BodyCopyHarmonic, {
+    size: "large"
   }, /*#__PURE__*/React__default.createElement(Content, {
     content: cell
-  }));
+  }))) : (/*#__PURE__*/React__default.createElement(Content, {
+    content: cell
+  })));
 };
 
 var Row = function Row(_ref) {
   var row = _ref.row,
     rowIndex = _ref.rowIndex,
-    columns = _ref.columns,
-    lineColor = _ref.lineColor;
+    columns = _ref.columns;
   return /*#__PURE__*/React__default.createElement(React__default.Fragment, {
     key: rowIndex
   }, /*#__PURE__*/React__default.createElement("tr", null, row.map(function (cell, index) {
@@ -11768,9 +11672,40 @@ var Row = function Row(_ref) {
       key: index,
       cell: cell,
       cellIndex: index,
-      columns: columns,
-      lineColor: lineColor
+      columns: columns
+    });
+  })));
+};
+
+var DataCells = function DataCells(_ref) {
+  var currentRows = _ref.currentRows,
+    columns = _ref.columns;
+  return /*#__PURE__*/React__default.createElement("tbody", null, Array.isArray(currentRows) && currentRows.map(function (row, rowIndex) {
+    return /*#__PURE__*/React__default.createElement(Row, {
+      key: rowIndex,
+      row: row,
+      rowIndex: rowIndex,
+      columns: columns
     });
+  }));
+};
+
+var HeaderCells = function HeaderCells(_ref) {
+  var headings = _ref.headings,
+    columns = _ref.columns;
+  return /*#__PURE__*/React__default.createElement("thead", null, /*#__PURE__*/React__default.createElement("tr", {
+    role: "row"
+  }, headings == null ? void 0 : headings.map(function (heading, index) {
+    return /*#__PURE__*/React__default.createElement(TableHeader, {
+      key: index,
+      role: "columnheader",
+      scope: "col",
+      columns: columns
+    }, /*#__PURE__*/React__default.createElement(HarmonicSubtitle, {
+      size: "small"
+    }, /*#__PURE__*/React__default.createElement(Content, {
+      content: heading
+    })));
   })));
 };
 
@@ -11779,17 +11714,19 @@ var Table = function Table(_ref) {
   var columns = _ref.columns,
     headings = _ref.headings,
     children = _ref.children,
-    lineColors = _ref.lineColors,
     rowsPerPage = _ref.rowsPerPage,
     pagination = _ref.pagination,
-    description = _ref.description;
+    description = _ref.description,
+    className = _ref.className;
   var _useState = React.useState(0),
     currentPage = _useState[0],
     setCurrentPage = _useState[1];
   var _useState2 = React.useState(false),
     showScrollButtons = _useState2[0],
     setShowScrollButtons = _useState2[1];
-  var lineColor = lineColors != null ? lineColors : exports.Colors.Cinema;
+  var handlePageChange = function handlePageChange(page) {
+    setCurrentPage(page - 1);
+  };
   var tableRef = React.useRef(null);
   React.useLayoutEffect(function () {
     var horizontalScroll = function horizontalScroll() {
@@ -11803,14 +11740,8 @@ var Table = function Table(_ref) {
       return window.removeEventListener('resize', horizontalScroll);
     };
   }, []);
-  var totalRows = Array.isArray(children) ? children.length + 1 : 1;
+  var totalRows = Array.isArray(children) ? children.length : 1;
   var totalPages = pagination ? Math.ceil(totalRows / rowsPerPage) : 1;
-  var pageNumbers = Array.from({
-    length: totalPages
-  }, function (_, i) {
-    return i;
-  });
-  var reducedPageNumbers = reducePages(pageNumbers, currentPage);
   var currentRows;
   if (pagination) {
     if (Array.isArray(children)) {
@@ -11819,15 +11750,20 @@ var Table = function Table(_ref) {
       currentRows = [];
     }
   } else {
-    currentRows = children;
+    currentRows = Array.isArray(children) ? children : [];
   }
+  var headingsContent = Array.isArray(headings) ? headings.map(function (h) {
+    return h;
+  }) : [];
   var visibleRows;
   if (pagination) {
     visibleRows = Array.isArray(currentRows) ? currentRows.length + 1 : 0;
   } else {
     visibleRows = totalRows;
   }
-  return /*#__PURE__*/React__default.createElement(Wrapper$8, null, showScrollButtons && (/*#__PURE__*/React__default.createElement(ScrollButtons, null, /*#__PURE__*/React__default.createElement(RotatorButtons, {
+  return /*#__PURE__*/React__default.createElement(Wrapper$8, {
+    className: className
+  }, showScrollButtons && (/*#__PURE__*/React__default.createElement(ScrollButtons, null, /*#__PURE__*/React__default.createElement(RotatorButtons, {
     onClickPrev: function onClickPrev() {
       return scrollTable(tableRef, 'left');
     },
@@ -11842,67 +11778,22 @@ var Table = function Table(_ref) {
     "aria-colcount": columns
   }, /*#__PURE__*/React__default.createElement(AriaDescription$2, {
     id: "table-description"
-  }, description, " visible rows: ", visibleRows), /*#__PURE__*/React__default.createElement(TableContainer, null, /*#__PURE__*/React__default.createElement("thead", null, ' ', /*#__PURE__*/React__default.createElement("tr", {
-    role: "columnheader"
-  }, headings == null ? void 0 : headings.map(function (heading, index) {
-    return /*#__PURE__*/React__default.createElement(TableHeader, {
-      key: index,
-      role: "columnheader",
-      scope: "col",
-      columns: columns,
-      lineColor: lineColor
-    }, /*#__PURE__*/React__default.createElement(Content, {
-      content: heading
-    }));
-  }))), /*#__PURE__*/React__default.createElement("tbody", null, ' ', Array.isArray(currentRows) && currentRows.map(function (row, rowIndex) {
-    return /*#__PURE__*/React__default.createElement(Row, {
-      key: rowIndex,
-      row: row,
-      rowIndex: rowIndex,
-      columns: columns,
-      lineColor: lineColor
-    });
+  }, description, " visible rows: ", visibleRows), /*#__PURE__*/React__default.createElement(TableContainer, null, /*#__PURE__*/React__default.createElement(HeaderCells, {
+    headings: headingsContent,
+    columns: columns
+  }), /*#__PURE__*/React__default.createElement(DataCells, {
+    currentRows: currentRows,
+    columns: columns
   }))), pagination && totalPages > 1 && (/*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(AriaDescription$2, {
     id: "pagination-description"
-  }, "Table pagination: current page ", currentPage + 1, " of ", totalPages), /*#__PURE__*/React__default.createElement(Pagination$1, null, currentPage > 0 && (/*#__PURE__*/React__default.createElement("li", null, /*#__PURE__*/React__default.createElement(PageNumber, {
-    key: "previous-page",
-    onClick: function onClick() {
-      return setCurrentPage(currentPage - 1);
-    },
-    tabIndex: 0,
-    "aria-label": "Previous page"
-  }, /*#__PURE__*/React__default.createElement(Next, null, /*#__PURE__*/React__default.createElement(Icon, {
-    iconName: "DropdownArrow",
-    direction: "down"
-  }))))), currentPage > 2 && (/*#__PURE__*/React__default.createElement("li", null, /*#__PURE__*/React__default.createElement(PageNumber, {
-    key: "more-before"
-  }, /*#__PURE__*/React__default.createElement(MorePages, null, "...")))), reducedPageNumbers.map(function (number) {
-    return /*#__PURE__*/React__default.createElement("li", {
-      key: number
-    }, /*#__PURE__*/React__default.createElement(PageNumber, {
-      key: number,
-      onClick: function onClick() {
-        return setCurrentPage(number);
-      },
-      tabIndex: 0,
-      active: "" + (number === currentPage)
-    }, number + 1));
-  }), currentPage + 4 < totalPages && (/*#__PURE__*/React__default.createElement("li", null, /*#__PURE__*/React__default.createElement(PageNumber, {
-    key: "more-after"
-  }, /*#__PURE__*/React__default.createElement(MorePages, null, "...")))), currentPage < totalPages - 1 && (/*#__PURE__*/React__default.createElement("li", null, /*#__PURE__*/React__default.createElement(PageNumber, {
-    key: "next-page",
-    onClick: function onClick() {
-      return setCurrentPage(currentPage + 1);
-    },
-    tabIndex: 0,
-    "aria-label": "Next page"
-  }, /*#__PURE__*/React__default.createElement(Next, null, /*#__PURE__*/React__default.createElement(Icon, {
-    iconName: "DropdownArrow",
-    direction: "up"
-  }))))))))));
+  }, "Table pagination: current page ", currentPage + 1, " of ", totalPages), /*#__PURE__*/React__default.createElement(PaginationWrapper, {
+    currentPage: currentPage + 1,
+    pageCount: totalPages,
+    onPageChange: handlePageChange
+  }))));
 };
 
-var _templateObject$1n, _templateObject2$15, _templateObject3$T, _templateObject4$J, _templateObject5$B, _templateObject6$t, _templateObject7$l, _templateObject8$f, _templateObject9$a, _templateObject0$a, _templateObject1$6, _templateObject10$4, _templateObject11$4, _templateObject12$4, _templateObject13$3;
+var _templateObject$1n, _templateObject2$15, _templateObject3$T, _templateObject4$I, _templateObject5$B, _templateObject6$u, _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 + ")";
@@ -11912,13 +11803,13 @@ var Wrapper$9 = /*#__PURE__*/styled__default('div')(_templateObject$1n || (_temp
 });
 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$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$J || (_templateObject4$J = /*#__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 Error = /*#__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);
+var FormFooterWrapper = /*#__PURE__*/styled__default.div(_templateObject6$u || (_templateObject6$u = /*#__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$l || (_templateObject7$l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  text-align: left;\n  color: var(--color-base-errorstate);\n"])));
-var CTALinkWrapper = /*#__PURE__*/styled__default.a(_templateObject8$f || (_templateObject8$f = /*#__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$a || (_templateObject9$a = /*#__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 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) {
@@ -12094,18 +11985,18 @@ var SignUpForm = function SignUpForm(_ref) {
     };
   };
   var handleFormSubmit = /*#__PURE__*/function () {
-    var _ref2 = _asyncToGenerator(/*#__PURE__*/_regeneratorRuntime().mark(function _callee(e) {
+    var _ref2 = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee(e) {
       var formErrors, response;
-      return _regeneratorRuntime().wrap(function _callee$(_context) {
-        while (1) switch (_context.prev = _context.next) {
+      return _regenerator().w(function (_context) {
+        while (1) switch (_context.n) {
           case 0:
             e.preventDefault();
             if (!isSuccess) {
-              _context.next = 3;
+              _context.n = 1;
               break;
             }
-            return _context.abrupt("return");
-          case 3:
+            return _context.a(2);
+          case 1:
             formErrors = {};
             if (!isLoggedIn) {
               if (!formValues.firstName) {
@@ -12123,16 +12014,16 @@ var SignUpForm = function SignUpForm(_ref) {
               }
             }
             if (!(Object.keys(formErrors).length > 0)) {
-              _context.next = 8;
+              _context.n = 2;
               break;
             }
             setErrors(formErrors);
-            return _context.abrupt("return");
-          case 8:
-            _context.next = 10;
+            return _context.a(2);
+          case 2:
+            _context.n = 3;
             return submitHandler(isLoggedIn ? {} : formValues);
-          case 10:
-            response = _context.sent;
+          case 3:
+            response = _context.v;
             if (response.success) {
               setIsSuccess(true);
             } else {
@@ -12142,9 +12033,8 @@ var SignUpForm = function SignUpForm(_ref) {
                 });
               });
             }
-          case 12:
-          case "end":
-            return _context.stop();
+          case 4:
+            return _context.a(2);
         }
       }, _callee);
     }));
@@ -12326,10 +12216,13 @@ var SignUpFormComponent = function SignUpFormComponent(_ref) {
   }))))));
 };
 
-var _templateObject$1o, _templateObject3$U, _templateObject4$K;
-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\n  @media ", " {\n    min-height: 60px;\n  }\n"])), zIndexes.anchor, devices.mobile);
-var CloseButtonWrapper = /*#__PURE__*/styled__default.a(_templateObject3$U || (_templateObject3$U = /*#__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(_templateObject4$K || (_templateObject4$K = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n"])));
+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$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,
@@ -12337,7 +12230,9 @@ var AnchorBar = function AnchorBar(_ref) {
     onCloseHandler = _ref.onCloseHandler,
     _ref$showAnchorBar = _ref.showAnchorBar,
     showAnchorBar = _ref$showAnchorBar === void 0 ? true : _ref$showAnchorBar,
-    className = _ref.className;
+    className = _ref.className,
+    _ref$withShadow = _ref.withShadow,
+    withShadow = _ref$withShadow === void 0 ? false : _ref$withShadow;
   var _useState = React.useState(showAnchorBar),
     isRendered = _useState[0],
     setIsRendered = _useState[1];
@@ -12359,7 +12254,8 @@ var AnchorBar = function AnchorBar(_ref) {
     var _cta$href;
     return /*#__PURE__*/React__default.createElement(AnchorBarContainer, {
       "data-testid": "anchor-bar",
-      className: className
+      className: className,
+      withShadow: withShadow
     }, /*#__PURE__*/React__default.createElement(GridItem, {
       columnStartDesktop: 2,
       columnSpanDesktop: 14,
@@ -12641,9 +12537,9 @@ var HighlightsStream = function HighlightsStream(_ref) {
   })));
 };
 
-var _templateObject$1p, _templateObject3$V;
+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$V || (_templateObject3$V = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  justify-content: center;\n  flex-direction: column;\n  margin-left: 6px;\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;