@salesmind-ai/design-system 0.1.12 → 0.2.1

package/dist/index.js

@@ -1,5 +1,5 @@
-import React30, { forwardRef, useId, createContext, useContext, useState, useEffect, useRef, useCallback, useMemo } from 'react';
-import clsx44 from 'clsx';
+import React30, { forwardRef, useId, createContext, useContext, useState, useRef, useCallback, useEffect, useMemo } from 'react';
+import clsx21 from 'clsx';
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 import { Slot } from '@radix-ui/react-slot';
 import { Input } from '@base-ui/react/input';
@@ -8,7 +8,7 @@ import { Switch as Switch$1 } from '@base-ui/react/switch';
 import { Dialog as Dialog$1 } from '@base-ui/react/dialog';
 import { Tooltip as Tooltip$1 } from '@base-ui/react/tooltip';
 import ReactDOM, { createPortal } from 'react-dom';
-import { AnimatePresence, motion, useInView, useReducedMotion } from 'framer-motion';
+import { motion, useInView, useReducedMotion } from 'framer-motion';
 import { Tabs as Tabs$1 } from '@base-ui/react/tabs';
 import { ArrowRight, X, Check, FileText, Clock, Sun, Moon } from 'lucide-react';
 import { defineMessages, useIntl, IntlProvider } from 'react-intl';
@@ -20,7 +20,7 @@ import { Select as Select$1 } from '@base-ui/react/select';
 // src/components/VoidBackground/VoidBackground.tsx
 var VoidBackground = React30.forwardRef(
   ({ showGrid = true, showGrain = true, className, children }, ref) => {
-    return /* @__PURE__ */ jsxs("div", { ref, className: clsx44("void", className), children: [
+    return /* @__PURE__ */ jsxs("div", { ref, className: clsx21("void", className), children: [
       /* @__PURE__ */ jsx("div", { className: "void__base", "aria-hidden": "true" }),
       /* @__PURE__ */ jsxs("div", { className: "void__orbs", "aria-hidden": "true", children: [
         /* @__PURE__ */ jsx("div", { className: "void__orb void__orb--warm" }),
@@ -34,28 +34,28 @@ var VoidBackground = React30.forwardRef(
 );
 VoidBackground.displayName = "VoidBackground";
 var Card = React30.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: clsx44("ds-card", className), ...props })
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: clsx21("ds-card", className), ...props })
 );
 Card.displayName = "Card";
 var CardHeader = React30.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: clsx44("ds-card__header", className), ...props })
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: clsx21("ds-card__header", className), ...props })
 );
 CardHeader.displayName = "CardHeader";
-var CardTitle = React30.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("h3", { ref, className: clsx44("ds-card__title", className), ...props }));
+var CardTitle = React30.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("h3", { ref, className: clsx21("ds-card__title", className), ...props }));
 CardTitle.displayName = "CardTitle";
-var CardDescription = React30.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("p", { ref, className: clsx44("ds-card__description", className), ...props }));
+var CardDescription = React30.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("p", { ref, className: clsx21("ds-card__description", className), ...props }));
 CardDescription.displayName = "CardDescription";
 var CardContent = React30.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: clsx44("ds-card__content", className), ...props })
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: clsx21("ds-card__content", className), ...props })
 );
 CardContent.displayName = "CardContent";
 var CardFooter = React30.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: clsx44("ds-card__footer", className), ...props })
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: clsx21("ds-card__footer", className), ...props })
 );
 CardFooter.displayName = "CardFooter";
 var Button = React30.forwardRef(
   ({ className, variant = "primary", size = "md", asChild = false, isLoading = false, children, disabled, ...props }, ref) => {
-    const buttonClass = clsx44(
+    const buttonClass = clsx21(
       "ds-button",
       `ds-button--${variant}`,
       size === "icon" ? "ds-button--icon ds-button--md" : `ds-button--${size}`,
@@ -98,7 +98,7 @@ var Button = React30.forwardRef(
               children: /* @__PURE__ */ jsx("path", { d: "M21 12a9 9 0 1 1-6.219-8.56" })
             }
           ),
-          /* @__PURE__ */ jsx("span", { className: clsx44("ds-button__content", isLoading && "ds-button__content--hidden"), children })
+          /* @__PURE__ */ jsx("span", { className: clsx21("ds-button__content", isLoading && "ds-button__content--hidden"), children })
         ]
       }
     );
