@arc-ui/components 12.0.0-beta.22 → 12.0.0-beta.24

package/lib/index.mjs

@@ -1,6 +1,6 @@
 'use client';
 import * as React from 'react';
-import React__default, { createContext, useContext, useState, useEffect, useMemo, useId as useId$1, useRef, forwardRef, isValidElement, cloneElement, useCallback, useReducer, useLayoutEffect, createElement, Children, Fragment as Fragment$1, Suspense, useImperativeHandle } from 'react';
+import React__default, { createContext, useContext, useId as useId$1, useRef, useState, useEffect, forwardRef, isValidElement, cloneElement, useMemo, useCallback, useReducer, useLayoutEffect, createElement, Children, Fragment as Fragment$1, Suspense, useImperativeHandle } from 'react';
 import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
 import * as ReactDOM from 'react-dom';
 import ReactDOM__default, { flushSync, createPortal } from 'react-dom';
@@ -336,17 +336,6 @@ var AlignItem = function (_a) {
     return React__default.createElement("div", { className: "arc-Align-item" }, children);
 };
 
-/**
- * Do not edit directly
- * Generated on Fri, 15 Aug 2025 18:14:58 GMT
- */
-var ArcSizeBreakpointsXs = "320px";
-var ArcSizeBreakpointsS = "636px";
-var ArcSizeBreakpointsM = "768px";
-var ArcSizeBreakpointsL = "1024px";
-var ArcSizeBreakpointsXl = "1280px";
-var ArcSizeBreakpointsXxl = "1440px";
-
 var defaultContext$3 = { surface: "light" };
 var Context$3 = createContext(defaultContext$3);
 var Provider$5 = Context$3.Provider;
@@ -488,7 +477,9 @@ var Link = function (_a) {
     };
     var LinkElement = isButton ? "button" : href ? "a" : "span";
     return (React__default.createElement(LinkElement, __assign({}, elementProps[LinkElement], filterAttrs(props)),
-        React__default.createElement("div", { className: "arc-Link-wrapper" },
+        React__default.createElement("div", { className: classNames("arc-Link-wrapper", {
+                "arc-Link--isButton": isButton,
+            }) },
             React__default.createElement(VisuallyHidden$2, null,
                 screenReaderText || children,
                 isExternalLink && " (Opens in new window)"),
@@ -500,214 +491,32 @@ var Link = function (_a) {
                 isExternalLink && (React__default.createElement(ThemeIcon, { icon: "linkExternal", size: size === "s" ? 20 : 24 }))))));
 };
 
-/**
- * Use `Heading` to display heading text.
- */
-var Heading = function (_a) {
-    var _b;
-    var _c = _a.align, align = _c === void 0 ? "left" : _c, _d = _a.casing, casing = _d === void 0 ? "auto" : _d, _e = _a.color, color = _e === void 0 ? "auto" : _e, children = _a.children, level = _a.level, isInline = _a.isInline, _f = _a.fontStyle, fontStyle = _f === void 0 ? "default" : _f, _g = _a.isResponsive, isResponsive = _g === void 0 ? true : _g, size = _a.size, id = _a.id, props = __rest(_a, ["align", "casing", "color", "children", "level", "isInline", "fontStyle", "isResponsive", "size", "id"]);
-    var surface = useContext(Context$3).surface;
-    var Element = "span";
-    if (level) {
-        Element = "h".concat(level);
-    }
-    return (React__default.createElement(Element, __assign({ id: id, className: classNames(" arc-Heading arc-Heading--".concat(camelcase(fontStyle)), (_b = {
-                "arc-Heading--inline": isInline,
-                "arc-Heading--fixedSize": isResponsive === false
-            },
-            _b[suffixModifier("arc-Heading--align", align)] = align && align !== "left",
-            _b["arc-Heading--size".concat(size && size.toUpperCase())] = size,
-            _b["arc-Heading--casingNone"] = casing === "none",
-            _b["arc-Heading--colorBrand"] = color === "brand",
-            _b["arc-Heading--onDarkSurface"] = surface === "dark",
-            _b["arc-Heading--isInline"] = isInline,
-            _b)) }, filterAttrs(props)), children));
-};
-
-/**
- * Optionally define ariaDescribedBy if errorMessage or helper exist.
- */
-var useAriaDescribedby = function (_a) {
-    var id = _a.id, _b = _a.idError, idError = _b === void 0 ? "".concat(id, "-error") : _b, _c = _a.idHelper, idHelper = _c === void 0 ? "".concat(id, "-helper") : _c, _d = _a.idDisclosure, idDisclosure = _d === void 0 ? "".concat(id, "-disclosure") : _d, errorMessage = _a.errorMessage, helper = _a.helper, disclosureText = _a.disclosureText;
-    if (!id) {
-        return {
-            ariaDescribedby: undefined,
-            idHelper: undefined,
-            idError: undefined,
-            idDisclosure: undefined,
-        };
-    }
-    var ariaDescribedbyArr = [];
-    if (errorMessage) {
-        ariaDescribedbyArr.push(idError);
-    }
-    if (helper) {
-        ariaDescribedbyArr.push(idHelper);
-    }
-    if (disclosureText) {
-        ariaDescribedbyArr.push(idDisclosure);
-    }
-    var ariaDescribedby = ariaDescribedbyArr.length > 0 ? ariaDescribedbyArr.join(" ") : undefined;
-    return { ariaDescribedby: ariaDescribedby, idError: idError, idHelper: idHelper, idDisclosure: idDisclosure };
-};
-
-/**
- * Detect interaction mode
- */
-var useInteractionMode = function () {
-    var _a = useState("pointer"), interactionMode = _a[0], setInteractionMode = _a[1];
-    useEffect(function () {
-        var onKeyDown = function (event) {
-            if (event.altKey || event.ctrlKey || event.metaKey) {
-                return;
-            }
-            setInteractionMode("keyboard");
-        };
-        var onPointerDown = function () {
-            setInteractionMode("pointer");
-        };
-        if (typeof window !== "undefined") {
-            document.addEventListener("keydown", onKeyDown, true);
-            document.addEventListener("click", onPointerDown, true);
-        }
-        return function () {
-            if (typeof window !== "undefined") {
-                document.removeEventListener("keydown", onKeyDown);
-                document.removeEventListener("click", onPointerDown);
-            }
-        };
-    }, []);
-    return { interactionMode: interactionMode };
-};
-
-/**
- * Infer the correct inputMode, pattern and type if specifying a `number` type.
- */
-var useNumericInput = function (props) {
-    var type = props.type === "number" ? "text" : props.type;
-    var inputMode = props.inputMode;
-    if (!props.inputMode) {
-        if (props.type === "email") {
-            inputMode = "email";
-        }
-        else if (props.type === "number") {
-            inputMode = "numeric";
-        }
-        else if (props.type === "tel") {
-            inputMode = "tel";
-        }
-        else if (props.type === "url") {
-            inputMode = "url";
-        }
-    }
-    var pattern = props.pattern;
-    if (!props.pattern && props.type === "number") {
-        pattern = "[0-9]*";
-    }
-    return { inputMode: inputMode, pattern: pattern, type: type };
-};
-
-var usePagination = function (pageCount, selectedPage) {
-    var formatValues = function (range) {
-        return range.map(function (value) { return value.toString(); });
-    };
-    return useMemo(function () {
-        if (pageCount > 7 && selectedPage < 5) {
-            // show 1 - 5 the right dots are visible.
-            return formatValues(__spreadArray(__spreadArray([], Array.from({ length: 5 }, function (_value, index) { return index + 1; }), true), [
-                "...",
-                pageCount,
-            ], false));
-        }
-        if (pageCount > 7 && selectedPage >= pageCount - 3) {
-            // show numbers to the end but the left dots are visible
-            return formatValues(__spreadArray([
-                1,
-                "..."
-            ], Array.from({ length: 5 }, function (_value, index) { return pageCount - index; }).reverse(), true));
-        }
-        if (pageCount > 7 && selectedPage >= 5 && selectedPage < pageCount - 3) {
-            // show selected page with one number either side and both the left and the right dots are visible.
-            return formatValues([
-                1,
-                "...",
-                selectedPage - 1,
-                selectedPage,
-                selectedPage + 1,
-                "...",
-                pageCount,
-            ]);
-        }
-        // show all pages from pageCount
-        return formatValues(Array.from({ length: pageCount }, function (_value, index) { return index + 1; }));
-    }, [pageCount, selectedPage]);
-};
-
-var useThemeElement = function () {
-    var _a = useState(undefined), themeElement = _a[0], setElement = _a[1];
-    var setThemeElement = function (el) {
-        el &&
-            setElement(el.closest(".arc-ds-sys-theme") || undefined);
-    };
-    return [themeElement, setThemeElement];
-};
-
-var useUniqueString = function (value) {
-    var id = useId$1();
-    return "".concat(value, "-").concat(id);
-};
-
-/**
- * @typedef MediaQueryOutputs
- * @param {boolean} matches - does the document match the media query?
- */
-/**
- * Handle with care!
- *
- * If you need to change something in the browser based on @media query, you
- * probably don’t need this hook. Use CSS media queries instead.
- *
- * Sometimes UI requirements are not achievable with CSS media queries alone. In
- * these rare cases, use this hook to make media query matches available
- * to React JavaScript code.
- *
- * @param {string} mediaQuery - the media query to parse
- * @returns {MediaQueryOutputs}
- */
-var useMediaQuery = function (mediaQuery) {
-    var mediaQueryList = typeof window !== "undefined" ? window.matchMedia(mediaQuery) : undefined;
-    var _a = useState(false), matches = _a[0], setMatches = _a[1];
-    useEffect(function () {
-        setMatches(typeof window !== "undefined"
-            ? window.matchMedia(mediaQuery).matches
-            : false);
-    }, [mediaQuery]);
-    useEffect(function () {
-        var onMatchMedia = function (event) { return setMatches(event.matches); };
-        // Using deprecated addListener methods here for IE & Safari 13 support
-        if (mediaQueryList) {
-            mediaQueryList.addListener(onMatchMedia);
-        }
-        return function () { return mediaQueryList && mediaQueryList.removeListener(onMatchMedia); };
-    }, [mediaQueryList]);
-    return matches;
+var SemanticHeading = function (_a) {
+    var children = _a.children, level = _a.level, className = _a.className, props = __rest(_a, ["children", "level", "className"]);
+    return React__default.createElement(level ? "h".concat(level) : "span", __assign({ className: classNames("arc-SemanticHeading", className) }, props), children);
 };
 
 /** Use `Alert` to inform the user of important changes or actions. */
 var Alert = function (_a) {
-    var _b, _c;
-    var heading = _a.heading, headingLevel = _a.headingLevel, description = _a.description, links = _a.links, _d = _a.status, status = _d === void 0 ? "general" : _d, isDismissable = _a.isDismissable, onDismiss = _a.onDismiss, icon = _a.icon, _e = _a.isMeasured, isMeasured = _e === void 0 ? false : _e, _f = _a.autoFocusOnMount, autoFocusOnMount = _f === void 0 ? false : _f, props = __rest(_a, ["heading", "headingLevel", "description", "links", "status", "isDismissable", "onDismiss", "icon", "isMeasured", "autoFocusOnMount"]);
-    var _g = useState(false), isDismissed = _g[0], setIsDismissed = _g[1];
+    var _b;
+    var heading = _a.heading, headingLevel = _a.headingLevel, description = _a.description, links = _a.links, _c = _a.status, status = _c === void 0 ? "general" : _c, isDismissable = _a.isDismissable, onDismiss = _a.onDismiss, icon = _a.icon, _d = _a.isMeasured, isMeasured = _d === void 0 ? false : _d, _e = _a.autoFocusOnMount, autoFocusOnMount = _e === void 0 ? false : _e, _f = _a.role, role = _f === void 0 ? "alert" : _f, props = __rest(_a, ["heading", "headingLevel", "description", "links", "status", "isDismissable", "onDismiss", "icon", "isMeasured", "autoFocusOnMount", "role"]);
+    var headingId = useId$1();
+    var descriptionId = useId$1();
     var alertRef = useRef(null);
+    var _g = useState(false), isDismissed = _g[0], setIsDismissed = _g[1];
     useEffect(function () {
         var _a;
         autoFocusOnMount && ((_a = alertRef.current) === null || _a === void 0 ? void 0 : _a.focus());
     }, [autoFocusOnMount]);
-    var isMinWidthArcBreakpointM = useMediaQuery("(min-width: ".concat(ArcSizeBreakpointsM, ")"));
     var onDismissHandler = function () {
         setIsDismissed(true);
         onDismiss && onDismiss();
     };
+    var handleLinkClick = function (e, link) {
+        var _a;
+        e.preventDefault();
+        (_a = link.onClick) === null || _a === void 0 ? void 0 : _a.call(link, e);
+    };
     var statusIcons = {
         general: "alertGeneral",
         error: "alertError",
@@ -717,35 +526,31 @@ var Alert = function (_a) {
     if (isDismissed) {
         return null;
     }
-    return (React__default.createElement("div", __assign({ className: classNames("arc-Alert", (_b = {},
-            _b["arc-Alert--".concat(status)] = status !== "general",
-            _b)), role: "alert", tabIndex: -1, "aria-labelledby": "alertHeading", "aria-describedby": "alertDescription", ref: alertRef }, filterAttrs(props)),
-        React__default.createElement("div", { className: "arc-Alert-icon" }, icon ? (React__default.createElement(Icon$1, { size: 24, icon: icon })) : (React__default.createElement(ThemeIcon, { size: 24, icon: statusIcons[status] }))),
-        React__default.createElement("div", { className: "arc-Alert-content" },
-            React__default.createElement("div", { className: classNames("arc-Alert-heading", (_c = {},
-                    _c["arc-Alert-heading--isDismissable"] = isDismissable,
-                    _c)) },
-                React__default.createElement(Heading, { level: headingLevel, id: "alertHeading", size: isMinWidthArcBreakpointM ? "s" : "xs" },
+    return (React__default.createElement(Surface, { background: "light-brand-01", isTransparent: true },
+        React__default.createElement("div", __assign({ className: classNames("arc-Alert", (_b = {},
+                _b["arc-Alert--".concat(status)] = status !== "general",
+                _b)), role: role, tabIndex: -1, "aria-labelledby": headingId, "aria-describedby": descriptionId, ref: alertRef }, filterAttrs(props)),
+            isDismissable && (React__default.createElement("button", { "aria-label": "dismiss alert", className: "arc-Alert-dismiss", onClick: onDismissHandler, tabIndex: 0 },
+                React__default.createElement(ThemeIcon, { size: 24, icon: "alertDismiss" }))),
+            React__default.createElement("div", { className: "arc-Alert-icon" }, icon ? (React__default.createElement(Icon$1, { size: 24, icon: icon })) : (React__default.createElement(ThemeIcon, { size: 24, icon: statusIcons[status] }))),
+            React__default.createElement("div", { className: "arc-Alert-content" },
+                React__default.createElement(SemanticHeading, { className: classNames("arc-Alert-heading", {
+                        "arc-Alert-heading--isDismissable": isDismissable,
+                    }), id: headingId, level: headingLevel },
                     React__default.createElement(VisuallyHidden$2, null,
                         status,
                         " alert."),
-                    heading)),
-            description ? (React__default.isValidElement(description) ? (React__default.createElement("div", { className: "arc-Alert-description", id: "alertDescription" }, description)) : (React__default.createElement("div", { className: "arc-Alert-description" },
-                React__default.createElement(Text, { isMeasured: isMeasured, size: "s", id: "alertDescription" }, description)))) : null,
-            React__default.createElement("div", { className: "arc-Alert-links" },
-                React__default.createElement("ul", null, links === null || links === void 0 ? void 0 : links.map(function (link, index) {
+                    heading),
+                description ? (React__default.isValidElement(description) ? (React__default.createElement("div", { className: "arc-Alert-description", id: descriptionId }, description)) : (React__default.createElement("div", { className: "arc-Alert-description" },
+                    React__default.createElement(Text, { isMeasured: isMeasured, size: "s", id: descriptionId }, description)))) : null,
+                React__default.createElement("ul", { className: "arc-Alert-links" }, links === null || links === void 0 ? void 0 : links.map(function (link, index) {
                     var _a;
-                    return (React__default.createElement("li", { key: index },
+                    return (React__default.createElement("li", { key: index, className: "arc-Alert-link" },
                         React__default.createElement(Link, __assign({ href: link.href, "aria-label": link.screenReaderText, target: link.target, size: "s" }, (link.onClick && {
-                            onClick: function (e) {
-                                e.preventDefault();
-                                link.onClick && link.onClick(e);
-                            },
+                            onClick: function (e) { return handleLinkClick(e, link); },
                             isButton: true,
                         })), (_a = link.children) !== null && _a !== void 0 ? _a : "")));
-                })))),
-        isDismissable && (React__default.createElement("button", { "aria-label": "dismiss alert", className: "arc-Alert-dismiss", onClick: onDismissHandler, tabIndex: 0 },
-            React__default.createElement(ThemeIcon, { size: 24, icon: "alertDismiss" })))));
+                }))))));
 };
 
 var GooglePlayIcon = function () { return (React__default.createElement("svg", { "aria-hidden": true, role: "presentation", xmlns: "http://www.w3.org/2000/svg", id: "artwork", version: "1.1", height: "48", width: "162", viewBox: "0 0 135 40" },
@@ -820,7 +625,7 @@ var ConditionalWrapper = function (_a) {
  */
 var Image = function (_a) {
     var _b;
-    var alt = _a.alt, _c = _a.fadeOnLoad, fadeOnLoad = _c === void 0 ? false : _c, _d = _a.anchor, anchor = _d === void 0 ? "C" : _d, children = _a.children, fillColor = _a.fillColor, fit = _a.fit, height = _a.height, loading = _a.loading, overlay = _a.overlay, sizes = _a.sizes, src = _a.src, srcSet = _a.srcSet, width = _a.width, props = __rest(_a, ["alt", "fadeOnLoad", "anchor", "children", "fillColor", "fit", "height", "loading", "overlay", "sizes", "src", "srcSet", "width"]);
+    var alt = _a.alt, _c = _a.fadeOnLoad, fadeOnLoad = _c === void 0 ? false : _c, _d = _a.anchor, anchor = _d === void 0 ? "C" : _d, children = _a.children, fetchPriority = _a.fetchPriority, fillColor = _a.fillColor, fit = _a.fit, height = _a.height, loading = _a.loading, overlay = _a.overlay, sizes = _a.sizes, src = _a.src, srcSet = _a.srcSet, width = _a.width, props = __rest(_a, ["alt", "fadeOnLoad", "anchor", "children", "fetchPriority", "fillColor", "fit", "height", "loading", "overlay", "sizes", "src", "srcSet", "width"]);
     var _e = useState(false), visible = _e[0], setVisible = _e[1];
     var imageRef = function (el) {
         if (el) {
@@ -831,7 +636,7 @@ var Image = function (_a) {
         "arc-Image-img--fade": fadeOnLoad,
         "arc-Image-img--fadeVisible": fadeOnLoad && visible,
     };
-    var img = (React__default.createElement("img", { ref: imageRef, className: classNames("arc-Image-img", animationClasses), alt: alt, height: fit === "cover" ? undefined : height, loading: loading, sizes: children ? undefined : sizes, src: src, srcSet: children ? undefined : srcSet, width: fit === "cover" ? undefined : width }));
+    var img = (React__default.createElement("img", { ref: imageRef, className: classNames("arc-Image-img", animationClasses), alt: alt, height: fit === "cover" ? undefined : height, loading: loading, sizes: children ? undefined : sizes, src: src, srcSet: children ? undefined : srcSet, width: fit === "cover" ? undefined : width, fetchPriority: fetchPriority }));
     return (React__default.createElement("div", __assign({ className: classNames((_b = {
                 "arc-Image": true,
                 "arc-Image--cover": fit === "cover"
@@ -851,6 +656,27 @@ var fitOptions = ["cover"];
 var loadingOptions = ["eager", "lazy"];
 var overlayOptions = ["scrimBottomDark"];
 
+/**
+ * Use `Heading` to display heading text.
+ */
+var Heading = function (_a) {
+    var _b;
+    var _c = _a.align, align = _c === void 0 ? "left" : _c, _d = _a.casing, casing = _d === void 0 ? "auto" : _d, _e = _a.color, color = _e === void 0 ? "auto" : _e, children = _a.children, level = _a.level, isInline = _a.isInline, _f = _a.fontStyle, fontStyle = _f === void 0 ? "default" : _f, _g = _a.isResponsive, isResponsive = _g === void 0 ? true : _g, _h = _a.isWordWrap, isWordWrap = _h === void 0 ? true : _h, size = _a.size, id = _a.id, props = __rest(_a, ["align", "casing", "color", "children", "level", "isInline", "fontStyle", "isResponsive", "isWordWrap", "size", "id"]);
+    var surface = useContext(Context$3).surface;
+    return (React__default.createElement(SemanticHeading, __assign({ id: id, level: level, className: classNames("arc-Heading", "arc-Heading--".concat(camelcase(fontStyle)), (_b = {
+                "arc-Heading--wrap": isWordWrap,
+                "arc-Heading--inline": isInline,
+                "arc-Heading--fixedSize": isResponsive === false
+            },
+            _b[suffixModifier("arc-Heading--align", align)] = align && align !== "left",
+            _b["arc-Heading--size".concat(size && size.toUpperCase())] = size,
+            _b["arc-Heading--casingNone"] = casing === "none",
+            _b["arc-Heading--colorBrand"] = color === "brand",
+            _b["arc-Heading--onDarkSurface"] = surface === "dark",
+            _b["arc-Heading--isInline"] = isInline,
+            _b)) }, filterAttrs(props)), children));
+};
+
 var AvatarContent = function (_a) {
     var img = _a.img, initials = _a.initials, _b = _a.size, size = _b === void 0 ? "xl" : _b;
     var textSize = {
@@ -915,7 +741,7 @@ var Badge = function (_a) {
  */
 var VerticalSpace = function (_a) {
     var _b;
-    var _c = _a.isDebugVisible, isDebugVisible = _c === void 0 ? false : _c, _d = _a.size, size = _d === void 0 ? "24" : _d, sizeS = _a.sizeS, sizeM = _a.sizeM, sizeL = _a.sizeL, sizeXL = _a.sizeXL, props = __rest(_a, ["isDebugVisible", "size", "sizeS", "sizeM", "sizeL", "sizeXL"]);
+    var _c = _a.isDebugVisible, isDebugVisible = _c === void 0 ? false : _c, _d = _a.size, size = _d === void 0 ? "24" : _d, sizeS = _a.sizeS, sizeM = _a.sizeM, sizeL = _a.sizeL, sizeXL = _a.sizeXL, sizeXXL = _a.sizeXXL, props = __rest(_a, ["isDebugVisible", "size", "sizeS", "sizeM", "sizeL", "sizeXL", "sizeXXL"]);
     return (React__default.createElement("div", __assign({ className: classNames((_b = {
                 "arc-VerticalSpace": true
             },
@@ -924,6 +750,7 @@ var VerticalSpace = function (_a) {
             _b["arc-VerticalSpace--sizeM".concat(sizeM)] = sizeM,
             _b["arc-VerticalSpace--sizeL".concat(sizeL)] = sizeL,
             _b["arc-VerticalSpace--sizeXL".concat(sizeXL)] = sizeXL,
+            _b["arc-VerticalSpace--sizeXXL".concat(sizeXXL)] = sizeXXL,
             _b["arc-VerticalSpace--debugVisible"] = isDebugVisible,
             _b)) }, filterAttrs(props))));
 };
@@ -946,7 +773,7 @@ var Box = function (_a) {
 };
 
 /**
- * Use `Grid` to compose layouts on a 12-column grid.
+ * Use `Grid` to compose layouts on a 12-column grid. Aligns with sibling `Section` components.
  */
 var Grid = function (_a) {
     var children = _a.children, isFluid = _a.isFluid, isDebugVisible = _a.isDebugVisible, isGutterless = _a.isGutterless, _b = _a.isExtended, isExtended = _b === void 0 ? false : _b, props = __rest(_a, ["children", "isFluid", "isDebugVisible", "isGutterless", "isExtended"]);
@@ -1007,7 +834,7 @@ var BannerRow = function (_a) {
 };
 
 var TemplateBanner = function (_a) {
-    var heading = _a.heading, label = _a.label, text = _a.text, img = _a.img, _b = _a.contentRatio, contentRatio = _b === void 0 ? "1/1" : _b, children = _a.children, _c = _a.alignment, alignment = _c === void 0 ? "center" : _c, additionalTopMargin = _a.additionalTopMargin, _d = _a.minHeight, minHeight = _d === void 0 ? 454 : _d, minHeightM = _a.minHeightM, minHeightL = _a.minHeightL, minHeightXL = _a.minHeightXL, _e = _a.headingSize, headingSize = _e === void 0 ? "xl" : _e, _f = _a.isReversed, isReversed = _f === void 0 ? false : _f, _g = _a.isElevated, isElevated = _g === void 0 ? false : _g, _h = _a.headingLevel, headingLevel = _h === void 0 ? "2" : _h, _j = _a.type, type = _j === void 0 ? "light" : _j, props = __rest(_a, ["heading", "label", "text", "img", "contentRatio", "children", "alignment", "additionalTopMargin", "minHeight", "minHeightM", "minHeightL", "minHeightXL", "headingSize", "isReversed", "isElevated", "headingLevel", "type"]);
+    var heading = _a.heading, _b = _a.fontStyle, fontStyle = _b === void 0 ? "default" : _b, label = _a.label, _c = _a.labelLevel, labelLevel = _c === void 0 ? "3" : _c, text = _a.text, img = _a.img, _d = _a.contentRatio, contentRatio = _d === void 0 ? "1/1" : _d, children = _a.children, _e = _a.alignment, alignment = _e === void 0 ? "center" : _e, additionalTopMargin = _a.additionalTopMargin, _f = _a.minHeight, minHeight = _f === void 0 ? 454 : _f, minHeightM = _a.minHeightM, minHeightL = _a.minHeightL, minHeightXL = _a.minHeightXL, _g = _a.headingSize, headingSize = _g === void 0 ? "xl" : _g, _h = _a.isReversed, isReversed = _h === void 0 ? false : _h, _j = _a.isElevated, isElevated = _j === void 0 ? false : _j, _k = _a.headingLevel, headingLevel = _k === void 0 ? "2" : _k, _l = _a.type, type = _l === void 0 ? "light" : _l, props = __rest(_a, ["heading", "fontStyle", "label", "labelLevel", "text", "img", "contentRatio", "children", "alignment", "additionalTopMargin", "minHeight", "minHeightM", "minHeightL", "minHeightXL", "headingSize", "isReversed", "isElevated", "headingLevel", "type"]);
     var backgrounds = {
         dark: "dark-brand-02",
         light: "light-white",
@@ -1050,13 +877,13 @@ var TemplateBanner = function (_a) {
                                 "arc-TemplateBanner-content--additionalTopMargin": additionalTopMargin && alignment === "start",
                             }) },
                             label && (React__default.createElement(React__default.Fragment, null,
-                                React__default.createElement(Heading, { level: "3", fontStyle: "overline" }, label),
+                                React__default.createElement(Heading, { level: labelLevel, fontStyle: "overline", isWordWrap: false }, label),
                                 React__default.createElement(VerticalSpace, { size: "8" }))),
-                            React__default.createElement(Heading, { level: headingLevel, size: headingSize }, heading),
+                            React__default.createElement(Heading, { level: headingLevel, size: headingSize, fontStyle: fontStyle, isWordWrap: false }, heading),
                             text && (React__default.createElement(React__default.Fragment, null,
                                 React__default.createElement(VerticalSpace, { size: "16" }),
                                 React__default.createElement("span", { className: "arc-TemplateBanner-text" }, text))),
-                            children && (React__default.createElement(React__default.Fragment, null,
+                            children && (React__default.createElement("span", null,
                                 React__default.createElement(VerticalSpace, { size: "32" }),
                                 children)))),
                     img && contentRatio !== "1/0" && (React__default.createElement(GridCol, __assign({ "data-testid": "arc-TemplateBanner-imageCol", align: img.fit !== "cover"
@@ -1902,7 +1729,7 @@ var Spinner = function (_a) {
 };
 
 var ButtonV2 = forwardRef(function (_a, ref) {
-    var label = _a.label, _b = _a.buttonStyle, buttonStyle = _b === void 0 ? "primary" : _b, icon = _a.icon, _c = _a.iconPosition, iconPosition = _c === void 0 ? "beforeText" : _c, _d = _a.size, size = _d === void 0 ? "m" : _d, ariaLabel = _a.ariaLabel, ariaControls = _a.ariaControls, ariaExpanded = _a.ariaExpanded, ariaHasPopup = _a.ariaHasPopup, _e = _a.isFullWidth, isFullWidth = _e === void 0 ? false : _e, _f = _a.isLoading, isLoading = _f === void 0 ? false : _f, isSpan = _a.isSpan, onClick = _a.onClick, href = _a.href, id = _a.id, rel = _a.rel, target = _a.target, type = _a.type, form = _a.form, props = __rest(_a, ["label", "buttonStyle", "icon", "iconPosition", "size", "ariaLabel", "ariaControls", "ariaExpanded", "ariaHasPopup", "isFullWidth", "isLoading", "isSpan", "onClick", "href", "id", "rel", "target", "type", "form"]);
+    var label = _a.label, _b = _a.buttonStyle, buttonStyle = _b === void 0 ? "primary" : _b, icon = _a.icon, iconActive = _a.iconActive, _c = _a.iconPosition, iconPosition = _c === void 0 ? "beforeText" : _c, _d = _a.size, size = _d === void 0 ? "m" : _d, ariaLabel = _a.ariaLabel, ariaControls = _a.ariaControls, ariaExpanded = _a.ariaExpanded, ariaHasPopup = _a.ariaHasPopup, _e = _a.isFullWidth, isFullWidth = _e === void 0 ? false : _e, _f = _a.isLoading, isLoading = _f === void 0 ? false : _f, isSpan = _a.isSpan, onClick = _a.onClick, href = _a.href, id = _a.id, rel = _a.rel, target = _a.target, type = _a.type, form = _a.form, props = __rest(_a, ["label", "buttonStyle", "icon", "iconActive", "iconPosition", "size", "ariaLabel", "ariaControls", "ariaExpanded", "ariaHasPopup", "isFullWidth", "isLoading", "isSpan", "onClick", "href", "id", "rel", "target", "type", "form"]);
     var surface = useContext(Context$3).surface;
     var ButtonElement = isSpan ? "span" : "button";
     var iconSizes = {
@@ -1929,21 +1756,23 @@ var ButtonV2 = forwardRef(function (_a, ref) {
                 return "auto";
         }
     };
-    var buttonContent = (React__default.createElement("span", { className: classNames("arc-ButtonV2-inner", {
+    var renderButtonContent = function () { return (React__default.createElement("span", { className: classNames("arc-ButtonV2-inner", {
             "arc-ButtonV2-inner--iconBeforeText": iconPosition === "beforeText",
         }) },
         label && React__default.createElement("span", { className: "arc-ButtonV2-label" }, label),
         isLoading && (React__default.createElement("span", { className: "arc-ButtonV2-icon" },
             React__default.createElement(Spinner, { size: size }))),
-        icon && !isLoading && (React__default.createElement("span", { className: "arc-ButtonV2-icon" },
-            React__default.createElement(Icon$1, { color: getIconColor(buttonStyle), size: iconSizes[size], icon: icon })))));
+        icon && !isLoading && (React__default.createElement(React__default.Fragment, null,
+            React__default.createElement("span", { className: classNames("arc-ButtonV2-icon", {
+                    "arc-ButtonV2-icon--hasActive": iconActive,
+                }) },
+                React__default.createElement(Icon$1, { color: getIconColor(buttonStyle), size: iconSizes[size], icon: icon })),
+            iconActive && (React__default.createElement("span", { className: "arc-ButtonV2-icon--active" },
+                React__default.createElement(Icon$1, { color: getIconColor(buttonStyle), size: iconSizes[size], icon: iconActive }))))))); };
     if (href && !isLoading) {
-        return (React__default.createElement("a", __assign({}, commonProps, { className: ButtonV2Classes, href: href, rel: rel, "aria-haspopup": ariaHasPopup, "aria-controls": ariaControls, "aria-expanded": ariaExpanded, "aria-label": ariaLabel, target: target }), buttonContent));
+        return (React__default.createElement("a", __assign({}, commonProps, { className: ButtonV2Classes, href: href, rel: rel, "aria-haspopup": ariaHasPopup, "aria-controls": ariaControls, "aria-expanded": ariaExpanded, "aria-label": ariaLabel, target: target }), renderButtonContent()));
     }
-    return (React__default.createElement(ButtonElement, __assign({}, commonProps, { className: ButtonV2Classes, "aria-label": ariaLabel, "aria-haspopup": ariaHasPopup, "aria-controls": ariaControls, "aria-expanded": ariaExpanded, disabled: isLoading, type: type, form: form }),
-        React__default.createElement("span", { className: classNames("arc-ButtonV2-inner", {
-                "arc-ButtonV2-inner--iconBeforeText": iconPosition === "beforeText",
-            }) }, buttonContent)));
+    return (React__default.createElement(ButtonElement, __assign({}, commonProps, { className: ButtonV2Classes, "aria-label": ariaLabel, "aria-haspopup": ariaHasPopup, "aria-controls": ariaControls, "aria-expanded": ariaExpanded, disabled: isLoading, type: type, form: form }), renderButtonContent()));
 });
 
 var ButtonGroup = function (_a) {
@@ -2151,6 +1980,203 @@ function startOfMonth(dirtyDate) {
   return date;
 }
 
+/**
+ * Do not edit directly
+ * Generated on Fri, 24 Oct 2025 10:49:57 GMT
+ */
+var ArcSizeBreakpointsXs = "320px";
+var ArcSizeBreakpointsS = "636px";
+var ArcSizeBreakpointsM = "768px";
+var ArcSizeBreakpointsL = "1024px";
+var ArcSizeBreakpointsXl = "1280px";
+var ArcSizeBreakpointsXxl = "1440px";
+
+/**
+ * Optionally define ariaDescribedBy if errorMessage or helper exist.
+ */
+var useAriaDescribedby = function (_a) {
+    var id = _a.id, _b = _a.idError, idError = _b === void 0 ? "".concat(id, "-error") : _b, _c = _a.idHelper, idHelper = _c === void 0 ? "".concat(id, "-helper") : _c, _d = _a.idDisclosure, idDisclosure = _d === void 0 ? "".concat(id, "-disclosure") : _d, errorMessage = _a.errorMessage, helper = _a.helper, disclosureText = _a.disclosureText;
+    if (!id) {
+        return {
+            ariaDescribedby: undefined,
+            idHelper: undefined,
+            idError: undefined,
+            idDisclosure: undefined,
+        };
+    }
+    var ariaDescribedbyArr = [];
+    if (errorMessage) {
+        ariaDescribedbyArr.push(idError);
+    }
+    if (helper) {
+        ariaDescribedbyArr.push(idHelper);
+    }
+    if (disclosureText) {
+        ariaDescribedbyArr.push(idDisclosure);
+    }
+    var ariaDescribedby = ariaDescribedbyArr.length > 0 ? ariaDescribedbyArr.join(" ") : undefined;
+    return { ariaDescribedby: ariaDescribedby, idError: idError, idHelper: idHelper, idDisclosure: idDisclosure };
+};
+
+/**
+ * Detect interaction mode
+ */
+var useInteractionMode = function () {
+    var _a = useState("pointer"), interactionMode = _a[0], setInteractionMode = _a[1];
+    useEffect(function () {
+        var onKeyDown = function (event) {
+            if (event.altKey || event.ctrlKey || event.metaKey) {
+                return;
+            }
+            setInteractionMode("keyboard");
+        };
+        var onPointerDown = function () {
+            setInteractionMode("pointer");
+        };
+        if (typeof window !== "undefined") {
+            document.addEventListener("keydown", onKeyDown, true);
+            document.addEventListener("click", onPointerDown, true);
+        }
+        return function () {
+            if (typeof window !== "undefined") {
+                document.removeEventListener("keydown", onKeyDown);
+                document.removeEventListener("click", onPointerDown);
+            }
+        };
+    }, []);
+    return { interactionMode: interactionMode };
+};
+
+/**
+ * Infer the correct inputMode, pattern and type if specifying a `number` type.
+ */
+var useNumericInput = function (props) {
+    var type = props.type === "number" ? "text" : props.type;
+    var inputMode = props.inputMode;
+    if (!props.inputMode) {
+        if (props.type === "email") {
+            inputMode = "email";
+        }
+        else if (props.type === "number") {
+            inputMode = "numeric";
+        }
+        else if (props.type === "tel") {
+            inputMode = "tel";
+        }
+        else if (props.type === "url") {
+            inputMode = "url";
+        }
+    }
+    var pattern = props.pattern;
+    if (!props.pattern && props.type === "number") {
+        pattern = "[0-9]*";
+    }
+    return { inputMode: inputMode, pattern: pattern, type: type };
+};
+
+var usePagination = function (pageCount, selectedPage) {
+    var formatValues = function (range) {
+        return range.map(function (value) { return value.toString(); });
+    };
+    return useMemo(function () {
+        if (pageCount > 7 && selectedPage < 5) {
+            // show 1 - 5 the right dots are visible.
+            return formatValues(__spreadArray(__spreadArray([], Array.from({ length: 5 }, function (_value, index) { return index + 1; }), true), [
+                "...",
+                pageCount,
+            ], false));
+        }
+        if (pageCount > 7 && selectedPage >= pageCount - 3) {
+            // show numbers to the end but the left dots are visible
+            return formatValues(__spreadArray([
+                1,
+                "..."
+            ], Array.from({ length: 5 }, function (_value, index) { return pageCount - index; }).reverse(), true));
+        }
+        if (pageCount > 7 && selectedPage >= 5 && selectedPage < pageCount - 3) {
+            // show selected page with one number either side and both the left and the right dots are visible.
+            return formatValues([
+                1,
+                "...",
+                selectedPage - 1,
+                selectedPage,
+                selectedPage + 1,
+                "...",
+                pageCount,
+            ]);
+        }
+        // show all pages from pageCount
+        return formatValues(Array.from({ length: pageCount }, function (_value, index) { return index + 1; }));
+    }, [pageCount, selectedPage]);
+};
+
+var useThemeElement = function () {
+    var _a = useState(undefined), themeElement = _a[0], setElement = _a[1];
+    var setThemeElement = function (el) {
+        el &&
+            setElement(el.closest(".arc-ds-sys-theme") || undefined);
+    };
+    return [themeElement, setThemeElement];
+};
+
+var useUniqueString = function (value) {
+    var id = useId$1();
+    return "".concat(value, "-").concat(id);
+};
+
+var IS_SERVER = typeof window === "undefined";
+/**
+ * @typedef MediaQueryOutputs
+ * @param {boolean} matches - does the document match the media query?
+ */
+/**
+ * Handle with care!
+ *
+ * If you need to change something in the browser based on @media query, you
+ * probably don’t need this hook. Use CSS media queries instead.
+ *
+ * Sometimes UI requirements are not achievable with CSS media queries alone. In
+ * these rare cases, use this hook to make media query matches available
+ * to React JavaScript code.
+ *
+ * @param {string} mediaQuery - the media query to parse
+ * @returns {MediaQueryOutputs}
+ */
+var useMediaQuery = function (mediaQuery) {
+    var getMatches = function (query) {
+        if (IS_SERVER) {
+            return false;
+        }
+        return window.matchMedia(query).matches;
+    };
+    var _a = useState(false), matches = _a[0], setMatches = _a[1];
+    // Handles the change event of the media query.
+    var handleChange = function () {
+        setMatches(getMatches(mediaQuery));
+    };
+    useEffect(function () {
+        var matchMedia = window.matchMedia(mediaQuery);
+        // Triggered at the first client-side load and if query changes
+        handleChange();
+        // Use deprecated `addListener` and `removeListener` to support Safari < 14 (#135)
+        if (matchMedia.addListener) {
+            matchMedia.addListener(handleChange);
+        }
+        else {
+            matchMedia.addEventListener("change", handleChange);
+        }
+        return function () {
+            if (matchMedia.removeListener) {
+                matchMedia.removeListener(handleChange);
+            }
+            else {
+                matchMedia.removeEventListener("change", handleChange);
+            }
+        };
+    }, [mediaQuery]);
+    return matches;
+};
+
 var containsDate = function (dates, compareDate) {
     return dates.map(function (date) { return date.getTime(); }).includes(compareDate.getTime());
 };
@@ -5465,33 +5491,18 @@ var CalendarDayGrid = function (_a) {
             React__default.createElement("tbody", { onKeyDown: handleKeyDown }, getWeeksInMonth(month).map(function (week, i) { return (React__default.createElement("tr", { key: "".concat(month.getTime(), "-week-").concat(i) }, week.map(function (day) { return (React__default.createElement(CalendarDayNumber, { ref: autoFocusRef, shouldRender: isSameMonth(month, day), key: day.getTime(), date: day, isFocusWithinDayGrid: isFocusWithinDayGrid })); }))); }))))); })));
 };
 
-/**
- * Do not edit directly
- * Generated file
- */
-
-const BtIconChevronLeftMid =
-  "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 16 16'%3e%3cpath fill='currentColor' fill-rule='evenodd' d='m7.621 8 2.849 2.852a.673.673 0 0 1-.732 1.097.7.7 0 0 1-.218-.145L6.196 8.476a.673.673 0 0 1 0-.951L9.52 4.197a.67.67 0 0 1 1.146.476c0 .178-.07.349-.196.475z' clip-rule='evenodd'/%3e%3c/svg%3e";
-
-/**
- * Do not edit directly
- * Generated file
- */
-
-const BtIconChevronRightMid =
-  "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 16 16'%3e%3cpath fill='currentColor' fill-rule='evenodd' d='M9.045 8 6.197 5.148a.673.673 0 0 1 .731-1.097.7.7 0 0 1 .218.146l3.324 3.328a.673.673 0 0 1 0 .95l-3.324 3.329A.67.67 0 0 1 6 11.328c0-.178.07-.35.197-.476z' clip-rule='evenodd'/%3e%3c/svg%3e";
-
 var CalendarNavButton = function (_a) {
     var isDisabled = _a.isDisabled, onClick = _a.onClick, direction = _a.direction, ariaLabel = _a.ariaLabel;
     var icons = {
-        previous: BtIconChevronLeftMid,
-        next: BtIconChevronRightMid,
+        previous: "calendarLeft",
+        next: "calendarRight",
     };
     return (React__default.createElement("button", { "aria-label": ariaLabel, disabled: isDisabled, onClick: onClick, type: "button", className: classNames("arc-CalendarNavButton", {
             "arc-CalendarNavButton--previous": direction === "previous",
             "arc-CalendarNavButton--next": direction === "next",
         }) },
-        React__default.createElement(Icon$1, { size: 32, icon: icons[direction] })));
+        React__default.createElement("div", { className: "arc-CalendarNavButton-icon" },
+            React__default.createElement(ThemeIcon, { icon: icons[direction] }))));
 };
 
 var CalendarDoubleMonthView = function (_a) {
@@ -7768,18 +7779,18 @@ function useEmblaCarousel(options = {}, plugins = []) {
 useEmblaCarousel.globalOptions = undefined;
 
 var XS_BREAKPOINT = "(min-width: ".concat(ArcSizeBreakpointsXs, ")");
-var S_BREAKPOINT$1 = "(min-width: ".concat(ArcSizeBreakpointsS, ")");
-var M_BREAKPOINT$1 = "(min-width: ".concat(ArcSizeBreakpointsM, ")");
-var L_BREAKPOINT$1 = "(min-width: ".concat(ArcSizeBreakpointsL, ")");
-var XL_BREAKPOINT$1 = "(min-width: ".concat(ArcSizeBreakpointsXl, ")");
+var S_BREAKPOINT = "(min-width: ".concat(ArcSizeBreakpointsS, ")");
+var M_BREAKPOINT = "(min-width: ".concat(ArcSizeBreakpointsM, ")");
+var L_BREAKPOINT = "(min-width: ".concat(ArcSizeBreakpointsL, ")");
+var XL_BREAKPOINT = "(min-width: ".concat(ArcSizeBreakpointsXl, ")");
 
 var getOptions = function (itemsToScroll, loop, responsive) {
     var breakpoints = [
         [XS_BREAKPOINT, "xs"],
-        [S_BREAKPOINT$1, "s"],
-        [M_BREAKPOINT$1, "m"],
-        [L_BREAKPOINT$1, "l"],
-        [XL_BREAKPOINT$1, "xl"],
+        [S_BREAKPOINT, "s"],
+        [M_BREAKPOINT, "m"],
+        [L_BREAKPOINT, "l"],
+        [XL_BREAKPOINT, "xl"],
     ];
     var breakpointOptions = breakpoints.reduce(function (acc, _a) {
         var _b;
@@ -7850,10 +7861,10 @@ var Carousel = function (_a) {
     var _k = useState(true), prevButtonEnabled = _k[0], setPrevButtonEnabled = _k[1];
     var _l = useState(true), nextButtonEnabled = _l[0], setNextButtonEnabled = _l[1];
     var isMinWidthArcBreakpointXs = useMediaQuery(XS_BREAKPOINT);
-    var isMinWidthArcBreakpointS = useMediaQuery(S_BREAKPOINT$1);
-    var isMinWidthArcBreakpointM = useMediaQuery(M_BREAKPOINT$1);
-    var isMinWidthArcBreakpointL = useMediaQuery(L_BREAKPOINT$1);
-    var isMinWidthArcBreakpointXl = useMediaQuery(XL_BREAKPOINT$1);
+    var isMinWidthArcBreakpointS = useMediaQuery(S_BREAKPOINT);
+    var isMinWidthArcBreakpointM = useMediaQuery(M_BREAKPOINT);
+    var isMinWidthArcBreakpointL = useMediaQuery(L_BREAKPOINT);
+    var isMinWidthArcBreakpointXl = useMediaQuery(XL_BREAKPOINT);
     var slideWidth = getSlideWidth({
         screenSizes: {
             xl: isMinWidthArcBreakpointXl,
@@ -7973,14 +7984,14 @@ var Provider$4 = Context$2.Provider;
  */
 var FormControl = function (_a) {
     var _b;
-    var children = _a.children, _c = _a.elementType, ElementType = _c === void 0 ? "div" : _c, errorMessage = _a.errorMessage, helper = _a.helper, htmlFor = _a.htmlFor, supplementaryInfo = _a.supplementaryInfo, id = _a.id, label = _a.label, _d = _a.labelSize, labelSize = _d === void 0 ? "l" : _d, _e = _a.labelPosition, labelPosition = _e === void 0 ? "top" : _e, _f = _a.requirementStatus, requirementStatus = _f === void 0 ? "optional" : _f, _g = _a.helperUnderLabel, helperUnderLabel = _g === void 0 ? false : _g, isDisabled = _a.isDisabled, _h = _a.hideLabel, hideLabel = _h === void 0 ? false : _h, disclosureTitle = _a.disclosureTitle, disclosureText = _a.disclosureText, onClickDisclosure = _a.onClickDisclosure, props = __rest(_a, ["children", "elementType", "errorMessage", "helper", "htmlFor", "supplementaryInfo", "id", "label", "labelSize", "labelPosition", "requirementStatus", "helperUnderLabel", "isDisabled", "hideLabel", "disclosureTitle", "disclosureText", "onClickDisclosure"]);
+    var children = _a.children, _c = _a.elementType, ElementType = _c === void 0 ? "div" : _c, errorMessage = _a.errorMessage, helper = _a.helper, htmlFor = _a.htmlFor, supplementaryInfo = _a.supplementaryInfo, id = _a.id, label = _a.label, _d = _a.labelSize, labelSize = _d === void 0 ? "l" : _d, _e = _a.labelPosition, labelPosition = _e === void 0 ? "top" : _e, _f = _a.requirementStatus, requirementStatus = _f === void 0 ? "optional" : _f, _g = _a.helperUnderLabel, helperUnderLabel = _g === void 0 ? false : _g, isDisabled = _a.isDisabled, _h = _a.hideLabel, hideLabel = _h === void 0 ? false : _h, disclosureTitle = _a.disclosureTitle, disclosureText = _a.disclosureText, onClickDisclosure = _a.onClickDisclosure, _j = _a.isErrorAlert, isErrorAlert = _j === void 0 ? false : _j, props = __rest(_a, ["children", "elementType", "errorMessage", "helper", "htmlFor", "supplementaryInfo", "id", "label", "labelSize", "labelPosition", "requirementStatus", "helperUnderLabel", "isDisabled", "hideLabel", "disclosureTitle", "disclosureText", "onClickDisclosure", "isErrorAlert"]);
     var surface = useContext(Context$3).surface;
-    var _j = useAriaDescribedby({
+    var _k = useAriaDescribedby({
         disclosureText: disclosureText,
         errorMessage: errorMessage,
         helper: helper,
         id: htmlFor || id, // `htmlFor` is preference to keep this deterministic with TextInput
-    }), ariaDescribedby = _j.ariaDescribedby, idError = _j.idError, idHelper = _j.idHelper, idDisclosure = _j.idDisclosure;
+    }), ariaDescribedby = _k.ariaDescribedby, idError = _k.idError, idHelper = _k.idHelper, idDisclosure = _k.idDisclosure;
     var LabelType = ElementType === "div" ? "label" : "legend";
     var elementProps = {};
     var labelProps = {};
@@ -8021,7 +8032,8 @@ var FormControl = function (_a) {
                 label && (React__default.createElement("span", { className: classNames("arc-FormControl-labelText", {
                         "arc-FormControl-labelText--withOptional": requirementStatus === "optional",
                     }) }, label)),
-                requirementStatus === "optional" && (React__default.createElement("span", { className: "arc-FormControl-labelOptional" }, "(optional)")))),
+                requirementStatus === "optional" && (React__default.createElement("span", { className: "arc-FormControl-labelOptional" }, "(optional)")),
+                LabelType === "legend" && (React__default.createElement(VisuallyHidden$2, null, "".concat(errorMessage ? "Error. " + errorMessage : "", ". ").concat(helper))))),
             helperUnderLabel && helper && (React__default.createElement("div", { className: "arc-FormControl-helper arc-FormControl-helper--underLabel", id: idHelper }, helper)),
             children,
             React__default.createElement("div", { className: classNames("arc-FormControl-info", {
@@ -8029,78 +8041,86 @@ var FormControl = function (_a) {
                 }) },
                 ((helper && !helperUnderLabel) ||
                     errorMessage ||
-                    disclosureTitle) && (React__default.createElement("div", { className: "arc-FormControl-helperContainer" }, errorMessage ? (React__default.createElement("div", { className: "arc-FormControl-error", id: idError },
+                    disclosureTitle) && (React__default.createElement("div", { className: "arc-FormControl-helperContainer" }, errorMessage ? (React__default.createElement("div", { className: "arc-FormControl-error", id: idError, role: isErrorAlert ? "alert" : undefined },
                     React__default.createElement("span", { className: "arc-FormControl-error--icon" },
+                        React__default.createElement(VisuallyHidden$2, null, "Error."),
                         React__default.createElement(ThemeIcon, { icon: "formControlAlert" })),
                     errorMessage)) : (!helperUnderLabel &&
                     (disclosureTitle ? (React__default.createElement(DisclosureMini, { onClick: onClickDisclosure, summary: disclosureTitle, size: labelSize === "m" ? "l" : labelSize, id: idDisclosure }, disclosureText)) : (helper && (React__default.createElement("div", { className: "arc-FormControl-helper", id: idHelper }, helper))))))),
                 supplementaryInfo && (React__default.createElement("div", { className: "arc-FormControl-supplementaryInfo" }, supplementaryInfo))))));
 };
-
-/**
- *  Use `Checkbox` to allow users to select individual options.
- */
-var Checkbox = forwardRef(function (_a, ref) {
-    var _b = _a.checked, checked = _b === void 0 ? false : _b, errorMessage = _a.errorMessage, helper = _a.helper, id = _a.id, _c = _a.isDisabled, isDisabled = _c === void 0 ? false : _c, _d = _a.isRequired, isRequired = _d === void 0 ? false : _d, label = _a.label, _e = _a.hideLabel, hideLabel = _e === void 0 ? false : _e, name = _a.name, onBlur = _a.onBlur, onChange = _a.onChange, _f = _a.size, size = _f === void 0 ? "m" : _f, value = _a.value, _g = _a.checkboxAlignment, checkboxAlignment = _g === void 0 ? "center" : _g, _h = _a.indeterminate, indeterminate = _h === void 0 ? false : _h, props = __rest(_a, ["checked", "errorMessage", "helper", "id", "isDisabled", "isRequired", "label", "hideLabel", "name", "onBlur", "onChange", "size", "value", "checkboxAlignment", "indeterminate"]);
-    var requirementStatus = useContext(Context$2).requirementStatus;
-    var surface = useContext(Context$3).surface;
-    var _j = useAriaDescribedby({
-        id: id,
-        errorMessage: errorMessage,
-    }), ariaDescribedby = _j.ariaDescribedby, idError = _j.idError;
+
+var CheckboxIcon = function (_a) {
+    var id = _a.id, name = _a.name, checked = _a.checked, _b = _a.indeterminate, indeterminate = _b === void 0 ? false : _b, isDisabled = _a.isDisabled, isRequired = _a.isRequired, _c = _a.size, size = _c === void 0 ? "m" : _c, value = _a.value, error = _a.error, ariaDescribedBy = _a.ariaDescribedBy, onBlur = _a.onBlur, onChange = _a.onChange, props = __rest(_a, ["id", "name", "checked", "indeterminate", "isDisabled", "isRequired", "size", "value", "error", "ariaDescribedBy", "onBlur", "onChange"]);
+    var requirementStatus = useContext(Context$2).requirementStatus;
     var internalRef = useRef(null);
-    var synchronizeRefs = function (el) {
-        internalRef.current = el;
-        if (typeof ref === "object" && ref !== null) {
-            ref.current = el;
-        }
-        else if (typeof ref === "function") {
-            ref(el);
-        }
-    };
+    var surface = useContext(Context$3).surface;
     useEffect(function () {
         if (internalRef.current) {
             internalRef.current.indeterminate = indeterminate;
         }
     }, [indeterminate, checked]);
     var tickSize = {
-        s: { width: 14, height: 11 },
-        m: { width: 18, height: 14 },
+        s: 14,
+        m: 18,
     };
-    var idLabel = "".concat(id, "-label");
-    var checkedProps = {};
-    if (typeof onChange === "function") {
-        checkedProps.checked = checked;
-    }
-    else if (checked && !onChange) {
-        checkedProps.defaultChecked = true;
-    }
+    var isControlled = typeof checked !== "undefined" && typeof onChange === "function";
+    var checkedProps = isControlled
+        ? { checked: checked }
+        : checked
+            ? { defaultChecked: true }
+            : {};
     if (!checked && onChange) {
         indeterminate = false;
     }
     if (requirementStatus === "required") {
         isRequired = true;
     }
-    return (React__default.createElement("div", { className: classNames({
+    return (React__default.createElement("label", { htmlFor: id, className: classNames({
+            "arc-CheckboxIcon": true,
+            "arc-CheckboxIcon--disabled": isDisabled,
+            "arc-CheckboxIcon--invalid": error,
+            "arc-CheckboxIcon--small": size === "s",
+            "arc-CheckboxIcon--onDarkSurface": surface === "dark",
+        }) },
+        React__default.createElement("input", __assign({ "aria-describedby": ariaDescribedBy ? ariaDescribedBy : error ? "id-error" : undefined, "aria-invalid": error, "aria-checked": checked && !indeterminate
+                ? true
+                : indeterminate && checked
+                    ? "mixed"
+                    : false, className: classNames("arc-CheckboxIcon-input"), disabled: isDisabled, id: id, name: name, onBlur: onBlur, onChange: onChange, ref: internalRef, required: isRequired, type: "checkbox", value: value }, checkedProps, props)),
+        React__default.createElement("span", { className: classNames("arc-CheckboxIcon-box") }, indeterminate ? (React__default.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 16 16", fill: "none" },
+            React__default.createElement("rect", { x: "4", y: "8", width: "7.51", height: "1", rx: "0.5", fill: "currentColor" }))) : (React__default.createElement(ThemeIcon, { icon: "checkboxChecked", size: tickSize[size] })))));
+};
+
+/**
+ *  Use `Checkbox` to allow users to select individual options.
+ */
+var Checkbox = forwardRef(function (_a) {
+    var _b = _a.checked, checked = _b === void 0 ? false : _b, errorMessage = _a.errorMessage, helper = _a.helper, id = _a.id, _c = _a.isDisabled, isDisabled = _c === void 0 ? false : _c, _d = _a.isRequired, isRequired = _d === void 0 ? false : _d, label = _a.label, _e = _a.hideLabel, hideLabel = _e === void 0 ? false : _e, name = _a.name, onBlur = _a.onBlur, onChange = _a.onChange, _f = _a.size, size = _f === void 0 ? "m" : _f, value = _a.value, _g = _a.checkboxAlignment, checkboxAlignment = _g === void 0 ? "center" : _g, _h = _a.indeterminate, indeterminate = _h === void 0 ? false : _h, _j = _a.isError, isError = _j === void 0 ? false : _j, _k = _a.isErrorAlert, isErrorAlert = _k === void 0 ? false : _k, props = __rest(_a, ["checked", "errorMessage", "helper", "id", "isDisabled", "isRequired", "label", "hideLabel", "name", "onBlur", "onChange", "size", "value", "checkboxAlignment", "indeterminate", "isError", "isErrorAlert"]);
+    var requirementStatus = useContext(Context$2).requirementStatus;
+    var surface = useContext(Context$3).surface;
+    var idError = useAriaDescribedby({
+        id: id,
+        errorMessage: errorMessage,
+    }).idError;
+    var idLabel = "".concat(id, "-label");
+    var isIndeterminate = checked ? indeterminate : false;
+    if (requirementStatus === "required") {
+        isRequired = true;
+    }
+    return (React__default.createElement("div", __assign({ className: classNames({
             "arc-Checkbox": true,
             "arc-Checkbox--disabled": isDisabled,
-            "arc-Checkbox--invalid": errorMessage,
+            "arc-Checkbox--invalid": errorMessage || isError,
             "arc-Checkbox--small": size === "s",
             "arc-Checkbox--onDarkSurface": surface === "dark",
-        }) },
+        }) }, filterAttrs(props)),
         React__default.createElement("label", { id: idLabel, htmlFor: id, className: classNames("arc-Checkbox-label", {
                 "arc-Checkbox-label--top": checkboxAlignment === "top",
             }) },
-            React__default.createElement("input", __assign({ "aria-describedby": ariaDescribedby, "aria-invalid": errorMessage ? "true" : "false", "aria-checked": checked && !indeterminate
-                    ? "true"
-                    : indeterminate && checked
-                        ? "mixed"
-                        : "false", className: "arc-Checkbox-input" }, checkedProps, { disabled: isDisabled, id: id, name: name, onBlur: onBlur, onChange: onChange, ref: synchronizeRefs, required: isRequired, type: "checkbox", value: value }, filterAttrs(props))),
-            React__default.createElement("span", { className: "arc-Checkbox-box" }, indeterminate ? (React__default.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 16 16", fill: "none" },
-                React__default.createElement("rect", { x: "4", y: "8", width: "7.51", height: "1", rx: "0.5", fill: "currentColor" }))) : (React__default.createElement("svg", { style: tickSize[size], viewBox: "0 0 18 14", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
-                React__default.createElement("path", { d: "M5.99459 14L0.350576 8.23277C0.126079 8.00285 0 7.69132 0 7.36653C0 7.04173 0.126079 6.7302 0.350576 6.50028C0.578979 6.27752 0.88258 6.15324 1.19832 6.15324C1.51405 6.15324 1.81765 6.27752 2.04606 6.50028L5.99459 10.535L15.9385 0.374054C16.0491 0.25703 16.1814 0.163688 16.3277 0.0994738C16.474 0.0352599 16.6313 0.00145997 16.7905 4.626e-05C16.9497 -0.00136745 17.1076 0.0296342 17.255 0.0912406C17.4023 0.152847 17.5362 0.243825 17.6488 0.358867C17.7614 0.473908 17.8504 0.610709 17.9107 0.761287C17.971 0.911865 18.0013 1.0732 18 1.23589C17.9986 1.39858 17.9655 1.55936 17.9026 1.70884C17.8398 1.85833 17.7485 1.99352 17.6339 2.10655L5.99459 14Z", fill: "currentColor" })))),
-            React__default.createElement("span", __assign({}, (checkboxAlignment === "top" && {
-                className: "arc-Checkbox-content--marginTop",
+            React__default.createElement(CheckboxIcon, { size: size, id: id, error: errorMessage || isError ? true : false, isDisabled: isDisabled, isRequired: isRequired, checked: checked, indeterminate: isIndeterminate, ariaDescribedBy: idError, name: name, onBlur: onBlur, onChange: onChange, value: value }),
+            React__default.createElement("span", __assign({ className: "arc-Checkbox-content" }, (checkboxAlignment === "top" && {
+                className: "arc-Checkbox-content--marginTop arc-Checkbox-content",
             })), hideLabel ? (React__default.createElement(VisuallyHidden$2, null,
                 label,
                 !isRequired && requirementStatus !== "optional" ? (React__default.createElement("span", { className: "arc-Checkbox-labelOptional" }, "(optional)")) : null,
@@ -8108,14 +8128,14 @@ var Checkbox = forwardRef(function (_a, ref) {
                 label,
                 !isRequired && requirementStatus !== "optional" ? (React__default.createElement("span", { className: "arc-Checkbox-labelOptional" }, "(optional)")) : null,
                 helper && (React__default.createElement("span", { className: "arc-Checkbox-helper" }, helper)))))),
-        errorMessage && (React__default.createElement("div", { id: idError, className: "arc-Checkbox-error" },
-            React__default.createElement("span", { className: "arc-Checkbox-error--icon" },
+        errorMessage && (React__default.createElement("div", { id: idError, className: "arc-Checkbox-error", role: isErrorAlert ? "alert" : undefined },
+            React__default.createElement("span", { className: "arc-Checkbox-error--icon", "aria-label": "Error. " },
                 React__default.createElement(ThemeIcon, { icon: "checkboxError" })),
             errorMessage))));
 });
 
 /**
- * Use `Columns` to compose layouts on a 12-column grid.
+ * Use `Columns` to compose layouts on a 12-column grid. Place within `Section` components to align with any sibling `Grid` components.
  */
 var Columns = function (_a) {
     var children = _a.children, _b = _a.isGutterless, isGutterless = _b === void 0 ? false : _b, _c = _a.isExtended, isExtended = _c === void 0 ? false : _c, props = __rest(_a, ["children", "isGutterless", "isExtended"]);
@@ -13826,8 +13846,8 @@ var ContentSwitcher = function (_a) {
 };
 
 var ContentSwitcherTab = forwardRef(function (_a, ref) {
-    var label = _a.label, value = _a.value, onClick = _a.onClick, props = __rest(_a, ["label", "value", "onClick"]);
-    return (React__default.createElement($69cb30bb0017df05$export$41fb9f06171c75f4, __assign({ className: "arc-ContentSwitcherTab", value: value, ref: ref, onClick: onClick }, filterAttrs(props)),
+    var label = _a.label, value = _a.value, onClick = _a.onClick, onFocus = _a.onFocus, props = __rest(_a, ["label", "value", "onClick", "onFocus"]);
+    return (React__default.createElement($69cb30bb0017df05$export$41fb9f06171c75f4, __assign({ className: "arc-ContentSwitcherTab", value: value, ref: ref, onClick: onClick, onFocus: onFocus }, filterAttrs(props)),
         React__default.createElement(Text, { size: "m" }, label)));
 });
 
@@ -13901,6 +13921,9 @@ var ContentSwitcherList = function (_a) {
                         onClick: function () {
                             return scrollTabIntoView({ current: tabRefs.current[index] });
                         },
+                        onFocus: function () {
+                            return scrollTabIntoView({ current: tabRefs.current[index] });
+                        },
                     });
                 }
                 else {
@@ -15143,13 +15166,16 @@ var ScrollDownButton = SelectScrollDownButton;
 
 // src/get-text-width/get-text-width.ts
 var getTextWidth = (text, font) => {
+  if (typeof document === "undefined") {
+    return 236;
+  }
   const canvas = document.createElement("canvas");
   const context = canvas.getContext("2d");
   if (context) {
     context.font = getComputedStyle(document.body).font;
     return context.measureText(text).width;
   }
-  return 0;
+  return 236;
 };
 
 var ContentSwitcherDropdown = function (_a) {
@@ -15157,15 +15183,22 @@ var ContentSwitcherDropdown = function (_a) {
     var initialValue = defaultValue || tabs[0].value;
     var _d = useThemeElement(), themeElement = _d[0], setThemeElement = _d[1];
     var _e = useState(initialValue), uncontrolledValue = _e[0], setUncontrolledValue = _e[1];
+    var _f = useState(236), longestLabelWidth = _f[0], setLongestLabelWidth = _f[1];
+    // compute longest width client side
+    useEffect(function () {
+        if (tabs.length === 0)
+            return;
+        var longestLabel = tabs.reduce(function (longest, current) {
+            return current.label.length > longest.length ? current.label : longest;
+        }, "");
+        setLongestLabelWidth(getTextWidth(longestLabel));
+    }, [tabs]);
     var isControlled = typeof value !== "undefined";
     var selectValue = isControlled ? value : uncontrolledValue;
     var onValueChangeHandler = function (value) {
         onValueChange && onValueChange(value);
         setUncontrolledValue(value);
     };
-    var LongestLabelWidth = getTextWidth(tabs.reduce(function (longest, current) {
-        return current.label.length > longest.length ? current.label : longest;
-    }, ""));
     return (React__default.createElement(React__default.Fragment, null,
         React__default.createElement(Root2$2, { defaultValue: defaultValue, onValueChange: onValueChangeHandler, value: selectValue },
             React__default.createElement("span", __assign({ className: classNames("arc-ContentSwitcherDropdown-selectTriggerWrapper", {
@@ -15173,7 +15206,7 @@ var ContentSwitcherDropdown = function (_a) {
                     "arc-ContentSwitcherDropdown-selectTriggerWrapper--isFluid": isFluid,
                 }), ref: setThemeElement }, (!isFluid && {
                 style: {
-                    width: width ? width : LongestLabelWidth + 84,
+                    width: width ? width : longestLabelWidth + 84,
                 },
             }), filterAttrs(props)),
                 React__default.createElement(Trigger$2, { className: "arc-ContentSwitcherDropdown-selectTrigger", "aria-label": ariaLabel },
@@ -15259,8 +15292,8 @@ var TextInputComponent = forwardRef(function (_a, ref) {
     });
     // Although this is used within FormControlWrapper, it's deterministic so we can call it here too
     var ariaDescribedby = useAriaDescribedby({
-        errorMessage: errorMessage,
         id: id,
+        errorMessage: errorMessage,
         helper: helper,
         disclosureText: disclosureText,
     }).ariaDescribedby;
@@ -15787,6 +15820,7 @@ var Disclosure = function (_a) {
 
 var Download = function (_a) {
     var name = _a.name, onClick = _a.onClick, description = _a.description, href = _a.href, type = _a.type, size = _a.size, _b = _a.icon, icon = _b === void 0 ? "downloadFile" : _b, _c = _a.isCompact, isCompact = _c === void 0 ? false : _c, _d = _a.isFullWidth, isFullWidth = _d === void 0 ? true : _d;
+    var surface = useContext(Context$3).surface;
     var linkProps = href
         ? {
             href: href,
@@ -15800,6 +15834,7 @@ var Download = function (_a) {
     return (React__default.createElement("a", __assign({}, linkProps, { className: classNames("arc-Download", {
             "arc-Download--maxContent": !isFullWidth,
             "arc-Download--compact": isCompact,
+            "arc-Download--onDarkSurface": surface === "dark",
         }), "aria-label": name, onClick: onClick }),
         React__default.createElement("div", { className: "arc-Download-iconContainer" },
             React__default.createElement(ThemeIcon, { size: isCompact ? 40 : 64, icon: icon })),
@@ -16114,9 +16149,12 @@ var Title = DialogTitle;
 var Description = DialogDescription;
 
 var Drawer = function (_a) {
-    var isOpen = _a.isOpen, children = _a.children, onRequestClose = _a.onRequestClose, _b = _a.noOverlay, noOverlay = _b === void 0 ? false : _b, _c = _a.shouldReturnFocus, shouldReturnFocus = _c === void 0 ? true : _c, _d = _a.size, size = _d === void 0 ? "m" : _d, height = _a.height, width = _a.width, _e = _a.position, position = _e === void 0 ? "right" : _e, props = __rest(_a, ["isOpen", "children", "onRequestClose", "noOverlay", "shouldReturnFocus", "size", "height", "width", "position"]);
-    var _f = useThemeElement(), themeElement = _f[0], setThemeElement = _f[1];
+    var isOpen = _a.isOpen, children = _a.children, onRequestClose = _a.onRequestClose, _b = _a.noOverlay, noOverlay = _b === void 0 ? false : _b, _c = _a.shouldReturnFocus, shouldReturnFocus = _c === void 0 ? true : _c, _d = _a.size, size = _d === void 0 ? "m" : _d, height = _a.height, width = _a.width, _e = _a.position, position = _e === void 0 ? "right" : _e, _f = _a.draggable, draggable = _f === void 0 ? false : _f, _g = _a.snapPoints, snapPoints = _g === void 0 ? ["30%", "60%", "90%"] : _g, _h = _a.snapBehaviour, snapBehaviour = _h === void 0 ? "nearest" : _h, dragDownToDismiss = _a.dragDownToDismiss, onDragHandleClick = _a.onDragHandleClick, ariaDescription = _a.ariaDescription, props = __rest(_a, ["isOpen", "children", "onRequestClose", "noOverlay", "shouldReturnFocus", "size", "height", "width", "position", "draggable", "snapPoints", "snapBehaviour", "dragDownToDismiss", "onDragHandleClick", "ariaDescription"]);
+    var _j = useThemeElement(), themeElement = _j[0], setThemeElement = _j[1];
     var triggerRef = useRef(null);
+    var contentRef = useRef(null);
+    var _k = useState(0), drawerHeight = _k[0], setDrawerHeight = _k[1];
+    var normalisedSnapPoints = snapPoints && snapPoints.length > 0 ? snapPoints : ["30%", "60%", "90%"];
     var setTriggerElement = function () {
         return shouldReturnFocus &&
             (triggerRef.current = document.activeElement);
@@ -16126,18 +16164,147 @@ var Drawer = function (_a) {
             triggerRef.current.focus();
         }
     };
-    var sizingProperties = __assign(__assign({}, (position !== "bottom" && { width: width })), (position === "bottom" && { height: height }));
+    var dragRef = useRef({
+        active: false,
+        startY: 0,
+        deltaY: 0,
+        startH: 0,
+    });
+    var sizingProperties = __assign(__assign({}, (position !== "bottom" && { width: width })), (position === "bottom" && { height: drawerHeight || height }));
+    var onHandleUp = function (e) {
+        onHandleUpCore(e.nativeEvent);
+    };
+    var onHandleClick = function (e) {
+        onHandleUpCore(e.nativeEvent);
+        onDragHandleClick === null || onDragHandleClick === void 0 ? void 0 : onDragHandleClick(e);
+    };
+    var onHandleMove = function (e) {
+        if (!dragRef.current.active)
+            return;
+        dragRef.current.deltaY = e.clientY - dragRef.current.startY;
+        var newHeight = dragRef.current.startH - dragRef.current.deltaY;
+        setDrawerHeight(Math.round(newHeight));
+    };
+    var resolveToPx = function (input) {
+        // if already a number, assume px
+        if (typeof input === "number")
+            return input;
+        var str = input.trim().toLowerCase();
+        if (str.endsWith("%")) {
+            var percentValue = parseFloat(str);
+            return (window.innerHeight * percentValue) / 100;
+        }
+        if (str.endsWith("px")) {
+            var pixelValue = parseFloat(str);
+            return pixelValue;
+        }
+        var numericValue = Number(str);
+        return Number.isFinite(numericValue) ? numericValue : undefined;
+    };
+    var onHandleUpCore = function (e) {
+        if (!dragRef.current.active || !contentRef.current)
+            return;
+        if (dragDownToDismiss && contentRef.current.clientHeight < 100) {
+            dragRef.current.active = false;
+            dragRef.current.deltaY = 0;
+            e.currentTarget.releasePointerCapture(e.pointerId);
+            setDrawerHeight(undefined);
+            onRequestClose();
+            return;
+        }
+        dragRef.current.active = false;
+        e.currentTarget.releasePointerCapture(e.pointerId);
+        var currentHeight = contentRef.current.clientHeight;
+        // turn all snapPoints into px values. Order the values.
+        var snapsPx = (normalisedSnapPoints !== null && normalisedSnapPoints !== void 0 ? normalisedSnapPoints : [])
+            .map(resolveToPx)
+            .filter(function (value) { return value !== undefined; }) // remove undefined values
+            .sort(function (a, b) { return a - b; });
+        var targetSnap = undefined;
+        if (snapBehaviour === "next") {
+            var deltaY = Math.sign(dragRef.current.deltaY);
+            if (deltaY === -1) {
+                // User scrolled up
+                for (var i = 0; i < snapsPx.length; i++) {
+                    if (snapsPx[i] > currentHeight) {
+                        targetSnap = snapsPx[i];
+                        break;
+                    }
+                    else if (currentHeight > snapsPx[snapsPx.length - 1]) {
+                        targetSnap = snapsPx[snapsPx.length - 1];
+                    }
+                }
+            }
+            else if (deltaY === 1) {
+                // User scrolled down
+                for (var i = 0; i < snapsPx.length; i++) {
+                    if (snapsPx[i] < currentHeight) {
+                        targetSnap = snapsPx[i];
+                    }
+                    else if (currentHeight < snapsPx[0]) {
+                        targetSnap = snapsPx[0];
+                    }
+                }
+            }
+            else if (deltaY === 0) {
+                // User clicked without moving go to next snap point
+                for (var i = 0; i < snapsPx.length; i++) {
+                    if (snapsPx[i] > currentHeight) {
+                        targetSnap = snapsPx[i];
+                        break;
+                    }
+                }
+                // If no bigger snap was found → loop back to the first
+                if (!targetSnap) {
+                    targetSnap = snapsPx[0];
+                }
+            }
+        }
+        if (snapBehaviour === "nearest") {
+            targetSnap = Math.round(snapsPx[0]);
+            var bestDiff = Math.abs(currentHeight - snapsPx[0]);
+            for (var i = 0; i < snapsPx.length; i++) {
+                var diff = Math.abs(currentHeight - snapsPx[i]);
+                if (diff < bestDiff) {
+                    targetSnap = Math.round(snapsPx[i]);
+                    bestDiff = diff;
+                }
+            }
+        }
+        if (snapBehaviour === "none") {
+            targetSnap = currentHeight;
+        }
+        setDrawerHeight(targetSnap);
+    };
+    var onHandleDown = function (e) {
+        if (!contentRef.current)
+            return;
+        dragRef.current.active = true;
+        // record where the pointer was when dragging started
+        dragRef.current.startY = e.clientY;
+        // record inital height of drawer
+        dragRef.current.startH = contentRef.current.clientHeight;
+        // keep moving drawer even if cursor has left pill
+        e.target.setPointerCapture(e.pointerId);
+    };
     return (React__default.createElement("div", { ref: setThemeElement },
         React__default.createElement(Root$3, { open: isOpen },
             React__default.createElement(Portal$3, { container: themeElement },
                 React__default.createElement(Overlay, { className: classNames("arc-Drawer-overlay", {
                         "arc-Drawer-overlay--visible": !noOverlay,
                     }) },
-                    React__default.createElement(Content$1, __assign({ className: classNames("arc-Drawer-slider", "arc-Drawer-slider--".concat(size), "arc-Drawer-slider--".concat(position)), style: __assign({}, sizingProperties), onOpenAutoFocus: setTriggerElement, onCloseAutoFocus: focusTriggerElement, onEscapeKeyDown: onRequestClose, onInteractOutside: onRequestClose, "aria-modal": "true" }, filterAttrs(props)),
-                        children,
-                        React__default.createElement("div", { className: "arc-Drawer-closeButtonContainer" },
-                            React__default.createElement("button", { "aria-label": "close", onClick: onRequestClose, className: "arc-Drawer-closeButton" },
-                                React__default.createElement(ThemeIcon, { size: 32, icon: "drawerClose" })))))))));
+                    React__default.createElement(VisuallyHidden$2, null,
+                        React__default.createElement(Description, null, ariaDescription)),
+                    React__default.createElement(Surface, { background: "light-brand-01", isTransparent: true },
+                        React__default.createElement(Content$1, __assign({ className: classNames("arc-Drawer-slider", "arc-Drawer-slider--".concat(size), "arc-Drawer-slider--".concat(position), { "arc-Drawer-slider--draggable": draggable }, {
+                                "arc-Drawer-slider--transition": !dragRef.current.active,
+                            }), style: __assign({}, sizingProperties), onOpenAutoFocus: setTriggerElement, onCloseAutoFocus: focusTriggerElement, onEscapeKeyDown: onRequestClose, onInteractOutside: onRequestClose, "aria-modal": "true", ref: contentRef }, filterAttrs(props)),
+                            React__default.createElement("div", { className: "arc-Drawer-closeButtonContainer" },
+                                React__default.createElement("button", { "aria-label": "close", onClick: onRequestClose, className: "arc-Drawer-closeButton" },
+                                    React__default.createElement(ThemeIcon, { size: 32, icon: "drawerClose" })),
+                                draggable && position === "bottom" && (React__default.createElement("div", { className: "arc-Drawer-dragHandle", onPointerDown: onHandleDown, onPointerUp: onHandleUp, onPointerMove: onHandleMove, onClick: onHandleClick, role: "separator", "aria-label": "Drag to resize the drawer" },
+                                    React__default.createElement("div", { className: "arc-Drawer-dragHandlePill", "data-testid": "arc-Drawer-dragHandlePill" })))),
+                            children)))))));
 };
 
 /**
@@ -16156,7 +16323,7 @@ var Rule = function (_a, props) {
 };
 
 var DrawerHeader = function (_a) {
-    var title = _a.title, _b = _a.isFixed, isFixed = _b === void 0 ? false : _b, props = __rest(_a, ["title", "isFixed"]);
+    var title = _a.title, _b = _a.isFixed, isFixed = _b === void 0 ? false : _b, isResponsive = _a.isResponsive, props = __rest(_a, ["title", "isFixed", "isResponsive"]);
     return (React__default.createElement(React__default.Fragment, null,
         React__default.createElement("div", __assign({ className: classNames("arc-DrawerHeader", {
                 "arc-DrawerHeader--isFixed": isFixed,
@@ -16164,7 +16331,7 @@ var DrawerHeader = function (_a) {
             React__default.createElement("div", { className: "arc-DrawerHeader-content" },
                 React__default.createElement("div", { className: "arc-DrawerHeader-titleContainer" },
                     React__default.createElement(Title, { asChild: true },
-                        React__default.createElement("h1", { className: "arc-DrawerHeader-title" }, title)))),
+                        React__default.createElement(Heading, { isResponsive: isResponsive, size: "m" }, title)))),
             isFixed && (React__default.createElement("div", { className: "arc-DrawerHeader-divider" },
                 React__default.createElement(Rule, null))))));
 };
@@ -16193,12 +16360,15 @@ var DrawerContent = function (_a) {
  */
 var Elevation = function (_a) {
     var _b;
-    var children = _a.children, _c = _a.elevationLevel, elevationLevel = _c === void 0 ? "2" : _c, _d = _a.isFullWidth, isFullWidth = _d === void 0 ? false : _d, props = __rest(_a, ["children", "elevationLevel", "isFullWidth"]);
+    var children = _a.children, _c = _a.level, level = _c === void 0 ? "5" : _c, _d = _a.isFullWidth, isFullWidth = _d === void 0 ? false : _d, props = __rest(_a, ["children", "level", "isFullWidth"]);
     return (React__default.createElement("div", __assign({ className: classNames((_b = {},
             _b["arc-Elevation"] = true,
-            _b["arc-Elevation--levelOne"] = elevationLevel === "1",
-            _b["arc-Elevation--levelTwo"] = elevationLevel === "2",
             _b["arc-Elevation--fullWidth"] = isFullWidth,
+            _b["arc-Elevation--levelOne"] = level === "1",
+            _b["arc-Elevation--levelTwo"] = level === "2",
+            _b["arc-Elevation--levelThree"] = level === "3",
+            _b["arc-Elevation--levelFour"] = level === "4",
+            _b["arc-Elevation--levelFive"] = level === "5",
             _b)) }, filterAttrs(props)), children));
 };
 
@@ -16267,297 +16437,112 @@ var Filter = function (_a) {
         // If no tags are selected, show all items
         if (selectedControls.length === 0) {
             return true;
-        }
-        // If logicType is "AND", all selected tags should be present in the item's tags
-        if (logicType === "AND") {
-            return selectedControls.every(function (control) {
-                return filteredItem.props.tags.includes(control.label);
-            });
-        }
-        else {
-            // Check if item has tags property and if any selected tags are present in item's tags
-            return selectedControls.some(function (control) {
-                return filteredItem.props.tags.includes(control.label);
-            });
-        }
-    });
-    return (React__default.createElement("div", __assign({ className: "arc-Filter" }, filterAttrs(props)),
-        React__default.createElement(FilterControls, { controlsAlignment: controlsAlignment }, filterControls.map(function (_a, index) {
-            var label = _a.label, isSelected = _a.isSelected;
-            return (React__default.createElement(FilterControl, { key: index, onClick: function () { return handleControlClick(index); }, isSelected: isSelected }, label));
-        })),
-        React__default.createElement(FilterItems, { displayType: displayType, error: error }, filteredItems.map(function (item) { return item.props.children; }))));
-};
-
-var FilterItem = function (_a) {
-    var children = _a.children;
-    return React__default.createElement("div", { className: "arc-FilterItem" }, children);
-};
-
-var GhostedHeroBanner = function (_a) {
-    var heading = _a.heading, headingLevel = _a.headingLevel, label = _a.label, text = _a.text, img = _a.img, children = _a.children, props = __rest(_a, ["heading", "headingLevel", "label", "text", "img", "children"]);
-    return (React__default.createElement("div", __assign({ className: "arc-GhostedHeroBanner" }, filterAttrs(props)),
-        React__default.createElement("div", { className: "arc-GhostedHeroBanner-content" },
-            label && (React__default.createElement(React__default.Fragment, null,
-                React__default.createElement(Heading, { fontStyle: "overline" }, label),
-                React__default.createElement(VerticalSpace, { size: "8" }))),
-            React__default.createElement(Heading, { level: headingLevel, size: "xl" }, heading),
-            text && (React__default.createElement(React__default.Fragment, null,
-                React__default.createElement(VerticalSpace, { size: "16" }),
-                React__default.createElement("span", { className: "arc-TemplateBanner-text" }, text))),
-            children && (React__default.createElement(React__default.Fragment, null,
-                React__default.createElement(VerticalSpace, { size: "32" }),
-                children))),
-        React__default.createElement("div", { className: "arc-GhostedHeroBanner-image " }, img && React__default.createElement(BannerImage, __assign({ ariaHidden: true }, img)))));
-};
-
-var shorterCssColorNames;
-var hasRequiredShorterCssColorNames;
-
-function requireShorterCssColorNames () {
-	if (hasRequiredShorterCssColorNames) return shorterCssColorNames;
-	hasRequiredShorterCssColorNames = 1;
-	shorterCssColorNames = {
-	  aqua: /#00ffff(ff)?(?!\w)|#0ff(f)?(?!\w)/gi,
-	  azure: /#f0ffff(ff)?(?!\w)/gi,
-	  beige: /#f5f5dc(ff)?(?!\w)/gi,
-	  bisque: /#ffe4c4(ff)?(?!\w)/gi,
-	  black: /#000000(ff)?(?!\w)|#000(f)?(?!\w)/gi,
-	  blue: /#0000ff(ff)?(?!\w)|#00f(f)?(?!\w)/gi,
-	  brown: /#a52a2a(ff)?(?!\w)/gi,
-	  coral: /#ff7f50(ff)?(?!\w)/gi,
-	  cornsilk: /#fff8dc(ff)?(?!\w)/gi,
-	  crimson: /#dc143c(ff)?(?!\w)/gi,
-	  cyan: /#00ffff(ff)?(?!\w)|#0ff(f)?(?!\w)/gi,
-	  darkblue: /#00008b(ff)?(?!\w)/gi,
-	  darkcyan: /#008b8b(ff)?(?!\w)/gi,
-	  darkgrey: /#a9a9a9(ff)?(?!\w)/gi,
-	  darkred: /#8b0000(ff)?(?!\w)/gi,
-	  deeppink: /#ff1493(ff)?(?!\w)/gi,
-	  dimgrey: /#696969(ff)?(?!\w)/gi,
-	  gold: /#ffd700(ff)?(?!\w)/gi,
-	  green: /#008000(ff)?(?!\w)/gi,
-	  grey: /#808080(ff)?(?!\w)/gi,
-	  honeydew: /#f0fff0(ff)?(?!\w)/gi,
-	  hotpink: /#ff69b4(ff)?(?!\w)/gi,
-	  indigo: /#4b0082(ff)?(?!\w)/gi,
-	  ivory: /#fffff0(ff)?(?!\w)/gi,
-	  khaki: /#f0e68c(ff)?(?!\w)/gi,
-	  lavender: /#e6e6fa(ff)?(?!\w)/gi,
-	  lime: /#00ff00(ff)?(?!\w)|#0f0(f)?(?!\w)/gi,
-	  linen: /#faf0e6(ff)?(?!\w)/gi,
-	  maroon: /#800000(ff)?(?!\w)/gi,
-	  moccasin: /#ffe4b5(ff)?(?!\w)/gi,
-	  navy: /#000080(ff)?(?!\w)/gi,
-	  oldlace: /#fdf5e6(ff)?(?!\w)/gi,
-	  olive: /#808000(ff)?(?!\w)/gi,
-	  orange: /#ffa500(ff)?(?!\w)/gi,
-	  orchid: /#da70d6(ff)?(?!\w)/gi,
-	  peru: /#cd853f(ff)?(?!\w)/gi,
-	  pink: /#ffc0cb(ff)?(?!\w)/gi,
-	  plum: /#dda0dd(ff)?(?!\w)/gi,
-	  purple: /#800080(ff)?(?!\w)/gi,
-	  red: /#ff0000(ff)?(?!\w)|#f00(f)?(?!\w)/gi,
-	  salmon: /#fa8072(ff)?(?!\w)/gi,
-	  seagreen: /#2e8b57(ff)?(?!\w)/gi,
-	  seashell: /#fff5ee(ff)?(?!\w)/gi,
-	  sienna: /#a0522d(ff)?(?!\w)/gi,
-	  silver: /#c0c0c0(ff)?(?!\w)/gi,
-	  skyblue: /#87ceeb(ff)?(?!\w)/gi,
-	  snow: /#fffafa(ff)?(?!\w)/gi,
-	  tan: /#d2b48c(ff)?(?!\w)/gi,
-	  teal: /#008080(ff)?(?!\w)/gi,
-	  thistle: /#d8bfd8(ff)?(?!\w)/gi,
-	  tomato: /#ff6347(ff)?(?!\w)/gi,
-	  violet: /#ee82ee(ff)?(?!\w)/gi,
-	  wheat: /#f5deb3(ff)?(?!\w)/gi,
-	  white: /#ffffff(ff)?(?!\w)|#fff(f)?(?!\w)/gi,
-	};
-	return shorterCssColorNames;
-}
-
-var miniSvgDataUri;
-var hasRequiredMiniSvgDataUri;
-
-function requireMiniSvgDataUri () {
-	if (hasRequiredMiniSvgDataUri) return miniSvgDataUri;
-	hasRequiredMiniSvgDataUri = 1;
-	var shorterNames = requireShorterCssColorNames();
-	var REGEX = {
-	  whitespace: /\s+/g,
-	  urlHexPairs: /%[\dA-F]{2}/g,
-	  quotes: /"/g,
-	};
-
-	function collapseWhitespace(str) {
-	  return str.trim().replace(REGEX.whitespace, ' ');
-	}
-
-	function dataURIPayload(string) {
-	  return encodeURIComponent(string)
-	    .replace(REGEX.urlHexPairs, specialHexEncode);
-	}
-
-	// `#` gets converted to `%23`, so quite a few CSS named colors are shorter than
-	// their equivalent URL-encoded hex codes.
-	function colorCodeToShorterNames(string) {
-	  Object.keys(shorterNames).forEach(function(key) {
-	    if (shorterNames[key].test(string)) {
-	      string = string.replace(shorterNames[key], key);
-	    }
-	  });
-
-	  return string;
-	}
-
-	function specialHexEncode(match) {
-	  switch (match) { // Browsers tolerate these characters, and they're frequent
-	    case '%20': return ' ';
-	    case '%3D': return '=';
-	    case '%3A': return ':';
-	    case '%2F': return '/';
-	    default: return match.toLowerCase(); // compresses better
-	  }
-	}
-
-	function svgToTinyDataUri(svgString) {
-	  if (typeof svgString !== 'string') {
-	    throw new TypeError('Expected a string, but received ' + typeof svgString);
-	  }
-	  // Strip the Byte-Order Mark if the SVG has one
-	  if (svgString.charCodeAt(0) === 0xfeff) { svgString = svgString.slice(1); }
-
-	  var body = colorCodeToShorterNames(collapseWhitespace(svgString))
-	    .replace(REGEX.quotes, "'");
-	  return 'data:image/svg+xml,' + dataURIPayload(body);
-	}
-
-	svgToTinyDataUri.toSrcset = function toSrcset(svgString) {
-	  return svgToTinyDataUri(svgString).replace(/ /g, '%20');
-	};
-
-	miniSvgDataUri = svgToTinyDataUri;
-	return miniSvgDataUri;
-}
-
-var miniSvgDataUriExports = requireMiniSvgDataUri();
-var svgToMiniDataURI = /*@__PURE__*/getDefaultExportFromCjs(miniSvgDataUriExports);
-
-var S_BREAKPOINT = "(min-width: ".concat(ArcSizeBreakpointsS, ")");
-var M_BREAKPOINT = "(min-width: ".concat(ArcSizeBreakpointsM, ")");
-var L_BREAKPOINT = "(min-width: ".concat(ArcSizeBreakpointsL, ")");
-var XL_BREAKPOINT = "(min-width: ".concat(ArcSizeBreakpointsXl, ")");
-
-var HomepageDark1 = "\n  <svg\n    viewBox=\"0 0 1280 1280\"\n    fill=\"none\"\n    xmlns=\"http://www.w3.org/2000/svg\"\n    preserveAspectRatio=\"none\"\n  >\n    <g clipPath=\"url(#clip0_6783_736)\">\n      <g clipPath=\"url(#clip1_6783_736)\">\n        <path\n          d=\"M-6.26531 52.9727L66.2344 94.4728V177.473L-6.26531 218.973L-78.7656 177.473V94.4728L-6.26531 52.9727Z\"\n          fill=\"#8D248D\"\n        />\n        <path\n          d=\"M-6.26531 797.973L66.2344 839.474V922.471L-6.26531 963.973L-78.7656 922.471V839.474L-6.26531 797.973Z\"\n          fill=\"#9E1DBE\"\n        />\n        <path\n          d=\"M710.235 51.9727L782.234 93.7228V177.223L710.235 218.973L638.234 177.223V93.7228L710.235 51.9727Z\"\n          fill=\"#5E3690\"\n        />\n        <path\n          d=\"M710.235 797.973L782.234 839.474V922.471L710.235 963.973L638.234 922.471V839.474L710.235 797.973Z\"\n          fill=\"#A73BC6\"\n        />\n        <path\n          d=\"M-6.26531 300.973L66.2344 342.723V426.223L-6.26531 467.973L-78.7656 426.223V342.723L-6.26531 300.973Z\"\n          fill=\"#9F21A2\"\n        />\n        <path\n          d=\"M-6.26531 1045.97L66.2344 1087.47V1170.47L-6.26531 1211.97L-78.7656 1170.47V1087.47L-6.26531 1045.97Z\"\n          fill=\"#9723C0\"\n        />\n        <path\n          d=\"M710.235 299.973L782.234 341.723V425.223L710.235 466.973L638.234 425.223V341.723L710.235 299.973Z\"\n          fill=\"#803EBA\"\n        />\n        <path\n          d=\"M709.235 1045.97L781.234 1087.47V1170.47L709.235 1211.97L637.234 1170.47V1087.47L709.235 1045.97Z\"\n          fill=\"#B03EC0\"\n        />\n        <path\n          d=\"M-6.26531 548.973L66.2344 590.723V674.223L-6.26531 715.973L-78.7656 674.223V590.723L-6.26531 548.973Z\"\n          fill=\"#A61DB7\"\n        />\n        <path\n          d=\"M710.235 547.973L782.234 589.723V673.223L710.235 714.973L638.234 673.223V589.723L710.235 547.973Z\"\n          fill=\"#9C38CB\"\n        />\n        <path\n          d=\"M66.2343 -71.0273L138.234 -29.2773V54.2228L66.2343 95.9727L-5.76562 54.2228V-29.2773L66.2343 -71.0273Z\"\n          fill=\"#8D248D\"\n        />\n        <path\n          d=\"M65.2343 672.973L137.234 714.723V798.22L65.2343 839.973L-6.76562 798.22V714.723L65.2343 672.973Z\"\n          fill=\"#9D1EBA\"\n        />\n        <path\n          d=\"M781.234 -72.0273L853.234 -30.2773V53.2228L781.234 94.9727L709.234 53.2228V-30.2773L781.234 -72.0273Z\"\n          fill=\"#3B4C90\"\n        />\n        <path\n          d=\"M781.234 672.973L853.234 714.723V798.22L781.234 839.973L709.234 798.22V714.723L781.234 672.973Z\"\n          fill=\"#9644CE\"\n        />\n        <path\n          d=\"M65.2343 176.973L137.234 218.473V301.473L65.2343 342.973L-6.76562 301.473V218.473L65.2343 176.973Z\"\n          fill=\"#8E218F\"\n        />\n        <path\n          d=\"M64.2343 921.973L136.234 963.719V1047.23L64.2343 1088.97L-7.76562 1047.23V963.719L64.2343 921.973Z\"\n          fill=\"#9523C0\"\n        />\n        <path\n          d=\"M781.234 175.973L853.234 217.473V300.473L781.234 341.973L709.234 300.473V217.473L781.234 175.973Z\"\n          fill=\"#5848A3\"\n        />\n        <path\n          d=\"M781.234 920.973L853.234 962.719V1046.23L781.234 1087.97L709.234 1046.23V962.719L781.234 920.973Z\"\n          fill=\"#A547C4\"\n        />\n        <path\n          d=\"M66.2343 424.973L138.234 466.473V549.473L66.2343 590.973L-5.76562 549.473V466.473L66.2343 424.973Z\"\n          fill=\"#A21FAC\"\n        />\n        <path\n          d=\"M66.2343 1168.97L138.234 1210.47V1293.47L66.2343 1334.97L-5.76562 1293.47V1210.47L66.2343 1168.97Z\"\n          fill=\"#9723C0\"\n        />\n        <path\n          d=\"M781.234 423.973L853.234 465.473V548.473L781.234 589.973L709.234 548.473V465.473L781.234 423.973Z\"\n          fill=\"#844BCE\"\n        />\n        <path\n          d=\"M781.234 1168.97L853.234 1210.47V1293.47L781.234 1334.97L709.234 1293.47V1210.47L781.234 1168.97Z\"\n          fill=\"#B03EC0\"\n        />\n        <path\n          d=\"M137.734 52.9727L209.234 94.7228V178.223L137.734 219.973L66.2344 178.223V94.7228L137.734 52.9727Z\"\n          fill=\"#8D248D\"\n        />\n        <path\n          d=\"M136.734 797.973L208.234 839.474V922.471L136.734 963.973L65.2344 922.471V839.474L136.734 797.973Z\"\n          fill=\"#9E1DBE\"\n        />\n        <path\n          d=\"M853.234 51.9727L925.234 93.7228V177.223L853.234 218.973L781.234 177.223V93.7228L853.234 51.9727Z\"\n          fill=\"#3B4C90\"\n        />\n        <path\n          d=\"M853.234 796.973L925.234 838.474V921.471L853.234 962.973L781.234 921.471V838.474L853.234 796.973Z\"\n          fill=\"#934ECC\"\n        />\n        <path\n          d=\"M136.734 300.973L208.234 342.723V426.223L136.734 467.973L65.2344 426.223V342.723L136.734 300.973Z\"\n          fill=\"#9F21A2\"\n        />\n        <path\n          d=\"M137.734 1045.97L209.234 1087.47V1170.47L137.734 1211.97L66.2344 1170.47V1087.47L137.734 1045.97Z\"\n          fill=\"#9723C0\"\n        />\n        <path\n          d=\"M853.234 299.973L925.234 341.723V425.223L853.234 466.973L781.234 425.223V341.723L853.234 299.973Z\"\n          fill=\"#585BBC\"\n        />\n        <path\n          d=\"M853.234 1044.97L925.234 1086.47V1169.47L853.234 1210.97L781.234 1169.47V1086.47L853.234 1044.97Z\"\n          fill=\"#9F50C4\"\n        />\n        <path\n          d=\"M137.734 548.973L209.234 590.723V674.223L137.734 715.973L66.2344 674.223V590.723L137.734 548.973Z\"\n          fill=\"#A61DB7\"\n        />\n        <path\n          d=\"M852.234 547.973L924.234 589.723V673.223L852.234 714.973L780.234 673.223V589.723L852.234 547.973Z\"\n          fill=\"#7D54D4\"\n        />\n        <path\n          d=\"M208.734 -71.0273L280.234 -29.2773V54.2228L208.734 95.9727L137.234 54.2228V-29.2773L208.734 -71.0273Z\"\n          fill=\"#A4329B\"\n        />\n        <path\n          d=\"M208.234 672.973L280.234 714.723V798.22L208.234 839.973L136.234 798.22V714.723L208.234 672.973Z\"\n          fill=\"#A718BC\"\n        />\n        <path\n          d=\"M923.734 -72.0273L995.234 -30.2773V53.2228L923.734 94.9727L852.234 53.2228V-30.2773L923.734 -72.0273Z\"\n          fill=\"#2B548D\"\n        />\n        <path\n          d=\"M923.734 671.973L995.234 713.723V797.22L923.734 838.973L852.234 797.22V713.723L923.734 671.973Z\"\n          fill=\"#745FD7\"\n        />\n        <path\n          d=\"M208.234 177.973L280.234 219.473V302.473L208.234 343.973L136.234 302.473V219.473L208.234 177.973Z\"\n          fill=\"#A0279D\"\n        />\n        <path\n          d=\"M208.234 920.973L280.234 962.719V1046.23L208.234 1087.97L136.234 1046.23V962.719L208.234 920.973Z\"\n          fill=\"#A01BC0\"\n        />\n        <path\n          d=\"M923.734 176.973L995.234 218.473V301.473L923.734 342.973L852.234 301.473V218.473L923.734 176.973Z\"\n          fill=\"#375BA2\"\n        />\n        <path\n          d=\"M923.734 919.973L995.234 961.719V1045.23L923.734 1086.97L852.234 1045.23V961.719L923.734 919.973Z\"\n          fill=\"#8F54CE\"\n        />\n        <path\n          d=\"M208.234 424.973L280.234 466.473V549.473L208.234 590.973L136.234 549.473V466.473L208.234 424.973Z\"\n          fill=\"#AF1FB4\"\n        />\n        <path\n          d=\"M209.234 1168.97L281.234 1210.47V1293.47L209.234 1334.97L137.234 1293.47V1210.47L209.234 1168.97Z\"\n          fill=\"#9723C0\"\n        />\n        <path\n          d=\"M923.734 423.973L995.234 465.473V548.473L923.734 589.973L852.234 548.473V465.473L923.734 423.973Z\"\n          fill=\"#586DD4\"\n        />\n        <path\n          d=\"M923.734 1168.97L995.234 1210.47V1293.47L923.734 1334.97L852.234 1293.47V1210.47L923.734 1168.97Z\"\n          fill=\"#9F50C4\"\n        />\n        <path\n          d=\"M279.734 52.9727L352.234 94.7228V178.223L279.734 219.973L207.234 178.223V94.7228L279.734 52.9727Z\"\n          fill=\"#A4329B\"\n        />\n        <path\n          d=\"M279.734 796.973L352.234 838.474V921.471L279.734 962.973L207.234 921.471V838.474L279.734 796.973Z\"\n          fill=\"#AA13BE\"\n        />\n        <path\n          d=\"M995.234 52.9727L1067.23 94.7228V178.223L995.234 219.973L923.234 178.223V94.7228L995.234 52.9727Z\"\n          fill=\"#2B548D\"\n        />\n        <path\n          d=\"M995.234 795.973L1067.23 837.474V920.471L995.234 961.973L923.234 920.471V837.474L995.234 795.973Z\"\n          fill=\"#7162DA\"\n        />\n        <path\n          d=\"M280.734 300.973L353.234 342.723V426.223L280.734 467.973L208.234 426.223V342.723L280.734 300.973Z\"\n          fill=\"#B329AE\"\n        />\n        <path\n          d=\"M280.734 1044.97L353.234 1086.47V1169.47L280.734 1210.97L208.234 1169.47V1086.47L280.734 1044.97Z\"\n          fill=\"#A816C0\"\n        />\n        <path\n          d=\"M995.234 299.973L1067.23 341.723V425.223L995.234 466.973L923.234 425.223V341.723L995.234 299.973Z\"\n          fill=\"#366BB9\"\n        />\n        <path\n          d=\"M995.234 1044.97L1067.23 1086.47V1169.47L995.234 1210.97L923.234 1169.47V1086.47L995.234 1044.97Z\"\n          fill=\"#8A51D5\"\n        />\n        <path\n          d=\"M279.734 548.973L352.234 590.723V674.223L279.734 715.973L207.234 674.223V590.723L279.734 548.973Z\"\n          fill=\"#B217BB\"\n        />\n        <path\n          d=\"M995.234 546.973L1067.23 588.723V672.223L995.234 713.973L923.234 672.223V588.723L995.234 546.973Z\"\n          fill=\"#487BDD\"\n        />\n        <path\n          d=\"M351.234 -71.0273L423.234 -29.2773V54.2228L351.234 95.9727L279.234 54.2228V-29.2773L351.234 -71.0273Z\"\n          fill=\"#982994\"\n        />\n        <path\n          d=\"M351.734 672.973L423.234 714.723V798.22L351.734 839.973L280.234 798.22V714.723L351.734 672.973Z\"\n          fill=\"#B312BD\"\n        />\n        <path\n          d=\"M1066.23 -72.0273L1138.23 -30.2773V53.2228L1066.23 94.9727L994.234 53.2228V-30.2773L1066.23 -72.0273Z\"\n          fill=\"#2F558B\"\n        />\n        <path\n          d=\"M1066.23 670.973L1138.23 712.723V796.22L1066.23 837.973L994.234 796.22V712.723L1066.23 670.973Z\"\n          fill=\"#457EE2\"\n        />\n        <path\n          d=\"M351.734 177.973L423.234 219.473V302.473L351.734 343.973L280.234 302.473V219.473L351.734 177.973Z\"\n          fill=\"#AE2FA6\"\n        />\n        <path\n          d=\"M351.734 920.973L423.234 962.719V1046.23L351.734 1087.97L280.234 1046.23V962.719L351.734 920.973Z\"\n          fill=\"#B012C0\"\n        />\n        <path\n          d=\"M1066.23 176.973L1138.23 218.473V301.473L1066.23 342.973L994.234 301.473V218.473L1066.23 176.973Z\"\n          fill=\"#2C5C9A\"\n        />\n        <path\n          d=\"M1067.23 919.973L1139.23 961.719V1045.23L1067.23 1086.97L995.234 1045.23V961.719L1067.23 919.973Z\"\n          fill=\"#7858E0\"\n        />\n        <path\n          d=\"M350.734 425.973L422.234 467.473V550.473L350.734 591.973L279.234 550.473V467.473L350.734 425.973Z\"\n          fill=\"#BB1FBB\"\n        />\n        <path\n          d=\"M351.734 1168.97L423.234 1210.47V1293.47L351.734 1334.97L280.234 1293.47V1210.47L351.734 1168.97Z\"\n          fill=\"#A816C0\"\n        />\n        <path\n          d=\"M1066.23 423.973L1138.23 465.473V548.473L1066.23 589.973L994.234 548.473V465.473L1066.23 423.973Z\"\n          fill=\"#3280D1\"\n        />\n        <path\n          d=\"M1066.23 1167.97L1138.23 1209.47V1292.47L1066.23 1333.97L994.234 1292.47V1209.47L1066.23 1167.97Z\"\n          fill=\"#8A51D5\"\n        />\n        <path\n          d=\"M423.234 52.9727L495.234 94.7228V178.223L423.234 219.973L351.234 178.223V94.7228L423.234 52.9727Z\"\n          fill=\"#982994\"\n        />\n        <path\n          d=\"M423.234 796.973L495.234 838.474V921.471L423.234 962.973L351.234 921.471V838.474L423.234 796.973Z\"\n          fill=\"#B615BF\"\n        />\n        <path\n          d=\"M1138.23 51.9727L1210.23 93.7228V177.223L1138.23 218.973L1066.23 177.223V93.7228L1138.23 51.9727Z\"\n          fill=\"#2F558B\"\n        />\n        <path\n          d=\"M1137.23 795.973L1209.23 837.474V920.471L1137.23 961.973L1065.23 920.471V837.474L1137.23 795.973Z\"\n          fill=\"#586DE3\"\n        />\n        <path\n          d=\"M423.234 300.973L495.234 342.723V426.223L423.234 467.973L351.234 426.223V342.723L423.234 300.973Z\"\n          fill=\"#B223B1\"\n        />\n        <path\n          d=\"M423.234 1044.97L495.234 1086.47V1169.47L423.234 1210.97L351.234 1169.47V1086.47L423.234 1044.97Z\"\n          fill=\"#BA19C2\"\n        />\n        <path\n          d=\"M1138.23 299.973L1210.23 341.723V425.223L1138.23 466.973L1066.23 425.223V341.723L1138.23 299.973Z\"\n          fill=\"#2D6BB1\"\n        />\n        <path\n          d=\"M1138.23 1043.97L1210.23 1085.47V1168.47L1138.23 1209.97L1066.23 1168.47V1085.47L1138.23 1043.97Z\"\n          fill=\"#8452E3\"\n        />\n        <path\n          d=\"M423.234 548.973L495.234 590.723V674.223L423.234 715.973L351.234 674.223V590.723L423.234 548.973Z\"\n          fill=\"#B717BD\"\n        />\n        <path\n          d=\"M1138.23 546.973L1210.23 588.723V672.223L1138.23 713.973L1066.23 672.223V588.723L1138.23 546.973Z\"\n          fill=\"#2E8AE0\"\n        />\n        <path\n          d=\"M494.734 -72.0273L567.234 -30.2773V53.2228L494.734 94.9727L422.234 53.2228V-30.2773L494.734 -72.0273Z\"\n          fill=\"#822190\"\n        />\n        <path\n          d=\"M494.734 672.973L567.234 714.723V798.22L494.734 839.973L422.234 798.22V714.723L494.734 672.973Z\"\n          fill=\"#B61CBF\"\n        />\n        <path\n          d=\"M1209.23 -72.0273L1281.23 -30.2773V53.2228L1209.23 94.9727L1137.23 53.2228V-30.2773L1209.23 -72.0273Z\"\n          fill=\"#2F558B\"\n        />\n        <path\n          d=\"M1209.23 671.973L1281.23 713.723V797.22L1209.23 838.973L1137.23 797.22V713.723L1209.23 671.973Z\"\n          fill=\"#3C85E3\"\n        />\n        <path\n          d=\"M494.734 176.973L567.234 218.473V301.473L494.734 342.973L422.234 301.473V218.473L494.734 176.973Z\"\n          fill=\"#9F22A3\"\n        />\n        <path\n          d=\"M494.734 920.973L567.234 962.719V1046.23L494.734 1087.97L422.234 1046.23V962.719L494.734 920.973Z\"\n          fill=\"#BC22C1\"\n        />\n        <path\n          d=\"M1209.23 175.973L1281.23 217.473V300.473L1209.23 341.973L1137.23 300.473V217.473L1209.23 175.973Z\"\n          fill=\"#2E5B96\"\n        />\n        <path\n          d=\"M1209.23 918.973L1281.23 960.719V1044.23L1209.23 1085.97L1137.23 1044.23V960.719L1209.23 918.973Z\"\n          fill=\"#745CE6\"\n        />\n        <path\n          d=\"M494.734 424.973L567.234 466.473V549.473L494.734 590.973L422.234 549.473V466.473L494.734 424.973Z\"\n          fill=\"#B51EBD\"\n        />\n        <path\n          d=\"M494.734 1168.97L567.234 1210.47V1293.47L494.734 1334.97L422.234 1293.47V1210.47L494.734 1168.97Z\"\n          fill=\"#BA19C2\"\n        />\n        <path\n          d=\"M1209.23 423.973L1281.23 465.473V548.473L1209.23 589.973L1137.23 548.473V465.473L1209.23 423.973Z\"\n          fill=\"#2C82CE\"\n        />\n        <path\n          d=\"M1209.23 1167.97L1281.23 1209.47V1292.47L1209.23 1333.97L1137.23 1292.47V1209.47L1209.23 1167.97Z\"\n          fill=\"#8452E3\"\n        />\n        <path\n          d=\"M567.234 52.9727L639.234 94.7228V178.223L567.234 219.973L495.234 178.223V94.7228L567.234 52.9727Z\"\n          fill=\"#822190\"\n        />\n        <path\n          d=\"M567.234 797.973L639.234 839.474V922.471L567.234 963.973L495.234 922.471V839.474L567.234 797.973Z\"\n          fill=\"#B628C1\"\n        />\n        <path\n          d=\"M1280.74 51.9727L1352.23 93.7228V177.223L1280.74 218.973L1209.23 177.223V93.7228L1280.74 51.9727Z\"\n          fill=\"#2E5B96\"\n        />\n        <path\n          d=\"M1280.74 795.973L1352.23 837.474V920.471L1280.74 961.973L1209.23 920.471V837.474L1280.74 795.973Z\"\n          fill=\"#586DE3\"\n        />\n        <path\n          d=\"M567.234 300.973L639.234 342.723V426.223L567.234 467.973L495.234 426.223V342.723L567.234 300.973Z\"\n          fill=\"#A124B3\"\n        />\n        <path\n          d=\"M566.234 1045.97L638.234 1087.47V1170.47L566.234 1211.97L494.234 1170.47V1087.47L566.234 1045.97Z\"\n          fill=\"#BD2EC0\"\n        />\n        <path\n          d=\"M1280.74 298.973L1352.23 340.723V424.223L1280.74 465.973L1209.23 424.223V340.723L1280.74 298.973Z\"\n          fill=\"#2D6BB1\"\n        />\n        <path\n          d=\"M1280.74 1043.97L1352.23 1085.47V1168.47L1280.74 1209.97L1209.23 1168.47V1085.47L1280.74 1043.97Z\"\n          fill=\"#745CE6\"\n        />\n        <path\n          d=\"M567.234 548.973L639.234 590.723V674.223L567.234 715.973L495.234 674.223V590.723L567.234 548.973Z\"\n          fill=\"#AE24C2\"\n        />\n        <path\n          d=\"M1280.74 546.973L1352.23 588.723V672.223L1280.74 713.973L1209.23 672.223V588.723L1280.74 546.973Z\"\n          fill=\"#2E8AE0\"\n        />\n        <path\n          d=\"M638.234 -72.0273L710.234 -30.2773V53.2228L638.234 94.9727L566.234 53.2228V-30.2773L638.234 -72.0273Z\"\n          fill=\"#5E3690\"\n        />\n        <path\n          d=\"M638.234 672.973L710.234 714.723V798.22L638.234 839.973L566.234 798.22V714.723L638.234 672.973Z\"\n          fill=\"#AA2EC5\"\n        />\n        <path\n          d=\"M638.234 176.973L710.234 218.473V301.473L638.234 342.973L566.234 301.473V218.473L638.234 176.973Z\"\n          fill=\"#812CA2\"\n        />\n        <path\n          d=\"M638.234 920.973L710.234 962.719V1046.23L638.234 1087.97L566.234 1046.23V962.719L638.234 920.973Z\"\n          fill=\"#B535C1\"\n        />\n        <path\n          d=\"M638.234 424.973L710.234 466.473V549.473L638.234 590.973L566.234 549.473V466.473L638.234 424.973Z\"\n          fill=\"#A42FC5\"\n        />\n        <path\n          d=\"M637.234 1169.97L709.234 1211.47V1294.47L637.234 1335.97L565.234 1294.47V1211.47L637.234 1169.97Z\"\n          fill=\"#BD2EC0\"\n        />\n      </g>\n    </g>\n    <defs>\n      <clipPath id=\"clip0_6783_736\">\n        <rect width=\"1280\" height=\"1280\" fill=\"white\" />\n      </clipPath>\n      <clipPath id=\"clip1_6783_736\">\n        <rect width=\"1280\" height=\"1280\" fill=\"white\" />\n      </clipPath>\n    </defs>\n  </svg>";
-
-var HomepageDark2 = "\n  <svg\n    viewBox=\"0 0 1280 1280\"\n    fill=\"none\"\n    xmlns=\"http://www.w3.org/2000/svg\"\n    preserveAspectRatio=\"none\"\n  >\n    <g clipPath=\"url(#clip0_6783_975)\">\n      <path\n        d=\"M71.2233 23.4434L183.189 88.1695V217.622L71.2233 282.348L-40.7422 217.622V88.1695L71.2233 23.4434Z\"\n        fill=\"#4C14B3\"\n      />\n      <path\n        d=\"M183.223 -169.557L295.189 -104.831V24.6216L183.223 89.3477L71.2578 24.6216V-104.831L183.223 -169.557Z\"\n        fill=\"#4C14B3\"\n      />\n      <path\n        d=\"M-40.0346 -170L71.9309 -105.274V24.1783L-40.0346 88.9044L-152 24.1783V-105.274L-40.0346 -170Z\"\n        fill=\"#4C14B3\"\n      />\n      <path\n        d=\"M71.2233 409.033L183.189 473.759V603.211L71.2233 667.938L-40.7422 603.211V473.759L71.2233 409.033Z\"\n        fill=\"#5414B4\"\n      />\n      <path\n        d=\"M71.2233 795.176L183.189 859.764V988.939L71.2233 1053.53L-40.7422 988.939V859.764L71.2233 795.176Z\"\n        fill=\"#641DBA\"\n      />\n      <path\n        d=\"M182.919 216.621L294.884 281.209V410.384L182.919 474.972L70.9531 410.384V281.209L182.919 216.621Z\"\n        fill=\"#4B11B2\"\n      />\n      <path\n        d=\"M-40.0814 216.621L71.884 281.209V410.384L-40.0814 474.972L-152.047 410.384V281.209L-40.0814 216.621Z\"\n        fill=\"#4B11B2\"\n      />\n      <path\n        d=\"M182.919 602.211L294.884 666.937V796.389L182.919 861.115L70.9531 796.389V666.937L182.919 602.211Z\"\n        fill=\"#6A20BD\"\n      />\n      <path\n        d=\"M-40.0814 602.211L71.884 666.937V796.389L-40.0814 861.115L-152.047 796.389V666.937L-40.0814 602.211Z\"\n        fill=\"#6A20BD\"\n      />\n      <path\n        d=\"M182.919 987.801L294.884 1052.53V1181.98L182.919 1246.71L70.9531 1181.98V1052.53L182.919 987.801Z\"\n        fill=\"#5C19B6\"\n      />\n      <path\n        d=\"M-40.0814 988.801L71.884 1053.53V1182.98L-40.0814 1247.71L-152.047 1182.98V1053.53L-40.0814 988.801Z\"\n        fill=\"#5C19B6\"\n      />\n      <path\n        d=\"M71.9186 1181.8L183.884 1246.53V1375.98L71.9186 1440.71L-40.0469 1375.98V1246.53L71.9186 1181.8Z\"\n        fill=\"#5C19B6\"\n      />\n      <path\n        d=\"M294.919 1181.8L406.884 1246.53V1375.98L294.919 1440.71L182.953 1375.98V1246.53L294.919 1181.8Z\"\n        fill=\"#5C19B6\"\n      />\n      <path\n        d=\"M295.161 23.4434L407.126 88.1695V217.622L295.161 282.348L183.195 217.622V88.1695L295.161 23.4434Z\"\n        fill=\"#5215B4\"\n      />\n      <path\n        d=\"M407.161 -170.557L519.126 -105.831V23.6216L407.161 88.3477L295.195 23.6216V-105.831L407.161 -170.557Z\"\n        fill=\"#5215B4\"\n      />\n      <path\n        d=\"M295.161 409.033L407.126 473.759V603.211L295.161 667.938L183.195 603.211V473.759L295.161 409.033Z\"\n        fill=\"#5817B5\"\n      />\n      <path\n        d=\"M295.161 795.176L407.126 859.764V988.939L295.161 1053.53L183.195 988.939V859.764L295.161 795.176Z\"\n        fill=\"#6F25C0\"\n      />\n      <path\n        d=\"M406.848 216.621L518.814 281.209V410.384L406.848 474.972L294.883 410.384V281.209L406.848 216.621Z\"\n        fill=\"#5813B4\"\n      />\n      <path\n        d=\"M406.848 602.211L518.814 666.937V796.389L406.848 861.115L294.883 796.389V666.937L406.848 602.211Z\"\n        fill=\"#7431C4\"\n      />\n      <path\n        d=\"M406.848 987.801L518.814 1052.53V1181.98L406.848 1246.71L294.883 1181.98V1052.53L406.848 987.801Z\"\n        fill=\"#621EBB\"\n      />\n      <path\n        d=\"M518.848 1181.8L630.814 1246.53V1375.98L518.848 1440.71L406.883 1375.98V1246.53L518.848 1181.8Z\"\n        fill=\"#621EBB\"\n      />\n      <path\n        d=\"M519.09 23.4434L631.056 88.1695V217.622L519.09 282.348L407.125 217.622V88.1695L519.09 23.4434Z\"\n        fill=\"#610DB1\"\n      />\n      <path\n        d=\"M631.09 -170.557L743.056 -105.831V23.6216L631.09 88.3477L519.125 23.6216V-105.831L631.09 -170.557Z\"\n        fill=\"#610DB1\"\n      />\n      <path\n        d=\"M519.09 409.033L631.056 473.759V603.211L519.09 667.938L407.125 603.211V473.759L519.09 409.033Z\"\n        fill=\"#6629BD\"\n      />\n      <path\n        d=\"M519.09 795.176L631.056 859.764V988.939L519.09 1053.53L407.125 988.939V859.764L519.09 795.176Z\"\n        fill=\"#783CC8\"\n      />\n      <path\n        d=\"M630.778 216.621L742.743 281.209V410.384L630.778 474.972L518.812 410.384V281.209L630.778 216.621Z\"\n        fill=\"#6614B5\"\n      />\n      <path\n        d=\"M630.778 602.211L742.743 666.937V796.389L630.778 861.115L518.812 796.389V666.937L630.778 602.211Z\"\n        fill=\"#7651C9\"\n      />\n      <path\n        d=\"M630.778 988.801L742.743 1053.53V1182.98L630.778 1247.71L518.812 1182.98V1053.53L630.778 988.801Z\"\n        fill=\"#642DC3\"\n      />\n      <path\n        d=\"M742.778 1181.8L854.743 1246.53V1375.98L742.778 1440.71L630.812 1375.98V1246.53L742.778 1181.8Z\"\n        fill=\"#642DC3\"\n      />\n      <path\n        d=\"M743.02 23.4434L854.986 88.1695V217.622L743.02 282.348L631.055 217.622V88.1695L743.02 23.4434Z\"\n        fill=\"#690CB1\"\n      />\n      <path\n        d=\"M855.02 -170.557L966.986 -105.831V23.6216L855.02 88.3477L743.055 23.6216V-105.831L855.02 -170.557Z\"\n        fill=\"#690CB1\"\n      />\n      <path\n        d=\"M743.02 409.033L854.986 473.759V603.211L743.02 667.938L631.055 603.211V473.759L743.02 409.033Z\"\n        fill=\"#6E51C7\"\n      />\n      <path\n        d=\"M743.02 796.176L854.986 860.764V989.939L743.02 1054.53L631.055 989.939V860.764L743.02 796.176Z\"\n        fill=\"#704DC6\"\n      />\n      <path\n        d=\"M854.708 216.621L966.673 281.209V410.384L854.708 474.972L742.742 410.384V281.209L854.708 216.621Z\"\n        fill=\"#6A38C2\"\n      />\n      <path\n        d=\"M854.708 602.211L966.673 666.937V796.389L854.708 861.115L742.742 796.389V666.937L854.708 602.211Z\"\n        fill=\"#8380CC\"\n      />\n      <path\n        d=\"M854.708 987.801L966.673 1052.53V1181.98L854.708 1246.71L742.742 1181.98V1052.53L854.708 987.801Z\"\n        fill=\"#5C36C2\"\n      />\n      <path\n        d=\"M965.708 1181.8L1077.67 1246.53V1375.98L965.708 1440.71L853.742 1375.98V1246.53L965.708 1181.8Z\"\n        fill=\"#5C36C2\"\n      />\n      <path\n        d=\"M1077.71 987.801L1189.67 1052.53V1181.98L1077.71 1246.71L965.742 1181.98V1052.53L1077.71 987.801Z\"\n        fill=\"#6A60C5\"\n      />\n      <path\n        d=\"M1188.71 1181.8L1300.67 1246.53V1375.98L1188.71 1440.71L1076.74 1375.98V1246.53L1188.71 1181.8Z\"\n        fill=\"#6A60C5\"\n      />\n      <path\n        d=\"M1300.71 989.801L1412.67 1054.53V1183.98L1300.71 1248.71L1188.74 1183.98V1054.53L1300.71 989.801Z\"\n        fill=\"#6A60C5\"\n      />\n      <path\n        d=\"M966.95 23.4434L1078.92 88.1695V217.622L966.95 282.348L854.984 217.622V88.1695L966.95 23.4434Z\"\n        fill=\"#593CC3\"\n      />\n      <path\n        d=\"M1078.95 -170.557L1190.92 -105.831V23.6216L1078.95 88.3477L966.984 23.6216V-105.831L1078.95 -170.557Z\"\n        fill=\"#593CC3\"\n      />\n      <path\n        d=\"M966.95 409.033L1078.92 473.759V603.211L966.95 667.938L854.984 603.211V473.759L966.95 409.033Z\"\n        fill=\"#799AD6\"\n      />\n      <path\n        d=\"M966.95 795.176L1078.92 859.764V988.939L966.95 1053.53L854.984 988.939V859.764L966.95 795.176Z\"\n        fill=\"#7B6AC1\"\n      />\n      <path\n        d=\"M1078.64 216.621L1190.6 281.209V410.384L1078.64 474.972L966.672 410.384V281.209L1078.64 216.621Z\"\n        fill=\"#6C8CDE\"\n      />\n      <path\n        d=\"M1301.64 216.621L1413.6 281.209V410.384L1301.64 474.972L1189.67 410.384V281.209L1301.64 216.621Z\"\n        fill=\"#6C8CDE\"\n      />\n      <path\n        d=\"M1078.64 602.211L1190.6 666.937V796.389L1078.64 861.115L966.672 796.389V666.937L1078.64 602.211Z\"\n        fill=\"#AAB1C7\"\n      />\n      <path\n        d=\"M1301.64 602.211L1413.6 666.937V796.389L1301.64 861.115L1189.67 796.389V666.937L1301.64 602.211Z\"\n        fill=\"#AAB1C7\"\n      />\n      <path\n        d=\"M1190.88 23.4434L1302.84 88.1695V217.622L1190.88 282.348L1078.91 217.622V88.1695L1190.88 23.4434Z\"\n        fill=\"#5F63D2\"\n      />\n      <path\n        d=\"M1302.88 -170.557L1414.84 -105.831V23.6216L1302.88 88.3477L1190.91 23.6216V-105.831L1302.88 -170.557Z\"\n        fill=\"#5F63D2\"\n      />\n      <path\n        d=\"M1190.88 409.033L1302.84 473.759V603.211L1190.88 667.938L1078.91 603.211V473.759L1190.88 409.033Z\"\n        fill=\"#9CBCDA\"\n      />\n      <path\n        d=\"M1190.88 796.176L1302.84 860.764V989.939L1190.88 1054.53L1078.91 989.939V860.764L1190.88 796.176Z\"\n        fill=\"#8675BD\"\n      />\n    </g>\n    <defs>\n      <clipPath id=\"clip0_6783_975\">\n        <rect width=\"1280\" height=\"1280\" fill=\"white\" />\n      </clipPath>\n    </defs>\n  </svg>";
-
-var ProductpageDark1 = "<svg\n  width=\"1280\"\n  height=\"1280\"\n  viewBox=\"0 0 1280 1280\"\n  fill=\"none\"\n  xmlns=\"http://www.w3.org/2000/svg\"\n  preserveAspectRatio=\"none\"\n>\n  <g clipPath=\"url(#clip0_6783_1488)\">\n    <path\n      d=\"M71.2233 23.4434L183.189 88.1695V217.622L71.2233 282.348L-40.7422 217.622V88.1695L71.2233 23.4434Z\"\n      fill=\"#403FA4\"\n    />\n    <path\n      d=\"M183.223 -170.557L295.189 -105.831V23.6217L183.223 88.3477L71.2578 23.6217V-105.831L183.223 -170.557Z\"\n      fill=\"#403FA4\"\n    />\n    <path\n      d=\"M-40.7768 -170.557L71.1887 -105.831V23.6217L-40.7768 88.3477L-152.742 23.6217V-105.831L-40.7768 -170.557Z\"\n      fill=\"#403FA4\"\n    />\n    <path\n      d=\"M71.2233 409.033L183.189 473.759V603.211L71.2233 667.938L-40.7422 603.211V473.759L71.2233 409.033Z\"\n      fill=\"#4047A2\"\n    />\n    <path\n      d=\"M71.2233 795.176L183.189 859.764V988.939L71.2233 1053.53L-40.7422 988.939V859.764L71.2233 795.176Z\"\n      fill=\"#3F4BA2\"\n    />\n    <path\n      d=\"M182.919 216.621L294.884 281.209V410.384L182.919 474.972L70.9531 410.384V281.209L182.919 216.621Z\"\n      fill=\"#4141A4\"\n    />\n    <path\n      d=\"M-40.0814 216.621L71.884 281.209V410.384L-40.0814 474.972L-152.047 410.384V281.209L-40.0814 216.621Z\"\n      fill=\"#4141A4\"\n    />\n    <path\n      d=\"M182.919 602.211L294.884 666.937V796.389L182.919 861.115L70.9531 796.389V666.937L182.919 602.211Z\"\n      fill=\"#3E49A1\"\n    />\n    <path\n      d=\"M-39.0814 603.211L72.884 667.937V797.389L-39.0814 862.115L-151.047 797.389V667.937L-39.0814 603.211Z\"\n      fill=\"#3E49A1\"\n    />\n    <path\n      d=\"M182.919 987.801L294.884 1052.53V1181.98L182.919 1246.71L70.9531 1181.98V1052.53L182.919 987.801Z\"\n      fill=\"#404CA3\"\n    />\n    <path\n      d=\"M-40.0814 987.801L71.884 1052.53V1181.98L-40.0814 1246.71L-152.047 1181.98V1052.53L-40.0814 987.801Z\"\n      fill=\"#404CA3\"\n    />\n    <path\n      d=\"M71.9186 1181.8L183.884 1246.53V1375.98L71.9186 1440.71L-40.0469 1375.98V1246.53L71.9186 1181.8Z\"\n      fill=\"#404CA3\"\n    />\n    <path\n      d=\"M295.161 23.4434L407.126 88.1695V217.622L295.161 282.348L183.195 217.622V88.1695L295.161 23.4434Z\"\n      fill=\"#403BA4\"\n    />\n    <path\n      d=\"M407.161 -170.557L519.126 -105.831V23.6217L407.161 88.3477L295.195 23.6217V-105.831L407.161 -170.557Z\"\n      fill=\"#403BA4\"\n    />\n    <path\n      d=\"M295.161 409.033L407.126 473.759V603.211L295.161 667.938L183.195 603.211V473.759L295.161 409.033Z\"\n      fill=\"#4247A2\"\n    />\n    <path\n      d=\"M295.161 795.176L407.126 859.764V988.939L295.161 1053.53L183.195 988.939V859.764L295.161 795.176Z\"\n      fill=\"#404AA1\"\n    />\n    <path\n      d=\"M406.848 216.621L518.814 281.209V410.384L406.848 474.972L294.883 410.384V281.209L406.848 216.621Z\"\n      fill=\"#4741A4\"\n    />\n    <path\n      d=\"M406.848 602.211L518.814 666.937V796.389L406.848 861.115L294.883 796.389V666.937L406.848 602.211Z\"\n      fill=\"#4347A0\"\n    />\n    <path\n      d=\"M406.848 987.801L518.814 1052.53V1181.98L406.848 1246.71L294.883 1181.98V1052.53L406.848 987.801Z\"\n      fill=\"#42489E\"\n    />\n    <path\n      d=\"M295.848 1180.8L407.814 1245.53V1374.98L295.848 1439.71L183.883 1374.98V1245.53L295.848 1180.8Z\"\n      fill=\"#42489E\"\n    />\n    <path\n      d=\"M519.09 23.4434L631.056 88.1695V217.622L519.09 282.348L407.125 217.622V88.1695L519.09 23.4434Z\"\n      fill=\"#4A3DA4\"\n    />\n    <path\n      d=\"M631.09 -170.557L743.056 -105.831V23.6217L631.09 88.3477L519.125 23.6217V-105.831L631.09 -170.557Z\"\n      fill=\"#4A3DA4\"\n    />\n    <path\n      d=\"M519.09 409.033L631.056 473.759V603.211L519.09 667.938L407.125 603.211V473.759L519.09 409.033Z\"\n      fill=\"#4843A1\"\n    />\n    <path\n      d=\"M519.09 795.176L631.056 859.764V988.939L519.09 1053.53L407.125 988.939V859.764L519.09 795.176Z\"\n      fill=\"#47469E\"\n    />\n    <path\n      d=\"M630.778 216.621L742.743 281.209V410.384L630.778 474.972L518.812 410.384V281.209L630.778 216.621Z\"\n      fill=\"#4E3CA2\"\n    />\n    <path\n      d=\"M630.778 602.211L742.743 666.937V796.389L630.778 861.115L518.812 796.389V666.937L630.778 602.211Z\"\n      fill=\"#4B429D\"\n    />\n    <path\n      d=\"M630.778 987.801L742.743 1052.53V1181.98L630.778 1246.71L518.812 1181.98V1052.53L630.778 987.801Z\"\n      fill=\"#4A459C\"\n    />\n    <path\n      d=\"M630.778 987.801L742.743 1052.53V1181.98L630.778 1246.71L518.812 1181.98V1052.53L630.778 987.801Z\"\n      fill=\"#4A459C\"\n    />\n    <path\n      d=\"M519.778 1180.8L631.743 1245.53V1374.98L519.778 1439.71L407.812 1374.98V1245.53L519.778 1180.8Z\"\n      fill=\"#4A459C\"\n    />\n    <path\n      d=\"M742.778 1181.8L854.743 1246.53V1375.98L742.778 1440.71L630.812 1375.98V1246.53L742.778 1181.8Z\"\n      fill=\"#4A459C\"\n    />\n    <path\n      d=\"M743.02 23.4434L854.986 88.1695V217.622L743.02 282.348L631.055 217.622V88.1695L743.02 23.4434Z\"\n      fill=\"#5338A4\"\n    />\n    <path\n      d=\"M855.02 -170.557L966.986 -105.831V23.6217L855.02 88.3477L743.055 23.6217V-105.831L855.02 -170.557Z\"\n      fill=\"#5338A4\"\n    />\n    <path\n      d=\"M743.02 409.033L854.986 473.759V603.211L743.02 667.938L631.055 603.211V473.759L743.02 409.033Z\"\n      fill=\"#513EA0\"\n    />\n    <path\n      d=\"M743.02 795.176L854.986 859.764V988.939L743.02 1053.53L631.055 988.939V859.764L743.02 795.176Z\"\n      fill=\"#4F429A\"\n    />\n    <path\n      d=\"M854.708 216.621L966.673 281.209V410.384L854.708 474.972L742.742 410.384V281.209L854.708 216.621Z\"\n      fill=\"#5537A2\"\n    />\n    <path\n      d=\"M854.708 602.211L966.673 666.937V796.389L854.708 861.115L742.742 796.389V666.937L854.708 602.211Z\"\n      fill=\"#543E9B\"\n    />\n    <path\n      d=\"M854.708 987.801L966.673 1052.53V1181.98L854.708 1246.71L742.742 1181.98V1052.53L854.708 987.801Z\"\n      fill=\"#524198\"\n    />\n    <path\n      d=\"M965.708 1181.8L1077.67 1246.53V1375.98L965.708 1440.71L853.742 1375.98V1246.53L965.708 1181.8Z\"\n      fill=\"#524198\"\n    />\n    <path\n      d=\"M1077.71 987.801L1189.67 1052.53V1181.98L1077.71 1246.71L965.742 1181.98V1052.53L1077.71 987.801Z\"\n      fill=\"#5A4096\"\n    />\n    <path\n      d=\"M1300.71 988.801L1412.67 1053.53V1182.98L1300.71 1247.71L1188.74 1182.98V1053.53L1300.71 988.801Z\"\n      fill=\"#5A4096\"\n    />\n    <path\n      d=\"M1188.71 1181.8L1300.67 1246.53V1375.98L1188.71 1440.71L1076.74 1375.98V1246.53L1188.71 1181.8Z\"\n      fill=\"#5A4096\"\n    />\n    <path\n      d=\"M966.95 23.4434L1078.92 88.1695V217.622L966.95 282.348L854.984 217.622V88.1695L966.95 23.4434Z\"\n      fill=\"#5934A2\"\n    />\n    <path\n      d=\"M1077.95 -169.557L1189.92 -104.831V24.6217L1077.95 89.3477L965.984 24.6217V-104.831L1077.95 -169.557Z\"\n      fill=\"#5934A2\"\n    />\n    <path\n      d=\"M966.95 409.033L1078.92 473.759V603.211L966.95 667.938L854.984 603.211V473.759L966.95 409.033Z\"\n      fill=\"#58399E\"\n    />\n    <path\n      d=\"M966.95 795.176L1078.92 859.764V988.939L966.95 1053.53L854.984 988.939V859.764L966.95 795.176Z\"\n      fill=\"#563F97\"\n    />\n    <path\n      d=\"M1078.64 216.621L1190.6 281.209V410.384L1078.64 474.972L966.672 410.384V281.209L1078.64 216.621Z\"\n      fill=\"#5A349F\"\n    />\n    <path\n      d=\"M1301.64 216.621L1413.6 281.209V410.384L1301.64 474.972L1189.67 410.384V281.209L1301.64 216.621Z\"\n      fill=\"#5A349F\"\n    />\n    <path\n      d=\"M1078.64 602.211L1190.6 666.937V796.389L1078.64 861.115L966.672 796.389V666.937L1078.64 602.211Z\"\n      fill=\"#5A3B98\"\n    />\n    <path\n      d=\"M1301.64 602.211L1413.6 666.937V796.389L1301.64 861.115L1189.67 796.389V666.937L1301.64 602.211Z\"\n      fill=\"#5A3B98\"\n    />\n    <path\n      d=\"M1190.88 23.4434L1302.84 88.1695V217.622L1190.88 282.348L1078.91 217.622V88.1695L1190.88 23.4434Z\"\n      fill=\"#5F35A2\"\n    />\n    <path\n      d=\"M1301.88 -170.557L1413.84 -105.831V23.6217L1301.88 88.3477L1189.91 23.6217V-105.831L1301.88 -170.557Z\"\n      fill=\"#5F35A2\"\n    />\n    <path\n      d=\"M1190.88 409.033L1302.84 473.759V603.211L1190.88 667.938L1078.91 603.211V473.759L1190.88 409.033Z\"\n      fill=\"#5B389B\"\n    />\n    <path\n      d=\"M1190.88 795.176L1302.84 859.764V988.939L1190.88 1053.53L1078.91 988.939V859.764L1190.88 795.176Z\"\n      fill=\"#593C95\"\n    />\n  </g>\n  <defs>\n    <clipPath id=\"clip0_6783_1488\">\n      <rect width=\"1280\" height=\"1280\" fill=\"white\" />\n    </clipPath>\n  </defs>\n</svg>";
-
-var ProductpageDark2 = "<svg\n  viewBox=\"0 0 1280 1280\"\n  fill=\"none\"\n  xmlns=\"http://www.w3.org/2000/svg\"\n  preserveAspectRatio=\"none\"\n>\n  <g clipPath=\"url(#clip0_6783_1727)\">\n    <path\n      d=\"M71.2233 23.4434L183.189 88.1695V217.622L71.2233 282.348L-40.7422 217.622V88.1695L71.2233 23.4434Z\"\n      fill=\"#611897\"\n    />\n    <path\n      d=\"M182.223 -169.557L294.189 -104.831V24.6217L182.223 89.3477L70.2578 24.6217V-104.831L182.223 -169.557Z\"\n      fill=\"#611897\"\n    />\n    <path\n      d=\"M-40.7768 -170.557L71.1887 -105.831V23.6217L-40.7768 88.3477L-152.742 23.6217V-105.831L-40.7768 -170.557Z\"\n      fill=\"#611897\"\n    />\n    <path\n      d=\"M71.2233 409.033L183.189 473.759V603.211L71.2233 667.938L-40.7422 603.211V473.759L71.2233 409.033Z\"\n      fill=\"#6A11A4\"\n    />\n    <path\n      d=\"M71.2233 795.176L183.189 859.764V988.939L71.2233 1053.53L-40.7422 988.939V859.764L71.2233 795.176Z\"\n      fill=\"#6A11A4\"\n    />\n    <path\n      d=\"M182.919 216.621L294.884 281.209V410.384L182.919 474.972L70.9531 410.384V281.209L182.919 216.621Z\"\n      fill=\"#63109E\"\n    />\n    <path\n      d=\"M-40.0814 216.621L71.884 281.209V410.384L-40.0814 474.972L-152.047 410.384V281.209L-40.0814 216.621Z\"\n      fill=\"#63109E\"\n    />\n    <path\n      d=\"M182.919 602.211L294.884 666.937V796.389L182.919 861.115L70.9531 796.389V666.937L182.919 602.211Z\"\n      fill=\"#6910A3\"\n    />\n    <path\n      d=\"M-40.0814 602.211L71.884 666.937V796.389L-40.0814 861.115L-152.047 796.389V666.937L-40.0814 602.211Z\"\n      fill=\"#6910A3\"\n    />\n    <path\n      d=\"M182.919 987.801L294.884 1052.53V1181.98L182.919 1246.71L70.9531 1181.98V1052.53L182.919 987.801Z\"\n      fill=\"#6B15A4\"\n    />\n    <path\n      d=\"M71.9186 1181.8L183.884 1246.53V1375.98L71.9186 1440.71L-40.0469 1375.98V1246.53L71.9186 1181.8Z\"\n      fill=\"#6B15A4\"\n    />\n    <path\n      d=\"M-40.0814 987.801L71.884 1052.53V1181.98L-40.0814 1246.71L-152.047 1181.98V1052.53L-40.0814 987.801Z\"\n      fill=\"#6B15A4\"\n    />\n    <path\n      d=\"M295.161 23.4434L407.126 88.1695V217.622L295.161 282.348L183.195 217.622V88.1695L295.161 23.4434Z\"\n      fill=\"#5E119A\"\n    />\n    <path\n      d=\"M406.161 -169.557L518.126 -104.831V24.6217L406.161 89.3477L294.195 24.6217V-104.831L406.161 -169.557Z\"\n      fill=\"#5E119A\"\n    />\n    <path\n      d=\"M295.161 409.033L407.126 473.759V603.211L295.161 667.938L183.195 603.211V473.759L295.161 409.033Z\"\n      fill=\"#6811A5\"\n    />\n    <path\n      d=\"M295.161 795.176L407.126 859.764V988.939L295.161 1053.53L183.195 988.939V859.764L295.161 795.176Z\"\n      fill=\"#6811A5\"\n    />\n    <path\n      d=\"M406.848 216.621L518.814 281.209V410.384L406.848 474.972L294.883 410.384V281.209L406.848 216.621Z\"\n      fill=\"#6412A5\"\n    />\n    <path\n      d=\"M406.848 602.211L518.814 666.937V796.389L406.848 861.115L294.883 796.389V666.937L406.848 602.211Z\"\n      fill=\"#6711A4\"\n    />\n    <path\n      d=\"M406.848 987.801L518.814 1052.53V1181.98L406.848 1246.71L294.883 1181.98V1052.53L406.848 987.801Z\"\n      fill=\"#6512A6\"\n    />\n    <path\n      d=\"M518.848 1181.8L630.814 1246.53V1375.98L518.848 1440.71L406.883 1375.98V1246.53L518.848 1181.8Z\"\n      fill=\"#6512A6\"\n    />\n    <path\n      d=\"M295.848 1180.8L407.814 1245.53V1374.98L295.848 1439.71L183.883 1374.98V1245.53L295.848 1180.8Z\"\n      fill=\"#6512A6\"\n    />\n    <path\n      d=\"M519.09 23.4434L631.056 88.1695V217.622L519.09 282.348L407.125 217.622V88.1695L519.09 23.4434Z\"\n      fill=\"#6112A7\"\n    />\n    <path\n      d=\"M630.09 -169.557L742.056 -104.831V24.6217L630.09 89.3477L518.125 24.6217V-104.831L630.09 -169.557Z\"\n      fill=\"#6112A7\"\n    />\n    <path\n      d=\"M519.09 409.033L631.056 473.759V603.211L519.09 667.938L407.125 603.211V473.759L519.09 409.033Z\"\n      fill=\"#6413A6\"\n    />\n    <path\n      d=\"M519.09 795.176L631.056 859.764V988.939L519.09 1053.53L407.125 988.939V859.764L519.09 795.176Z\"\n      fill=\"#6412A6\"\n    />\n    <path\n      d=\"M630.778 216.621L742.743 281.209V410.384L630.778 474.972L518.812 410.384V281.209L630.778 216.621Z\"\n      fill=\"#6013A9\"\n    />\n    <path\n      d=\"M630.778 602.211L742.743 666.937V796.389L630.778 861.115L518.812 796.389V666.937L630.778 602.211Z\"\n      fill=\"#6114A7\"\n    />\n    <path\n      d=\"M630.778 987.801L742.743 1052.53V1181.98L630.778 1246.71L518.812 1181.98V1052.53L630.778 987.801Z\"\n      fill=\"#6015A8\"\n    />\n    <path\n      d=\"M742.778 1181.8L854.743 1246.53V1375.98L742.778 1440.71L630.812 1375.98V1246.53L742.778 1181.8Z\"\n      fill=\"#6015A8\"\n    />\n    <path\n      d=\"M743.02 23.4434L854.986 88.1695V217.622L743.02 282.348L631.055 217.622V88.1695L743.02 23.4434Z\"\n      fill=\"#5D17AA\"\n    />\n    <path\n      d=\"M854.02 -169.557L965.986 -104.831V24.6217L854.02 89.3477L742.055 24.6217V-104.831L854.02 -169.557Z\"\n      fill=\"#5D17AA\"\n    />\n    <path\n      d=\"M743.02 409.033L854.986 473.759V603.211L743.02 667.938L631.055 603.211V473.759L743.02 409.033Z\"\n      fill=\"#5E17A9\"\n    />\n    <path\n      d=\"M743.02 795.176L854.986 859.764V988.939L743.02 1053.53L631.055 988.939V859.764L743.02 795.176Z\"\n      fill=\"#5D17A8\"\n    />\n    <path\n      d=\"M854.708 216.621L966.673 281.209V410.384L854.708 474.972L742.742 410.384V281.209L854.708 216.621Z\"\n      fill=\"#5A19AB\"\n    />\n    <path\n      d=\"M854.708 602.211L966.673 666.937V796.389L854.708 861.115L742.742 796.389V666.937L854.708 602.211Z\"\n      fill=\"#5A1AA9\"\n    />\n    <path\n      d=\"M854.708 987.801L966.673 1052.53V1181.98L854.708 1246.71L742.742 1181.98V1052.53L854.708 987.801Z\"\n      fill=\"#571AA9\"\n    />\n    <path\n      d=\"M966.708 1181.8L1078.67 1246.53V1375.98L966.708 1440.71L854.742 1375.98V1246.53L966.708 1181.8Z\"\n      fill=\"#571AA9\"\n    />\n    <path\n      d=\"M1077.71 987.801L1189.67 1052.53V1181.98L1077.71 1246.71L965.742 1181.98V1052.53L1077.71 987.801Z\"\n      fill=\"#5423AC\"\n    />\n    <path\n      d=\"M1300.71 988.801L1412.67 1053.53V1182.98L1300.71 1247.71L1188.74 1182.98V1053.53L1300.71 988.801Z\"\n      fill=\"#5423AC\"\n    />\n    <path\n      d=\"M1187.71 1181.8L1299.67 1246.53V1375.98L1187.71 1440.71L1075.74 1375.98V1246.53L1187.71 1181.8Z\"\n      fill=\"#5423AC\"\n    />\n    <path\n      d=\"M966.95 23.4434L1078.92 88.1695V217.622L966.95 282.348L854.984 217.622V88.1695L966.95 23.4434Z\"\n      fill=\"#581CAD\"\n    />\n    <path\n      d=\"M966.95 409.033L1078.92 473.759V603.211L966.95 667.938L854.984 603.211V473.759L966.95 409.033Z\"\n      fill=\"#571DAB\"\n    />\n    <path\n      d=\"M966.95 795.176L1078.92 859.764V988.939L966.95 1053.53L854.984 988.939V859.764L966.95 795.176Z\"\n      fill=\"#561EAA\"\n    />\n    <path\n      d=\"M1078.64 216.621L1190.6 281.209V410.384L1078.64 474.972L966.672 410.384V281.209L1078.64 216.621Z\"\n      fill=\"#551DAB\"\n    />\n    <path\n      d=\"M1301.64 216.621L1413.6 281.209V410.384L1301.64 474.972L1189.67 410.384V281.209L1301.64 216.621Z\"\n      fill=\"#551DAB\"\n    />\n    <path\n      d=\"M1078.64 602.211L1190.6 666.937V796.389L1078.64 861.115L966.672 796.389V666.937L1078.64 602.211Z\"\n      fill=\"#5320AB\"\n    />\n    <path\n      d=\"M1301.64 602.211L1413.6 666.937V796.389L1301.64 861.115L1189.67 796.389V666.937L1301.64 602.211Z\"\n      fill=\"#5320AB\"\n    />\n    <path\n      d=\"M1190.88 23.4434L1302.84 88.1695V217.622L1190.88 282.348L1078.91 217.622V88.1695L1190.88 23.4434Z\"\n      fill=\"#5B26AE\"\n    />\n    <path\n      d=\"M1301.88 -170.557L1413.84 -105.831V23.6217L1301.88 88.3477L1189.91 23.6217V-105.831L1301.88 -170.557Z\"\n      fill=\"#5B26AE\"\n    />\n    <path\n      d=\"M1077.88 -169.557L1189.84 -104.831V24.6217L1077.88 89.3477L965.914 24.6217V-104.831L1077.88 -169.557Z\"\n      fill=\"#5B26AE\"\n    />\n    <path\n      d=\"M1190.88 409.033L1302.84 473.759V603.211L1190.88 667.938L1078.91 603.211V473.759L1190.88 409.033Z\"\n      fill=\"#531FAA\"\n    />\n    <path\n      d=\"M1190.88 795.176L1302.84 859.764V988.939L1190.88 1053.53L1078.91 988.939V859.764L1190.88 795.176Z\"\n      fill=\"#5221AA\"\n    />\n  </g>\n  <defs>\n    <clipPath id=\"clip0_6783_1727\">\n      <rect width=\"1280\" height=\"1280\" fill=\"white\" />\n    </clipPath>\n  </defs>\n</svg>";
-
-var HomepageLight1 = "<svg\n  viewBox=\"0 0 1280 1280\"\n  fill=\"none\"\n  xmlns=\"http://www.w3.org/2000/svg\"\n  preserveAspectRatio=\"none\"\n>\n  <g clipPath=\"url(#clip0_6783_462)\">\n    <g clipPath=\"url(#clip1_6783_462)\">\n      <path\n        d=\"M71.2233 23.4434L183.189 88.1695V217.622L71.2233 282.348L-40.7422 217.622V88.1695L71.2233 23.4434Z\"\n        fill=\"#D6DCEF\"\n      />\n      <path\n        d=\"M-40.7767 -170.557L71.1887 -105.831V23.6216L-40.7767 88.3477L-152.742 23.6216V-105.831L-40.7767 -170.557Z\"\n        fill=\"#D6DCEF\"\n      />\n      <path\n        d=\"M71.2233 409.033L183.189 473.759V603.211L71.2233 667.938L-40.7422 603.211V473.759L71.2233 409.033Z\"\n        fill=\"#DEDDF4\"\n      />\n      <path\n        d=\"M71.2233 795.176L183.189 859.764V988.939L71.2233 1053.53L-40.7422 988.939V859.764L71.2233 795.176Z\"\n        fill=\"#F4E9F2\"\n      />\n      <path\n        d=\"M182.919 217.621L294.884 282.209V411.384L182.919 475.972L70.9531 411.384V282.209L182.919 217.621Z\"\n        fill=\"#D7DCF3\"\n      />\n      <path\n        d=\"M-41.0814 216.621L70.884 281.209V410.384L-41.0814 474.972L-153.047 410.384V281.209L-41.0814 216.621Z\"\n        fill=\"#D7DCF3\"\n      />\n      <path\n        d=\"M182.919 603.211L294.884 667.937V797.389L182.919 862.115L70.9531 797.389V667.937L182.919 603.211Z\"\n        fill=\"#E9E2F5\"\n      />\n      <path\n        d=\"M-41.0814 602.211L70.884 666.937V796.389L-41.0814 861.115L-153.047 796.389V666.937L-41.0814 602.211Z\"\n        fill=\"#E9E2F5\"\n      />\n      <path\n        d=\"M182.919 988.801L294.884 1053.53V1182.98L182.919 1247.71L70.9531 1182.98V1053.53L182.919 988.801Z\"\n        fill=\"#F8EDF1\"\n      />\n      <path\n        d=\"M-41.0814 988.801L70.884 1053.53V1182.98L-41.0814 1247.71L-153.047 1182.98V1053.53L-41.0814 988.801Z\"\n        fill=\"#F8EDF1\"\n      />\n      <path\n        d=\"M70.9186 1182.8L182.884 1247.53V1376.98L70.9186 1441.71L-41.0469 1376.98V1247.53L70.9186 1182.8Z\"\n        fill=\"#F8EDF1\"\n      />\n      <path\n        d=\"M295.161 23.4434L407.126 88.1695V217.622L295.161 282.348L183.195 217.622V88.1695L295.161 23.4434Z\"\n        fill=\"#D5DCF2\"\n      />\n      <path\n        d=\"M183.161 -170.557L295.126 -105.831V23.6216L183.161 88.3477L71.1953 23.6216V-105.831L183.161 -170.557Z\"\n        fill=\"#D5DCF2\"\n      />\n      <path\n        d=\"M295.161 409.033L407.126 473.759V603.211L295.161 667.938L183.195 603.211V473.759L295.161 409.033Z\"\n        fill=\"#E0E0F5\"\n      />\n      <path\n        d=\"M295.161 795.176L407.126 859.764V988.939L295.161 1053.53L183.195 988.939V859.764L295.161 795.176Z\"\n        fill=\"#F5EAF3\"\n      />\n      <path\n        d=\"M406.848 217.621L518.814 282.209V411.384L406.848 475.972L294.883 411.384V282.209L406.848 217.621Z\"\n        fill=\"#DDE1F4\"\n      />\n      <path\n        d=\"M406.848 603.211L518.814 667.937V797.389L406.848 862.115L294.883 797.389V667.937L406.848 603.211Z\"\n        fill=\"#EDE8F6\"\n      />\n      <path\n        d=\"M406.848 988.801L518.814 1053.53V1182.98L406.848 1247.71L294.883 1182.98V1053.53L406.848 988.801Z\"\n        fill=\"#FAF1F5\"\n      />\n      <path\n        d=\"M294.848 1182.8L406.814 1247.53V1376.98L294.848 1441.71L182.883 1376.98V1247.53L294.848 1182.8Z\"\n        fill=\"#FAF1F5\"\n      />\n      <path\n        d=\"M519.09 23.4434L631.056 88.1695V217.622L519.09 282.348L407.125 217.622V88.1695L519.09 23.4434Z\"\n        fill=\"#E0E3F5\"\n      />\n      <path\n        d=\"M407.09 -170.557L519.056 -105.831V23.6216L407.09 88.3477L295.125 23.6216V-105.831L407.09 -170.557Z\"\n        fill=\"#E0E3F5\"\n      />\n      <path\n        d=\"M519.09 409.033L631.056 473.759V603.211L519.09 667.938L407.125 603.211V473.759L519.09 409.033Z\"\n        fill=\"#EBEBF8\"\n      />\n      <path\n        d=\"M519.09 795.176L631.056 859.764V988.939L519.09 1053.53L407.125 988.939V859.764L519.09 795.176Z\"\n        fill=\"#F9F2F7\"\n      />\n      <path\n        d=\"M630.778 217.621L742.743 282.209V411.384L630.778 475.972L518.812 411.384V282.209L630.778 217.621Z\"\n        fill=\"#EAEBF6\"\n      />\n      <path\n        d=\"M630.778 603.211L742.743 667.937V797.389L630.778 862.115L518.812 797.389V667.937L630.778 603.211Z\"\n        fill=\"#F8F4FA\"\n      />\n      <path\n        d=\"M630.778 988.801L742.743 1053.53V1182.98L630.778 1247.71L518.812 1182.98V1053.53L630.778 988.801Z\"\n        fill=\"#FDF8FA\"\n      />\n      <path\n        d=\"M518.778 1181.8L630.743 1246.53V1375.98L518.778 1440.71L406.812 1375.98V1246.53L518.778 1181.8Z\"\n        fill=\"#FDF8FA\"\n      />\n      <path\n        d=\"M741.778 1184.8L853.743 1249.53V1378.98L741.778 1443.71L629.812 1378.98V1249.53L741.778 1184.8Z\"\n        fill=\"#FDF8FA\"\n      />\n      <path\n        d=\"M743.02 23.4434L854.986 88.1695V217.622L743.02 282.348L631.055 217.622V88.1695L743.02 23.4434Z\"\n        fill=\"#EAE9F5\"\n      />\n      <path\n        d=\"M631.02 -170.557L742.986 -105.831V23.6216L631.02 88.3477L519.055 23.6216V-105.831L631.02 -170.557Z\"\n        fill=\"#EAE9F5\"\n      />\n      <path\n        d=\"M743.02 409.033L854.986 473.759V603.211L743.02 667.938L631.055 603.211V473.759L743.02 409.033Z\"\n        fill=\"#F6F5FB\"\n      />\n      <path\n        d=\"M743.02 795.176L854.986 859.764V988.939L743.02 1053.53L631.055 988.939V859.764L743.02 795.176Z\"\n        fill=\"#FDFAFC\"\n      />\n      <path\n        d=\"M854.708 217.621L966.673 282.209V411.384L854.708 475.972L742.742 411.384V282.209L854.708 217.621Z\"\n        fill=\"#F0EDF7\"\n      />\n      <path\n        d=\"M854.708 603.211L966.673 667.937V797.389L854.708 862.115L742.742 797.389V667.937L854.708 603.211Z\"\n        fill=\"#FBFAFC\"\n      />\n      <path\n        d=\"M854.708 988.801L966.673 1053.53V1182.98L854.708 1247.71L742.742 1182.98V1053.53L854.708 988.801Z\"\n        fill=\"#FDFBFC\"\n      />\n      <path\n        d=\"M965.708 1183.8L1077.67 1248.53V1377.98L965.708 1442.71L853.742 1377.98V1248.53L965.708 1183.8Z\"\n        fill=\"#FDFBFC\"\n      />\n      <path\n        d=\"M966.95 23.4434L1078.92 88.1695V217.622L966.95 282.348L854.984 217.622V88.1695L966.95 23.4434Z\"\n        fill=\"#EAE4F3\"\n      />\n      <path\n        d=\"M854.95 -170.557L966.915 -105.831V23.6216L854.95 88.3477L742.984 23.6216V-105.831L854.95 -170.557Z\"\n        fill=\"#EAE4F3\"\n      />\n      <path\n        d=\"M966.95 409.033L1078.92 473.759V603.211L966.95 667.938L854.984 603.211V473.759L966.95 409.033Z\"\n        fill=\"#F5F5FB\"\n      />\n      <path\n        d=\"M966.95 795.176L1078.92 859.764V988.939L966.95 1053.53L854.984 988.939V859.764L966.95 795.176Z\"\n        fill=\"#FCFCFD\"\n      />\n      <path\n        d=\"M1078.64 217.621L1190.6 282.209V411.384L1078.64 475.972L966.672 411.384V282.209L1078.64 217.621Z\"\n        fill=\"#EBE7F4\"\n      />\n      <path\n        d=\"M1302.64 217.621L1414.6 282.209V411.384L1302.64 475.972L1190.67 411.384V282.209L1302.64 217.621Z\"\n        fill=\"#EBE7F4\"\n      />\n      <path\n        d=\"M1078.64 603.211L1190.6 667.937V797.389L1078.64 862.115L966.672 797.389V667.937L1078.64 603.211Z\"\n        fill=\"#F8F9FD\"\n      />\n      <path\n        d=\"M1302.64 603.211L1414.6 667.937V797.389L1302.64 862.115L1190.67 797.389V667.937L1302.64 603.211Z\"\n        fill=\"#F8F9FD\"\n      />\n      <path\n        d=\"M1078.64 988.801L1190.6 1053.53V1182.98L1078.64 1247.71L966.672 1182.98V1053.53L1078.64 988.801Z\"\n        fill=\"#FBFCFC\"\n      />\n      <path\n        d=\"M1190.64 1182.8L1302.6 1247.53V1376.98L1190.64 1441.71L1078.67 1376.98V1247.53L1190.64 1182.8Z\"\n        fill=\"#FBFCFC\"\n      />\n      <path\n        d=\"M1302.64 988.801L1414.6 1053.53V1182.98L1302.64 1247.71L1190.67 1182.98V1053.53L1302.64 988.801Z\"\n        fill=\"#FBFCFC\"\n      />\n      <path\n        d=\"M1190.88 23.4434L1302.84 88.1695V217.622L1190.88 282.348L1078.91 217.622V88.1695L1190.88 23.4434Z\"\n        fill=\"#E5DEEF\"\n      />\n      <path\n        d=\"M1078.88 -170.557L1190.84 -105.831V23.6216L1078.88 88.3477L966.914 23.6216V-105.831L1078.88 -170.557Z\"\n        fill=\"#E5DEEF\"\n      />\n      <path\n        d=\"M1302.88 -170.557L1414.84 -105.831V23.6216L1302.88 88.3477L1190.91 23.6216V-105.831L1302.88 -170.557Z\"\n        fill=\"#E5DEEF\"\n      />\n      <path\n        d=\"M1190.88 409.033L1302.84 473.759V603.211L1190.88 667.938L1078.91 603.211V473.759L1190.88 409.033Z\"\n        fill=\"#F2F2F8\"\n      />\n      <path\n        d=\"M1190.88 795.176L1302.84 859.764V988.939L1190.88 1053.53L1078.91 988.939V859.764L1190.88 795.176Z\"\n        fill=\"#F9FBFC\"\n      />\n    </g>\n  </g>\n  <defs>\n    <clipPath id=\"clip0_6783_462\">\n      <rect width=\"1280\" height=\"1280\" fill=\"white\" />\n    </clipPath>\n    <clipPath id=\"clip1_6783_462\">\n      <rect width=\"1280\" height=\"1280\" fill=\"white\" />\n    </clipPath>\n  </defs>\n</svg>";
-
-var HomepageLight2 = "<svg\n  viewBox=\"0 0 1280 1280\"\n  fill=\"none\"\n  xmlns=\"http://www.w3.org/2000/svg\"\n  preserveAspectRatio=\"none\"\n>\n  <g clipPath=\"url(#clip0_6783_599)\">\n    <path\n      d=\"M71.2233 23.4434L183.189 88.1695V217.622L71.2233 282.348L-40.7422 217.622V88.1695L71.2233 23.4434Z\"\n      fill=\"#FDFEFF\"\n    />\n    <path\n      d=\"M-40.7767 -170.557L71.1887 -105.831V23.6216L-40.7767 88.3477L-152.742 23.6216V-105.831L-40.7767 -170.557Z\"\n      fill=\"#FDFEFF\"\n    />\n    <path\n      d=\"M183.223 -170.557L295.189 -105.831V23.6216L183.223 88.3477L71.2578 23.6216V-105.831L183.223 -170.557Z\"\n      fill=\"#FDFEFF\"\n    />\n    <path\n      d=\"M71.2233 409.033L183.189 473.759V603.211L71.2233 667.938L-40.7422 603.211V473.759L71.2233 409.033Z\"\n      fill=\"#FEFFFF\"\n    />\n    <path\n      d=\"M71.2233 795.176L183.189 859.764V988.939L71.2233 1053.53L-40.7422 988.939V859.764L71.2233 795.176Z\"\n      fill=\"#D7F1F9\"\n    />\n    <path\n      d=\"M182.919 217.621L294.884 282.209V411.384L182.919 475.972L70.9531 411.384V282.209L182.919 217.621Z\"\n      fill=\"#FEFFFF\"\n    />\n    <path\n      d=\"M-41.0814 217.621L70.884 282.209V411.384L-41.0814 475.972L-153.047 411.384V282.209L-41.0814 217.621Z\"\n      fill=\"#FEFFFF\"\n    />\n    <path\n      d=\"M182.919 603.211L294.884 667.937V797.389L182.919 862.115L70.9531 797.389V667.937L182.919 603.211Z\"\n      fill=\"#F6FCFE\"\n    />\n    <path\n      d=\"M-40.0814 603.211L71.884 667.937V797.389L-40.0814 862.115L-152.047 797.389V667.937L-40.0814 603.211Z\"\n      fill=\"#F6FCFE\"\n    />\n    <path\n      d=\"M182.919 988.801L294.884 1053.53V1182.98L182.919 1247.71L70.9531 1182.98V1053.53L182.919 988.801Z\"\n      fill=\"#ACDBF1\"\n    />\n    <path\n      d=\"M70.9186 1182.8L182.884 1247.53V1376.98L70.9186 1441.71L-41.0469 1376.98V1247.53L70.9186 1182.8Z\"\n      fill=\"#ACDBF1\"\n    />\n    <path\n      d=\"M-40.0814 988.801L71.884 1053.53V1182.98L-40.0814 1247.71L-152.047 1182.98V1053.53L-40.0814 988.801Z\"\n      fill=\"#ACDBF1\"\n    />\n    <path\n      d=\"M295.161 23.4434L407.126 88.1695V217.622L295.161 282.348L183.195 217.622V88.1695L295.161 23.4434Z\"\n      fill=\"#FAFDFE\"\n    />\n    <path\n      d=\"M407.161 -170.557L519.126 -105.831V23.6216L407.161 88.3477L295.195 23.6216V-105.831L407.161 -170.557Z\"\n      fill=\"#FAFDFE\"\n    />\n    <path\n      d=\"M295.161 409.033L407.126 473.759V603.211L295.161 667.938L183.195 603.211V473.759L295.161 409.033Z\"\n      fill=\"#FEFFFF\"\n    />\n    <path\n      d=\"M295.161 795.176L407.126 859.764V988.939L295.161 1053.53L183.195 988.939V859.764L295.161 795.176Z\"\n      fill=\"#E5F0FA\"\n    />\n    <path\n      d=\"M406.848 217.621L518.814 282.209V411.384L406.848 475.972L294.883 411.384V282.209L406.848 217.621Z\"\n      fill=\"#FBFDFE\"\n    />\n    <path\n      d=\"M406.848 603.211L518.814 667.937V797.389L406.848 862.115L294.883 797.389V667.937L406.848 603.211Z\"\n      fill=\"#FBFCFE\"\n    />\n    <path\n      d=\"M406.848 988.801L518.814 1053.53V1182.98L406.848 1247.71L294.883 1182.98V1053.53L406.848 988.801Z\"\n      fill=\"#DDE0F5\"\n    />\n    <path\n      d=\"M294.848 1182.8L406.814 1247.53V1376.98L294.848 1441.71L182.883 1376.98V1247.53L294.848 1182.8Z\"\n      fill=\"#DDE0F5\"\n    />\n    <path\n      d=\"M519.09 23.4434L631.056 88.1695V217.622L519.09 282.348L407.125 217.622V88.1695L519.09 23.4434Z\"\n      fill=\"#E7F4FA\"\n    />\n    <path\n      d=\"M631.09 -170.557L743.056 -105.831V23.6216L631.09 88.3477L519.125 23.6216V-105.831L631.09 -170.557Z\"\n      fill=\"#E7F4FA\"\n    />\n    <path\n      d=\"M519.09 409.033L631.056 473.759V603.211L519.09 667.938L407.125 603.211V473.759L519.09 409.033Z\"\n      fill=\"#FEFEFF\"\n    />\n    <path\n      d=\"M519.09 795.176L631.056 859.764V988.939L519.09 1053.53L407.125 988.939V859.764L519.09 795.176Z\"\n      fill=\"#F6F6FC\"\n    />\n    <path\n      d=\"M630.778 217.621L742.743 282.209V411.384L630.778 475.972L518.812 411.384V282.209L630.778 217.621Z\"\n      fill=\"#F3F7FC\"\n    />\n    <path\n      d=\"M630.778 603.211L742.743 667.937V797.389L630.778 862.115L518.812 797.389V667.937L630.778 603.211Z\"\n      fill=\"#FEFEFF\"\n    />\n    <path\n      d=\"M630.778 988.801L742.743 1053.53V1182.98L630.778 1247.71L518.812 1182.98V1053.53L630.778 988.801Z\"\n      fill=\"#F8F6FC\"\n    />\n    <path\n      d=\"M742.778 1182.8L854.743 1247.53V1376.98L742.778 1441.71L630.812 1376.98V1247.53L742.778 1182.8Z\"\n      fill=\"#F8F6FC\"\n    />\n    <path\n      d=\"M518.778 1182.8L630.743 1247.53V1376.98L518.778 1441.71L406.812 1376.98V1247.53L518.778 1182.8Z\"\n      fill=\"#F8F6FC\"\n    />\n    <path\n      d=\"M743.02 23.4434L854.986 88.1695V217.622L743.02 282.348L631.055 217.622V88.1695L743.02 23.4434Z\"\n      fill=\"#D7E1EF\"\n    />\n    <path\n      d=\"M855.02 -170.557L966.986 -105.831V23.6216L855.02 88.3477L743.055 23.6216V-105.831L855.02 -170.557Z\"\n      fill=\"#D7E1EF\"\n    />\n    <path\n      d=\"M743.02 409.033L854.986 473.759V603.211L743.02 667.938L631.055 603.211V473.759L743.02 409.033Z\"\n      fill=\"#FCFCFE\"\n    />\n    <path\n      d=\"M743.02 795.176L854.986 859.764V988.939L743.02 1053.53L631.055 988.939V859.764L743.02 795.176Z\"\n      fill=\"#FEFDFE\"\n    />\n    <path\n      d=\"M854.708 217.621L966.673 282.209V411.384L854.708 475.972L742.742 411.384V282.209L854.708 217.621Z\"\n      fill=\"#EEEDF8\"\n    />\n    <path\n      d=\"M854.708 603.211L966.673 667.937V797.389L854.708 862.115L742.742 797.389V667.937L854.708 603.211Z\"\n      fill=\"#FEFDFE\"\n    />\n    <path\n      d=\"M854.708 988.801L966.673 1053.53V1182.98L854.708 1247.71L742.742 1182.98V1053.53L854.708 988.801Z\"\n      fill=\"#FEFEFF\"\n    />\n    <path\n      d=\"M966.708 1182.8L1078.67 1247.53V1376.98L966.708 1441.71L854.742 1376.98V1247.53L966.708 1182.8Z\"\n      fill=\"#FEFEFF\"\n    />\n    <path\n      d=\"M1190.71 1182.8L1302.67 1247.53V1376.98L1190.71 1441.71L1078.74 1376.98V1247.53L1190.71 1182.8Z\"\n      fill=\"#FEFEFF\"\n    />\n    <path\n      d=\"M966.95 23.4434L1078.92 88.1695V217.622L966.95 282.348L854.984 217.622V88.1695L966.95 23.4434Z\"\n      fill=\"#D7D1EC\"\n    />\n    <path\n      d=\"M1078.95 -170.557L1190.92 -105.831V23.6216L1078.95 88.3477L966.984 23.6216V-105.831L1078.95 -170.557Z\"\n      fill=\"#D7D1EC\"\n    />\n    <path\n      d=\"M966.95 409.033L1078.92 473.759V603.211L966.95 667.938L854.984 603.211V473.759L966.95 409.033Z\"\n      fill=\"#F5F3FB\"\n    />\n    <path\n      d=\"M966.95 795.176L1078.92 859.764V988.939L966.95 1053.53L854.984 988.939V859.764L966.95 795.176Z\"\n      fill=\"#FEFEFF\"\n    />\n    <path\n      d=\"M1078.64 217.621L1190.6 282.209V411.384L1078.64 475.972L966.672 411.384V282.209L1078.64 217.621Z\"\n      fill=\"#D2C7EC\"\n    />\n    <path\n      d=\"M1301.64 216.621L1413.6 281.209V410.384L1301.64 474.972L1189.67 410.384V281.209L1301.64 216.621Z\"\n      fill=\"#D2C7EC\"\n    />\n    <path\n      d=\"M1078.64 603.211L1190.6 667.937V797.389L1078.64 862.115L966.672 797.389V667.937L1078.64 603.211Z\"\n      fill=\"#F8F5FC\"\n    />\n    <path\n      d=\"M1302.64 603.211L1414.6 667.937V797.389L1302.64 862.115L1190.67 797.389V667.937L1302.64 603.211Z\"\n      fill=\"#F8F5FC\"\n    />\n    <path\n      d=\"M1190.88 23.4434L1302.84 88.1695V217.622L1190.88 282.348L1078.91 217.622V88.1695L1190.88 23.4434Z\"\n      fill=\"#D1C6EA\"\n    />\n    <path\n      d=\"M1302.88 -170.557L1414.84 -105.831V23.6216L1302.88 88.3477L1190.91 23.6216V-105.831L1302.88 -170.557Z\"\n      fill=\"#D1C6EA\"\n    />\n    <path\n      d=\"M1190.88 409.033L1302.84 473.759V603.211L1190.88 667.938L1078.91 603.211V473.759L1190.88 409.033Z\"\n      fill=\"#E0D7F2\"\n    />\n    <path\n      d=\"M1190.88 795.176L1302.84 859.764V988.939L1190.88 1053.53L1078.91 988.939V859.764L1190.88 795.176Z\"\n      fill=\"#FDFCFE\"\n    />\n    <path\n      d=\"M1078.97 989L1190.93 1053.73V1183.18L1078.97 1247.9L967 1183.18V1053.73L1078.97 989Z\"\n      fill=\"#FCFBFE\"\n    />\n    <path\n      d=\"M1302.97 989L1414.93 1053.73V1183.18L1302.97 1247.9L1191 1183.18V1053.73L1302.97 989Z\"\n      fill=\"#FCFBFE\"\n    />\n  </g>\n  <defs>\n    <clipPath id=\"clip0_6783_599\">\n      <rect width=\"1280\" height=\"1280\" fill=\"white\" />\n    </clipPath>\n  </defs>\n</svg>";
-
-var ProductpageLight1 = "<svg\n  viewBox=\"0 0 1280 1280\"\n  fill=\"none\"\n  xmlns=\"http://www.w3.org/2000/svg\"\n  preserveAspectRatio=\"none\"\n>\n  <g clipPath=\"url(#clip0_6783_1214)\">\n    <path\n      d=\"M71.2233 23.4434L183.189 88.1695V217.622L71.2233 282.348L-40.7422 217.622V88.1695L71.2233 23.4434Z\"\n      fill=\"#E2E9FA\"\n    />\n    <path\n      d=\"M185.223 -169.557L297.189 -104.831V24.6217L185.223 89.3477L73.2578 24.6217V-104.831L185.223 -169.557Z\"\n      fill=\"#E2E9FA\"\n    />\n    <path\n      d=\"M0.223249 -193.557L112.189 -128.831V0.62165L0.223249 65.3477L-111.742 0.62165V-128.831L0.223249 -193.557Z\"\n      fill=\"#E2E9FA\"\n    />\n    <path\n      d=\"M71.2233 409.033L183.189 473.759V603.211L71.2233 667.938L-40.7422 603.211V473.759L71.2233 409.033Z\"\n      fill=\"#E2EDF9\"\n    />\n    <path\n      d=\"M71.2233 795.176L183.189 859.764V988.939L71.2233 1053.53L-40.7422 988.939V859.764L71.2233 795.176Z\"\n      fill=\"#E8EFF8\"\n    />\n    <path\n      d=\"M182.919 216.621L294.884 281.209V410.384L182.919 474.972L70.9531 410.384V281.209L182.919 216.621Z\"\n      fill=\"#E4EDFC\"\n    />\n    <path\n      d=\"M-40.0814 217.621L71.884 282.209V411.384L-40.0814 475.972L-152.047 411.384V282.209L-40.0814 217.621Z\"\n      fill=\"#E4EDFC\"\n    />\n    <path\n      d=\"M182.919 603.211L294.884 667.937V797.389L182.919 862.115L70.9531 797.389V667.937L182.919 603.211Z\"\n      fill=\"#E5EEFA\"\n    />\n    <path\n      d=\"M-40.0814 602.211L71.884 666.937V796.389L-40.0814 861.115L-152.047 796.389V666.937L-40.0814 602.211Z\"\n      fill=\"#E5EEFA\"\n    />\n    <path\n      d=\"M182.919 988.801L294.884 1053.53V1182.98L182.919 1247.71L70.9531 1182.98V1053.53L182.919 988.801Z\"\n      fill=\"#EBF2F8\"\n    />\n    <path\n      d=\"M70.9186 1181.8L182.884 1246.53V1375.98L70.9186 1440.71L-41.0469 1375.98V1246.53L70.9186 1181.8Z\"\n      fill=\"#EBF2F8\"\n    />\n    <path\n      d=\"M-40.0814 987.801L71.884 1052.53V1181.98L-40.0814 1246.71L-152.047 1181.98V1052.53L-40.0814 987.801Z\"\n      fill=\"#EBF2F8\"\n    />\n    <path\n      d=\"M295.161 23.4434L407.126 88.1695V217.622L295.161 282.348L183.195 217.622V88.1695L295.161 23.4434Z\"\n      fill=\"#E5E9FB\"\n    />\n    <path\n      d=\"M295.161 409.033L407.126 473.759V603.211L295.161 667.938L183.195 603.211V473.759L295.161 409.033Z\"\n      fill=\"#E3EBFA\"\n    />\n    <path\n      d=\"M295.161 795.176L407.126 859.764V988.939L295.161 1053.53L183.195 988.939V859.764L295.161 795.176Z\"\n      fill=\"#E8EEF9\"\n    />\n    <path\n      d=\"M406.848 217.621L518.814 282.209V411.384L406.848 475.972L294.883 411.384V282.209L406.848 217.621Z\"\n      fill=\"#E8E9FB\"\n    />\n    <path\n      d=\"M406.848 603.211L518.814 667.937V797.389L406.848 862.115L294.883 797.389V667.937L406.848 603.211Z\"\n      fill=\"#E6EAF9\"\n    />\n    <path\n      d=\"M406.848 988.801L518.814 1053.53V1182.98L406.848 1247.71L294.883 1182.98V1053.53L406.848 988.801Z\"\n      fill=\"#ECEFF8\"\n    />\n    <path\n      d=\"M518.848 1182.8L630.814 1247.53V1376.98L518.848 1441.71L406.883 1376.98V1247.53L518.848 1182.8Z\"\n      fill=\"#ECEFF8\"\n    />\n    <path\n      d=\"M294.848 1182.8L406.814 1247.53V1376.98L294.848 1441.71L182.883 1376.98V1247.53L294.848 1182.8Z\"\n      fill=\"#ECEFF8\"\n    />\n    <path\n      d=\"M519.09 23.4434L631.056 88.1695V217.622L519.09 282.348L407.125 217.622V88.1695L519.09 23.4434Z\"\n      fill=\"#EEE6FA\"\n    />\n    <path\n      d=\"M408.965 -169L520.931 -104.274V25.1783L408.965 89.9044L297 25.1783V-104.274L408.965 -169Z\"\n      fill=\"#EEE6FA\"\n    />\n    <path\n      d=\"M519.09 409.033L631.056 473.759V603.211L519.09 667.938L407.125 603.211V473.759L519.09 409.033Z\"\n      fill=\"#E9E7F9\"\n    />\n    <path\n      d=\"M519.09 795.176L631.056 859.764V988.939L519.09 1053.53L407.125 988.939V859.764L519.09 795.176Z\"\n      fill=\"#ECEDF9\"\n    />\n    <path\n      d=\"M630.778 217.621L742.743 282.209V411.384L630.778 475.972L518.812 411.384V282.209L630.778 217.621Z\"\n      fill=\"#EFE4FA\"\n    />\n    <path\n      d=\"M630.778 602.211L742.743 666.937V796.389L630.778 861.115L518.812 796.389V666.937L630.778 602.211Z\"\n      fill=\"#ECE8F8\"\n    />\n    <path\n      d=\"M630.778 988.801L742.743 1053.53V1182.98L630.778 1247.71L518.812 1182.98V1053.53L630.778 988.801Z\"\n      fill=\"#F0EEF9\"\n    />\n    <path\n      d=\"M742.778 1181.8L854.743 1246.53V1375.98L742.778 1440.71L630.812 1375.98V1246.53L742.778 1181.8Z\"\n      fill=\"#F0EEF9\"\n    />\n    <path\n      d=\"M743.02 23.4434L854.986 88.1695V217.622L743.02 282.348L631.055 217.622V88.1695L743.02 23.4434Z\"\n      fill=\"#F4E4FB\"\n    />\n    <path\n      d=\"M855.02 -169.557L966.986 -104.831V24.6217L855.02 89.3477L743.055 24.6217V-104.831L855.02 -169.557Z\"\n      fill=\"#F4E4FB\"\n    />\n    <path\n      d=\"M632.02 -169.557L743.986 -104.831V24.6217L632.02 89.3477L520.055 24.6217V-104.831L632.02 -169.557Z\"\n      fill=\"#F4E4FB\"\n    />\n    <path\n      d=\"M743.02 409.033L854.986 473.759V603.211L743.02 667.938L631.055 603.211V473.759L743.02 409.033Z\"\n      fill=\"#EFE3F8\"\n    />\n    <path\n      d=\"M743.02 795.176L854.986 859.764V988.939L743.02 1053.53L631.055 988.939V859.764L743.02 795.176Z\"\n      fill=\"#F0EBF8\"\n    />\n    <path\n      d=\"M854.708 217.621L966.673 282.209V411.384L854.708 475.972L742.742 411.384V282.209L854.708 217.621Z\"\n      fill=\"#F5E1FA\"\n    />\n    <path\n      d=\"M854.708 602.211L966.673 666.937V796.389L854.708 861.115L742.742 796.389V666.937L854.708 602.211Z\"\n      fill=\"#F2E6F7\"\n    />\n    <path\n      d=\"M854.708 988.801L966.673 1053.53V1182.98L854.708 1247.71L742.742 1182.98V1053.53L854.708 988.801Z\"\n      fill=\"#F4EEF8\"\n    />\n    <path\n      d=\"M966.708 1181.8L1078.67 1246.53V1375.98L966.708 1440.71L854.742 1375.98V1246.53L966.708 1181.8Z\"\n      fill=\"#F4EEF8\"\n    />\n    <path\n      d=\"M1078.71 987.801L1190.67 1052.53V1181.98L1078.71 1246.71L966.742 1181.98V1052.53L1078.71 987.801Z\"\n      fill=\"#F3EEF5\"\n    />\n    <path\n      d=\"M1190.71 1181.8L1302.67 1246.53V1375.98L1190.71 1440.71L1078.74 1375.98V1246.53L1190.71 1181.8Z\"\n      fill=\"#F3EEF5\"\n    />\n    <path\n      d=\"M1301.71 987.801L1413.67 1052.53V1181.98L1301.71 1246.71L1189.74 1181.98V1052.53L1301.71 987.801Z\"\n      fill=\"#F3EEF5\"\n    />\n    <path\n      d=\"M966.95 23.4434L1078.92 88.1695V217.622L966.95 282.348L854.984 217.622V88.1695L966.95 23.4434Z\"\n      fill=\"#F8DFFA\"\n    />\n    <path\n      d=\"M1078.95 -170.557L1190.92 -105.831V23.6217L1078.95 88.3477L966.984 23.6217V-105.831L1078.95 -170.557Z\"\n      fill=\"#F8DFFA\"\n    />\n    <path\n      d=\"M966.95 409.033L1078.92 473.759V603.211L966.95 667.938L854.984 603.211V473.759L966.95 409.033Z\"\n      fill=\"#F4E2F7\"\n    />\n    <path\n      d=\"M966.95 795.176L1078.92 859.764V988.939L966.95 1053.53L854.984 988.939V859.764L966.95 795.176Z\"\n      fill=\"#F4EBF7\"\n    />\n    <path\n      d=\"M1078.64 217.621L1190.6 282.209V411.384L1078.64 475.972L966.672 411.384V282.209L1078.64 217.621Z\"\n      fill=\"#F7E0F8\"\n    />\n    <path\n      d=\"M1302.64 216.621L1414.6 281.209V410.384L1302.64 474.972L1190.67 410.384V281.209L1302.64 216.621Z\"\n      fill=\"#F7E0F8\"\n    />\n    <path\n      d=\"M1078.64 603.211L1190.6 667.937V797.389L1078.64 862.115L966.672 797.389V667.937L1078.64 603.211Z\"\n      fill=\"#F5E7F6\"\n    />\n    <path\n      d=\"M1301.64 602.211L1413.6 666.937V796.389L1301.64 861.115L1189.67 796.389V666.937L1301.64 602.211Z\"\n      fill=\"#F5E7F6\"\n    />\n    <path\n      d=\"M1190.88 23.4434L1302.84 88.1695V217.622L1190.88 282.348L1078.91 217.622V88.1695L1190.88 23.4434Z\"\n      fill=\"#F8DFF8\"\n    />\n    <path\n      d=\"M1302.88 -170.557L1414.84 -105.831V23.6217L1302.88 88.3477L1190.91 23.6217V-105.831L1302.88 -170.557Z\"\n      fill=\"#F8DFF8\"\n    />\n    <path\n      d=\"M1189.88 410.033L1301.84 474.759V604.211L1189.88 668.938L1077.91 604.211V474.759L1189.88 410.033Z\"\n      fill=\"#F5E3F6\"\n    />\n    <path\n      d=\"M1190.88 795.176L1302.84 859.764V988.939L1190.88 1053.53L1078.91 988.939V859.764L1190.88 795.176Z\"\n      fill=\"#F6ECF7\"\n    />\n  </g>\n  <defs>\n    <clipPath id=\"clip0_6783_1214\">\n      <rect width=\"1280\" height=\"1280\" fill=\"white\" />\n    </clipPath>\n  </defs>\n</svg>";
+        }
+        // If logicType is "AND", all selected tags should be present in the item's tags
+        if (logicType === "AND") {
+            return selectedControls.every(function (control) {
+                return filteredItem.props.tags.includes(control.label);
+            });
+        }
+        else {
+            // Check if item has tags property and if any selected tags are present in item's tags
+            return selectedControls.some(function (control) {
+                return filteredItem.props.tags.includes(control.label);
+            });
+        }
+    });
+    return (React__default.createElement("div", __assign({ className: "arc-Filter" }, filterAttrs(props)),
+        React__default.createElement(FilterControls, { controlsAlignment: controlsAlignment }, filterControls.map(function (_a, index) {
+            var label = _a.label, isSelected = _a.isSelected;
+            return (React__default.createElement(FilterControl, { key: index, onClick: function () { return handleControlClick(index); }, isSelected: isSelected }, label));
+        })),
+        React__default.createElement(FilterItems, { displayType: displayType, error: error }, filteredItems.map(function (item) { return item.props.children; }))));
+};
 
-var ProductpageLight2 = "<svg\n  viewBox=\"0 0 1280 1280\"\n  fill=\"none\"\n  xmlns=\"http://www.w3.org/2000/svg\"\n  preserveAspectRatio=\"none\"\n>\n  <g clipPath=\"url(#clip0_6783_1351)\">\n    <path\n      d=\"M71.2233 23.4434L183.189 88.1695V217.622L71.2233 282.348L-40.7422 217.622V88.1695L71.2233 23.4434Z\"\n      fill=\"#F9EDF5\"\n    />\n    <path\n      d=\"M183.223 -170.557L295.189 -105.831V23.6217L183.223 88.3477L71.2578 23.6217V-105.831L183.223 -170.557Z\"\n      fill=\"#F9EDF5\"\n    />\n    <path\n      d=\"M-40.7768 -170.557L71.1887 -105.831V23.6217L-40.7768 88.3477L-152.742 23.6217V-105.831L-40.7768 -170.557Z\"\n      fill=\"#F9EDF5\"\n    />\n    <path\n      d=\"M71.2233 409.033L183.189 473.759V603.211L71.2233 667.938L-40.7422 603.211V473.759L71.2233 409.033Z\"\n      fill=\"#FEEBF9\"\n    />\n    <path\n      d=\"M71.2233 795.176L183.189 859.764V988.939L71.2233 1053.53L-40.7422 988.939V859.764L71.2233 795.176Z\"\n      fill=\"#FEECFB\"\n    />\n    <path\n      d=\"M182.919 217.621L294.884 282.209V411.384L182.919 475.972L70.9531 411.384V282.209L182.919 217.621Z\"\n      fill=\"#FDEDF8\"\n    />\n    <path\n      d=\"M-41.0814 216.621L70.884 281.209V410.384L-41.0814 474.972L-153.047 410.384V281.209L-41.0814 216.621Z\"\n      fill=\"#FDEDF8\"\n    />\n    <path\n      d=\"M182.919 603.211L294.884 667.937V797.389L182.919 862.115L70.9531 797.389V667.937L182.919 603.211Z\"\n      fill=\"#FEEBFA\"\n    />\n    <path\n      d=\"M-41.0814 602.211L70.884 666.937V796.389L-41.0814 861.115L-153.047 796.389V666.937L-41.0814 602.211Z\"\n      fill=\"#FEEBFA\"\n    />\n    <path\n      d=\"M182.919 988.801L294.884 1053.53V1182.98L182.919 1247.71L70.9531 1182.98V1053.53L182.919 988.801Z\"\n      fill=\"#FCEBFA\"\n    />\n    <path\n      d=\"M-40.0814 988.801L71.884 1053.53V1182.98L-40.0814 1247.71L-152.047 1182.98V1053.53L-40.0814 988.801Z\"\n      fill=\"#FCEBFA\"\n    />\n    <path\n      d=\"M70.9186 1182.8L182.884 1247.53V1376.98L70.9186 1441.71L-41.0469 1376.98V1247.53L70.9186 1182.8Z\"\n      fill=\"#FCEBFA\"\n    />\n    <path\n      d=\"M295.161 23.4434L407.126 88.1695V217.622L295.161 282.348L183.195 217.622V88.1695L295.161 23.4434Z\"\n      fill=\"#FCEDF7\"\n    />\n    <path\n      d=\"M295.161 409.033L407.126 473.759V603.211L295.161 667.938L183.195 603.211V473.759L295.161 409.033Z\"\n      fill=\"#FEEBF8\"\n    />\n    <path\n      d=\"M295.161 795.176L407.126 859.764V988.939L295.161 1053.53L183.195 988.939V859.764L295.161 795.176Z\"\n      fill=\"#FEEBFA\"\n    />\n    <path\n      d=\"M406.848 217.621L518.814 282.209V411.384L406.848 475.972L294.883 411.384V282.209L406.848 217.621Z\"\n      fill=\"#FCEBF6\"\n    />\n    <path\n      d=\"M406.848 603.211L518.814 667.937V797.389L406.848 862.115L294.883 797.389V667.937L406.848 603.211Z\"\n      fill=\"#FDEAF8\"\n    />\n    <path\n      d=\"M406.848 988.801L518.814 1053.53V1182.98L406.848 1247.71L294.883 1182.98V1053.53L406.848 988.801Z\"\n      fill=\"#FDEBFA\"\n    />\n    <path\n      d=\"M294.848 1182.8L406.814 1247.53V1376.98L294.848 1441.71L182.883 1376.98V1247.53L294.848 1182.8Z\"\n      fill=\"#FDEBFA\"\n    />\n    <path\n      d=\"M518.848 1182.8L630.814 1247.53V1376.98L518.848 1441.71L406.883 1376.98V1247.53L518.848 1182.8Z\"\n      fill=\"#FDEBFA\"\n    />\n    <path\n      d=\"M519.09 23.4434L631.056 88.1695V217.622L519.09 282.348L407.125 217.622V88.1695L519.09 23.4434Z\"\n      fill=\"#FCECF5\"\n    />\n    <path\n      d=\"M407.09 -170.557L519.056 -105.831V23.6217L407.09 88.3477L295.125 23.6217V-105.831L407.09 -170.557Z\"\n      fill=\"#FCECF5\"\n    />\n    <path\n      d=\"M519.09 409.033L631.056 473.759V603.211L519.09 667.938L407.125 603.211V473.759L519.09 409.033Z\"\n      fill=\"#FDE9F6\"\n    />\n    <path\n      d=\"M519.09 795.176L631.056 859.764V988.939L519.09 1053.53L407.125 988.939V859.764L519.09 795.176Z\"\n      fill=\"#FDEAFA\"\n    />\n    <path\n      d=\"M630.778 217.621L742.743 282.209V411.384L630.778 475.972L518.812 411.384V282.209L630.778 217.621Z\"\n      fill=\"#FCEAF4\"\n    />\n    <path\n      d=\"M630.778 603.211L742.743 667.937V797.389L630.778 862.115L518.812 797.389V667.937L630.778 603.211Z\"\n      fill=\"#FCE9F7\"\n    />\n    <path\n      d=\"M630.778 988.801L742.743 1053.53V1182.98L630.778 1247.71L518.812 1182.98V1053.53L630.778 988.801Z\"\n      fill=\"#FCEAFA\"\n    />\n    <path\n      d=\"M742.778 1182.8L854.743 1247.53V1376.98L742.778 1441.71L630.812 1376.98V1247.53L742.778 1182.8Z\"\n      fill=\"#FCEAFA\"\n    />\n    <path\n      d=\"M743.02 23.4434L854.986 88.1695V217.622L743.02 282.348L631.055 217.622V88.1695L743.02 23.4434Z\"\n      fill=\"#FBEAF3\"\n    />\n    <path\n      d=\"M855.02 -170.557L966.986 -105.831V23.6217L855.02 88.3477L743.055 23.6217V-105.831L855.02 -170.557Z\"\n      fill=\"#FBEAF3\"\n    />\n    <path\n      d=\"M631.02 -170.557L742.986 -105.831V23.6217L631.02 88.3477L519.055 23.6217V-105.831L631.02 -170.557Z\"\n      fill=\"#FBEAF3\"\n    />\n    <path\n      d=\"M743.02 409.033L854.986 473.759V603.211L743.02 667.938L631.055 603.211V473.759L743.02 409.033Z\"\n      fill=\"#FBE9F4\"\n    />\n    <path\n      d=\"M743.02 795.176L854.986 859.764V988.939L743.02 1053.53L631.055 988.939V859.764L743.02 795.176Z\"\n      fill=\"#FCE9F8\"\n    />\n    <path\n      d=\"M854.708 217.621L966.673 282.209V411.384L854.708 475.972L742.742 411.384V282.209L854.708 217.621Z\"\n      fill=\"#FBE9F2\"\n    />\n    <path\n      d=\"M854.708 603.211L966.673 667.937V797.389L854.708 862.115L742.742 797.389V667.937L854.708 603.211Z\"\n      fill=\"#FBE8F5\"\n    />\n    <path\n      d=\"M854.708 988.801L966.673 1053.53V1182.98L854.708 1247.71L742.742 1182.98V1053.53L854.708 988.801Z\"\n      fill=\"#FBEAF8\"\n    />\n    <path\n      d=\"M966.708 1182.8L1078.67 1247.53V1376.98L966.708 1441.71L854.742 1376.98V1247.53L966.708 1182.8Z\"\n      fill=\"#FBEAF8\"\n    />\n    <path\n      d=\"M1078.71 988.801L1190.67 1053.53V1182.98L1078.71 1247.71L966.742 1182.98V1053.53L1078.71 988.801Z\"\n      fill=\"#FAEAF7\"\n    />\n    <path\n      d=\"M1302.71 988.801L1414.67 1053.53V1182.98L1302.71 1247.71L1190.74 1182.98V1053.53L1302.71 988.801Z\"\n      fill=\"#FAEAF7\"\n    />\n    <path\n      d=\"M1190.71 1182.8L1302.67 1247.53V1376.98L1190.71 1441.71L1078.74 1376.98V1247.53L1190.71 1182.8Z\"\n      fill=\"#FAEAF7\"\n    />\n    <path\n      d=\"M966.95 23.4434L1078.92 88.1695V217.622L966.95 282.348L854.984 217.622V88.1695L966.95 23.4434Z\"\n      fill=\"#FBEAF2\"\n    />\n    <path\n      d=\"M1078.95 -170.557L1190.92 -105.831V23.6217L1078.95 88.3477L966.984 23.6217V-105.831L1078.95 -170.557Z\"\n      fill=\"#FBEAF2\"\n    />\n    <path\n      d=\"M966.95 409.033L1078.92 473.759V603.211L966.95 667.938L854.984 603.211V473.759L966.95 409.033Z\"\n      fill=\"#FAE8F3\"\n    />\n    <path\n      d=\"M966.95 795.176L1078.92 859.764V988.939L966.95 1053.53L854.984 988.939V859.764L966.95 795.176Z\"\n      fill=\"#FBE9F6\"\n    />\n    <path\n      d=\"M1078.64 217.621L1190.6 282.209V411.384L1078.64 475.972L966.672 411.384V282.209L1078.64 217.621Z\"\n      fill=\"#F9E9F1\"\n    />\n    <path\n      d=\"M1301.64 216.621L1413.6 281.209V410.384L1301.64 474.972L1189.67 410.384V281.209L1301.64 216.621Z\"\n      fill=\"#F9E9F1\"\n    />\n    <path\n      d=\"M1078.64 602.211L1190.6 666.937V796.389L1078.64 861.115L966.672 796.389V666.937L1078.64 602.211Z\"\n      fill=\"#F9E8F4\"\n    />\n    <path\n      d=\"M1301.64 603.211L1413.6 667.937V797.389L1301.64 862.115L1189.67 797.389V667.937L1301.64 603.211Z\"\n      fill=\"#F9E8F4\"\n    />\n    <path\n      d=\"M1190.88 23.4434L1302.84 88.1695V217.622L1190.88 282.348L1078.91 217.622V88.1695L1190.88 23.4434Z\"\n      fill=\"#F7EBF0\"\n    />\n    <path\n      d=\"M1302.88 -170.557L1414.84 -105.831V23.6217L1302.88 88.3477L1190.91 23.6217V-105.831L1302.88 -170.557Z\"\n      fill=\"#F7EBF0\"\n    />\n    <path\n      d=\"M1190.88 409.033L1302.84 473.759V603.211L1190.88 667.938L1078.91 603.211V473.759L1190.88 409.033Z\"\n      fill=\"#F8E7F0\"\n    />\n    <path\n      d=\"M1190.88 795.176L1302.84 859.764V988.939L1190.88 1053.53L1078.91 988.939V859.764L1190.88 795.176Z\"\n      fill=\"#F8E8F5\"\n    />\n  </g>\n  <defs>\n    <clipPath id=\"clip0_6783_1351\">\n      <rect width=\"1280\" height=\"1280\" fill=\"white\" />\n    </clipPath>\n  </defs>\n</svg>";
+var FilterItem = function (_a) {
+    var children = _a.children;
+    return React__default.createElement("div", { className: "arc-FilterItem" }, children);
+};
 
-var FooterLight = "<svg\n  viewBox=\"0 0 1280 1280\"\n  fill=\"none\"\n  xmlns=\"http://www.w3.org/2000/svg\"\n  preserveAspectRatio=\"none\"\n>\n  <g clipPath=\"url(#clip0_6783_1966)\">\n    <path\n      d=\"M71.2233 23.4434L183.189 88.1695V217.622L71.2233 282.348L-40.7422 217.622V88.1695L71.2233 23.4434Z\"\n      fill=\"#F6F1F9\"\n    />\n    <path\n      d=\"M183.223 -170.557L295.189 -105.831V23.6217L183.223 88.3477L71.2578 23.6217V-105.831L183.223 -170.557Z\"\n      fill=\"#F6F1F9\"\n    />\n    <path\n      d=\"M-40.7768 -170.557L71.1887 -105.831V23.6217L-40.7768 88.3477L-152.742 23.6217V-105.831L-40.7768 -170.557Z\"\n      fill=\"#F6F1F9\"\n    />\n    <path\n      d=\"M71.2233 409.033L183.189 473.759V603.211L71.2233 667.938L-40.7422 603.211V473.759L71.2233 409.033Z\"\n      fill=\"#F9F4FC\"\n    />\n    <path\n      d=\"M71.2233 795.176L183.189 859.764V988.939L71.2233 1053.53L-40.7422 988.939V859.764L71.2233 795.176Z\"\n      fill=\"#F8F1FD\"\n    />\n    <path\n      d=\"M182.919 217.621L294.884 282.209V411.384L182.919 475.972L70.9531 411.384V282.209L182.919 217.621Z\"\n      fill=\"#F9F4FC\"\n    />\n    <path\n      d=\"M-40.0814 216.621L71.884 281.209V410.384L-40.0814 474.972L-152.047 410.384V281.209L-40.0814 216.621Z\"\n      fill=\"#F9F4FC\"\n    />\n    <path\n      d=\"M182.919 603.211L294.884 667.937V797.389L182.919 862.115L70.9531 797.389V667.937L182.919 603.211Z\"\n      fill=\"#F9F2FC\"\n    />\n    <path\n      d=\"M-40.0814 602.211L71.884 666.937V796.389L-40.0814 861.115L-152.047 796.389V666.937L-40.0814 602.211Z\"\n      fill=\"#F9F2FC\"\n    />\n    <path\n      d=\"M182.919 988.801L294.884 1053.53V1182.98L182.919 1247.71L70.9531 1182.98V1053.53L182.919 988.801Z\"\n      fill=\"#F7EFFB\"\n    />\n    <path\n      d=\"M-40.0814 987.801L71.884 1052.53V1181.98L-40.0814 1246.71L-152.047 1181.98V1052.53L-40.0814 987.801Z\"\n      fill=\"#F7EFFB\"\n    />\n    <path\n      d=\"M70.9186 1181.8L182.884 1246.53V1375.98L70.9186 1440.71L-41.0469 1375.98V1246.53L70.9186 1181.8Z\"\n      fill=\"#F7EFFB\"\n    />\n    <path\n      d=\"M295.161 23.4434L407.126 88.1695V217.622L295.161 282.348L183.195 217.622V88.1695L295.161 23.4434Z\"\n      fill=\"#F7F2FA\"\n    />\n    <path\n      d=\"M295.161 409.033L407.126 473.759V603.211L295.161 667.938L183.195 603.211V473.759L295.161 409.033Z\"\n      fill=\"#F8F3FC\"\n    />\n    <path\n      d=\"M295.161 795.176L407.126 859.764V988.939L295.161 1053.53L183.195 988.939V859.764L295.161 795.176Z\"\n      fill=\"#F8F0FB\"\n    />\n    <path\n      d=\"M406.848 217.621L518.814 282.209V411.384L406.848 475.972L294.883 411.384V282.209L406.848 217.621Z\"\n      fill=\"#F9F4FC\"\n    />\n    <path\n      d=\"M406.848 603.211L518.814 667.937V797.389L406.848 862.115L294.883 797.389V667.937L406.848 603.211Z\"\n      fill=\"#F7F1FB\"\n    />\n    <path\n      d=\"M406.848 988.801L518.814 1053.53V1182.98L406.848 1247.71L294.883 1182.98V1053.53L406.848 988.801Z\"\n      fill=\"#F7EEFB\"\n    />\n    <path\n      d=\"M294.848 1181.8L406.814 1246.53V1375.98L294.848 1440.71L182.883 1375.98V1246.53L294.848 1181.8Z\"\n      fill=\"#F7EEFB\"\n    />\n    <path\n      d=\"M519.09 23.4434L631.056 88.1695V217.622L519.09 282.348L407.125 217.622V88.1695L519.09 23.4434Z\"\n      fill=\"#F9F4FC\"\n    />\n    <path\n      d=\"M631.09 -170.557L743.056 -105.831V23.6217L631.09 88.3477L519.125 23.6217V-105.831L631.09 -170.557Z\"\n      fill=\"#F9F4FC\"\n    />\n    <path\n      d=\"M407.09 -170.557L519.056 -105.831V23.6217L407.09 88.3477L295.125 23.6217V-105.831L407.09 -170.557Z\"\n      fill=\"#F9F4FC\"\n    />\n    <path\n      d=\"M519.09 409.033L631.056 473.759V603.211L519.09 667.938L407.125 603.211V473.759L519.09 409.033Z\"\n      fill=\"#F8F3FC\"\n    />\n    <path\n      d=\"M519.09 795.176L631.056 859.764V988.939L519.09 1053.53L407.125 988.939V859.764L519.09 795.176Z\"\n      fill=\"#F7EFFB\"\n    />\n    <path\n      d=\"M630.778 217.621L742.743 282.209V411.384L630.778 475.972L518.812 411.384V282.209L630.778 217.621Z\"\n      fill=\"#F8F4FD\"\n    />\n    <path\n      d=\"M630.778 603.211L742.743 667.937V797.389L630.778 862.115L518.812 797.389V667.937L630.778 603.211Z\"\n      fill=\"#F6F0FB\"\n    />\n    <path\n      d=\"M630.778 988.801L742.743 1053.53V1182.98L630.778 1247.71L518.812 1182.98V1053.53L630.778 988.801Z\"\n      fill=\"#F6EFFB\"\n    />\n    <path\n      d=\"M518.778 1182.8L630.743 1247.53V1376.98L518.778 1441.71L406.812 1376.98V1247.53L518.778 1182.8Z\"\n      fill=\"#F6EFFB\"\n    />\n    <path\n      d=\"M743.02 23.4434L854.986 88.1695V217.622L743.02 282.348L631.055 217.622V88.1695L743.02 23.4434Z\"\n      fill=\"#F8F6FD\"\n    />\n    <path\n      d=\"M855.02 -170.557L966.986 -105.831V23.6217L855.02 88.3477L743.055 23.6217V-105.831L855.02 -170.557Z\"\n      fill=\"#F8F6FD\"\n    />\n    <path\n      d=\"M743.02 409.033L854.986 473.759V603.211L743.02 667.938L631.055 603.211V473.759L743.02 409.033Z\"\n      fill=\"#F6F3FC\"\n    />\n    <path\n      d=\"M743.02 795.176L854.986 859.764V988.939L743.02 1053.53L631.055 988.939V859.764L743.02 795.176Z\"\n      fill=\"#F5EFFA\"\n    />\n    <path\n      d=\"M854.708 217.621L966.673 282.209V411.384L854.708 475.972L742.742 411.384V282.209L854.708 217.621Z\"\n      fill=\"#F7F5FD\"\n    />\n    <path\n      d=\"M854.708 603.211L966.673 667.937V797.389L854.708 862.115L742.742 797.389V667.937L854.708 603.211Z\"\n      fill=\"#F4F0FB\"\n    />\n    <path\n      d=\"M854.708 988.801L966.673 1053.53V1182.98L854.708 1247.71L742.742 1182.98V1053.53L854.708 988.801Z\"\n      fill=\"#F3EFFA\"\n    />\n    <path\n      d=\"M742.708 1181.8L854.673 1246.53V1375.98L742.708 1440.71L630.742 1375.98V1246.53L742.708 1181.8Z\"\n      fill=\"#F3EFFA\"\n    />\n    <path\n      d=\"M966.708 1182.8L1078.67 1247.53V1376.98L966.708 1441.71L854.742 1376.98V1247.53L966.708 1182.8Z\"\n      fill=\"#F3EFFA\"\n    />\n    <path\n      d=\"M1078.71 988.801L1190.67 1053.53V1182.98L1078.71 1247.71L966.742 1182.98V1053.53L1078.71 988.801Z\"\n      fill=\"#F0EEF9\"\n    />\n    <path\n      d=\"M1301.71 987.801L1413.67 1052.53V1181.98L1301.71 1246.71L1189.74 1181.98V1052.53L1301.71 987.801Z\"\n      fill=\"#F0EEF9\"\n    />\n    <path\n      d=\"M1190.71 1181.8L1302.67 1246.53V1375.98L1190.71 1440.71L1078.74 1375.98V1246.53L1190.71 1181.8Z\"\n      fill=\"#F0EEF9\"\n    />\n    <path\n      d=\"M966.95 23.4434L1078.92 88.1695V217.622L966.95 282.348L854.984 217.622V88.1695L966.95 23.4434Z\"\n      fill=\"#F5F5FA\"\n    />\n    <path\n      d=\"M1078.95 -169.557L1190.92 -104.831V24.6217L1078.95 89.3477L966.984 24.6217V-104.831L1078.95 -169.557Z\"\n      fill=\"#F5F5FA\"\n    />\n    <path\n      d=\"M966.95 409.033L1078.92 473.759V603.211L966.95 667.938L854.984 603.211V473.759L966.95 409.033Z\"\n      fill=\"#F4F3FC\"\n    />\n    <path\n      d=\"M966.95 795.176L1078.92 859.764V988.939L966.95 1053.53L854.984 988.939V859.764L966.95 795.176Z\"\n      fill=\"#F3EFFA\"\n    />\n    <path\n      d=\"M1078.64 217.621L1190.6 282.209V411.384L1078.64 475.972L966.672 411.384V282.209L1078.64 217.621Z\"\n      fill=\"#F5F5FC\"\n    />\n    <path\n      d=\"M1302.64 216.621L1414.6 281.209V410.384L1302.64 474.972L1190.67 410.384V281.209L1302.64 216.621Z\"\n      fill=\"#F5F5FC\"\n    />\n    <path\n      d=\"M1078.64 603.211L1190.6 667.937V797.389L1078.64 862.115L966.672 797.389V667.937L1078.64 603.211Z\"\n      fill=\"#F2F1FB\"\n    />\n    <path\n      d=\"M1302.64 602.211L1414.6 666.937V796.389L1302.64 861.115L1190.67 796.389V666.937L1302.64 602.211Z\"\n      fill=\"#F2F1FB\"\n    />\n    <path\n      d=\"M1190.88 23.4434L1302.84 88.1695V217.622L1190.88 282.348L1078.91 217.622V88.1695L1190.88 23.4434Z\"\n      fill=\"#F2F4F9\"\n    />\n    <path\n      d=\"M1301.88 -170.557L1413.84 -105.831V23.6217L1301.88 88.3477L1189.91 23.6217V-105.831L1301.88 -170.557Z\"\n      fill=\"#F2F4F9\"\n    />\n    <path\n      d=\"M1190.88 409.033L1302.84 473.759V603.211L1190.88 667.938L1078.91 603.211V473.759L1190.88 409.033Z\"\n      fill=\"#F4F2FC\"\n    />\n    <path\n      d=\"M1190.88 795.176L1302.84 859.764V988.939L1190.88 1053.53L1078.91 988.939V859.764L1190.88 795.176Z\"\n      fill=\"#F2EFF9\"\n    />\n  </g>\n  <defs>\n    <clipPath id=\"clip0_6783_1966\">\n      <rect width=\"1280\" height=\"1280\" fill=\"white\" />\n    </clipPath>\n  </defs>\n</svg>";
+var GhostedHeroBanner = function (_a) {
+    var heading = _a.heading, headingLevel = _a.headingLevel, label = _a.label, text = _a.text, img = _a.img, children = _a.children, _b = _a.fontStyle, fontStyle = _b === void 0 ? "default" : _b, props = __rest(_a, ["heading", "headingLevel", "label", "text", "img", "children", "fontStyle"]);
+    return (React__default.createElement("div", __assign({ className: "arc-GhostedHeroBanner" }, filterAttrs(props)),
+        React__default.createElement("div", { className: "arc-GhostedHeroBanner-content" },
+            label && (React__default.createElement(React__default.Fragment, null,
+                React__default.createElement(Heading, { fontStyle: "overline" }, label),
+                React__default.createElement(VerticalSpace, { size: "8" }))),
+            React__default.createElement(Heading, { level: headingLevel, size: fontStyle === "default" ? "xl" : "xxl", fontStyle: fontStyle }, heading),
+            text && (React__default.createElement(React__default.Fragment, null,
+                React__default.createElement(VerticalSpace, { size: "16" }),
+                React__default.createElement("span", { className: "arc-TemplateBanner-text" }, text))),
+            children && (React__default.createElement(React__default.Fragment, null,
+                React__default.createElement(VerticalSpace, { size: "32" }),
+                children))),
+        React__default.createElement("div", { className: "arc-GhostedHeroBanner-image " }, img && React__default.createElement(BannerImage, __assign({ ariaHidden: true }, img)))));
+};
 
-// commented out s+ props as the svgs don't exist yet
-var BackgroundGradients = {
-    HomepageDark1: {
-        xs: HomepageDark1,
-        // s: HomepageDark1,
-        // m: HomepageDark1,
-        // l: HomepageDark1,
-        // xl: HomepageDark1,
-        // xxl: HomepageDark1,
-    },
-    HomepageDark2: {
-        xs: HomepageDark2,
-        // s: HomepageDark2,
-        // m: HomepageDark2,
-        // l: HomepageDark2,
-        // xl: HomepageDark2,
-        // xxl: HomepageDark2,
-    },
-    ProductpageDark1: {
-        xs: ProductpageDark1,
-        // s: ProductpageDark1,
-        // m: ProductpageDark1,
-        // l: ProductpageDark1,
-        // xl: ProductpageDark1,
-        // xxl: ProductpageDark1,
-    },
-    ProductpageDark2: {
-        xs: ProductpageDark2,
-        // s: ProductpageDark2,
-        // m: ProductpageDark2,
-        // l: ProductpageDark2,
-        // xl: ProductpageDark2,
-        // xxl: ProductpageDark2,
-    },
-    HomepageLight1: {
-        xs: HomepageLight1,
-        // s: HomepageLight1,
-        // m: HomepageLight1,
-        // l: HomepageLight1,
-        // xl: HomepageLight1,
-        // xxl: HomepageLight1,
-    },
-    HomepageLight2: {
-        xs: HomepageLight2,
-        // s: HomepageLight2,
-        // m: HomepageLight2,
-        // l: HomepageLight2,
-        // xl: HomepageLight2,
-        // xxl: HomepageLight2,
-    },
-    ProductpageLight1: {
-        xs: ProductpageLight1,
-        // s: ProductpageLight1,
-        // m: ProductpageLight1,
-        // l: ProductpageLight1,
-        // xl: ProductpageLight1,
-        // xxl: ProductpageLight1,
-    },
-    ProductpageLight2: {
-        xs: ProductpageLight2,
-        // s: ProductpageLight2,
-        // m: ProductpageLight2,
-        // l: ProductpageLight2,
-        // xl: ProductpageLight2,
-        // xxl: ProductpageLight2,
-    },
-    FooterLight: {
-        xs: FooterLight,
-        // s: FooterLight,
-        // m: FooterLight,
-        // l: FooterLight,
-        // xl: FooterLight,
-        // xxl: FooterLight,
-    },
+/**
+ * Provides an object of breakpoints for responsive designs.
+ *
+ * This object contains keys representing breakpoint names (e.g., `xxl`, `xl`)
+ * and values representing the pixel widths for those breakpoints. The values are parsed
+ * from strings (e.g., "1400px") into numbers for easier usage in responsive logic.
+ *
+ * Kept in src for internal use
+ */
+var ArcBreakpoints = {
+    xxl: parseInt(ArcSizeBreakpointsXxl, 10),
+    xl: parseInt(ArcSizeBreakpointsXl, 10),
+    l: parseInt(ArcSizeBreakpointsL, 10),
+    m: parseInt(ArcSizeBreakpointsM, 10),
+    s: parseInt(ArcSizeBreakpointsS, 10),
+    xs: parseInt(ArcSizeBreakpointsXs, 10),
 };
+var ARC_MIN_S_BREAKPOINT = "(min-width: ".concat(ArcSizeBreakpointsS, ")");
+var ARC_MIN_M_BREAKPOINT = "(min-width: ".concat(ArcSizeBreakpointsM, ")");
+var ARC_MIN_L_BREAKPOINT = "(min-width: ".concat(ArcSizeBreakpointsL, ")");
+var ARC_MIN_XL_BREAKPOINT = "(min-width: ".concat(ArcSizeBreakpointsXl, ")");
+var ARC_MIN_XXL_BREAKPOINT = "(min-width: ".concat(ArcSizeBreakpointsXxl, ")");
 
-var ScrimFade = function (props) {
-    var _a;
-    var totalHeight = (_a = props === null || props === void 0 ? void 0 : props.scrimfadeheight) !== null && _a !== void 0 ? _a : 1000;
-    if (!props.scrimfadeheight && props.scrimfadesize) {
-        if (props.scrimfadesize === "l") {
-            totalHeight = 1408;
-        }
-        else if (props.scrimfadesize === "m") {
-            totalHeight = 1024;
+var ClientSideVisible = function (_a) {
+    var children = _a.children;
+    var _b = useState(false), canRender = _b[0], setCanRender = _b[1];
+    useEffect(function () {
+        if (typeof window !== "undefined") {
+            setCanRender(true);
         }
-        else if (props.scrimfadesize === "s") {
-            totalHeight = 640;
+    }, [setCanRender]);
+    return (React__default.createElement("div", { style: { visibility: canRender ? "visible" : "hidden" } }, children));
+};
+
+var ScrimFade = function (_a) {
+    var scrimFadeHeight = _a.scrimFadeHeight, scrimFadeSize = _a.scrimFadeSize, scrimFadePosition = _a.scrimFadePosition;
+    var _b = useMemo(function () {
+        var fadeModifier = 128;
+        var defaultSizes = {
+            s: {
+                totalHeight: 640,
+                fadeHeight: 640 - fadeModifier,
+            },
+            m: {
+                totalHeight: 1024,
+                fadeHeight: 1024 - fadeModifier,
+            },
+            l: {
+                totalHeight: 1408,
+                fadeHeight: 1408 - fadeModifier,
+            },
+        };
+        if (!scrimFadeHeight) {
+            return defaultSizes[scrimFadeSize];
         }
-    }
-    var fadeHeight = totalHeight - 128;
-    return (React.createElement("svg", __assign({ width: "1024", height: totalHeight, viewBox: "0 0 1024 ".concat(totalHeight), fill: "none", xmlns: "http://www.w3.org/2000/svg" }, props),
+        return {
+            totalHeight: scrimFadeHeight,
+            fadeHeight: scrimFadeHeight - fadeModifier,
+        };
+    }, [scrimFadeHeight, scrimFadeSize]), totalHeight = _b.totalHeight, fadeHeight = _b.fadeHeight;
+    return (React.createElement("svg", { width: "1024", height: totalHeight, viewBox: "0 0 1024 ".concat(totalHeight), fill: "none", xmlns: "http://www.w3.org/2000/svg", preserveAspectRatio: "none", className: classNames("arc-GradientPageBackground-scrimFade", scrimFadePosition &&
+            "arc-GradientPageBackground-scrimFade--".concat(scrimFadePosition)) },
         React.createElement("rect", { y: "128", width: "1024", height: fadeHeight, fill: "url(#paint0_linear_6538_9883)" }),
         React.createElement("g", { opacity: "0.7" },
             React.createElement("rect", { width: "1024", height: totalHeight, fill: "url(#paint1_linear_6538_9883)", style: { mixBlendMode: "soft-light" } })),
@@ -16584,88 +16569,72 @@ var ScrimFade = function (props) {
                 React.createElement("stop", { offset: "1", stopColor: "white" })))));
 };
 
-var GradientPageBackground = function (_a) {
-    var _b, _c;
-    var _d = _a.type, type = _d === void 0 ? "HomepageDark1" : _d, children = _a.children, scrimFadeSize = _a.scrimFadeSize, scrimFadeHeights = _a.scrimFadeHeights, _e = _a.scrimFadePosition, scrimFadePosition = _e === void 0 ? "bottom" : _e, extendBackgrounds = _a.extendBackgrounds, customGradients = _a.customGradients, props = __rest(_a, ["type", "children", "scrimFadeSize", "scrimFadeHeights", "scrimFadePosition", "extendBackgrounds", "customGradients"]);
-    var _f = useState(), scrimFadeHeight = _f[0], setScrimFadeHeight = _f[1];
-    var _g = useState(), extendBackground = _g[0], setExtendBackground = _g[1];
-    var _h = useState(BackgroundGradients.HomepageDark1.xs), backgroundGradient = _h[0], setBackgroundGradient = _h[1];
-    var _j = useState(), customGradient = _j[0], setCustomGradient = _j[1];
-    var _k = useState("xs"), breakpoint = _k[0], setBreakpoint = _k[1];
-    var gradientUri = svgToMiniDataURI(backgroundGradient !== null && backgroundGradient !== void 0 ? backgroundGradient : "");
-    var isMinWidthArcBreakpointS = useMediaQuery(S_BREAKPOINT);
-    var isMinWidthArcBreakpointM = useMediaQuery(M_BREAKPOINT);
-    var isMinWidthArcBreakpointL = useMediaQuery(L_BREAKPOINT);
-    var isMinWidthArcBreakpointXl = useMediaQuery(XL_BREAKPOINT);
-    //  Update current breakpoint value for props
-    useEffect(function () {
+// Inherit the last provided value when no value is provided
+var getResponsiveConfig = function (property, breakpoint) {
+    if (!property || !breakpoint)
+        return;
+    var breakpoints = ["xs", "s", "m", "l", "xl", "xxl"];
+    return breakpoints.reduce(function (acc, bp, index) {
         var _a;
-        var breakpoints = [
-            ["xl", isMinWidthArcBreakpointXl],
-            ["l", isMinWidthArcBreakpointL],
-            ["m", isMinWidthArcBreakpointM],
-            ["s", isMinWidthArcBreakpointS],
-            ["xs", true],
-        ];
-        var matched = breakpoints.find(function (_a) {
-            var match = _a[1];
-            return match;
-        });
-        setBreakpoint((_a = matched === null || matched === void 0 ? void 0 : matched[0]) !== null && _a !== void 0 ? _a : "xs");
+        return (__assign(__assign({}, acc), (_a = {}, _a[bp] = property[bp] || acc[breakpoints[index - 1]], _a)));
+    }, {})[breakpoint];
+};
+
+var GradientPageBackground = function (_a) {
+    var _b;
+    var gradient = _a.gradient, responsiveGradient = _a.responsiveGradient, children = _a.children, scrimFadeSize = _a.scrimFadeSize, scrimFadeHeights = _a.scrimFadeHeights, extendBackgrounds = _a.extendBackgrounds, loading = _a.loading, _c = _a.scrimFadePosition, scrimFadePosition = _c === void 0 ? "bottom" : _c, props = __rest(_a, ["gradient", "responsiveGradient", "children", "scrimFadeSize", "scrimFadeHeights", "extendBackgrounds", "loading", "scrimFadePosition"]);
+    var isMinWidthArcBreakpointS = useMediaQuery(ARC_MIN_S_BREAKPOINT);
+    var isMinWidthArcBreakpointM = useMediaQuery(ARC_MIN_M_BREAKPOINT);
+    var isMinWidthArcBreakpointL = useMediaQuery(ARC_MIN_L_BREAKPOINT);
+    var isMinWidthArcBreakpointXl = useMediaQuery(ARC_MIN_XL_BREAKPOINT);
+    var isMinWidthArcBreakpointXxl = useMediaQuery(ARC_MIN_XXL_BREAKPOINT);
+    var breakpoint = useMemo(function () {
+        var breakpoints = {
+            xs: true,
+            s: isMinWidthArcBreakpointS,
+            m: isMinWidthArcBreakpointM,
+            l: isMinWidthArcBreakpointL,
+            xl: isMinWidthArcBreakpointXl,
+            xxl: isMinWidthArcBreakpointXxl,
+        };
+        return Object.keys(breakpoints).findLast(function (key) { return breakpoints[key]; });
     }, [
-        isMinWidthArcBreakpointXl,
-        isMinWidthArcBreakpointL,
-        isMinWidthArcBreakpointM,
         isMinWidthArcBreakpointS,
+        isMinWidthArcBreakpointM,
+        isMinWidthArcBreakpointL,
+        isMinWidthArcBreakpointXl,
+        isMinWidthArcBreakpointXxl,
     ]);
-    // Function to inherit the last provided value when no value is provided
-    var inheritFallbackKey = function (obj, key) {
-        var keysInOrder = ["xs", "s", "m", "l", "xl", "xxl"];
-        var index = keysInOrder.indexOf(key);
-        if (index === -1)
-            return;
-        for (var i = index; i >= 0; i--) {
-            var fallbackKey = keysInOrder[i];
-            if (obj[fallbackKey] !== undefined) {
-                return obj[fallbackKey];
-            }
-        }
-        return undefined;
+    var customGradient = useMemo(function () { return getResponsiveConfig(responsiveGradient, breakpoint); }, [responsiveGradient, breakpoint]);
+    var scrimFadeHeight = useMemo(function () { return getResponsiveConfig(scrimFadeHeights, breakpoint); }, [breakpoint, scrimFadeHeights]);
+    var extendBackground = useMemo(function () { return getResponsiveConfig(extendBackgrounds, breakpoint); }, [breakpoint, extendBackgrounds]);
+    var gradientPathway = {
+        light: "light-white",
+        dark: "dark-black",
     };
-    // Update props when breakpoint changes
-    useEffect(function () {
-        var _a;
-        if (!breakpoint)
-            return;
-        setScrimFadeHeight(inheritFallbackKey(scrimFadeHeights !== null && scrimFadeHeights !== void 0 ? scrimFadeHeights : {}, breakpoint));
-        setExtendBackground(inheritFallbackKey(extendBackgrounds !== null && extendBackgrounds !== void 0 ? extendBackgrounds : {}, breakpoint));
-        setBackgroundGradient(inheritFallbackKey((_a = BackgroundGradients === null || BackgroundGradients === void 0 ? void 0 : BackgroundGradients[type]) !== null && _a !== void 0 ? _a : {}, breakpoint));
-        setCustomGradient(inheritFallbackKey(customGradients !== null && customGradients !== void 0 ? customGradients : {}, breakpoint));
-    }, [breakpoint, type]); // type only for storybook
-    return (React__default.createElement("div", __assign({ className: classNames("arc-GradientPageBackground", (_b = {},
-            _b["arc-GradientPageBackground--".concat(scrimFadePosition)] = scrimFadePosition,
-            _b)), style: extendBackground && scrimFadePosition == "bottom"
-            ? {
-                paddingBottom: "".concat(extendBackground, "px"),
-                marginBottom: "-".concat(extendBackground, "px"),
-            }
-            : {
-                paddingTop: "".concat(extendBackground, "px"),
-                marginTop: "-".concat(extendBackground, "px"),
-            } }, filterAttrs(props)),
-        React__default.createElement("div", { className: "arc-GradientPageBackground-svgWrapper" },
-            React__default.createElement("img", { src: customGradient || gradientUri, alt: "", className: "arc-GradientPageBackground-svgbg" })),
-        React__default.createElement("div", { className: "arc-GradientPageBackground-content" },
-            React__default.createElement(Surface, { isTransparent: true, background: customGradient
-                    ? (customGradient === null || customGradient === void 0 ? void 0 : customGradient.includes("Light"))
-                        ? "light-white"
-                        : "dark-black"
-                    : type.includes("Light")
-                        ? "light-white"
-                        : "dark-black" }, children)),
-        scrimFadeSize && (React__default.createElement(ScrimFade, { className: classNames("arc-GradientPageBackground-scrimFade", (_c = {},
-                _c["arc-GradientPageBackground-scrimFade--".concat(scrimFadePosition)] = scrimFadePosition,
-                _c)), scrimfadeheight: scrimFadeHeight ? scrimFadeHeight : null, scrimfadesize: scrimFadeSize, preserveAspectRatio: "none" }))));
+    var extentedBackgroundScrimStyles = {
+        top: {
+            paddingTop: "".concat(extendBackground, "px"),
+            marginTop: "-".concat(extendBackground, "px"),
+        },
+        bottom: {
+            paddingBottom: "".concat(extendBackground, "px"),
+            marginBottom: "-".concat(extendBackground, "px"),
+        },
+    };
+    return (React__default.createElement(ClientSideVisible, null,
+        React__default.createElement("div", __assign({ className: classNames("arc-GradientPageBackground", (_b = {},
+                _b["arc-GradientPageBackground--".concat(scrimFadePosition)] = scrimFadePosition,
+                _b)), style: __assign({}, (extendBackground
+                ? extentedBackgroundScrimStyles[scrimFadePosition]
+                : {})) }, filterAttrs(props)),
+            React__default.createElement("div", { className: "arc-GradientPageBackground-svgWrapper" },
+                React__default.createElement("img", { src: (customGradient === null || customGradient === void 0 ? void 0 : customGradient.svg) || (gradient === null || gradient === void 0 ? void 0 : gradient.svg), alt: "", className: "arc-GradientPageBackground-svgbg", loading: loading })),
+            React__default.createElement("div", { className: "arc-GradientPageBackground-content" },
+                React__default.createElement(Surface, { isTransparent: true, background: customGradient
+                        ? gradientPathway[customGradient === null || customGradient === void 0 ? void 0 : customGradient.type]
+                        : gradientPathway[(gradient === null || gradient === void 0 ? void 0 : gradient.type) || "light"] }, children)),
+            scrimFadeSize && (React__default.createElement(ScrimFade, { scrimFadeHeight: scrimFadeHeight, scrimFadeSize: scrimFadeSize, scrimFadePosition: scrimFadePosition, preserveAspectRatio: "none" })))));
 };
 
 /**
@@ -16699,11 +16668,11 @@ var GroupItem = function (_a) {
 };
 
 var HeroBanner = function (_a) {
-    var heading = _a.heading, label = _a.label, text = _a.text, img = _a.img, _b = _a.contentRatio, contentRatio = _b === void 0 ? "1/1" : _b, children = _a.children, minHeight = _a.minHeight, _c = _a.isReversed, isReversed = _c === void 0 ? false : _c, _d = _a.isElevated, isElevated = _d === void 0 ? false : _d, _e = _a.headingLevel, headingLevel = _e === void 0 ? "2" : _e, _f = _a.extendBeyondContainer, extendBeyondContainer = _f === void 0 ? false : _f, _g = _a.type, type = _g === void 0 ? "light" : _g, props = __rest(_a, ["heading", "label", "text", "img", "contentRatio", "children", "minHeight", "isReversed", "isElevated", "headingLevel", "extendBeyondContainer", "type"]);
+    var heading = _a.heading, label = _a.label, text = _a.text, img = _a.img, _b = _a.contentRatio, contentRatio = _b === void 0 ? "1/1" : _b, children = _a.children, minHeight = _a.minHeight, _c = _a.isReversed, isReversed = _c === void 0 ? false : _c, _d = _a.isElevated, isElevated = _d === void 0 ? false : _d, _e = _a.headingLevel, headingLevel = _e === void 0 ? "2" : _e, _f = _a.extendBeyondContainer, extendBeyondContainer = _f === void 0 ? false : _f, _g = _a.type, type = _g === void 0 ? "light" : _g, _h = _a.fontStyle, fontStyle = _h === void 0 ? "default" : _h, props = __rest(_a, ["heading", "label", "text", "img", "contentRatio", "children", "minHeight", "isReversed", "isElevated", "headingLevel", "extendBeyondContainer", "type", "fontStyle"]);
     return (React__default.createElement(ConditionalWrapper, { condition: extendBeyondContainer, wrapper: function (children) { return (React__default.createElement("div", { className: classNames({
                 "arc-HeroBanner--expanded": extendBeyondContainer,
             }) }, children)); } },
-        React__default.createElement(TemplateBanner, __assign({ heading: heading, label: label, text: text, img: img, contentRatio: contentRatio, minHeight: minHeight, isReversed: isReversed, isElevated: isElevated, headingLevel: headingLevel, type: type, headingSize: "xl", alignment: "center" }, filterAttrs(props)), children)));
+        React__default.createElement(TemplateBanner, __assign({ heading: heading, label: label, text: text, img: img, contentRatio: contentRatio, minHeight: minHeight, isReversed: isReversed, isElevated: isElevated, headingLevel: headingLevel, type: type, headingSize: fontStyle === "default" ? "xl" : "xxl", fontStyle: fontStyle, alignment: "center" }, filterAttrs(props)), children)));
 };
 
 /**
@@ -16789,22 +16758,11 @@ var Hidden = function (_a) {
         }) }, filterAttrs(props)), children));
 };
 
-var ArrowRight = "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3e%3cpath d='M18.146 11.646a.5.5 0 0 0 0 .707l3.147 3.147H9.5a.5.5 0 0 0 0 1h11.793l-3.146 3.146a.5.5 0 1 0 .707.707L23.207 16l-4.354-4.354a.5.5 0 0 0-.707 0'/%3e%3c/svg%3e";
-var ArrowRightFill = "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3e%3cpath fill='currentColor' d='M2 16A14 14 0 1 0 16 2 14 14 0 0 0 2 16m16.854-4.354L23.207 16l-4.354 4.354a.5.5 0 0 1-.707-.707l3.147-3.147H9.5a.5.5 0 0 1 0-1h11.793l-3.146-3.146a.5.5 0 0 1 .707-.707'/%3e%3c/svg%3e";
-var Play = "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3e%3cpath d='m20.839 15.04-7.178-4.144a1.107 1.107 0 0 0-1.661.958v8.288a1.105 1.105 0 0 0 1.661.96l7.178-4.145a1.107 1.107 0 0 0 0-1.917m-.5 1.051-7.178 4.145a.1.1 0 0 1-.107 0 .1.1 0 0 1-.054-.094v-8.288a.1.1 0 0 1 .054-.092.1.1 0 0 1 .107 0l7.178 4.143a.1.1 0 0 1 .054.094.1.1 0 0 1-.054.092'/%3e%3c/svg%3e";
-var PlayFill = "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3e%3cpath d='M16 2a14 14 0 1 0 14 14A14 14 0 0 0 16 2m4.839 14.957-7.178 4.145a1.108 1.108 0 0 1-1.661-.96v-8.288a1.107 1.107 0 0 1 1.661-.958l7.178 4.144a1.107 1.107 0 0 1 0 1.917'/%3e%3c/svg%3e";
-
 var CardFooter = function (_a) {
     var metaText = _a.metaText, _b = _a.buttonIcon, buttonIcon = _b === void 0 ? "arrow" : _b, _c = _a.buttonSize, buttonSize = _c === void 0 ? "m" : _c, _d = _a.isDarkPathway, isDarkPathway = _d === void 0 ? false : _d, _e = _a.showButton, showButton = _e === void 0 ? true : _e, _f = _a.isHovered, isHovered = _f === void 0 ? false : _f;
     var icons = {
-        arrow: {
-            regular: ArrowRight,
-            filled: ArrowRightFill,
-        },
-        play: {
-            regular: Play,
-            filled: PlayFill,
-        },
+        arrow: "cardRight",
+        play: "cardPlay",
     };
     return (React__default.createElement("div", { className: classNames("arc-CardFooter", {
             "arc-CardFooter--darkPathway": isDarkPathway,
@@ -16818,14 +16776,14 @@ var CardFooter = function (_a) {
                     React__default.createElement("div", { className: classNames("arc-CardFooter-buttonIconRight", {
                             "arc-CardFooter-buttonIconRight--isHovered": isHovered,
                         }) },
-                        React__default.createElement(Icon$1, { icon: icons[buttonIcon].regular })),
+                        React__default.createElement(ThemeIcon, { icon: icons[buttonIcon] })),
                     React__default.createElement("div", { className: "arc-CardFooter-buttonIconLeft" },
-                        React__default.createElement(Icon$1, { icon: icons[buttonIcon].regular }))))))));
+                        React__default.createElement(ThemeIcon, { icon: icons[buttonIcon] }))))))));
 };
 
 var CardHeading = function (_a) {
     var onClick = _a.onClick, onMouseEnter = _a.onMouseEnter, onMouseLeave = _a.onMouseLeave, onBlur = _a.onBlur, onFocus = _a.onFocus, href = _a.href, heading = _a.heading, _b = _a.size, size = _b === void 0 ? "m" : _b, _c = _a.linkData, linkData = _c === void 0 ? {} : _c, _d = _a.headingLevel, headingLevel = _d === void 0 ? "2" : _d;
-    return (React__default.createElement(Heading, { level: headingLevel, size: size }, href ? (React__default.createElement("a", __assign({ className: "arc-CardHeading-link", href: href, onClick: onClick, onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave, onFocus: onFocus, onBlur: onBlur }, filterAttrs(linkData)), heading)) : (heading)));
+    return (React__default.createElement(Heading, { level: headingLevel, size: size, isWordWrap: false }, href ? (React__default.createElement("a", __assign({ className: "arc-CardHeading-link", href: href, onClick: onClick, onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave, onFocus: onFocus, onBlur: onBlur }, filterAttrs(linkData)), heading)) : (heading)));
 };
 
 var HorizontalCard = function (_a) {
@@ -16848,8 +16806,8 @@ var HorizontalCard = function (_a) {
 
 /** Use `ImpactCard` for important content that needs additional hierarchy and prominence.  */
 var ImpactCard = function (_a) {
-    var url = _a.url, onClick = _a.onClick, heading = _a.heading, img = _a.img, label = _a.label, minHeight = _a.minHeight, _b = _a.headingSize, headingSize = _b === void 0 ? "m" : _b, _c = _a.linkData, linkData = _c === void 0 ? {} : _c, _d = _a.pathway, pathway = _d === void 0 ? "light" : _d, _e = _a.headingLevel, headingLevel = _e === void 0 ? "2" : _e, _f = _a.buttonIcon, buttonIcon = _f === void 0 ? "arrow" : _f, props = __rest(_a, ["url", "onClick", "heading", "img", "label", "minHeight", "headingSize", "linkData", "pathway", "headingLevel", "buttonIcon"]);
-    var _g = useState(false), showHoverState = _g[0], setShowHoverState = _g[1];
+    var url = _a.url, onClick = _a.onClick, heading = _a.heading, img = _a.img, label = _a.label, minHeight = _a.minHeight, _b = _a.headingSize, headingSize = _b === void 0 ? "m" : _b, _c = _a.linkData, linkData = _c === void 0 ? {} : _c, _d = _a.pathway, pathway = _d === void 0 ? "light" : _d, _e = _a.headingLevel, headingLevel = _e === void 0 ? "2" : _e, _f = _a.buttonIcon, buttonIcon = _f === void 0 ? "arrow" : _f, _g = _a.labelLevel, labelLevel = _g === void 0 ? "3" : _g, props = __rest(_a, ["url", "onClick", "heading", "img", "label", "minHeight", "headingSize", "linkData", "pathway", "headingLevel", "buttonIcon", "labelLevel"]);
+    var _h = useState(false), showHoverState = _h[0], setShowHoverState = _h[1];
     var surface = useContext(Context$3).surface;
     var handleShowHoverState = function (show) { return function () { return setShowHoverState(show); }; };
     var isDarkPathway = pathway === "dark";
@@ -16863,7 +16821,7 @@ var ImpactCard = function (_a) {
             React__default.createElement(Image, __assign({ fit: "cover", alt: "" }, img))),
         React__default.createElement("div", { className: "arc-ImpactCard-contentContainer" },
             label && (React__default.createElement("div", { className: "arc-ImpactCard-label" },
-                React__default.createElement(Heading, { level: "3", fontStyle: "overline" }, label),
+                React__default.createElement(Heading, { level: labelLevel, fontStyle: "overline" }, label),
                 React__default.createElement(VerticalSpace, { size: "16" }))),
             React__default.createElement(CardHeading, { heading: heading, size: headingSize, headingLevel: headingLevel, linkData: linkData, href: url, onClick: onClick, onMouseEnter: handleShowHoverState(true), onMouseLeave: handleShowHoverState(false), onFocus: handleShowHoverState(true), onBlur: handleShowHoverState(false) })),
         React__default.createElement(CardFooter, { buttonIcon: buttonIcon, showButton: true, isDarkPathway: isDarkPathway, isHovered: showHoverState })));
@@ -16878,30 +16836,20 @@ const BtIconArrowRight =
   "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3e%3cpath d='M16 2a14 14 0 1 0 14 14A14 14 0 0 0 16 2m0 27a13 13 0 1 1 13-13 13.015 13.015 0 0 1-13 13'/%3e%3cpath d='M18.146 11.646a.5.5 0 0 0 0 .707l3.147 3.147H9.5a.5.5 0 0 0 0 1h11.793l-3.146 3.146a.5.5 0 1 0 .707.707L23.207 16l-4.354-4.354a.5.5 0 0 0-.707 0'/%3e%3c/svg%3e";
 
 /**
- * Provides an object of breakpoints for responsive designs.
- *
- * This object contains keys representing breakpoint names (e.g., `xxl`, `xl`)
- * and values representing the pixel widths for those breakpoints. The values are parsed
- * from strings (e.g., "1400px") into numbers for easier usage in responsive logic.
- *
- * Kept in src for internal use
+ * Do not edit directly
+ * Generated file
  */
-var ArcBreakpoints = {
-    xxl: parseInt(ArcSizeBreakpointsXxl, 10),
-    xl: parseInt(ArcSizeBreakpointsXl, 10),
-    l: parseInt(ArcSizeBreakpointsL, 10),
-    m: parseInt(ArcSizeBreakpointsM, 10),
-    s: parseInt(ArcSizeBreakpointsS, 10),
-    xs: parseInt(ArcSizeBreakpointsXs, 10),
-};
+
+const BtIconArrowRightFill =
+  "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3e%3cpath fill='currentColor' d='M2 16A14 14 0 1 0 16 2 14 14 0 0 0 2 16m16.854-4.354L23.207 16l-4.354 4.354a.5.5 0 0 1-.707-.707l3.147-3.147H9.5a.5.5 0 0 1 0-1h11.793l-3.146-3.146a.5.5 0 0 1 .707-.707'/%3e%3c/svg%3e";
 
 /** Use `InformationCard` for flexibility and the ability to focus and highlight product specific content. */
 var InformationCard = function (_a) {
-    var cardUrl = _a.cardUrl, onClick = _a.onClick, heading = _a.heading, text = _a.text, label = _a.label, footerLogo = _a.footerLogo, button = _a.button, image = _a.image, badges = _a.badges, icon = _a.icon, minHeight = _a.minHeight, minHeights = _a.minHeights, _b = _a.headingLevel, headingLevel = _b === void 0 ? "2" : _b, props = __rest(_a, ["cardUrl", "onClick", "heading", "text", "label", "footerLogo", "button", "image", "badges", "icon", "minHeight", "minHeights", "headingLevel"]);
+    var cardUrl = _a.cardUrl, onClick = _a.onClick, heading = _a.heading, text = _a.text, label = _a.label, footerLogo = _a.footerLogo, button = _a.button, image = _a.image, badges = _a.badges, icon = _a.icon, minHeight = _a.minHeight, minHeights = _a.minHeights, _b = _a.headingLevel, headingLevel = _b === void 0 ? "2" : _b, _c = _a.labelLevel, labelLevel = _c === void 0 ? "3" : _c, props = __rest(_a, ["cardUrl", "onClick", "heading", "text", "label", "footerLogo", "button", "image", "badges", "icon", "minHeight", "minHeights", "headingLevel", "labelLevel"]);
     var surface = useContext(Context$3).surface;
-    var _c = useState(false), showHoverState = _c[0], setShowHoverState = _c[1];
+    var _d = useState(false), showHoverState = _d[0], setShowHoverState = _d[1];
     var handleShowHoverState = function (show) { return function () { return setShowHoverState(show); }; };
-    var _d = useState(undefined), minimumHeight = _d[0], setMinimumHeight = _d[1];
+    var _e = useState(undefined), minimumHeight = _e[0], setMinimumHeight = _e[1];
     var checkMinHeight = debounce(function () {
         for (var _i = 0, _a = Object.entries(ArcBreakpoints); _i < _a.length; _i++) {
             var _b = _a[_i], key = _b[0], value = _b[1];
@@ -16935,7 +16883,7 @@ var InformationCard = function (_a) {
                 React__default.createElement("div", { className: "arc-InformationCard-contentContainer" },
                     label && (React__default.createElement(React__default.Fragment, null,
                         React__default.createElement("div", { className: "arc-InformationCard-label" },
-                            React__default.createElement(Heading, { level: "3", fontStyle: "overline" }, label)))),
+                            React__default.createElement(Heading, { level: labelLevel, fontStyle: "overline" }, label)))),
                     React__default.createElement(CardHeading, { heading: heading, headingLevel: headingLevel, href: cardUrl, onClick: onClick, onMouseEnter: handleShowHoverState(true), onMouseLeave: handleShowHoverState(false), onFocus: handleShowHoverState(true), onBlur: handleShowHoverState(false) }),
                     text && React__default.createElement(Text, null, text)),
                 (button || badges || footerLogo) && (React__default.createElement("div", { className: "arc-InformationCard-footer" },
@@ -16947,7 +16895,7 @@ var InformationCard = function (_a) {
                         })))),
                     React__default.createElement("div", { className: "arc-InformationCard-footerItems" },
                         button && !cardUrl && (React__default.createElement("div", { className: "arc-InformationCard-footerButtonContainer" },
-                            React__default.createElement(ButtonV2, __assign({}, button, { size: "m", iconPosition: "beforeText", buttonStyle: "compact", icon: BtIconArrowRight })))),
+                            React__default.createElement(ButtonV2, __assign({}, button, { size: "m", iconPosition: "beforeText", buttonStyle: "compact", icon: BtIconArrowRight, iconActive: BtIconArrowRightFill })))),
                         footerLogo && (React__default.createElement("div", { className: "arc-InformationCard-footerLogoContainer" },
                             React__default.createElement(Image, __assign({}, footerLogo)))))))))));
 };
@@ -16977,10 +16925,10 @@ var VideoPlayer$1 = React__default.lazy(function () {
  * Use `MediaCard` to contain content and an image about a single subject.
  */
 var MediaCard = function (_a) {
-    var media = _a.media, url = _a.url, onClick = _a.onClick, heading = _a.heading, label = _a.label, text = _a.text, metaText = _a.metaText, minHeight = _a.minHeight, _b = _a.buttonIcon, buttonIcon = _b === void 0 ? "arrow" : _b, _c = _a.isContained, isContained = _c === void 0 ? true : _c, _d = _a.headingLevel, headingLevel = _d === void 0 ? "2" : _d, props = __rest(_a, ["media", "url", "onClick", "heading", "label", "text", "metaText", "minHeight", "buttonIcon", "isContained", "headingLevel"]);
+    var media = _a.media, url = _a.url, onClick = _a.onClick, heading = _a.heading, label = _a.label, _b = _a.labelLevel, labelLevel = _b === void 0 ? "3" : _b, text = _a.text, metaText = _a.metaText, minHeight = _a.minHeight, _c = _a.buttonIcon, buttonIcon = _c === void 0 ? "arrow" : _c, _d = _a.isContained, isContained = _d === void 0 ? true : _d, _e = _a.headingLevel, headingLevel = _e === void 0 ? "2" : _e, props = __rest(_a, ["media", "url", "onClick", "heading", "label", "labelLevel", "text", "metaText", "minHeight", "buttonIcon", "isContained", "headingLevel"]);
     var surface = useContext(Context$3).surface;
-    var _e = useState(false), isClient = _e[0], setIsClient = _e[1];
-    var _f = useState(false), showHoverState = _f[0], setShowHoverState = _f[1];
+    var _f = useState(false), isClient = _f[0], setIsClient = _f[1];
+    var _g = useState(false), showHoverState = _g[0], setShowHoverState = _g[1];
     var handleShowHoverState = function (show) { return function () { return setShowHoverState(show); }; };
     useEffect(function () {
         setIsClient(true);
@@ -16997,7 +16945,7 @@ var MediaCard = function (_a) {
                 React__default.createElement(VideoPlayer$1, __assign({ isSupportingTextHidden: true }, media)))),
             React__default.createElement("div", { className: "arc-MediaCard-content" },
                 label && (React__default.createElement("div", { className: "arc-MediaCard-label" },
-                    React__default.createElement(Heading, { level: "3", fontStyle: "overline" }, label),
+                    React__default.createElement(Heading, { level: labelLevel, fontStyle: "overline" }, label),
                     React__default.createElement(VerticalSpace, { size: "16" }))),
                 React__default.createElement(CardHeading, { heading: heading, headingLevel: headingLevel, href: media.type !== "video" ? url : undefined, onClick: media.type !== "video" ? onClick : undefined, onMouseEnter: handleShowHoverState(true), onMouseLeave: handleShowHoverState(false), onFocus: handleShowHoverState(true), onBlur: handleShowHoverState(false) }),
                 React__default.createElement("div", { className: "arc-MediaCard-textContainer" }, text && (React__default.createElement(React__default.Fragment, null,
@@ -17235,7 +17183,7 @@ var [createMenuContext, createMenuScope] = createContextScope$1(MENU_NAME, [
 ]);
 var usePopperScope$1 = createPopperScope$1();
 var useRovingFocusGroupScope = createRovingFocusGroupScope();
-var [MenuProvider, useMenuContext] = createMenuContext(MENU_NAME);
+var [MenuProvider$1, useMenuContext$1] = createMenuContext(MENU_NAME);
 var [MenuRootProvider, useMenuRootContext] = createMenuContext(MENU_NAME);
 var Menu$1 = (props) => {
   const { __scopeMenu, open = false, children, dir, onOpenChange, modal = true } = props;
@@ -17259,7 +17207,7 @@ var Menu$1 = (props) => {
     };
   }, []);
   return /* @__PURE__ */ jsx(Root2$4, { ...popperScope, children: /* @__PURE__ */ jsx(
-    MenuProvider,
+    MenuProvider$1,
     {
       scope: __scopeMenu,
       open,
@@ -17296,7 +17244,7 @@ var [PortalProvider$1, usePortalContext$1] = createMenuContext(PORTAL_NAME$3, {
 });
 var MenuPortal$1 = (props) => {
   const { __scopeMenu, forceMount, children, container } = props;
-  const context = useMenuContext(PORTAL_NAME$3, __scopeMenu);
+  const context = useMenuContext$1(PORTAL_NAME$3, __scopeMenu);
   return /* @__PURE__ */ jsx(PortalProvider$1, { scope: __scopeMenu, forceMount, children: /* @__PURE__ */ jsx(Presence$1, { present: forceMount || context.open, children: /* @__PURE__ */ jsx(Portal$6, { asChild: true, container, children }) }) });
 };
 MenuPortal$1.displayName = PORTAL_NAME$3;
@@ -17306,14 +17254,14 @@ var MenuContent$1 = React.forwardRef(
   (props, forwardedRef) => {
     const portalContext = usePortalContext$1(CONTENT_NAME$3, props.__scopeMenu);
     const { forceMount = portalContext.forceMount, ...contentProps } = props;
-    const context = useMenuContext(CONTENT_NAME$3, props.__scopeMenu);
+    const context = useMenuContext$1(CONTENT_NAME$3, props.__scopeMenu);
     const rootContext = useMenuRootContext(CONTENT_NAME$3, props.__scopeMenu);
     return /* @__PURE__ */ jsx(Collection.Provider, { scope: props.__scopeMenu, children: /* @__PURE__ */ jsx(Presence$1, { present: forceMount || context.open, children: /* @__PURE__ */ jsx(Collection.Slot, { scope: props.__scopeMenu, children: rootContext.modal ? /* @__PURE__ */ jsx(MenuRootContentModal, { ...contentProps, ref: forwardedRef }) : /* @__PURE__ */ jsx(MenuRootContentNonModal, { ...contentProps, ref: forwardedRef }) }) }) });
   }
 );
 var MenuRootContentModal = React.forwardRef(
   (props, forwardedRef) => {
-    const context = useMenuContext(CONTENT_NAME$3, props.__scopeMenu);
+    const context = useMenuContext$1(CONTENT_NAME$3, props.__scopeMenu);
     const ref = React.useRef(null);
     const composedRefs = useComposedRefs$1(forwardedRef, ref);
     React.useEffect(() => {
@@ -17339,7 +17287,7 @@ var MenuRootContentModal = React.forwardRef(
   }
 );
 var MenuRootContentNonModal = React.forwardRef((props, forwardedRef) => {
-  const context = useMenuContext(CONTENT_NAME$3, props.__scopeMenu);
+  const context = useMenuContext$1(CONTENT_NAME$3, props.__scopeMenu);
   return /* @__PURE__ */ jsx(
     MenuContentImpl,
     {
@@ -17370,7 +17318,7 @@ var MenuContentImpl = React.forwardRef(
       disableOutsideScroll,
       ...contentProps
     } = props;
-    const context = useMenuContext(CONTENT_NAME$3, __scopeMenu);
+    const context = useMenuContext$1(CONTENT_NAME$3, __scopeMenu);
     const rootContext = useMenuRootContext(CONTENT_NAME$3, __scopeMenu);
     const popperScope = usePopperScope$1(__scopeMenu);
     const rovingFocusGroupScope = useRovingFocusGroupScope(__scopeMenu);
@@ -17772,7 +17720,7 @@ var SUB_NAME = "MenuSub";
 var [MenuSubProvider, useMenuSubContext] = createMenuContext(SUB_NAME);
 var MenuSub = (props) => {
   const { __scopeMenu, children, open = false, onOpenChange } = props;
-  const parentMenuContext = useMenuContext(SUB_NAME, __scopeMenu);
+  const parentMenuContext = useMenuContext$1(SUB_NAME, __scopeMenu);
   const popperScope = usePopperScope$1(__scopeMenu);
   const [trigger, setTrigger] = React.useState(null);
   const [content, setContent] = React.useState(null);
@@ -17782,7 +17730,7 @@ var MenuSub = (props) => {
     return () => handleOpenChange(false);
   }, [parentMenuContext.open, handleOpenChange]);
   return /* @__PURE__ */ jsx(Root2$4, { ...popperScope, children: /* @__PURE__ */ jsx(
-    MenuProvider,
+    MenuProvider$1,
     {
       scope: __scopeMenu,
       open,
@@ -17807,7 +17755,7 @@ MenuSub.displayName = SUB_NAME;
 var SUB_TRIGGER_NAME$1 = "MenuSubTrigger";
 var MenuSubTrigger = React.forwardRef(
   (props, forwardedRef) => {
-    const context = useMenuContext(SUB_TRIGGER_NAME$1, props.__scopeMenu);
+    const context = useMenuContext$1(SUB_TRIGGER_NAME$1, props.__scopeMenu);
     const rootContext = useMenuRootContext(SUB_TRIGGER_NAME$1, props.__scopeMenu);
     const subContext = useMenuSubContext(SUB_TRIGGER_NAME$1, props.__scopeMenu);
     const contentContext = useMenuContentContext(SUB_TRIGGER_NAME$1, props.__scopeMenu);
@@ -17910,7 +17858,7 @@ var MenuSubContent = React.forwardRef(
   (props, forwardedRef) => {
     const portalContext = usePortalContext$1(CONTENT_NAME$3, props.__scopeMenu);
     const { forceMount = portalContext.forceMount, ...subContentProps } = props;
-    const context = useMenuContext(CONTENT_NAME$3, props.__scopeMenu);
+    const context = useMenuContext$1(CONTENT_NAME$3, props.__scopeMenu);
     const rootContext = useMenuRootContext(CONTENT_NAME$3, props.__scopeMenu);
     const subContext = useMenuSubContext(SUB_CONTENT_NAME$1, props.__scopeMenu);
     const ref = React.useRef(null);
@@ -18275,12 +18223,74 @@ var Sub2 = DropdownMenuSub;
 var SubTrigger2 = DropdownMenuSubTrigger;
 var SubContent2 = DropdownMenuSubContent;
 
+var MenuContext = createContext(null);
+var useMenuContext = function () {
+    var ctx = useContext(MenuContext);
+    if (!ctx) {
+        throw new Error("useMenuContext must be used within a <MenuProvider>");
+    }
+    return ctx;
+};
+
+var MenuProvider = function (_a) {
+    var isMobileMenu = _a.isMobileMenu, defaultWidth = _a.defaultWidth, children = _a.children;
+    var _b = useState([]), stack = _b[0], setStack = _b[1];
+    var focusFirstMenuItem = function () {
+        requestAnimationFrame(function () {
+            var wrappers = document.querySelectorAll("[data-radix-popper-content-wrapper]");
+            var latestWrapper = wrappers[wrappers.length - 1];
+            if (!latestWrapper)
+                return;
+            var firstItem = latestWrapper.querySelector('[role="menuitem"]');
+            firstItem === null || firstItem === void 0 ? void 0 : firstItem.focus();
+        });
+    };
+    var goForward = function (item, navigatedViaKeyboard) {
+        setStack(function (prevStack) { return __spreadArray(__spreadArray([], prevStack, true), [item], false); });
+        if (navigatedViaKeyboard) {
+            focusFirstMenuItem();
+        }
+    };
+    var goBack = function (navigatedViaKeyboard) {
+        setStack(function (prevStack) {
+            var newStack = prevStack.slice(0, -1);
+            if (navigatedViaKeyboard) {
+                var last_1 = prevStack[prevStack.length - 1];
+                requestAnimationFrame(function () {
+                    var trigger = (last_1 === null || last_1 === void 0 ? void 0 : last_1.triggerId)
+                        ? document.querySelector("[data-menu-trigger=\"".concat(last_1.triggerId, "\"]"))
+                        : null;
+                    if (trigger) {
+                        trigger.focus();
+                    }
+                    else {
+                        focusFirstMenuItem();
+                    }
+                });
+            }
+            return newStack;
+        });
+    };
+    var reset = function () {
+        setStack([]);
+    };
+    return (React__default.createElement(MenuContext.Provider, { value: {
+            isMobileMenu: isMobileMenu,
+            stack: stack,
+            goForward: goForward,
+            goBack: goBack,
+            reset: reset,
+            defaultWidth: defaultWidth,
+        } }, children));
+};
+
 /**
  * Contains all the parts of a dropdown menu.
  */
 var Menu = function (_a) {
-    var defaultOpen = _a.defaultOpen, open = _a.open, onOpenChange = _a.onOpenChange, _b = _a.modal, modal = _b === void 0 ? false : _b, children = _a.children, props = __rest(_a, ["defaultOpen", "open", "onOpenChange", "modal", "children"]);
-    return (React__default.createElement(Root2$1, __assign({ defaultOpen: defaultOpen, open: open, onOpenChange: onOpenChange, modal: modal }, filterAttrs(props)), children));
+    var defaultOpen = _a.defaultOpen, open = _a.open, onOpenChange = _a.onOpenChange, _b = _a.modal, modal = _b === void 0 ? true : _b, _c = _a.isMobileMenu, isMobileMenu = _c === void 0 ? false : _c, children = _a.children, defaultWidth = _a.defaultWidth, props = __rest(_a, ["defaultOpen", "open", "onOpenChange", "modal", "isMobileMenu", "children", "defaultWidth"]);
+    return (React__default.createElement(Root2$1, __assign({ defaultOpen: defaultOpen, open: open, onOpenChange: onOpenChange, modal: modal }, filterAttrs(props)),
+        React__default.createElement(MenuProvider, { isMobileMenu: isMobileMenu, defaultWidth: defaultWidth }, children)));
 };
 
 var MenuItemContentTemplate = function (_a) {
@@ -18307,19 +18317,114 @@ var MenuItemCheckbox = function (_a) {
             }
             onSelect === null || onSelect === void 0 ? void 0 : onSelect(event);
         }, id: id }, filterAttrs(props)),
-        React__default.createElement("div", { className: classNames("arc-MenuItemCheckbox-box", {
-                "arc-MenuItemCheckbox-box--checked": checked,
-            }) }, checked && (React__default.createElement("svg", { style: { width: 14, height: 11 }, viewBox: "0 0 18 14", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
-            React__default.createElement("path", { d: "M5.99459 14L0.350576 8.23277C0.126079 8.00285 0 7.69132 0 7.36653C0 7.04173 0.126079 6.7302 0.350576 6.50028C0.578979 6.27752 0.88258 6.15324 1.19832 6.15324C1.51405 6.15324 1.81765 6.27752 2.04606 6.50028L5.99459 10.535L15.9385 0.374054C16.0491 0.25703 16.1814 0.163688 16.3277 0.0994738C16.474 0.0352599 16.6313 0.00145997 16.7905 4.626e-05C16.9497 -0.00136745 17.1076 0.0296342 17.255 0.0912406C17.4023 0.152847 17.5362 0.243825 17.6488 0.358867C17.7614 0.473908 17.8504 0.610709 17.9107 0.761287C17.971 0.911865 18.0013 1.0732 18 1.23589C17.9986 1.39858 17.9655 1.55936 17.9026 1.70884C17.8398 1.85833 17.7485 1.99352 17.6339 2.10655L5.99459 14Z", fill: "currentColor" })))),
+        React__default.createElement(CheckboxIcon, { size: "s", id: id, error: false, isDisabled: isDisabled, onChange: function () { return onCheckedChange; }, checked: checked, indeterminate: false }),
         React__default.createElement(MenuItemContentTemplate, null, children)));
 };
 
+/**
+ * Do not edit directly
+ * Generated file
+ */
+
+const BtIconChevronLeftMid =
+  "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 16 16'%3e%3cpath fill='currentColor' fill-rule='evenodd' d='m7.621 8 2.849 2.852a.673.673 0 0 1-.732 1.097.7.7 0 0 1-.218-.145L6.196 8.476a.673.673 0 0 1 0-.951L9.52 4.197a.67.67 0 0 1 1.146.476c0 .178-.07.349-.196.475z' clip-rule='evenodd'/%3e%3c/svg%3e";
+
+/**
+ * Do not edit directly
+ * Generated file
+ */
+
+const BtIconChevronRightMid =
+  "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 16 16'%3e%3cpath fill='currentColor' fill-rule='evenodd' d='M9.045 8 6.197 5.148a.673.673 0 0 1 .731-1.097.7.7 0 0 1 .218.146l3.324 3.328a.673.673 0 0 1 0 .95l-3.324 3.329A.67.67 0 0 1 6 11.328c0-.178.07-.35.197-.476z' clip-rule='evenodd'/%3e%3c/svg%3e";
+
+/**
+ * Do not edit directly
+ * Generated file
+ */
+
+const BtIconCrossAlt2Px =
+  "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3e%3cpath fill='currentColor' d='m17.414 16 3.793-3.793a1 1 0 0 0-1.414-1.414L16 14.586l-3.793-3.793a1 1 0 0 0-1.414 1.414L14.586 16l-3.793 3.793a1 1 0 1 0 1.414 1.414L16 17.414l3.793 3.793a1 1 0 0 0 1.414-1.414Z'/%3e%3c/svg%3e";
+
+/**
+ * Do not edit directly
+ * Generated file
+ */
+
+const BtIconCrossAlt2PxFill =
+  "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3e%3cpath fill='currentColor' d='M16 2a14 14 0 1 0 14 14A14 14 0 0 0 16 2m5.207 17.793a1 1 0 1 1-1.414 1.414L16 17.414l-3.793 3.793a1 1 0 0 1-1.414-1.414L14.586 16l-3.793-3.793a1 1 0 0 1 1.414-1.414L16 14.586l3.793-3.793a1 1 0 0 1 1.414 1.414L17.414 16Z'/%3e%3c/svg%3e";
+
+/**
+ * Do not edit directly
+ * Generated file
+ */
+
+const BtIconFirstMid =
+  "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 16 16'%3e%3cpath fill='currentColor' fill-rule='evenodd' d='M4.675 4.005c.373 0 .675.303.675.675v6.64a.675.675 0 1 1-1.35 0V4.68c0-.372.302-.675.675-.675M7.973 8l2.848 2.852a.673.673 0 0 1-.731 1.097.7.7 0 0 1-.218-.145L6.548 8.476a.673.673 0 0 1 0-.951l3.324-3.328a.671.671 0 1 1 .95.951z' clip-rule='evenodd'/%3e%3c/svg%3e";
+
+/**
+ * Do not edit directly
+ * Generated file
+ */
+
+const BtIconLastMid =
+  "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 16 16'%3e%3cpath fill='currentColor' fill-rule='evenodd' d='M10.34 11.995a.675.675 0 0 1-.674-.675V4.68a.675.675 0 1 1 1.35 0v6.64a.675.675 0 0 1-.675.675M7.043 8 4.194 5.148a.673.673 0 0 1 .732-1.097.7.7 0 0 1 .218.146l3.324 3.328a.673.673 0 0 1 0 .95l-3.324 3.329a.671.671 0 1 1-.95-.952z' clip-rule='evenodd'/%3e%3c/svg%3e";
+
+/**
+ * Do not edit directly
+ * Generated file
+ */
+
+const BtIconTickAlt2Px =
+  "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3e%3cpath fill='currentColor' d='m13.5 21.914-4.707-4.707a1 1 0 0 1 0-1.414 1.024 1.024 0 0 1 1.414 0l3.293 3.293 8.293-8.293a1 1 0 1 1 1.414 1.414Z'/%3e%3c/svg%3e";
+
+/**
+ * Renders a menu item, optionally as a link if `href` is provided.
+ */
+var MenuItem = function (_a) {
+    var leadingIcon = _a.leadingIcon, supportingText = _a.supportingText, keyCommands = _a.keyCommands, trailingIcon = _a.trailingIcon, children = _a.children, onClick = _a.onClick, _b = _a.shouldKeepOpen, shouldKeepOpen = _b === void 0 ? true : _b, isDisabled = _a.isDisabled, href = _a.href, ariaLabel = _a.ariaLabel, props = __rest(_a, ["leadingIcon", "supportingText", "keyCommands", "trailingIcon", "children", "onClick", "shouldKeepOpen", "isDisabled", "href", "ariaLabel"]);
+    var Component = href ? "a" : "div";
+    return (React__default.createElement(Item2, __assign({ className: "arc-MenuItem", asChild: true, "aria-label": ariaLabel, onClick: isDisabled ? undefined : onClick, onSelect: function (event) {
+            if (shouldKeepOpen) {
+                event.preventDefault();
+            }
+        }, disabled: isDisabled }, filterAttrs(props)),
+        React__default.createElement(Component, __assign({ className: href && "arc-MenuItem--link", href: href }, props),
+            React__default.createElement(MenuItemContentTemplate, { leadingIcon: leadingIcon, trailingIcon: trailingIcon, supportingText: supportingText, keyCommands: keyCommands }, children))));
+};
+
+/**
+ * Visual separator used to divide groups of menu items.
+ */
+var MenuSeparator = function (props) {
+    return (React__default.createElement(Separator2, __assign({ className: "arc-MenuSeparator" }, filterAttrs(props)),
+        React__default.createElement(Rule, null)));
+};
+
 /**
  * The component that pops out when the dropdown menu is open.
  */
 var MenuContent = React__default.forwardRef(function (_a, ref) {
-    var children = _a.children, width = _a.width, minWidth = _a.minWidth, maxWidth = _a.maxWidth, _b = _a.align, align = _b === void 0 ? "start" : _b, alignOffset = _a.alignOffset, side = _a.side, props = __rest(_a, ["children", "width", "minWidth", "maxWidth", "align", "alignOffset", "side"]);
-    return (React__default.createElement(Content2$1, __assign({ ref: ref, style: { width: width, minWidth: minWidth, maxWidth: maxWidth }, className: "arc-MenuContent", sideOffset: 12, loop: true, collisionPadding: 12, forceMount: true, align: align, alignOffset: alignOffset, side: side }, filterAttrs(props)), children));
+    var children = _a.children, width = _a.width, minWidth = _a.minWidth, maxWidth = _a.maxWidth, _b = _a.align, align = _b === void 0 ? "start" : _b, alignOffset = _a.alignOffset, side = _a.side, initalTitle = _a.initalTitle, isFluidToViewport = _a.isFluidToViewport, props = __rest(_a, ["children", "width", "minWidth", "maxWidth", "align", "alignOffset", "side", "initalTitle", "isFluidToViewport"]);
+    var _c = useMenuContext(), isMobileMenu = _c.isMobileMenu, stack = _c.stack, goBack = _c.goBack, defaultWidth = _c.defaultWidth, reset = _c.reset;
+    if (!isMobileMenu) {
+        return (React__default.createElement(Content2$1, __assign({ ref: ref, style: { width: width !== null && width !== void 0 ? width : defaultWidth, minWidth: minWidth, maxWidth: maxWidth }, className: "arc-MenuContent", sideOffset: 12, loop: true, collisionPadding: 0, forceMount: true, align: align, alignOffset: alignOffset, side: side }, filterAttrs(props)),
+            React__default.createElement("div", { className: "arc-MenuContent-content" }, children)));
+    }
+    var active = stack.length > 0 ? stack[stack.length - 1].content : children;
+    var prevTitle = stack.length > 1 ? stack[stack.length - 2].title : initalTitle || "Back";
+    return (React__default.createElement(Content2$1, __assign({ style: { width: width !== null && width !== void 0 ? width : defaultWidth, minWidth: minWidth, maxWidth: maxWidth }, sideOffset: 12, collisionPadding: 12, className: classNames("arc-MenuContent arc-MenuContent--mobile", {
+            "arc-MenuContent--isFluid": isFluidToViewport || defaultWidth === "fluid",
+        }), side: "bottom", avoidCollisions: true, onKeyDown: function (e) {
+            if (stack.length > 0) {
+                if (e.key === "ArrowLeft") {
+                    goBack(true);
+                }
+            }
+        }, forceMount: true, onPointerDownOutside: reset, onEscapeKeyDown: reset }, filterAttrs(props)),
+        stack.length > 0 && (React__default.createElement(React__default.Fragment, null,
+            React__default.createElement(MenuItem, { onClick: goBack, leadingIcon: BtIconChevronLeftMid }, prevTitle),
+            React__default.createElement(MenuSeparator, null))),
+        React__default.createElement("div", { key: stack.length, className: "arc-MenuContent-content arc-MenuContent-fade" }, active)));
 });
 
 /**
@@ -18344,33 +18449,18 @@ var MenuGroup = function (_a) {
     return (React__default.createElement(Group2, __assign({ className: "arc-MenuGroup" }, filterAttrs(props)), children));
 };
 
-/**
- * Displays a header within the dropdown menu.
- */
-var MenuHeader = function (_a) {
-    var leadingIcon = _a.leadingIcon, trailingIcon = _a.trailingIcon, supportingText = _a.supportingText, keyCommands = _a.keyCommands, children = _a.children, onClick = _a.onClick, isDisabled = _a.isDisabled, ariaLabel = _a.ariaLabel;
-    return (React__default.createElement("div", { className: "arc-MenuHeader" },
-        React__default.createElement(Item2, { className: "arc-MenuItem ", style: { marginBottom: 0 }, "aria-label": ariaLabel, onClick: onClick, disabled: isDisabled },
-            React__default.createElement(MenuItemContentTemplate, { leadingIcon: leadingIcon, trailingIcon: trailingIcon, supportingText: supportingText, keyCommands: keyCommands }, children)),
-        React__default.createElement("div", { className: "arc-MenuSeparator", style: {
-                paddingBottom: 0,
-            } },
-            React__default.createElement(Rule, null))));
-};
-
-/**
- * Renders a menu item, optionally as a link if `href` is provided.
- */
-var MenuItem = function (_a) {
-    var leadingIcon = _a.leadingIcon, supportingText = _a.supportingText, keyCommands = _a.keyCommands, trailingIcon = _a.trailingIcon, children = _a.children, onClick = _a.onClick, _b = _a.shouldKeepOpen, shouldKeepOpen = _b === void 0 ? true : _b, isDisabled = _a.isDisabled, href = _a.href, ariaLabel = _a.ariaLabel, props = __rest(_a, ["leadingIcon", "supportingText", "keyCommands", "trailingIcon", "children", "onClick", "shouldKeepOpen", "isDisabled", "href", "ariaLabel"]);
-    var Component = href ? "a" : "div";
-    return (React__default.createElement(Item2, __assign({ className: "arc-MenuItem", asChild: true, "aria-label": ariaLabel, onClick: isDisabled ? undefined : onClick, onSelect: function (event) {
-            if (shouldKeepOpen) {
-                event.preventDefault();
-            }
-        }, disabled: isDisabled }, filterAttrs(props)),
-        React__default.createElement(Component, __assign({ className: href && "arc-MenuItem--link", href: href }, props),
-            React__default.createElement(MenuItemContentTemplate, { leadingIcon: leadingIcon, trailingIcon: trailingIcon, supportingText: supportingText, keyCommands: keyCommands }, children))));
+/**
+ * Displays a header within the dropdown menu.
+ */
+var MenuHeader = function (_a) {
+    var leadingIcon = _a.leadingIcon, trailingIcon = _a.trailingIcon, supportingText = _a.supportingText, keyCommands = _a.keyCommands, children = _a.children, onClick = _a.onClick, isDisabled = _a.isDisabled, ariaLabel = _a.ariaLabel;
+    return (React__default.createElement("div", { className: "arc-MenuHeader" },
+        React__default.createElement(Item2, { className: "arc-MenuItem", style: { marginBottom: 0 }, "aria-label": ariaLabel, onClick: onClick, disabled: isDisabled },
+            React__default.createElement(MenuItemContentTemplate, { leadingIcon: leadingIcon, trailingIcon: trailingIcon, supportingText: supportingText, keyCommands: keyCommands }, children)),
+        React__default.createElement("div", { className: "arc-MenuSeparator", style: {
+                paddingBottom: 0,
+            } },
+            React__default.createElement(Rule, null))));
 };
 
 /**
@@ -18400,62 +18490,6 @@ var MenuGroupSingleSelect = function (_a) {
     return (React__default.createElement(RadioGroup2, __assign({ className: "arc-MenuGroupSingleSelect", value: value, onValueChange: onValueChange }, filterAttrs(props)), children));
 };
 
-/**
- * Do not edit directly
- * Generated file
- */
-
-const BtIconArrowAltUp =
-  "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3e%3cpath fill='currentColor' d='M20.354 13.146 16 8.793l-4.354 4.354a.5.5 0 0 0 .707.707l3.147-3.147V22.5a.5.5 0 0 0 1 0V10.707l3.146 3.146a.5.5 0 0 0 .707-.707'/%3e%3c/svg%3e";
-
-/**
- * Do not edit directly
- * Generated file
- */
-
-const BtIconCross =
-  "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3e%3cpath d='M16 2a14 14 0 1 0 14 14A14 14 0 0 0 16 2m0 27a13 13 0 1 1 13-13 13.015 13.015 0 0 1-13 13'/%3e%3cpath d='M20.854 11.146a.5.5 0 0 0-.707 0L16 15.293l-4.146-4.146a.5.5 0 0 0-.707.707L15.293 16l-4.146 4.146a.5.5 0 1 0 .707.707L16 16.707l4.146 4.146a.5.5 0 0 0 .707-.707L16.707 16l4.146-4.146a.5.5 0 0 0 0-.708'/%3e%3c/svg%3e";
-
-/**
- * Do not edit directly
- * Generated file
- */
-
-const BtIconCrossFill =
-  "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3e%3cpath fill='currentColor' d='M16 2a14 14 0 1 0 14 14A14 14 0 0 0 16 2m4.854 18.146a.5.5 0 1 1-.707.707L16 16.707l-4.146 4.146a.5.5 0 0 1-.707-.707L15.293 16l-4.146-4.146a.5.5 0 0 1 .707-.707L16 15.293l4.146-4.146a.5.5 0 0 1 .707.707L16.707 16Z'/%3e%3c/svg%3e";
-
-/**
- * Do not edit directly
- * Generated file
- */
-
-const BtIconFirstMid =
-  "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 16 16'%3e%3cpath fill='currentColor' fill-rule='evenodd' d='M4.675 4.005c.373 0 .675.303.675.675v6.64a.675.675 0 1 1-1.35 0V4.68c0-.372.302-.675.675-.675M7.973 8l2.848 2.852a.673.673 0 0 1-.731 1.097.7.7 0 0 1-.218-.145L6.548 8.476a.673.673 0 0 1 0-.951l3.324-3.328a.671.671 0 1 1 .95.951z' clip-rule='evenodd'/%3e%3c/svg%3e";
-
-/**
- * Do not edit directly
- * Generated file
- */
-
-const BtIconLastMid =
-  "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 16 16'%3e%3cpath fill='currentColor' fill-rule='evenodd' d='M10.34 11.995a.675.675 0 0 1-.674-.675V4.68a.675.675 0 1 1 1.35 0v6.64a.675.675 0 0 1-.675.675M7.043 8 4.194 5.148a.673.673 0 0 1 .732-1.097.7.7 0 0 1 .218.146l3.324 3.328a.673.673 0 0 1 0 .95l-3.324 3.329a.671.671 0 1 1-.95-.952z' clip-rule='evenodd'/%3e%3c/svg%3e";
-
-/**
- * Do not edit directly
- * Generated file
- */
-
-const BtIconPlayFill =
-  "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3e%3cpath d='M13.161 11.762a.1.1 0 0 0-.107 0 .1.1 0 0 0-.054.092v8.288a.1.1 0 0 0 .054.093.1.1 0 0 0 .107 0l7.178-4.144a.1.1 0 0 0 .054-.092.1.1 0 0 0-.054-.094Z'/%3e%3cpath d='M16 2a14 14 0 1 0 14 14A14 14 0 0 0 16 2m4.839 14.957-7.178 4.145a1.108 1.108 0 0 1-1.661-.96v-8.288a1.107 1.107 0 0 1 1.661-.958l7.178 4.144a1.107 1.107 0 0 1 0 1.917'/%3e%3c/svg%3e";
-
-/**
- * Do not edit directly
- * Generated file
- */
-
-const BtIconTickAlt2Px =
-  "data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3e%3cpath fill='currentColor' d='m13.5 21.914-4.707-4.707a1 1 0 0 1 0-1.414 1.024 1.024 0 0 1 1.414 0l3.293 3.293 8.293-8.293a1 1 0 1 1 1.414 1.414Z'/%3e%3c/svg%3e";
-
 /**
  * A selectable menu item used within a radio group.
  */
@@ -18478,7 +18512,7 @@ var MenuScrollable = function (_a) {
     var scrollableRefFunc = function (el) {
         var totalSiblingHeight = 0;
         // get the closest Menu.Content element this will always exist within the menu component
-        var contentContainer = el === null || el === void 0 ? void 0 : el.closest(".arc-MenuContent");
+        var contentContainer = el === null || el === void 0 ? void 0 : el.closest(".arc-MenuContent-content");
         if (!contentContainer || !el)
             return;
         // loop over all children in Menu.Content children to get height of each non scrollable element (excluding the scroll element itself)
@@ -18494,22 +18528,30 @@ var MenuScrollable = function (_a) {
     return (React__default.createElement("div", { ref: scrollableRefFunc, className: "arc-MenuScrollable" }, children));
 };
 
-/**
- * Visual separator used to divide groups of menu items.
- */
-var MenuSeparator = function (props) {
-    return (React__default.createElement(Separator2, __assign({ className: "arc-MenuSeparator" }, filterAttrs(props)),
-        React__default.createElement(Rule, null)));
-};
-
 /**
  * Container for multi-level menu content within a dropdown menu.
  */
 var MenuItemMultiLevel = function (_a) {
+    var _b;
     var children = _a.children, props = __rest(_a, ["children"]);
-    return React__default.createElement(Sub2, __assign({}, filterAttrs(props)),
-        " ",
-        children);
+    var isMobileMenu = useMenuContext().isMobileMenu;
+    if (!isMobileMenu) {
+        return React__default.createElement(Sub2, __assign({}, filterAttrs(props)), children);
+    }
+    var arr = React__default.Children.toArray(children);
+    // assuming that there will be two children in menu item multi level
+    var trigger = arr[0];
+    var portal = arr[1];
+    var pairedContent;
+    if (portal && ((_b = portal.props) === null || _b === void 0 ? void 0 : _b.children)) {
+        var portalChild = React__default.Children.toArray(portal.props.children);
+        pairedContent = portalChild.find(function (el) { var _a; return ((_a = el === null || el === void 0 ? void 0 : el.type) === null || _a === void 0 ? void 0 : _a.displayName) === "MenuItemMultiLevelContent"; });
+    }
+    if (!trigger || !pairedContent) {
+        console.warn("MenuItemMultiLevel requires both a Trigger and Portal");
+    }
+    // Inject content into the trigger,  skip rendering the portal in mobile
+    return React__default.cloneElement(trigger, { pairedContent: pairedContent });
 };
 
 /**
@@ -18517,14 +18559,41 @@ var MenuItemMultiLevel = function (_a) {
  */
 var MenuItemMultiLevelContent = React__default.forwardRef(function (_a, ref) {
     var children = _a.children, width = _a.width, minWidth = _a.minWidth, maxWidth = _a.maxWidth, alignOffset = _a.alignOffset, props = __rest(_a, ["children", "width", "minWidth", "maxWidth", "alignOffset"]);
-    return (React__default.createElement(SubContent2, __assign({ ref: ref, style: { width: width, minWidth: minWidth, maxWidth: maxWidth }, className: "arc-MenuContent", sideOffset: 24, collisionPadding: 12, avoidCollisions: true, alignOffset: alignOffset }, filterAttrs(props)), children));
+    var _b = useMenuContext(), isMobileMenu = _b.isMobileMenu, defaultWidth = _b.defaultWidth;
+    if (isMobileMenu) {
+        return React__default.createElement(React__default.Fragment, null, children);
+    }
+    return (React__default.createElement(SubContent2, __assign({ ref: ref, style: { width: width !== null && width !== void 0 ? width : defaultWidth, minWidth: minWidth, maxWidth: maxWidth }, className: "arc-MenuContent", sideOffset: 24, collisionPadding: 12, avoidCollisions: true, alignOffset: alignOffset }, filterAttrs(props)), children));
 });
+MenuItemMultiLevelContent.displayName = "MenuItemMultiLevelContent";
 
 /**
  * Trigger element that opens a multi-level menu when selected.
  */
 var MenuItemMultiLevelTrigger = function (_a) {
-    var children = _a.children, isDisabled = _a.isDisabled, leadingIcon = _a.leadingIcon, supportingText = _a.supportingText, keyCommands = _a.keyCommands, ariaLabel = _a.ariaLabel, props = __rest(_a, ["children", "isDisabled", "leadingIcon", "supportingText", "keyCommands", "ariaLabel"]);
+    var children = _a.children, isDisabled = _a.isDisabled, leadingIcon = _a.leadingIcon, supportingText = _a.supportingText, keyCommands = _a.keyCommands, ariaLabel = _a.ariaLabel, pairedContent = _a.pairedContent, props = __rest(_a, ["children", "isDisabled", "leadingIcon", "supportingText", "keyCommands", "ariaLabel", "pairedContent"]);
+    var _b = useMenuContext(), isMobileMenu = _b.isMobileMenu, goForward = _b.goForward;
+    var moveFoward = function (e, navigatedViaKeyboard) {
+        e.preventDefault();
+        if (pairedContent) {
+            goForward({
+                title: String(children),
+                content: pairedContent,
+                triggerId: String(children),
+            }, navigatedViaKeyboard);
+        }
+    };
+    if (isMobileMenu) {
+        return (React__default.createElement(Item2, __assign({ disabled: isDisabled, "aria-label": ariaLabel, onKeyDown: function (e) {
+                if (e.key === "ArrowRight") {
+                    moveFoward(e, true);
+                }
+            }, onClick: function (e) {
+                moveFoward(e, false);
+            }, className: "arc-MenuItem", "data-menu-trigger": children }, filterAttrs(props)),
+            React__default.createElement(MenuItemContentTemplate, { leadingIcon: leadingIcon, trailingIcon: BtIconChevronRightMid, supportingText: supportingText, keyCommands: keyCommands }, "".concat(children))));
+    }
+    // desktop fallback
     return (React__default.createElement(SubTrigger2, __assign({ className: "arc-MenuItem arc-MenuItem--trigger", disabled: isDisabled, "aria-label": ariaLabel }, filterAttrs(props)),
         React__default.createElement("div", { className: "arc-MenuItem-content" },
             leadingIcon && (React__default.createElement("div", { className: "arc-MenuItem-leadingIcon" },
@@ -18543,7 +18612,10 @@ var MenuItemMultiLevelTrigger = function (_a) {
  */
 var MenuTrigger = function (_a) {
     var children = _a.children, asChild = _a.asChild, props = __rest(_a, ["children", "asChild"]);
-    return (React__default.createElement(Trigger$1, __assign({ className: "arc-MenuTrigger", asChild: asChild }, filterAttrs(props)), children));
+    var surface = useContext(Context$3).surface;
+    return (React__default.createElement(Trigger$1, __assign({ className: classNames("arc-MenuTrigger", {
+            "arc-MenuTrigger--onDarkSurface": surface === "dark",
+        }), asChild: asChild }, filterAttrs(props)), children));
 };
 
 /** Use `Modal` to display information that needs immediate action from a user. */
@@ -18581,6 +18653,9 @@ var Modal = function (_a) {
                             _b["arc-Modal-dialog--maxHeightWindow"] = isContentScrollable,
                             _b["arc-Modal-dialog--fullBleed"] = fullBleed,
                             _b)) }, filterAttrs(props)),
+                        canShowClose && (React__default.createElement("div", { className: "arc-Modal-iconContainer" },
+                            React__default.createElement("button", { "aria-label": "close", onClick: closeModal, className: "arc-Modal-closeButton" },
+                                React__default.createElement(ThemeIcon, { size: 32, icon: "modalClose" })))),
                         React__default.createElement(React__default.Fragment, null,
                             title && (React__default.createElement(React__default.Fragment, null,
                                 React__default.createElement("div", { className: "arc-Modal-section" },
@@ -18607,10 +18682,7 @@ var Modal = function (_a) {
                                             "arc-Modal-actionButton--compact": props.buttonStyle === "compact",
                                         }) },
                                         React__default.createElement(ButtonV2, __assign({ isFullWidth: true }, props)))); })))),
-                            React__default.createElement(VerticalSpace, { size: "24" }))),
-                        canShowClose && (React__default.createElement("div", { className: "arc-Modal-iconContainer" },
-                            React__default.createElement("button", { "aria-label": "close", onClick: closeModal, className: "arc-Modal-closeButton" },
-                                React__default.createElement(ThemeIcon, { size: 32, icon: "modalClose" }))))))))));
+                            React__default.createElement(VerticalSpace, { size: "24" })))))))));
 };
 
 /**
@@ -18630,7 +18702,7 @@ var Pagination = function (_a) {
                 "arc-Pagination-navigationButton--hidden": selectedPage === 1,
             }), onClick: handlePagechange(selectedPage - 1) },
             React__default.createElement("div", { className: "arc-Pagination-navigationButtonIcon arc-Pagination-navigationButtonIcon--left" },
-                React__default.createElement(ThemeIcon, { size: 32, icon: "paginationPrevious" }))),
+                React__default.createElement(ThemeIcon, { icon: "paginationPrevious" }))),
         React__default.createElement("div", { className: "arc-Pagination-pageNumberContainer" }, pageRange.map(function (rangeValue, i) {
             return isPageNumber(rangeValue) ? (React__default.createElement("button", { "aria-current": parseInt(rangeValue) === selectedPage, key: "pagination-range-value-".concat(rangeValue), "aria-label": "Go to page ".concat(rangeValue), className: classNames("arc-Pagination-value arc-Pagination-value--number", {
                     "arc-Pagination-value--selected": parseInt(rangeValue) === selectedPage,
@@ -18640,7 +18712,7 @@ var Pagination = function (_a) {
                 "arc-Pagination-navigationButton--hidden": selectedPage === pageCount,
             }), onClick: handlePagechange(selectedPage + 1) },
             React__default.createElement("div", { className: "arc-Pagination-navigationButtonIcon arc-Pagination-navigationButtonIcon--right" },
-                React__default.createElement(ThemeIcon, { size: 32, icon: "paginationNext" })))));
+                React__default.createElement(ThemeIcon, { icon: "paginationNext" })))));
 };
 
 /**
@@ -18689,8 +18761,8 @@ var PaginationSimple = function (_a) {
 
 /** Use `Popover` to display content in a portal, triggered by a button. */
 var Popover = function (_a) {
-    var align = _a.align, ariaLabel = _a.ariaLabel, alignOffset = _a.alignOffset, _b = _a.arrow, arrow = _b === void 0 ? true : _b, _c = _a.background, background = _c === void 0 ? "light" : _c, children = _a.children, content = _a.content, _d = _a.asChild, asChild = _d === void 0 ? false : _d, _e = _a.maxWidth, maxWidth = _e === void 0 ? 452 : _e, onCloseAutoFocus = _a.onCloseAutoFocus, onEscapeKeyDown = _a.onEscapeKeyDown, onFocusOutside = _a.onFocusOutside, onInteractOutside = _a.onInteractOutside, onOpenAutoFocus = _a.onOpenAutoFocus, onPointerDownOutside = _a.onPointerDownOutside, onOpenChange = _a.onOpenChange, open = _a.open, side = _a.side, _f = _a.sideOffset, sideOffset = _f === void 0 ? 0 : _f, _g = _a.zIndex, zIndex = _g === void 0 ? 100 : _g, _h = _a.hideWhenDetached, hideWhenDetached = _h === void 0 ? false : _h, _j = _a.useBespokeTrigger, useBespokeTrigger = _j === void 0 ? false : _j, props = __rest(_a, ["align", "ariaLabel", "alignOffset", "arrow", "background", "children", "content", "asChild", "maxWidth", "onCloseAutoFocus", "onEscapeKeyDown", "onFocusOutside", "onInteractOutside", "onOpenAutoFocus", "onPointerDownOutside", "onOpenChange", "open", "side", "sideOffset", "zIndex", "hideWhenDetached", "useBespokeTrigger"]);
-    var _k = useThemeElement(), themeElement = _k[0], setThemeElement = _k[1];
+    var align = _a.align, ariaLabel = _a.ariaLabel, alignOffset = _a.alignOffset, _b = _a.arrow, arrow = _b === void 0 ? true : _b, _c = _a.background, background = _c === void 0 ? "light" : _c, children = _a.children, content = _a.content, _d = _a.asChild, asChild = _d === void 0 ? false : _d, _e = _a.maxWidth, maxWidth = _e === void 0 ? 452 : _e, minHeight = _a.minHeight, onCloseAutoFocus = _a.onCloseAutoFocus, onEscapeKeyDown = _a.onEscapeKeyDown, onFocusOutside = _a.onFocusOutside, onInteractOutside = _a.onInteractOutside, onOpenAutoFocus = _a.onOpenAutoFocus, onPointerDownOutside = _a.onPointerDownOutside, onOpenChange = _a.onOpenChange, open = _a.open, _f = _a.constrainToViewport, constrainToViewport = _f === void 0 ? true : _f, side = _a.side, _g = _a.sideOffset, sideOffset = _g === void 0 ? 0 : _g, _h = _a.zIndex, zIndex = _h === void 0 ? 100 : _h, _j = _a.hideWhenDetached, hideWhenDetached = _j === void 0 ? false : _j, _k = _a.useBespokeTrigger, useBespokeTrigger = _k === void 0 ? false : _k, props = __rest(_a, ["align", "ariaLabel", "alignOffset", "arrow", "background", "children", "content", "asChild", "maxWidth", "minHeight", "onCloseAutoFocus", "onEscapeKeyDown", "onFocusOutside", "onInteractOutside", "onOpenAutoFocus", "onPointerDownOutside", "onOpenChange", "open", "constrainToViewport", "side", "sideOffset", "zIndex", "hideWhenDetached", "useBespokeTrigger"]);
+    var _l = useThemeElement(), themeElement = _l[0], setThemeElement = _l[1];
     var alignOffsetDefault = align === "center" ? 0 : -16;
     return (React__default.createElement("div", __assign({ className: "arc-Popover" }, filterAttrs(props)),
         React__default.createElement(Root2$3, { open: open, onOpenChange: onOpenChange },
@@ -18703,7 +18775,8 @@ var Popover = function (_a) {
                                 React__default.createElement("div", { className: classNames("arc-Popover-content", {
                                         "arc-Popover-content--dark": background === "dark",
                                         "arc-Popover-content--brand": background === "brand",
-                                    }), style: { maxWidth: maxWidth }, "aria-labelledby": "popover-content" },
+                                        "arc-Popover-content--constrainToViewport": constrainToViewport,
+                                    }), style: { maxWidth: maxWidth, minHeight: minHeight }, "aria-labelledby": "popover-content" },
                                     content && React__default.createElement("div", { id: "popover-content" }, content),
                                     arrow && (React__default.createElement(PopoverArrow, { className: "arc-Popover-arrow" })))))))))));
 };
@@ -18784,11 +18857,143 @@ var ProgressBar = function (_a) {
                 React__default.createElement(VerticalSpace, { size: "8" }),
                 React__default.createElement("button", { ref: autoFocusRef(action.autofocusOnMount), className: "arc-ProgressBar-actionButton", onClick: action.action },
                     React__default.createElement("div", { className: "arc-ProgressBar-actionContainer" },
-                        React__default.createElement(Text, null, action.text),
                         action.icon && (React__default.createElement("div", { className: "arc-ProgressBar-actionIcon" },
-                            React__default.createElement(ThemeIcon, { icon: PROGRESS_BAR_ICON_MAP[action.icon], size: 24 }))))))))));
+                            React__default.createElement(ThemeIcon, { icon: PROGRESS_BAR_ICON_MAP[action.icon], size: 24 }))),
+                        React__default.createElement(Text, null, action.text))))))));
 };
 
+var shorterCssColorNames;
+var hasRequiredShorterCssColorNames;
+
+function requireShorterCssColorNames () {
+	if (hasRequiredShorterCssColorNames) return shorterCssColorNames;
+	hasRequiredShorterCssColorNames = 1;
+	shorterCssColorNames = {
+	  aqua: /#00ffff(ff)?(?!\w)|#0ff(f)?(?!\w)/gi,
+	  azure: /#f0ffff(ff)?(?!\w)/gi,
+	  beige: /#f5f5dc(ff)?(?!\w)/gi,
+	  bisque: /#ffe4c4(ff)?(?!\w)/gi,
+	  black: /#000000(ff)?(?!\w)|#000(f)?(?!\w)/gi,
+	  blue: /#0000ff(ff)?(?!\w)|#00f(f)?(?!\w)/gi,
+	  brown: /#a52a2a(ff)?(?!\w)/gi,
+	  coral: /#ff7f50(ff)?(?!\w)/gi,
+	  cornsilk: /#fff8dc(ff)?(?!\w)/gi,
+	  crimson: /#dc143c(ff)?(?!\w)/gi,
+	  cyan: /#00ffff(ff)?(?!\w)|#0ff(f)?(?!\w)/gi,
+	  darkblue: /#00008b(ff)?(?!\w)/gi,
+	  darkcyan: /#008b8b(ff)?(?!\w)/gi,
+	  darkgrey: /#a9a9a9(ff)?(?!\w)/gi,
+	  darkred: /#8b0000(ff)?(?!\w)/gi,
+	  deeppink: /#ff1493(ff)?(?!\w)/gi,
+	  dimgrey: /#696969(ff)?(?!\w)/gi,
+	  gold: /#ffd700(ff)?(?!\w)/gi,
+	  green: /#008000(ff)?(?!\w)/gi,
+	  grey: /#808080(ff)?(?!\w)/gi,
+	  honeydew: /#f0fff0(ff)?(?!\w)/gi,
+	  hotpink: /#ff69b4(ff)?(?!\w)/gi,
+	  indigo: /#4b0082(ff)?(?!\w)/gi,
+	  ivory: /#fffff0(ff)?(?!\w)/gi,
+	  khaki: /#f0e68c(ff)?(?!\w)/gi,
+	  lavender: /#e6e6fa(ff)?(?!\w)/gi,
+	  lime: /#00ff00(ff)?(?!\w)|#0f0(f)?(?!\w)/gi,
+	  linen: /#faf0e6(ff)?(?!\w)/gi,
+	  maroon: /#800000(ff)?(?!\w)/gi,
+	  moccasin: /#ffe4b5(ff)?(?!\w)/gi,
+	  navy: /#000080(ff)?(?!\w)/gi,
+	  oldlace: /#fdf5e6(ff)?(?!\w)/gi,
+	  olive: /#808000(ff)?(?!\w)/gi,
+	  orange: /#ffa500(ff)?(?!\w)/gi,
+	  orchid: /#da70d6(ff)?(?!\w)/gi,
+	  peru: /#cd853f(ff)?(?!\w)/gi,
+	  pink: /#ffc0cb(ff)?(?!\w)/gi,
+	  plum: /#dda0dd(ff)?(?!\w)/gi,
+	  purple: /#800080(ff)?(?!\w)/gi,
+	  red: /#ff0000(ff)?(?!\w)|#f00(f)?(?!\w)/gi,
+	  salmon: /#fa8072(ff)?(?!\w)/gi,
+	  seagreen: /#2e8b57(ff)?(?!\w)/gi,
+	  seashell: /#fff5ee(ff)?(?!\w)/gi,
+	  sienna: /#a0522d(ff)?(?!\w)/gi,
+	  silver: /#c0c0c0(ff)?(?!\w)/gi,
+	  skyblue: /#87ceeb(ff)?(?!\w)/gi,
+	  snow: /#fffafa(ff)?(?!\w)/gi,
+	  tan: /#d2b48c(ff)?(?!\w)/gi,
+	  teal: /#008080(ff)?(?!\w)/gi,
+	  thistle: /#d8bfd8(ff)?(?!\w)/gi,
+	  tomato: /#ff6347(ff)?(?!\w)/gi,
+	  violet: /#ee82ee(ff)?(?!\w)/gi,
+	  wheat: /#f5deb3(ff)?(?!\w)/gi,
+	  white: /#ffffff(ff)?(?!\w)|#fff(f)?(?!\w)/gi,
+	};
+	return shorterCssColorNames;
+}
+
+var miniSvgDataUri;
+var hasRequiredMiniSvgDataUri;
+
+function requireMiniSvgDataUri () {
+	if (hasRequiredMiniSvgDataUri) return miniSvgDataUri;
+	hasRequiredMiniSvgDataUri = 1;
+	var shorterNames = requireShorterCssColorNames();
+	var REGEX = {
+	  whitespace: /\s+/g,
+	  urlHexPairs: /%[\dA-F]{2}/g,
+	  quotes: /"/g,
+	};
+
+	function collapseWhitespace(str) {
+	  return str.trim().replace(REGEX.whitespace, ' ');
+	}
+
+	function dataURIPayload(string) {
+	  return encodeURIComponent(string)
+	    .replace(REGEX.urlHexPairs, specialHexEncode);
+	}
+
+	// `#` gets converted to `%23`, so quite a few CSS named colors are shorter than
+	// their equivalent URL-encoded hex codes.
+	function colorCodeToShorterNames(string) {
+	  Object.keys(shorterNames).forEach(function(key) {
+	    if (shorterNames[key].test(string)) {
+	      string = string.replace(shorterNames[key], key);
+	    }
+	  });
+
+	  return string;
+	}
+
+	function specialHexEncode(match) {
+	  switch (match) { // Browsers tolerate these characters, and they're frequent
+	    case '%20': return ' ';
+	    case '%3D': return '=';
+	    case '%3A': return ':';
+	    case '%2F': return '/';
+	    default: return match.toLowerCase(); // compresses better
+	  }
+	}
+
+	function svgToTinyDataUri(svgString) {
+	  if (typeof svgString !== 'string') {
+	    throw new TypeError('Expected a string, but received ' + typeof svgString);
+	  }
+	  // Strip the Byte-Order Mark if the SVG has one
+	  if (svgString.charCodeAt(0) === 0xfeff) { svgString = svgString.slice(1); }
+
+	  var body = colorCodeToShorterNames(collapseWhitespace(svgString))
+	    .replace(REGEX.quotes, "'");
+	  return 'data:image/svg+xml,' + dataURIPayload(body);
+	}
+
+	svgToTinyDataUri.toSrcset = function toSrcset(svgString) {
+	  return svgToTinyDataUri(svgString).replace(/ /g, '%20');
+	};
+
+	miniSvgDataUri = svgToTinyDataUri;
+	return miniSvgDataUri;
+}
+
+var miniSvgDataUriExports = requireMiniSvgDataUri();
+var svgToMiniDataURI = /*@__PURE__*/getDefaultExportFromCjs(miniSvgDataUriExports);
+
 // src/capitalise-first-letter/capitalise-first-letter.ts
 var capitaliseFirstLetter = (word) => {
   return word.charAt(0).toUpperCase() + word.slice(1);
@@ -19081,7 +19286,7 @@ var RadioGroup = function (_a) {
 };
 
 var RadioGroupButton = forwardRef(function (_a, ref) {
-    var id = _a.id, changeEvent = _a.changeEvent, isDisabled = _a.isDisabled, size = _a.size, labelSize = _a.labelSize, checked = _a.checked, defaultChecked = _a.defaultChecked, radioButtonAlignment = _a.radioButtonAlignment, name = _a.name, blurEvent = _a.blurEvent, value = _a.value, label = _a.label, helper = _a.helper, hideLabel = _a.hideLabel, withMargin = _a.withMargin;
+    var id = _a.id, changeEvent = _a.changeEvent, isDisabled = _a.isDisabled, size = _a.size, labelSize = _a.labelSize, checked = _a.checked, defaultChecked = _a.defaultChecked, radioButtonAlignment = _a.radioButtonAlignment, name = _a.name, blurEvent = _a.blurEvent, value = _a.value, label = _a.label, helper = _a.helper, hideLabel = _a.hideLabel, withMargin = _a.withMargin, isError = _a.isError;
     var surface = useContext(Context$3).surface;
     var idLabel = "".concat(id, "-label");
     return (React__default.createElement("div", { className: classNames({
@@ -19092,6 +19297,7 @@ var RadioGroupButton = forwardRef(function (_a, ref) {
             "arc-RadioGroupButton--small": size === "s",
             "arc-RadioGroupButton--smallLabel": labelSize === "s",
             "arc-RadioGroupButton--onDarkSurface": surface === "dark",
+            "arc-RadioGroupButton--invalid": !isDisabled && isError,
         }) },
         React__default.createElement("label", { className: classNames("arc-RadioGroupButton-label", {
                 "arc-RadioGroupButton-label--alignTop": radioButtonAlignment === "top",
@@ -19108,21 +19314,20 @@ var RadioGroupButton = forwardRef(function (_a, ref) {
  * Radio Button component.
  */
 var RadioGroupInput = forwardRef(function (_a, ref) {
-    var helper = _a.helper, id = _a.id, isDisabled = _a.isDisabled, label = _a.label, _b = _a.radioButtonAlignment, radioButtonAlignment = _b === void 0 ? "center" : _b, value = _a.value, props = __rest(_a, ["helper", "id", "isDisabled", "label", "radioButtonAlignment", "value"]);
+    var helper = _a.helper, id = _a.id, isDisabled = _a.isDisabled, label = _a.label, _b = _a.radioButtonAlignment, radioButtonAlignment = _b === void 0 ? "center" : _b, value = _a.value, isError = _a.isError, props = __rest(_a, ["helper", "id", "isDisabled", "label", "radioButtonAlignment", "value", "isError"]);
     var _c = useRadioContext(), blurEvent = _c.blurEvent, changeEvent = _c.changeEvent, groupDisabled = _c.groupDisabled, checkedValue = _c.checkedValue, name = _c.name, size = _c.size;
     var isChecked = checkedValue === value ? true : false;
     var checked = typeof changeEvent !== "function" ? undefined : isChecked;
     var defaultChecked = typeof changeEvent !== "function" ? isChecked : undefined;
-    return (React__default.createElement(RadioGroupButton, __assign({ withMargin: true, ref: ref, id: id, name: name, helper: helper, isDisabled: isDisabled || groupDisabled, size: size, radioButtonAlignment: radioButtonAlignment, label: label, defaultChecked: defaultChecked, checked: checked, changeEvent: changeEvent, blurEvent: blurEvent, value: value }, props)));
+    return (React__default.createElement(RadioGroupButton, __assign({ withMargin: true, ref: ref, id: id, name: name, helper: helper, isDisabled: isDisabled || groupDisabled, size: size, radioButtonAlignment: radioButtonAlignment, label: label, defaultChecked: defaultChecked, checked: checked, changeEvent: changeEvent, blurEvent: blurEvent, value: value, isError: isError }, props)));
 });
 
 /**
  * Use `ScrollToTop` to allow the user to scroll to the top of the page by clicking a button.
  */
 var ScrollToTop = function (_a) {
-    var _b = _a.appear, appear = _b === void 0 ? "always" : _b, _c = _a.isFixed, isFixed = _c === void 0 ? true : _c, _d = _a.fill, fill = _d === void 0 ? "solid" : _d, _e = _a.zIndex, zIndex = _e === void 0 ? 100 : _e, props = __rest(_a, ["appear", "isFixed", "fill", "zIndex"]);
-    var _f = useState(false), hasScrolled = _f[0], setHasScrolled = _f[1];
-    var surface = useContext(Context$3).surface;
+    var _b = _a.appear, appear = _b === void 0 ? "always" : _b, _c = _a.isFixed, isFixed = _c === void 0 ? true : _c, _d = _a.fill, fill = _d === void 0 ? "solid" : _d, _e = _a.zIndex, zIndex = _e === void 0 ? 100 : _e, _f = _a.focusColor, focusColor = _f === void 0 ? "magenta" : _f, props = __rest(_a, ["appear", "isFixed", "fill", "zIndex", "focusColor"]);
+    var _g = useState(false), hasScrolled = _g[0], setHasScrolled = _g[1];
     useEffect(function () {
         var handleScroll = debounce(function () {
             setHasScrolled(window.scrollY > 0);
@@ -19142,22 +19347,23 @@ var ScrollToTop = function (_a) {
     return (React__default.createElement("button", __assign({ onClick: onClick, style: {
             zIndex: zIndex,
         }, className: classNames("arc-ScrollToTop", "arc-ScrollToTop--".concat(fill), {
+            "arc-ScrollToTop--secondary": focusColor == "secondary",
             "arc-ScrollToTop--fixed": isFixed,
-            "arc-ScrollToTop--onDarkSurface": surface === "dark",
             "arc-ScrollToTop--visible": appear === "always" || (appear === "afterScroll" && hasScrolled),
         }) }, filterAttrs(props)),
         React__default.createElement("div", { className: "arc-ScrollToTop-textWrapper" },
             React__default.createElement("span", { className: "arc-ScrollToTop-text" }, "Back to top")),
         React__default.createElement("span", { className: "arc-ScrollToTop-iconContainer" },
-            React__default.createElement(Icon$1, { size: 44, icon: BtIconArrowAltUp }))));
+            React__default.createElement("div", { className: "arc-ScrollToTop-icon" },
+                React__default.createElement(ThemeIcon, { icon: "scrollToTop" })))));
 };
 
 /**
  * Use `Section` to compose content into vertical page layouts.
  */
 var Section = function (_a) {
-    var children = _a.children, _b = _a.isFullWidth, isFullWidth = _b === void 0 ? false : _b, _c = _a.isDebugVisible, isDebugVisible = _c === void 0 ? false : _c, _d = _a.isExtended, isExtended = _d === void 0 ? false : _d, props = __rest(_a, ["children", "isFullWidth", "isDebugVisible", "isExtended"]);
-    return (React__default.createElement("div", __assign({ className: classNames({
+    var children = _a.children, _b = _a.isFullWidth, isFullWidth = _b === void 0 ? false : _b, _c = _a.isDebugVisible, isDebugVisible = _c === void 0 ? false : _c, _d = _a.isExtended, isExtended = _d === void 0 ? false : _d, id = _a.id, props = __rest(_a, ["children", "isFullWidth", "isDebugVisible", "isExtended", "id"]);
+    return (React__default.createElement("div", __assign({ id: id, className: classNames({
             "arc-Section": true,
             "arc-Section--regular": !isExtended,
             "arc-Section--extended": isExtended,
@@ -19169,11 +19375,17 @@ var Section = function (_a) {
 /** Use `Select` to choose from a dropdown list of options. */
 var Select = function (_a) {
     var _b;
-    var isRequired = _a.isRequired, isDisabled = _a.isDisabled, placeholder = _a.placeholder, label = _a.label, value = _a.value, _c = _a.ariaLabel, ariaLabel = _c === void 0 ? label : _c, options = _a.options, onOpenChange = _a.onOpenChange, isDefaultOpen = _a.isDefaultOpen, defaultValue = _a.defaultValue, errorMessage = _a.errorMessage, _d = _a.size, size = _d === void 0 ? "m" : _d, helper = _a.helper, hideLabel = _a.hideLabel, name = _a.name, width = _a.width, isFluid = _a.isFluid, onBlur = _a.onBlur, onFocus = _a.onFocus, onChange = _a.onChange, open = _a.open, disclosureTitle = _a.disclosureTitle, disclosureText = _a.disclosureText, onClickDisclosure = _a.onClickDisclosure, props = __rest(_a, ["isRequired", "isDisabled", "placeholder", "label", "value", "ariaLabel", "options", "onOpenChange", "isDefaultOpen", "defaultValue", "errorMessage", "size", "helper", "hideLabel", "name", "width", "isFluid", "onBlur", "onFocus", "onChange", "open", "disclosureTitle", "disclosureText", "onClickDisclosure"]);
-    var id = useId$1();
+    var isRequired = _a.isRequired, isDisabled = _a.isDisabled, placeholder = _a.placeholder, label = _a.label, value = _a.value, _c = _a.ariaLabel, ariaLabel = _c === void 0 ? label : _c, options = _a.options, onOpenChange = _a.onOpenChange, isDefaultOpen = _a.isDefaultOpen, defaultValue = _a.defaultValue, errorMessage = _a.errorMessage, id = _a.id, _d = _a.size, size = _d === void 0 ? "m" : _d, helper = _a.helper, hideLabel = _a.hideLabel, name = _a.name, width = _a.width, isFluid = _a.isFluid, onBlur = _a.onBlur, onFocus = _a.onFocus, onChange = _a.onChange, open = _a.open, disclosureTitle = _a.disclosureTitle, disclosureText = _a.disclosureText, onClickDisclosure = _a.onClickDisclosure, props = __rest(_a, ["isRequired", "isDisabled", "placeholder", "label", "value", "ariaLabel", "options", "onOpenChange", "isDefaultOpen", "defaultValue", "errorMessage", "id", "size", "helper", "hideLabel", "name", "width", "isFluid", "onBlur", "onFocus", "onChange", "open", "disclosureTitle", "disclosureText", "onClickDisclosure"]);
+    var defaultId = useId$1();
     var _e = useThemeElement(), themeElement = _e[0], setThemeElement = _e[1];
     var surface = useContext(Context$3).surface;
     var _f = useState(defaultValue), uncontrolledValue = _f[0], setUncontrolledValue = _f[1];
+    var ariaDescribedby = useAriaDescribedby({
+        id: id,
+        errorMessage: errorMessage,
+        helper: helper,
+        disclosureText: disclosureText,
+    }).ariaDescribedby;
     var isControlled = typeof value !== "undefined";
     var selectValue = isControlled ? value : uncontrolledValue;
     var onValueChange = function (value) {
@@ -19194,21 +19406,22 @@ var Select = function (_a) {
                 return 20;
         }
     };
-    return (React__default.createElement(FormControl, { errorMessage: errorMessage, helper: helper, htmlFor: id, label: label, hideLabel: hideLabel, labelSize: size, requirementStatus: isRequired ? "required" : "optional", isDisabled: isDisabled, disclosureText: disclosureText, disclosureTitle: disclosureTitle, onClickDisclosure: onClickDisclosure },
+    var componentId = id || defaultId;
+    return (React__default.createElement(FormControl, { errorMessage: errorMessage, helper: helper, htmlFor: componentId, label: label, hideLabel: hideLabel, labelSize: size, requirementStatus: isRequired ? "required" : "optional", isDisabled: isDisabled, disclosureText: disclosureText, disclosureTitle: disclosureTitle, onClickDisclosure: onClickDisclosure },
         React__default.createElement(Root2$2, { name: name, required: isRequired, disabled: isDisabled, defaultOpen: isDefaultOpen, value: selectValue, open: open, onOpenChange: onOpenChange, onValueChange: function (value) { return onValueChange(value); } },
             React__default.createElement("div", { ref: setThemeElement, className: "arc-Select-wrapper" },
-                React__default.createElement(Trigger$2, __assign({ id: id, name: name, onBlur: onBlur, onFocus: onFocus, "aria-label": ariaLabel, style: { width: width, marginTop: hideLabel ? 0 : undefined }, className: classNames("arc-Select-trigger", (_b = {
+                React__default.createElement(Trigger$2, __assign({ id: componentId, name: name, onBlur: onBlur, onFocus: onFocus, "aria-label": ariaLabel, style: { width: width, marginTop: hideLabel ? 0 : undefined }, className: classNames("arc-Select-trigger", (_b = {
                             "arc-Select-trigger--constrained": !isFluid,
                             "arc-Select-trigger--onDarkSurface": surface === "dark",
                             "arc-Select-trigger--invalid": errorMessage
                         },
                         _b["arc-Select-trigger--size".concat(size && size.toUpperCase())] = size && size !== "m",
-                        _b)), "aria-describedby": id + (disclosureText ? "-disclosure" : "-helper") }, filterAttrs(props)),
+                        _b)), "aria-describedby": ariaDescribedby }, filterAttrs(props)),
                     React__default.createElement(Value, { className: "arc-Select-triggerText", placeholder: placeholder, "aria-label": getSelectedValueName(uncontrolledValue) }),
                     React__default.createElement(Icon, { className: "arc-Select-triggerIcon" },
                         React__default.createElement(ThemeIcon, { size: getIconSize(size), icon: "selectTrigger" }))),
                 React__default.createElement(Portal$4, { container: themeElement },
-                    React__default.createElement(Content2$3, { sideOffset: 5, position: "popper", className: classNames("arc-Select-content", {
+                    React__default.createElement(Content2$3, { sideOffset: 12, position: "popper", className: classNames("arc-Select-content", {
                             "arc-Select-content--onDarkSurface": surface === "dark",
                         }) },
                         React__default.createElement(Viewport, { className: "arc-Select-content--scrollable" }, options.map(function (_a, i) {
@@ -19276,7 +19489,7 @@ var SiteFooterV2 = function (_a) {
         React__default.createElement(VerticalSpace, { size: "24" }),
         React__default.createElement(Section, null,
             slogan && (React__default.createElement(React__default.Fragment, null,
-                React__default.createElement("h2", { className: "arc-SiteFooterV2-slogan" }, slogan),
+                React__default.createElement("span", { className: "arc-SiteFooterV2-slogan" }, slogan),
                 React__default.createElement(VerticalSpace, { size: "32" }))),
             React__default.createElement("div", { className: "arc-SiteFooterV2-main-utility" }, children)),
         React__default.createElement(VerticalSpace, { size: "24" })));
@@ -19318,11 +19531,12 @@ var SiteFooterV2Item = function (_a) {
 var SiteFooterV2Utility = function (_a) {
     var copyrightYear = _a.copyrightYear, children = _a.children, socialLinks = _a.socialLinks, _b = _a.brand, brand = _b === void 0 ? {
         logoLabel: "BT",
+        href: "/",
     } : _b, contentSlot = _a.contentSlot, props = __rest(_a, ["copyrightYear", "children", "socialLinks", "brand", "contentSlot"]);
     return (React__default.createElement("div", __assign({ className: "arc-SiteFooterV2-utility", "aria-label": "Footer utility bar" }, filterAttrs(props)),
         React__default.createElement("div", { className: "arc-SiteFooterV2-brand" },
             !contentSlot && (React__default.createElement(React__default.Fragment, null,
-                React__default.createElement("a", { className: "arc-SiteFooterV2-brandLogo", onClick: handleLinkClick({ handler: brand.onClick }) },
+                React__default.createElement("a", { className: "arc-SiteFooterV2-brandLogo", onClick: handleLinkClick({ handler: brand.onClick }), href: brand.href, tabIndex: brand.href ? 0 : -1 },
                     React__default.createElement(BrandLogo, { label: brand.logoLabel, "aria-label": brand.logoLabel, color: "brand", subBrand: brand.subBrand })),
                 React__default.createElement("div", { className: "arc-SiteFooterV2-copyright" },
                     React__default.createElement("span", { className: "arc-SiteFooterV2-copyrightSymbol" }, "\u00A9"),
@@ -19336,8 +19550,8 @@ var SiteFooterV2Utility = function (_a) {
             React__default.createElement("ul", { className: "arc-SiteFooterV2-utilityItems" }, children))),
         socialLinks && (React__default.createElement("ul", { className: "arc-SiteFooterV2-utilitySocials", "aria-label": "Footer social media links" }, socialLinks.map(function (_a, index) {
             var href = _a.href, icon = _a.icon, ariaLabel = _a.ariaLabel;
-            return (React__default.createElement("li", { key: index, tabIndex: 0, className: "arc-SiteFooterV2-utilitySocialsLink", "aria-label": ariaLabel },
-                React__default.createElement("a", { className: "arc-SiteFooterV2-link", href: href, tabIndex: -1 },
+            return (React__default.createElement("li", { key: index, tabIndex: 0, className: "arc-SiteFooterV2-utilitySocialsLink" },
+                React__default.createElement("a", { className: "arc-SiteFooterV2-link", href: href, tabIndex: -1, "aria-label": ariaLabel },
                     React__default.createElement(Icon$1, { icon: icon, size: 16 }),
                     " ")));
         })))));
@@ -19935,8 +20149,8 @@ var SkipLink = function (_a, props) {
 };
 
 var SkipLinkItem = function (_a) {
-    var href = _a.href, id = _a.id, label = _a.label;
-    return (React__default.createElement("a", { className: "arc-SkipLinkItem", href: href, id: id }, label));
+    var href = _a.href, id = _a.id, label = _a.label, onClick = _a.onClick;
+    return (React__default.createElement("a", { className: "arc-SkipLinkItem", href: href, id: id, onClick: onClick }, label));
 };
 
 function $010c2913dbd2fe3d$export$5cae361ad82dce8b(value) {
@@ -20146,14 +20360,14 @@ var Switch = function (_a) {
                     React__default.createElement($6be4966fd9bbc698$export$6521433ed15a34db, { className: "arc-Switch-thumb" },
                         React__default.createElement("div", { className: "arc-Switch-thumbIcon" },
                             React__default.createElement("div", { className: "arc-Switch-icon", "data-testid": "arc-switch-thumb-icon" },
-                                React__default.createElement(ThemeIcon, { icon: "switchToggle", color: "brand", size: size === "m" ? 32 : 24 }))))),
-                React__default.createElement("div", { className: classNames("arc-Switch-statusText", (_b = {
+                                React__default.createElement(ThemeIcon, { icon: "switchToggle", size: size === "m" ? 32 : 24 }))))),
+                (onStatusText || offStatusText) && (React__default.createElement("div", { className: classNames("arc-Switch-statusText", (_b = {
                             "arc-Switch-statusText--isDisabled": isDisabled,
                             "arc-Switch-statusText--onDarkSurface": surface === "dark"
                         },
                         _b["arc-Switch-statusText--".concat(size)] = size === "m",
                         _b)) },
-                    React__default.createElement("p", { "aria-hidden": true }, switchState ? onStatusText : offStatusText))))));
+                    React__default.createElement("p", { "aria-hidden": true }, switchState ? onStatusText : offStatusText)))))));
 };
 
 var TabbedBanner = function (_a) {
@@ -20170,7 +20384,7 @@ var TabbedBanner = function (_a) {
                 })),
                 tabs.map(function (_a, index) {
                     var value = _a.value, content = _a.content;
-                    return (React__default.createElement(ContentSwitcherContent, { value: value, key: index, hidden: value !== selectedTab },
+                    return (React__default.createElement(ContentSwitcherContent, { value: value, key: "".concat(index, "-").concat(value), hidden: value !== selectedTab },
                         React__default.createElement(TemplateBanner, __assign({ alignment: "start", headingSize: "m", additionalTopMargin: true, minHeight: minHeight, minHeightM: minHeightM, minHeightL: minHeightL, minHeightXL: minHeightXL }, content))));
                 }))),
         React__default.createElement("div", { className: "arc-TabbedBanner--mobile" },
@@ -20203,7 +20417,7 @@ var TabsItem = function (_a) {
 
 var TabsContent = function (_a) {
     var children = _a.children, value = _a.value, _b = _a.hidden, hidden = _b === void 0 ? undefined : _b, _c = _a.forceMount, forceMount = _c === void 0 ? true : _c, props = __rest(_a, ["children", "value", "hidden", "forceMount"]);
-    return (React__default.createElement($69cb30bb0017df05$export$7c6e2c02157bb7d2, __assign({ className: "arc-Tabs-content", value: value, forceMount: forceMount ? true : undefined, hidden: hidden }, filterAttrs(props)), children));
+    return (React__default.createElement($69cb30bb0017df05$export$7c6e2c02157bb7d2, __assign({ className: "arc-TabsContent", value: value, forceMount: forceMount ? true : undefined, hidden: hidden }, filterAttrs(props)), children));
 };
 
 var TabsList = function (_a) {
@@ -20260,6 +20474,7 @@ var TabsList = function (_a) {
 var Tag = function (_a) {
     var children = _a.children, isRemovable = _a.isRemovable, link = _a.link, icon = _a.icon, onClick = _a.onClick, onRemove = _a.onRemove, title = _a.title, props = __rest(_a, ["children", "isRemovable", "link", "icon", "onClick", "onRemove", "title"]);
     var _b = useState(false), isRemoved = _b[0], setIsRemoved = _b[1];
+    var surface = useContext(Context$3).surface;
     var onRemoveHandler = function () {
         setIsRemoved(function (p) { return !p; });
         onRemove && onRemove();
@@ -20269,20 +20484,21 @@ var Tag = function (_a) {
             "arc-Tag--hasIcon": icon,
             "arc-Tag--hasLink": link || onClick,
             "arc-Tag--removed": isRemoved,
+            "arc-Tag--onDarkSurface": surface === "dark",
         }) }, (isRemoved && { "aria-hidden": true }), filterAttrs(props)),
         link ? (React__default.createElement("a", { className: "arc-Tag-content", href: link, tabIndex: 0 },
             icon && (React__default.createElement("span", { className: "arc-Tag-icon" },
-                React__default.createElement(Icon$1, { "data-testid": "arc-Tag-icon", icon: icon, size: 16 }))),
+                React__default.createElement(Icon$1, { "data-testid": "arc-Tag-icon", icon: icon }))),
             React__default.createElement("div", { className: "arc-Tag-label", title: title }, children))) : (React__default.createElement(React__default.Fragment, null, onClick ? (React__default.createElement("button", { className: "arc-Tag-content", onClick: onClick, "data-testid": "arc-Tag-content" },
             icon && (React__default.createElement("span", { className: "arc-Tag-icon" },
-                React__default.createElement(Icon$1, { "data-testid": "arc-Tag-icon", icon: icon, size: 16 }))),
+                React__default.createElement(Icon$1, { "data-testid": "arc-Tag-icon", icon: icon }))),
             React__default.createElement("div", { className: "arc-Tag-label", title: title }, children))) : (React__default.createElement("div", { className: "arc-Tag-content", "data-testid": "arc-Tag-content" },
             icon && (React__default.createElement("span", { className: "arc-Tag-icon" },
-                React__default.createElement(Icon$1, { "data-testid": "arc-Tag-icon", icon: icon, size: 16 }))),
+                React__default.createElement(Icon$1, { "data-testid": "arc-Tag-icon", icon: icon }))),
             React__default.createElement("div", { className: "arc-Tag-label", title: title }, children))))),
         isRemovable && (React__default.createElement("button", { className: "arc-Tag-icon arc-Tag-icon--removable", onClick: onRemoveHandler, "data-testid": "arc-Tag-icon-removable", "aria-live": "polite", "aria-roledescription": "remove tag", "aria-label": "Remove tag" },
-            React__default.createElement(Icon$1, { icon: BtIconCross }),
-            React__default.createElement(Icon$1, { icon: BtIconCrossFill })))));
+            React__default.createElement(Icon$1, { icon: BtIconCrossAlt2Px }),
+            React__default.createElement(Icon$1, { icon: BtIconCrossAlt2PxFill })))));
 };
 
 /** Use `TextArea` to allow custom user text entry via keyboard, for long-form and multi-line descriptions */
@@ -20312,8 +20528,8 @@ var TextArea = forwardRef(function (_a, ref) {
     };
     // Although this is used within FormControlWrapper, it's deterministic so we can call it here too
     var ariaDescribedby = useAriaDescribedby({
-        errorMessage: errorMessage,
         id: id,
+        errorMessage: errorMessage,
         helper: helper,
         disclosureText: disclosureText,
     }).ariaDescribedby;
@@ -20342,7 +20558,7 @@ var TextArea = forwardRef(function (_a, ref) {
 var package_default = {
   name: "@arc-ui/helpers",
   private: true,
-  version: "12.0.0-beta.22",
+  version: "12.0.0-beta.24",
   type: "module",
   homepage: "https://ui.digital-ent-int.bt.com",
   author: "BT Enterprise Digital UI Team <ui-digital-ent-int@bt.com>",
@@ -21370,10 +21586,12 @@ const $054eb8030ebde76e$export$f39c2d165cd861fe = $054eb8030ebde76e$export$811e7
 
 /** Use `Toast` to display temporary messages at the bottom of the screen. */
 var Toast = function (_a) {
-    var children = _a.children, _b = _a.colorScheme, colorScheme = _b === void 0 ? "default" : _b, props = __rest(_a, ["children", "colorScheme"]);
+    var children = _a.children, _b = _a.colorScheme, colorScheme = _b === void 0 ? "default" : _b, _c = _a.onDarkSurface, onDarkSurface = _c === void 0 ? false : _c, props = __rest(_a, ["children", "colorScheme", "onDarkSurface"]);
     return (React__default.createElement($054eb8030ebde76e$export$2881499e37b75b9a, { swipeDirection: "right", duration: 6000 },
         React__default.createElement($054eb8030ebde76e$export$d5c6c08dc2d3ca7, { asChild: true, className: "arc-Toast-viewport" },
-            React__default.createElement("div", __assign({ className: "arc-Toast-pathway--".concat(colorScheme) }, filterAttrs(props)), children))));
+            React__default.createElement("div", __assign({ className: classNames("arc-Toast-pathway--".concat(colorScheme), {
+                    "arc-Toast--onDarkSurface": onDarkSurface,
+                }) }, filterAttrs(props)), children))));
 };
 
 var ToastNotification = function (_a) {
@@ -22716,12 +22934,12 @@ var Arrow2 = TooltipArrow;
 
 /** Use `Tooltip` to display information related to an element when the element receives keyboard focus or the mouse hovers over it */
 var Tooltip = function (_a) {
-    var children = _a.children, side = _a.side, sideOffset = _a.sideOffset, align = _a.align, alignContent = _a.alignContent, title = _a.title, supportingCopy = _a.supportingCopy, icon = _a.icon, _b = _a.maxWidth, maxWidth = _b === void 0 ? "450px" : _b, _c = _a.delayDuration, delayDuration = _c === void 0 ? 300 : _c, open = _a.open, onOpenChange = _a.onOpenChange, _d = _a.asChild, asChild = _d === void 0 ? false : _d, _e = _a.zIndex, zIndex = _e === void 0 ? 100 : _e, props = __rest(_a, ["children", "side", "sideOffset", "align", "alignContent", "title", "supportingCopy", "icon", "maxWidth", "delayDuration", "open", "onOpenChange", "asChild", "zIndex"]);
+    var children = _a.children, side = _a.side, sideOffset = _a.sideOffset, align = _a.align, alignContent = _a.alignContent, title = _a.title, supportingCopy = _a.supportingCopy, icon = _a.icon, ariaLabel = _a.ariaLabel, _b = _a.maxWidth, maxWidth = _b === void 0 ? "450px" : _b, _c = _a.delayDuration, delayDuration = _c === void 0 ? 300 : _c, open = _a.open, onOpenChange = _a.onOpenChange, _d = _a.asChild, asChild = _d === void 0 ? false : _d, _e = _a.zIndex, zIndex = _e === void 0 ? 100 : _e, props = __rest(_a, ["children", "side", "sideOffset", "align", "alignContent", "title", "supportingCopy", "icon", "ariaLabel", "maxWidth", "delayDuration", "open", "onOpenChange", "asChild", "zIndex"]);
     var _f = useThemeElement(), themeElement = _f[0], setThemeElement = _f[1];
     return (React__default.createElement("div", __assign({}, filterAttrs(props)),
         React__default.createElement(TooltipProvider, null,
             React__default.createElement(Root3, __assign({ delayDuration: delayDuration, open: open, onOpenChange: onOpenChange }, filterAttrs(props)),
-                React__default.createElement(Trigger, { asChild: asChild, className: "arc-Tooltip-trigger" }, children),
+                React__default.createElement(Trigger, { asChild: asChild, "aria-label": ariaLabel, className: "arc-Tooltip-trigger" }, children),
                 React__default.createElement("div", { ref: setThemeElement },
                     React__default.createElement(Portal, { container: themeElement },
                         React__default.createElement(Content2, __assign({ side: side, sideOffset: sideOffset, align: align, alignOffset: align === "start" ? -4 : align === "end" ? -4 : undefined, style: { zIndex: zIndex } }, props),
@@ -22752,9 +22970,9 @@ var Truncate = function (_a) {
 
 /** Use `TypographyCard` for content that benefits from larger and energetic typography. */
 var TypographyCard = function (_a) {
-    var url = _a.url, onClick = _a.onClick, heading = _a.heading, metaText = _a.metaText, label = _a.label, minHeight = _a.minHeight, _b = _a.headingSize, headingSize = _b === void 0 ? "m" : _b, _c = _a.linkData, linkData = _c === void 0 ? {} : _c, _d = _a.pathway, pathway = _d === void 0 ? "light" : _d, _e = _a.buttonIcon, buttonIcon = _e === void 0 ? "arrow" : _e, _f = _a.headingLevel, headingLevel = _f === void 0 ? "2" : _f, props = __rest(_a, ["url", "onClick", "heading", "metaText", "label", "minHeight", "headingSize", "linkData", "pathway", "buttonIcon", "headingLevel"]);
+    var url = _a.url, onClick = _a.onClick, heading = _a.heading, metaText = _a.metaText, label = _a.label, minHeight = _a.minHeight, _b = _a.headingSize, headingSize = _b === void 0 ? "m" : _b, _c = _a.linkData, linkData = _c === void 0 ? {} : _c, _d = _a.pathway, pathway = _d === void 0 ? "light" : _d, _e = _a.buttonIcon, buttonIcon = _e === void 0 ? "arrow" : _e, _f = _a.headingLevel, headingLevel = _f === void 0 ? "2" : _f, _g = _a.labelLevel, labelLevel = _g === void 0 ? "3" : _g, props = __rest(_a, ["url", "onClick", "heading", "metaText", "label", "minHeight", "headingSize", "linkData", "pathway", "buttonIcon", "headingLevel", "labelLevel"]);
     var surface = useContext(Context$3).surface;
-    var _g = useState(false), showHoverState = _g[0], setShowHoverState = _g[1];
+    var _h = useState(false), showHoverState = _h[0], setShowHoverState = _h[1];
     var handleShowHoverState = function (show) { return function () { return setShowHoverState(show); }; };
     var isDarkPathway = pathway === "dark";
     return (React__default.createElement("div", __assign({ style: { minHeight: minHeight }, className: classNames("arc-TypographyCard", {
@@ -22765,7 +22983,7 @@ var TypographyCard = function (_a) {
         }) }, filterAttrs(props)),
         React__default.createElement("div", { className: "arc-TypographyCard-contentContainer" },
             label && (React__default.createElement("div", { className: "arc-TypographyCard-label" },
-                React__default.createElement(Heading, { level: "3", fontStyle: "overline" }, label),
+                React__default.createElement(Heading, { level: labelLevel, fontStyle: "overline" }, label),
                 React__default.createElement(VerticalSpace, { size: "16" }))),
             React__default.createElement(CardHeading, { size: headingSize, linkData: linkData, heading: heading, headingLevel: headingLevel, href: url, onClick: onClick, onMouseEnter: handleShowHoverState(true), onMouseLeave: handleShowHoverState(false), onFocus: handleShowHoverState(true), onBlur: handleShowHoverState(false) })),
         React__default.createElement(CardFooter, { showButton: true, isDarkPathway: isDarkPathway, buttonIcon: buttonIcon, metaText: metaText, isHovered: showHoverState })));
@@ -25924,6 +26142,11 @@ var VideoPlayer = function (_a) {
     var title = _a.title, description = _a.description, transcriptLink = _a.transcriptLink, transcriptContent = _a.transcriptContent, light = _a.light, url = _a.url, onReady = _a.onReady, onPlay = _a.onPlay, onStart = _a.onStart, onPause = _a.onPause, onError = _a.onError, onEnded = _a.onEnded, _b = _a.isBorderRadius, isBorderRadius = _b === void 0 ? false : _b, _c = _a.isSupportingTextHidden, isSupportingTextHidden = _c === void 0 ? false : _c, props = __rest(_a, ["title", "description", "transcriptLink", "transcriptContent", "light", "url", "onReady", "onPlay", "onStart", "onPause", "onError", "onEnded", "isBorderRadius", "isSupportingTextHidden"]);
     var TextWrapper = isSupportingTextHidden ? VisuallyHidden$2 : "div";
     var isVimeo = new URL(url).hostname.includes("vimeo");
+    var _d = useState(false), isClient = _d[0], setIsClient = _d[1];
+    // https://nextjs.org/docs/messages/react-hydration-error#solution-1-using-useeffect-to-run-on-the-client-only
+    useEffect(function () {
+        setIsClient(true);
+    }, []);
     var playerProps = {
         url: url,
         light: light,
@@ -25933,8 +26156,9 @@ var VideoPlayer = function (_a) {
         onPause: onPause,
         onError: onError,
         onEnded: onEnded,
-        playIcon: (React__default.createElement("div", { className: "arc-VideoPlayer-icon" },
-            React__default.createElement(Icon$1, { icon: BtIconPlayFill }))),
+        playIcon: (React__default.createElement("div", { className: "arc-VideoPlayer-iconContainer" },
+            React__default.createElement("div", { className: "arc-VideoPlayer-icon" },
+                React__default.createElement(ThemeIcon, { icon: "videoPlayerPlay" })))),
         playing: Boolean(light),
         controls: true,
         className: "arc-VideoPlayer",
@@ -25944,7 +26168,9 @@ var VideoPlayer = function (_a) {
     return (React__default.createElement("div", __assign({}, filterAttrs(props)),
         React__default.createElement("div", { "data-testid": "arc-video-player", className: classNames("arc-VideoPlayer-wrapper", {
                 "arc-VideoPlayer-wrapper--borderRadius": isBorderRadius,
-            }) }, isVimeo ? (React__default.createElement(ReactPlayerVimeo, __assign({}, playerProps))) : (React__default.createElement(ReactPlayerYoutube, __assign({}, playerProps)))),
+            }) }, isVimeo
+            ? isClient && React__default.createElement(ReactPlayerVimeo, __assign({}, playerProps))
+            : isClient && React__default.createElement(ReactPlayerYoutube, __assign({}, playerProps))),
         React__default.createElement(TextWrapper, null,
             React__default.createElement(VerticalSpace, { size: "24" }),
             React__default.createElement(Heading, { level: "3", size: "s" }, title),
@@ -25983,44 +26209,24 @@ var BtLogo = function () { return (React__default.createElement("svg", { xmlns:
 var EeLogo = function () { return (React__default.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 64 64", fill: "none" },
     React__default.createElement("path", { d: "M43.8847 31.9955C47.6776 28.6511 50.0791 23.7328 50.0791 18.2512C50.088 8.17326 41.9883 0 32.001 0C22.0138 0 13.9141 8.17326 13.9141 18.2512C13.9141 23.7328 16.3156 28.6511 20.1085 31.9955C16.3156 35.3399 13.9141 40.2582 13.9141 45.7488C13.9141 55.8267 22.0138 64 32.001 64C41.9883 64 50.088 55.8267 50.088 45.7488C50.088 40.2582 47.6864 35.3399 43.8847 31.9955ZM29.5463 40.8126C29.5463 41.3223 29.2893 41.7695 28.8994 42.0377C29.2893 42.306 29.5463 42.7531 29.5463 43.2628C29.5463 43.7725 29.2893 44.2196 28.8994 44.4879C29.0766 44.6042 29.2184 44.7651 29.3336 44.9529C29.5906 44.5416 30.0426 44.2733 30.5654 44.2733C31.0883 44.2733 31.5491 44.5505 31.8061 44.9708C32.0631 44.5505 32.5239 44.2733 33.0467 44.2733C33.5696 44.2733 34.0304 44.5505 34.2874 44.9708C34.5444 44.5505 35.0052 44.2733 35.528 44.2733C36.3344 44.2733 36.9902 44.935 36.9902 45.7488C36.9902 46.5625 36.3344 47.2243 35.528 47.2243C35.0052 47.2243 34.5444 46.947 34.2874 46.5268C34.0304 46.947 33.5696 47.2243 33.0467 47.2243C32.5239 47.2243 32.0631 46.947 31.8061 46.5268C31.5491 46.947 31.0883 47.2243 30.5654 47.2243C30.0337 47.2243 29.5729 46.9381 29.3159 46.5089C29.2095 46.6788 29.0678 46.8308 28.8994 46.9381C29.2893 47.2064 29.5463 47.6535 29.5463 48.1632C29.5463 48.6729 29.2893 49.12 28.8994 49.3883C29.2893 49.6566 29.5463 50.1037 29.5463 50.6134C29.5463 51.1231 29.2893 51.5702 28.8994 51.8385C29.1121 51.9816 29.2804 52.1783 29.3868 52.4108C29.6261 51.9279 30.1223 51.5881 30.6895 51.5881C31.2655 51.5881 31.7529 51.9279 31.9922 52.4108C32.2314 51.9279 32.7277 51.5881 33.2948 51.5881C33.8709 51.5881 34.3583 51.9279 34.5975 52.4108C34.8368 51.9279 35.3331 51.5881 35.9002 51.5881C36.7066 51.5881 37.3624 52.2498 37.3624 53.0636C37.3624 53.8773 36.7066 54.5391 35.9002 54.5391C35.3242 54.5391 34.8368 54.1992 34.5975 53.7164C34.3583 54.1992 33.862 54.5391 33.2948 54.5391C32.7188 54.5391 32.2314 54.1992 31.9922 53.7164C31.7529 54.1992 31.2566 54.5391 30.6895 54.5391C30.1135 54.5391 29.6261 54.1992 29.3868 53.7164C29.1475 54.1992 28.6513 54.5391 28.0841 54.5391C27.2777 54.5391 26.6219 53.8773 26.6219 53.0636C26.6219 52.5539 26.8789 52.1068 27.2688 51.8385C26.8789 51.5702 26.6219 51.1231 26.6219 50.6134C26.6219 50.1037 26.8789 49.6566 27.2688 49.3883C26.8789 49.12 26.6219 48.6729 26.6219 48.1632C26.6219 47.6535 26.8789 47.2064 27.2688 46.9381C26.8789 46.6698 26.6219 46.2227 26.6219 45.713C26.6219 45.2033 26.8789 44.7562 27.2688 44.4879C26.8789 44.2196 26.6219 43.7725 26.6219 43.2628C26.6219 42.7531 26.8789 42.306 27.2688 42.0377C26.8789 41.7695 26.6219 41.3223 26.6219 40.8126C26.6219 40.3029 26.8789 39.8558 27.2688 39.5875C26.8789 39.3193 26.6219 38.8722 26.6219 38.3624C26.6219 37.5487 27.2777 36.887 28.0841 36.887C28.6601 36.887 29.1475 37.2268 29.3868 37.7097C29.6261 37.2268 30.1223 36.887 30.6895 36.887C31.2655 36.887 31.7529 37.2268 31.9922 37.7097C32.2314 37.2268 32.7277 36.887 33.2948 36.887C33.8709 36.887 34.3583 37.2268 34.5975 37.7097C34.8368 37.2268 35.3331 36.887 35.9002 36.887C36.7066 36.887 37.3624 37.5487 37.3624 38.3624C37.3624 39.1762 36.7066 39.8379 35.9002 39.8379C35.3242 39.8379 34.8368 39.4981 34.5975 39.0152C34.3583 39.4981 33.862 39.8379 33.2948 39.8379C32.7188 39.8379 32.2314 39.4981 31.9922 39.0152C31.7529 39.4981 31.2566 39.8379 30.6895 39.8379C30.1135 39.8379 29.6261 39.4981 29.3868 39.0152C29.2716 39.2477 29.1032 39.4445 28.8994 39.5875C29.2893 39.8558 29.5463 40.3029 29.5463 40.8126ZM29.5463 13.3151C29.5463 13.8248 29.2893 14.2719 28.8994 14.5402C29.2893 14.8084 29.5463 15.2556 29.5463 15.7653C29.5463 16.275 29.2893 16.7221 28.8994 16.9904C29.0766 17.1066 29.2184 17.2676 29.3336 17.4554C29.5906 17.044 30.0426 16.7757 30.5654 16.7757C31.0883 16.7757 31.5491 17.053 31.8061 17.4732C32.0631 17.053 32.5239 16.7757 33.0467 16.7757C33.5696 16.7757 34.0304 17.053 34.2874 17.4732C34.5444 17.053 35.0052 16.7757 35.528 16.7757C36.3344 16.7757 36.9902 17.4375 36.9902 18.2512C36.9902 19.065 36.3344 19.7267 35.528 19.7267C35.0052 19.7267 34.5444 19.4495 34.2874 19.0292C34.0304 19.4495 33.5696 19.7267 33.0467 19.7267C32.5239 19.7267 32.0631 19.4495 31.8061 19.0292C31.5491 19.4495 31.0883 19.7267 30.5654 19.7267C30.0337 19.7267 29.5729 19.4405 29.3159 19.0113C29.2095 19.1812 29.0678 19.3332 28.8994 19.4405C29.2893 19.7088 29.5463 20.1559 29.5463 20.6656C29.5463 21.1754 29.2893 21.6225 28.8994 21.8907C29.2893 22.159 29.5463 22.6061 29.5463 23.1158C29.5463 23.6255 29.2893 24.0727 28.8994 24.3409C29.1121 24.484 29.2804 24.6807 29.3868 24.9132C29.6261 24.4303 30.1223 24.0905 30.6895 24.0905C31.2655 24.0905 31.7529 24.4303 31.9922 24.9132C32.2314 24.4303 32.7277 24.0905 33.2948 24.0905C33.8709 24.0905 34.3583 24.4303 34.5975 24.9132C34.8368 24.4303 35.3331 24.0905 35.9002 24.0905C36.7066 24.0905 37.3624 24.7523 37.3624 25.566C37.3624 26.3798 36.7066 27.0415 35.9002 27.0415C35.3242 27.0415 34.8368 26.7017 34.5975 26.2188C34.3583 26.7017 33.862 27.0415 33.2948 27.0415C32.7188 27.0415 32.2314 26.7017 31.9922 26.2188C31.7529 26.7017 31.2566 27.0415 30.6895 27.0415C30.1135 27.0415 29.6261 26.7017 29.3868 26.2188C29.1475 26.7017 28.6513 27.0415 28.0841 27.0415C27.2777 27.0415 26.6219 26.3798 26.6219 25.566C26.6219 25.0563 26.8789 24.6092 27.2688 24.3409C26.8789 24.0727 26.6219 23.6255 26.6219 23.1158C26.6219 22.6061 26.8789 22.159 27.2688 21.8907C26.8789 21.6225 26.6219 21.1754 26.6219 20.6656C26.6219 20.1559 26.8789 19.7088 27.2688 19.4405C26.8789 19.1723 26.6219 18.7252 26.6219 18.2155C26.6219 17.7057 26.8789 17.2586 27.2688 16.9904C26.8789 16.7221 26.6219 16.275 26.6219 15.7653C26.6219 15.2556 26.8789 14.8084 27.2688 14.5402C26.8789 14.2719 26.6219 13.8248 26.6219 13.3151C26.6219 12.8054 26.8789 12.3583 27.2688 12.09C26.8789 11.8217 26.6219 11.3746 26.6219 10.8649C26.6219 10.0511 27.2777 9.38941 28.0841 9.38941C28.6601 9.38941 29.1475 9.72922 29.3868 10.2121C29.6261 9.72922 30.1223 9.38941 30.6895 9.38941C31.2655 9.38941 31.7529 9.72922 31.9922 10.2121C32.2314 9.72922 32.7277 9.38941 33.2948 9.38941C33.8709 9.38941 34.3583 9.72922 34.5975 10.2121C34.8368 9.72922 35.3331 9.38941 35.9002 9.38941C36.7066 9.38941 37.3624 10.0511 37.3624 10.8649C37.3624 11.6786 36.7066 12.3404 35.9002 12.3404C35.3242 12.3404 34.8368 12.0006 34.5975 11.5177C34.3583 12.0006 33.862 12.3404 33.2948 12.3404C32.7188 12.3404 32.2314 12.0006 31.9922 11.5177C31.7529 12.0006 31.2566 12.3404 30.6895 12.3404C30.1135 12.3404 29.6261 12.0006 29.3868 11.5177C29.2716 11.7502 29.1032 11.9469 28.8994 12.09C29.2893 12.3583 29.5463 12.8054 29.5463 13.3151Z", fill: "currentColor" }))); };
 
-var BtGlobalFabricLogo = function () { return (React__default.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 319 64" },
-    React__default.createElement("path", { fill: "currentColor", d: "M33.568 21.088h15.936v4.672H44.16v17.088h-5.248V25.76h-5.344v-4.672ZM32 60.065C16.512 60.065 3.936 47.489 3.936 32S16.512 3.936 32 3.936s28.065 12.577 28.065 28.065c0 15.488-12.576 28.064-28.065 28.064ZM32 64c17.663 0 32-14.336 32-32C64 14.334 49.664 0 32 0 14.337 0 0 14.336 0 32c0 17.665 14.337 32 32 32Zm-5.408-27.808c0-1.375-.863-2.304-2.336-2.304h-3.52v4.544h3.52c1.473 0 2.336-.928 2.336-2.24Zm-.639-8.735c0-1.152-.736-1.953-1.984-1.953h-3.232v3.969h3.232c1.248-.001 1.984-.8 1.984-2.016Zm5.951 8.992c0 4.128-2.912 6.4-7.071 6.4h-9.274V21.09h8.667c4.191 0 7.039 2.143 7.039 6.08 0 1.791-.8 3.391-2.08 4.352 1.471.864 2.72 2.528 2.72 4.928Z" }),
-    React__default.createElement("mask", { id: "a", width: "247", height: "25", x: "72", y: "19.48", fill: "#000", maskUnits: "userSpaceOnUse" },
-        React__default.createElement("path", { d: "M83.048 43.52c-1.899 0-3.616-.469-5.152-1.408-1.515-.938-2.71-2.26-3.584-3.968C73.437 36.418 73 34.368 73 32.002c0-1.728.288-3.296.864-4.704a11.128 11.128 0 0 1 2.464-3.649 10.85 10.85 0 0 1 3.712-2.335c1.43-.555 2.965-.832 4.608-.832 1.92 0 3.637.351 5.152 1.055 1.515.704 2.901 1.792 4.16 3.264l-3.168 2.88c-.875-1.045-1.803-1.813-2.784-2.303-.981-.491-2.101-.736-3.36-.736-1.237 0-2.357.298-3.36.896-1.003.597-1.792 1.45-2.368 2.56-.576 1.087-.864 2.389-.864 3.904 0 1.578.277 2.922.832 4.032.555 1.087 1.301 1.92 2.24 2.495.939.555 1.995.833 3.168.833.981 0 1.867-.192 2.656-.576.81-.384 1.472-.896 1.984-1.536s.81-1.355.896-2.145h-5.344V31.17h10.304V43.2h-4.8v-3.744c-.704 1.323-1.653 2.336-2.848 3.04-1.173.683-2.539 1.024-4.096 1.024ZM113.884 43.2H97.916V20.8h4.928v18.305h11.04V43.2ZM125.359 43.52c-1.685 0-3.253-.277-4.704-.832a11.901 11.901 0 0 1-3.808-2.4 10.882 10.882 0 0 1-2.496-3.647c-.597-1.408-.896-2.955-.896-4.64 0-1.686.299-3.232.896-4.64a10.882 10.882 0 0 1 2.496-3.649 11.464 11.464 0 0 1 3.808-2.367c1.451-.576 3.019-.864 4.704-.864 1.685 0 3.253.287 4.704.863 1.451.555 2.709 1.345 3.776 2.368a10.668 10.668 0 0 1 2.528 3.648c.597 1.409.896 2.955.896 4.64 0 1.686-.299 3.233-.896 4.64a10.668 10.668 0 0 1-2.528 3.648c-1.067 1.025-2.325 1.825-3.776 2.4-1.451.555-3.019.832-4.704.832Zm0-4.16c1.301 0 2.464-.309 3.488-.928a6.613 6.613 0 0 0 2.464-2.56c.597-1.109.896-2.4.896-3.871 0-1.472-.299-2.763-.896-3.872-.597-1.11-1.419-1.963-2.464-2.56-1.024-.62-2.187-.928-3.488-.928-1.28 0-2.443.309-3.488.928-1.024.597-1.845 1.45-2.464 2.56-.597 1.109-.896 2.4-.896 3.872 0 1.471.299 2.762.896 3.872.619 1.088 1.44 1.94 2.464 2.56 1.045.618 2.208.928 3.488.928ZM139.934 20.8h10.656c1.621 0 2.954.267 4 .8 1.066.534 1.856 1.227 2.368 2.08.533.854.8 1.771.8 2.753 0 1.109-.384 2.1-1.152 2.976-.747.853-1.792 1.482-3.136 1.888 1.685.362 2.965 1.034 3.84 2.015.874.96 1.312 2.07 1.312 3.329a6.22 6.22 0 0 1-.928 3.328c-.619.98-1.515 1.77-2.688 2.367-1.152.577-2.539.864-4.16.864h-10.912V20.8Zm9.856 3.872h-4.992v5.12h4.992c1.088 0 1.856-.266 2.304-.8a2.757 2.757 0 0 0 .672-1.823c0-.747-.235-1.345-.704-1.793-.448-.469-1.206-.704-2.272-.704Zm.416 8.928h-5.408v5.728h5.408c1.13 0 1.983-.266 2.56-.8.597-.533.896-1.226.896-2.08 0-.746-.299-1.407-.896-1.983-.577-.577-1.43-.865-2.56-.865ZM158.581 43.2l8.992-22.4h5.376l9.024 22.4h-5.216l-1.92-4.992h-9.28l-1.92 4.992h-5.056Zm8.416-8.736h6.432l-3.232-8.415-3.2 8.416ZM199.888 43.2H183.92V20.8h4.928v18.305h11.04V43.2ZM207.125 43.2V20.8h16.416v4.096h-11.488v5.28h8.768v4.097h-8.768V43.2h-4.928ZM220.96 43.2l8.992-22.4h5.376l9.024 22.4h-5.216l-1.92-4.992h-9.28l-1.92 4.992h-5.056Zm8.416-8.736h6.432l-3.232-8.415-3.2 8.416ZM246.299 20.8h10.655c1.622 0 2.955.267 4 .8 1.067.534 1.857 1.227 2.368 2.08.534.854.8 1.771.8 2.753 0 1.109-.383 2.1-1.151 2.976-.747.853-1.793 1.482-3.136 1.888 1.685.362 2.965 1.034 3.839 2.015.875.96 1.312 2.07 1.312 3.329a6.218 6.218 0 0 1-.927 3.328c-.619.98-1.515 1.77-2.689 2.367-1.151.577-2.538.864-4.16.864h-10.911V20.8Zm9.855 3.872h-4.991v5.12h4.991c1.088 0 1.856-.266 2.304-.8a2.758 2.758 0 0 0 .673-1.823c0-.747-.235-1.345-.705-1.793-.447-.469-1.205-.704-2.272-.704Zm.416 8.928h-5.407v5.728h5.407c1.131 0 1.985-.266 2.561-.8.597-.533.896-1.226.896-2.08 0-.746-.299-1.407-.896-1.983-.576-.577-1.43-.865-2.561-.865ZM267.651 43.2V20.8h11.008c1.621 0 2.987.3 4.096.896 1.131.576 1.984 1.377 2.56 2.4.597 1.003.896 2.166.896 3.488 0 1.473-.373 2.763-1.12 3.872-.747 1.088-1.824 1.878-3.232 2.369l5.152 9.375h-5.504l-4.384-8.576h-4.544V43.2h-4.928Zm10.464-18.432h-5.536v5.92h5.536c1.024 0 1.781-.266 2.272-.8.512-.554.768-1.28.768-2.176 0-.874-.245-1.578-.736-2.111-.491-.555-1.259-.832-2.304-.832ZM289.441 20.8h4.928v22.4h-4.928V20.8ZM317.939 39.233c-1.258 1.472-2.656 2.56-4.192 3.264-1.514.682-3.232 1.023-5.152 1.023-1.621 0-3.136-.277-4.544-.832a11.707 11.707 0 0 1-3.712-2.4 11.513 11.513 0 0 1-2.464-3.68c-.576-1.407-.864-2.944-.864-4.607 0-1.664.288-3.2.864-4.608a11.144 11.144 0 0 1 2.464-3.649 11.102 11.102 0 0 1 3.68-2.4c1.408-.576 2.923-.864 4.544-.864 1.899 0 3.584.352 5.056 1.056 1.494.704 2.859 1.792 4.096 3.264l-3.168 2.88c-.853-1.045-1.76-1.813-2.72-2.303-.938-.491-2.026-.736-3.264-.736-1.216 0-2.314.309-3.296.928-.981.618-1.76 1.482-2.336 2.591-.576 1.11-.864 2.39-.864 3.84 0 1.451.288 2.731.864 3.84.576 1.11 1.355 1.974 2.336 2.592a6.215 6.215 0 0 0 3.328.928c1.28 0 2.411-.234 3.392-.703 1.003-.491 1.931-1.26 2.784-2.304l3.168 2.88Z" })),
-    React__default.createElement("path", { fill: "currentColor", d: "M83.048 43.52c-1.899 0-3.616-.469-5.152-1.408-1.515-.938-2.71-2.26-3.584-3.968C73.437 36.418 73 34.368 73 32.002c0-1.728.288-3.296.864-4.704a11.128 11.128 0 0 1 2.464-3.649 10.85 10.85 0 0 1 3.712-2.335c1.43-.555 2.965-.832 4.608-.832 1.92 0 3.637.351 5.152 1.055 1.515.704 2.901 1.792 4.16 3.264l-3.168 2.88c-.875-1.045-1.803-1.813-2.784-2.303-.981-.491-2.101-.736-3.36-.736-1.237 0-2.357.298-3.36.896-1.003.597-1.792 1.45-2.368 2.56-.576 1.087-.864 2.389-.864 3.904 0 1.578.277 2.922.832 4.032.555 1.087 1.301 1.92 2.24 2.495.939.555 1.995.833 3.168.833.981 0 1.867-.192 2.656-.576.81-.384 1.472-.896 1.984-1.536s.81-1.355.896-2.145h-5.344V31.17h10.304V43.2h-4.8v-3.744c-.704 1.323-1.653 2.336-2.848 3.04-1.173.683-2.539 1.024-4.096 1.024ZM113.884 43.2H97.916V20.8h4.928v18.305h11.04V43.2ZM125.359 43.52c-1.685 0-3.253-.277-4.704-.832a11.901 11.901 0 0 1-3.808-2.4 10.882 10.882 0 0 1-2.496-3.647c-.597-1.408-.896-2.955-.896-4.64 0-1.686.299-3.232.896-4.64a10.882 10.882 0 0 1 2.496-3.649 11.464 11.464 0 0 1 3.808-2.367c1.451-.576 3.019-.864 4.704-.864 1.685 0 3.253.287 4.704.863 1.451.555 2.709 1.345 3.776 2.368a10.668 10.668 0 0 1 2.528 3.648c.597 1.409.896 2.955.896 4.64 0 1.686-.299 3.233-.896 4.64a10.668 10.668 0 0 1-2.528 3.648c-1.067 1.025-2.325 1.825-3.776 2.4-1.451.555-3.019.832-4.704.832Zm0-4.16c1.301 0 2.464-.309 3.488-.928a6.613 6.613 0 0 0 2.464-2.56c.597-1.109.896-2.4.896-3.871 0-1.472-.299-2.763-.896-3.872-.597-1.11-1.419-1.963-2.464-2.56-1.024-.62-2.187-.928-3.488-.928-1.28 0-2.443.309-3.488.928-1.024.597-1.845 1.45-2.464 2.56-.597 1.109-.896 2.4-.896 3.872 0 1.471.299 2.762.896 3.872.619 1.088 1.44 1.94 2.464 2.56 1.045.618 2.208.928 3.488.928ZM139.934 20.8h10.656c1.621 0 2.954.267 4 .8 1.066.534 1.856 1.227 2.368 2.08.533.854.8 1.771.8 2.753 0 1.109-.384 2.1-1.152 2.976-.747.853-1.792 1.482-3.136 1.888 1.685.362 2.965 1.034 3.84 2.015.874.96 1.312 2.07 1.312 3.329a6.22 6.22 0 0 1-.928 3.328c-.619.98-1.515 1.77-2.688 2.367-1.152.577-2.539.864-4.16.864h-10.912V20.8Zm9.856 3.872h-4.992v5.12h4.992c1.088 0 1.856-.266 2.304-.8a2.757 2.757 0 0 0 .672-1.823c0-.747-.235-1.345-.704-1.793-.448-.469-1.206-.704-2.272-.704Zm.416 8.928h-5.408v5.728h5.408c1.13 0 1.983-.266 2.56-.8.597-.533.896-1.226.896-2.08 0-.746-.299-1.407-.896-1.983-.577-.577-1.43-.865-2.56-.865ZM158.581 43.2l8.992-22.4h5.376l9.024 22.4h-5.216l-1.92-4.992h-9.28l-1.92 4.992h-5.056Zm8.416-8.736h6.432l-3.232-8.415-3.2 8.416ZM199.888 43.2H183.92V20.8h4.928v18.305h11.04V43.2ZM207.125 43.2V20.8h16.416v4.096h-11.488v5.28h8.768v4.097h-8.768V43.2h-4.928ZM220.96 43.2l8.992-22.4h5.376l9.024 22.4h-5.216l-1.92-4.992h-9.28l-1.92 4.992h-5.056Zm8.416-8.736h6.432l-3.232-8.415-3.2 8.416ZM246.299 20.8h10.655c1.622 0 2.955.267 4 .8 1.067.534 1.857 1.227 2.368 2.08.534.854.8 1.771.8 2.753 0 1.109-.383 2.1-1.151 2.976-.747.853-1.793 1.482-3.136 1.888 1.685.362 2.965 1.034 3.839 2.015.875.96 1.312 2.07 1.312 3.329a6.218 6.218 0 0 1-.927 3.328c-.619.98-1.515 1.77-2.689 2.367-1.151.577-2.538.864-4.16.864h-10.911V20.8Zm9.855 3.872h-4.991v5.12h4.991c1.088 0 1.856-.266 2.304-.8a2.758 2.758 0 0 0 .673-1.823c0-.747-.235-1.345-.705-1.793-.447-.469-1.205-.704-2.272-.704Zm.416 8.928h-5.407v5.728h5.407c1.131 0 1.985-.266 2.561-.8.597-.533.896-1.226.896-2.08 0-.746-.299-1.407-.896-1.983-.576-.577-1.43-.865-2.561-.865ZM267.651 43.2V20.8h11.008c1.621 0 2.987.3 4.096.896 1.131.576 1.984 1.377 2.56 2.4.597 1.003.896 2.166.896 3.488 0 1.473-.373 2.763-1.12 3.872-.747 1.088-1.824 1.878-3.232 2.369l5.152 9.375h-5.504l-4.384-8.576h-4.544V43.2h-4.928Zm10.464-18.432h-5.536v5.92h5.536c1.024 0 1.781-.266 2.272-.8.512-.554.768-1.28.768-2.176 0-.874-.245-1.578-.736-2.111-.491-.555-1.259-.832-2.304-.832ZM289.441 20.8h4.928v22.4h-4.928V20.8ZM317.939 39.233c-1.258 1.472-2.656 2.56-4.192 3.264-1.514.682-3.232 1.023-5.152 1.023-1.621 0-3.136-.277-4.544-.832a11.707 11.707 0 0 1-3.712-2.4 11.513 11.513 0 0 1-2.464-3.68c-.576-1.407-.864-2.944-.864-4.607 0-1.664.288-3.2.864-4.608a11.144 11.144 0 0 1 2.464-3.649 11.102 11.102 0 0 1 3.68-2.4c1.408-.576 2.923-.864 4.544-.864 1.899 0 3.584.352 5.056 1.056 1.494.704 2.859 1.792 4.096 3.264l-3.168 2.88c-.853-1.045-1.76-1.813-2.72-2.303-.938-.491-2.026-.736-3.264-.736-1.216 0-2.314.309-3.296.928-.981.618-1.76 1.482-2.336 2.591-.576 1.11-.864 2.39-.864 3.84 0 1.451.288 2.731.864 3.84.576 1.11 1.355 1.974 2.336 2.592a6.215 6.215 0 0 0 3.328.928c1.28 0 2.411-.234 3.392-.703 1.003-.491 1.931-1.26 2.784-2.304l3.168 2.88Z" }),
-    React__default.createElement("path", { stroke: "currentColor", strokeWidth: ".5", d: "M83.048 43.52c-1.899 0-3.616-.469-5.152-1.408-1.515-.938-2.71-2.26-3.584-3.968C73.437 36.418 73 34.368 73 32.002c0-1.728.288-3.296.864-4.704a11.128 11.128 0 0 1 2.464-3.649 10.85 10.85 0 0 1 3.712-2.335c1.43-.555 2.965-.832 4.608-.832 1.92 0 3.637.351 5.152 1.055 1.515.704 2.901 1.792 4.16 3.264l-3.168 2.88c-.875-1.045-1.803-1.813-2.784-2.303-.981-.491-2.101-.736-3.36-.736-1.237 0-2.357.298-3.36.896-1.003.597-1.792 1.45-2.368 2.56-.576 1.087-.864 2.389-.864 3.904 0 1.578.277 2.922.832 4.032.555 1.087 1.301 1.92 2.24 2.495.939.555 1.995.833 3.168.833.981 0 1.867-.192 2.656-.576.81-.384 1.472-.896 1.984-1.536s.81-1.355.896-2.145h-5.344V31.17h10.304V43.2h-4.8v-3.744c-.704 1.323-1.653 2.336-2.848 3.04-1.173.683-2.539 1.024-4.096 1.024ZM113.884 43.2H97.916V20.8h4.928v18.305h11.04V43.2ZM125.359 43.52c-1.685 0-3.253-.277-4.704-.832a11.901 11.901 0 0 1-3.808-2.4 10.882 10.882 0 0 1-2.496-3.647c-.597-1.408-.896-2.955-.896-4.64 0-1.686.299-3.232.896-4.64a10.882 10.882 0 0 1 2.496-3.649 11.464 11.464 0 0 1 3.808-2.367c1.451-.576 3.019-.864 4.704-.864 1.685 0 3.253.287 4.704.863 1.451.555 2.709 1.345 3.776 2.368a10.668 10.668 0 0 1 2.528 3.648c.597 1.409.896 2.955.896 4.64 0 1.686-.299 3.233-.896 4.64a10.668 10.668 0 0 1-2.528 3.648c-1.067 1.025-2.325 1.825-3.776 2.4-1.451.555-3.019.832-4.704.832Zm0-4.16c1.301 0 2.464-.309 3.488-.928a6.613 6.613 0 0 0 2.464-2.56c.597-1.109.896-2.4.896-3.871 0-1.472-.299-2.763-.896-3.872-.597-1.11-1.419-1.963-2.464-2.56-1.024-.62-2.187-.928-3.488-.928-1.28 0-2.443.309-3.488.928-1.024.597-1.845 1.45-2.464 2.56-.597 1.109-.896 2.4-.896 3.872 0 1.471.299 2.762.896 3.872.619 1.088 1.44 1.94 2.464 2.56 1.045.618 2.208.928 3.488.928ZM139.934 20.8h10.656c1.621 0 2.954.267 4 .8 1.066.534 1.856 1.227 2.368 2.08.533.854.8 1.771.8 2.753 0 1.109-.384 2.1-1.152 2.976-.747.853-1.792 1.482-3.136 1.888 1.685.362 2.965 1.034 3.84 2.015.874.96 1.312 2.07 1.312 3.329a6.22 6.22 0 0 1-.928 3.328c-.619.98-1.515 1.77-2.688 2.367-1.152.577-2.539.864-4.16.864h-10.912V20.8Zm9.856 3.872h-4.992v5.12h4.992c1.088 0 1.856-.266 2.304-.8a2.757 2.757 0 0 0 .672-1.823c0-.747-.235-1.345-.704-1.793-.448-.469-1.206-.704-2.272-.704Zm.416 8.928h-5.408v5.728h5.408c1.13 0 1.983-.266 2.56-.8.597-.533.896-1.226.896-2.08 0-.746-.299-1.407-.896-1.983-.577-.577-1.43-.865-2.56-.865ZM158.581 43.2l8.992-22.4h5.376l9.024 22.4h-5.216l-1.92-4.992h-9.28l-1.92 4.992h-5.056Zm8.416-8.736h6.432l-3.232-8.415-3.2 8.416ZM199.888 43.2H183.92V20.8h4.928v18.305h11.04V43.2ZM207.125 43.2V20.8h16.416v4.096h-11.488v5.28h8.768v4.097h-8.768V43.2h-4.928ZM220.96 43.2l8.992-22.4h5.376l9.024 22.4h-5.216l-1.92-4.992h-9.28l-1.92 4.992h-5.056Zm8.416-8.736h6.432l-3.232-8.415-3.2 8.416ZM246.299 20.8h10.655c1.622 0 2.955.267 4 .8 1.067.534 1.857 1.227 2.368 2.08.534.854.8 1.771.8 2.753 0 1.109-.383 2.1-1.151 2.976-.747.853-1.793 1.482-3.136 1.888 1.685.362 2.965 1.034 3.839 2.015.875.96 1.312 2.07 1.312 3.329a6.218 6.218 0 0 1-.927 3.328c-.619.98-1.515 1.77-2.689 2.367-1.151.577-2.538.864-4.16.864h-10.911V20.8Zm9.855 3.872h-4.991v5.12h4.991c1.088 0 1.856-.266 2.304-.8a2.758 2.758 0 0 0 .673-1.823c0-.747-.235-1.345-.705-1.793-.447-.469-1.205-.704-2.272-.704Zm.416 8.928h-5.407v5.728h5.407c1.131 0 1.985-.266 2.561-.8.597-.533.896-1.226.896-2.08 0-.746-.299-1.407-.896-1.983-.576-.577-1.43-.865-2.561-.865ZM267.651 43.2V20.8h11.008c1.621 0 2.987.3 4.096.896 1.131.576 1.984 1.377 2.56 2.4.597 1.003.896 2.166.896 3.488 0 1.473-.373 2.763-1.12 3.872-.747 1.088-1.824 1.878-3.232 2.369l5.152 9.375h-5.504l-4.384-8.576h-4.544V43.2h-4.928Zm10.464-18.432h-5.536v5.92h5.536c1.024 0 1.781-.266 2.272-.8.512-.554.768-1.28.768-2.176 0-.874-.245-1.578-.736-2.111-.491-.555-1.259-.832-2.304-.832ZM289.441 20.8h4.928v22.4h-4.928V20.8ZM317.939 39.233c-1.258 1.472-2.656 2.56-4.192 3.264-1.514.682-3.232 1.023-5.152 1.023-1.621 0-3.136-.277-4.544-.832a11.707 11.707 0 0 1-3.712-2.4 11.513 11.513 0 0 1-2.464-3.68c-.576-1.407-.864-2.944-.864-4.607 0-1.664.288-3.2.864-4.608a11.144 11.144 0 0 1 2.464-3.649 11.102 11.102 0 0 1 3.68-2.4c1.408-.576 2.923-.864 4.544-.864 1.899 0 3.584.352 5.056 1.056 1.494.704 2.859 1.792 4.096 3.264l-3.168 2.88c-.853-1.045-1.76-1.813-2.72-2.303-.938-.491-2.026-.736-3.264-.736-1.216 0-2.314.309-3.296.928-.981.618-1.76 1.482-2.336 2.591-.576 1.11-.864 2.39-.864 3.84 0 1.451.288 2.731.864 3.84.576 1.11 1.355 1.974 2.336 2.592a6.215 6.215 0 0 0 3.328.928c1.28 0 2.411-.234 3.392-.703 1.003-.491 1.931-1.26 2.784-2.304l3.168 2.88Z", mask: "url(#a)" }))); };
-
-var BtMediaBroadcastLogo = function () { return (React__default.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 244 64" },
-    React__default.createElement("path", { fill: "currentColor", d: "M33.598 21.088h15.935v4.672H44.19v17.088h-5.248V25.76h-5.344v-4.672ZM32.03 60.065C16.542 60.065 3.966 47.489 3.966 32S16.542 3.936 32.03 3.936c15.487 0 28.064 12.577 28.064 28.065 0 15.488-12.575 28.064-28.064 28.064Zm0 3.935c17.663 0 32-14.336 32-32 0-17.665-14.336-32-32-32s-32 14.336-32 32c0 17.665 14.336 32 32 32Zm-5.408-27.808c0-1.375-.864-2.304-2.336-2.304h-3.52v4.544h3.52c1.472 0 2.336-.928 2.336-2.24Zm-.64-8.735c0-1.152-.735-1.953-1.983-1.953h-3.232v3.969h3.232c1.248-.001 1.984-.8 1.984-2.016Zm5.952 8.992c0 4.128-2.912 6.4-7.072 6.4H15.59V21.09h8.666c4.192 0 7.04 2.143 7.04 6.08 0 1.791-.8 3.391-2.08 4.352 1.471.864 2.719 2.528 2.719 4.928Z" }),
-    React__default.createElement("mask", { id: "a", width: "171", height: "50", x: "73.03", y: "6.64", fill: "#000", maskUnits: "userSpaceOnUse" },
-        React__default.createElement("path", { d: "M74.03 28.08V8.48h5.712l5.544 14.812L90.802 8.48h5.572v19.6h-4.2V13.66l-5.516 14.42h-2.912L78.23 13.66v14.42h-4.2ZM99.904 28.08V8.48h14.644v3.584h-10.332v4.34h7.252v3.584h-7.252v4.508h10.612v3.584H99.904ZM117.221 28.08V8.48h7.112c2.352 0 4.358.42 6.02 1.26 1.68.821 2.958 1.969 3.836 3.444.896 1.474 1.344 3.173 1.344 5.096 0 1.922-.448 3.621-1.344 5.096-.878 1.474-2.156 2.632-3.836 3.472-1.662.821-3.668 1.232-6.02 1.232h-7.112Zm7.112-16.016h-2.8v12.432h2.8c2.202 0 3.882-.56 5.04-1.68 1.157-1.12 1.736-2.632 1.736-4.536 0-1.886-.579-3.388-1.736-4.508-1.158-1.139-2.838-1.708-5.04-1.708ZM137.846 8.48h4.312v19.6h-4.312V8.48ZM143.854 28.08l7.868-19.6h4.704l7.896 19.6h-4.564l-1.68-4.368h-8.12l-1.68 4.368h-4.424Zm7.364-7.644h5.628l-2.828-7.364-2.8 7.364ZM169.344 22.564c0-1.158.298-2.184.896-3.08.597-.915 1.642-1.764 3.136-2.548-.728-.84-1.26-1.596-1.596-2.268a5.04 5.04 0 0 1-.476-2.184c0-.915.242-1.736.728-2.464.504-.728 1.185-1.307 2.044-1.736.877-.43 1.885-.644 3.024-.644 1.12 0 2.109.214 2.968.644.877.41 1.568.98 2.072 1.708s.756 1.577.756 2.548c0 1.008-.327 1.932-.98 2.772-.654.84-1.662 1.596-3.024 2.268l3.696 4.088c.429-.56.812-1.195 1.148-1.904.354-.71.634-1.494.84-2.352l3.388 1.176a14.601 14.601 0 0 1-1.26 3.164 13.077 13.077 0 0 1-1.792 2.492l3.472 3.836h-4.956l-1.344-1.484a12.698 12.698 0 0 1-2.912 1.344c-.971.28-1.867.42-2.688.42-1.438 0-2.698-.262-3.78-.784-1.064-.523-1.895-1.223-2.492-2.1a5.174 5.174 0 0 1-.868-2.912ZM175.28 12.4c0 .373.102.774.308 1.204.224.41.644.98 1.26 1.708.858-.467 1.418-.934 1.68-1.4.261-.486.392-.943.392-1.372 0-.542-.159-.98-.476-1.316-.318-.336-.766-.504-1.344-.504-.579 0-1.027.158-1.344.476-.318.317-.476.718-.476 1.204Zm-1.68 9.828c0 .802.289 1.446.868 1.932a3.15 3.15 0 0 0 2.044.728c1.138 0 2.23-.271 3.276-.812l-4.34-4.816c-.672.429-1.148.905-1.428 1.428a3.138 3.138 0 0 0-.42 1.54ZM74.03 36.48h9.324c1.418 0 2.585.233 3.5.7.933.466 1.624 1.073 2.072 1.82.466.746.7 1.549.7 2.408 0 .97-.336 1.838-1.008 2.604-.654.746-1.568 1.297-2.744 1.652 1.474.317 2.594.905 3.36 1.764.765.84 1.148 1.81 1.148 2.912 0 1.064-.271 2.034-.812 2.912-.542.858-1.326 1.549-2.352 2.072-1.008.504-2.222.756-3.64.756H74.03v-19.6Zm8.624 3.388h-4.368v4.48h4.368c.952 0 1.624-.234 2.016-.7.392-.467.588-.999.588-1.596 0-.654-.206-1.176-.616-1.568-.392-.411-1.055-.616-1.988-.616Zm.364 7.812h-4.732v5.012h4.732c.989 0 1.736-.234 2.24-.7.522-.467.784-1.074.784-1.82 0-.654-.262-1.232-.784-1.736-.504-.504-1.251-.756-2.24-.756ZM92.713 56.08v-19.6h9.632c1.419 0 2.613.261 3.584.784.989.504 1.736 1.204 2.24 2.1.523.877.784 1.894.784 3.052 0 1.288-.327 2.417-.98 3.388-.653.952-1.596 1.642-2.828 2.072l4.508 8.204h-4.816l-3.836-7.504h-3.976v7.504h-4.312Zm9.156-16.128h-4.844v5.18h4.844c.896 0 1.559-.234 1.988-.7.448-.486.672-1.12.672-1.904 0-.766-.215-1.382-.644-1.848-.429-.486-1.101-.728-2.016-.728ZM120.718 56.36c-1.475 0-2.847-.243-4.116-.728a10.42 10.42 0 0 1-3.332-2.1 9.54 9.54 0 0 1-2.184-3.192c-.523-1.232-.784-2.586-.784-4.06 0-1.475.261-2.828.784-4.06a9.54 9.54 0 0 1 2.184-3.192 10.04 10.04 0 0 1 3.332-2.072c1.269-.504 2.641-.756 4.116-.756 1.475 0 2.847.252 4.116.756a9.729 9.729 0 0 1 3.304 2.072 9.343 9.343 0 0 1 2.212 3.192c.523 1.232.784 2.585.784 4.06 0 1.474-.261 2.828-.784 4.06a9.344 9.344 0 0 1-2.212 3.192 10.09 10.09 0 0 1-3.304 2.1c-1.269.485-2.641.728-4.116.728Zm0-3.64c1.139 0 2.156-.271 3.052-.812a5.786 5.786 0 0 0 2.156-2.24c.523-.971.784-2.1.784-3.388 0-1.288-.261-2.418-.784-3.388-.523-.971-1.241-1.718-2.156-2.24-.896-.542-1.913-.812-3.052-.812-1.12 0-2.137.27-3.052.812-.896.522-1.615 1.269-2.156 2.24-.523.97-.784 2.1-.784 3.388 0 1.288.261 2.417.784 3.388a6.06 6.06 0 0 0 2.156 2.24c.915.541 1.932.812 3.052.812ZM130.529 56.08l7.868-19.6h4.704l7.896 19.6h-4.564l-1.68-4.368h-8.12l-1.68 4.368h-4.424Zm7.364-7.644h5.628l-2.828-7.364-2.8 7.364ZM152.701 56.08v-19.6h7.112c2.352 0 4.359.42 6.02 1.26 1.68.821 2.959 1.969 3.836 3.444.896 1.474 1.344 3.173 1.344 5.096 0 1.922-.448 3.621-1.344 5.096-.877 1.474-2.156 2.632-3.836 3.472-1.661.821-3.668 1.232-6.02 1.232h-7.112Zm7.112-16.016h-2.8v12.432h2.8c2.203 0 3.883-.56 5.04-1.68 1.157-1.12 1.736-2.632 1.736-4.536 0-1.886-.579-3.388-1.736-4.508-1.157-1.139-2.837-1.708-5.04-1.708ZM190.434 52.608c-1.102 1.288-2.324 2.24-3.668 2.856-1.326.597-2.828.896-4.508.896-1.419 0-2.744-.243-3.976-.728a10.236 10.236 0 0 1-3.248-2.1 10.044 10.044 0 0 1-2.156-3.22c-.504-1.232-.756-2.576-.756-4.032s.252-2.8.756-4.032a9.722 9.722 0 0 1 5.376-5.292c1.232-.504 2.557-.756 3.976-.756 1.661 0 3.136.308 4.424.924 1.306.616 2.501 1.568 3.584 2.856l-2.772 2.52c-.747-.915-1.54-1.587-2.38-2.016-.822-.43-1.774-.644-2.856-.644-1.064 0-2.026.27-2.884.812-.859.541-1.54 1.297-2.044 2.268-.504.97-.756 2.09-.756 3.36 0 1.269.252 2.389.756 3.36.504.97 1.185 1.726 2.044 2.268a5.435 5.435 0 0 0 2.912.812c1.12 0 2.109-.206 2.968-.616.877-.43 1.689-1.102 2.436-2.016l2.772 2.52ZM190.189 56.08l7.868-19.6h4.704l7.896 19.6h-4.564l-1.68-4.368h-8.12l-1.68 4.368h-4.424Zm7.364-7.644h5.628l-2.828-7.364-2.8 7.364ZM218.506 56.36c-1.587 0-3.08-.243-4.48-.728-1.382-.504-2.576-1.232-3.584-2.184l2.324-2.8a8.742 8.742 0 0 0 2.604 1.596c.952.354 1.988.532 3.108.532 1.045 0 1.866-.178 2.464-.532.597-.374.896-.878.896-1.512 0-.56-.178-1.018-.532-1.372-.355-.374-1.074-.719-2.156-1.036l-3.136-.924c-1.568-.467-2.744-1.148-3.528-2.044-.766-.915-1.148-2.016-1.148-3.304 0-1.176.317-2.203.952-3.08.634-.878 1.512-1.559 2.632-2.044 1.12-.486 2.398-.728 3.836-.728 1.456 0 2.79.27 4.004.812 1.232.522 2.249 1.185 3.052 1.988l-2.38 2.632c-.542-.542-1.214-.98-2.016-1.316-.784-.355-1.643-.532-2.576-.532-1.12 0-1.932.186-2.436.56-.486.373-.728.849-.728 1.428 0 .522.177.961.532 1.316.354.354.961.662 1.82.924l3.136.924c1.792.522 3.08 1.25 3.864 2.184.784.933 1.176 2.053 1.176 3.36 0 1.064-.243 1.978-.728 2.744a5.739 5.739 0 0 1-1.904 1.82 9.885 9.885 0 0 1-2.52 1.008c-.878.205-1.727.308-2.548.308ZM243.217 40.064h-6.272V56.08h-4.312V40.064h-6.272V36.48h16.856v3.584Z" })),
-    React__default.createElement("path", { fill: "currentColor", d: "M74.03 28.08V8.48h5.712l5.544 14.812L90.802 8.48h5.572v19.6h-4.2V13.66l-5.516 14.42h-2.912L78.23 13.66v14.42h-4.2ZM99.904 28.08V8.48h14.644v3.584h-10.332v4.34h7.252v3.584h-7.252v4.508h10.612v3.584H99.904ZM117.221 28.08V8.48h7.112c2.352 0 4.358.42 6.02 1.26 1.68.821 2.958 1.969 3.836 3.444.896 1.474 1.344 3.173 1.344 5.096 0 1.922-.448 3.621-1.344 5.096-.878 1.474-2.156 2.632-3.836 3.472-1.662.821-3.668 1.232-6.02 1.232h-7.112Zm7.112-16.016h-2.8v12.432h2.8c2.202 0 3.882-.56 5.04-1.68 1.157-1.12 1.736-2.632 1.736-4.536 0-1.886-.579-3.388-1.736-4.508-1.158-1.139-2.838-1.708-5.04-1.708ZM137.846 8.48h4.312v19.6h-4.312V8.48ZM143.854 28.08l7.868-19.6h4.704l7.896 19.6h-4.564l-1.68-4.368h-8.12l-1.68 4.368h-4.424Zm7.364-7.644h5.628l-2.828-7.364-2.8 7.364ZM169.344 22.564c0-1.158.298-2.184.896-3.08.597-.915 1.642-1.764 3.136-2.548-.728-.84-1.26-1.596-1.596-2.268a5.04 5.04 0 0 1-.476-2.184c0-.915.242-1.736.728-2.464.504-.728 1.185-1.307 2.044-1.736.877-.43 1.885-.644 3.024-.644 1.12 0 2.109.214 2.968.644.877.41 1.568.98 2.072 1.708s.756 1.577.756 2.548c0 1.008-.327 1.932-.98 2.772-.654.84-1.662 1.596-3.024 2.268l3.696 4.088c.429-.56.812-1.195 1.148-1.904.354-.71.634-1.494.84-2.352l3.388 1.176a14.601 14.601 0 0 1-1.26 3.164 13.077 13.077 0 0 1-1.792 2.492l3.472 3.836h-4.956l-1.344-1.484a12.698 12.698 0 0 1-2.912 1.344c-.971.28-1.867.42-2.688.42-1.438 0-2.698-.262-3.78-.784-1.064-.523-1.895-1.223-2.492-2.1a5.174 5.174 0 0 1-.868-2.912ZM175.28 12.4c0 .373.102.774.308 1.204.224.41.644.98 1.26 1.708.858-.467 1.418-.934 1.68-1.4.261-.486.392-.943.392-1.372 0-.542-.159-.98-.476-1.316-.318-.336-.766-.504-1.344-.504-.579 0-1.027.158-1.344.476-.318.317-.476.718-.476 1.204Zm-1.68 9.828c0 .802.289 1.446.868 1.932a3.15 3.15 0 0 0 2.044.728c1.138 0 2.23-.271 3.276-.812l-4.34-4.816c-.672.429-1.148.905-1.428 1.428a3.138 3.138 0 0 0-.42 1.54ZM74.03 36.48h9.324c1.418 0 2.585.233 3.5.7.933.466 1.624 1.073 2.072 1.82.466.746.7 1.549.7 2.408 0 .97-.336 1.838-1.008 2.604-.654.746-1.568 1.297-2.744 1.652 1.474.317 2.594.905 3.36 1.764.765.84 1.148 1.81 1.148 2.912 0 1.064-.271 2.034-.812 2.912-.542.858-1.326 1.549-2.352 2.072-1.008.504-2.222.756-3.64.756H74.03v-19.6Zm8.624 3.388h-4.368v4.48h4.368c.952 0 1.624-.234 2.016-.7.392-.467.588-.999.588-1.596 0-.654-.206-1.176-.616-1.568-.392-.411-1.055-.616-1.988-.616Zm.364 7.812h-4.732v5.012h4.732c.989 0 1.736-.234 2.24-.7.522-.467.784-1.074.784-1.82 0-.654-.262-1.232-.784-1.736-.504-.504-1.251-.756-2.24-.756ZM92.713 56.08v-19.6h9.632c1.419 0 2.613.261 3.584.784.989.504 1.736 1.204 2.24 2.1.523.877.784 1.894.784 3.052 0 1.288-.327 2.417-.98 3.388-.653.952-1.596 1.642-2.828 2.072l4.508 8.204h-4.816l-3.836-7.504h-3.976v7.504h-4.312Zm9.156-16.128h-4.844v5.18h4.844c.896 0 1.559-.234 1.988-.7.448-.486.672-1.12.672-1.904 0-.766-.215-1.382-.644-1.848-.429-.486-1.101-.728-2.016-.728ZM120.718 56.36c-1.475 0-2.847-.243-4.116-.728a10.42 10.42 0 0 1-3.332-2.1 9.54 9.54 0 0 1-2.184-3.192c-.523-1.232-.784-2.586-.784-4.06 0-1.475.261-2.828.784-4.06a9.54 9.54 0 0 1 2.184-3.192 10.04 10.04 0 0 1 3.332-2.072c1.269-.504 2.641-.756 4.116-.756 1.475 0 2.847.252 4.116.756a9.729 9.729 0 0 1 3.304 2.072 9.343 9.343 0 0 1 2.212 3.192c.523 1.232.784 2.585.784 4.06 0 1.474-.261 2.828-.784 4.06a9.344 9.344 0 0 1-2.212 3.192 10.09 10.09 0 0 1-3.304 2.1c-1.269.485-2.641.728-4.116.728Zm0-3.64c1.139 0 2.156-.271 3.052-.812a5.786 5.786 0 0 0 2.156-2.24c.523-.971.784-2.1.784-3.388 0-1.288-.261-2.418-.784-3.388-.523-.971-1.241-1.718-2.156-2.24-.896-.542-1.913-.812-3.052-.812-1.12 0-2.137.27-3.052.812-.896.522-1.615 1.269-2.156 2.24-.523.97-.784 2.1-.784 3.388 0 1.288.261 2.417.784 3.388a6.06 6.06 0 0 0 2.156 2.24c.915.541 1.932.812 3.052.812ZM130.529 56.08l7.868-19.6h4.704l7.896 19.6h-4.564l-1.68-4.368h-8.12l-1.68 4.368h-4.424Zm7.364-7.644h5.628l-2.828-7.364-2.8 7.364ZM152.701 56.08v-19.6h7.112c2.352 0 4.359.42 6.02 1.26 1.68.821 2.959 1.969 3.836 3.444.896 1.474 1.344 3.173 1.344 5.096 0 1.922-.448 3.621-1.344 5.096-.877 1.474-2.156 2.632-3.836 3.472-1.661.821-3.668 1.232-6.02 1.232h-7.112Zm7.112-16.016h-2.8v12.432h2.8c2.203 0 3.883-.56 5.04-1.68 1.157-1.12 1.736-2.632 1.736-4.536 0-1.886-.579-3.388-1.736-4.508-1.157-1.139-2.837-1.708-5.04-1.708ZM190.434 52.608c-1.102 1.288-2.324 2.24-3.668 2.856-1.326.597-2.828.896-4.508.896-1.419 0-2.744-.243-3.976-.728a10.236 10.236 0 0 1-3.248-2.1 10.044 10.044 0 0 1-2.156-3.22c-.504-1.232-.756-2.576-.756-4.032s.252-2.8.756-4.032a9.722 9.722 0 0 1 5.376-5.292c1.232-.504 2.557-.756 3.976-.756 1.661 0 3.136.308 4.424.924 1.306.616 2.501 1.568 3.584 2.856l-2.772 2.52c-.747-.915-1.54-1.587-2.38-2.016-.822-.43-1.774-.644-2.856-.644-1.064 0-2.026.27-2.884.812-.859.541-1.54 1.297-2.044 2.268-.504.97-.756 2.09-.756 3.36 0 1.269.252 2.389.756 3.36.504.97 1.185 1.726 2.044 2.268a5.435 5.435 0 0 0 2.912.812c1.12 0 2.109-.206 2.968-.616.877-.43 1.689-1.102 2.436-2.016l2.772 2.52ZM190.189 56.08l7.868-19.6h4.704l7.896 19.6h-4.564l-1.68-4.368h-8.12l-1.68 4.368h-4.424Zm7.364-7.644h5.628l-2.828-7.364-2.8 7.364ZM218.506 56.36c-1.587 0-3.08-.243-4.48-.728-1.382-.504-2.576-1.232-3.584-2.184l2.324-2.8a8.742 8.742 0 0 0 2.604 1.596c.952.354 1.988.532 3.108.532 1.045 0 1.866-.178 2.464-.532.597-.374.896-.878.896-1.512 0-.56-.178-1.018-.532-1.372-.355-.374-1.074-.719-2.156-1.036l-3.136-.924c-1.568-.467-2.744-1.148-3.528-2.044-.766-.915-1.148-2.016-1.148-3.304 0-1.176.317-2.203.952-3.08.634-.878 1.512-1.559 2.632-2.044 1.12-.486 2.398-.728 3.836-.728 1.456 0 2.79.27 4.004.812 1.232.522 2.249 1.185 3.052 1.988l-2.38 2.632c-.542-.542-1.214-.98-2.016-1.316-.784-.355-1.643-.532-2.576-.532-1.12 0-1.932.186-2.436.56-.486.373-.728.849-.728 1.428 0 .522.177.961.532 1.316.354.354.961.662 1.82.924l3.136.924c1.792.522 3.08 1.25 3.864 2.184.784.933 1.176 2.053 1.176 3.36 0 1.064-.243 1.978-.728 2.744a5.739 5.739 0 0 1-1.904 1.82 9.885 9.885 0 0 1-2.52 1.008c-.878.205-1.727.308-2.548.308ZM243.217 40.064h-6.272V56.08h-4.312V40.064h-6.272V36.48h16.856v3.584Z" }),
-    React__default.createElement("path", { stroke: "currentColor", strokeWidth: ".5", d: "M74.03 28.08V8.48h5.712l5.544 14.812L90.802 8.48h5.572v19.6h-4.2V13.66l-5.516 14.42h-2.912L78.23 13.66v14.42h-4.2ZM99.904 28.08V8.48h14.644v3.584h-10.332v4.34h7.252v3.584h-7.252v4.508h10.612v3.584H99.904ZM117.221 28.08V8.48h7.112c2.352 0 4.358.42 6.02 1.26 1.68.821 2.958 1.969 3.836 3.444.896 1.474 1.344 3.173 1.344 5.096 0 1.922-.448 3.621-1.344 5.096-.878 1.474-2.156 2.632-3.836 3.472-1.662.821-3.668 1.232-6.02 1.232h-7.112Zm7.112-16.016h-2.8v12.432h2.8c2.202 0 3.882-.56 5.04-1.68 1.157-1.12 1.736-2.632 1.736-4.536 0-1.886-.579-3.388-1.736-4.508-1.158-1.139-2.838-1.708-5.04-1.708ZM137.846 8.48h4.312v19.6h-4.312V8.48ZM143.854 28.08l7.868-19.6h4.704l7.896 19.6h-4.564l-1.68-4.368h-8.12l-1.68 4.368h-4.424Zm7.364-7.644h5.628l-2.828-7.364-2.8 7.364ZM169.344 22.564c0-1.158.298-2.184.896-3.08.597-.915 1.642-1.764 3.136-2.548-.728-.84-1.26-1.596-1.596-2.268a5.04 5.04 0 0 1-.476-2.184c0-.915.242-1.736.728-2.464.504-.728 1.185-1.307 2.044-1.736.877-.43 1.885-.644 3.024-.644 1.12 0 2.109.214 2.968.644.877.41 1.568.98 2.072 1.708s.756 1.577.756 2.548c0 1.008-.327 1.932-.98 2.772-.654.84-1.662 1.596-3.024 2.268l3.696 4.088c.429-.56.812-1.195 1.148-1.904.354-.71.634-1.494.84-2.352l3.388 1.176a14.601 14.601 0 0 1-1.26 3.164 13.077 13.077 0 0 1-1.792 2.492l3.472 3.836h-4.956l-1.344-1.484a12.698 12.698 0 0 1-2.912 1.344c-.971.28-1.867.42-2.688.42-1.438 0-2.698-.262-3.78-.784-1.064-.523-1.895-1.223-2.492-2.1a5.174 5.174 0 0 1-.868-2.912ZM175.28 12.4c0 .373.102.774.308 1.204.224.41.644.98 1.26 1.708.858-.467 1.418-.934 1.68-1.4.261-.486.392-.943.392-1.372 0-.542-.159-.98-.476-1.316-.318-.336-.766-.504-1.344-.504-.579 0-1.027.158-1.344.476-.318.317-.476.718-.476 1.204Zm-1.68 9.828c0 .802.289 1.446.868 1.932a3.15 3.15 0 0 0 2.044.728c1.138 0 2.23-.271 3.276-.812l-4.34-4.816c-.672.429-1.148.905-1.428 1.428a3.138 3.138 0 0 0-.42 1.54ZM74.03 36.48h9.324c1.418 0 2.585.233 3.5.7.933.466 1.624 1.073 2.072 1.82.466.746.7 1.549.7 2.408 0 .97-.336 1.838-1.008 2.604-.654.746-1.568 1.297-2.744 1.652 1.474.317 2.594.905 3.36 1.764.765.84 1.148 1.81 1.148 2.912 0 1.064-.271 2.034-.812 2.912-.542.858-1.326 1.549-2.352 2.072-1.008.504-2.222.756-3.64.756H74.03v-19.6Zm8.624 3.388h-4.368v4.48h4.368c.952 0 1.624-.234 2.016-.7.392-.467.588-.999.588-1.596 0-.654-.206-1.176-.616-1.568-.392-.411-1.055-.616-1.988-.616Zm.364 7.812h-4.732v5.012h4.732c.989 0 1.736-.234 2.24-.7.522-.467.784-1.074.784-1.82 0-.654-.262-1.232-.784-1.736-.504-.504-1.251-.756-2.24-.756ZM92.713 56.08v-19.6h9.632c1.419 0 2.613.261 3.584.784.989.504 1.736 1.204 2.24 2.1.523.877.784 1.894.784 3.052 0 1.288-.327 2.417-.98 3.388-.653.952-1.596 1.642-2.828 2.072l4.508 8.204h-4.816l-3.836-7.504h-3.976v7.504h-4.312Zm9.156-16.128h-4.844v5.18h4.844c.896 0 1.559-.234 1.988-.7.448-.486.672-1.12.672-1.904 0-.766-.215-1.382-.644-1.848-.429-.486-1.101-.728-2.016-.728ZM120.718 56.36c-1.475 0-2.847-.243-4.116-.728a10.42 10.42 0 0 1-3.332-2.1 9.54 9.54 0 0 1-2.184-3.192c-.523-1.232-.784-2.586-.784-4.06 0-1.475.261-2.828.784-4.06a9.54 9.54 0 0 1 2.184-3.192 10.04 10.04 0 0 1 3.332-2.072c1.269-.504 2.641-.756 4.116-.756 1.475 0 2.847.252 4.116.756a9.729 9.729 0 0 1 3.304 2.072 9.343 9.343 0 0 1 2.212 3.192c.523 1.232.784 2.585.784 4.06 0 1.474-.261 2.828-.784 4.06a9.344 9.344 0 0 1-2.212 3.192 10.09 10.09 0 0 1-3.304 2.1c-1.269.485-2.641.728-4.116.728Zm0-3.64c1.139 0 2.156-.271 3.052-.812a5.786 5.786 0 0 0 2.156-2.24c.523-.971.784-2.1.784-3.388 0-1.288-.261-2.418-.784-3.388-.523-.971-1.241-1.718-2.156-2.24-.896-.542-1.913-.812-3.052-.812-1.12 0-2.137.27-3.052.812-.896.522-1.615 1.269-2.156 2.24-.523.97-.784 2.1-.784 3.388 0 1.288.261 2.417.784 3.388a6.06 6.06 0 0 0 2.156 2.24c.915.541 1.932.812 3.052.812ZM130.529 56.08l7.868-19.6h4.704l7.896 19.6h-4.564l-1.68-4.368h-8.12l-1.68 4.368h-4.424Zm7.364-7.644h5.628l-2.828-7.364-2.8 7.364ZM152.701 56.08v-19.6h7.112c2.352 0 4.359.42 6.02 1.26 1.68.821 2.959 1.969 3.836 3.444.896 1.474 1.344 3.173 1.344 5.096 0 1.922-.448 3.621-1.344 5.096-.877 1.474-2.156 2.632-3.836 3.472-1.661.821-3.668 1.232-6.02 1.232h-7.112Zm7.112-16.016h-2.8v12.432h2.8c2.203 0 3.883-.56 5.04-1.68 1.157-1.12 1.736-2.632 1.736-4.536 0-1.886-.579-3.388-1.736-4.508-1.157-1.139-2.837-1.708-5.04-1.708ZM190.434 52.608c-1.102 1.288-2.324 2.24-3.668 2.856-1.326.597-2.828.896-4.508.896-1.419 0-2.744-.243-3.976-.728a10.236 10.236 0 0 1-3.248-2.1 10.044 10.044 0 0 1-2.156-3.22c-.504-1.232-.756-2.576-.756-4.032s.252-2.8.756-4.032a9.722 9.722 0 0 1 5.376-5.292c1.232-.504 2.557-.756 3.976-.756 1.661 0 3.136.308 4.424.924 1.306.616 2.501 1.568 3.584 2.856l-2.772 2.52c-.747-.915-1.54-1.587-2.38-2.016-.822-.43-1.774-.644-2.856-.644-1.064 0-2.026.27-2.884.812-.859.541-1.54 1.297-2.044 2.268-.504.97-.756 2.09-.756 3.36 0 1.269.252 2.389.756 3.36.504.97 1.185 1.726 2.044 2.268a5.435 5.435 0 0 0 2.912.812c1.12 0 2.109-.206 2.968-.616.877-.43 1.689-1.102 2.436-2.016l2.772 2.52ZM190.189 56.08l7.868-19.6h4.704l7.896 19.6h-4.564l-1.68-4.368h-8.12l-1.68 4.368h-4.424Zm7.364-7.644h5.628l-2.828-7.364-2.8 7.364ZM218.506 56.36c-1.587 0-3.08-.243-4.48-.728-1.382-.504-2.576-1.232-3.584-2.184l2.324-2.8a8.742 8.742 0 0 0 2.604 1.596c.952.354 1.988.532 3.108.532 1.045 0 1.866-.178 2.464-.532.597-.374.896-.878.896-1.512 0-.56-.178-1.018-.532-1.372-.355-.374-1.074-.719-2.156-1.036l-3.136-.924c-1.568-.467-2.744-1.148-3.528-2.044-.766-.915-1.148-2.016-1.148-3.304 0-1.176.317-2.203.952-3.08.634-.878 1.512-1.559 2.632-2.044 1.12-.486 2.398-.728 3.836-.728 1.456 0 2.79.27 4.004.812 1.232.522 2.249 1.185 3.052 1.988l-2.38 2.632c-.542-.542-1.214-.98-2.016-1.316-.784-.355-1.643-.532-2.576-.532-1.12 0-1.932.186-2.436.56-.486.373-.728.849-.728 1.428 0 .522.177.961.532 1.316.354.354.961.662 1.82.924l3.136.924c1.792.522 3.08 1.25 3.864 2.184.784.933 1.176 2.053 1.176 3.36 0 1.064-.243 1.978-.728 2.744a5.739 5.739 0 0 1-1.904 1.82 9.885 9.885 0 0 1-2.52 1.008c-.878.205-1.727.308-2.548.308ZM243.217 40.064h-6.272V56.08h-4.312V40.064h-6.272V36.48h16.856v3.584Z", mask: "url(#a)" }))); };
+var BtGlobalFabricLogo = function () { return (React__default.createElement("svg", { viewBox: "0 0 276 64", fill: "none", xmlns: "http://www.w3.org/2000/svg" },
+    React__default.createElement("path", { d: "M33.5682 21.0883H49.5038V25.7598H44.16V42.8479H38.9119V25.7598H33.5682V21.0883ZM32 60.0648C16.5123 60.0648 3.93635 47.4886 3.93635 32.0006C3.93635 16.5126 16.5123 3.93642 32 3.93642C47.4877 3.93642 60.0649 16.5126 60.0649 32.0006C60.0649 47.4886 47.4889 60.0648 32 60.0648ZM32 64C49.6633 64 64 49.6642 64 31.9994C64 14.3346 49.6645 0 32 0C14.3367 0 0 14.3358 0 32.0006C0 49.6654 14.3367 64 32 64ZM26.5924 36.1923C26.5924 34.8167 25.7286 33.8878 24.2562 33.8878H20.7358V38.4317H24.2562C25.7286 38.4329 26.5924 37.504 26.5924 36.1923ZM25.9531 27.4568C25.9531 26.3046 25.2169 25.5045 23.969 25.5045H20.737V29.4729H23.969C25.2169 29.4716 25.9531 28.6728 25.9531 27.4568ZM31.9043 36.4487C31.9043 40.5766 28.9925 42.8491 24.8329 42.8491H15.5589V21.0883H24.2255C28.4171 21.0883 31.265 23.232 31.265 27.1684C31.265 28.96 30.465 30.56 29.1852 31.5208C30.6564 32.3847 31.9043 34.0486 31.9043 36.4487Z", fill: "currentColor" }),
+    React__default.createElement("path", { d: "M91.232 44.32C89.376 44.32 87.68 43.8507 86.144 42.912C84.608 41.9733 83.3813 40.6507 82.464 38.944C81.5467 37.216 81.088 35.168 81.088 32.8C81.088 31.072 81.376 29.504 81.952 28.096C82.528 26.688 83.328 25.472 84.352 24.448C85.376 23.424 86.5813 22.6453 87.968 22.112C89.3547 21.5573 90.848 21.28 92.448 21.28C94.3467 21.28 96.032 21.6213 97.504 22.304C98.976 22.9867 100.352 24.0533 101.632 25.504L98.944 27.936C98.0053 26.848 97.024 26.048 96 25.536C94.976 25.0027 93.792 24.736 92.448 24.736C91.0613 24.736 89.8133 25.0667 88.704 25.728C87.5947 26.368 86.72 27.296 86.08 28.512C85.44 29.7067 85.12 31.136 85.12 32.8C85.12 34.528 85.4293 36 86.048 37.216C86.6667 38.4107 87.5093 39.3173 88.576 39.936C89.6427 40.5547 90.848 40.864 92.192 40.864C93.4293 40.864 94.5173 40.608 95.456 40.096C96.3947 39.5627 97.1307 38.9013 97.664 38.112C98.2187 37.3227 98.496 36.5333 98.496 35.744H92.608V32.416H102.4V44H98.624V39.776C97.8987 41.248 96.896 42.3787 95.616 43.168C94.336 43.936 92.8747 44.32 91.232 44.32ZM109.794 44.32C108.45 44.32 107.415 43.9573 106.69 43.232C105.964 42.4853 105.602 41.3973 105.602 39.968V20.96H109.378V39.52C109.378 40.096 109.495 40.512 109.73 40.768C109.964 41.0027 110.306 41.12 110.754 41.12C111.266 41.12 111.66 41.088 111.938 41.024V44.128C111.404 44.256 110.69 44.32 109.794 44.32ZM121.753 44.32C120.174 44.32 118.734 43.968 117.433 43.264C116.153 42.56 115.139 41.5787 114.393 40.32C113.646 39.0613 113.273 37.6 113.273 35.936C113.273 34.272 113.646 32.8107 114.393 31.552C115.139 30.2933 116.153 29.312 117.433 28.608C118.734 27.904 120.174 27.552 121.753 27.552C123.353 27.552 124.793 27.904 126.073 28.608C127.353 29.312 128.366 30.2933 129.113 31.552C129.859 32.8107 130.233 34.272 130.233 35.936C130.233 37.6 129.859 39.0613 129.113 40.32C128.366 41.5787 127.353 42.56 126.073 43.264C124.793 43.968 123.353 44.32 121.753 44.32ZM121.753 41.152C123.054 41.152 124.153 40.6933 125.049 39.776C125.945 38.8587 126.393 37.5787 126.393 35.936C126.393 34.2933 125.945 33.0133 125.049 32.096C124.153 31.1787 123.054 30.72 121.753 30.72C120.451 30.72 119.353 31.1787 118.457 32.096C117.561 33.0133 117.113 34.2933 117.113 35.936C117.113 37.5787 117.561 38.8587 118.457 39.776C119.353 40.6933 120.451 41.152 121.753 41.152ZM133.012 44V20.96H136.788V30.976C137.321 29.9093 138.057 29.0773 138.996 28.48C139.956 27.8613 141.065 27.552 142.324 27.552C143.561 27.552 144.713 27.8933 145.78 28.576C146.868 29.2373 147.742 30.1973 148.404 31.456C149.086 32.6933 149.428 34.1867 149.428 35.936C149.428 37.6853 149.086 39.1893 148.404 40.448C147.742 41.6853 146.868 42.6453 145.78 43.328C144.713 43.9893 143.561 44.32 142.324 44.32C141.044 44.32 139.913 44 138.932 43.36C137.972 42.72 137.225 41.824 136.692 40.672V44H133.012ZM136.692 37.152C136.692 37.9413 136.894 38.6453 137.3 39.264C137.705 39.8613 138.228 40.3307 138.868 40.672C139.508 40.992 140.19 41.152 140.916 41.152C142.302 41.152 143.422 40.6933 144.276 39.776C145.15 38.8587 145.588 37.5787 145.588 35.936C145.588 34.2933 145.15 33.0133 144.276 32.096C143.422 31.1787 142.302 30.72 140.916 30.72C140.19 30.72 139.508 30.8907 138.868 31.232C138.228 31.552 137.705 32.0107 137.3 32.608C136.894 33.2053 136.692 33.9093 136.692 34.72V37.152ZM158.439 44.32C157.202 44.32 156.039 43.9893 154.951 43.328C153.884 42.6453 153.01 41.6853 152.327 40.448C151.666 39.1893 151.335 37.6853 151.335 35.936C151.335 34.1867 151.666 32.6933 152.327 31.456C153.01 30.1973 153.884 29.2373 154.951 28.576C156.039 27.8933 157.202 27.552 158.439 27.552C159.762 27.552 160.914 27.8933 161.895 28.576C162.898 29.2587 163.655 30.1973 164.167 31.392V27.872H167.751V44H164.167V40.48C163.655 41.6747 162.898 42.6133 161.895 43.296C160.914 43.9787 159.762 44.32 158.439 44.32ZM155.175 35.936C155.175 37.5787 155.602 38.8587 156.455 39.776C157.33 40.6933 158.46 41.152 159.847 41.152C160.572 41.152 161.255 40.992 161.895 40.672C162.535 40.3307 163.058 39.8613 163.463 39.264C163.868 38.6453 164.071 37.9413 164.071 37.152V34.72C164.071 33.9093 163.868 33.2053 163.463 32.608C163.058 32.0107 162.535 31.552 161.895 31.232C161.255 30.8907 160.572 30.72 159.847 30.72C158.46 30.72 157.33 31.1787 156.455 32.096C155.602 32.992 155.175 34.272 155.175 35.936ZM175.419 44.32C174.075 44.32 173.04 43.9573 172.315 43.232C171.589 42.4853 171.227 41.3973 171.227 39.968V20.96H175.003V39.52C175.003 40.096 175.12 40.512 175.355 40.768C175.589 41.0027 175.931 41.12 176.379 41.12C176.891 41.12 177.285 41.088 177.562 41.024V44.128C177.029 44.256 176.315 44.32 175.419 44.32ZM186.741 44V21.6H202.485V24.992H190.645V31.328H199.765V34.72H190.645V44H186.741ZM209.408 44.32C208.17 44.32 207.008 43.9893 205.92 43.328C204.853 42.6453 203.978 41.6853 203.296 40.448C202.634 39.1893 202.304 37.6853 202.304 35.936C202.304 34.1867 202.634 32.6933 203.296 31.456C203.978 30.1973 204.853 29.2373 205.92 28.576C207.008 27.8933 208.17 27.552 209.408 27.552C210.73 27.552 211.882 27.8933 212.864 28.576C213.866 29.2587 214.624 30.1973 215.136 31.392V27.872H218.72V44H215.136V40.48C214.624 41.6747 213.866 42.6133 212.864 43.296C211.882 43.9787 210.73 44.32 209.408 44.32ZM206.144 35.936C206.144 37.5787 206.57 38.8587 207.424 39.776C208.298 40.6933 209.429 41.152 210.816 41.152C211.541 41.152 212.224 40.992 212.864 40.672C213.504 40.3307 214.026 39.8613 214.432 39.264C214.837 38.6453 215.04 37.9413 215.04 37.152V34.72C215.04 33.9093 214.837 33.2053 214.432 32.608C214.026 32.0107 213.504 31.552 212.864 31.232C212.224 30.8907 211.541 30.72 210.816 30.72C209.429 30.72 208.298 31.1787 207.424 32.096C206.57 32.992 206.144 34.272 206.144 35.936ZM222.355 44V20.96H226.131V30.976C226.665 29.9093 227.401 29.0773 228.339 28.48C229.299 27.8613 230.409 27.552 231.667 27.552C232.905 27.552 234.057 27.8933 235.123 28.576C236.211 29.2373 237.086 30.1973 237.747 31.456C238.43 32.6933 238.771 34.1867 238.771 35.936C238.771 37.6853 238.43 39.1893 237.747 40.448C237.086 41.6853 236.211 42.6453 235.123 43.328C234.057 43.9893 232.905 44.32 231.667 44.32C230.387 44.32 229.257 44 228.275 43.36C227.315 42.72 226.569 41.824 226.035 40.672V44H222.355ZM226.035 37.152C226.035 37.9413 226.238 38.6453 226.643 39.264C227.049 39.8613 227.571 40.3307 228.211 40.672C228.851 40.992 229.534 41.152 230.259 41.152C231.646 41.152 232.766 40.6933 233.619 39.776C234.494 38.8587 234.931 37.5787 234.931 35.936C234.931 34.2933 234.494 33.0133 233.619 32.096C232.766 31.1787 231.646 30.72 230.259 30.72C229.534 30.72 228.851 30.8907 228.211 31.232C227.571 31.552 227.049 32.0107 226.643 32.608C226.238 33.2053 226.035 33.9093 226.035 34.72V37.152ZM241.543 44V27.872H245.191V31.52C245.617 30.368 246.236 29.44 247.047 28.736C247.857 28.0107 248.796 27.648 249.863 27.648C250.076 27.648 250.289 27.6587 250.503 27.68C250.716 27.7013 250.929 27.7333 251.143 27.776V31.584C250.524 31.4347 249.841 31.36 249.095 31.36C247.879 31.36 246.94 31.6907 246.279 32.352C245.639 33.0133 245.319 33.9413 245.319 35.136V44H241.543ZM255.368 25.536C254.664 25.536 254.067 25.312 253.576 24.864C253.107 24.3947 252.872 23.8187 252.872 23.136C252.872 22.4533 253.107 21.888 253.576 21.44C254.067 20.9707 254.664 20.736 255.368 20.736C256.072 20.736 256.659 20.9707 257.128 21.44C257.619 21.888 257.864 22.4533 257.864 23.136C257.864 23.8187 257.619 24.3947 257.128 24.864C256.659 25.312 256.072 25.536 255.368 25.536ZM253.48 44V27.872H257.256V44H253.48ZM274.838 41.632C274.006 42.464 273.024 43.1253 271.894 43.616C270.763 44.0853 269.6 44.32 268.406 44.32C266.827 44.32 265.408 43.968 264.15 43.264C262.891 42.56 261.888 41.5787 261.142 40.32C260.416 39.0613 260.054 37.6 260.054 35.936C260.054 34.272 260.416 32.8107 261.142 31.552C261.888 30.2933 262.902 29.312 264.182 28.608C265.462 27.904 266.891 27.552 268.47 27.552C269.6 27.552 270.71 27.7973 271.798 28.288C272.907 28.7573 273.878 29.4293 274.71 30.304L272.598 32.544C271.51 31.3493 270.155 30.752 268.534 30.752C267.19 30.752 266.08 31.2107 265.206 32.128C264.331 33.0453 263.894 34.3147 263.894 35.936C263.894 37.0027 264.107 37.9307 264.534 38.72C264.96 39.488 265.526 40.0853 266.23 40.512C266.955 40.9173 267.744 41.12 268.598 41.12C269.408 41.12 270.176 40.96 270.902 40.64C271.648 40.32 272.32 39.8827 272.918 39.328L274.838 41.632Z", fill: "currentColor" }))); };
 
 var BtWholesaleLogo = function () { return (React__default.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 203 50" },
     React__default.createElement("path", { d: "M26.226 16.475h12.45v3.65H34.5v13.35h-4.1v-13.35h-4.175v-3.65ZM25 46.925C12.9 46.925 3.075 37.1 3.075 25 3.075 12.9 12.9 3.075 25 3.075 37.1 3.075 46.925 12.9 46.925 25c0 12.1-9.825 21.925-21.925 21.925ZM25 50c13.8 0 25-11.2 25-25S38.8 0 25 0 0 11.2 0 25s11.2 25 25 25Zm-4.225-21.724c0-1.075-.675-1.8-1.825-1.8H16.2v3.551h2.75c1.15-.002 1.825-.727 1.825-1.751Zm-.5-6.825c0-.9-.576-1.526-1.551-1.526H16.2v3.1h2.526c.973.001 1.549-.625 1.549-1.574Zm4.65 7.024c0 3.224-2.274 5-5.524 5h-7.246v-17h6.772c3.275 0 5.5 1.676 5.5 4.75 0 1.4-.625 2.65-1.625 3.401 1.149.674 2.124 1.974 2.124 3.849Zm48.125.125-3.284-12.125h-3.942l-3.307 12.219-2.948-12.219h-4.364l4.93 16.995h4.458l3.13-11.268 3.109 11.268h4.459l4.928-16.995h-4.245L73.049 28.6Zm19.122-5.44H85.1v-6.685H81V33.47h4.1v-6.824h7.072v6.824h4.1V16.475h-4.1v6.685Zm20.784-4.471a8.77 8.77 0 0 0-2.873-1.808 9.774 9.774 0 0 0-3.556-.642c-1.267 0-2.463.215-3.556.642a8.753 8.753 0 0 0-2.874 1.808 8.224 8.224 0 0 0-1.908 2.769c-.452 1.064-.68 2.245-.68 3.516 0 1.27.23 2.451.68 3.515a8.224 8.224 0 0 0 1.908 2.77 8.773 8.773 0 0 0 2.874 1.807 9.773 9.773 0 0 0 3.555.642c1.267 0 2.463-.215 3.557-.642a8.716 8.716 0 0 0 2.873-1.808 8.195 8.195 0 0 0 1.907-2.769c.451-1.064.679-2.245.679-3.515 0-1.269-.23-2.452-.68-3.516a8.194 8.194 0 0 0-1.906-2.77Zm-1.605 6.285c0 1.042-.214 1.961-.633 2.735a4.67 4.67 0 0 1-1.722 1.814c-.723.432-1.554.652-2.468.652-.898 0-1.721-.218-2.445-.652a4.772 4.772 0 0 1-1.735-1.815c-.427-.773-.644-1.692-.644-2.734 0-1.043.217-1.967.644-2.747a4.653 4.653 0 0 1 1.734-1.813c.723-.425 1.547-.642 2.445-.642.913 0 1.744.215 2.469.642a4.577 4.577 0 0 1 1.72 1.811c.421.782.635 1.706.635 2.748Zm9.53-8.499h-4.1V33.47h12.249v-3.483h-8.149V16.475Zm13.58 10.171h6.118V23.16h-6.118v-3.2h8.716v-3.485h-12.814V33.47h13.05v-3.483h-8.952v-3.341Zm22.279-1.113c-.688-.819-1.823-1.464-3.371-1.916l-2.644-.78c-.685-.208-1.17-.451-1.439-.721a1.275 1.275 0 0 1-.381-.947c0-.415.174-.75.534-1.02.374-.282 1.015-.425 1.904-.425a5.2 5.2 0 0 1 2.09.418 5.24 5.24 0 0 1 1.62 1.074l.17.171 2.318-2.563-.156-.155c-.695-.695-1.58-1.279-2.632-1.737-1.058-.459-2.23-.692-3.483-.692-1.239 0-2.359.214-3.329.634-.978.425-1.758 1.03-2.316 1.8-.563.777-.846 1.698-.846 2.735 0 1.137.347 2.122 1.035 2.924.68.796 1.715 1.402 3.075 1.808l2.646.78c.871.256 1.447.526 1.718.8.257.265.382.595.382 1.008 0 .453-.211.8-.645 1.065-.466.284-1.124.427-1.958.427-.912 0-1.766-.15-2.538-.444a6.99 6.99 0 0 1-2.126-1.292l-.178-.157-2.251 2.712.157.148a8.77 8.77 0 0 0 3.117 1.88 11.47 11.47 0 0 0 3.846.639c.707 0 1.451-.094 2.215-.279a8.06 8.06 0 0 0 2.176-.875 4.942 4.942 0 0 0 1.685-1.61c.433-.672.651-1.49.651-2.428 0-1.151-.352-2.155-1.046-2.982Zm7.387-9.058-6.822 16.995h4.231l1.416-3.684h6.532l1.417 3.684h4.351l-6.846-16.995h-4.279Zm4.142 10.086h-4.077l2.03-5.334 2.047 5.334Zm12.046-10.086h-4.1V33.47h12.249v-3.483h-8.149V16.475Zm13.58 13.512v-3.341h6.117V23.16h-6.117v-3.2h8.715v-3.485h-12.814V33.47h13.052v-3.483h-8.953Z", fill: "currentColor" }))); };
 
-var BtRedcareLogo = function () { return (React__default.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 169 50" },
-    React__default.createElement("path", { d: "M25 0C11.285 0 0 11.285 0 25s11.285 25 25 25 25-11.285 25-25C49.995 11.287 38.713.005 25 0Zm0 46.92h-.005c-12.028 0-21.925-9.897-21.925-21.925S12.967 3.07 24.995 3.07 46.92 12.967 46.92 24.995V25C46.911 37.022 37.022 46.911 25 46.92Zm95.636-16.632-2.683-2.44-.153.19a5.93 5.93 0 0 1-1.965 1.626 5.484 5.484 0 0 1-2.415.508 4.314 4.314 0 0 1-2.323-.65 4.609 4.609 0 0 1-1.653-1.828 6.386 6.386 0 0 1 0-5.456 4.627 4.627 0 0 1 1.642-1.824 4.267 4.267 0 0 1 2.31-.65 5.014 5.014 0 0 1 2.317.521c.746.411 1.4.97 1.923 1.642l.153.187 2.686-2.436-.142-.176a9.26 9.26 0 0 0-3.09-2.47 8.886 8.886 0 0 0-3.84-.802 9.082 9.082 0 0 0-3.428.644 8.536 8.536 0 0 0-2.798 1.824 8.35 8.35 0 0 0-1.871 2.785 9.462 9.462 0 0 0 0 6.978 8.36 8.36 0 0 0 4.672 4.6 9.204 9.204 0 0 0 3.44.642 9.37 9.37 0 0 0 3.909-.788 9.195 9.195 0 0 0 3.16-2.457l.15-.17h-.001ZM22.8 24.626a4.224 4.224 0 0 0 1.625-3.4c0-3.075-2.224-4.751-5.5-4.751h-6.77v17h7.248c3.25 0 5.526-1.774 5.526-5-.003-1.875-.979-3.175-2.129-3.849Zm3.425-4.501H30.4v13.35h4.1v-13.35h4.175v-3.65h-12.45v3.65Zm126.251 4.57a5.193 5.193 0 0 0 .866-2.976 5.303 5.303 0 0 0-.68-2.7 4.818 4.818 0 0 0-1.98-1.861c-.857-.448-1.915-.676-3.143-.676h-8.354v16.992h4.097v-6.336h2.984l3.235 6.329h4.586l-3.86-7.028a4.777 4.777 0 0 0 2.25-1.744h-.001Zm-75.218 1.947h6.115V23.16h-6.115v-3.2h8.714v-3.484H73.16v16.992h13.048v-3.484h-8.95v-3.342Zm-6.888-1.947a5.193 5.193 0 0 0 .866-2.976 5.306 5.306 0 0 0-.68-2.707 4.825 4.825 0 0 0-1.98-1.861c-.86-.448-1.916-.676-3.135-.676H57.08v16.992h4.095v-6.33h2.983l3.235 6.33h4.586l-3.86-7.028a4.787 4.787 0 0 0 2.252-1.744h-.001Zm28.995-7.144c-1.436-.706-3.175-1.076-5.193-1.076h-6.228v16.992h6.228c2.01 0 3.757-.353 5.193-1.074a7.914 7.914 0 0 0 3.33-3 8.457 8.457 0 0 0 1.154-4.409 8.44 8.44 0 0 0-1.154-4.41 7.894 7.894 0 0 0-3.33-3.023Zm32.205-1.076h-4.279l-6.816 16.992h4.234l1.41-3.683h6.527l1.411 3.683h4.358l-6.786-16.847-.06-.145h.001Zm27.747 13.508v-3.34h6.117v-3.485h-6.117v-3.2h8.715v-3.483h-12.81v16.992h13.047v-3.484h-8.952Zm-140.367.042v.008-.001H16.2v-3.557h2.75c1.15 0 1.825.725 1.825 1.8 0 1.025-.666 1.75-1.825 1.75Zm80.711-5.054c0 1.534-.469 2.765-1.395 3.66-.926.897-2.309 1.356-4.094 1.356h-2.13V19.959h2.13c1.787 0 3.163.458 4.09 1.363.928.905 1.4 2.138 1.4 3.65l-.001-.001Zm27.694 1.588 2.029-5.335 2.05 5.335h-4.079Zm-60.312-4.744a2.02 2.02 0 0 1-.494 1.437c-.323.353-.834.53-1.519.53h-3.856v-3.919h3.856c.706 0 1.216.177 1.53.53.337.392.51.898.483 1.414v.008Zm82.108 0a2.024 2.024 0 0 1-.494 1.437c-.322.353-.833.53-1.52.53h-3.855v-3.919h3.855c.705 0 1.215.177 1.53.53.337.391.51.898.484 1.414v.008ZM16.2 19.932h2.526c.973 0 1.548.625 1.548 1.526 0 .949-.575 1.575-1.548 1.575H16.2v-3.101Z", fill: "currentColor" }))); };
-
 var NavigationHeaderLogo = function (_a) {
-    var _b;
-    var _c = _a.brand, brand = _c === void 0 ? "bt" : _c, _d = _a.href, href = _d === void 0 ? "/" : _d, _e = _a.ariaLabel, ariaLabel = _e === void 0 ? "Home" : _e, _f = _a.isSurfaceSensitive, isSurfaceSensitive = _f === void 0 ? true : _f, svg = _a.svg, onClick = _a.onClick;
+    var _b = _a.brand, brand = _b === void 0 ? "bt" : _b, _c = _a.href, href = _c === void 0 ? "/" : _c, _d = _a.ariaLabel, ariaLabel = _d === void 0 ? "Home" : _d, svg = _a.svg, onClick = _a.onClick;
     var surface = useContext(Context$3).surface;
     var logos = {
         bt: BtLogo,
         ee: EeLogo,
         btGlobalFabric: BtGlobalFabricLogo,
-        btMediaBroadCast: BtMediaBroadcastLogo,
-        btRedcare: BtRedcareLogo,
         btWholesale: BtWholesaleLogo,
     };
     var icon = svg || React__default.createElement(logos[brand]);
-    return (React__default.createElement("a", { className: classNames("arc-NavigationHeaderLogo", (_b = {
-                "arc-NavigationHeaderLogo--staticColor": !isSurfaceSensitive
-            },
-            _b[suffixModifier("arc-NavigationHeaderLogo--on", surface)] = isSurfaceSensitive,
-            _b)), "aria-label": ariaLabel, onClick: onClick, href: href }, icon));
+    return (React__default.createElement("a", { className: classNames("arc-NavigationHeaderLogo", suffixModifier("arc-NavigationHeaderLogo--on", surface)), "aria-label": ariaLabel, onClick: onClick, href: href }, icon));
 };
 
 // src/check-element-visibility/check-element-visibility.ts
@@ -26033,9 +26239,16 @@ var checkElementVisibility = (element) => {
   }
 };
 
+var DELAY_DURATION = 500;
+
 var NavigationHeaderInlineAction = function (_a) {
     var icon = _a.icon, text = _a.text, href = _a.href, onClick = _a.onClick;
-    return (React__default.createElement(ConditionalWrapper, { condition: Boolean(href), wrapper: function (children) { return (React__default.createElement("a", { "aria-label": text, className: classNames("arc-NavigationHeaderInlineAction", "arc-NavigationHeaderInlineAction-link"), href: href, onClick: onClick }, children)); }, fallback: function (children) { return (React__default.createElement("button", { "aria-label": text, className: classNames("arc-NavigationHeaderInlineAction", "arc-NavigationHeaderInlineAction-button"), onClick: onClick }, children)); } },
+    var surface = useContext(Context$3).surface;
+    var commonClasses = [
+        "arc-NavigationHeaderInlineAction",
+        suffixModifier("arc-NavigationHeaderInlineAction--on", surface),
+    ];
+    return (React__default.createElement(ConditionalWrapper, { condition: Boolean(href), wrapper: function (children) { return (React__default.createElement("a", { "aria-label": text, className: classNames.apply(void 0, __spreadArray(__spreadArray([], commonClasses, false), ["arc-NavigationHeaderInlineAction-link"], false)), href: href, onClick: onClick }, children)); }, fallback: function (children) { return (React__default.createElement("button", { "aria-label": text, className: classNames.apply(void 0, __spreadArray(__spreadArray([], commonClasses, false), ["arc-NavigationHeaderInlineAction-button"], false)), onClick: onClick }, children)); } },
         React__default.createElement("div", { className: "arc-NavigationHeaderInlineAction-content" },
             React__default.createElement(Icon$1, { "aria-hidden": true, icon: icon, size: 28 }),
             React__default.createElement(Text, { size: "l" }, text))));
@@ -26053,6 +26266,7 @@ var NavigationHeaderButton = forwardRef(function (_a, ref) {
 var NavigationHeaderDisclosure = function (_a) {
     var heading = _a.heading, children = _a.children;
     var _b = useState(false), isOpen = _b[0], setIsOpen = _b[1];
+    var surface = useContext(Context$3).surface;
     var containerRef = useRef(null);
     var handleOnClick = function (e) {
         e.preventDefault();
@@ -26063,45 +26277,51 @@ var NavigationHeaderDisclosure = function (_a) {
             containerRef.current.firstChild.focus();
         }
     }, [isOpen, containerRef.current]);
-    return (React__default.createElement("details", { className: "arc-NavigationHeaderDisclosure", open: isOpen },
+    return (React__default.createElement("details", { className: classNames("arc-NavigationHeaderDisclosure", suffixModifier("arc-NavigationHeaderDisclosure--on", surface)), open: isOpen },
         React__default.createElement("summary", { "aria-expanded": isOpen, onClick: handleOnClick, className: "arc-NavigationHeaderDisclosure-summary" },
             React__default.createElement("span", { className: "arc-NavigationHeaderDisclosure-heading" }, heading),
             React__default.createElement("span", { className: "arc-NavigationHeaderDisclosure-icon" },
-                React__default.createElement(ThemeIcon, { size: 28, icon: "navigationHeaderDisclosure" }))),
+                React__default.createElement(Visible, { xs: true, s: true },
+                    React__default.createElement(ThemeIcon, { size: 20, icon: "navigationHeaderDisclosure" })),
+                React__default.createElement(Visible, { m: true, l: true },
+                    React__default.createElement(ThemeIcon, { size: 24, icon: "navigationHeaderDisclosure" })),
+                React__default.createElement(Visible, { xl: true, xxl: true },
+                    React__default.createElement(ThemeIcon, { size: 28, icon: "navigationHeaderDisclosure" })))),
         React__default.createElement("div", { ref: containerRef, className: "arc-NavigationHeaderDisclosure-details" }, children)));
 };
 
 var NavigationHeaderMenuLink = function (_a) {
     var href = _a.href, onClick = _a.onClick, text = _a.text, _b = _a.size, size = _b === void 0 ? "l" : _b;
-    var icons = {
-        s: {
-            icon: "navigationHeaderMenuLinkSmall",
-            size: 24,
-        },
-        l: {
-            icon: "navigationHeaderMenuLinkLarge",
-            size: 28,
-        },
-    };
-    return (React__default.createElement("a", { "aria-label": text, href: href, onClick: onClick, className: classNames("arc-NavigationHeaderMenuLink", suffixModifier("arc-NavigationHeaderMenuLink--size", size)) },
+    var surface = useContext(Context$3).surface;
+    return (React__default.createElement("a", { "aria-label": text, href: href, onClick: onClick, className: classNames("arc-NavigationHeaderMenuLink", suffixModifier("arc-NavigationHeaderMenuLink--on", surface), suffixModifier("arc-NavigationHeaderMenuLink--size", size)) },
         React__default.createElement("div", { className: "arc-NavigationHeaderMenuLink-text" }, text),
         React__default.createElement("span", { className: "arc-NavigationHeaderMenuLink-icon" },
-            React__default.createElement(ThemeIcon, __assign({}, icons[size])))));
+            size === "s" && (React__default.createElement("div", { className: "arc-NavigationHeaderMenuLink-smallIconContainer" },
+                React__default.createElement(ThemeIcon, { icon: "navigationHeaderMenuLinkSmall" }))),
+            size === "l" && (React__default.createElement(React__default.Fragment, null,
+                React__default.createElement(Visible, { xs: true, s: true },
+                    React__default.createElement(ThemeIcon, { size: 20, icon: "navigationHeaderMenuLinkLarge" })),
+                React__default.createElement(Visible, { m: true, l: true },
+                    React__default.createElement(ThemeIcon, { size: 24, icon: "navigationHeaderMenuLinkLarge" })),
+                React__default.createElement(Visible, { xl: true, xxl: true },
+                    React__default.createElement(ThemeIcon, { size: 28, icon: "navigationHeaderMenuLinkLarge" })))))));
 };
 
 var NavigationHeaderCloseButton = React__default.forwardRef(function (_a, ref) {
     var onClick = _a.onClick, props = __rest(_a, ["onClick"]);
-    return (React__default.createElement("button", __assign({}, props, { ref: ref, "aria-label": "close", onClick: onClick, className: "arc-NavigationHeaderCloseButton" }),
+    var surface = useContext(Context$3).surface;
+    return (React__default.createElement("button", __assign({}, props, { ref: ref, "aria-label": "close", onClick: onClick, className: classNames("arc-NavigationHeaderCloseButton", suffixModifier("arc-NavigationHeaderCloseButton--on", surface)) }),
         React__default.createElement(ThemeIcon, { size: 32, icon: "navigationHeaderClose" })));
 });
 
 var NavigationHeaderBurgerMenu = function (_a) {
-    var navItems = _a.navItems, actions = _a.actions, header = _a.header, footer = _a.footer, logo = _a.logo;
+    var navItems = _a.navItems, actions = _a.actions, header = _a.header, footer = _a.footer, logo = _a.logo, background = _a.background, onOpenChange = _a.onOpenChange, _b = _a.pathway, pathway = _b === void 0 ? "invert" : _b;
     var id = useId$1();
-    var _b = useState(false), isOpen = _b[0], setIsOpen = _b[1];
+    var _c = useState(false), isOpen = _c[0], setIsOpen = _c[1];
     var triggerRef = useRef(null);
+    var listRef = useRef(null);
     var interactionMode = useInteractionMode().interactionMode;
-    var _c = useThemeElement(), themeElement = _c[0], setThemeElement = _c[1];
+    var _d = useThemeElement(), themeElement = _d[0], setThemeElement = _d[1];
     var closeMenu = function () {
         setIsOpen(false);
     };
@@ -26110,6 +26330,9 @@ var NavigationHeaderBurgerMenu = function (_a) {
             triggerRef.current.focus();
         }
     };
+    useEffect(function () {
+        onOpenChange === null || onOpenChange === void 0 ? void 0 : onOpenChange(isOpen);
+    }, [isOpen]);
     // Close the menu if the nav or trigger is hidden
     useEffect(function () {
         var resizeObserver = new ResizeObserver(function (entries) {
@@ -26127,8 +26350,27 @@ var NavigationHeaderBurgerMenu = function (_a) {
             }
         };
     }, [isOpen, setIsOpen, triggerRef.current]);
+    var colorScheme = useMemo(function () {
+        var colorConfig = {
+            light: {
+                surface: "light-white",
+                menuColorType: "light",
+            },
+            dark: {
+                surface: "dark-black",
+                menuColorType: "dark",
+            },
+        };
+        switch (background) {
+            case "transparentOnDark":
+            case "ghostedOnDark":
+                return pathway === "invert" ? colorConfig.light : colorConfig.dark;
+            default:
+                return pathway === "invert" ? colorConfig.dark : colorConfig.light;
+        }
+    }, [pathway, background]);
     return (React__default.createElement(React__default.Fragment, null,
-        React__default.createElement(Tooltip, { asChild: true, delayDuration: 0, title: "Menu", side: "bottom" },
+        React__default.createElement(Tooltip, { delayDuration: DELAY_DURATION, asChild: true, title: "Menu", side: "bottom" },
             React__default.createElement(NavigationHeaderButton, { ref: triggerRef, isPadded: false, "aria-expanded": isOpen, "aria-label": isOpen ? "close menu" : "open menu", onClick: function () { return setIsOpen(!isOpen); } },
                 React__default.createElement("div", { className: "arc-NavigationHeaderBurgerMenu-trigger" },
                     React__default.createElement(ThemeIcon, { icon: "siteHeaderBurger", size: 24 })),
@@ -26137,32 +26379,33 @@ var NavigationHeaderBurgerMenu = function (_a) {
             React__default.createElement(Root$3, { open: isOpen },
                 React__default.createElement(Portal$3, { container: themeElement },
                     React__default.createElement(Overlay, { className: "arc-NavigationHeaderBurgerMenu-overlay" },
-                        React__default.createElement(Content$1, { "aria-describedby": undefined, className: "arc-NavigationHeaderBurgerMenu-slider", onCloseAutoFocus: focusTriggerElement, onEscapeKeyDown: closeMenu, onInteractOutside: closeMenu, "aria-modal": "true" },
-                            React__default.createElement("div", { className: "arc-NavigationHeaderBurgerMenu-container" },
-                                React__default.createElement("div", { className: "arc-NavigationHeaderBurgerMenu-mainContent" },
-                                    React__default.createElement("div", { className: "arc-NavigationHeaderBurgerMenu-header" },
-                                        React__default.createElement(Title, null,
-                                            React__default.createElement(VisuallyHidden$2, null, "Menu")),
-                                        React__default.createElement("div", { className: "arc-NavigationHeaderBurgerMenu-logoContainer" },
-                                            React__default.createElement("div", { className: "arc-NavigationHeaderBurgerMenu-logoWrapper" },
-                                                React__default.createElement(NavigationHeaderLogo, __assign({}, logo, { isSurfaceSensitive: false })))),
-                                        React__default.createElement("div", { className: "arc-NavigationHeaderBurgerMenu-closeButtonContainer" },
-                                            React__default.createElement(Tooltip, { asChild: true, delayDuration: 0, title: "Close menu", side: "left" },
-                                                React__default.createElement(NavigationHeaderCloseButton, { onClick: closeMenu })))),
-                                    header && (React__default.createElement("div", { className: "arc-NavigationHeaderBurgerMenu-topContent" }, header)),
-                                    (navItems || actions) && (React__default.createElement("div", { className: "arc-NavigationHeaderBurgerMenu-navigationContent" },
-                                        navItems && (React__default.createElement("ul", { className: "arc-NavigationHeaderBurgerMenu-list" }, navItems.map(function (navItem, navItemIndex) { return (React__default.createElement(React__default.Fragment, { key: "".concat(id, "-burger-nav-item-").concat(navItemIndex) },
+                        React__default.createElement(Content$1, { "aria-describedby": undefined, className: classNames("arc-NavigationHeaderBurgerMenu-slider", suffixModifier("arc-NavigationHeaderBurgerMenu-slider--on", colorScheme.menuColorType)), onCloseAutoFocus: focusTriggerElement, onEscapeKeyDown: closeMenu, onInteractOutside: closeMenu, "aria-modal": "true" },
+                            React__default.createElement(Surface, { growVertically: true, isTransparent: true, background: colorScheme.surface },
+                                React__default.createElement("div", { className: "arc-NavigationHeaderBurgerMenu-container" },
+                                    React__default.createElement("div", { className: "arc-NavigationHeaderBurgerMenu-mainContent" },
+                                        React__default.createElement("div", { className: "arc-NavigationHeaderBurgerMenu-header" },
+                                            React__default.createElement(Title, null,
+                                                React__default.createElement(VisuallyHidden$2, null, "Navigation menu")),
+                                            React__default.createElement("div", { className: "arc-NavigationHeaderBurgerMenu-closeButtonContainer" },
+                                                React__default.createElement(NavigationHeaderCloseButton, { onClick: closeMenu })),
+                                            React__default.createElement("div", { className: "arc-NavigationHeaderBurgerMenu-logoContainer" },
+                                                React__default.createElement("div", { className: "arc-NavigationHeaderBurgerMenu-logoWrapper" },
+                                                    React__default.createElement(NavigationHeaderLogo, __assign({}, logo))))),
+                                        header && (React__default.createElement("div", { className: classNames("arc-NavigationHeaderBurgerMenu-topContent", {
+                                                "arc-NavigationHeaderBurgerMenu-topContent--bottomSpacing": !navItems,
+                                            }) }, header)),
+                                        navItems && (React__default.createElement("ul", { ref: listRef, className: "arc-NavigationHeaderBurgerMenu-list" }, navItems.map(function (navItem, navItemIndex) { return (React__default.createElement(React__default.Fragment, { key: "".concat(id, "-burger-nav-item-").concat(navItemIndex) },
                                             React__default.createElement("li", { className: "arc-NavigationHeaderBurgerMenu-listItem" },
                                                 React__default.createElement("div", { className: "arc-NavigationHeaderBurgerMenu-listItemContent" },
                                                     (navItem.type === "link" ||
                                                         navItem.type === "meatball") && (React__default.createElement(NavigationHeaderMenuLink, { href: navItem.href, onClick: navItem.onClick, text: navItem.text })),
                                                     (navItem.type === "subnav" ||
                                                         navItem.type === "dropdown") && (React__default.createElement(NavigationHeaderDisclosure, { heading: navItem.text }, navItem.items.map(function (subNavItem, subNavItemIndex) { return (React__default.createElement(NavigationHeaderMenuLink, { size: "s", key: "".concat(id, "-").concat(navItemIndex, "-burger-sub-nav-item-").concat(subNavItemIndex), href: subNavItem.href, onClick: subNavItem.onClick, text: subNavItem.text })); }))))))); }))),
-                                        actions && (React__default.createElement("div", { className: classNames("arc-NavigationHeaderBurgerMenu-actionsContainer", {
-                                                "arc-NavigationHeaderBurgerMenu-actionsContainer--seperator": navItems && actions,
-                                            }) }, actions.map(function (props, i) { return (React__default.createElement(NavigationHeaderInlineAction, __assign({ key: "".concat(id, "-action-{").concat(i, "}") }, props))); })))))),
-                                footer && (React__default.createElement("div", { className: "arc-NavigationHeaderBurgerMenu-footer" },
-                                    React__default.createElement(Surface, { isTransparent: true, background: "dark-black" }, footer)))))))))));
+                                        actions && (React__default.createElement("div", { className: "arc-NavigationHeaderBurgerMenu-actionsContainer" },
+                                            React__default.createElement("div", { className: classNames("arc-NavigationHeaderBurgerMenu-actions", {
+                                                    "arc-NavigationHeaderBurgerMenu-actions--seperator": navItems || header,
+                                                }) }, actions.map(function (props, i) { return (React__default.createElement(NavigationHeaderInlineAction, __assign({ key: "".concat(id, "-action-{").concat(i, "}") }, props))); }))))),
+                                    footer && (React__default.createElement("div", { className: "arc-NavigationHeaderBurgerMenu-footer" }, footer)))))))))));
 };
 
 var NavigationHeaderNavLink = function (_a) {
@@ -26245,12 +26488,12 @@ var NavigationHeaderDropdown = function (_a) {
     };
     var toggleVisibility = function () { return setIsOpen(function (isOpen) { return !isOpen; }); };
     return (React__default.createElement(Popover, { useBespokeTrigger: true, align: "center", background: "light", arrow: true, sideOffset: 12, alignOffset: 0, open: isOpen, onCloseAutoFocus: onCloseAutoFocus, onOpenAutoFocus: focusOnFirstElement, onEscapeKeyDown: handleOutSideInteraction, onFocusOutside: handleOutSideInteraction, onInteractOutside: handleOutSideInteraction, onPointerDownOutside: handleOutSideInteraction, content: React__default.createElement("div", { ref: containerRef },
-            React__default.createElement("ul", { className: "arc-NavigationHeaderDropdown-navList" }, children)) }, tooltip ? (React__default.createElement(Tooltip, { asChild: true, title: tooltip, open: isTooltipOpen, delayDuration: 0, alignContent: "center", side: "bottom" },
+            React__default.createElement("ul", { className: "arc-NavigationHeaderDropdown-navList" }, children)) }, tooltip ? (React__default.createElement(Tooltip, { asChild: true, title: tooltip, open: isTooltipOpen, alignContent: "center", side: "bottom" },
         React__default.createElement(NavigationHeaderButton, { ref: triggerRef, "aria-label": ariaLabel, "aria-expanded": isOpen, "aria-haspopup": "dialog", "aria-describedby": undefined, isActive: isOpen, onClick: toggleVisibility, onMouseEnter: function () { return setIsTooltipOpen(!isOpen); }, onMouseLeave: function () { return setIsTooltipOpen(false); }, onFocus: function () { return setIsTooltipOpen(true); }, onBlur: function () { return setIsTooltipOpen(false); } }, trigger))) : (React__default.createElement(NavigationHeaderButton, { ref: triggerRef, "aria-label": ariaLabel, "aria-expanded": isOpen, "aria-haspopup": "dialog", isActive: isOpen, onClick: toggleVisibility }, trigger))));
 };
 
 var NavigationHeaderContainer = function (_a) {
-    var _b = _a.isPill, isPill = _b === void 0 ? false : _b, _c = _a.isExtended, isExtended = _c === void 0 ? false : _c, _d = _a.isFluid, isFluid = _d === void 0 ? false : _d, _e = _a.background, background = _e === void 0 ? "transparentOnLight" : _e, children = _a.children;
+    var _b = _a.isPill, isPill = _b === void 0 ? false : _b, _c = _a.isExtended, isExtended = _c === void 0 ? false : _c, _d = _a.isFluid, isFluid = _d === void 0 ? false : _d, background = _a.background, children = _a.children;
     var backgrounds = {
         light: {
             surface: "light-white",
@@ -27261,9 +27504,9 @@ var defaultHeaderVisibility = {
 };
 
 var NavigationHeader = function (_a) {
-    var leftSlot = _a.leftSlot, middleSlot = _a.middleSlot, rightSlot = _a.rightSlot, isPill = _a.isPill, isExtended = _a.isExtended, isFluid = _a.isFluid, logo = _a.logo, navItems = _a.navItems, background = _a.background, meatballMenuTooltip = _a.meatballMenuTooltip, burgerMenuActions = _a.burgerMenuActions, burgerMenuFooter = _a.burgerMenuFooter, burgerMenuHeader = _a.burgerMenuHeader, burgerMenuVisibility = _a.burgerMenuVisibility, navMenuVisibility = _a.navMenuVisibility;
+    var leftSlot = _a.leftSlot, middleSlot = _a.middleSlot, rightSlot = _a.rightSlot, isPill = _a.isPill, isExtended = _a.isExtended, isFluid = _a.isFluid, logo = _a.logo, navItems = _a.navItems, meatballMenuTooltip = _a.meatballMenuTooltip, burgerMenuActions = _a.burgerMenuActions, burgerMenuFooter = _a.burgerMenuFooter, burgerMenuHeader = _a.burgerMenuHeader, burgerMenuVisibility = _a.burgerMenuVisibility, onOpenChange = _a.onOpenChange, burgerMenuPathway = _a.burgerMenuPathway, navMenuVisibility = _a.navMenuVisibility, _b = _a.background, background = _b === void 0 ? "transparentOnLight" : _b;
     var navBarPortalRef = useRef(null);
-    var _b = useState(false), isSubMenuItemActive = _b[0], setIsSubMenuItemActive = _b[1];
+    var _c = useState(false), isSubMenuItemActive = _c[0], setIsSubMenuItemActive = _c[1];
     var navBarBackground = isSubMenuItemActive ? "lightElevated" : background;
     var burgerMenuVisibilityProps = __assign(__assign({}, defaultHeaderVisibility.burgerMenu), burgerMenuVisibility);
     var navMenuVisibilityProps = __assign(__assign({}, defaultHeaderVisibility.navItems), navMenuVisibility);
@@ -27286,7 +27529,7 @@ var NavigationHeader = function (_a) {
                 rightSlot && (React__default.createElement("div", { className: "arc-NavigationHeader-rightSlot" }, rightSlot)),
                 React__default.createElement(Visible, __assign({}, burgerMenuVisibilityProps),
                     React__default.createElement("div", { className: "arc-NavigationHeader-burgerMenuSlot" },
-                        React__default.createElement(NavigationHeaderBurgerMenu, { logo: logo, navItems: navItems, actions: burgerMenuActions, header: burgerMenuHeader, footer: burgerMenuFooter })))))));
+                        React__default.createElement(NavigationHeaderBurgerMenu, { logo: logo, background: background, pathway: burgerMenuPathway, navItems: navItems, actions: burgerMenuActions, header: burgerMenuHeader, footer: burgerMenuFooter, onOpenChange: onOpenChange })))))));
 };
 
 var NavigationHeaderAction = function (_a) {
@@ -27294,7 +27537,7 @@ var NavigationHeaderAction = function (_a) {
     return (React__default.createElement("div", { className: classNames("arc-NavigationHeaderAction", {
             "arc-NavigationHeaderAction--attention": isAttention,
         }) },
-        React__default.createElement(Tooltip, { asChild: true, delayDuration: 0, title: title, alignContent: "center", supportingCopy: supportingCopy, side: "bottom" },
+        React__default.createElement(Tooltip, { asChild: true, title: title, alignContent: "center", supportingCopy: supportingCopy, delayDuration: DELAY_DURATION, side: "bottom" },
             React__default.createElement(NavigationHeaderButton, { isPadded: false, onClick: onClick },
                 React__default.createElement("div", { className: "arc-NavigationHeaderAction-content" },
                     React__default.createElement(Icon$1, { "aria-hidden": true, icon: icon, size: 24 }),
@@ -27476,5 +27719,5 @@ var Preview$1 = /*#__PURE__*/_mergeNamespaces({
     default: Preview
 }, [PreviewExports]);
 
-export { Alert, Align, AppButton, Avatar, AvatarGroup, Badge, Banner, Box, BrandLogo, colors as BrandLogoColors, Breadcrumbs, BreadcrumbsItem, BreadcrumbsLink, Button, ButtonGroup, ButtonV2, Calendar, Carousel, Checkbox, Columns, ColumnsCol, ComboBox, ContentSwitcher, ContentSwitcherContent, ContentSwitcherDropdown, ContentSwitcherDropdownContent, ContentSwitcherList, ContentSwitcherTab, DATE_FORMAT, DatePicker, DatePickerRange, Disclosure, DisclosureMini, Download, Drawer, DrawerContent, DrawerFooter, DrawerHeader, Elevation, Filter, FilterControl, FilterControls, FilterItem, FilterItems, FormControl, Context$2 as FormControlContext, GhostedHeroBanner, GradientPageBackground, Grid, GridCol, GridRow, Group$1 as Group, GroupItem, Heading, HeroBanner, HeroButton, Hidden, HorizontalCard, Icon$1 as Icon, colors$1 as IconColors, Image, fitOptions as ImageFitOptions, overlayOptions as ImageOverlayOptions, ImageSource, ImpactCard, InformationCard, Link, Markup, MediaCard, Menu, MenuContent, MenuFooter, MenuGroup, MenuGroupSingleSelect, MenuHeader, MenuItem, MenuItemCheckbox, MenuItemContentTemplate, MenuItemMultiLevel, MenuItemMultiLevelContent, MenuItemMultiLevelTrigger, MenuItemSingleSelect, MenuLabel, MenuPortal, MenuScrollable, MenuSeparator, MenuTrigger, Modal, NavigationHeader, NavigationHeaderAction, NavigationHeaderActionBar, NavigationHeaderPage, Pagination, PaginationSimple, Popover, Poster, PosterImage, PosterVideo, ProgressBar, ProgressStepper, ProgressStepperItem, ProgressStepperOverflow, RadioCardGroup, RadioCardGroupInput, RadioGroup, RadioGroupButton, RadioGroupInput, Rule, ScrollToTop, Section, Select, SiteFooter, SiteFooterItem, SiteFooterItemGroup, SiteFooterV2, SiteFooterV2Item, SiteFooterV2ItemGroup, SiteFooterV2Main, SiteFooterV2Utility, SiteHeaderV2, SiteHeaderV2Column, SiteHeaderV2Item, SiteHeaderV2ItemGroup, SiteHeaderV2NavItem, SiteHeaderV2NavItemWithSubNav, SiteHeaderV2NodeItem, SiteHeaderV2SubNavItem, SiteHeaderV2VerticalDivider, Skeleton, SkipLink, SkipLinkItem, Spinner, Surface, Context$3 as SurfaceContext, Switch, TabbedBanner, Tabs, TabsContent, TabsItem, TabsList, Tag, TemplateBanner, Text, TextArea, TextInput, Theme, ThemeIcon, ThumbnailSignpost, Toast, ToastNotification, Tooltip, Truncate, TypographyCard, UniversalHeader, UniversalHeaderItem, VerticalSpace, VideoPlayer, Visible, VisuallyHidden$2 as VisuallyHidden, backgrounds, backgroundsBT, isDateValid, isRangeValid, loadingOptions, parseDateString, parseRangeString, themes, useMediaQuery };
+export { Alert, Align, AppButton, Avatar, AvatarGroup, Badge, Banner, Box, BrandLogo, colors as BrandLogoColors, Breadcrumbs, BreadcrumbsItem, BreadcrumbsLink, Button, ButtonGroup, ButtonV2, Calendar, Carousel, Checkbox, CheckboxIcon, Columns, ColumnsCol, ComboBox, ContentSwitcher, ContentSwitcherContent, ContentSwitcherDropdown, ContentSwitcherDropdownContent, ContentSwitcherList, ContentSwitcherTab, DATE_FORMAT, DatePicker, DatePickerRange, Disclosure, DisclosureMini, Download, Drawer, DrawerContent, DrawerFooter, DrawerHeader, Elevation, Filter, FilterControl, FilterControls, FilterItem, FilterItems, FormControl, Context$2 as FormControlContext, GhostedHeroBanner, GradientPageBackground, Grid, GridCol, GridRow, Group$1 as Group, GroupItem, Heading, HeroBanner, HeroButton, Hidden, HorizontalCard, Icon$1 as Icon, colors$1 as IconColors, Image, fitOptions as ImageFitOptions, overlayOptions as ImageOverlayOptions, ImageSource, ImpactCard, InformationCard, Link, Markup, MediaCard, Menu, MenuContent, MenuFooter, MenuGroup, MenuGroupSingleSelect, MenuHeader, MenuItem, MenuItemCheckbox, MenuItemContentTemplate, MenuItemMultiLevel, MenuItemMultiLevelContent, MenuItemMultiLevelTrigger, MenuItemSingleSelect, MenuLabel, MenuPortal, MenuScrollable, MenuSeparator, MenuTrigger, Modal, NavigationHeader, NavigationHeaderAction, NavigationHeaderActionBar, NavigationHeaderPage, Pagination, PaginationSimple, Popover, Poster, PosterImage, PosterVideo, ProgressBar, ProgressStepper, ProgressStepperItem, ProgressStepperOverflow, RadioCardGroup, RadioCardGroupInput, RadioGroup, RadioGroupButton, RadioGroupInput, Rule, ScrollToTop, Section, Select, SemanticHeading, SiteFooter, SiteFooterItem, SiteFooterItemGroup, SiteFooterV2, SiteFooterV2Item, SiteFooterV2ItemGroup, SiteFooterV2Main, SiteFooterV2Utility, SiteHeaderV2, SiteHeaderV2Column, SiteHeaderV2Item, SiteHeaderV2ItemGroup, SiteHeaderV2NavItem, SiteHeaderV2NavItemWithSubNav, SiteHeaderV2NodeItem, SiteHeaderV2SubNavItem, SiteHeaderV2VerticalDivider, Skeleton, SkipLink, SkipLinkItem, Spinner, Surface, Context$3 as SurfaceContext, Switch, TabbedBanner, Tabs, TabsContent, TabsItem, TabsList, Tag, TemplateBanner, Text, TextArea, TextInput, Theme, ThemeIcon, ThumbnailSignpost, Toast, ToastNotification, Tooltip, Truncate, TypographyCard, UniversalHeader, UniversalHeaderItem, VerticalSpace, VideoPlayer, Visible, VisuallyHidden$2 as VisuallyHidden, backgrounds, backgroundsBT, isDateValid, isRangeValid, loadingOptions, parseDateString, parseRangeString, themes, useMediaQuery };
 //# sourceMappingURL=index.mjs.map