@@ -112,7 +112,7 @@ var ButtonGroup = React30.forwardRef(
       {
         ref,
         role: "group",
-        className: clsx44(
+        className: clsx21(
           "ds-button-group",
           `ds-button-group--${orientation}`,
           fullWidth && "ds-button-group--full-width",
@@ -130,7 +130,7 @@ var TextField = React30.forwardRef(
   ({ className, label, error, helperText, endAdornment, id, ...props }, ref) => {
     const generatedId = React30.useId();
     const inputId = id || generatedId;
-    return /* @__PURE__ */ jsxs("div", { className: clsx44("ds-textfield", className), children: [
+    return /* @__PURE__ */ jsxs("div", { className: clsx21("ds-textfield", className), children: [
       label && /* @__PURE__ */ jsx("label", { htmlFor: inputId, className: "ds-textfield__label", children: label }),
       /* @__PURE__ */ jsxs("div", { className: "ds-textfield__input-wrapper", children: [
         /* @__PURE__ */ jsx(
@@ -138,7 +138,7 @@ var TextField = React30.forwardRef(
           {
             id: inputId,
             ref,
-            className: clsx44(
+            className: clsx21(
               "ds-textfield__input",
               error && "ds-textfield__input--error",
               endAdornment && "ds-textfield__input--adorned"
@@ -148,7 +148,7 @@ var TextField = React30.forwardRef(
         ),
         endAdornment && /* @__PURE__ */ jsx("div", { className: "ds-textfield__adornment", children: endAdornment })
       ] }),
-      helperText && /* @__PURE__ */ jsx("span", { className: clsx44("ds-textfield__helper", error && "ds-textfield__helper--error"), children: helperText })
+      helperText && /* @__PURE__ */ jsx("span", { className: clsx21("ds-textfield__helper", error && "ds-textfield__helper--error"), children: helperText })
     ] });
   }
 );
@@ -157,18 +157,18 @@ var TextArea = forwardRef(
   ({ className, label, error, helperText, id, ...props }, ref) => {
     const generatedId = useId();
     const inputId = id || generatedId;
-    return /* @__PURE__ */ jsxs("div", { className: clsx44("ds-textarea", className), children: [
+    return /* @__PURE__ */ jsxs("div", { className: clsx21("ds-textarea", className), children: [
       label && /* @__PURE__ */ jsx("label", { htmlFor: inputId, className: "ds-textarea__label", children: label }),
       /* @__PURE__ */ jsx("div", { className: "ds-textarea__input-wrapper", children: /* @__PURE__ */ jsx(
         "textarea",
         {
           id: inputId,
           ref,
-          className: clsx44("ds-textarea__input", error && "ds-textarea__input--error"),
+          className: clsx21("ds-textarea__input", error && "ds-textarea__input--error"),
           ...props
         }
       ) }),
-      helperText && /* @__PURE__ */ jsx("span", { className: clsx44("ds-textarea__helper", error && "ds-textarea__helper--error"), children: helperText })
+      helperText && /* @__PURE__ */ jsx("span", { className: clsx21("ds-textarea__helper", error && "ds-textarea__helper--error"), children: helperText })
     ] });
   }
 );
@@ -177,7 +177,7 @@ var Checkbox = React30.forwardRef(
   ({ className, label, id, ...props }, ref) => {
     const generatedId = React30.useId();
     const checkboxId = id || generatedId;
-    return /* @__PURE__ */ jsxs("div", { className: clsx44("ds-checkbox-wrapper", className), children: [
+    return /* @__PURE__ */ jsxs("div", { className: clsx21("ds-checkbox-wrapper", className), children: [
       /* @__PURE__ */ jsx(Checkbox$1.Root, { id: checkboxId, ref, className: "ds-checkbox", ...props, children: /* @__PURE__ */ jsx(Checkbox$1.Indicator, { className: "ds-checkbox__indicator", children: /* @__PURE__ */ jsx(
         "svg",
         {
@@ -220,7 +220,7 @@ var RadioGroup = forwardRef(
       {
         ref,
         role: "radiogroup",
-        className: clsx44(
+        className: clsx21(
           "ds-radio-group",
           orientation === "horizontal" && "ds-radio-group--horizontal",
           className
@@ -246,7 +246,7 @@ var Radio = forwardRef(
     return /* @__PURE__ */ jsxs(
       "label",
       {
-        className: clsx44("ds-radio-wrapper", disabled && "ds-radio-wrapper--disabled", className),
+        className: clsx21("ds-radio-wrapper", disabled && "ds-radio-wrapper--disabled", className),
         children: [
           /* @__PURE__ */ jsx(
             "input",
@@ -263,7 +263,7 @@ var Radio = forwardRef(
               ...props
             }
           ),
-          /* @__PURE__ */ jsx("div", { className: clsx44("ds-radio", isChecked && "ds-radio--checked"), children: /* @__PURE__ */ jsx("div", { className: "ds-radio__indicator" }) }),
+          /* @__PURE__ */ jsx("div", { className: clsx21("ds-radio", isChecked && "ds-radio--checked"), children: /* @__PURE__ */ jsx("div", { className: "ds-radio__indicator" }) }),
           label && /* @__PURE__ */ jsx("span", { className: "ds-radio__label", children: label })
         ]
       }
@@ -275,7 +275,7 @@ var Switch = React30.forwardRef(
   ({ className, label, id, ...props }, ref) => {
     const generatedId = React30.useId();
     const switchId = id || generatedId;
-    return /* @__PURE__ */ jsxs("div", { className: clsx44("ds-switch-wrapper", className), children: [
+    return /* @__PURE__ */ jsxs("div", { className: clsx21("ds-switch-wrapper", className), children: [
       /* @__PURE__ */ jsx(Switch$1.Root, { id: switchId, ref, className: "ds-switch", ...props, children: /* @__PURE__ */ jsx(Switch$1.Thumb, { className: "ds-switch__thumb" }) }),
       label && /* @__PURE__ */ jsx("label", { htmlFor: switchId, className: "ds-switch__label", children: label })
     ] });
@@ -285,13 +285,13 @@ Switch.displayName = "Switch";
 var Dialog = Dialog$1.Root;
 var DialogTrigger = Dialog$1.Trigger;
 var DialogClose = Dialog$1.Close;
-var DialogTitle = React30.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(Dialog$1.Title, { ref, className: clsx44("ds-dialog__title", className), ...props }));
+var DialogTitle = React30.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(Dialog$1.Title, { ref, className: clsx21("ds-dialog__title", className), ...props }));
 DialogTitle.displayName = "DialogTitle";
 var DialogDescription = React30.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   Dialog$1.Description,
   {
     ref,
-    className: clsx44("ds-dialog__description", className),
+    className: clsx21("ds-dialog__description", className),
     ...props
   }
 ));
@@ -299,22 +299,22 @@ DialogDescription.displayName = "DialogDescription";
 var DialogContent = React30.forwardRef(
   ({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(Dialog$1.Portal, { children: [
     /* @__PURE__ */ jsx(Dialog$1.Backdrop, { className: "ds-dialog__backdrop" }),
-    /* @__PURE__ */ jsx(Dialog$1.Popup, { ref, className: clsx44("ds-dialog__content", className), ...props, children })
+    /* @__PURE__ */ jsx(Dialog$1.Popup, { ref, className: clsx21("ds-dialog__content", className), ...props, children })
   ] })
 );
 DialogContent.displayName = "DialogContent";
 var DialogHeader = React30.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: clsx44("ds-dialog__header", className), ...props })
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: clsx21("ds-dialog__header", className), ...props })
 );
 DialogHeader.displayName = "DialogHeader";
 var DialogFooter = React30.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: clsx44("ds-dialog__footer", className), ...props })
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: clsx21("ds-dialog__footer", className), ...props })
 );
 DialogFooter.displayName = "DialogFooter";
 var TooltipProvider = Tooltip$1.Provider;
 var TooltipRoot = Tooltip$1.Root;
 var TooltipTrigger = Tooltip$1.Trigger;
-var TooltipContent = React30.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsx(Tooltip$1.Portal, { children: /* @__PURE__ */ jsx(Tooltip$1.Positioner, { sideOffset: 5, children: /* @__PURE__ */ jsxs(Tooltip$1.Popup, { ref, className: clsx44("ds-tooltip__content", className), ...props, children: [
+var TooltipContent = React30.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsx(Tooltip$1.Portal, { children: /* @__PURE__ */ jsx(Tooltip$1.Positioner, { sideOffset: 5, children: /* @__PURE__ */ jsxs(Tooltip$1.Popup, { ref, className: clsx21("ds-tooltip__content", className), ...props, children: [
   children,
   /* @__PURE__ */ jsx(Tooltip$1.Arrow, { className: "ds-tooltip__arrow" })
 ] }) }) }));
@@ -367,7 +367,7 @@ var Accordion = React30.forwardRef(
       () => ({ openItems, toggle }),
       [openItems, toggle]
     );
-    return /* @__PURE__ */ jsx(AccordionContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx("div", { ref, className: clsx44("ds-accordion", className), ...props, children }) });
+    return /* @__PURE__ */ jsx(AccordionContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx("div", { ref, className: clsx21("ds-accordion", className), ...props, children }) });
   }
 );
 Accordion.displayName = "Accordion";
@@ -383,7 +383,7 @@ var AccordionItem = React30.forwardRef(
       "div",
       {
         ref,
-        className: clsx44("ds-accordion__item", className),
+        className: clsx21("ds-accordion__item", className),
         "data-state": isOpen ? "open" : "closed",
         ...props,
         children
@@ -400,7 +400,7 @@ var AccordionTrigger = React30.forwardRef(({ className, children, ...props }, re
     {
       ref,
       type: "button",
-      className: clsx44("ds-accordion__trigger", className),
+      className: clsx21("ds-accordion__trigger", className),
       "aria-expanded": isOpen,
       onClick: () => toggle(value),
       ...props,
@@ -455,7 +455,7 @@ var AccordionContent = React30.forwardRef(({ className, children, ...props }, re
     "div",
     {
       ref: contentRef,
-      className: clsx44("ds-accordion__content", className),
+      className: clsx21("ds-accordion__content", className),
       style: {
         height: height !== void 0 ? `${height}px` : "auto"
       },
@@ -472,7 +472,7 @@ var Label = React30.forwardRef(
       "label",
       {
         ref,
-        className: clsx44("ds-label", disabled && "ds-label--disabled", className),
+        className: clsx21("ds-label", disabled && "ds-label--disabled", className),
         "data-disabled": disabled || void 0,
         ...props
       }
@@ -486,7 +486,7 @@ var Skeleton = React30.forwardRef(
       "div",
       {
         ref,
-        className: clsx44("ds-skeleton", className),
+        className: clsx21("ds-skeleton", className),
         ...props
       }
     );
@@ -501,7 +501,7 @@ var Separator = React30.forwardRef(
         ref,
         role: "separator",
         "aria-orientation": orientation,
-        className: clsx44(
+        className: clsx21(
           "ds-separator",
           `ds-separator--${orientation}`,
           className
@@ -579,7 +579,7 @@ var SheetContent = React30.forwardRef(
           {
             ref,
             role: "dialog",
-            className: clsx44("ds-sheet__content", `ds-sheet__content--${side}`, className),
+            className: clsx21("ds-sheet__content", `ds-sheet__content--${side}`, className),
             ...props,
             children
           }
@@ -591,15 +591,15 @@ var SheetContent = React30.forwardRef(
 );
 SheetContent.displayName = "SheetContent";
 var SheetHeader = React30.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: clsx44("ds-sheet__header", className), ...props })
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: clsx21("ds-sheet__header", className), ...props })
 );
 SheetHeader.displayName = "SheetHeader";
-var SheetTitle = React30.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("h2", { ref, className: clsx44("ds-sheet__title", className), ...props }));
+var SheetTitle = React30.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("h2", { ref, className: clsx21("ds-sheet__title", className), ...props }));
 SheetTitle.displayName = "SheetTitle";
-var SheetDescription = React30.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("p", { ref, className: clsx44("ds-sheet__description", className), ...props }));
+var SheetDescription = React30.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("p", { ref, className: clsx21("ds-sheet__description", className), ...props }));
 SheetDescription.displayName = "SheetDescription";
 var SheetFooter = React30.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: clsx44("ds-sheet__footer", className), ...props })
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: clsx21("ds-sheet__footer", className), ...props })
 );
 SheetFooter.displayName = "SheetFooter";
 var AvatarContext = React30.createContext({
@@ -628,7 +628,7 @@ var Avatar = React30.forwardRef(
       "span",
       {
         ref,
-        className: clsx44("ds-avatar", `ds-avatar--${size}`, className),
+        className: clsx21("ds-avatar", `ds-avatar--${size}`, className),
         ...props,
         children
       }
@@ -647,7 +647,7 @@ var AvatarImage = React30.forwardRef(({ className, onError, ...props }, ref) =>
     "img",
     {
       ref,
-      className: clsx44("ds-avatar__image", className),
+      className: clsx21("ds-avatar__image", className),
       onError: handleError,
       ...props
     }
@@ -657,7 +657,7 @@ AvatarImage.displayName = "AvatarImage";
 var AvatarFallback = React30.forwardRef(({ className, ...props }, ref) => {
   const { hasImage, imageError } = React30.useContext(AvatarContext);
   if (hasImage && !imageError) return null;
-  return /* @__PURE__ */ jsx("span", { ref, className: clsx44("ds-avatar__fallback", className), ...props });
+  return /* @__PURE__ */ jsx("span", { ref, className: clsx21("ds-avatar__fallback", className), ...props });
 });
 AvatarFallback.displayName = "AvatarFallback";
 var PopoverContext = React30.createContext(null);
@@ -704,7 +704,7 @@ var PopoverTrigger = React30.forwardRef(
       {
         ref,
         type: "button",
-        className: clsx44("ds-popover__trigger", className),
+        className: clsx21("ds-popover__trigger", className),
         onClick: handleClick,
         ...props
       }
@@ -720,7 +720,7 @@ var PopoverContent = React30.forwardRef(
       "div",
       {
         ref,
-        className: clsx44(
+        className: clsx21(
           "ds-popover__content",
           `ds-popover__content--${side}`,
           `ds-popover__content--align-${align}`,
@@ -743,7 +743,7 @@ var PopoverClose = React30.forwardRef(({ className, onClick, ...props }, ref) =>
     {
       ref,
       type: "button",
-      className: clsx44("ds-popover__close", className),
+      className: clsx21("ds-popover__close", className),
       onClick: handleClick,
       ...props
     }
@@ -761,7 +761,7 @@ var Progress = React30.forwardRef(
         "aria-valuenow": value,
         "aria-valuemin": 0,
         "aria-valuemax": max,
-        className: clsx44("ds-progress", className),
+        className: clsx21("ds-progress", className),
         ...props,
         children: /* @__PURE__ */ jsx(
           "div",
@@ -777,7 +777,7 @@ var Progress = React30.forwardRef(
 Progress.displayName = "Progress";
 var ScrollArea = React30.forwardRef(
   ({ className, children, ...props }, ref) => {
-    return /* @__PURE__ */ jsx("div", { ref, className: clsx44("ds-scroll-area", className), ...props, children: /* @__PURE__ */ jsx("div", { className: "ds-scroll-area__viewport", children }) });
+    return /* @__PURE__ */ jsx("div", { ref, className: clsx21("ds-scroll-area", className), ...props, children: /* @__PURE__ */ jsx("div", { className: "ds-scroll-area__viewport", children }) });
   }
 );
 ScrollArea.displayName = "ScrollArea";
@@ -787,7 +787,7 @@ var ScrollBar = React30.forwardRef(
       "div",
       {
         ref,
-        className: clsx44(
+        className: clsx21(
           "ds-scroll-area__scrollbar",
           `ds-scroll-area__scrollbar--${orientation}`,
           className
@@ -805,7 +805,7 @@ var Breadcrumb = React30.forwardRef(
       {
         ref,
         "aria-label": ariaLabel,
-        className: clsx44("ds-breadcrumb", className),
+        className: clsx21("ds-breadcrumb", className),
         ...props
       }
     );
@@ -817,7 +817,7 @@ var BreadcrumbList = React30.forwardRef(({ className, ...props }, ref) => {
     "ol",
     {
       ref,
-      className: clsx44("ds-breadcrumb__list", className),
+      className: clsx21("ds-breadcrumb__list", className),
       ...props
     }
   );
@@ -828,7 +828,7 @@ var BreadcrumbItem = React30.forwardRef(({ className, ...props }, ref) => {
     "li",
     {
       ref,
-      className: clsx44("ds-breadcrumb__item", className),
+      className: clsx21("ds-breadcrumb__item", className),
       ...props
     }
   );
@@ -840,7 +840,7 @@ var BreadcrumbLink = React30.forwardRef(({ className, asChild = false, ...props
     Comp,
     {
       ref,
-      className: clsx44("ds-breadcrumb__link", className),
+      className: clsx21("ds-breadcrumb__link", className),
       ...props
     }
   );
@@ -854,7 +854,7 @@ var BreadcrumbPage = React30.forwardRef(({ className, ...props }, ref) => {
       role: "link",
       "aria-current": "page",
       "aria-disabled": "true",
-      className: clsx44("ds-breadcrumb__page", className),
+      className: clsx21("ds-breadcrumb__page", className),
       ...props
     }
   );
@@ -867,7 +867,7 @@ var BreadcrumbSeparator = React30.forwardRef(({ className, children, ...props },
       ref,
       role: "presentation",
       "aria-hidden": "true",
-      className: clsx44("ds-breadcrumb__separator", className),
+      className: clsx21("ds-breadcrumb__separator", className),
       ...props,
       children: children ?? "/"
     }
@@ -879,7 +879,7 @@ var BreadcrumbEllipsis = React30.forwardRef(({ className, ...props }, ref) => {
     "span",
     {
       ref,
-      className: clsx44("ds-breadcrumb__ellipsis", className),
+      className: clsx21("ds-breadcrumb__ellipsis", className),
       ...props,
       children: "\u2026"
     }
@@ -912,7 +912,7 @@ var Toggle = React30.forwardRef(
       {
         ref,
         type: "button",
-        className: clsx44(
+        className: clsx21(
           "ds-toggle",
           `ds-toggle--${variant}`,
           `ds-toggle--${size}`,
@@ -960,7 +960,7 @@ var ToggleGroup = React30.forwardRef(
       {
         ref,
         role: "group",
-        className: clsx44("ds-toggle-group", className),
+        className: clsx21("ds-toggle-group", className),
         ...props,
         children
       }
@@ -981,7 +981,7 @@ var ToggleGroupItem = React30.forwardRef(({ className, value, children, onClick,
       ref,
       type: "button",
       "aria-pressed": pressed,
-      className: clsx44(
+      className: clsx21(
         "ds-toggle-group__item",
         pressed && "ds-toggle-group__item--pressed",
         className
@@ -1020,7 +1020,7 @@ var Slider = React30.forwardRef(
       "div",
       {
         ref,
-        className: clsx44("ds-slider", disabled && "ds-slider--disabled", className),
+        className: clsx21("ds-slider", disabled && "ds-slider--disabled", className),
         ...props,
         children: [
           /* @__PURE__ */ jsx("div", { className: "ds-slider__track", children: /* @__PURE__ */ jsx(
@@ -1081,7 +1081,7 @@ var Collapsible = React30.forwardRef(
       "div",
       {
         ref,
-        className: clsx44("ds-collapsible", className),
+        className: clsx21("ds-collapsible", className),
         "data-state": open ? "open" : "closed",
         ...props,
         children
@@ -1101,7 +1101,7 @@ var CollapsibleTrigger = React30.forwardRef(({ className, onClick, ...props }, r
     {
       ref,
       type: "button",
-      className: clsx44("ds-collapsible__trigger", className),
+      className: clsx21("ds-collapsible__trigger", className),
       onClick: handleClick,
       ...props
     }
@@ -1136,7 +1136,7 @@ var CollapsibleContent = React30.forwardRef(({ className, children, ...props },
     "div",
     {
       ref: contentRef,
-      className: clsx44("ds-collapsible__content", className),
+      className: clsx21("ds-collapsible__content", className),
       "data-state": open ? "open" : "closed",
       style: {
         maxHeight: maxHeight !== void 0 ? `${maxHeight}px` : "none"
@@ -1199,7 +1199,7 @@ var HoverCardTrigger = React30.forwardRef(({ className, onMouseEnter, onMouseLea
     "span",
     {
       ref,
-      className: clsx44("ds-hover-card__trigger", className),
+      className: clsx21("ds-hover-card__trigger", className),
       onMouseEnter: handleMouseEnter,
       onMouseLeave: handleMouseLeave,
       ...props
@@ -1223,7 +1223,7 @@ var HoverCardContent = React30.forwardRef(
       "div",
       {
         ref,
-        className: clsx44(
+        className: clsx21(
           "ds-hover-card__content",
           `ds-hover-card__content--${side}`,
           `ds-hover-card__content--align-${align}`,
@@ -1243,7 +1243,7 @@ var AspectRatio = React30.forwardRef(
       "div",
       {
         ref,
-        className: clsx44("ds-aspect-ratio", className),
+        className: clsx21("ds-aspect-ratio", className),
         style: { ...style, paddingBottom: `${1 / ratio * 100}%` },
         ...props,
         children
@@ -1260,7 +1260,7 @@ var Pagination = React30.forwardRef(
         ref,
         role: "navigation",
         "aria-label": ariaLabel,
-        className: clsx44("ds-pagination", className),
+        className: clsx21("ds-pagination", className),
         ...props
       }
     );
@@ -1272,7 +1272,7 @@ var PaginationContent = React30.forwardRef(({ className, ...props }, ref) => {
     "ul",
     {
       ref,
-      className: clsx44("ds-pagination__content", className),
+      className: clsx21("ds-pagination__content", className),
       ...props
     }
   );
@@ -1283,7 +1283,7 @@ var PaginationItem = React30.forwardRef(({ className, ...props }, ref) => {
     "li",
     {
       ref,
-      className: clsx44("ds-pagination__item", className),
+      className: clsx21("ds-pagination__item", className),
       ...props
     }
   );
@@ -1296,7 +1296,7 @@ var PaginationLink = React30.forwardRef(({ className, isActive = false, size = "
     {
       ref,
       "aria-current": isActive ? "page" : void 0,
-      className: clsx44(
+      className: clsx21(
         "ds-pagination__link",
         `ds-pagination__link--${size}`,
         isActive && "ds-pagination__link--active",
@@ -1313,7 +1313,7 @@ var PaginationPrevious = React30.forwardRef(({ className, label = "Previous", "a
     {
       ref,
       "aria-label": ariaLabel,
-      className: clsx44("ds-pagination__prev", className),
+      className: clsx21("ds-pagination__prev", className),
       ...props,
       children: [
         /* @__PURE__ */ jsx(
@@ -1344,7 +1344,7 @@ var PaginationNext = React30.forwardRef(({ className, label = "Next", "aria-labe
     {
       ref,
       "aria-label": ariaLabel,
-      className: clsx44("ds-pagination__next", className),
+      className: clsx21("ds-pagination__next", className),
       ...props,
       children: [
         /* @__PURE__ */ jsx("span", { children: label }),
@@ -1375,7 +1375,7 @@ var PaginationEllipsis = React30.forwardRef(({ className, ...props }, ref) => {
     {
       ref,
       "aria-hidden": "true",
-      className: clsx44("ds-pagination__ellipsis", className),
+      className: clsx21("ds-pagination__ellipsis", className),
       ...props,
       children: "..."
     }
@@ -1398,7 +1398,7 @@ var Heading = React30.forwardRef(
       Comp,
       {
         ref,
-        className: clsx44("ds-heading", `ds-heading--${level}`, className),
+        className: clsx21("ds-heading", `ds-heading--${level}`, className),
         ...props,
         children
       }
@@ -1413,7 +1413,7 @@ var Text = React30.forwardRef(
       Comp,
       {
         ref,
-        className: clsx44("ds-text", `ds-text--${variant}`, className),
+        className: clsx21("ds-text", `ds-text--${variant}`, className),
         ...props,
         children
       }
@@ -1427,7 +1427,7 @@ var Prose = React30.forwardRef(
       "div",
       {
         ref,
-        className: clsx44("ds-prose", className),
+        className: clsx21("ds-prose", className),
         ...props,
         children
       }
@@ -1446,7 +1446,7 @@ function useCarouselContext() {
 var Carousel = React30.forwardRef(
   ({ className, children, ...props }, ref) => {
     const scrollRef = React30.useRef(null);
-    return /* @__PURE__ */ jsx(CarouselContext.Provider, { value: { scrollRef }, children: /* @__PURE__ */ jsx("div", { ref, className: clsx44("ds-carousel", className), ...props, children }) });
+    return /* @__PURE__ */ jsx(CarouselContext.Provider, { value: { scrollRef }, children: /* @__PURE__ */ jsx("div", { ref, className: clsx21("ds-carousel", className), ...props, children }) });
   }
 );
 Carousel.displayName = "Carousel";
@@ -1463,11 +1463,11 @@ var CarouselContent = React30.forwardRef(({ className, ...props }, ref) => {
     },
     [ref, scrollRef]
   );
-  return /* @__PURE__ */ jsx("div", { ref: mergedRef, className: clsx44("ds-carousel__content", className), ...props });
+  return /* @__PURE__ */ jsx("div", { ref: mergedRef, className: clsx21("ds-carousel__content", className), ...props });
 });
 CarouselContent.displayName = "CarouselContent";
 var CarouselItem = React30.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: clsx44("ds-carousel__item", className), ...props })
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: clsx21("ds-carousel__item", className), ...props })
 );
 CarouselItem.displayName = "CarouselItem";
 var CarouselPrevious = React30.forwardRef(({ className, onClick, children, "aria-label": ariaLabel = "Previous slide", ...props }, ref) => {
@@ -1486,7 +1486,7 @@ var CarouselPrevious = React30.forwardRef(({ className, onClick, children, "aria
     {
       ref,
       type: "button",
-      className: clsx44("ds-carousel__prev", className),
+      className: clsx21("ds-carousel__prev", className),
       "aria-label": ariaLabel,
       onClick: handleClick,
       ...props,
@@ -1520,7 +1520,7 @@ var CarouselNext = React30.forwardRef(({ className, onClick, children, "aria-lab
     {
       ref,
       type: "button",
-      className: clsx44("ds-carousel__next", className),
+      className: clsx21("ds-carousel__next", className),
       "aria-label": ariaLabel,
       onClick: handleClick,
       ...props,
@@ -1646,7 +1646,7 @@ var Command = React30.forwardRef(
       "div",
       {
         ref,
-        className: clsx44("ds-command", className),
+        className: clsx21("ds-command", className),
         onKeyDown: handleKeyDown,
         ...props,
         children
@@ -1697,7 +1697,7 @@ var CommandInput = React30.forwardRef(({ className, onChange, ...props }, ref) =
         "aria-activedescendant": activeId ?? void 0,
         "aria-autocomplete": "list",
         autoComplete: "off",
-        className: clsx44("ds-command__input", className),
+        className: clsx21("ds-command__input", className),
         value: search,
         onChange: handleChange,
         ...props
@@ -1715,7 +1715,7 @@ var CommandList = React30.forwardRef(
         ref: mergeRefs(ref, listRef),
         id: listId,
         role: "listbox",
-        className: clsx44("ds-command__list", className),
+        className: clsx21("ds-command__list", className),
         ...props
       }
     );
@@ -1723,11 +1723,11 @@ var CommandList = React30.forwardRef(
 );
 CommandList.displayName = "CommandList";
 var CommandEmpty = React30.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: clsx44("ds-command__empty", className), ...props })
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: clsx21("ds-command__empty", className), ...props })
 );
 CommandEmpty.displayName = "CommandEmpty";
 var CommandGroup = React30.forwardRef(
-  ({ className, heading, children, ...props }, ref) => /* @__PURE__ */ jsxs("div", { ref, className: clsx44("ds-command__group", className), ...props, children: [
+  ({ className, heading, children, ...props }, ref) => /* @__PURE__ */ jsxs("div", { ref, className: clsx21("ds-command__group", className), ...props, children: [
     heading && /* @__PURE__ */ jsx("div", { className: "ds-command__group-heading", children: heading }),
     children
   ] })
@@ -1762,7 +1762,7 @@ var CommandItem = React30.forwardRef(
         tabIndex: 0,
         "aria-selected": isActive,
         "data-active": isActive || void 0,
-        className: clsx44("ds-command__item", className),
+        className: clsx21("ds-command__item", className),
         onClick: handleClick,
         onKeyDown: handleKeyDown,
         onPointerEnter: handlePointerEnter,
@@ -1772,7 +1772,7 @@ var CommandItem = React30.forwardRef(
   }
 );
 CommandItem.displayName = "CommandItem";
-var CommandSeparator = React30.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: clsx44("ds-command__separator", className), ...props }));
+var CommandSeparator = React30.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: clsx21("ds-command__separator", className), ...props }));
 CommandSeparator.displayName = "CommandSeparator";
 var SIZE_CLASSES = {
   sm: "ds-dialog__content--sm",
@@ -1789,7 +1789,7 @@ var CommandDialog = ({
 }) => /* @__PURE__ */ jsx(Dialog, { open, onOpenChange, children: /* @__PURE__ */ jsxs(
   DialogContent,
   {
-    className: clsx44("ds-command-dialog", SIZE_CLASSES[size], className),
+    className: clsx21("ds-command-dialog", SIZE_CLASSES[size], className),
     children: [
       /* @__PURE__ */ jsx(DialogTitle, { className: "ds-command-dialog__sr-title", children: title }),
       children
@@ -1858,7 +1858,7 @@ var DrawerContent = React30.forwardRef(
           {
             ref,
             role: "dialog",
-            className: clsx44("ds-drawer__content", className),
+            className: clsx21("ds-drawer__content", className),
             ...props,
             children: [
               /* @__PURE__ */ jsx("div", { className: "ds-drawer__handle", "aria-hidden": "true", children: /* @__PURE__ */ jsx("div", { className: "ds-drawer__handle-bar" }) }),
@@ -1873,15 +1873,15 @@ var DrawerContent = React30.forwardRef(
 );
 DrawerContent.displayName = "DrawerContent";
 var DrawerHeader = React30.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: clsx44("ds-drawer__header", className), ...props })
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: clsx21("ds-drawer__header", className), ...props })
 );
 DrawerHeader.displayName = "DrawerHeader";
-var DrawerTitle = React30.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("h2", { ref, className: clsx44("ds-drawer__title", className), ...props }));
+var DrawerTitle = React30.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("h2", { ref, className: clsx21("ds-drawer__title", className), ...props }));
 DrawerTitle.displayName = "DrawerTitle";
-var DrawerDescription = React30.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("p", { ref, className: clsx44("ds-drawer__description", className), ...props }));
+var DrawerDescription = React30.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("p", { ref, className: clsx21("ds-drawer__description", className), ...props }));
 DrawerDescription.displayName = "DrawerDescription";
 var DrawerFooter = React30.forwardRef(
-  ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: clsx44("ds-drawer__footer", className), ...props })
+  ({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: clsx21("ds-drawer__footer", className), ...props })
 );
 DrawerFooter.displayName = "DrawerFooter";
 var DEFAULT_WEEKDAY_LABELS = ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"];
@@ -1952,7 +1952,7 @@ var Calendar = React30.forwardRef(
     const handleDayClick = (date) => {
       onSelect?.(date);
     };
-    return /* @__PURE__ */ jsxs("div", { ref, className: clsx44("ds-calendar", className), ...props, children: [
+    return /* @__PURE__ */ jsxs("div", { ref, className: clsx21("ds-calendar", className), ...props, children: [
       /* @__PURE__ */ jsxs("div", { className: "ds-calendar__header", children: [
         /* @__PURE__ */ jsx(
           "button",
@@ -2016,7 +2016,7 @@ var Calendar = React30.forwardRef(
             "button",
             {
               type: "button",
-              className: clsx44(
+              className: clsx21(
                 "ds-calendar__day",
                 isSelected && "ds-calendar__day--selected",
                 isToday && "ds-calendar__day--today",
@@ -2068,7 +2068,7 @@ var InputOTP = React30.forwardRef(
       "div",
       {
         ref,
-        className: clsx44("ds-input-otp", className),
+        className: clsx21("ds-input-otp", className),
         onClick: handleContainerClick,
         ...props,
         children: [
@@ -2098,7 +2098,7 @@ var InputOTP = React30.forwardRef(
 );
 InputOTP.displayName = "InputOTP";
 var InputOTPGroup = React30.forwardRef(({ className, ...props }, ref) => {
-  return /* @__PURE__ */ jsx("div", { ref, className: clsx44("ds-input-otp__group", className), ...props });
+  return /* @__PURE__ */ jsx("div", { ref, className: clsx21("ds-input-otp__group", className), ...props });
 });
 InputOTPGroup.displayName = "InputOTPGroup";
 var InputOTPSlot = React30.forwardRef(
@@ -2111,7 +2111,7 @@ var InputOTPSlot = React30.forwardRef(
       "div",
       {
         ref,
-        className: clsx44(
+        className: clsx21(
           "ds-input-otp__slot",
           isActive && "ds-input-otp__slot--active",
           isFilled && "ds-input-otp__slot--filled",
@@ -2125,7 +2125,7 @@ var InputOTPSlot = React30.forwardRef(
 );
 InputOTPSlot.displayName = "InputOTPSlot";
 var InputOTPSeparator = React30.forwardRef(({ className, ...props }, ref) => {
-  return /* @__PURE__ */ jsx("div", { ref, className: clsx44("ds-input-otp__separator", className), role: "separator", ...props, children: /* @__PURE__ */ jsx(
+  return /* @__PURE__ */ jsx("div", { ref, className: clsx21("ds-input-otp__separator", className), role: "separator", ...props, children: /* @__PURE__ */ jsx(
     "svg",
     {
       width: "8",
@@ -2173,7 +2173,7 @@ var ContextMenuTrigger = React30.forwardRef(({ className, onContextMenu, ...prop
     "div",
     {
       ref,
-      className: clsx44("ds-context-menu__trigger", className),
+      className: clsx21("ds-context-menu__trigger", className),
       onContextMenu: handleContextMenu,
       ...props
     }
@@ -2220,7 +2220,7 @@ var ContextMenuContent = React30.forwardRef(({ className, ...props }, ref) => {
       {
         ref: mergedRef,
         role: "menu",
-        className: clsx44("ds-context-menu__content", className),
+        className: clsx21("ds-context-menu__content", className),
         style: { top: position.y, left: position.x },
         ...props
       }
@@ -2242,7 +2242,7 @@ var ContextMenuItem = React30.forwardRef(
       {
         ref,
         role: "menuitem",
-        className: clsx44("ds-context-menu__item", className),
+        className: clsx21("ds-context-menu__item", className),
         onClick: handleClick,
         ...props
       }
@@ -2256,7 +2256,7 @@ var ContextMenuSeparator = React30.forwardRef(({ className, ...props }, ref) =>
     {
       ref,
       role: "separator",
-      className: clsx44("ds-context-menu__separator", className),
+      className: clsx21("ds-context-menu__separator", className),
       ...props
     }
   );
@@ -2267,7 +2267,7 @@ var ContextMenuLabel = React30.forwardRef(({ className, ...props }, ref) => {
     "div",
     {
       ref,
-      className: clsx44("ds-context-menu__label", className),
+      className: clsx21("ds-context-menu__label", className),
       ...props
     }
   );
@@ -2307,7 +2307,7 @@ var FormItem = React30.forwardRef(
   ({ className, ...props }, ref) => {
     const id = React30.useId();
     const contextValue = React30.useMemo(() => ({ id }), [id]);
-    return /* @__PURE__ */ jsx(FormItemContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx("div", { ref, className: clsx44("ds-form__item", className), ...props }) });
+    return /* @__PURE__ */ jsx(FormItemContext.Provider, { value: contextValue, children: /* @__PURE__ */ jsx("div", { ref, className: clsx21("ds-form__item", className), ...props }) });
   }
 );
 FormItem.displayName = "FormItem";
@@ -2319,7 +2319,7 @@ var FormLabel = React30.forwardRef(({ className, ...props }, ref) => {
     {
       ref,
       htmlFor: fieldCtx?.id,
-      className: clsx44("ds-form__label", hasError && "ds-form__label--error", className),
+      className: clsx21("ds-form__label", hasError && "ds-form__label--error", className),
       ...props
     }
   );
@@ -2331,7 +2331,7 @@ var FormControl = React30.forwardRef(
     const descriptionId = fieldCtx ? `${fieldCtx.id}-description` : void 0;
     const messageId = fieldCtx ? `${fieldCtx.id}-message` : void 0;
     const hasError = !!fieldCtx?.error;
-    return /* @__PURE__ */ jsx("div", { ref, className: clsx44("ds-form__control", className), ...props, children: React30.isValidElement(children) ? React30.cloneElement(children, {
+    return /* @__PURE__ */ jsx("div", { ref, className: clsx21("ds-form__control", className), ...props, children: React30.isValidElement(children) ? React30.cloneElement(children, {
       id: fieldCtx?.id,
       "aria-describedby": descriptionId,
       "aria-invalid": hasError || void 0,
@@ -2347,7 +2347,7 @@ var FormDescription = React30.forwardRef(({ className, ...props }, ref) => {
     {
       ref,
       id: fieldCtx ? `${fieldCtx.id}-description` : void 0,
-      className: clsx44("ds-form__description", className),
+      className: clsx21("ds-form__description", className),
       ...props
     }
   );
@@ -2363,7 +2363,7 @@ var FormMessage = React30.forwardRef(({ className, children, ...props }, ref) =>
       ref,
       id: fieldCtx ? `${fieldCtx.id}-message` : void 0,
       role: "alert",
-      className: clsx44("ds-form__message", className),
+      className: clsx21("ds-form__message", className),
       ...props,
       children: message
     }
@@ -2444,7 +2444,7 @@ var Box = forwardRef(
       Component,
       {
         ref,
-        className: clsx44("ds-box", className),
+        className: clsx21("ds-box", className),
         style: { ...spacingStyles, ...style },
         ...domProps,
         children
@@ -2459,7 +2459,7 @@ var Stack = forwardRef(
       Box,
       {
         ref,
-        className: clsx44("ds-stack", direction === "row" && "ds-stack--horizontal", className),
+        className: clsx21("ds-stack", direction === "row" && "ds-stack--horizontal", className),
         style: {
           alignItems: align,
           justifyContent: justify === "between" ? "space-between" : justify,
@@ -2480,7 +2480,7 @@ var Grid = forwardRef(
       Box,
       {
         ref,
-        className: clsx44(
+        className: clsx21(
           "ds-grid",
           useColClass && `ds-grid--cols-${columns}`,
           fixed && "ds-grid--fixed",
@@ -2524,7 +2524,7 @@ var Container = forwardRef(
       Box,
       {
         ref,
-        className: clsx44("ds-container", className),
+        className: clsx21("ds-container", className),
         style: {
           maxWidth: resolvedMaxWidth,
           ...style
@@ -2541,7 +2541,7 @@ var Section = forwardRef(
       "section",
       {
         ref,
-        className: clsx44("ds-section-block", `ds-section-block--${padding}`, className),
+        className: clsx21("ds-section-block", `ds-section-block--${padding}`, className),
         ...props,
         children
       }
@@ -2551,87 +2551,16 @@ var Section = forwardRef(
 Section.displayName = "Section";
 var VisuallyHidden = forwardRef(
   ({ className, ...props }, ref) => {
-    return /* @__PURE__ */ jsx("span", { ref, className: clsx44("ds-visually-hidden", className), ...props });
+    return /* @__PURE__ */ jsx("span", { ref, className: clsx21("ds-visually-hidden", className), ...props });
   }
 );
 VisuallyHidden.displayName = "VisuallyHidden";
-var NavbarBrand = forwardRef(
-  ({ as: Component = "a", className, children, ...props }, ref) => {
-    return /* @__PURE__ */ jsx(Component, { ref, className: clsx44("ds-navbar__brand", className), ...props, children });
-  }
-);
-NavbarBrand.displayName = "NavbarBrand";
-var NavbarContent = forwardRef(
-  ({ className, children, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: clsx44("ds-navbar__content", className), ...props, children })
-);
-NavbarContent.displayName = "NavbarContent";
-var NavbarItem = forwardRef(
-  ({ as: Component = "a", className, active, children, ...props }, ref) => {
-    return /* @__PURE__ */ jsx(
-      Component,
-      {
-        ref,
-        className: clsx44("ds-navbar__item", active && "ds-navbar__item--active", className),
-        "aria-current": active ? "page" : void 0,
-        ...props,
-        children
-      }
-    );
-  }
-);
-NavbarItem.displayName = "NavbarItem";
-var NavbarActions = forwardRef(
-  ({ className, children, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: clsx44("ds-navbar__actions", className), ...props, children })
-);
-NavbarActions.displayName = "NavbarActions";
-var SearchIcon = () => /* @__PURE__ */ jsxs(
-  "svg",
-  {
-    width: "14",
-    height: "14",
-    viewBox: "0 0 24 24",
-    fill: "none",
-    stroke: "currentColor",
-    strokeWidth: "2",
-    strokeLinecap: "round",
-    strokeLinejoin: "round",
-    "aria-hidden": "true",
-    children: [
-      /* @__PURE__ */ jsx("circle", { cx: "11", cy: "11", r: "8" }),
-      /* @__PURE__ */ jsx("path", { d: "M21 21l-4.35-4.35" })
-    ]
-  }
-);
-var NavbarSearchTrigger = forwardRef(
-  ({
-    className,
-    placeholder = "Search...",
-    shortcut = "\u2318K",
-    hideShortcut = false,
-    ...props
-  }, ref) => /* @__PURE__ */ jsxs(
-    "button",
-    {
-      ref,
-      type: "button",
-      className: clsx44("ds-navbar__search-trigger", className),
-      "aria-label": `Search. Press ${shortcut} to open.`,
-      ...props,
-      children: [
-        /* @__PURE__ */ jsx("span", { className: "ds-navbar__search-trigger-icon", children: /* @__PURE__ */ jsx(SearchIcon, {}) }),
-        /* @__PURE__ */ jsx("span", { className: "ds-navbar__search-trigger-placeholder", children: placeholder }),
-        !hideShortcut && /* @__PURE__ */ jsx("span", { className: "ds-navbar__search-trigger-shortcut", "aria-hidden": "true", children: shortcut })
-      ]
-    }
-  )
-);
-NavbarSearchTrigger.displayName = "NavbarSearchTrigger";
 var NavbarMobileNavItem = forwardRef(
   ({ as: Component = "a", className, active, children, ...props }, ref) => /* @__PURE__ */ jsx(
     Component,
     {
       ref,
-      className: clsx44(
+      className: clsx21(
         "ds-navbar__mobile-nav-item",
         active && "ds-navbar__mobile-nav-item--active",
         className
@@ -2644,144 +2573,13 @@ var NavbarMobileNavItem = forwardRef(
 );
 NavbarMobileNavItem.displayName = "NavbarMobileNavItem";
 function NavbarMobileSeparator({ className }) {
-  return /* @__PURE__ */ jsx("div", { className: clsx44("ds-navbar__mobile-separator", className), role: "separator" });
+  return /* @__PURE__ */ jsx("div", { className: clsx21("ds-navbar__mobile-separator", className), role: "separator" });
 }
 NavbarMobileSeparator.displayName = "NavbarMobileSeparator";
 var NavbarMobileActions = forwardRef(
-  ({ className, children, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: clsx44("ds-navbar__mobile-actions", className), ...props, children })
+  ({ className, children, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: clsx21("ds-navbar__mobile-actions", className), ...props, children })
 );
 NavbarMobileActions.displayName = "NavbarMobileActions";
-var MOBILE_PANEL_VARIANTS = {
-  hidden: {
-    opacity: 0,
-    y: -12,
-    transition: { duration: 0.2, ease: [0.4, 0, 1, 1] }
-  },
-  visible: {
-    opacity: 1,
-    y: 0,
-    transition: { duration: 0.25, ease: [0.2, 0.8, 0.2, 1] }
-  }
-};
-var Navbar = forwardRef(
-  ({
-    className,
-    isBordered = true,
-    isSticky = true,
-    onMenuOpenChange,
-    isMenuOpen,
-    mobileContent,
-    mobileToggleLabels,
-    children,
-    ...props
-  }, ref) => {
-    const [internalMenuOpen, setInternalMenuOpen] = useState(false);
-    const isMobileMenuOpen = isMenuOpen !== void 0 ? isMenuOpen : internalMenuOpen;
-    const openLabel = mobileToggleLabels?.open ?? "Open menu";
-    const closeLabel = mobileToggleLabels?.close ?? "Close menu";
-    const handleToggle = () => {
-      const newState = !isMobileMenuOpen;
-      setInternalMenuOpen(newState);
-      onMenuOpenChange?.(newState);
-    };
-    useEffect(() => {
-      if (isMobileMenuOpen) {
-        document.body.style.overflow = "hidden";
-        return () => {
-          document.body.style.overflow = "";
-        };
-      }
-    }, [isMobileMenuOpen]);
-    useEffect(() => {
-      if (!isMobileMenuOpen) return;
-      const handleEscape = (e) => {
-        if (e.key === "Escape") {
-          setInternalMenuOpen(false);
-          onMenuOpenChange?.(false);
-        }
-      };
-      document.addEventListener("keydown", handleEscape);
-      return () => document.removeEventListener("keydown", handleEscape);
-    }, [isMobileMenuOpen, onMenuOpenChange]);
-    return /* @__PURE__ */ jsxs(
-      "nav",
-      {
-        ref,
-        className: clsx44(
-          "ds-navbar",
-          isSticky && "ds-navbar--sticky",
-          className
-        ),
-        style: {
-          borderBottom: isBordered ? void 0 : "none",
-          position: isSticky ? "sticky" : "relative"
-        },
-        ...props,
-        children: [
-          children,
-          /* @__PURE__ */ jsx(
-            "button",
-            {
-              className: "ds-navbar__toggle",
-              onClick: handleToggle,
-              "aria-label": isMobileMenuOpen ? closeLabel : openLabel,
-              "aria-expanded": isMobileMenuOpen,
-              children: isMobileMenuOpen ? /* @__PURE__ */ jsxs(
-                "svg",
-                {
-                  width: "24",
-                  height: "24",
-                  viewBox: "0 0 24 24",
-                  fill: "none",
-                  stroke: "currentColor",
-                  strokeWidth: "2",
-                  strokeLinecap: "round",
-                  strokeLinejoin: "round",
-                  children: [
-                    /* @__PURE__ */ jsx("line", { x1: "18", y1: "6", x2: "6", y2: "18" }),
-                    /* @__PURE__ */ jsx("line", { x1: "6", y1: "6", x2: "18", y2: "18" })
-                  ]
-                }
-              ) : /* @__PURE__ */ jsxs(
-                "svg",
-                {
-                  width: "24",
-                  height: "24",
-                  viewBox: "0 0 24 24",
-                  fill: "none",
-                  stroke: "currentColor",
-                  strokeWidth: "2",
-                  strokeLinecap: "round",
-                  strokeLinejoin: "round",
-                  children: [
-                    /* @__PURE__ */ jsx("line", { x1: "3", y1: "12", x2: "21", y2: "12" }),
-                    /* @__PURE__ */ jsx("line", { x1: "3", y1: "6", x2: "21", y2: "6" }),
-                    /* @__PURE__ */ jsx("line", { x1: "3", y1: "18", x2: "21", y2: "18" })
-                  ]
-                }
-              )
-            }
-          ),
-          /* @__PURE__ */ jsx(AnimatePresence, { children: isMobileMenuOpen && /* @__PURE__ */ jsx(
-            motion.div,
-            {
-              className: "ds-navbar__mobile-overlay",
-              variants: MOBILE_PANEL_VARIANTS,
-              initial: "hidden",
-              animate: "visible",
-              exit: "hidden",
-              role: "dialog",
-              "aria-modal": "true",
-              "aria-label": closeLabel,
-              children: /* @__PURE__ */ jsx("div", { className: "ds-navbar__mobile-content", children: mobileContent })
-            }
-          ) })
-        ]
-      }
-    );
-  }
-);
-Navbar.displayName = "Navbar";
 var ChevronDown = () => /* @__PURE__ */ jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx(
   "path",
   {
@@ -2792,55 +2590,6 @@ var ChevronDown = () => /* @__PURE__ */ jsx("svg", { width: "16", height: "16",
     strokeLinejoin: "round"
   }
 ) });
-var EASE_OUT = [0.2, 0.8, 0.2, 1];
-var EASE_IN = [0.4, 0, 1, 1];
-var panelVariants = {
-  hidden: {
-    opacity: 0,
-    y: -8,
-    scale: 0.995
-  },
-  visible: {
-    opacity: 1,
-    y: 0,
-    scale: 1,
-    transition: {
-      duration: 0.25,
-      ease: EASE_OUT,
-      staggerChildren: 0.04,
-      delayChildren: 0.06
-    }
-  },
-  exit: {
-    opacity: 0,
-    y: -6,
-    scale: 0.995,
-    transition: {
-      duration: 0.15,
-      ease: EASE_IN
-    }
-  }
-};
-var itemVariants = {
-  hidden: {
-    opacity: 0,
-    y: 8,
-    filter: "blur(4px)"
-  },
-  visible: {
-    opacity: 1,
-    y: 0,
-    filter: "blur(0px)",
-    transition: {
-      duration: 0.3,
-      ease: EASE_OUT
-    }
-  },
-  exit: {
-    opacity: 0,
-    transition: { duration: 0.1 }
-  }
-};
 var NavbarMegaMenu = forwardRef(
   ({ trigger, children, className, isOpen: controlledOpen, onOpenChange, variant = "fullWidth" }, ref) => {
     const [internalOpen, setInternalOpen] = useState(false);
@@ -2911,7 +2660,7 @@ var NavbarMegaMenu = forwardRef(
     return /* @__PURE__ */ jsxs(
       "div",
       {
-        className: clsx44("ds-navbar-mega-menu", `ds-navbar-mega-menu--${variant}`, className),
+        className: clsx21("ds-navbar-mega-menu", `ds-navbar-mega-menu--${variant}`, className),
         ref,
         onMouseEnter: handleMouseEnter,
         onMouseLeave: handleMouseLeave,
@@ -2927,31 +2676,27 @@ var NavbarMegaMenu = forwardRef(
               children: [
                 trigger,
                 /* @__PURE__ */ jsx(
-                  motion.span,
+                  "span",
                   {
                     className: "ds-navbar-mega-menu__chevron",
-                    animate: { rotate: isOpen ? 180 : 0 },
-                    transition: { duration: 0.2, ease: EASE_OUT },
+                    "data-state": isOpen ? "open" : "closed",
                     children: /* @__PURE__ */ jsx(ChevronDown, {})
                   }
                 )
               ]
             }
           ),
-          /* @__PURE__ */ jsx("div", { ref: containerRef, children: /* @__PURE__ */ jsx(AnimatePresence, { mode: "wait", children: isOpen && /* @__PURE__ */ jsx(
-            motion.div,
+          /* @__PURE__ */ jsx("div", { ref: containerRef, children: /* @__PURE__ */ jsx(
+            "div",
             {
-              className: clsx44(
+              className: clsx21(
                 "ds-navbar-mega-menu__content",
                 `ds-navbar-mega-menu__content--${variant}`
               ),
-              variants: panelVariants,
-              initial: "hidden",
-              animate: "visible",
-              exit: "exit",
+              "data-state": isOpen ? "open" : "closed",
               children: variant === "fullWidth" ? /* @__PURE__ */ jsx(Container, { children }) : children
             }
-          ) }) })
+          ) })
         ]
       }
     );
@@ -2959,7 +2704,7 @@ var NavbarMegaMenu = forwardRef(
 );
 NavbarMegaMenu.displayName = "NavbarMegaMenu";
 function NavbarMegaMenuSection({ heading, children, className }) {
-  return /* @__PURE__ */ jsxs(motion.div, { className: clsx44("ds-navbar-mega-menu__section", className), variants: itemVariants, children: [
+  return /* @__PURE__ */ jsxs("div", { className: clsx21("ds-navbar-mega-menu__section", className), children: [
     heading && /* @__PURE__ */ jsx("p", { className: "ds-navbar-mega-menu__section-heading", children: heading }),
     /* @__PURE__ */ jsx("div", { className: "ds-navbar-mega-menu__section-items", children })
   ] });
@@ -2967,11 +2712,11 @@ function NavbarMegaMenuSection({ heading, children, className }) {
 NavbarMegaMenuSection.displayName = "NavbarMegaMenuSection";
 var NavbarMegaMenuItem = forwardRef(
   ({ icon, label, description, className, as: Comp = "a", ...rest }, ref) => {
-    return /* @__PURE__ */ jsx(motion.div, { variants: itemVariants, children: /* @__PURE__ */ jsxs(
+    return /* @__PURE__ */ jsx("div", { className: "ds-navbar-mega-menu__item-wrapper", children: /* @__PURE__ */ jsxs(
       Comp,
       {
         ref,
-        className: clsx44("ds-navbar-mega-menu__item", className),
+        className: clsx21("ds-navbar-mega-menu__item", className),
         ...rest,
         children: [
           icon && /* @__PURE__ */ jsx("span", { className: "ds-navbar-mega-menu__item-icon", children: icon }),
@@ -2985,8 +2730,6 @@ var NavbarMegaMenuItem = forwardRef(
   }
 );
 NavbarMegaMenuItem.displayName = "NavbarMegaMenuItem";
-var EASE_OUT2 = [0.2, 0.8, 0.2, 1];
-var EASE_IN2 = [0.4, 0, 1, 1];
 var ChevronDown2 = () => /* @__PURE__ */ jsx("svg", { width: "8", height: "8", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx(
   "path",
   {
@@ -3039,18 +2782,6 @@ function useFocusTrap(containerRef, active) {
     return () => container.removeEventListener("keydown", handleKeyDown);
   }, [active, containerRef]);
 }
-var MOBILE_OVERLAY_VARIANTS = {
-  hidden: {
-    opacity: 0,
-    y: -12,
-    transition: { duration: 0.2, ease: EASE_IN2 }
-  },
-  visible: {
-    opacity: 1,
-    y: 0,
-    transition: { duration: 0.25, ease: EASE_OUT2 }
-  }
-};
 var HYSTERESIS_RATIO = 0.25;
 var NavbarV2 = forwardRef(
   ({
@@ -3140,7 +2871,7 @@ var NavbarV2 = forwardRef(
       "nav",
       {
         ref: mergedRef,
-        className: clsx44(
+        className: clsx21(
           "ds-navbar-v2",
           isScrolled && "ds-navbar-v2--scrolled",
           className
@@ -3193,22 +2924,19 @@ var NavbarV2 = forwardRef(
               }
             )
           ] }),
-          /* @__PURE__ */ jsx(AnimatePresence, { children: isMobileMenuOpen && /* @__PURE__ */ jsx(
-            motion.div,
+          /* @__PURE__ */ jsx(
+            "div",
             {
               ref: overlayRef,
               className: "ds-navbar-v2__mobile-overlay",
               style: { top: navHeight },
-              variants: MOBILE_OVERLAY_VARIANTS,
-              initial: "hidden",
-              animate: "visible",
-              exit: "hidden",
+              "data-state": isMobileMenuOpen ? "open" : "closed",
               role: "dialog",
               "aria-modal": "true",
               "aria-label": closeLabel,
               children: /* @__PURE__ */ jsx("div", { className: "ds-navbar-v2__mobile-content", children: mobileContent })
             }
-          ) })
+          )
         ]
       }
     ) });
@@ -3216,7 +2944,7 @@ var NavbarV2 = forwardRef(
 );
 NavbarV2.displayName = "NavbarV2";
 var NavbarV2Brand = forwardRef(
-  ({ as: Component = "a", className, children, ...props }, ref) => /* @__PURE__ */ jsx(Component, { ref, className: clsx44("ds-navbar-v2__brand", className), ...props, children })
+  ({ as: Component = "a", className, children, ...props }, ref) => /* @__PURE__ */ jsx(Component, { ref, className: clsx21("ds-navbar-v2__brand", className), ...props, children })
 );
 NavbarV2Brand.displayName = "NavbarV2Brand";
 var NavbarV2Tabs = forwardRef(
@@ -3235,7 +2963,7 @@ var NavbarV2Tabs = forwardRef(
       "div",
       {
         ref,
-        className: clsx44(
+        className: clsx21(
           "ds-navbar-v2__tabs",
           scrolled && "ds-navbar-v2__tabs--demoted",
           className
@@ -3252,7 +2980,7 @@ var NavbarV2Tab = forwardRef(
     Component,
     {
       ref,
-      className: clsx44("ds-navbar-v2__tab", active && "ds-navbar-v2__tab--active", className),
+      className: clsx21("ds-navbar-v2__tab", active && "ds-navbar-v2__tab--active", className),
       "aria-current": active ? "page" : void 0,
       ...Component === "button" ? { type: "button" } : {},
       ...props,
@@ -3265,36 +2993,6 @@ var NavbarV2Tab = forwardRef(
   )
 );
 NavbarV2Tab.displayName = "NavbarV2Tab";
-var PANEL_VARIANTS = {
-  hidden: {
-    opacity: 0,
-    y: -8,
-    scale: 0.98,
-    x: "-50%"
-  },
-  visible: {
-    opacity: 1,
-    y: 0,
-    scale: 1,
-    x: "-50%",
-    transition: {
-      duration: 0.25,
-      ease: EASE_OUT2,
-      staggerChildren: 0.04,
-      delayChildren: 0.06
-    }
-  },
-  exit: {
-    opacity: 0,
-    y: -6,
-    scale: 0.98,
-    x: "-50%",
-    transition: {
-      duration: 0.15,
-      ease: EASE_IN2
-    }
-  }
-};
 var NavbarV2TabMenu = forwardRef(
   ({
     icon,
@@ -3388,11 +3086,15 @@ var NavbarV2TabMenu = forwardRef(
       window.addEventListener("resize", clampToViewport);
       return () => window.removeEventListener("resize", clampToViewport);
     }, [isOpen]);
+    const panelRefCallback = useCallback((node) => {
+      containerRef.current = node;
+      panelRef.current = node;
+    }, []);
     return /* @__PURE__ */ jsxs(
       "div",
       {
         ref,
-        className: clsx44("ds-navbar-v2__tab-menu", className),
+        className: clsx21("ds-navbar-v2__tab-menu", className),
         onMouseEnter: handleMouseEnter,
         onMouseLeave: handleMouseLeave,
         children: [
@@ -3400,7 +3102,7 @@ var NavbarV2TabMenu = forwardRef(
             "button",
             {
               ref: triggerRef,
-              className: clsx44(
+              className: clsx21(
                 "ds-navbar-v2__tab",
                 (active || isOpen) && "ds-navbar-v2__tab--active"
               ),
@@ -3414,11 +3116,10 @@ var NavbarV2TabMenu = forwardRef(
                 /* @__PURE__ */ jsxs("span", { className: "ds-navbar-v2__tab-label-row", children: [
                   /* @__PURE__ */ jsx("span", { className: "ds-navbar-v2__tab-label", children: label }),
                   /* @__PURE__ */ jsx(
-                    motion.span,
+                    "span",
                     {
                       className: "ds-navbar-v2__tab-chevron",
-                      animate: { rotate: isOpen ? 180 : 0 },
-                      transition: { duration: 0.2, ease: EASE_OUT2 },
+                      "data-state": isOpen ? "open" : "closed",
                       children: /* @__PURE__ */ jsx(ChevronDown2, {})
                     }
                   )
@@ -3426,24 +3127,18 @@ var NavbarV2TabMenu = forwardRef(
               ]
             }
           ),
-          /* @__PURE__ */ jsx(AnimatePresence, { mode: "wait", children: isOpen && /* @__PURE__ */ jsx(
-            motion.div,
+          /* @__PURE__ */ jsx(
+            "div",
             {
-              ref: (node) => {
-                containerRef.current = node;
-                panelRef.current = node;
-              },
+              ref: panelRefCallback,
               id: panelId,
               className: "ds-navbar-v2__mega-panel",
-              variants: PANEL_VARIANTS,
-              initial: "hidden",
-              animate: "visible",
-              exit: "exit",
+              "data-state": isOpen ? "open" : "closed",
               role: "region",
               "aria-label": `${label} menu`,
               children
             }
-          ) })
+          )
         ]
       }
     );
@@ -3451,7 +3146,7 @@ var NavbarV2TabMenu = forwardRef(
 );
 NavbarV2TabMenu.displayName = "NavbarV2TabMenu";
 var NavbarV2Actions = forwardRef(
-  ({ className, children, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: clsx44("ds-navbar-v2__actions", className), ...props, children })
+  ({ className, children, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: clsx21("ds-navbar-v2__actions", className), ...props, children })
 );
 NavbarV2Actions.displayName = "NavbarV2Actions";
 function useMergedRef(...refs) {
@@ -3476,7 +3171,7 @@ var SectionHeader = forwardRef(
       "header",
       {
         ref,
-        className: clsx44("ds-section-header", `ds-section-header--${align}`, className),
+        className: clsx21("ds-section-header", `ds-section-header--${align}`, className),
         ...props,
         children: [
           eyebrow && /* @__PURE__ */ jsx("span", { className: "ds-section-header__eyebrow", children: eyebrow }),
@@ -3502,7 +3197,7 @@ var SectionShell = forwardRef(
       "section",
       {
         ref,
-        className: clsx44(
+        className: clsx21(
           "ds-section",
           `ds-section--bg-${background}`,
           `ds-section--padding-${padding}`,
@@ -3544,7 +3239,7 @@ var HeroSection = forwardRef(
     const isSplit = variant === "split";
     const isCenter = variant === "center";
     const textAlignment = align || (isCenter ? "center" : "left");
-    const ContentBlock = /* @__PURE__ */ jsxs("div", { className: clsx44("ds-hero__content", `ds-hero__content--${textAlignment}`), children: [
+    const ContentBlock = /* @__PURE__ */ jsxs("div", { className: clsx21("ds-hero__content", `ds-hero__content--${textAlignment}`), children: [
       eyebrow && /* @__PURE__ */ jsx("span", { className: "ds-section-header__eyebrow", style: { marginBottom: "var(--space-2)" }, children: eyebrow }),
       /* @__PURE__ */ jsx("h1", { className: "ds-hero__title", children: title }),
       subtitle && /* @__PURE__ */ jsx("p", { className: "ds-hero__subtitle", children: subtitle }),
@@ -3555,14 +3250,14 @@ var HeroSection = forwardRef(
       children
     ] });
     const MediaBlock = media && /* @__PURE__ */ jsxs("div", { className: "ds-hero__media-wrapper", children: [
-      /* @__PURE__ */ jsx("div", { className: clsx44("ds-hero__media", mediaBrowserFrame && "ds-hero__media--browser"), children: media }),
-      floatingElement && /* @__PURE__ */ jsx("div", { className: clsx44("ds-hero__float", `ds-hero__float--${floatingPosition}`), children: floatingElement })
+      /* @__PURE__ */ jsx("div", { className: clsx21("ds-hero__media", mediaBrowserFrame && "ds-hero__media--browser"), children: media }),
+      floatingElement && /* @__PURE__ */ jsx("div", { className: clsx21("ds-hero__float", `ds-hero__float--${floatingPosition}`), children: floatingElement })
     ] });
     return /* @__PURE__ */ jsx(
       SectionShell,
       {
         ref,
-        className: clsx44(
+        className: clsx21(
           "ds-hero",
           `ds-hero--${variant}`,
           withGrid && "ds-hero--bg-grid",
@@ -3635,9 +3330,9 @@ var FeatureSection = forwardRef(
     className,
     ...props
   }, ref) => {
-    return /* @__PURE__ */ jsxs(SectionShell, { ref, className: clsx44("ds-feature-section", className), ...props, children: [
+    return /* @__PURE__ */ jsxs(SectionShell, { ref, className: clsx21("ds-feature-section", className), ...props, children: [
       /* @__PURE__ */ jsx(SectionHeader, { title, subtitle, eyebrow, align: alignHeader }),
-      variant === "grid" ? /* @__PURE__ */ jsx("div", { className: clsx44("ds-feature-grid", `ds-feature-grid--${columns}-col`), children: features.map((feature, index) => /* @__PURE__ */ jsx(FeatureCard, { item: feature }, index)) }) : /* @__PURE__ */ jsx("div", { className: "ds-feature-zigzag", children: features.map((feature, index) => /* @__PURE__ */ jsx(FeatureRow, { item: feature }, index)) })
+      variant === "grid" ? /* @__PURE__ */ jsx("div", { className: clsx21("ds-feature-grid", `ds-feature-grid--${columns}-col`), children: features.map((feature, index) => /* @__PURE__ */ jsx(FeatureCard, { item: feature }, index)) }) : /* @__PURE__ */ jsx("div", { className: "ds-feature-zigzag", children: features.map((feature, index) => /* @__PURE__ */ jsx(FeatureRow, { item: feature }, index)) })
     ] });
   }
 );
@@ -3647,7 +3342,7 @@ function FooterAccordionItem({ section, LinkComponent }) {
   return /* @__PURE__ */ jsxs(
     "div",
     {
-      className: clsx44(
+      className: clsx21(
         "ds-footer__accordion-item",
         isOpen && "ds-footer__accordion-item--open"
       ),
@@ -3711,7 +3406,7 @@ var SiteFooter = forwardRef(
     const defaultCopyright = copyright || `\xA9 ${currentYear}. All rights reserved.`;
     const resolvedControls = controls || bottomActions;
     const LinkComponent = linkAs || "a";
-    return /* @__PURE__ */ jsxs("footer", { ref, className: clsx44("ds-footer", className), ...props, children: [
+    return /* @__PURE__ */ jsxs("footer", { ref, className: clsx21("ds-footer", className), ...props, children: [
       cta && /* @__PURE__ */ jsx("div", { className: "ds-footer__cta", "data-footer-zone": "cta", children: /* @__PURE__ */ jsx(Container, { children: /* @__PURE__ */ jsxs("div", { className: "ds-footer__cta-content", children: [
         /* @__PURE__ */ jsx("h2", { className: "ds-footer__cta-headline", children: cta.headline }),
         cta.subtext && /* @__PURE__ */ jsx("p", { className: "ds-footer__cta-subtext", children: cta.subtext }),
@@ -3811,7 +3506,7 @@ var CTASection = forwardRef(
   }, ref) => {
     const isBoxed = variant === "boxed";
     const effectiveVariant = isBoxed ? "center" : variant;
-    const Content = /* @__PURE__ */ jsxs("div", { className: clsx44("ds-cta-section", `ds-cta-section--${effectiveVariant}`), children: [
+    const Content = /* @__PURE__ */ jsxs("div", { className: clsx21("ds-cta-section", `ds-cta-section--${effectiveVariant}`), children: [
       effectiveVariant === "split" ? /* @__PURE__ */ jsxs("div", { className: "ds-cta-section--split", children: [
         /* @__PURE__ */ jsxs("div", { className: "ds-cta-content", children: [
           /* @__PURE__ */ jsx("h2", { className: "ds-cta-title", children: title }),
@@ -3831,13 +3526,13 @@ var CTASection = forwardRef(
       ] }),
       children
     ] });
-    return /* @__PURE__ */ jsx(SectionShell, { ref, className: clsx44(className), ...props, children: isBoxed ? /* @__PURE__ */ jsx("div", { className: "ds-cta-card", children: Content }) : Content });
+    return /* @__PURE__ */ jsx(SectionShell, { ref, className: clsx21(className), ...props, children: isBoxed ? /* @__PURE__ */ jsx("div", { className: "ds-cta-card", children: Content }) : Content });
   }
 );
 CTASection.displayName = "CTASection";
 var StatsSection = forwardRef(
   ({ stats, title, subtitle, eyebrow, className, ...props }, ref) => {
-    return /* @__PURE__ */ jsxs(SectionShell, { ref, className: clsx44("ds-stats-section", className), ...props, children: [
+    return /* @__PURE__ */ jsxs(SectionShell, { ref, className: clsx21("ds-stats-section", className), ...props, children: [
       /* @__PURE__ */ jsx(SectionHeader, { title, subtitle, eyebrow }),
       /* @__PURE__ */ jsx("div", { className: "ds-stats-grid", children: stats.map((stat, idx) => /* @__PURE__ */ jsxs("div", { className: "ds-stat-card", children: [
         /* @__PURE__ */ jsxs("div", { className: "ds-stat-value", children: [
@@ -3894,7 +3589,7 @@ var StarRating = forwardRef(
       return /* @__PURE__ */ jsxs(
         "span",
         {
-          className: clsx44(
+          className: clsx21(
             "ds-star-rating__star",
             visible && "ds-star-rating__star--visible"
           ),
@@ -3953,7 +3648,7 @@ var StarRating = forwardRef(
           if (typeof ref === "function") ref(node);
           else if (ref) ref.current = node;
         },
-        className: clsx44("ds-star-rating", `ds-star-rating--${size}`, className),
+        className: clsx21("ds-star-rating", `ds-star-rating--${size}`, className),
         role: "img",
         "aria-label": `${clampedValue} out of ${max} stars`,
         ...props,
@@ -4026,7 +3721,7 @@ var PlatformBadge = forwardRef(
       "div",
       {
         ref,
-        className: clsx44(
+        className: clsx21(
           "ds-platform-badge",
           `ds-platform-badge--${variant}`,
           `ds-platform-badge--${size}`,
@@ -4354,7 +4049,7 @@ var SocialProofCard = forwardRef(
     metrics,
     ...props
   }, ref) => {
-    const cardClass = clsx44(
+    const cardClass = clsx21(
       "ds-social-card",
       `ds-social-card--${variant}`,
       animationDelay != null && "ds-social-card--animated",
@@ -4511,7 +4206,7 @@ var SocialProofGrid = forwardRef(
       const childProps = child.props;
       return React30.cloneElement(child, {
         style: { ...childProps.style, "--card-delay": `${delay}ms` },
-        className: clsx44(childProps.className, "ds-social-card--animated")
+        className: clsx21(childProps.className, "ds-social-card--animated")
       });
     }) : children;
     return /* @__PURE__ */ jsx(
@@ -4519,9 +4214,9 @@ var SocialProofGrid = forwardRef(
       {
         ref,
         padding: "md",
-        className: clsx44("ds-social-proof", className),
+        className: clsx21("ds-social-proof", className),
         ...props,
-        children: masonry ? /* @__PURE__ */ jsx("div", { className: "ds-social-masonry", children: enhancedChildren }) : /* @__PURE__ */ jsx("div", { className: clsx44("ds-social-grid", `ds-social-grid--${columns}-col`), children: enhancedChildren })
+        children: masonry ? /* @__PURE__ */ jsx("div", { className: "ds-social-masonry", children: enhancedChildren }) : /* @__PURE__ */ jsx("div", { className: clsx21("ds-social-grid", `ds-social-grid--${columns}-col`), children: enhancedChildren })
       }
     );
   }
@@ -4551,14 +4246,14 @@ var LogoItemRender = ({ item, className }) => {
       {
         href: item.href,
         context: "social-proof-logo",
-        className: clsx44("ds-social-logos__item", className),
+        className: clsx21("ds-social-logos__item", className),
         title: item.alt,
         openInNewTab: !isInternal,
         children: innerContent
       }
     );
   }
-  return /* @__PURE__ */ jsx("div", { className: clsx44("ds-social-logos__item", className), title: item.alt, children: innerContent });
+  return /* @__PURE__ */ jsx("div", { className: clsx21("ds-social-logos__item", className), title: item.alt, children: innerContent });
 };
 var SocialProofLogos = forwardRef(
   ({ title, logos, variant = "grid", speed = 40, className, ...props }, ref) => {
@@ -4567,7 +4262,7 @@ var SocialProofLogos = forwardRef(
       {
         ref,
         padding: "sm",
-        className: clsx44("ds-social-logos", className),
+        className: clsx21("ds-social-logos", className),
         ...props,
         children: [
           title && /* @__PURE__ */ jsx(
@@ -4620,12 +4315,12 @@ var SocialProofFeatured = forwardRef(
       {
         ref,
         padding: "md",
-        className: clsx44("ds-social-featured-section", className),
+        className: clsx21("ds-social-featured-section", className),
         ...props,
         children: /* @__PURE__ */ jsxs(
           "div",
           {
-            className: clsx44(
+            className: clsx21(
               "ds-social-featured",
               `ds-social-featured--${effectiveOrientation}`,
               `ds-social-featured--${featuredVariant}`
@@ -4776,7 +4471,7 @@ var SocialProofCarousel = forwardRef(
         ref,
         padding: "none",
         containerFluid: true,
-        className: clsx44("ds-social-carousel", className),
+        className: clsx21("ds-social-carousel", className),
         ...props,
         children: /* @__PURE__ */ jsxs(
           motion.div,
@@ -4806,7 +4501,7 @@ function getShortsEmbedUrl(url) {
 }
 function VerticalVideoGrid({ urls, className }) {
   if (!urls || urls.length === 0) return null;
-  return /* @__PURE__ */ jsx(SectionShell, { className: clsx44("ds-vertical-video-grid my-16", className), children: /* @__PURE__ */ jsx("div", { className: "grid grid-cols-2 md:grid-cols-4 gap-4 md:gap-6 max-w-6xl mx-auto", children: urls.map((url, i) => /* @__PURE__ */ jsx(
+  return /* @__PURE__ */ jsx(SectionShell, { className: clsx21("ds-vertical-video-grid my-16", className), children: /* @__PURE__ */ jsx("div", { className: "grid grid-cols-2 md:grid-cols-4 gap-4 md:gap-6 max-w-6xl mx-auto", children: urls.map((url, i) => /* @__PURE__ */ jsx(
     "div",
     {
       className: "relative w-full overflow-hidden rounded-[20px] shadow-lg border border-white/10 bg-black",
@@ -4845,7 +4540,7 @@ var Sidebar = React30.forwardRef(
       "aside",
       {
         ref,
-        className: clsx44(
+        className: clsx21(
           "ds-sidebar",
           `ds-sidebar--${position}`,
           collapsed && "ds-sidebar--collapsed",
@@ -4860,7 +4555,7 @@ var Sidebar = React30.forwardRef(
 Sidebar.displayName = "Sidebar";
 var SidebarSection = React30.forwardRef(
   ({ title, className, children }, ref) => {
-    return /* @__PURE__ */ jsxs("div", { ref, className: clsx44("ds-sidebar__section", className), children: [
+    return /* @__PURE__ */ jsxs("div", { ref, className: clsx21("ds-sidebar__section", className), children: [
       title && /* @__PURE__ */ jsx("h3", { className: "ds-sidebar__section-title", children: title }),
       children
     ] });
@@ -4873,7 +4568,7 @@ var SidebarItem = React30.forwardRef(
       "button",
       {
         ref,
-        className: clsx44("ds-sidebar__item", active && "ds-sidebar__item--active", className),
+        className: clsx21("ds-sidebar__item", active && "ds-sidebar__item--active", className),
         onClick,
         type: "button",
         children: [
@@ -4891,7 +4586,7 @@ var FloatingTabBar = React30.forwardRef(
       "nav",
       {
         ref,
-        className: clsx44("ds-floating-tab-bar", `ds-floating-tab-bar--${position}`, className),
+        className: clsx21("ds-floating-tab-bar", `ds-floating-tab-bar--${position}`, className),
         role: "tablist",
         children
       }
@@ -4905,7 +4600,7 @@ var TabItem = React30.forwardRef(
       "button",
       {
         ref,
-        className: clsx44("ds-tab-item", active && "ds-tab-item--active", className),
+        className: clsx21("ds-tab-item", active && "ds-tab-item--active", className),
         onClick,
         role: "tab",
         "aria-selected": active,
@@ -4919,8 +4614,6 @@ var TabItem = React30.forwardRef(
   }
 );
 TabItem.displayName = "TabItem";
-var EASE_OUT3 = [0.2, 0.8, 0.2, 1];
-var EASE_IN3 = [0.4, 0, 1, 1];
 var GlobeIcon = () => /* @__PURE__ */ jsxs(
   "svg",
   {
@@ -4970,20 +4663,6 @@ var CheckIcon = () => /* @__PURE__ */ jsx(
     children: /* @__PURE__ */ jsx("polyline", { points: "20 6 9 17 4 12" })
   }
 );
-var PANEL_VARIANTS2 = {
-  hidden: {
-    opacity: 0,
-    y: -8,
-    scale: 0.95,
-    transition: { duration: 0.15, ease: EASE_IN3 }
-  },
-  visible: {
-    opacity: 1,
-    y: 0,
-    scale: 1,
-    transition: { duration: 0.2, ease: EASE_OUT3 }
-  }
-};
 var LocaleDropdown = forwardRef(
   ({
     locales,
@@ -5086,7 +4765,7 @@ var LocaleDropdown = forwardRef(
       "div",
       {
         ref,
-        className: clsx44(
+        className: clsx21(
           "ds-locale-dropdown",
           direction === "up" && "ds-locale-dropdown--up",
           align === "left" && "ds-locale-dropdown--align-left",
@@ -5111,29 +4790,25 @@ var LocaleDropdown = forwardRef(
                 /* @__PURE__ */ jsx("span", { className: "ds-locale-dropdown__trigger-icon", children: /* @__PURE__ */ jsx(GlobeIcon, {}) }),
                 currentLocale.flag && /* @__PURE__ */ jsx("span", { className: "ds-locale-dropdown__trigger-flag", "aria-hidden": "true", children: currentLocale.flag }),
                 /* @__PURE__ */ jsx(
-                  motion.span,
+                  "span",
                   {
                     className: "ds-locale-dropdown__trigger-chevron",
-                    animate: { rotate: isOpen ? 180 : 0 },
-                    transition: { duration: 0.2, ease: EASE_OUT3 },
+                    "data-state": isOpen ? "open" : "closed",
                     children: /* @__PURE__ */ jsx(ChevronDownIcon, {})
                   }
                 )
               ]
             }
           ),
-          /* @__PURE__ */ jsx(AnimatePresence, { children: isOpen && /* @__PURE__ */ jsx(
-            motion.div,
+          /* @__PURE__ */ jsx(
+            "div",
             {
               ref: listRef,
               id: listboxId,
               className: "ds-locale-dropdown__panel",
               role: "listbox",
               "aria-label": "Select language",
-              variants: PANEL_VARIANTS2,
-              initial: "hidden",
-              animate: "visible",
-              exit: "hidden",
+              "data-state": isOpen ? "open" : "closed",
               onKeyDown: handleKeyDown,
               children: locales.map((locale, index) => {
                 const isActive = locale.code === activeLocale;
@@ -5143,7 +4818,7 @@ var LocaleDropdown = forwardRef(
                   id: optionId,
                   role: "option",
                   "aria-selected": isActive,
-                  className: clsx44(
+                  className: clsx21(
                     "ds-locale-dropdown__option",
                     isActive && "ds-locale-dropdown__option--active",
                     isFocused && "ds-locale-dropdown__option--focused"
@@ -5160,7 +4835,7 @@ var LocaleDropdown = forwardRef(
                 ] }, locale.code);
               })
             }
-          ) })
+          )
         ] })
       }
     );
@@ -5173,7 +4848,7 @@ var Tabs = React30.forwardRef(
       Tabs$1.Root,
       {
         ref,
-        className: clsx44("ds-tabs", `ds-tabs--${orientation}`, className),
+        className: clsx21("ds-tabs", `ds-tabs--${orientation}`, className),
         orientation,
         ...props
       }
@@ -5183,19 +4858,19 @@ var Tabs = React30.forwardRef(
 Tabs.displayName = "Tabs";
 var TabsList = React30.forwardRef(
   ({ className, ...props }, ref) => {
-    return /* @__PURE__ */ jsx(Tabs$1.List, { ref, className: clsx44("ds-tabs__list", className), ...props });
+    return /* @__PURE__ */ jsx(Tabs$1.List, { ref, className: clsx21("ds-tabs__list", className), ...props });
   }
 );
 TabsList.displayName = "TabsList";
 var TabsTrigger = React30.forwardRef(
   ({ className, children, ...props }, ref) => {
-    return /* @__PURE__ */ jsx(Tabs$1.Tab, { ref, className: clsx44("ds-tabs__trigger", className), ...props, children });
+    return /* @__PURE__ */ jsx(Tabs$1.Tab, { ref, className: clsx21("ds-tabs__trigger", className), ...props, children });
   }
 );
 TabsTrigger.displayName = "TabsTrigger";
 var TabsContent = React30.forwardRef(
   ({ className, ...props }, ref) => {
-    return /* @__PURE__ */ jsx(Tabs$1.Panel, { ref, className: clsx44("ds-tabs__content", className), ...props });
+    return /* @__PURE__ */ jsx(Tabs$1.Panel, { ref, className: clsx21("ds-tabs__content", className), ...props });
   }
 );
 TabsContent.displayName = "TabsContent";
@@ -5272,7 +4947,7 @@ var Shell = React30.forwardRef(
       "div",
       {
         ref,
-        className: clsx44("ds-shell", `ds-shell--${computedLayout}`, className),
+        className: clsx21("ds-shell", `ds-shell--${computedLayout}`, className),
         "data-shell-layout": computedLayout,
         children: [
           (computedLayout === "left" || computedLayout === "right") && /* @__PURE__ */ jsxs(Sidebar, { position: computedLayout, children: [
@@ -5316,28 +4991,28 @@ var Shell = React30.forwardRef(
 Shell.displayName = "Shell";
 var DataTable = React30.forwardRef(
   ({ className, children, ...props }, ref) => {
-    return /* @__PURE__ */ jsx("div", { className: "ds-data-table-container", children: /* @__PURE__ */ jsx("table", { ref, className: clsx44("ds-data-table", className), ...props, children }) });
+    return /* @__PURE__ */ jsx("div", { className: "ds-data-table-container", children: /* @__PURE__ */ jsx("table", { ref, className: clsx21("ds-data-table", className), ...props, children }) });
   }
 );
 DataTable.displayName = "DataTable";
 var DataTableHeader = React30.forwardRef(({ className, ...props }, ref) => {
-  return /* @__PURE__ */ jsx("thead", { ref, className: clsx44("ds-data-table__header", className), ...props });
+  return /* @__PURE__ */ jsx("thead", { ref, className: clsx21("ds-data-table__header", className), ...props });
 });
 DataTableHeader.displayName = "DataTableHeader";
 var DataTableBody = React30.forwardRef(({ className, ...props }, ref) => {
-  return /* @__PURE__ */ jsx("tbody", { ref, className: clsx44("ds-data-table__body", className), ...props });
+  return /* @__PURE__ */ jsx("tbody", { ref, className: clsx21("ds-data-table__body", className), ...props });
 });
 DataTableBody.displayName = "DataTableBody";
 var DataTableRow = React30.forwardRef(({ className, ...props }, ref) => {
-  return /* @__PURE__ */ jsx("tr", { ref, className: clsx44("ds-data-table__row", className), ...props });
+  return /* @__PURE__ */ jsx("tr", { ref, className: clsx21("ds-data-table__row", className), ...props });
 });
 DataTableRow.displayName = "DataTableRow";
 var DataTableHead = React30.forwardRef(({ className, ...props }, ref) => {
-  return /* @__PURE__ */ jsx("th", { ref, className: clsx44("ds-data-table__head", className), ...props });
+  return /* @__PURE__ */ jsx("th", { ref, className: clsx21("ds-data-table__head", className), ...props });
 });
 DataTableHead.displayName = "DataTableHead";
 var DataTableCell = React30.forwardRef(({ className, ...props }, ref) => {
-  return /* @__PURE__ */ jsx("td", { ref, className: clsx44("ds-data-table__cell", className), ...props });
+  return /* @__PURE__ */ jsx("td", { ref, className: clsx21("ds-data-table__cell", className), ...props });
 });
 DataTableCell.displayName = "DataTableCell";
 function getEmbedUrl(src) {
@@ -5374,7 +5049,7 @@ var VideoLightbox = forwardRef(
       setOpen(true);
       onPlay?.();
     }, [onPlay]);
-    return /* @__PURE__ */ jsx("div", { ref, className: clsx44("ds-video-lightbox", className), children: /* @__PURE__ */ jsxs(Dialog$1.Root, { open, onOpenChange: setOpen, children: [
+    return /* @__PURE__ */ jsx("div", { ref, className: clsx21("ds-video-lightbox", className), children: /* @__PURE__ */ jsxs(Dialog$1.Root, { open, onOpenChange: setOpen, children: [
       /* @__PURE__ */ jsx(
         Dialog$1.Trigger,
         {
@@ -5476,7 +5151,7 @@ var AnnouncementBar = forwardRef(
       "div",
       {
         ref,
-        className: clsx44(
+        className: clsx21(
           "ds-announcement-bar",
           `ds-announcement-bar--${variant}`,
           href && "ds-announcement-bar--clickable",
@@ -5539,7 +5214,7 @@ var StickyActionBar = forwardRef(
       "div",
       {
         ref,
-        className: clsx44(
+        className: clsx21(
           "ds-sticky-action-bar",
           `ds-sticky-action-bar--${position}`,
           `ds-sticky-action-bar--${variant}`,
@@ -5564,7 +5239,7 @@ var Badge = React30.forwardRef(
       "span",
       {
         ref,
-        className: clsx44("ds-badge", `ds-badge--${variant}`, className),
+        className: clsx21("ds-badge", `ds-badge--${variant}`, className),
         ...props
       }
     );
@@ -5585,7 +5260,7 @@ var PricingToggle = forwardRef(
       "div",
       {
         ref,
-        className: clsx44("ds-pricing-toggle", className),
+        className: clsx21("ds-pricing-toggle", className),
         ...props,
         children: [
           /* @__PURE__ */ jsxs(
@@ -5654,7 +5329,7 @@ var BookingEmbed = forwardRef(
           if (typeof ref === "function") ref(node);
           else if (ref) ref.current = node;
         },
-        className: clsx44("ds-booking-embed", className),
+        className: clsx21("ds-booking-embed", className),
         style: { "--embed-aspect-ratio": aspectRatio, ...style },
         ...props,
         children: [
@@ -5667,7 +5342,7 @@ var BookingEmbed = forwardRef(
             {
               src: url,
               title,
-              className: clsx44("ds-booking-embed__iframe", isIframeLoaded && "ds-booking-embed__iframe--loaded"),
+              className: clsx21("ds-booking-embed__iframe", isIframeLoaded && "ds-booking-embed__iframe--loaded"),
               onLoad: handleIframeLoad,
               frameBorder: "0",
               scrolling: "no"
@@ -5693,7 +5368,7 @@ var ProblemAgitation = forwardRef(
       "section",
       {
         ref,
-        className: clsx44("ds-problem-agitation", className),
+        className: clsx21("ds-problem-agitation", className),
         ...props,
         children: [
           /* @__PURE__ */ jsxs("div", { className: "ds-problem-agitation__header", children: [
@@ -5766,7 +5441,7 @@ var ProcessTimeline = forwardRef(
           if (typeof ref === "function") ref(node);
           else if (ref) ref.current = node;
         },
-        className: clsx44(
+        className: clsx21(
           "ds-process-timeline",
           animated && "ds-process-timeline--animated",
           className
@@ -5786,7 +5461,7 @@ var ProcessTimeline = forwardRef(
             return /* @__PURE__ */ jsxs(
               "div",
               {
-                className: clsx44(
+                className: clsx21(
                   "ds-process-timeline__step",
                   isActive && "ds-process-timeline__step--active"
                 ),
@@ -5828,7 +5503,7 @@ var PricingCard = React30.forwardRef(
       "div",
       {
         ref,
-        className: clsx44(
+        className: clsx21(
           "ds-pricing-card",
           highlighted && "ds-pricing-card--highlighted",
           className
@@ -5850,7 +5525,7 @@ var PricingCard = React30.forwardRef(
           features.length > 0 && /* @__PURE__ */ jsx("ul", { className: "ds-pricing-card__features", children: features.map((feature, idx) => /* @__PURE__ */ jsxs(
             "li",
             {
-              className: clsx44(
+              className: clsx21(
                 "ds-pricing-card__feature",
                 feature.included === false && "ds-pricing-card__feature--excluded"
               ),
@@ -5892,7 +5567,7 @@ var PricingSection = forwardRef(
       "section",
       {
         ref,
-        className: clsx44("ds-pricing-section", className),
+        className: clsx21("ds-pricing-section", className),
         ...props,
         children: [
           /* @__PURE__ */ jsxs("div", { className: "ds-pricing-section__header", children: [
@@ -5904,7 +5579,7 @@ var PricingSection = forwardRef(
             PricingCard,
             {
               ...plan,
-              className: clsx44(
+              className: clsx21(
                 "ds-pricing-section__card",
                 plan.highlighted && "ds-pricing-section__card--popular"
               )
@@ -5967,7 +5642,7 @@ var LeadCaptureForm = forwardRef(
       "form",
       {
         ref,
-        className: clsx44(
+        className: clsx21(
           "ds-lead-capture",
           `ds-lead-capture--${layout}`,
           className
@@ -5989,7 +5664,7 @@ var LeadCaptureForm = forwardRef(
                   placeholder: emailPlaceholder,
                   disabled: isCurrentlyLoading,
                   "aria-label": layout === "horizontal" ? emailLabel : void 0,
-                  className: clsx44("ds-lead-capture__input", error && "ds-lead-capture__input--error")
+                  className: clsx21("ds-lead-capture__input", error && "ds-lead-capture__input--error")
                 }
               ),
               error && /* @__PURE__ */ jsx("div", { className: "ds-lead-capture__error", children: error })
@@ -6038,7 +5713,7 @@ var ArticleCard = forwardRef(
         ref,
         href,
         context: "article-card",
-        className: clsx44(
+        className: clsx21(
           "ds-article-card",
           `ds-article-card--${variant}`,
           !imageUrl && "ds-article-card--no-image",
@@ -6124,7 +5799,7 @@ var ArticleLayout = forwardRef(
       "article",
       {
         ref,
-        className: clsx44("ds-article-layout", className),
+        className: clsx21("ds-article-layout", className),
         ...props,
         children: [
           /* @__PURE__ */ jsxs("header", { className: "ds-article-layout__header", children: [
@@ -6136,7 +5811,7 @@ var ArticleLayout = forwardRef(
             ] })
           ] }),
           heroImage && /* @__PURE__ */ jsx("div", { className: "ds-article-layout__hero", children: /* @__PURE__ */ jsx("img", { src: heroImage, alt: "", "aria-hidden": "true" }) }),
-          /* @__PURE__ */ jsxs("div", { className: clsx44(
+          /* @__PURE__ */ jsxs("div", { className: clsx21(
             "ds-article-layout__body",
             sidebar && "ds-article-layout__body--with-sidebar"
           ), children: [
@@ -6166,7 +5841,7 @@ var CaseStudyCard = forwardRef(
       "article",
       {
         ref,
-        className: clsx44("ds-case-study-card", className),
+        className: clsx21("ds-case-study-card", className),
         ...props,
         children: /* @__PURE__ */ jsxs(OutboundLink, { href, context: "case-study-card", className: "ds-case-study-card__link", openInNewTab: false, children: [
           coverImage && /* @__PURE__ */ jsx("div", { className: "ds-case-study-card__image-wrap", children: /* @__PURE__ */ jsx(
@@ -6276,7 +5951,7 @@ var MetricCounter = forwardRef(
           if (typeof ref === "function") ref(node);
           else if (ref) ref.current = node;
         },
-        className: clsx44("ds-metric-counter", className),
+        className: clsx21("ds-metric-counter", className),
         ...props,
         children: [
           /* @__PURE__ */ jsxs("div", { className: "ds-metric-counter__value-wrapper", children: [
@@ -6307,7 +5982,7 @@ var BrowserFrame = forwardRef(
       "div",
       {
         ref,
-        className: clsx44(
+        className: clsx21(
           "ds-browser-frame",
           `ds-browser-frame--${variant}`,
           withGlow && "ds-browser-frame--glow",
@@ -6400,7 +6075,7 @@ var VideoEmbed = forwardRef(
       "div",
       {
         ref: containerRef,
-        className: clsx44("ds-video-embed", withFrame && "ds-video-embed--framed", className),
+        className: clsx21("ds-video-embed", withFrame && "ds-video-embed--framed", className),
         style: { aspectRatio },
         children: !playing ? /* @__PURE__ */ jsxs(
           "button",
@@ -6536,7 +6211,7 @@ var ExitIntentOverlay = forwardRef(
         document.removeEventListener("mouseout", handleMouseOut);
       };
     }, [enabled, activationDelay, excludePaths, storageKey, suppressionDuration, show]);
-    return /* @__PURE__ */ jsx("div", { ref, className: clsx44("ds-exit-intent-overlay", className), ...props, children: /* @__PURE__ */ jsx(Dialog, { open, onOpenChange: (isOpen) => {
+    return /* @__PURE__ */ jsx("div", { ref, className: clsx21("ds-exit-intent-overlay", className), ...props, children: /* @__PURE__ */ jsx(Dialog, { open, onOpenChange: (isOpen) => {
       if (!isOpen) handleDismiss();
     }, children: /* @__PURE__ */ jsx(DialogContent, { className: "ds-exit-intent-overlay__dialog", children }) }) });
   }
@@ -6555,7 +6230,7 @@ var BeforeAfterBlock = forwardRef(
     const renderItems = (items, side) => items.map((item, i) => /* @__PURE__ */ jsxs(
       "li",
       {
-        className: clsx44(
+        className: clsx21(
           "ds-before-after__item",
           item.sentiment && `ds-before-after__item--${item.sentiment}`
         ),
@@ -6570,11 +6245,11 @@ var BeforeAfterBlock = forwardRef(
       SectionShell,
       {
         ref,
-        className: clsx44("ds-before-after", className),
+        className: clsx21("ds-before-after", className),
         ...props,
         children: [
           /* @__PURE__ */ jsx(SectionHeader, { eyebrow, title }),
-          /* @__PURE__ */ jsxs("div", { className: clsx44("ds-before-after__layout", `ds-before-after__layout--${variant}`), children: [
+          /* @__PURE__ */ jsxs("div", { className: clsx21("ds-before-after__layout", `ds-before-after__layout--${variant}`), children: [
             /* @__PURE__ */ jsxs("div", { className: "ds-before-after__column ds-before-after__column--before", children: [
               /* @__PURE__ */ jsx("h3", { className: "ds-before-after__label", children: before.label }),
               /* @__PURE__ */ jsx("ul", { className: "ds-before-after__list", children: renderItems(before.items, "before") }),
@@ -6610,7 +6285,7 @@ var CompetitorDiff = forwardRef(
       SectionShell,
       {
         ref,
-        className: clsx44("ds-competitor-diff", className),
+        className: clsx21("ds-competitor-diff", className),
         ...props,
         children: [
           /* @__PURE__ */ jsx(SectionHeader, { eyebrow, title, subtitle }),
@@ -6688,7 +6363,7 @@ var StakeholderTabs = forwardRef(
       SectionShell,
       {
         ref,
-        className: clsx44("ds-stakeholder-tabs", className),
+        className: clsx21("ds-stakeholder-tabs", className),
         ...props,
         children: [
           /* @__PURE__ */ jsx(SectionHeader, { eyebrow, title }),
@@ -6738,7 +6413,7 @@ var IntegrationShowcase = forwardRef(
       SectionShell,
       {
         ref,
-        className: clsx44("ds-integration-showcase", className),
+        className: clsx21("ds-integration-showcase", className),
         ...props,
         children: [
           /* @__PURE__ */ jsx(SectionHeader, { eyebrow, title, subtitle }),
@@ -6753,7 +6428,7 @@ var IntegrationShowcase = forwardRef(
               ]
             }
           ),
-          /* @__PURE__ */ jsx("div", { className: clsx44("ds-integration-showcase__grid", `ds-integration-showcase__grid--${variant}`), children: filtered.map((integration, i) => {
+          /* @__PURE__ */ jsx("div", { className: clsx21("ds-integration-showcase__grid", `ds-integration-showcase__grid--${variant}`), children: filtered.map((integration, i) => {
             const Card2 = /* @__PURE__ */ jsxs("div", { className: "ds-integration-showcase__card", children: [
               /* @__PURE__ */ jsx("div", { className: "ds-integration-showcase__logo", children: integration.logo }),
               /* @__PURE__ */ jsxs("div", { className: "ds-integration-showcase__info", children: [
@@ -6787,11 +6462,11 @@ var SecurityBlock = forwardRef(
       SectionShell,
       {
         ref,
-        className: clsx44("ds-security-block", className),
+        className: clsx21("ds-security-block", className),
         ...props,
         children: [
           /* @__PURE__ */ jsx(SectionHeader, { eyebrow, title, subtitle }),
-          certifications && certifications.length > 0 && /* @__PURE__ */ jsx("div", { className: clsx44("ds-security-block__certs", `ds-security-block__certs--${variant}`), children: certifications.map((cert, i) => {
+          certifications && certifications.length > 0 && /* @__PURE__ */ jsx("div", { className: clsx21("ds-security-block__certs", `ds-security-block__certs--${variant}`), children: certifications.map((cert, i) => {
             const inner = /* @__PURE__ */ jsxs("div", { className: "ds-security-block__cert", children: [
               /* @__PURE__ */ jsx("div", { className: "ds-security-block__cert-icon", children: cert.icon }),
               /* @__PURE__ */ jsxs("div", { className: "ds-security-block__cert-info", children: [
@@ -6830,7 +6505,7 @@ var AuthorBio = forwardRef(
       "div",
       {
         ref,
-        className: clsx44("ds-author-bio", `ds-author-bio--${variant}`, className),
+        className: clsx21("ds-author-bio", `ds-author-bio--${variant}`, className),
         ...props,
         children: [
           /* @__PURE__ */ jsxs(Avatar, { size: variant === "compact" ? "sm" : variant === "longform" ? "lg" : "md", className: "ds-author-bio__avatar", children: [
@@ -7452,7 +7127,7 @@ var TableOfContents = forwardRef(
       "nav",
       {
         ref,
-        className: clsx44("ds-toc", `ds-toc--${position}`, className),
+        className: clsx21("ds-toc", `ds-toc--${position}`, className),
         "aria-label": finalLabel,
         ...props,
         children: [
@@ -7461,7 +7136,7 @@ var TableOfContents = forwardRef(
             "button",
             {
               type: "button",
-              className: clsx44(
+              className: clsx21(
                 "ds-toc__link",
                 activeId === item.id && "ds-toc__link--active"
               ),
@@ -7490,7 +7165,7 @@ var RelatedContent = forwardRef(
       SectionShell,
       {
         ref,
-        className: clsx44("ds-related-content", className),
+        className: clsx21("ds-related-content", className),
         background: "muted",
         ...props,
         children: [
@@ -7526,7 +7201,7 @@ var CaseStudySection = forwardRef(
       SectionShell,
       {
         ref,
-        className: clsx44("ds-case-study-section", className),
+        className: clsx21("ds-case-study-section", className),
         ...props,
         children: [
           /* @__PURE__ */ jsx(SectionHeader, { eyebrow, title, subtitle }),
@@ -7562,7 +7237,7 @@ var ManifestoBlock = forwardRef(
       SectionShell,
       {
         ref,
-        className: clsx44("ds-manifesto", `ds-manifesto--${variant}`, className),
+        className: clsx21("ds-manifesto", `ds-manifesto--${variant}`, className),
         ...props,
         children: /* @__PURE__ */ jsxs("div", { className: "ds-manifesto__inner", children: [
           variant === "quote" && /* @__PURE__ */ jsx("span", { className: "ds-manifesto__quote-mark", "aria-hidden": "true", children: "\u201C" }),
@@ -7601,7 +7276,7 @@ var ComplianceGrid = forwardRef(
       SectionShell,
       {
         ref,
-        className: clsx44("ds-compliance-grid", className),
+        className: clsx21("ds-compliance-grid", className),
         ...props,
         children: [
           /* @__PURE__ */ jsx(SectionHeader, { eyebrow, title, subtitle }),
@@ -7609,7 +7284,7 @@ var ComplianceGrid = forwardRef(
             const inner = /* @__PURE__ */ jsxs(
               "div",
               {
-                className: clsx44(
+                className: clsx21(
                   "ds-compliance-grid__item",
                   `ds-compliance-grid__item--${item.status}`
                 ),
@@ -7620,7 +7295,7 @@ var ComplianceGrid = forwardRef(
                     /* @__PURE__ */ jsx(
                       Badge,
                       {
-                        className: clsx44(
+                        className: clsx21(
                           "ds-compliance-grid__status",
                           `ds-compliance-grid__status--${item.status}`
                         ),
@@ -7655,7 +7330,7 @@ var ArchitectureDiagram = forwardRef(
       "div",
       {
         ref,
-        className: clsx44(
+        className: clsx21(
           "ds-architecture",
           `ds-architecture--${direction}`,
           className
@@ -7668,7 +7343,7 @@ var ArchitectureDiagram = forwardRef(
             /* @__PURE__ */ jsx(
               "div",
               {
-                className: clsx44(
+                className: clsx21(
                   "ds-architecture__line",
                   connections.find(
                     (c) => c.from === nodes[i - 1]?.id && c.to === node.id
@@ -7686,7 +7361,7 @@ var ArchitectureDiagram = forwardRef(
           /* @__PURE__ */ jsxs(
             "div",
             {
-              className: clsx44(
+              className: clsx21(
                 "ds-architecture__node",
                 `ds-architecture__node--${node.type}`
               ),
@@ -7737,7 +7412,7 @@ var SegmentSwitch = forwardRef(
     }, [controlledSegment, source, utmParam, cookieName]);
     const content = resolvedSegment && segments[resolvedSegment] ? segments[resolvedSegment] : fallback;
     if (!content) return null;
-    return /* @__PURE__ */ jsx("div", { ref, className: clsx44(className), ...props, children: content });
+    return /* @__PURE__ */ jsx("div", { ref, className: clsx21(className), ...props, children: content });
   }
 );
 SegmentSwitch.displayName = "SegmentSwitch";
@@ -7800,7 +7475,7 @@ var IntentCTA = forwardRef(
       "div",
       {
         ref,
-        className: clsx44("ds-intent-cta", className),
+        className: clsx21("ds-intent-cta", className),
         ...props,
         children: /* @__PURE__ */ jsx(
           Button,
@@ -7817,7 +7492,7 @@ var IntentCTA = forwardRef(
 IntentCTA.displayName = "IntentCTA";
 var LongFormLayout = React30.forwardRef(
   ({ children, sidebar, className, ...props }, ref) => {
-    return /* @__PURE__ */ jsxs("div", { ref, className: clsx44("ds-longform-layout", className), ...props, children: [
+    return /* @__PURE__ */ jsxs("div", { ref, className: clsx21("ds-longform-layout", className), ...props, children: [
       /* @__PURE__ */ jsx("article", { className: "ds-longform-layout__main", children }),
       sidebar && /* @__PURE__ */ jsx("aside", { className: "ds-longform-layout__sidebar", children: sidebar })
     ] });
@@ -7826,7 +7501,7 @@ var LongFormLayout = React30.forwardRef(
 LongFormLayout.displayName = "LongFormLayout";
 var InsightCallout = React30.forwardRef(
   ({ children, icon, title, className, ...props }, ref) => {
-    return /* @__PURE__ */ jsxs("aside", { ref, className: clsx44("ds-insight-callout", className), ...props, children: [
+    return /* @__PURE__ */ jsxs("aside", { ref, className: clsx21("ds-insight-callout", className), ...props, children: [
       icon && /* @__PURE__ */ jsx("div", { className: "ds-insight-callout__icon", children: icon }),
       /* @__PURE__ */ jsxs("div", { className: "ds-insight-callout__content", children: [
         title && /* @__PURE__ */ jsx("h5", { className: "ds-insight-callout__title", children: title }),
@@ -7838,7 +7513,7 @@ var InsightCallout = React30.forwardRef(
 InsightCallout.displayName = "InsightCallout";
 var DataHighlight = React30.forwardRef(
   ({ stat, label, children, className, ...props }, ref) => {
-    return /* @__PURE__ */ jsxs("figure", { ref, className: clsx44("ds-data-highlight", className), ...props, children: [
+    return /* @__PURE__ */ jsxs("figure", { ref, className: clsx21("ds-data-highlight", className), ...props, children: [
       /* @__PURE__ */ jsxs("div", { className: "ds-data-highlight__stat-group", children: [
         /* @__PURE__ */ jsx("span", { className: "ds-data-highlight__stat", children: stat }),
         /* @__PURE__ */ jsx("span", { className: "ds-data-highlight__label", children: label })
@@ -7896,7 +7571,7 @@ var ReadingProgress = React30.forwardRef(
       "div",
       {
         ref,
-        className: clsx44("ds-reading-progress", className),
+        className: clsx21("ds-reading-progress", className),
         ...props,
         children: /* @__PURE__ */ jsx(
           "div",
@@ -7918,7 +7593,7 @@ var VersionedUpgradeAlert = React30.forwardRef(
       "div",
       {
         ref,
-        className: clsx44("ds-versioned-alert", className),
+        className: clsx21("ds-versioned-alert", className),
         role: "alert",
         ...props,
         children: [
@@ -7967,7 +7642,7 @@ VersionedUpgradeAlert.displayName = "VersionedUpgradeAlert";
 var VersionedSeriesNavigator = React30.forwardRef(
   ({ seriesName, hubUrl, editions, className, ...props }, ref) => {
     const sortedEditions = [...editions].sort((a, b) => a.year - b.year);
-    return /* @__PURE__ */ jsxs("div", { ref, className: clsx44("ds-versioned-navigator", className), ...props, children: [
+    return /* @__PURE__ */ jsxs("div", { ref, className: clsx21("ds-versioned-navigator", className), ...props, children: [
       /* @__PURE__ */ jsxs("div", { className: "ds-versioned-navigator__header", children: [
         /* @__PURE__ */ jsx("span", { className: "ds-versioned-navigator__label", children: "Series" }),
         /* @__PURE__ */ jsxs(OutboundLink, { href: hubUrl, context: "versioned-navigator-hub", className: "ds-versioned-navigator__title", openInNewTab: false, children: [
@@ -7982,7 +7657,7 @@ var VersionedSeriesNavigator = React30.forwardRef(
           {
             href: edition.url,
             context: "versioned-navigator-edition",
-            className: clsx44(
+            className: clsx21(
               "ds-versioned-navigator__node",
               edition.isCurrent && "ds-versioned-navigator__node--active"
             ),
@@ -8011,7 +7686,7 @@ var EvolutionTimeline = forwardRef(
       SectionShell,
       {
         ref,
-        className: clsx44("ds-evolution-timeline", className),
+        className: clsx21("ds-evolution-timeline", className),
         ...props,
         children: [
           /* @__PURE__ */ jsx(SectionHeader, { eyebrow, title, subtitle }),
@@ -8020,7 +7695,7 @@ var EvolutionTimeline = forwardRef(
             eras.map((era, i) => /* @__PURE__ */ jsxs(
               "div",
               {
-                className: clsx44(
+                className: clsx21(
                   "ds-evolution-timeline__era",
                   `ds-evolution-timeline__era--${era.sentiment}`,
                   era.current && "ds-evolution-timeline__era--current"
@@ -8066,7 +7741,7 @@ var EcosystemDiagram = forwardRef(
       SectionShell,
       {
         ref,
-        className: clsx44("ds-ecosystem", `ds-ecosystem--${variant}`, className),
+        className: clsx21("ds-ecosystem", `ds-ecosystem--${variant}`, className),
         ...props,
         children: [
           /* @__PURE__ */ jsx(SectionHeader, { eyebrow, title, subtitle }),
@@ -8120,7 +7795,7 @@ var ValueAnchor = forwardRef(
       SectionShell,
       {
         ref,
-        className: clsx44("ds-value-anchor", className),
+        className: clsx21("ds-value-anchor", className),
         ...props,
         children: [
           /* @__PURE__ */ jsx(SectionHeader, { eyebrow, title, subtitle }),
@@ -8201,7 +7876,7 @@ var EnterpriseSignaling = forwardRef(
         "div",
         {
           ref,
-          className: clsx44("ds-enterprise-signaling", "ds-enterprise-signaling--strip", className),
+          className: clsx21("ds-enterprise-signaling", "ds-enterprise-signaling--strip", className),
           ...props,
           children: /* @__PURE__ */ jsx("div", { className: "ds-enterprise-signaling__strip-inner", children: categories.flatMap((cat) => cat.items.filter((i) => i.status === "active")).map((item, i) => /* @__PURE__ */ jsx("span", { className: "ds-enterprise-signaling__strip-item", children: item.name }, i)) })
         }
@@ -8211,7 +7886,7 @@ var EnterpriseSignaling = forwardRef(
       SectionShell,
       {
         ref,
-        className: clsx44("ds-enterprise-signaling", `ds-enterprise-signaling--${variant}`, className),
+        className: clsx21("ds-enterprise-signaling", `ds-enterprise-signaling--${variant}`, className),
         ...props,
         children: [
           /* @__PURE__ */ jsx(SectionHeader, { eyebrow, title, subtitle }),
@@ -8224,7 +7899,7 @@ var EnterpriseSignaling = forwardRef(
               const inner = /* @__PURE__ */ jsxs(
                 "div",
                 {
-                  className: clsx44(
+                  className: clsx21(
                     "ds-enterprise-signaling__item",
                     `ds-enterprise-signaling__item--${item.status}`
                   ),
@@ -8233,7 +7908,7 @@ var EnterpriseSignaling = forwardRef(
                     /* @__PURE__ */ jsx(
                       Badge,
                       {
-                        className: clsx44("ds-enterprise-signaling__item-status", `ds-enterprise-signaling__item-status--${item.status}`),
+                        className: clsx21("ds-enterprise-signaling__item-status", `ds-enterprise-signaling__item-status--${item.status}`),
                         variant: "outline",
                         children: STATUS_LABELS2[item.status]
                       }
@@ -8312,7 +7987,7 @@ var IntelligenceBlock = forwardRef(
       SectionShell,
       {
         ref,
-        className: clsx44("ds-intelligence", `ds-intelligence--${variant}`, className),
+        className: clsx21("ds-intelligence", `ds-intelligence--${variant}`, className),
         ...props,
         children: [
           /* @__PURE__ */ jsx(SectionHeader, { eyebrow, title, subtitle }),
@@ -8367,7 +8042,7 @@ var PartnerValueProp = forwardRef(
       SectionShell,
       {
         ref,
-        className: clsx44("ds-partner-vp", className),
+        className: clsx21("ds-partner-vp", className),
         ...props,
         children: [
           /* @__PURE__ */ jsx(SectionHeader, { eyebrow, title, subtitle }),
@@ -8449,7 +8124,7 @@ var PartnerValueProp = forwardRef(
 PartnerValueProp.displayName = "PartnerValueProp";
 var ComparisonTable = React30.forwardRef(
   ({ columns, rows, caption, className, ...props }, ref) => {
-    return /* @__PURE__ */ jsx("div", { ref, className: clsx44("ds-comparison-table", className), ...props, children: /* @__PURE__ */ jsx("div", { className: "ds-comparison-table__scroll", children: /* @__PURE__ */ jsxs("table", { className: "ds-comparison-table__table", role: "table", children: [
+    return /* @__PURE__ */ jsx("div", { ref, className: clsx21("ds-comparison-table", className), ...props, children: /* @__PURE__ */ jsx("div", { className: "ds-comparison-table__scroll", children: /* @__PURE__ */ jsxs("table", { className: "ds-comparison-table__table", role: "table", children: [
       caption && /* @__PURE__ */ jsx("caption", { className: "ds-comparison-table__caption", children: caption }),
       /* @__PURE__ */ jsx("thead", { className: "ds-comparison-table__head", children: /* @__PURE__ */ jsxs("tr", { children: [
         /* @__PURE__ */ jsx("th", { className: "ds-comparison-table__corner", scope: "col", children: /* @__PURE__ */ jsx("span", { className: "ds-visually-hidden", children: "Feature" }) }),
@@ -8457,7 +8132,7 @@ var ComparisonTable = React30.forwardRef(
           "th",
           {
             scope: "col",
-            className: clsx44(
+            className: clsx21(
               "ds-comparison-table__col-header",
               col.highlighted && "ds-comparison-table__col-header--highlighted"
             ),
@@ -8482,7 +8157,7 @@ var ComparisonTable = React30.forwardRef(
           row.values.map((val, colIdx) => /* @__PURE__ */ jsx(
             "td",
             {
-              className: clsx44(
+              className: clsx21(
                 "ds-comparison-table__cell",
                 columns[colIdx]?.highlighted && "ds-comparison-table__cell--highlighted"
               ),
@@ -8510,7 +8185,7 @@ var GuaranteeHighlight = React30.forwardRef(
       "div",
       {
         ref,
-        className: clsx44(
+        className: clsx21(
           "ds-guarantee",
           `ds-guarantee--${variant}`,
           className
@@ -8539,7 +8214,7 @@ var ROICalculator = React30.forwardRef(
     className,
     ...props
   }, ref) => {
-    return /* @__PURE__ */ jsxs("div", { ref, className: clsx44("ds-roi-calculator", className), ...props, children: [
+    return /* @__PURE__ */ jsxs("div", { ref, className: clsx21("ds-roi-calculator", className), ...props, children: [
       (eyebrow || title) && /* @__PURE__ */ jsxs("div", { className: "ds-roi-calculator__header", children: [
         eyebrow && /* @__PURE__ */ jsx("span", { className: "ds-roi-calculator__eyebrow", children: eyebrow }),
         title && /* @__PURE__ */ jsx("h3", { className: "ds-roi-calculator__title", children: title })
@@ -8547,7 +8222,7 @@ var ROICalculator = React30.forwardRef(
       /* @__PURE__ */ jsx("div", { className: "ds-roi-calculator__grid", children: items.map((item, idx) => /* @__PURE__ */ jsxs(
         "div",
         {
-          className: clsx44(
+          className: clsx21(
             "ds-roi-calculator__item",
             item.isRecommended && "ds-roi-calculator__item--recommended"
           ),
@@ -8581,7 +8256,7 @@ var ICPFilter = React30.forwardRef(
       "div",
       {
         ref,
-        className: clsx44(
+        className: clsx21(
           "ds-icp-filter",
           `ds-icp-filter--${variant}`,
           className
@@ -8641,7 +8316,7 @@ var ObjectionFAQ = React30.forwardRef(
       },
       [allowMultiple]
     );
-    return /* @__PURE__ */ jsxs("div", { ref, className: clsx44("ds-objection-faq", className), ...props, children: [
+    return /* @__PURE__ */ jsxs("div", { ref, className: clsx21("ds-objection-faq", className), ...props, children: [
       (title || subtitle) && /* @__PURE__ */ jsxs("div", { className: "ds-objection-faq__header", children: [
         title && /* @__PURE__ */ jsx("h3", { className: "ds-objection-faq__title", children: title }),
         subtitle && /* @__PURE__ */ jsx("p", { className: "ds-objection-faq__subtitle", children: subtitle })
@@ -8651,7 +8326,7 @@ var ObjectionFAQ = React30.forwardRef(
         return /* @__PURE__ */ jsxs(
           "div",
           {
-            className: clsx44(
+            className: clsx21(
               "ds-objection-faq__item",
               isOpen && "ds-objection-faq__item--open"
             ),
@@ -8712,7 +8387,7 @@ var StatusBadge = React30.forwardRef(
       "span",
       {
         ref,
-        className: clsx44(
+        className: clsx21(
           "ds-status-badge",
           `ds-status-badge--${variant}`,
           `ds-status-badge--${size}`,
@@ -8809,7 +8484,7 @@ var Alert = React30.forwardRef(
       {
         ref,
         role: "alert",
-        className: clsx44("ds-alert", `ds-alert--${variant}`, className),
+        className: clsx21("ds-alert", `ds-alert--${variant}`, className),
         ...props,
         children: [
           /* @__PURE__ */ jsx("div", { className: "ds-alert__icon", "aria-hidden": "true", children: renderedIcon }),
@@ -8839,7 +8514,7 @@ var ToastItem = ({
   onDismiss,
   dismissLabel = "Close"
 }) => {
-  return /* @__PURE__ */ jsxs("div", { className: clsx44("ds-toast-root", `ds-toast--${variant}`), "data-state": "open", role: "alert", children: [
+  return /* @__PURE__ */ jsxs("div", { className: clsx21("ds-toast-root", `ds-toast--${variant}`), "data-state": "open", role: "alert", children: [
     title && /* @__PURE__ */ jsx("div", { className: "ds-toast-title", children: title }),
     description && /* @__PURE__ */ jsx("div", { className: "ds-toast-description", children: description }),
     action && /* @__PURE__ */ jsx("div", { className: "ds-toast-action", children: action }),
@@ -8914,7 +8589,7 @@ var DropdownMenuTrigger = React30.forwardRef(({ className, ...props }, ref) => {
     Menu.Trigger,
     {
       ref,
-      className: clsx44("ds-dropdown-menu__trigger", className),
+      className: clsx21("ds-dropdown-menu__trigger", className),
       ...props
     }
   );
@@ -8933,7 +8608,7 @@ var DropdownMenuContent = React30.forwardRef(
           Menu.Popup,
           {
             ref,
-            className: clsx44("ds-dropdown-menu__content", className),
+            className: clsx21("ds-dropdown-menu__content", className),
             ...props
           }
         )
@@ -8944,21 +8619,21 @@ var DropdownMenuContent = React30.forwardRef(
 DropdownMenuContent.displayName = "DropdownMenuContent";
 var DropdownMenuItem = React30.forwardRef(
   ({ className, ...props }, ref) => {
-    return /* @__PURE__ */ jsx(Menu.Item, { ref, className: clsx44("ds-dropdown-menu__item", className), ...props });
+    return /* @__PURE__ */ jsx(Menu.Item, { ref, className: clsx21("ds-dropdown-menu__item", className), ...props });
   }
 );
 DropdownMenuItem.displayName = "DropdownMenuItem";
 var DropdownMenuSeparator = React30.forwardRef(({ className, ...props }, ref) => {
-  return /* @__PURE__ */ jsx("div", { ref, className: clsx44("ds-dropdown-menu__separator", className), ...props });
+  return /* @__PURE__ */ jsx("div", { ref, className: clsx21("ds-dropdown-menu__separator", className), ...props });
 });
 DropdownMenuSeparator.displayName = "DropdownMenuSeparator";
 var DropdownMenuLabel = React30.forwardRef(({ className, ...props }, ref) => {
-  return /* @__PURE__ */ jsx("div", { ref, className: clsx44("ds-dropdown-menu__label", className), ...props });
+  return /* @__PURE__ */ jsx("div", { ref, className: clsx21("ds-dropdown-menu__label", className), ...props });
 });
 DropdownMenuLabel.displayName = "DropdownMenuLabel";
 var EmptyState = React30.forwardRef(
   ({ icon, title, description, action, className, ...props }, ref) => {
-    return /* @__PURE__ */ jsxs("div", { ref, className: clsx44("ds-empty-state", className), ...props, children: [
+    return /* @__PURE__ */ jsxs("div", { ref, className: clsx21("ds-empty-state", className), ...props, children: [
       icon && /* @__PURE__ */ jsx("div", { className: "ds-empty-state__icon", children: icon }),
       /* @__PURE__ */ jsx("h3", { className: "ds-empty-state__title", children: title }),
       description && /* @__PURE__ */ jsx("p", { className: "ds-empty-state__description", children: description }),
@@ -9115,7 +8790,7 @@ var Login = ({
     e.preventDefault();
     onSubmit?.({ email, password, rememberMe });
   };
-  return /* @__PURE__ */ jsxs("div", { className: clsx44("ds-login", className), style, children: [
+  return /* @__PURE__ */ jsxs("div", { className: clsx21("ds-login", className), style, children: [
     /* @__PURE__ */ jsxs("div", { className: "ds-login__background", children: [
       /* @__PURE__ */ jsx("div", { className: "ds-login__accent ds-login__accent--1", "aria-hidden": "true" }),
       /* @__PURE__ */ jsx("div", { className: "ds-login__accent ds-login__accent--2", "aria-hidden": "true" })
@@ -9347,7 +9022,7 @@ var ChangeEmail = ({
     e.preventDefault();
     onSubmit?.({ newEmail, currentPassword });
   };
-  return /* @__PURE__ */ jsx("div", { className: clsx44("ds-change-email", className), style, children: /* @__PURE__ */ jsxs("div", { className: "ds-change-email__container", children: [
+  return /* @__PURE__ */ jsx("div", { className: clsx21("ds-change-email", className), style, children: /* @__PURE__ */ jsxs("div", { className: "ds-change-email__container", children: [
     /* @__PURE__ */ jsx("div", { className: "ds-change-email__accent ds-change-email__accent--1", "aria-hidden": "true" }),
     /* @__PURE__ */ jsx("div", { className: "ds-change-email__accent ds-change-email__accent--2", "aria-hidden": "true" }),
     /* @__PURE__ */ jsxs("div", { className: "ds-change-email__card", children: [
@@ -9577,7 +9252,7 @@ var Signup = ({
   };
   const isFormValid = name && email && password.length >= 8 && acceptedTerms;
   if (isSuccess) {
-    return /* @__PURE__ */ jsxs("div", { className: clsx44("ds-signup", className), style, children: [
+    return /* @__PURE__ */ jsxs("div", { className: clsx21("ds-signup", className), style, children: [
       /* @__PURE__ */ jsxs("div", { className: "ds-signup__background", children: [
         /* @__PURE__ */ jsx("div", { className: "ds-signup__accent ds-signup__accent--1", "aria-hidden": "true" }),
         /* @__PURE__ */ jsx("div", { className: "ds-signup__accent ds-signup__accent--2", "aria-hidden": "true" })
@@ -9602,7 +9277,7 @@ var Signup = ({
       ] })
     ] });
   }
-  return /* @__PURE__ */ jsxs("div", { className: clsx44("ds-signup", className), style, children: [
+  return /* @__PURE__ */ jsxs("div", { className: clsx21("ds-signup", className), style, children: [
     /* @__PURE__ */ jsxs("div", { className: "ds-signup__background", children: [
       /* @__PURE__ */ jsx("div", { className: "ds-signup__accent ds-signup__accent--1", "aria-hidden": "true" }),
       /* @__PURE__ */ jsx("div", { className: "ds-signup__accent ds-signup__accent--2", "aria-hidden": "true" })
@@ -9724,7 +9399,7 @@ var Signup = ({
             disabled: isLoading,
             className: "ds-signup__phone-container ds-textfield__input",
             id: "phone-input"
-          }) : /* @__PURE__ */ jsxs("div", { className: clsx44("ds-signup__phone-container", "ds-textfield__input"), children: [
+          }) : /* @__PURE__ */ jsxs("div", { className: clsx21("ds-signup__phone-container", "ds-textfield__input"), children: [
             /* @__PURE__ */ jsxs("div", { className: "ds-signup__flag-select-wrapper", children: [
               /* @__PURE__ */ jsx(
                 "select",
@@ -9822,7 +9497,7 @@ var Signup = ({
             /* @__PURE__ */ jsx("div", { className: "ds-signup__strength-bar", children: [0, 1, 2, 3].map((i) => /* @__PURE__ */ jsx(
               "div",
               {
-                className: clsx44(
+                className: clsx21(
                   "ds-signup__strength-segment",
                   i < passwordStrength.score && "ds-signup__strength-segment--active"
                 ),
@@ -9998,7 +9673,7 @@ var ForgotPassword = ({
     ] }) })
   ] }) }) });
   if (step === "email") {
-    return /* @__PURE__ */ jsxs("div", { className: clsx44("ds-forgot", className), children: [
+    return /* @__PURE__ */ jsxs("div", { className: clsx21("ds-forgot", className), children: [
       /* @__PURE__ */ jsx("div", { className: "ds-forgot__accent ds-forgot__accent--1", "aria-hidden": "true" }),
       /* @__PURE__ */ jsx("div", { className: "ds-forgot__accent ds-forgot__accent--2", "aria-hidden": "true" }),
       /* @__PURE__ */ jsxs("div", { className: "ds-forgot__card", children: [
@@ -10088,7 +9763,7 @@ var ForgotPassword = ({
     ] });
   }
   if (step === "sent") {
-    return /* @__PURE__ */ jsxs("div", { className: clsx44("ds-forgot", className), children: [
+    return /* @__PURE__ */ jsxs("div", { className: clsx21("ds-forgot", className), children: [
       /* @__PURE__ */ jsx("div", { className: "ds-forgot__accent ds-forgot__accent--1", "aria-hidden": "true" }),
       /* @__PURE__ */ jsx("div", { className: "ds-forgot__accent ds-forgot__accent--2", "aria-hidden": "true" }),
       /* @__PURE__ */ jsxs("div", { className: "ds-forgot__card ds-forgot__card--centered", children: [
@@ -10156,7 +9831,7 @@ var ForgotPassword = ({
   if (step === "reset") {
     const passwordsMatch = password === confirmPassword;
     const isValid = password.length >= 8 && passwordsMatch;
-    return /* @__PURE__ */ jsxs("div", { className: clsx44("ds-forgot", className), children: [
+    return /* @__PURE__ */ jsxs("div", { className: clsx21("ds-forgot", className), children: [
       /* @__PURE__ */ jsx("div", { className: "ds-forgot__accent ds-forgot__accent--1", "aria-hidden": "true" }),
       /* @__PURE__ */ jsx("div", { className: "ds-forgot__accent ds-forgot__accent--2", "aria-hidden": "true" }),
       /* @__PURE__ */ jsxs("div", { className: "ds-forgot__card", children: [
@@ -10303,7 +9978,7 @@ var ForgotPassword = ({
       ] })
     ] });
   }
-  return /* @__PURE__ */ jsxs("div", { className: clsx44("ds-forgot", className), children: [
+  return /* @__PURE__ */ jsxs("div", { className: clsx21("ds-forgot", className), children: [
     /* @__PURE__ */ jsx("div", { className: "ds-forgot__accent ds-forgot__accent--1", "aria-hidden": "true" }),
     /* @__PURE__ */ jsx("div", { className: "ds-forgot__accent ds-forgot__accent--2", "aria-hidden": "true" }),
     /* @__PURE__ */ jsxs("div", { className: "ds-forgot__card ds-forgot__card--centered", children: [
@@ -10810,7 +10485,7 @@ var LoadingStateDisplay = ({ progress }) => {
       return /* @__PURE__ */ jsxs(
         "div",
         {
-          className: clsx44("ds-lead-loading__stage", `ds-lead-loading__stage--${status}`),
+          className: clsx21("ds-lead-loading__stage", `ds-lead-loading__stage--${status}`),
           style: { "--stage-index": index },
           children: [
             /* @__PURE__ */ jsx("div", { className: "ds-lead-loading__stage-icon", children: status === "completed" ? /* @__PURE__ */ jsx(IconCheck, { size: 16 }) : /* @__PURE__ */ jsx(Icon, { size: 16 }) }),
@@ -10838,7 +10513,7 @@ var IdentityHeader = ({ data, compact }) => {
   const emailStatus = data.contact?.emailStatus;
   const linkedinVerified = data.contact?.linkedinVerified;
   const confidenceScore = data.dataConfidence?.score;
-  return /* @__PURE__ */ jsxs("div", { className: clsx44("ds-lead-identity", compact && "ds-lead-identity--compact"), children: [
+  return /* @__PURE__ */ jsxs("div", { className: clsx21("ds-lead-identity", compact && "ds-lead-identity--compact"), children: [
     /* @__PURE__ */ jsxs("div", { className: "ds-lead-identity__avatar-wrapper", children: [
       /* @__PURE__ */ jsx("img", { src: avatarUrl, alt: data.name, className: "ds-lead-identity__avatar" }),
       confidenceScore && confidenceScore >= 80 && /* @__PURE__ */ jsx("div", { className: "ds-lead-identity__verified-badge", title: "High confidence data", children: /* @__PURE__ */ jsx(IconShieldCheck, { size: 14 }) })
@@ -10893,7 +10568,7 @@ var IdentityHeader = ({ data, compact }) => {
             href: `mailto:${data.contact.email}`,
             context: "identity-email-contact",
             openInNewTab: false,
-            className: clsx44(
+            className: clsx21(
               "ds-lead-identity__contact",
               emailStatus && `ds-lead-identity__contact--${emailStatus}`
             ),
@@ -10984,7 +10659,7 @@ var IntelligenceSummary = ({
       /* @__PURE__ */ jsx("div", { className: "ds-lead-intelligence__tips", children: data.engagementTips.map((tip, index) => /* @__PURE__ */ jsxs(
         "div",
         {
-          className: clsx44(
+          className: clsx21(
             "ds-lead-intelligence__tip",
             `ds-lead-intelligence__tip--${tip.type}`
           ),
@@ -11062,7 +10737,7 @@ var MBTISpectrum = ({
       return /* @__PURE__ */ jsxs(
         "div",
         {
-          className: clsx44(
+          className: clsx21(
             "ds-mbti__row",
             `ds-mbti__row--${score.color}`,
             isHovered && "ds-mbti__row--hovered"
@@ -11073,7 +10748,7 @@ var MBTISpectrum = ({
             /* @__PURE__ */ jsxs(
               "div",
               {
-                className: clsx44(
+                className: clsx21(
                   "ds-mbti__label",
                   "ds-mbti__label--left",
                   dominantSide === "left" && "ds-mbti__label--active"
@@ -11085,7 +10760,7 @@ var MBTISpectrum = ({
               }
             ),
             /* @__PURE__ */ jsxs("div", { className: "ds-mbti__track-container", children: [
-              /* @__PURE__ */ jsxs("div", { className: clsx44("ds-mbti__track", `ds-mbti__track--${score.color}`), children: [
+              /* @__PURE__ */ jsxs("div", { className: clsx21("ds-mbti__track", `ds-mbti__track--${score.color}`), children: [
                 /* @__PURE__ */ jsx("div", { className: "ds-mbti__track-center" }),
                 /* @__PURE__ */ jsx(
                   "div",
@@ -11104,7 +10779,7 @@ var MBTISpectrum = ({
             /* @__PURE__ */ jsxs(
               "div",
               {
-                className: clsx44(
+                className: clsx21(
                   "ds-mbti__label",
                   "ds-mbti__label--right",
                   dominantSide === "right" && "ds-mbti__label--active"
@@ -11213,7 +10888,7 @@ var BehavioralHighlights = ({
             /* @__PURE__ */ jsx("div", { className: "ds-behavioral__risk-track", children: /* @__PURE__ */ jsx(
               "div",
               {
-                className: clsx44(
+                className: clsx21(
                   "ds-behavioral__risk-fill",
                   signals.riskTolerance < 33 && "ds-behavioral__risk-fill--low",
                   signals.riskTolerance >= 33 && signals.riskTolerance < 66 && "ds-behavioral__risk-fill--medium",
@@ -11242,7 +10917,7 @@ var DeepDiveSection = ({
   if (!hasContent) {
     return null;
   }
-  return /* @__PURE__ */ jsxs("div", { className: clsx44("ds-deep-dive", isExpanded && "ds-deep-dive--expanded"), children: [
+  return /* @__PURE__ */ jsxs("div", { className: clsx21("ds-deep-dive", isExpanded && "ds-deep-dive--expanded"), children: [
     /* @__PURE__ */ jsxs(
       "button",
       {
@@ -11305,7 +10980,7 @@ var DeepDiveSection = ({
         /* @__PURE__ */ jsx("div", { className: "ds-deep-dive__timeline", children: data.experience.map((exp, idx) => /* @__PURE__ */ jsxs(
           "div",
           {
-            className: clsx44(
+            className: clsx21(
               "ds-deep-dive__timeline-item",
               exp.current && "ds-deep-dive__timeline-item--current"
             ),
@@ -11344,16 +11019,16 @@ var DeepDiveSection = ({
 var LeadProfileView = React30.forwardRef(
   ({ state, data, analysisProgress, onRefresh, className }, ref) => {
     if (state === "empty") {
-      return /* @__PURE__ */ jsx("div", { ref, className: clsx44("ds-lead-profile", "ds-lead-profile--empty", className), children: /* @__PURE__ */ jsx(EmptyStateDisplay, { onRefresh }) });
+      return /* @__PURE__ */ jsx("div", { ref, className: clsx21("ds-lead-profile", "ds-lead-profile--empty", className), children: /* @__PURE__ */ jsx(EmptyStateDisplay, { onRefresh }) });
     }
     if (state === "loading") {
-      return /* @__PURE__ */ jsx("div", { ref, className: clsx44("ds-lead-profile", "ds-lead-profile--loading", className), children: /* @__PURE__ */ jsx(LoadingStateDisplay, { progress: analysisProgress }) });
+      return /* @__PURE__ */ jsx("div", { ref, className: clsx21("ds-lead-profile", "ds-lead-profile--loading", className), children: /* @__PURE__ */ jsx(LoadingStateDisplay, { progress: analysisProgress }) });
     }
     if (!data) return null;
     const isPartial = state === "partial";
     const hasMBTI = !isPartial && data.mbtiScores?.length;
     const hasBehavioral = !isPartial && data.behavioralSignals;
-    return /* @__PURE__ */ jsxs("div", { ref, className: clsx44("ds-lead-profile", `ds-lead-profile--${state}`, className), children: [
+    return /* @__PURE__ */ jsxs("div", { ref, className: clsx21("ds-lead-profile", `ds-lead-profile--${state}`, className), children: [
       /* @__PURE__ */ jsx("section", { className: "ds-lead-profile__zone ds-lead-profile__zone--identity", children: /* @__PURE__ */ jsx(IdentityHeader, { data, compact: isPartial }) }),
       /* @__PURE__ */ jsxs("section", { className: "ds-lead-profile__zone ds-lead-profile__zone--intelligence", children: [
         /* @__PURE__ */ jsx(IntelligenceSummary, { data, isLocked: isPartial }),
@@ -11607,14 +11282,14 @@ var AppearancePanel = React30.forwardRef(
       { value: "playful", label: l?.radiusPlayful ?? "Playful", description: l?.radiusPlayfulDescription ?? "Rounded corners" },
       { value: "sharp", label: l?.radiusSharp ?? "Sharp", description: l?.radiusSharpDescription ?? "Technical feel" }
     ];
-    return /* @__PURE__ */ jsxs("div", { ref, className: clsx44("ds-appearance-panel", className), children: [
+    return /* @__PURE__ */ jsxs("div", { ref, className: clsx21("ds-appearance-panel", className), children: [
       /* @__PURE__ */ jsx("h3", { className: "ds-appearance-panel__title", children: l?.title ?? "Appearance Settings" }),
       /* @__PURE__ */ jsxs("fieldset", { className: "ds-appearance-panel__section", children: [
         /* @__PURE__ */ jsx("legend", { className: "ds-appearance-panel__legend", children: l?.themeHeading ?? "Theme" }),
         /* @__PURE__ */ jsx("div", { className: "ds-appearance-panel__options", children: themeOptions.map((option) => /* @__PURE__ */ jsxs(
           "label",
           {
-            className: clsx44(
+            className: clsx21(
               "ds-appearance-panel__option",
               theme === option.value && "ds-appearance-panel__option--active"
             ),
@@ -11641,7 +11316,7 @@ var AppearancePanel = React30.forwardRef(
         /* @__PURE__ */ jsx("div", { className: "ds-appearance-panel__options", children: brandOptions.map((option) => /* @__PURE__ */ jsxs(
           "label",
           {
-            className: clsx44(
+            className: clsx21(
               "ds-appearance-panel__option",
               brand === option.value && "ds-appearance-panel__option--active"
             ),
@@ -11687,7 +11362,7 @@ var AppearancePanel = React30.forwardRef(
         /* @__PURE__ */ jsx("div", { className: "ds-appearance-panel__options ds-appearance-panel__options--row", children: densityOptions.map((option) => /* @__PURE__ */ jsxs(
           "label",
           {
-            className: clsx44(
+            className: clsx21(
               "ds-appearance-panel__option",
               "ds-appearance-panel__option--toggle",
               density === option.value && "ds-appearance-panel__option--active"
@@ -11718,7 +11393,7 @@ var AppearancePanel = React30.forwardRef(
         /* @__PURE__ */ jsx("div", { className: "ds-appearance-panel__options ds-appearance-panel__options--row", children: radiusOptions.map((option) => /* @__PURE__ */ jsxs(
           "label",
           {
-            className: clsx44(
+            className: clsx21(
               "ds-appearance-panel__option",
               "ds-appearance-panel__option--toggle",
               radius === option.value && "ds-appearance-panel__option--active"
@@ -11749,7 +11424,7 @@ var AppearancePanel = React30.forwardRef(
         /* @__PURE__ */ jsx("div", { className: "ds-appearance-panel__options", children: navOptions.map((option) => /* @__PURE__ */ jsxs(
           "label",
           {
-            className: clsx44(
+            className: clsx21(
               "ds-appearance-panel__option",
               navPlacement === option.value && "ds-appearance-panel__option--active"
             ),
@@ -11781,12 +11456,12 @@ var ThemeSelector = ({ className, style }) => {
   const handleThemeChange = (newTheme) => {
     setTheme(newTheme);
   };
-  return /* @__PURE__ */ jsxs("div", { className: clsx44("ds-theme-selector", className), style, role: "group", "aria-label": "Theme Selector", children: [
+  return /* @__PURE__ */ jsxs("div", { className: clsx21("ds-theme-selector", className), style, role: "group", "aria-label": "Theme Selector", children: [
     /* @__PURE__ */ jsxs(
       "button",
       {
         type: "button",
-        className: clsx44("ds-theme-selector__btn", { "ds-theme-selector__btn--active": theme === "light" }),
+        className: clsx21("ds-theme-selector__btn", { "ds-theme-selector__btn--active": theme === "light" }),
         onClick: () => handleThemeChange("light"),
         "aria-pressed": theme === "light",
         children: [
@@ -11799,7 +11474,7 @@ var ThemeSelector = ({ className, style }) => {
       "button",
       {
         type: "button",
-        className: clsx44("ds-theme-selector__btn", { "ds-theme-selector__btn--active": theme === "light-contrast" }),
+        className: clsx21("ds-theme-selector__btn", { "ds-theme-selector__btn--active": theme === "light-contrast" }),
         onClick: () => handleThemeChange("light-contrast"),
         "aria-pressed": theme === "light-contrast",
         children: [
@@ -11812,7 +11487,7 @@ var ThemeSelector = ({ className, style }) => {
       "button",
       {
         type: "button",
-        className: clsx44("ds-theme-selector__btn", { "ds-theme-selector__btn--active": theme === "dark" }),
+        className: clsx21("ds-theme-selector__btn", { "ds-theme-selector__btn--active": theme === "dark" }),
         onClick: () => handleThemeChange("dark"),
         "aria-pressed": theme === "dark",
         children: [
@@ -11825,7 +11500,7 @@ var ThemeSelector = ({ className, style }) => {
       "button",
       {
         type: "button",
-        className: clsx44("ds-theme-selector__btn", { "ds-theme-selector__btn--active": theme === "dark-contrast" }),
+        className: clsx21("ds-theme-selector__btn", { "ds-theme-selector__btn--active": theme === "dark-contrast" }),
         onClick: () => handleThemeChange("dark-contrast"),
         "aria-pressed": theme === "dark-contrast",
         children: [
@@ -11848,7 +11523,7 @@ var ColorPicker = React30.forwardRef(
       "div",
       {
         ref,
-        className: clsx44("ds-color-picker", className),
+        className: clsx21("ds-color-picker", className),
         style,
         role: "group",
         "aria-label": "Brand Color",
@@ -11857,7 +11532,7 @@ var ColorPicker = React30.forwardRef(
             "button",
             {
               type: "button",
-              className: clsx44("ds-color-picker__swatch", {
+              className: clsx21("ds-color-picker__swatch", {
                 "ds-color-picker__swatch--active": brand === value
               }),
               onClick: () => setBrand(value),
@@ -11877,7 +11552,7 @@ var ColorPicker = React30.forwardRef(
           /* @__PURE__ */ jsxs(
             "label",
             {
-              className: clsx44("ds-color-picker__swatch", "ds-color-picker__swatch--custom", {
+              className: clsx21("ds-color-picker__swatch", "ds-color-picker__swatch--custom", {
                 "ds-color-picker__swatch--active": brand === "custom"
               }),
               title: `Custom: ${customColor}`,
@@ -12085,7 +11760,7 @@ var MotionText = ({
       }
     }
   };
-  const itemVariants2 = {
+  const itemVariants = {
     hidden: { opacity: 0, y: 10 },
     visible: {
       opacity: 1,
@@ -12113,7 +11788,7 @@ var MotionText = ({
         return /* @__PURE__ */ jsxs(
           motion.span,
           {
-            variants: itemVariants2,
+            variants: itemVariants,
             style: {
               color: isHighlighted ? "var(--brand-pink)" : "inherit",
               fontWeight: isHighlighted ? 600 : "inherit"
@@ -12204,7 +11879,7 @@ var steps = [
   }
 ];
 var RevenueAutomationLoop = ({ className }) => {
-  return /* @__PURE__ */ jsx("div", { className: clsx44("ds-revenue-loop", className), children: /* @__PURE__ */ jsxs("div", { className: "ds-revenue-loop__circle", children: [
+  return /* @__PURE__ */ jsx("div", { className: clsx21("ds-revenue-loop", className), children: /* @__PURE__ */ jsxs("div", { className: "ds-revenue-loop__circle", children: [
     /* @__PURE__ */ jsxs(
       "svg",
       {
@@ -12728,7 +12403,7 @@ var FunnelScalingSender = ({
     "div",
     {
       ref: containerRef,
-      className: clsx44("ds-funnel-scaling", className),
+      className: clsx21("ds-funnel-scaling", className),
       role: "img",
       "aria-label": "Animated illustration: SalesMind scaling funnel from the sender perspective \u2014 showing how validated outreach becomes an automated pipeline machine",
       children: [
@@ -12821,7 +12496,7 @@ var FunnelScalingSender = ({
                   /* @__PURE__ */ jsxs(
                     motion.div,
                     {
-                      className: clsx44(
+                      className: clsx21(
                         "ds-funnel-scaling__flow-node",
                         showFunnel && "ds-funnel-scaling__flow-node--active"
                       ),
@@ -12977,7 +12652,7 @@ var FunnelScalingSender = ({
                   return /* @__PURE__ */ jsxs(
                     motion.div,
                     {
-                      className: clsx44(
+                      className: clsx21(
                         "ds-funnel-scaling__funnel-stage",
                         isHighlight && showMapping && "ds-funnel-scaling__funnel-stage--highlight",
                         isDim && "ds-funnel-scaling__funnel-stage--dim"
@@ -14094,7 +13769,7 @@ var ReportShell = React30.forwardRef(
       "div",
       {
         ref,
-        className: clsx44("ds-report-shell", className),
+        className: clsx21("ds-report-shell", className),
         "data-mode": mode,
         "data-brand": brand,
         ...props,
@@ -14120,7 +13795,7 @@ var ExecutiveThesis = React30.forwardRef(
       "section",
       {
         ref,
-        className: clsx44("ds-executive-thesis", className),
+        className: clsx21("ds-executive-thesis", className),
         "aria-labelledby": "executive-thesis-title",
         ...props,
         children: [
@@ -14137,7 +13812,7 @@ var ExecutiveThesis = React30.forwardRef(
             /* @__PURE__ */ jsxs(
               "span",
               {
-                className: clsx44(
+                className: clsx21(
                   "ds-executive-thesis__metric-value",
                   metric.trend && `ds-executive-thesis__metric-value--${metric.trend}`
                 ),
@@ -14170,7 +13845,7 @@ var InsightBlock = React30.forwardRef(
       "section",
       {
         ref,
-        className: clsx44("ds-insight-block", getConfidenceClass(), className),
+        className: clsx21("ds-insight-block", getConfidenceClass(), className),
         "data-insight-type": type,
         "aria-labelledby": `insight-${type}-title`,
         ...props,
@@ -14216,7 +13891,7 @@ var EvidenceGroup = React30.forwardRef(
       "div",
       {
         ref,
-        className: clsx44(
+        className: clsx21(
           "ds-evidence-group",
           `ds-evidence-group--${layout}`,
           layout === "grid" && `ds-evidence-group--cols-${columns}`,
@@ -14242,7 +13917,7 @@ var ConfidenceIndicator = React30.forwardRef(
       "div",
       {
         ref,
-        className: clsx44(
+        className: clsx21(
           "ds-confidence-indicator",
           `ds-confidence-indicator--${size}`,
           `ds-confidence-indicator--${threshold.level}`,
@@ -14277,7 +13952,7 @@ var DataCoverageBadge = React30.forwardRef(
       "div",
       {
         ref,
-        className: clsx44(
+        className: clsx21(
           "ds-data-coverage-badge",
           `ds-data-coverage-badge--${size}`,
           !isSufficient && "ds-data-coverage-badge--insufficient",
@@ -14464,7 +14139,7 @@ var DataStateIndicator = React30.forwardRef(
       "div",
       {
         ref,
-        className: clsx44(
+        className: clsx21(
           "ds-data-state-indicator",
           `ds-data-state-indicator--${variant}`,
           `ds-data-state-indicator--${state.toLowerCase().replace(/_/g, "-")}`,
@@ -14520,7 +14195,7 @@ var MethodologyNote = React30.forwardRef(
       "aside",
       {
         ref,
-        className: clsx44("ds-methodology-note", className),
+        className: clsx21("ds-methodology-note", className),
         "aria-label": titleText,
         ...props,
         children: [
@@ -14641,7 +14316,7 @@ var CaveatBlock = React30.forwardRef(
       "aside",
       {
         ref,
-        className: clsx44("ds-caveat-block", `ds-caveat-block--${severity}`, className),
+        className: clsx21("ds-caveat-block", `ds-caveat-block--${severity}`, className),
         role: "note",
         "aria-label": title,
         ...props,
@@ -14704,7 +14379,7 @@ var KeyMetric = React30.forwardRef(
       Component,
       {
         ref,
-        className: clsx44(
+        className: clsx21(
           "ds-key-metric",
           `ds-key-metric--${size}`,
           loading && "ds-key-metric--loading",
@@ -14732,7 +14407,7 @@ var KeyMetric = React30.forwardRef(
             trend && /* @__PURE__ */ jsxs(
               "span",
               {
-                className: clsx44("ds-key-metric__trend", `ds-key-metric__trend--${trend.direction}`),
+                className: clsx21("ds-key-metric__trend", `ds-key-metric__trend--${trend.direction}`),
                 children: [
                   /* @__PURE__ */ jsx("span", { className: "ds-key-metric__trend-icon", children: getTrendIcon(trend.direction) }),
                   /* @__PURE__ */ jsxs("span", { className: "ds-key-metric__trend-value", children: [
@@ -14822,7 +14497,7 @@ var TrendIndicator = React30.forwardRef(
       "span",
       {
         ref,
-        className: clsx44(
+        className: clsx21(
           "ds-trend-indicator",
           `ds-trend-indicator--${size}`,
           `ds-trend-indicator--${direction}`,
@@ -14891,7 +14566,7 @@ function ChartContainer({
   return /* @__PURE__ */ jsxs(
     "div",
     {
-      className: clsx44(
+      className: clsx21(
         "ds-chart-container",
         loading && "ds-chart-container--loading",
         !isRenderable && "ds-chart-container--invalid",
@@ -15198,7 +14873,7 @@ function FunnelChart({
     });
   }, [stages, maxValue]);
   if (!isValid) {
-    return /* @__PURE__ */ jsxs("div", { className: clsx44("ds-funnel-chart", "ds-funnel-chart--invalid", className), children: [
+    return /* @__PURE__ */ jsxs("div", { className: clsx21("ds-funnel-chart", "ds-funnel-chart--invalid", className), children: [
       title && /* @__PURE__ */ jsx("h4", { className: "ds-funnel-chart__title", children: title }),
       /* @__PURE__ */ jsx("div", { className: "ds-funnel-chart__empty", children: /* @__PURE__ */ jsx(
         DataStateIndicator,
@@ -15215,7 +14890,7 @@ function FunnelChart({
     ] });
   }
   const totalConversion = stages.length > 1 ? (stages[stages.length - 1].value / stages[0].value * 100).toFixed(1) : "100";
-  return /* @__PURE__ */ jsxs("div", { className: clsx44("ds-funnel-chart", className), style: { minHeight: height }, children: [
+  return /* @__PURE__ */ jsxs("div", { className: clsx21("ds-funnel-chart", className), style: { minHeight: height }, children: [
     (title || subtitle) && /* @__PURE__ */ jsxs("header", { className: "ds-funnel-chart__header", children: [
       /* @__PURE__ */ jsxs("div", { children: [
         title && /* @__PURE__ */ jsx("h4", { className: "ds-funnel-chart__title", children: title }),
@@ -15306,7 +14981,7 @@ function HeatmapChart({
     return ratio > 0.5 ? "white" : "var(--text-primary)";
   };
   if (!isValid) {
-    return /* @__PURE__ */ jsxs("div", { className: clsx44("ds-heatmap-chart", "ds-heatmap-chart--invalid", className), children: [
+    return /* @__PURE__ */ jsxs("div", { className: clsx21("ds-heatmap-chart", "ds-heatmap-chart--invalid", className), children: [
       title && /* @__PURE__ */ jsx("h4", { className: "ds-heatmap-chart__title", children: title }),
       /* @__PURE__ */ jsxs("div", { className: "ds-heatmap-chart__empty", children: [
         /* @__PURE__ */ jsx("p", { children: "Insufficient data for heatmap visualization" }),
@@ -15319,7 +14994,7 @@ function HeatmapChart({
       ] })
     ] });
   }
-  return /* @__PURE__ */ jsxs("div", { className: clsx44("ds-heatmap-chart", className), children: [
+  return /* @__PURE__ */ jsxs("div", { className: clsx21("ds-heatmap-chart", className), children: [
     (title || subtitle) && /* @__PURE__ */ jsxs("header", { className: "ds-heatmap-chart__header", children: [
       /* @__PURE__ */ jsxs("div", { children: [
         title && /* @__PURE__ */ jsx("h4", { className: "ds-heatmap-chart__title", children: title }),
@@ -15403,7 +15078,7 @@ function ChartSwitchControl({
   if (allowedTypes.length <= 1) {
     return null;
   }
-  return /* @__PURE__ */ jsx("div", { className: clsx44("ds-chart-switch", `ds-chart-switch--${size}`, className), children: allowedTypes.map((type) => {
+  return /* @__PURE__ */ jsx("div", { className: clsx21("ds-chart-switch", `ds-chart-switch--${size}`, className), children: allowedTypes.map((type) => {
     const meta = CHART_REGISTRY[type];
     if (!meta) return null;
     const isActive = type === currentType;
@@ -15412,7 +15087,7 @@ function ChartSwitchControl({
       "button",
       {
         type: "button",
-        className: clsx44(
+        className: clsx21(
           "ds-chart-switch__option",
           isActive && "ds-chart-switch__option--active"
         ),
@@ -16077,7 +15752,7 @@ function Chart({
       return normalized;
     });
   };
-  return /* @__PURE__ */ jsxs("div", { className: clsx44("ds-chart", className), children: [
+  return /* @__PURE__ */ jsxs("div", { className: clsx21("ds-chart", className), children: [
     (title || subtitle || allowSwitching) && /* @__PURE__ */ jsxs("header", { className: "ds-chart__header", children: [
       /* @__PURE__ */ jsxs("div", { className: "ds-chart__header-text", children: [
         title && /* @__PURE__ */ jsx("h4", { className: "ds-chart__title", children: title }),
@@ -16146,7 +15821,7 @@ function MBTIRadar({
     return `${e}${s}${t}${j}`;
   }, [dimensions]);
   if (!isValid) {
-    return /* @__PURE__ */ jsxs("div", { className: clsx44("ds-mbti-radar", "ds-mbti-radar--invalid", className), children: [
+    return /* @__PURE__ */ jsxs("div", { className: clsx21("ds-mbti-radar", "ds-mbti-radar--invalid", className), children: [
       title && /* @__PURE__ */ jsx("h4", { className: "ds-mbti-radar__title", children: title }),
       /* @__PURE__ */ jsx("div", { className: "ds-mbti-radar__empty", children: /* @__PURE__ */ jsx(
         DataStateIndicator,
@@ -16189,7 +15864,7 @@ function MBTIRadar({
       ] })
     ] });
   };
-  return /* @__PURE__ */ jsxs("div", { className: clsx44("ds-mbti-radar", className), children: [
+  return /* @__PURE__ */ jsxs("div", { className: clsx21("ds-mbti-radar", className), children: [
     (title || subtitle) && /* @__PURE__ */ jsxs("header", { className: "ds-mbti-radar__header", children: [
       /* @__PURE__ */ jsxs("div", { className: "ds-mbti-radar__header-text", children: [
         title && /* @__PURE__ */ jsx("h4", { className: "ds-mbti-radar__title", children: title }),
@@ -16325,7 +16000,7 @@ function MBTITypeGrid({
     return percentage >= highlightThreshold;
   };
   if (!isValid) {
-    return /* @__PURE__ */ jsxs("div", { className: clsx44("ds-mbti-type-grid", "ds-mbti-type-grid--invalid", className), children: [
+    return /* @__PURE__ */ jsxs("div", { className: clsx21("ds-mbti-type-grid", "ds-mbti-type-grid--invalid", className), children: [
       title && /* @__PURE__ */ jsx("h4", { className: "ds-mbti-type-grid__title", children: title }),
       /* @__PURE__ */ jsx("div", { className: "ds-mbti-type-grid__empty", children: /* @__PURE__ */ jsx(
         DataStateIndicator,
@@ -16341,7 +16016,7 @@ function MBTITypeGrid({
       ) })
     ] });
   }
-  return /* @__PURE__ */ jsxs("div", { className: clsx44("ds-mbti-type-grid", className), children: [
+  return /* @__PURE__ */ jsxs("div", { className: clsx21("ds-mbti-type-grid", className), children: [
     (title || subtitle) && /* @__PURE__ */ jsxs("header", { className: "ds-mbti-type-grid__header", children: [
       /* @__PURE__ */ jsxs("div", { className: "ds-mbti-type-grid__header-text", children: [
         title && /* @__PURE__ */ jsx("h4", { className: "ds-mbti-type-grid__title", children: title }),
@@ -16398,7 +16073,7 @@ function MBTITypeGrid({
                 "button",
                 {
                   type: "button",
-                  className: clsx44(
+                  className: clsx21(
                     "ds-mbti-type-grid__cell",
                     highlighted && "ds-mbti-type-grid__cell--highlighted",
                     selected && "ds-mbti-type-grid__cell--selected",
@@ -16473,7 +16148,7 @@ var SelectTrigger = React30.forwardRef(
       Select$1.Trigger,
       {
         ref,
-        className: clsx44("ds-select__trigger", `ds-select__trigger--${size}`, className),
+        className: clsx21("ds-select__trigger", `ds-select__trigger--${size}`, className),
         "aria-label": props["aria-label"] || (typeof placeholder === "string" ? placeholder : "Select"),
         ...props,
         children: [
@@ -16494,7 +16169,7 @@ var SelectContent = React30.forwardRef(
         sideOffset,
         align,
         alignItemWithTrigger: false,
-        children: /* @__PURE__ */ jsx(Select$1.Popup, { ref, className: clsx44("ds-select__content", className), ...props, children: /* @__PURE__ */ jsx(Select$1.List, { className: "ds-select__list", children }) })
+        children: /* @__PURE__ */ jsx(Select$1.Popup, { ref, className: clsx21("ds-select__content", className), ...props, children: /* @__PURE__ */ jsx(Select$1.List, { className: "ds-select__list", children }) })
       }
     ) });
   }
@@ -16508,7 +16183,7 @@ var SelectItem = React30.forwardRef(
         ref,
         value,
         disabled,
-        className: clsx44("ds-select__item", className),
+        className: clsx21("ds-select__item", className),
         ...props,
         children: [
           /* @__PURE__ */ jsx(Select$1.ItemIndicator, { className: "ds-select__item-indicator", children: /* @__PURE__ */ jsx(CheckIcon3, {}) }),
@@ -16521,7 +16196,7 @@ var SelectItem = React30.forwardRef(
 SelectItem.displayName = "SelectItem";
 var SelectGroup = React30.forwardRef(
   ({ className, label, children, ...props }, ref) => {
-    return /* @__PURE__ */ jsxs(Select$1.Group, { ref, className: clsx44("ds-select__group", className), ...props, children: [
+    return /* @__PURE__ */ jsxs(Select$1.Group, { ref, className: clsx21("ds-select__group", className), ...props, children: [
       label && /* @__PURE__ */ jsx(Select$1.GroupLabel, { className: "ds-select__group-label", children: label }),
       children
     ] });
@@ -16529,7 +16204,7 @@ var SelectGroup = React30.forwardRef(
 );
 SelectGroup.displayName = "SelectGroup";
 var SelectSeparator = React30.forwardRef(({ className, ...props }, ref) => {
-  return /* @__PURE__ */ jsx("div", { ref, className: clsx44("ds-select__separator", className), ...props });
+  return /* @__PURE__ */ jsx("div", { ref, className: clsx21("ds-select__separator", className), ...props });
 });
 SelectSeparator.displayName = "SelectSeparator";
 function ChevronDownIcon2() {
@@ -16599,7 +16274,7 @@ function ExportMenu({
     /* @__PURE__ */ jsx(
       DropdownMenuTrigger,
       {
-        className: clsx44(
+        className: clsx21(
           "ds-export-menu__trigger",
           "ds-button",
           `ds-button--${variant}`,
@@ -17106,6 +16781,6 @@ function createAuditEntry(url, params, generatorContext, confidence) {
   };
 }
 
-export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AnnouncementBar, AppearancePanel, AppearanceProvider, ArchitectureDiagram, ArticleCard, ArticleLayout, AspectRatio, AuthorBio, Avatar, AvatarFallback, AvatarImage, BREAKPOINTS, Badge, BarChart, BeforeAfterBlock, BookingEmbed, Box, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, BrowserFrame, Button, ButtonGroup, COLORS, CONTAINER_SIZE_MAP, CTASection, Calendar, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Carousel, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious, CaseStudyCard, CaseStudySection, CaveatBlock, ChangeEmail, Chart, ChartContainer, ChartSwitchControl, Checkbox, Collapsible, CollapsibleContent, CollapsibleTrigger, ColorPicker, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, ComparisonTable, CompetitorDiff, ComplianceGrid, ConfidenceIndicator, Container, ContextMenu, ContextMenuContent, ContextMenuItem, ContextMenuLabel, ContextMenuSeparator, ContextMenuTrigger, CursorSpotlight, DISTANCE, DSIntlProvider, DURATION, DataCoverageBadge, DataHighlight, DataStateIndicator, DataTable, DataTableBody, DataTableCell, DataTableHead, DataTableHeader, DataTableRow, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, DialogTrigger, Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuTrigger, EASING, EcosystemDiagram, EmptyState, EnterpriseSignaling, EvidenceGroup, EvolutionTimeline, ExecutiveThesis, ExitIntentOverlay, ExportMenu, FONT_FAMILY, FONT_SIZE, FONT_WEIGHT, FeatureSection, FloatingTabBar, ForgotPassword, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, FunnelChart, FunnelScalingSender, Grid, GuaranteeHighlight, Heading, HeatmapChart, HeroSection, HoverCard, HoverCardContent, HoverCardTrigger, ICPFilter, InputOTP, InputOTPGroup, InputOTPSeparator, InputOTPSlot, InsightBlock, InsightCallout, IntegrationShowcase, IntelligenceBlock, IntentCTA, KeyMetric, LINE_HEIGHT, Label, LeadCaptureForm, LeadProfileView, LineChart, LocaleDropdown, Login, LongFormLayout, MBTIRadar, MBTITypeGrid, MDXOutboundLink, MEDIA_QUERIES, MOTION, ManifestoBlock, MethodologyNote, MetricCounter, MotionContainer, MotionText, Navbar, NavbarActions, NavbarBrand, NavbarContent, NavbarItem, NavbarMegaMenu, NavbarMegaMenuItem, NavbarMegaMenuSection, NavbarMobileActions, NavbarMobileNavItem, NavbarMobileSeparator, NavbarSearchTrigger, NavbarV2, NavbarV2Actions, NavbarV2Brand, NavbarV2Tab, NavbarV2TabMenu, NavbarV2Tabs, ObjectionFAQ, OutboundLink, Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, PartnerValueProp, PieChart, PlatformBadge, Popover, PopoverClose, PopoverContent, PopoverTrigger, PricingCard, PricingSection, PricingToggle, ProblemAgitation, ProcessTimeline, Progress, Prose, RADIUS, ROICalculator, Radio, RadioGroup, ReadingProgress, RelatedContent, ReportShell, RevenueAutomationLoop, SHADOWS, SPACING, ScrollArea, ScrollBar, Section, SectionHeader, SectionShell, SecurityBlock, SegmentSwitch, Select, SelectContent, SelectGroup, SelectItem, SelectSeparator, SelectTrigger, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger, Shell, Sidebar, SidebarItem, SidebarSection, Signup, SiteFooter, Skeleton, Slider, SocialProof, SocialProofCard, SocialProofCarousel, SocialProofFeatured, SocialProofGrid, SocialProofLogos, SpotlightCard, Stack, StakeholderTabs, StarRating, StatsSection, StatusBadge, StickyActionBar, Switch, TRANSITION, TabItem, TableOfContents, Tabs, TabsContent, TabsList, TabsTrigger, Text, TextArea, TextField, ThemeSelector, ToastContext, ToastItem, ToastProvider, Toggle, ToggleGroup, ToggleGroupItem, Tooltip, TooltipContent, TooltipProvider, TooltipRoot, TooltipTrigger, TrendIndicator, UTM_CAMPAIGNS, UTM_CONTENTS, UTM_MEDIUMS_ALL, UTM_MEDIUMS_APP, UTM_MEDIUMS_MESSAGING, UTM_MEDIUMS_WEB, UTM_SOURCES, UTM_SOURCES_REQUIRING_SELLER, UTM_TERMS, VARIANTS, ValueAnchor, VersionedSeriesNavigator, VersionedUpgradeAlert, VerticalVideoGrid, VideoEmbed, VideoLightbox, VisuallyHidden, VoidBackground, Z_INDEX, alertMessages, allMessages, appearanceMessages, appendGovernedUTMs, appendUTMs, authMessages, buildBlockedError, buildUtmUrl, calendarMessages, carouselMessages, classifyAndEnforce, classifyUrl, commonMessages, createAuditEntry, dialogMessages, extractSpacingStyles, formMessages, hexToRgb, initializeAppearance, isExemptUrl, isUtmExempt, isValidUtmParams, methodologyMessages, navigationMessages, paginationMessages, parseUtmParams, prefersReducedMotion, reportMessages, requiresSellerAttribution, requiresUtm, resolveSpacing, toFirstTouchAttribution, toastMessages, useAppearance, useDateFormat, useFormField, useIsRTL, useLocale, useMessage, useNumberFormat, useRelativeTime, useTextDirection, useToast, validateCompliance, validateUtmField };
+export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AnnouncementBar, AppearancePanel, AppearanceProvider, ArchitectureDiagram, ArticleCard, ArticleLayout, AspectRatio, AuthorBio, Avatar, AvatarFallback, AvatarImage, BREAKPOINTS, Badge, BarChart, BeforeAfterBlock, BookingEmbed, Box, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, BrowserFrame, Button, ButtonGroup, COLORS, CONTAINER_SIZE_MAP, CTASection, Calendar, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Carousel, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious, CaseStudyCard, CaseStudySection, CaveatBlock, ChangeEmail, Chart, ChartContainer, ChartSwitchControl, Checkbox, Collapsible, CollapsibleContent, CollapsibleTrigger, ColorPicker, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, ComparisonTable, CompetitorDiff, ComplianceGrid, ConfidenceIndicator, Container, ContextMenu, ContextMenuContent, ContextMenuItem, ContextMenuLabel, ContextMenuSeparator, ContextMenuTrigger, CursorSpotlight, DISTANCE, DSIntlProvider, DURATION, DataCoverageBadge, DataHighlight, DataStateIndicator, DataTable, DataTableBody, DataTableCell, DataTableHead, DataTableHeader, DataTableRow, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, DialogTrigger, Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuTrigger, EASING, EcosystemDiagram, EmptyState, EnterpriseSignaling, EvidenceGroup, EvolutionTimeline, ExecutiveThesis, ExitIntentOverlay, ExportMenu, FONT_FAMILY, FONT_SIZE, FONT_WEIGHT, FeatureSection, FloatingTabBar, ForgotPassword, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, FunnelChart, FunnelScalingSender, Grid, GuaranteeHighlight, Heading, HeatmapChart, HeroSection, HoverCard, HoverCardContent, HoverCardTrigger, ICPFilter, InputOTP, InputOTPGroup, InputOTPSeparator, InputOTPSlot, InsightBlock, InsightCallout, IntegrationShowcase, IntelligenceBlock, IntentCTA, KeyMetric, LINE_HEIGHT, Label, LeadCaptureForm, LeadProfileView, LineChart, LocaleDropdown, Login, LongFormLayout, MBTIRadar, MBTITypeGrid, MDXOutboundLink, MEDIA_QUERIES, MOTION, ManifestoBlock, MethodologyNote, MetricCounter, MotionContainer, MotionText, NavbarMegaMenu, NavbarMegaMenuItem, NavbarMegaMenuSection, NavbarMobileActions, NavbarMobileNavItem, NavbarMobileSeparator, NavbarV2, NavbarV2Actions, NavbarV2Brand, NavbarV2Tab, NavbarV2TabMenu, NavbarV2Tabs, ObjectionFAQ, OutboundLink, Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, PartnerValueProp, PieChart, PlatformBadge, Popover, PopoverClose, PopoverContent, PopoverTrigger, PricingCard, PricingSection, PricingToggle, ProblemAgitation, ProcessTimeline, Progress, Prose, RADIUS, ROICalculator, Radio, RadioGroup, ReadingProgress, RelatedContent, ReportShell, RevenueAutomationLoop, SHADOWS, SPACING, ScrollArea, ScrollBar, Section, SectionHeader, SectionShell, SecurityBlock, SegmentSwitch, Select, SelectContent, SelectGroup, SelectItem, SelectSeparator, SelectTrigger, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger, Shell, Sidebar, SidebarItem, SidebarSection, Signup, SiteFooter, Skeleton, Slider, SocialProof, SocialProofCard, SocialProofCarousel, SocialProofFeatured, SocialProofGrid, SocialProofLogos, SpotlightCard, Stack, StakeholderTabs, StarRating, StatsSection, StatusBadge, StickyActionBar, Switch, TRANSITION, TabItem, TableOfContents, Tabs, TabsContent, TabsList, TabsTrigger, Text, TextArea, TextField, ThemeSelector, ToastContext, ToastItem, ToastProvider, Toggle, ToggleGroup, ToggleGroupItem, Tooltip, TooltipContent, TooltipProvider, TooltipRoot, TooltipTrigger, TrendIndicator, UTM_CAMPAIGNS, UTM_CONTENTS, UTM_MEDIUMS_ALL, UTM_MEDIUMS_APP, UTM_MEDIUMS_MESSAGING, UTM_MEDIUMS_WEB, UTM_SOURCES, UTM_SOURCES_REQUIRING_SELLER, UTM_TERMS, VARIANTS, ValueAnchor, VersionedSeriesNavigator, VersionedUpgradeAlert, VerticalVideoGrid, VideoEmbed, VideoLightbox, VisuallyHidden, VoidBackground, Z_INDEX, alertMessages, allMessages, appearanceMessages, appendGovernedUTMs, appendUTMs, authMessages, buildBlockedError, buildUtmUrl, calendarMessages, carouselMessages, classifyAndEnforce, classifyUrl, commonMessages, createAuditEntry, dialogMessages, extractSpacingStyles, formMessages, hexToRgb, initializeAppearance, isExemptUrl, isUtmExempt, isValidUtmParams, methodologyMessages, navigationMessages, paginationMessages, parseUtmParams, prefersReducedMotion, reportMessages, requiresSellerAttribution, requiresUtm, resolveSpacing, toFirstTouchAttribution, toastMessages, useAppearance, useDateFormat, useFormField, useIsRTL, useLocale, useMessage, useNumberFormat, useRelativeTime, useTextDirection, useToast, validateCompliance, validateUtmField };
 //# sourceMappingURL=out.js.map
 //# sourceMappingURL=index.js.map