@opensite/ui 1.0.7 → 1.0.9

package/dist/registry.cjs

@@ -57132,7 +57132,7 @@ var NavbarMobileMenu = ({
       "data-state": open ? "open" : "closed",
       children: [
         /* @__PURE__ */ jsxRuntime.jsx("div", { className: "sr-only", children: /* @__PURE__ */ jsxRuntime.jsx("h2", { children: title }) }),
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute top-4 right-4 z-10", children: /* @__PURE__ */ jsxRuntime.jsxs(
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute top-0 left-0 right-0 p-4 bg-background flex justify-end items-center z-10 w-screen", children: /* @__PURE__ */ jsxRuntime.jsxs(
           "button",
           {
             onClick: onClose,
@@ -58662,7 +58662,7 @@ var DesktopMenuItem2 = ({
   if (hasDropdown) {
     return /* @__PURE__ */ jsxRuntime.jsxs(NavigationMenuItem, { value: `${index}`, children: [
       /* @__PURE__ */ jsxRuntime.jsx(NavigationMenuTrigger, { className: "h-auto bg-transparent px-3 py-2 font-normal hover:bg-muted focus:bg-muted data-[state=open]:bg-muted/50", children: item.label }),
-      /* @__PURE__ */ jsxRuntime.jsx(NavigationMenuContent, { className: "!rounded-xl !border-0 !p-6", children: renderDropdownContent(
+      /* @__PURE__ */ jsxRuntime.jsx(NavigationMenuContent, { className: "rounded-xl! border-0! p-4!", children: renderDropdownContent(
         { ...item, layout: effectiveLayout },
         optixFlowConfig
       ) })
@@ -58733,7 +58733,7 @@ var renderDropdownContent = (item, optixFlowConfig) => {
 var renderMobileDropdownContent = (item) => {
   switch (item.layout) {
     case "solutions-with-platform":
-      return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative", children: item.solutionCards?.map((solution) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2", children: [
+      return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col space-y-2", children: item.solutionCards?.map((solution) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-2", children: [
         /* @__PURE__ */ jsxRuntime.jsx(
           Pressable,
           {
@@ -58761,7 +58761,7 @@ var renderMobileDropdownContent = (item) => {
           Pressable,
           {
             href: product.href,
-            className: "flex items-center gap-2 text-sm text-muted-foreground",
+            className: "flex items-center pl-4 gap-2 text-sm text-muted-foreground",
             children: product.title
           },
           product.id
@@ -58772,7 +58772,7 @@ var renderMobileDropdownContent = (item) => {
         Pressable,
         {
           href: resource.href,
-          className: "flex items-center gap-2 text-sm text-muted-foreground",
+          className: "flex items-center pl-4 gap-2 text-sm text-muted-foreground",
           children: [
             /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: resource.icon, size: 14 }),
             resource.title
@@ -58861,7 +58861,7 @@ var MobileNavigationMenu = ({
             typeof item.label === "string" ? item.label : `nav-${index}`
           );
         }) }),
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("mt-6 flex flex-col gap-4", actionsClassName), children: renderActions })
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("mt-4 flex flex-col gap-4", actionsClassName), children: renderActions })
       ] })
     }
   );
@@ -59606,6 +59606,7 @@ var NavbarPlatformResources = ({
       children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: containerWrapperClasses, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: navWrapperClasses, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: innerContainerClasses, children: /* @__PURE__ */ jsxRuntime.jsxs(
         NavigationMenu,
         {
+          viewport: false,
           className: cn("min-w-full", navigationMenuClassName),
           children: [
             /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex w-full items-center justify-between gap-12 py-4", children: [
@@ -59628,7 +59629,7 @@ var NavbarPlatformResources = ({
                         NavigationMenuItem,
                         {
                           children: [
-                            /* @__PURE__ */ jsxRuntime.jsx(NavigationMenuTrigger, { className: "h-auto bg-transparent px-0 py-0 font-normal text-muted-foreground hover:bg-transparent focus:bg-transparent data-[state=open]:bg-transparent", children: link.label }),
+                            /* @__PURE__ */ jsxRuntime.jsx(NavigationMenuTrigger, { className: "h-auto bg-transparent px-4 py-2 font-normal hover:bg-muted focus:bg-transparent data-[state=open]:bg-transparent", children: link.label }),
                             renderDropdownContent3(link)
                           ]
                         },
@@ -59645,7 +59646,7 @@ var NavbarPlatformResources = ({
                           NavigationMenuLink,
                           {
                             href: link.href,
-                            className: "group inline-flex h-10 w-max items-center justify-center rounded-md bg-background px-4 py-2 text-sm font-medium transition-colors hover:bg-muted hover:text-accent-foreground",
+                            className: "group inline-flex h-10 w-max items-center justify-center rounded-md bg-background px-4 py-2 text-sm font-medium transition-colors hover:bg-muted",
                             children: link.label
                           }
                         )
@@ -59696,7 +59697,7 @@ var NavbarPlatformResources = ({
                           className: "border-b-0",
                           children: [
                             /* @__PURE__ */ jsxRuntime.jsx(AccordionTrigger, { className: "h-15 items-center text-base font-normal text-foreground hover:no-underline", children: link.label }),
-                            /* @__PURE__ */ jsxRuntime.jsx(AccordionContent, { className: "overflow-x-none", children: link.links?.map((item, itemIndex) => /* @__PURE__ */ jsxRuntime.jsxs(
+                            /* @__PURE__ */ jsxRuntime.jsx(AccordionContent, { className: "overflow-x-none space-y-4", children: link.links?.map((item, itemIndex) => /* @__PURE__ */ jsxRuntime.jsxs(
                               Pressable,
                               {
                                 href: getLinkUrl(item),
@@ -60000,7 +60001,7 @@ var DesktopMenuItem3 = ({
               onMouseLeave: handleMouseLeave,
               children: /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
                 /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-sm leading-normal font-medium", children: link.label }),
-                /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs leading-normal text-muted-foreground", children: link.description })
+                /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs leading-normal", children: link.description })
               ] })
             }
           ) }, `desktop-nav-sublink-${linkIndex}`)) })
@@ -60028,44 +60029,17 @@ var MobileNavigationMenu2 = ({
   authActions,
   authActionsSlot
 }) => {
-  const renderMobileNavigation = React52.useMemo(() => {
-    if (mobileNavigationSlot) return mobileNavigationSlot;
-    if (!mobileNavigation || mobileNavigation.length === 0) return null;
-    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid w-full grid-cols-2 gap-x-4 gap-y-10", children: mobileNavigation.map((item, index) => /* @__PURE__ */ jsxRuntime.jsxs(
-      "div",
-      {
-        className: cn(
-          "flex flex-col gap-4 text-primary-foreground",
-          item.className
-        ),
-        children: [
-          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-xs text-muted-foreground uppercase", children: item.title }),
-          /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "flex flex-col gap-3", children: item.links?.map((link, i) => /* @__PURE__ */ jsxRuntime.jsx("li", { children: /* @__PURE__ */ jsxRuntime.jsx(
-            Pressable,
-            {
-              href: getLinkUrl(link),
-              className: cn(
-                "text-primary-foreground leading-normal font-medium",
-                index === 0 ? "text-2xl" : "text-base"
-              ),
-              children: link.label
-            }
-          ) }, `mobile-nav-link-${i}`)) })
-        ]
-      },
-      `mobile-menu-item-${index}`
-    )) });
-  }, [mobileNavigationSlot, mobileNavigation]);
+  const handleClose = () => setOpen(false);
   const renderSocialLinks = React52.useMemo(() => {
     if (socialLinksSlot) return socialLinksSlot;
     if (!socialLinks || socialLinks.length === 0) return null;
-    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "col-span-2 flex flex-col gap-4", children: [
-      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-xs text-muted-foreground uppercase", children: "SOCIAL" }),
-      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex gap-4", children: socialLinks.map((link, index) => /* @__PURE__ */ jsxRuntime.jsxs(
+    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-4 mt-6", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "px-4 text-[10px] text-muted-foreground uppercase", children: "SOCIAL" }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex gap-4 px-4", children: socialLinks.map((link, index) => /* @__PURE__ */ jsxRuntime.jsxs(
         Pressable,
         {
           href: link.url,
-          className: "text-primary-foreground",
+          onClick: handleClose,
           children: [
             link.icon ?? (link.iconName && /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: link.iconName, size: 20 })),
             !link.icon && !link.iconName && link.label
@@ -60074,11 +60048,11 @@ var MobileNavigationMenu2 = ({
         `social-link-${index}`
       )) })
     ] });
-  }, [socialLinksSlot, socialLinks]);
+  }, [socialLinksSlot, socialLinks, handleClose]);
   const renderMobileAuthActions = React52.useMemo(() => {
     if (authActionsSlot) return authActionsSlot;
     if (!authActions || authActions.length === 0) return null;
-    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-2", children: authActions.map((action, index) => {
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-4 mt-6", children: authActions.map((action, index) => {
       const {
         label,
         icon,
@@ -60092,6 +60066,7 @@ var MobileNavigationMenu2 = ({
         {
           asButton: true,
           className: cn("w-full", actionClassName),
+          onClick: handleClose,
           ...pressableProps,
           children: children ?? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
             icon,
@@ -60102,20 +60077,63 @@ var MobileNavigationMenu2 = ({
         index
       );
     }) });
-  }, [authActionsSlot, authActions]);
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    NavbarMobileMenu,
-    {
-      open,
-      onClose: () => setOpen(false),
-      title: "Mobile Navigation",
-      children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "max-w-screen-sm mx-auto", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex h-full flex-col justify-between gap-30", children: [
-        renderMobileNavigation,
-        renderSocialLinks,
-        renderMobileAuthActions
-      ] }) })
-    }
-  );
+  }, [authActionsSlot, authActions, handleClose]);
+  if (mobileNavigationSlot) {
+    return /* @__PURE__ */ jsxRuntime.jsx(NavbarMobileMenu, { open, onClose: handleClose, title: "Mobile Navigation", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "max-w-screen-sm mx-auto", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-6", children: [
+      mobileNavigationSlot,
+      renderSocialLinks,
+      renderMobileAuthActions
+    ] }) }) });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(NavbarMobileMenu, { open, onClose: handleClose, title: "Mobile Navigation", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "max-w-screen-sm mx-auto", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-6", children: [
+    /* @__PURE__ */ jsxRuntime.jsx(Accordion, { type: "multiple", className: "w-full", children: mobileNavigation.map((item, index) => {
+      if (item.links && item.links.length > 0) {
+        return /* @__PURE__ */ jsxRuntime.jsxs(
+          AccordionItem,
+          {
+            value: `nav-${index}`,
+            className: "border-b-0",
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsx(AccordionTrigger, { className: "h-15 items-center p-0 px-4! text-base leading-[3.75] font-normal text-muted-foreground hover:bg-muted hover:no-underline", children: item.title }),
+              /* @__PURE__ */ jsxRuntime.jsx(AccordionContent, { className: "overflow-x-none", children: item.links.map((link, linkIndex) => /* @__PURE__ */ jsxRuntime.jsxs(
+                Pressable,
+                {
+                  href: getLinkUrl(link),
+                  className: "flex min-h-12 items-center gap-2 rounded-lg px-4 text-muted-foreground transition-colors duration-300 hover:bg-muted hover:text-foreground",
+                  onClick: handleClose,
+                  children: [
+                    link.icon ? link.icon : link.iconName ? /* @__PURE__ */ jsxRuntime.jsx(
+                      DynamicIcon,
+                      {
+                        name: link.iconName,
+                        size: 16,
+                        className: "stroke-muted-foreground"
+                      }
+                    ) : null,
+                    link.label
+                  ]
+                },
+                `mobile-link-${linkIndex}`
+              )) })
+            ]
+          },
+          `nav-item-${index}`
+        );
+      }
+      return /* @__PURE__ */ jsxRuntime.jsx(
+        Pressable,
+        {
+          href: item.url,
+          className: "flex h-15 items-center rounded-md p-0 px-4 text-left text-base leading-[3.75] font-normal text-muted-foreground ring-ring/10 outline-ring/50 transition-all hover:bg-muted focus-visible:ring-4 focus-visible:outline-1",
+          onClick: handleClose,
+          children: item.title
+        },
+        `nav-link-${index}`
+      );
+    }) }),
+    renderSocialLinks,
+    renderMobileAuthActions
+  ] }) }) });
 };
 var MOBILE_BREAKPOINT3 = 1024;
 var NavbarDarkIcons = ({
@@ -60713,8 +60731,8 @@ var AnimatedImagePreviewDropdown = ({
     updateImageClasses(0);
   };
   if (!links) return null;
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-8", children: [
-    /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "grid grid-cols-2 gap-8", children: links.map((link, index) => /* @__PURE__ */ jsxRuntime.jsx(
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
+    /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "grid grid-cols-2 gap-4", children: links.map((link, index) => /* @__PURE__ */ jsxRuntime.jsx(
       NavLink,
       {
         link,
@@ -60753,7 +60771,7 @@ var FeaturedCardsGridDropdown = ({
   optixFlowConfig
 }) => {
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex gap-8 pb-8", children: featuredLinks?.map((link, index) => /* @__PURE__ */ jsxRuntime.jsx(
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex gap-4 pb-8", children: featuredLinks?.map((link, index) => /* @__PURE__ */ jsxRuntime.jsx(
       FeaturedLink,
       {
         link,
@@ -60770,7 +60788,7 @@ var GroupedLinksImageDropdown = ({
   imageLink,
   optixFlowConfig
 }) => {
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-8", children: [
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-2 gap-4", children: [
     /* @__PURE__ */ jsxRuntime.jsx(GroupLinks, { groupLinks }),
     /* @__PURE__ */ jsxRuntime.jsx(FeaturedImageLink, { link: imageLink, optixFlowConfig })
   ] });
@@ -60791,9 +60809,9 @@ var GroupLinks = ({ groupLinks }) => {
   };
   if (!groupLinks) return null;
   let linkIndex = 0;
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-2 gap-8", children: groupLinks.map((group, index1) => /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-4 text-xs text-muted-foreground", children: group.label }),
-    /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "flex flex-col gap-8", children: group.links.map((link, index2) => {
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center justify-between gap-4", children: groupLinks.map((group, index1) => /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-4 text-xs", children: group.label }),
+    /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "flex flex-col gap-4", children: group.links.map((link, index2) => {
       const idx = linkIndex++;
       return /* @__PURE__ */ jsxRuntime.jsx("li", { children: /* @__PURE__ */ jsxRuntime.jsx(
         NavLink,
@@ -60821,7 +60839,7 @@ var FeaturedImageLink = ({
       className: "overflow-hidden rounded-lg bg-muted",
       children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "size-full", children: [
         /* @__PURE__ */ jsxRuntime.jsx(Badge, { className: "absolute top-2 left-2", children: "New" }),
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex w-full flex-col items-center justify-center gap-8 pt-10", children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex w-full flex-col items-center justify-center gap-4 pt-10", children: [
           /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-2xl font-semibold", children: link.label }),
           /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-[80%]", children: /* @__PURE__ */ jsxRuntime.jsx(
             AspectRatio,
@@ -60833,7 +60851,7 @@ var FeaturedImageLink = ({
                 {
                   src: link.image,
                   alt: typeof link.label === "string" ? link.label : "",
-                  className: "size-full object-cover object-left-top",
+                  className: "size-full object-cover object-center",
                   optixFlowConfig
                 }
               )
@@ -60849,7 +60867,7 @@ var FeaturedLink = ({ link, optixFlowConfig }) => {
     Pressable,
     {
       href: getLinkUrl(link),
-      className: "group relative flex w-full overflow-hidden rounded-xl bg-muted px-8 py-7",
+      className: "group relative flex w-full overflow-hidden rounded-xl bg-muted px-8 py-12",
       children: [
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative z-10 flex w-full items-center gap-6", children: [
           /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex size-12 shrink-0 rounded-lg border bg-background shadow-lg", children: link.icon ? link.icon : link.iconName ? /* @__PURE__ */ jsxRuntime.jsx(
@@ -60857,12 +60875,12 @@ var FeaturedLink = ({ link, optixFlowConfig }) => {
             {
               name: link.iconName,
               size: 20,
-              className: "m-auto stroke-foreground"
+              className: "m-auto stroke-white"
             }
           ) : null }),
-          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-2", children: [
-            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-lg font-semibold text-background", children: link.label }),
-            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "font-medium text-background/80", children: link.description })
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-2 text-white text-shadow-lg", children: [
+            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-lg font-semibold", children: link.label }),
+            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "font-medium", children: link.description })
           ] })
         ] }),
         /* @__PURE__ */ jsxRuntime.jsx(
@@ -60870,7 +60888,7 @@ var FeaturedLink = ({ link, optixFlowConfig }) => {
           {
             src: link.background,
             alt: typeof link.label === "string" ? link.label : "",
-            className: "absolute top-0 left-0 size-full object-cover object-left-top opacity-90 transition-opacity duration-300 ease-in-out group-hover:opacity-100",
+            className: "absolute top-0 left-0 size-full brightness-50 object-cover object-center opacity-90 transition-opacity duration-300 ease-in-out group-hover:opacity-100",
             optixFlowConfig
           }
         )
@@ -61210,10 +61228,11 @@ var MobileNavigationMenu5 = ({
   authActions,
   authActionsSlot
 }) => {
+  const handleClose = () => setOpen(false);
   const renderMobileAuthActions = React52.useMemo(() => {
     if (authActionsSlot) return authActionsSlot;
     if (!authActions || authActions.length === 0) return null;
-    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-4", children: authActions.map((action, index) => {
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-4 mt-6", children: authActions.map((action, index) => {
       const {
         label,
         icon,
@@ -61227,6 +61246,7 @@ var MobileNavigationMenu5 = ({
         {
           asButton: true,
           className: cn("w-full", actionClassName),
+          onClick: handleClose,
           ...pressableProps,
           children: children ?? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
             icon,
@@ -61237,63 +61257,65 @@ var MobileNavigationMenu5 = ({
         index
       );
     }) });
-  }, [authActionsSlot, authActions]);
+  }, [authActionsSlot, authActions, handleClose]);
   return /* @__PURE__ */ jsxRuntime.jsx(
     NavbarMobileMenu,
     {
       open,
-      onClose: () => setOpen(false),
+      onClose: handleClose,
       title: "Mobile Navigation",
       children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "max-w-screen-sm mx-auto", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-6", children: [
-        /* @__PURE__ */ jsxRuntime.jsx(Accordion, { type: "multiple", className: "w-full", children: navigation.map((item, index) => renderMobileMenuItem5(item, index)) }),
-        renderMobileAuthActions
-      ] }) })
-    }
-  );
-};
-var renderMobileMenuItem5 = (item, index) => {
-  if (item.groups) {
-    return /* @__PURE__ */ jsxRuntime.jsxs(
-      AccordionItem,
-      {
-        value: `nav-${index}`,
-        className: "border-b-0",
-        children: [
-          /* @__PURE__ */ jsxRuntime.jsx(AccordionTrigger, { className: "h-15 items-center p-0 px-4! text-base leading-[3.75] font-normal text-muted-foreground hover:bg-muted hover:no-underline", children: item.title }),
-          /* @__PURE__ */ jsxRuntime.jsx(AccordionContent, { className: "overflow-x-none", children: item.groups.flatMap(
-            (group, groupIndex) => group.links.map((link, linkIndex) => /* @__PURE__ */ jsxRuntime.jsxs(
-              Pressable,
+        /* @__PURE__ */ jsxRuntime.jsx(Accordion, { type: "multiple", className: "w-full", children: navigation.map((item, index) => {
+          if (item.groups && item.groups.length > 0) {
+            return /* @__PURE__ */ jsxRuntime.jsxs(
+              AccordionItem,
               {
-                href: link.url,
-                className: "flex min-h-12 items-center gap-2 rounded-lg px-4 text-muted-foreground transition-colors duration-300 hover:bg-muted hover:text-foreground",
+                value: `nav-${index}`,
+                className: "border-b-0",
                 children: [
-                  link.icon ? link.icon : link.iconName ? /* @__PURE__ */ jsxRuntime.jsx(
-                    DynamicIcon,
-                    {
-                      name: link.iconName,
-                      size: 16,
-                      className: "stroke-muted-foreground"
-                    }
-                  ) : null,
-                  link.label
+                  /* @__PURE__ */ jsxRuntime.jsx(AccordionTrigger, { className: "h-15 items-center p-0 px-4! text-base leading-[3.75] font-normal text-muted-foreground hover:bg-muted hover:no-underline", children: item.title }),
+                  /* @__PURE__ */ jsxRuntime.jsx(AccordionContent, { className: "overflow-x-none", children: item.groups.map((group, groupIndex) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-4", children: [
+                    /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mb-2 px-4 text-[10px] text-muted-foreground uppercase", children: group.title }),
+                    group.links.map((link, linkIndex) => /* @__PURE__ */ jsxRuntime.jsxs(
+                      Pressable,
+                      {
+                        href: link.url,
+                        className: "flex min-h-12 items-center gap-2 rounded-lg px-4 text-muted-foreground transition-colors duration-300 hover:bg-muted hover:text-foreground",
+                        onClick: handleClose,
+                        children: [
+                          link.icon ? link.icon : link.iconName ? /* @__PURE__ */ jsxRuntime.jsx(
+                            DynamicIcon,
+                            {
+                              name: link.iconName,
+                              size: 16,
+                              className: "stroke-muted-foreground"
+                            }
+                          ) : null,
+                          link.label
+                        ]
+                      },
+                      `mobile-link-${groupIndex}-${linkIndex}`
+                    ))
+                  ] }, `mobile-group-${groupIndex}`)) })
                 ]
               },
-              `mobile-link-${groupIndex}-${linkIndex}`
-            ))
-          ) })
-        ]
-      },
-      `nav-item-${index}`
-    );
-  }
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    Pressable,
-    {
-      href: item.url,
-      className: "flex h-15 items-center rounded-md p-0 px-4 text-left text-base leading-[3.75] font-normal text-muted-foreground ring-ring/10 outline-ring/50 transition-all hover:bg-muted focus-visible:ring-4 focus-visible:outline-1 nth-last-1:border-0",
-      children: item.title
-    },
-    `nav-link-${index}`
+              `nav-item-${index}`
+            );
+          }
+          return /* @__PURE__ */ jsxRuntime.jsx(
+            Pressable,
+            {
+              href: item.url,
+              className: "flex h-15 items-center rounded-md p-0 px-4 text-left text-base leading-[3.75] font-normal text-muted-foreground ring-ring/10 outline-ring/50 transition-all hover:bg-muted focus-visible:ring-4 focus-visible:outline-1",
+              onClick: handleClose,
+              children: item.title
+            },
+            `nav-link-${index}`
+          );
+        }) }),
+        renderMobileAuthActions
+      ] }) })
+    }
   );
 };
 var NavbarSidebarMobile = ({
@@ -61319,7 +61341,29 @@ var NavbarSidebarMobile = ({
   optixFlowConfig
 }) => {
   const [isOpen, setIsOpen] = React52.useState(false);
-  const renderAuthActions = () => {
+  const MOBILE_BREAKPOINT8 = 1024;
+  React52.useEffect(() => {
+    if (typeof window === "undefined") return;
+    const handleResize = () => {
+      if (window.innerWidth > MOBILE_BREAKPOINT8) {
+        setIsOpen(false);
+      }
+    };
+    handleResize();
+    window.addEventListener("resize", handleResize);
+    return () => window.removeEventListener("resize", handleResize);
+  }, []);
+  React52.useEffect(() => {
+    if (typeof document === "undefined") return;
+    document.body.style.overflow = isOpen ? "hidden" : "auto";
+    return () => {
+      document.body.style.overflow = "auto";
+    };
+  }, [isOpen]);
+  const handleMobileMenu = () => {
+    setIsOpen(!isOpen);
+  };
+  const renderAuthActions = React52.useMemo(() => {
     if (authActionsSlot) return authActionsSlot;
     if (!authActions || authActions.length === 0) return null;
     return authActions.map((action, index) => {
@@ -61346,17 +61390,12 @@ var NavbarSidebarMobile = ({
         index
       );
     });
-  };
+  }, [authActionsSlot, authActions]);
   const renderMenu = () => {
     if (menuSlot) return null;
     if (!menu || menu.length === 0) return null;
     return menu;
   };
-  const renderMobileExtraLinks = () => {
-    if (mobileExtraLinksSlot) return null;
-    if (!mobileExtraLinks || mobileExtraLinks.length === 0) return null;
-    return mobileExtraLinks;
-  };
   const {
     sectionClasses,
     containerWrapperClasses,
@@ -61366,180 +61405,283 @@ var NavbarSidebarMobile = ({
     sectionContainerMaxWidth,
     spacingOverride
   } = getNavbarLayoutClasses(layoutVariant, { className, containerClassName });
-  return /* @__PURE__ */ jsxRuntime.jsx(
-    Section,
-    {
-      background,
-      spacing: spacingOverride ?? spacing,
-      className: sectionClasses,
-      pattern,
-      patternOpacity,
-      containerClassName: sectionContainerClassName,
-      containerMaxWidth: sectionContainerMaxWidth,
-      children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: containerWrapperClasses, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: navWrapperClasses, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: innerContainerClasses, children: /* @__PURE__ */ jsxRuntime.jsxs(
-        "nav",
-        {
-          className: cn(
-            "flex items-center justify-between py-4",
-            navClassName
-          ),
-          children: [
-            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-8", children: [
+  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      Section,
+      {
+        background,
+        spacing: spacingOverride ?? spacing,
+        className: sectionClasses,
+        pattern,
+        patternOpacity,
+        containerClassName: sectionContainerClassName,
+        containerMaxWidth: sectionContainerMaxWidth,
+        children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: containerWrapperClasses, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: navWrapperClasses, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: innerContainerClasses, children: /* @__PURE__ */ jsxRuntime.jsxs(
+          "nav",
+          {
+            className: cn(
+              "flex items-center justify-between py-4",
+              navClassName
+            ),
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-8", children: [
+                /* @__PURE__ */ jsxRuntime.jsx(
+                  NavbarLogo,
+                  {
+                    logo,
+                    logoSlot,
+                    logoClassName,
+                    optixFlowConfig
+                  }
+                ),
+                /* @__PURE__ */ jsxRuntime.jsx(
+                  NavigationMenu,
+                  {
+                    className: cn("hidden lg:flex", navigationMenuClassName),
+                    children: /* @__PURE__ */ jsxRuntime.jsx(NavigationMenuList, { children: menuSlot ? menuSlot : renderMenu()?.map(
+                      (item, index) => item.items ? /* @__PURE__ */ jsxRuntime.jsxs(NavigationMenuItem, { children: [
+                        /* @__PURE__ */ jsxRuntime.jsx(NavigationMenuTrigger, { children: item.title }),
+                        /* @__PURE__ */ jsxRuntime.jsx(NavigationMenuContent, { children: /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "grid w-[400px] gap-3 p-4 md:w-[500px] md:grid-cols-2", children: item.items.map((subItem, subIndex) => /* @__PURE__ */ jsxRuntime.jsx("li", { children: /* @__PURE__ */ jsxRuntime.jsx(NavigationMenuLink, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsxs(
+                          Pressable,
+                          {
+                            href: subItem.url,
+                            className: "block w-full select-none space-y-1 rounded-md p-3 leading-none no-underline outline-none transition-colors hover:bg-muted focus:bg-muted",
+                            children: [
+                              /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
+                                subItem.icon && /* @__PURE__ */ jsxRuntime.jsx(
+                                  DynamicIcon,
+                                  {
+                                    name: subItem.icon,
+                                    size: 16
+                                  }
+                                ),
+                                /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-sm font-medium leading-none", children: subItem.title })
+                              ] }),
+                              subItem.description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "line-clamp-2 text-sm leading-snug text-muted-foreground", children: subItem.description })
+                            ]
+                          }
+                        ) }) }, subIndex)) }) })
+                      ] }, index) : /* @__PURE__ */ jsxRuntime.jsx(NavigationMenuItem, { children: /* @__PURE__ */ jsxRuntime.jsx(
+                        NavigationMenuLink,
+                        {
+                          asChild: true,
+                          className: navigationMenuTriggerStyle(),
+                          children: /* @__PURE__ */ jsxRuntime.jsx(Pressable, { href: item.url, children: item.title })
+                        }
+                      ) }, index)
+                    ) })
+                  }
+                )
+              ] }),
               /* @__PURE__ */ jsxRuntime.jsx(
-                NavbarLogo,
+                "div",
                 {
-                  logo,
-                  logoSlot,
-                  logoClassName,
-                  optixFlowConfig
+                  className: cn(
+                    "hidden items-center gap-2 lg:flex",
+                    actionsClassName
+                  ),
+                  children: renderAuthActions
                 }
               ),
-              /* @__PURE__ */ jsxRuntime.jsx(
-                NavigationMenu,
+              /* @__PURE__ */ jsxRuntime.jsx("div", { className: "lg:hidden", children: /* @__PURE__ */ jsxRuntime.jsx(
+                Pressable,
                 {
-                  className: cn("hidden lg:flex", navigationMenuClassName),
-                  children: /* @__PURE__ */ jsxRuntime.jsx(NavigationMenuList, { children: menuSlot ? menuSlot : renderMenu()?.map(
-                    (item, index) => item.items ? /* @__PURE__ */ jsxRuntime.jsxs(NavigationMenuItem, { children: [
-                      /* @__PURE__ */ jsxRuntime.jsx(NavigationMenuTrigger, { children: item.title }),
-                      /* @__PURE__ */ jsxRuntime.jsx(NavigationMenuContent, { children: /* @__PURE__ */ jsxRuntime.jsx("ul", { className: "grid w-[400px] gap-3 p-4 md:w-[500px] md:grid-cols-2", children: item.items.map((subItem, subIndex) => /* @__PURE__ */ jsxRuntime.jsx("li", { children: /* @__PURE__ */ jsxRuntime.jsx(NavigationMenuLink, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsxs(
-                        Pressable,
-                        {
-                          href: subItem.url,
-                          className: "block select-none space-y-1 rounded-md p-3 leading-none no-underline outline-none transition-colors hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground",
-                          children: [
-                            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-2", children: [
-                              subItem.icon && /* @__PURE__ */ jsxRuntime.jsx(
-                                DynamicIcon,
-                                {
-                                  name: subItem.icon,
-                                  size: 16
-                                }
-                              ),
-                              /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-sm font-medium leading-none", children: subItem.title })
-                            ] }),
-                            subItem.description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "line-clamp-2 text-sm leading-snug text-muted-foreground", children: subItem.description })
-                          ]
-                        }
-                      ) }) }, subIndex)) }) })
-                    ] }, index) : /* @__PURE__ */ jsxRuntime.jsx(NavigationMenuItem, { children: /* @__PURE__ */ jsxRuntime.jsx(
-                      NavigationMenuLink,
-                      {
-                        asChild: true,
-                        className: navigationMenuTriggerStyle(),
-                        children: /* @__PURE__ */ jsxRuntime.jsx(Pressable, { href: item.url, children: item.title })
-                      }
-                    ) }, index)
-                  ) })
-                }
-              )
-            ] }),
-            /* @__PURE__ */ jsxRuntime.jsx(
-              "div",
-              {
-                className: cn(
-                  "hidden items-center gap-2 lg:flex",
-                  actionsClassName
-                ),
-                children: renderAuthActions()
-              }
-            ),
-            /* @__PURE__ */ jsxRuntime.jsxs(
-              Pressable,
-              {
-                variant: "outline",
-                size: "icon",
-                asButton: true,
-                className: "lg:hidden",
-                onClick: () => setIsOpen(!isOpen),
-                children: [
-                  /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/menu", size: 20 }),
-                  /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Toggle menu" })
-                ]
-              }
-            ),
-            /* @__PURE__ */ jsxRuntime.jsx(
-              NavbarMobileMenu,
-              {
-                open: isOpen,
-                onClose: () => setIsOpen(false),
-                title: "Navigation Menu",
-                children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "max-w-screen-sm mx-auto", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex h-full flex-col", children: [
-                  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center justify-between border-b pb-4", children: /* @__PURE__ */ jsxRuntime.jsx(
-                    NavbarLogo,
+                  className: "size-11",
+                  variant: "ghost",
+                  size: "icon",
+                  asButton: true,
+                  onClick: handleMobileMenu,
+                  children: /* @__PURE__ */ jsxRuntime.jsx(
+                    DynamicIcon,
                     {
-                      logo,
-                      logoSlot,
-                      logoClassName,
-                      optixFlowConfig
+                      name: "lucide/menu",
+                      size: 22,
+                      className: "stroke-foreground"
                     }
-                  ) }),
-                  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex-1 overflow-y-auto py-4", children: /* @__PURE__ */ jsxRuntime.jsx(Accordion, { type: "single", collapsible: true, className: "w-full", children: menuSlot ? menuSlot : renderMenu()?.map(
-                    (item, index) => item.items ? /* @__PURE__ */ jsxRuntime.jsxs(
-                      AccordionItem,
-                      {
-                        value: `item-${index}`,
-                        children: [
-                          /* @__PURE__ */ jsxRuntime.jsx(AccordionTrigger, { className: "text-base hover:no-underline", children: item.title }),
-                          /* @__PURE__ */ jsxRuntime.jsx(AccordionContent, { children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col space-y-2 pl-4", children: item.items.map((subItem, subIndex) => /* @__PURE__ */ jsxRuntime.jsxs(
-                            Pressable,
-                            {
-                              href: subItem.url,
-                              className: "flex items-center gap-2 rounded-md py-2 text-sm text-muted-foreground hover:text-foreground",
-                              onClick: () => setIsOpen(false),
-                              children: [
-                                subItem.icon && /* @__PURE__ */ jsxRuntime.jsx(
-                                  DynamicIcon,
-                                  {
-                                    name: subItem.icon,
-                                    size: 14
-                                  }
-                                ),
-                                subItem.title
-                              ]
-                            },
-                            subIndex
-                          )) }) })
-                        ]
-                      },
-                      index
-                    ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "border-b py-4", children: /* @__PURE__ */ jsxRuntime.jsx(
-                      Pressable,
-                      {
-                        href: item.url,
-                        className: "text-base font-medium",
-                        onClick: () => setIsOpen(false),
-                        children: item.title
-                      }
-                    ) }, index)
-                  ) }) }),
-                  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "border-t pt-4", children: [
-                    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-2", children: renderAuthActions() }),
-                    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-4 flex flex-wrap gap-x-4 gap-y-2", children: mobileExtraLinksSlot ? mobileExtraLinksSlot : renderMobileExtraLinks()?.map((link, index) => /* @__PURE__ */ jsxRuntime.jsx(
-                      Pressable,
-                      {
-                        href: link.url,
-                        className: "text-xs text-muted-foreground hover:text-foreground",
-                        onClick: () => setIsOpen(false),
-                        children: link.title
-                      },
-                      index
-                    )) })
-                  ] })
-                ] }) })
-              }
-            )
-          ]
-        }
-      ) }) }) })
+                  )
+                }
+              ) })
+            ]
+          }
+        ) }) }) })
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      MobileNavigationMenu6,
+      {
+        open: isOpen,
+        setOpen: setIsOpen,
+        menu: menu ?? [],
+        menuSlot,
+        authActions,
+        authActionsSlot,
+        mobileExtraLinks,
+        mobileExtraLinksSlot
+      }
+    )
+  ] });
+};
+var MobileNavigationMenu6 = ({
+  open,
+  setOpen,
+  menu,
+  menuSlot,
+  authActions,
+  authActionsSlot,
+  mobileExtraLinks,
+  mobileExtraLinksSlot
+}) => {
+  const renderMobileAuthActions = React52.useMemo(() => {
+    if (authActionsSlot) return authActionsSlot;
+    if (!authActions || authActions.length === 0) return null;
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-4", children: authActions.map((action, index) => {
+      const {
+        label,
+        icon,
+        iconAfter,
+        children,
+        className: actionClassName,
+        ...pressableProps
+      } = action;
+      return /* @__PURE__ */ jsxRuntime.jsx(
+        Pressable,
+        {
+          asButton: true,
+          className: cn("w-full", actionClassName),
+          ...pressableProps,
+          children: children ?? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+            icon,
+            label,
+            iconAfter
+          ] })
+        },
+        index
+      );
+    }) });
+  }, [authActionsSlot, authActions]);
+  const renderMobileExtraLinks = React52.useMemo(() => {
+    if (mobileExtraLinksSlot) return mobileExtraLinksSlot;
+    if (!mobileExtraLinks || mobileExtraLinks.length === 0) return null;
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-4 flex flex-wrap gap-x-4 gap-y-2", children: mobileExtraLinks.map((link, index) => /* @__PURE__ */ jsxRuntime.jsx(
+      Pressable,
+      {
+        href: link.url,
+        className: "text-xs text-muted-foreground hover:text-foreground",
+        children: link.title
+      },
+      index
+    )) });
+  }, [mobileExtraLinksSlot, mobileExtraLinks]);
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    NavbarMobileMenu,
+    {
+      open,
+      onClose: () => setOpen(false),
+      title: "Navigation Menu",
+      children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "max-w-screen-sm mx-auto", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-6", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(Accordion, { type: "single", collapsible: true, className: "w-full", children: menuSlot ? menuSlot : menu.map(
+          (item, index) => item.items ? /* @__PURE__ */ jsxRuntime.jsxs(
+            AccordionItem,
+            {
+              value: `nav-${index}`,
+              className: "border-b-0",
+              children: [
+                /* @__PURE__ */ jsxRuntime.jsx(AccordionTrigger, { className: "h-15 items-center p-0 px-4! text-base leading-[3.75] font-normal text-muted-foreground hover:bg-muted hover:no-underline", children: item.title }),
+                /* @__PURE__ */ jsxRuntime.jsx(AccordionContent, { className: "overflow-x-none", children: item.items.map((subItem, subIndex) => /* @__PURE__ */ jsxRuntime.jsxs(
+                  Pressable,
+                  {
+                    href: subItem.url,
+                    className: "flex min-h-12 items-center gap-2 rounded-lg px-4 text-muted-foreground transition-colors duration-300 hover:bg-muted hover:text-foreground",
+                    children: [
+                      subItem.icon && /* @__PURE__ */ jsxRuntime.jsx(
+                        DynamicIcon,
+                        {
+                          name: subItem.icon,
+                          size: 16,
+                          className: "stroke-muted-foreground"
+                        }
+                      ),
+                      subItem.title
+                    ]
+                  },
+                  `mobile-link-${index}-${subIndex}`
+                )) })
+              ]
+            },
+            `nav-item-${index}`
+          ) : /* @__PURE__ */ jsxRuntime.jsx(
+            Pressable,
+            {
+              href: item.url,
+              className: "flex h-15 items-center rounded-md p-0 px-4 text-left text-base leading-[3.75] font-normal text-muted-foreground ring-ring/10 outline-ring/50 transition-all hover:bg-muted focus-visible:ring-4 focus-visible:outline-1 nth-last-1:border-0",
+              children: item.title
+            },
+            `nav-link-${index}`
+          )
+        ) }),
+        renderMobileAuthActions,
+        renderMobileExtraLinks
+      ] }) })
     }
   );
 };
+var platformIconMap = {
+  instagram: "cib/instagram",
+  linkedin: "cib/linkedin",
+  google: "cib/google",
+  facebook: "cib/facebook",
+  tiktok: "cib/tiktok",
+  youtube: "cib/youtube",
+  yelp: "cib/yelp",
+  spotify: "cib/spotify",
+  apple: "cib/apple",
+  x: "line-md/twitter-x"
+};
+var SocialLinkIcon = React52__namespace.forwardRef(
+  ({
+    platformName,
+    label,
+    iconSize = 20,
+    iconColor,
+    iconClassName,
+    className,
+    ...pressableProps
+  }, ref) => {
+    const iconName = platformIconMap[platformName];
+    const accessibleLabel = label || platformName;
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      Pressable,
+      {
+        ref,
+        "aria-label": accessibleLabel,
+        className: cn(
+          "inline-flex items-center justify-center transition-colors",
+          className
+        ),
+        ...pressableProps,
+        children: /* @__PURE__ */ jsxRuntime.jsx(
+          DynamicIcon,
+          {
+            name: iconName,
+            size: iconSize,
+            color: iconColor,
+            className: iconClassName,
+            alt: accessibleLabel
+          }
+        )
+      }
+    );
+  }
+);
+SocialLinkIcon.displayName = "SocialLinkIcon";
 var NavbarTransparentOverlay = ({
   className,
   containerClassName,
   navClassName,
   navigationMenuClassName,
   actionsClassName,
+  mobileMenuClassName,
+  socialLinksClassName,
   logo,
   logoSlot,
   logoClassName,
@@ -61549,6 +61691,8 @@ var NavbarTransparentOverlay = ({
   authActionsSlot,
   mobileAuthActions,
   mobileAuthActionsSlot,
+  socialLinks,
+  socialLinksSlot,
   layoutVariant = "fullScreenContainerizedLinks",
   background,
   spacing,
@@ -61567,14 +61711,7 @@ var NavbarTransparentOverlay = ({
     window.addEventListener("scroll", handleScroll);
     return () => window.removeEventListener("scroll", handleScroll);
   }, []);
-  React52.useEffect(() => {
-    if (typeof document === "undefined") return;
-    document.body.style.overflow = isOpen ? "hidden" : "auto";
-    return () => {
-      document.body.style.overflow = "auto";
-    };
-  }, [isOpen]);
-  const toggleMenu = () => setIsOpen(!isOpen);
+  const handleMobileMenuClose = () => setIsOpen(false);
   const renderNavigation = React52.useMemo(() => {
     if (navigationSlot) return navigationSlot;
     if (!navItems || navItems.length === 0) return null;
@@ -61629,35 +61766,6 @@ var NavbarTransparentOverlay = ({
       );
     });
   }, [authActionsSlot, authActions, isScrolled]);
-  const renderMobileAuthActions = React52.useMemo(() => {
-    if (mobileAuthActionsSlot) return mobileAuthActionsSlot;
-    if (!mobileAuthActions || mobileAuthActions.length === 0) return null;
-    return mobileAuthActions.map((action, index) => {
-      const {
-        label,
-        icon,
-        iconAfter,
-        children,
-        className: actionClassName,
-        ...pressableProps
-      } = action;
-      return /* @__PURE__ */ jsxRuntime.jsx(
-        Pressable,
-        {
-          asButton: true,
-          className: cn("min-w-[200px]", actionClassName),
-          onClick: () => setIsOpen(false),
-          ...pressableProps,
-          children: children ?? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-            icon,
-            label,
-            iconAfter
-          ] })
-        },
-        index
-      );
-    });
-  }, [mobileAuthActionsSlot, mobileAuthActions]);
   const {
     sectionClasses,
     containerWrapperClasses,
@@ -61667,18 +61775,18 @@ var NavbarTransparentOverlay = ({
     sectionContainerMaxWidth,
     spacingOverride
   } = getNavbarLayoutClasses(layoutVariant, { className, containerClassName });
-  return /* @__PURE__ */ jsxRuntime.jsxs(
-    Section,
-    {
-      background,
-      spacing: spacingOverride ?? spacing,
-      className: sectionClasses,
-      pattern,
-      patternOpacity,
-      containerClassName: sectionContainerClassName,
-      containerMaxWidth: sectionContainerMaxWidth,
-      children: [
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: containerWrapperClasses, children: /* @__PURE__ */ jsxRuntime.jsx(
+  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      Section,
+      {
+        background,
+        spacing: spacingOverride ?? spacing,
+        className: sectionClasses,
+        pattern,
+        patternOpacity,
+        containerClassName: sectionContainerClassName,
+        containerMaxWidth: sectionContainerMaxWidth,
+        children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: containerWrapperClasses, children: /* @__PURE__ */ jsxRuntime.jsx(
           "nav",
           {
             className: cn(
@@ -61718,95 +61826,144 @@ var NavbarTransparentOverlay = ({
                   children: renderAuthActions
                 }
               ),
-              /* @__PURE__ */ jsxRuntime.jsxs(
-                "button",
+              /* @__PURE__ */ jsxRuntime.jsx("div", { className: "lg:hidden", children: /* @__PURE__ */ jsxRuntime.jsx(
+                Pressable,
                 {
-                  onClick: toggleMenu,
+                  variant: "ghost",
+                  size: "icon",
+                  asButton: true,
+                  "aria-label": "Open menu",
+                  onClick: () => setIsOpen(true),
                   className: cn(
-                    "z-50 flex h-10 w-10 flex-col items-center justify-center gap-1.5 lg:hidden"
+                    "size-11",
+                    !isScrolled && "hover:bg-white/10"
                   ),
-                  "aria-label": "Toggle menu",
-                  children: [
-                    /* @__PURE__ */ jsxRuntime.jsx(
-                      "span",
-                      {
-                        className: cn(
-                          "h-0.5 w-6 transition-all duration-300",
-                          isOpen ? "translate-y-2 rotate-45 bg-foreground" : isScrolled ? "bg-foreground" : "bg-white"
-                        )
-                      }
-                    ),
-                    /* @__PURE__ */ jsxRuntime.jsx(
-                      "span",
-                      {
-                        className: cn(
-                          "h-0.5 w-6 transition-all duration-300",
-                          isOpen ? "opacity-0" : isScrolled ? "bg-foreground" : "bg-white"
-                        )
-                      }
-                    ),
-                    /* @__PURE__ */ jsxRuntime.jsx(
-                      "span",
-                      {
-                        className: cn(
-                          "h-0.5 w-6 transition-all duration-300",
-                          isOpen ? "-translate-y-2 -rotate-45 bg-foreground" : isScrolled ? "bg-foreground" : "bg-white"
-                        )
-                      }
-                    )
-                  ]
+                  children: /* @__PURE__ */ jsxRuntime.jsx(
+                    DynamicIcon,
+                    {
+                      name: "lucide/menu",
+                      size: 16,
+                      className: cn(
+                        isScrolled ? "stroke-foreground" : "stroke-white"
+                      )
+                    }
+                  )
                 }
-              )
+              ) })
             ] }) })
           }
-        ) }),
-        /* @__PURE__ */ jsxRuntime.jsx(
+        ) })
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      MobileNavigationMenu7,
+      {
+        open: isOpen,
+        onClose: handleMobileMenuClose,
+        navItems,
+        mobileAuthActions,
+        mobileAuthActionsSlot,
+        socialLinks,
+        socialLinksSlot,
+        mobileMenuClassName,
+        socialLinksClassName
+      }
+    )
+  ] });
+};
+var MobileNavigationMenu7 = ({
+  open,
+  onClose,
+  navItems,
+  mobileAuthActions,
+  mobileAuthActionsSlot,
+  socialLinks,
+  socialLinksSlot,
+  mobileMenuClassName,
+  socialLinksClassName
+}) => {
+  const renderMobileAuthActions = React52.useMemo(() => {
+    if (mobileAuthActionsSlot) return mobileAuthActionsSlot;
+    if (!mobileAuthActions || mobileAuthActions.length === 0) return null;
+    return mobileAuthActions.map((action, index) => {
+      const {
+        label,
+        icon,
+        iconAfter,
+        children,
+        className: actionClassName,
+        ...pressableProps
+      } = action;
+      return /* @__PURE__ */ jsxRuntime.jsx(
+        Pressable,
+        {
+          asButton: true,
+          className: cn("min-w-[200px]", actionClassName),
+          onClick: onClose,
+          ...pressableProps,
+          children: children ?? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+            icon,
+            label,
+            iconAfter
+          ] })
+        },
+        index
+      );
+    });
+  }, [mobileAuthActionsSlot, mobileAuthActions, onClose]);
+  const renderSocialLinks = React52.useMemo(() => {
+    if (socialLinksSlot) return socialLinksSlot;
+    if (!socialLinks || socialLinks.length === 0) return null;
+    return socialLinks.map((link) => /* @__PURE__ */ jsxRuntime.jsx(
+      SocialLinkIcon,
+      {
+        platformName: link.platformName,
+        href: link.href,
+        label: link.label,
+        iconSize: 24,
+        className: "text-white/70 transition-all duration-300 hover:text-white hover:scale-110"
+      },
+      link.platformName
+    ));
+  }, [socialLinksSlot, socialLinks]);
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    NavbarMobileMenu,
+    {
+      open,
+      onClose,
+      title: "Mobile Navigation",
+      className: cn("bg-black/95", mobileMenuClassName),
+      contentClassName: "flex flex-col items-center justify-center",
+      children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex h-full flex-col items-center justify-center", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("nav", { className: "flex flex-col items-center gap-8", children: navItems?.map((item, index) => /* @__PURE__ */ jsxRuntime.jsxs(
+          Pressable,
+          {
+            href: item.url,
+            className: "text-3xl font-medium text-white transition-all duration-300 hover:text-white/80",
+            onClick: onClose,
+            children: [
+              item.icon ?? (item.iconName && /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: item.iconName, size: 24 })),
+              item.title
+            ]
+          },
+          index
+        )) }),
+        renderMobileAuthActions && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-12 flex flex-col items-center gap-4", children: renderMobileAuthActions }),
+        renderSocialLinks && /* @__PURE__ */ jsxRuntime.jsx(
           "div",
           {
             className: cn(
-              "fixed inset-0 z-40 bg-background transition-all duration-500 lg:hidden",
-              isOpen ? "opacity-100 pointer-events-auto" : "opacity-0 pointer-events-none"
+              "mt-12 flex flex-row flex-wrap items-center justify-center gap-6",
+              socialLinksClassName
             ),
-            children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex h-full flex-col items-center justify-center", children: [
-              /* @__PURE__ */ jsxRuntime.jsx("nav", { className: "flex flex-col items-center gap-8", children: navItems?.map((item, index) => /* @__PURE__ */ jsxRuntime.jsxs(
-                Pressable,
-                {
-                  href: item.url,
-                  className: cn(
-                    "text-3xl font-medium text-foreground transition-all duration-300",
-                    isOpen ? "translate-y-0 opacity-100" : "translate-y-4 opacity-0"
-                  ),
-                  style: {
-                    transitionDelay: isOpen ? `${index * 100}ms` : "0ms"
-                  },
-                  onClick: () => setIsOpen(false),
-                  children: [
-                    item.icon ?? (item.iconName && /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: item.iconName, size: 24 })),
-                    item.title
-                  ]
-                },
-                index
-              )) }),
-              /* @__PURE__ */ jsxRuntime.jsx(
-                "div",
-                {
-                  className: cn(
-                    "mt-12 flex flex-col items-center gap-4 transition-all duration-300",
-                    isOpen ? "translate-y-0 opacity-100" : "translate-y-4 opacity-0"
-                  ),
-                  style: {
-                    transitionDelay: isOpen ? `${(navItems?.length ?? 0) * 100}ms` : "0ms"
-                  },
-                  children: renderMobileAuthActions
-                }
-              )
-            ] })
+            children: renderSocialLinks
           }
         )
-      ]
+      ] })
     }
   );
 };
+var MOBILE_BREAKPOINT6 = 1024;
 var NavbarEducationPlatform = ({
   className,
   containerClassName,
@@ -61817,12 +61974,12 @@ var NavbarEducationPlatform = ({
   mobileMenuClassName,
   logo,
   logoSlot,
-  features,
-  docs,
-  company,
-  featuredImage,
+  menu,
+  menuSlot,
   authActions,
   authActionsSlot,
+  mobileAuthActions,
+  mobileAuthActionsSlot,
   layoutVariant = "fullScreenContainerizedLinks",
   background,
   spacing,
@@ -61831,6 +61988,33 @@ var NavbarEducationPlatform = ({
   optixFlowConfig
 }) => {
   const [isOpen, setIsOpen] = React52.useState(false);
+  React52.useEffect(() => {
+    if (typeof window === "undefined") return;
+    const handleResize = () => {
+      if (window.innerWidth > MOBILE_BREAKPOINT6) {
+        setIsOpen(false);
+      }
+    };
+    handleResize();
+    window.addEventListener("resize", handleResize);
+    return () => window.removeEventListener("resize", handleResize);
+  }, []);
+  const handleMobileMenuClose = () => {
+    setIsOpen(false);
+  };
+  const renderNavigation = React52.useMemo(() => {
+    if (menuSlot) return menuSlot;
+    if (!menu || menu.length === 0) return null;
+    return /* @__PURE__ */ jsxRuntime.jsx(NavigationMenuList, { children: menu.map((item, index) => /* @__PURE__ */ jsxRuntime.jsx(
+      DesktopMenuItem7,
+      {
+        item,
+        index,
+        optixFlowConfig
+      },
+      `desktop-link-${index}`
+    )) });
+  }, [menuSlot, menu, optixFlowConfig]);
   const renderAuthActions = React52.useMemo(() => {
     if (authActionsSlot) return authActionsSlot;
     if (!authActions || authActions.length === 0) return null;
@@ -61859,166 +62043,43 @@ var NavbarEducationPlatform = ({
     sectionContainerMaxWidth,
     spacingOverride
   } = getNavbarLayoutClasses(layoutVariant, { className, containerClassName });
-  return /* @__PURE__ */ jsxRuntime.jsxs(
-    Section,
-    {
-      background,
-      spacing: spacingOverride ?? spacing,
-      className: cn(isOpen && "border-b-0", sectionClasses),
-      pattern,
-      patternOpacity,
-      containerClassName: sectionContainerClassName,
-      containerMaxWidth: sectionContainerMaxWidth,
-      children: [
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: containerWrapperClasses, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: navWrapperClasses, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: innerContainerClasses, children: /* @__PURE__ */ jsxRuntime.jsxs(
-          "nav",
-          {
-            className: cn(
-              "flex items-center justify-between py-4",
-              navClassName
-            ),
-            children: [
-              /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-1 items-center gap-9", children: [
-                /* @__PURE__ */ jsxRuntime.jsx(
-                  NavbarLogo,
-                  {
-                    logo,
-                    logoSlot,
-                    logoClassName,
-                    optixFlowConfig
-                  }
-                ),
-                /* @__PURE__ */ jsxRuntime.jsx(
-                  "div",
-                  {
-                    className: cn(
-                      "hidden items-center gap-1.5 lg:flex",
-                      navigationMenuClassName
-                    ),
-                    children: /* @__PURE__ */ jsxRuntime.jsx(NavigationMenu, { delayDuration: 0, children: /* @__PURE__ */ jsxRuntime.jsxs(NavigationMenuList, { children: [
-                      /* @__PURE__ */ jsxRuntime.jsxs(NavigationMenuItem, { children: [
-                        /* @__PURE__ */ jsxRuntime.jsx(NavigationMenuTrigger, { children: "Products" }),
-                        /* @__PURE__ */ jsxRuntime.jsx(NavigationMenuContent, { className: "p-0", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex", children: [
-                          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "p-4", children: [
-                            /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mb-3 text-[10px] text-muted-foreground uppercase", children: "TOOLS" }),
-                            features?.map((feature) => /* @__PURE__ */ jsxRuntime.jsx(NavigationMenuLink, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsxs(
-                              Pressable,
-                              {
-                                href: feature.link,
-                                className: "group flex cursor-pointer flex-row gap-3",
-                                children: [
-                                  /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex size-10 shrink-0 items-center justify-center rounded-md border border-border bg-background", children: /* @__PURE__ */ jsxRuntime.jsx(
-                                    DynamicIcon,
-                                    {
-                                      name: feature.icon,
-                                      size: 20
-                                    }
-                                  ) }),
-                                  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
-                                    /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex items-center gap-0.5 text-sm font-medium whitespace-nowrap", children: [
-                                      feature.title,
-                                      /* @__PURE__ */ jsxRuntime.jsx(
-                                        DynamicIcon,
-                                        {
-                                          name: "lucide/chevron-right",
-                                          size: 16,
-                                          className: "text-primary! opacity-0 transition-all duration-200 group-hover:translate-x-0.5 group-hover:opacity-100"
-                                        }
-                                      )
-                                    ] }),
-                                    /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs whitespace-nowrap text-muted-foreground", children: feature.description })
-                                  ] })
-                                ]
-                              }
-                            ) }, feature.title))
-                          ] }),
-                          /* @__PURE__ */ jsxRuntime.jsx(
-                            Separator,
-                            {
-                              orientation: "vertical",
-                              className: "data-[orientation=vertical]:h-auto"
-                            }
-                          ),
-                          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "p-4", children: [
-                            /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mb-3 text-[10px] text-muted-foreground uppercase", children: "QUICK START" }),
-                            /* @__PURE__ */ jsxRuntime.jsx("div", {}),
-                            featuredImage && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-                              /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-5 mb-3 text-[10px] text-muted-foreground uppercase", children: "LATEST UPDATES" }),
-                              /* @__PURE__ */ jsxRuntime.jsx(NavigationMenuLink, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(Pressable, { href: featuredImage.href || "#", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "rounded-lg bg-primary p-3", children: /* @__PURE__ */ jsxRuntime.jsx(
-                                img.Img,
-                                {
-                                  src: featuredImage.src,
-                                  alt: featuredImage.alt || "Featured update",
-                                  className: "aspect-video min-w-52 rounded-md object-cover",
-                                  optixFlowConfig
-                                }
-                              ) }) }) })
-                            ] })
-                          ] })
-                        ] }) })
-                      ] }),
-                      /* @__PURE__ */ jsxRuntime.jsxs(NavigationMenuItem, { children: [
-                        /* @__PURE__ */ jsxRuntime.jsx(NavigationMenuTrigger, { children: "Support" }),
-                        /* @__PURE__ */ jsxRuntime.jsx(NavigationMenuContent, { className: "p-0", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex", children: [
-                          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "p-4", children: [
-                            /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mb-3 text-[10px] text-muted-foreground uppercase", children: "GUIDES" }),
-                            docs?.map((doc) => /* @__PURE__ */ jsxRuntime.jsx(NavigationMenuLink, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsxs(
-                              Pressable,
-                              {
-                                href: doc.link,
-                                className: "group flex flex-row gap-3",
-                                children: [
-                                  /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex size-10 shrink-0 items-center justify-center rounded-md border border-border bg-background", children: /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: doc.icon, size: 20 }) }),
-                                  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
-                                    /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex items-center gap-0.5 text-sm font-medium whitespace-nowrap", children: [
-                                      doc.title,
-                                      /* @__PURE__ */ jsxRuntime.jsx(
-                                        DynamicIcon,
-                                        {
-                                          name: "lucide/chevron-right",
-                                          size: 16,
-                                          className: "text-primary! opacity-0 transition-all duration-200 group-hover:translate-x-0.5 group-hover:opacity-100"
-                                        }
-                                      )
-                                    ] }),
-                                    /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs whitespace-nowrap text-muted-foreground", children: doc.description })
-                                  ] })
-                                ]
-                              }
-                            ) }, doc.title))
-                          ] }),
-                          /* @__PURE__ */ jsxRuntime.jsx(
-                            Separator,
-                            {
-                              orientation: "vertical",
-                              className: "data-[orientation=vertical]:h-auto"
-                            }
-                          ),
-                          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "p-4", children: [
-                            /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mb-3 text-[10px] text-muted-foreground uppercase", children: "ABOUT US" }),
-                            /* @__PURE__ */ jsxRuntime.jsx("div", { children: company?.map((item) => /* @__PURE__ */ jsxRuntime.jsx(NavigationMenuLink, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsxs(
-                              Pressable,
-                              {
-                                href: item.link,
-                                className: "flex flex-row items-center gap-3",
-                                children: [
-                                  /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: item.icon, size: 16 }),
-                                  /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm font-medium whitespace-nowrap", children: item.title })
-                                ]
-                              }
-                            ) }, item.title)) })
-                          ] })
-                        ] }) })
-                      ] }),
-                      /* @__PURE__ */ jsxRuntime.jsx(NavigationMenuItem, { children: /* @__PURE__ */ jsxRuntime.jsx(
-                        NavigationMenuLink,
-                        {
-                          asChild: true,
-                          className: navigationMenuTriggerStyle(),
-                          children: /* @__PURE__ */ jsxRuntime.jsx(Pressable, { href: "#", children: "About" })
-                        }
-                      ) })
-                    ] }) })
+  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      Section,
+      {
+        background,
+        spacing: spacingOverride ?? spacing,
+        className: sectionClasses,
+        pattern,
+        patternOpacity,
+        containerClassName: sectionContainerClassName,
+        containerMaxWidth: sectionContainerMaxWidth,
+        children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: containerWrapperClasses, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: navWrapperClasses, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: innerContainerClasses, children: /* @__PURE__ */ jsxRuntime.jsxs(
+          "nav",
+          {
+            className: cn(
+              "flex items-center justify-between py-4",
+              navClassName
+            ),
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-1 items-center gap-9", children: [
+                /* @__PURE__ */ jsxRuntime.jsx(
+                  NavbarLogo,
+                  {
+                    logo,
+                    logoSlot,
+                    logoClassName,
+                    optixFlowConfig
+                  }
+                ),
+                /* @__PURE__ */ jsxRuntime.jsx(
+                  "div",
+                  {
+                    className: cn(
+                      "hidden items-center gap-1.5 lg:flex",
+                      navigationMenuClassName
+                    ),
+                    children: /* @__PURE__ */ jsxRuntime.jsx(NavigationMenu, { delayDuration: 0, viewport: false, children: renderNavigation })
                   }
                 )
               ] }),
@@ -62032,113 +62093,194 @@ var NavbarEducationPlatform = ({
                   children: renderAuthActions
                 }
               ),
-              /* @__PURE__ */ jsxRuntime.jsxs(
+              /* @__PURE__ */ jsxRuntime.jsx("div", { className: "lg:hidden", children: /* @__PURE__ */ jsxRuntime.jsx(
                 Pressable,
                 {
-                  variant: "outline",
+                  className: "size-11",
+                  variant: "ghost",
                   size: "icon",
                   asButton: true,
-                  className: "lg:hidden",
                   onClick: () => setIsOpen(!isOpen),
-                  children: [
-                    isOpen ? /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/x", size: 20 }) : /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/menu", size: 20 }),
-                    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "sr-only", children: "Toggle menu" })
-                  ]
+                  children: /* @__PURE__ */ jsxRuntime.jsx(
+                    DynamicIcon,
+                    {
+                      name: "lucide/menu",
+                      size: 22,
+                      className: "stroke-foreground"
+                    }
+                  )
                 }
-              )
+              ) })
             ]
           }
-        ) }) }) }),
-        isOpen && /* @__PURE__ */ jsxRuntime.jsx(
-          "div",
+        ) }) }) })
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      MobileNavigationMenu8,
+      {
+        open: isOpen,
+        onClose: handleMobileMenuClose,
+        menu: menu ?? [],
+        mobileAuthActions,
+        mobileAuthActionsSlot,
+        mobileMenuClassName
+      }
+    )
+  ] });
+};
+var DesktopMenuItem7 = ({
+  item,
+  index,
+  optixFlowConfig
+}) => {
+  if (item.groups && item.groups.length > 0) {
+    return /* @__PURE__ */ jsxRuntime.jsxs(NavigationMenuItem, { value: `${index}`, children: [
+      /* @__PURE__ */ jsxRuntime.jsx(NavigationMenuTrigger, { children: item.label }),
+      /* @__PURE__ */ jsxRuntime.jsx(NavigationMenuContent, { className: "p-0", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex", children: item.groups.map((group, groupIndex) => /* @__PURE__ */ jsxRuntime.jsxs(React52__namespace.Fragment, { children: [
+        groupIndex > 0 && /* @__PURE__ */ jsxRuntime.jsx(
+          Separator,
           {
-            className: cn(
-              "border-t bg-background lg:hidden",
-              mobileMenuClassName
-            ),
-            children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("container", containerClassName), children: [
-              /* @__PURE__ */ jsxRuntime.jsxs(Accordion, { type: "single", collapsible: true, className: "w-full", children: [
-                /* @__PURE__ */ jsxRuntime.jsxs(AccordionItem, { value: "learning-hub", children: [
-                  /* @__PURE__ */ jsxRuntime.jsx(AccordionTrigger, { className: "pr-2.5 text-base font-medium hover:no-underline", children: "Products" }),
-                  /* @__PURE__ */ jsxRuntime.jsx(AccordionContent, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-5", children: [
-                    /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
-                      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mb-3 text-[10px] text-muted-foreground uppercase", children: "TOOLS" }),
-                      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-5", children: features?.map((feature) => /* @__PURE__ */ jsxRuntime.jsxs(
-                        Pressable,
-                        {
-                          href: feature.link,
-                          className: "group flex cursor-pointer flex-row gap-3 rounded-md transition-colors",
-                          onClick: () => setIsOpen(false),
-                          children: [
-                            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex size-8 shrink-0 items-center justify-center rounded-md border border-border bg-background", children: /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: feature.icon, size: 16 }) }),
-                            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex min-w-0 flex-col", children: [
-                              /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm leading-tight font-medium", children: feature.title }),
-                              /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs leading-tight text-muted-foreground", children: feature.description })
-                            ] })
-                          ]
-                        },
-                        feature.title
-                      )) })
-                    ] }),
-                    /* @__PURE__ */ jsxRuntime.jsx(Separator, {}),
-                    /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mb-3 text-[10px] text-muted-foreground uppercase", children: "QUICK START" }) })
-                  ] }) })
-                ] }),
-                /* @__PURE__ */ jsxRuntime.jsxs(AccordionItem, { value: "support", className: "last:border-b", children: [
-                  /* @__PURE__ */ jsxRuntime.jsx(AccordionTrigger, { className: "pr-2.5 text-base font-medium hover:no-underline", children: "Support" }),
-                  /* @__PURE__ */ jsxRuntime.jsx(AccordionContent, { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-4", children: [
-                    /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
-                      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mb-3 text-[10px] text-muted-foreground uppercase", children: "GUIDES" }),
-                      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-5", children: docs?.map((doc) => /* @__PURE__ */ jsxRuntime.jsxs(
-                        Pressable,
-                        {
-                          href: doc.link,
-                          className: "group flex cursor-pointer flex-row gap-3 rounded-md transition-colors",
-                          onClick: () => setIsOpen(false),
-                          children: [
-                            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex size-8 shrink-0 items-center justify-center rounded-md border border-border bg-background", children: /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: doc.icon, size: 16 }) }),
-                            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex min-w-0 flex-col", children: [
-                              /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm leading-tight font-medium", children: doc.title }),
-                              /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs leading-tight text-muted-foreground", children: doc.description })
-                            ] })
-                          ]
-                        },
-                        doc.title
-                      )) })
-                    ] }),
-                    /* @__PURE__ */ jsxRuntime.jsx(Separator, {}),
-                    /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
-                      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mb-3 text-[10px] text-muted-foreground uppercase", children: "ABOUT US" }),
-                      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-5", children: company?.map((item) => /* @__PURE__ */ jsxRuntime.jsxs(
-                        Pressable,
-                        {
-                          href: item.link,
-                          className: "flex cursor-pointer flex-row items-center gap-3 rounded-md transition-colors",
-                          onClick: () => setIsOpen(false),
-                          children: [
-                            /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: item.icon, size: 16 }),
-                            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm font-medium", children: item.title })
-                          ]
-                        },
-                        item.title
-                      )) })
-                    ] })
-                  ] }) })
+            orientation: "vertical",
+            className: "data-[orientation=vertical]:h-auto"
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "p-4", children: [
+          /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mb-3 text-[10px] text-muted-foreground uppercase", children: group.label }),
+          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-1", children: group.links.map((link) => /* @__PURE__ */ jsxRuntime.jsx(NavigationMenuLink, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsxs(
+            Pressable,
+            {
+              href: link.href,
+              className: "group flex cursor-pointer flex-row gap-3",
+              children: [
+                link.icon && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "flex size-10 shrink-0 items-center justify-center rounded-md border border-border bg-background", children: /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: link.icon, size: 20 }) }),
+                /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
+                  /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "flex items-center gap-0.5 text-sm font-medium whitespace-nowrap", children: [
+                    link.title,
+                    /* @__PURE__ */ jsxRuntime.jsx(
+                      DynamicIcon,
+                      {
+                        name: "lucide/chevron-right",
+                        size: 16,
+                        className: "text-primary! opacity-0 transition-all duration-200 group-hover:translate-x-0.5 group-hover:opacity-100"
+                      }
+                    )
+                  ] }),
+                  link.description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-xs whitespace-nowrap text-muted-foreground", children: link.description })
                 ] })
-              ] }),
-              /* @__PURE__ */ jsxRuntime.jsx("div", { className: "space-y-2", children: /* @__PURE__ */ jsxRuntime.jsx(
-                Pressable,
-                {
-                  href: "#",
-                  className: "block border-b border-border py-4 pr-3 text-base font-medium transition-colors",
-                  onClick: () => setIsOpen(false),
-                  children: "About"
-                }
-              ) })
-            ] })
+              ]
+            }
+          ) }, link.title)) }),
+          group.featuredImage && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-4", children: /* @__PURE__ */ jsxRuntime.jsx(NavigationMenuLink, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(Pressable, { href: group.featuredImage.href || "#", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "rounded-lg bg-muted p-3", children: /* @__PURE__ */ jsxRuntime.jsx(
+            img.Img,
+            {
+              src: group.featuredImage.src,
+              alt: group.featuredImage.alt || "Featured image",
+              className: "aspect-video w-full max-w-[240px] rounded-md object-cover object-center",
+              optixFlowConfig
+            }
+          ) }) }) }) })
+        ] })
+      ] }, `group-${groupIndex}`)) }) })
+    ] }, `desktop-menu-item-${index}`);
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(NavigationMenuItem, { value: `${index}`, children: /* @__PURE__ */ jsxRuntime.jsx(NavigationMenuLink, { asChild: true, className: navigationMenuTriggerStyle(), children: /* @__PURE__ */ jsxRuntime.jsx(Pressable, { href: item.href, children: item.label }) }) }, `desktop-menu-item-${index}`);
+};
+var MobileNavigationMenu8 = ({
+  open,
+  onClose,
+  menu,
+  mobileAuthActions,
+  mobileAuthActionsSlot,
+  mobileMenuClassName
+}) => {
+  const renderMobileAuthActions = React52.useMemo(() => {
+    if (mobileAuthActionsSlot) return mobileAuthActionsSlot;
+    if (!mobileAuthActions || mobileAuthActions.length === 0) return null;
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-4", children: mobileAuthActions.map((action, index) => {
+      const {
+        label,
+        icon,
+        iconAfter,
+        children,
+        className: actionClassName,
+        ...pressableProps
+      } = action;
+      return /* @__PURE__ */ jsxRuntime.jsx(
+        Pressable,
+        {
+          asButton: true,
+          className: cn("w-full", actionClassName),
+          onClick: onClose,
+          ...pressableProps,
+          children: children ?? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+            icon,
+            label,
+            iconAfter
+          ] })
+        },
+        index
+      );
+    }) });
+  }, [mobileAuthActionsSlot, mobileAuthActions, onClose]);
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    NavbarMobileMenu,
+    {
+      open,
+      onClose,
+      title: "Mobile Navigation",
+      className: mobileMenuClassName,
+      children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "max-w-screen-sm mx-auto", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-6", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(Accordion, { type: "multiple", className: "w-full", children: menu.map((item, index) => {
+          if (item.groups && item.groups.length > 0) {
+            return /* @__PURE__ */ jsxRuntime.jsxs(
+              AccordionItem,
+              {
+                value: `nav-${index}`,
+                className: "border-b-0",
+                children: [
+                  /* @__PURE__ */ jsxRuntime.jsx(AccordionTrigger, { className: "h-15 items-center p-0 px-4! text-base leading-[3.75] font-normal text-muted-foreground hover:bg-muted hover:no-underline", children: item.label }),
+                  /* @__PURE__ */ jsxRuntime.jsx(AccordionContent, { className: "overflow-x-none", children: item.groups.map((group, groupIndex) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-4", children: [
+                    /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mb-2 px-4 text-[10px] text-muted-foreground uppercase", children: group.label }),
+                    group.links.map((link) => /* @__PURE__ */ jsxRuntime.jsxs(
+                      Pressable,
+                      {
+                        href: link.href,
+                        className: "flex min-h-12 items-center gap-2 rounded-lg px-4 text-muted-foreground transition-colors duration-300 hover:bg-muted hover:text-foreground",
+                        onClick: onClose,
+                        children: [
+                          link.icon && /* @__PURE__ */ jsxRuntime.jsx(
+                            DynamicIcon,
+                            {
+                              name: link.icon,
+                              size: 16,
+                              className: "stroke-muted-foreground"
+                            }
+                          ),
+                          link.title
+                        ]
+                      },
+                      link.title
+                    ))
+                  ] }, `mobile-group-${groupIndex}`)) })
+                ]
+              },
+              `nav-item-${index}`
+            );
           }
-        )
-      ]
+          return /* @__PURE__ */ jsxRuntime.jsx(
+            Pressable,
+            {
+              href: item.href,
+              className: "flex h-15 items-center rounded-md p-0 px-4 text-left text-base leading-[3.75] font-normal text-muted-foreground ring-ring/10 outline-ring/50 transition-all hover:bg-muted focus-visible:ring-4 focus-visible:outline-1",
+              onClick: onClose,
+              children: item.label
+            },
+            `nav-link-${index}`
+          );
+        }) }),
+        renderMobileAuthActions
+      ] }) })
     }
   );
 };
@@ -62562,94 +62704,15 @@ var NavbarSearchFocused = ({
                   )) }),
                   /* @__PURE__ */ jsxRuntime.jsx("div", { className: "border-t pt-4 mt-6", children: renderMobileMenuActions })
                 ] })
-              }
-            )
-          ]
-        }
-      ) }) }) })
-    }
-  );
-};
-var AnimatedHamburger = ({ isOpen }) => {
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "group relative size-full", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "absolute flex size-full items-center justify-center", children: [
-    /* @__PURE__ */ jsxRuntime.jsx(
-      DynamicIcon,
-      {
-        name: "lucide/menu",
-        size: 24,
-        className: `absolute text-muted-foreground transition-all duration-300 group-hover:text-foreground ${isOpen ? "rotate-90 opacity-0" : "rotate-0 opacity-100"}`
-      }
-    ),
-    /* @__PURE__ */ jsxRuntime.jsx(
-      DynamicIcon,
-      {
-        name: "lucide/x",
-        size: 24,
-        className: `absolute text-muted-foreground transition-all duration-300 group-hover:text-foreground ${isOpen ? "rotate-0 opacity-100" : "-rotate-90 opacity-0"}`
-      }
-    )
-  ] }) });
-};
-var MobileNav = ({
-  navItems,
-  activeItem,
-  setActiveItem,
-  actions,
-  actionsSlot
-}) => {
-  const [isOpen, setIsOpen] = React52.useState(false);
-  const renderActions = React52.useMemo(() => {
-    if (actionsSlot) return actionsSlot;
-    if (!actions || actions.length === 0) return null;
-    return actions.map((action, index) => {
-      const {
-        label,
-        icon,
-        iconAfter,
-        children,
-        className: actionClassName,
-        ...pressableProps
-      } = action;
-      return /* @__PURE__ */ jsxRuntime.jsx(
-        Pressable,
-        {
-          asButton: true,
-          className: actionClassName,
-          ...pressableProps,
-          children: children ?? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-            icon,
-            label,
-            iconAfter
-          ] })
-        },
-        index
-      );
-    });
-  }, [actionsSlot, actions]);
-  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex h-full items-center lg:hidden", children: /* @__PURE__ */ jsxRuntime.jsxs(Popover, { open: isOpen, onOpenChange: setIsOpen, children: [
-    /* @__PURE__ */ jsxRuntime.jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(Pressable, { variant: "ghost", size: "icon", asButton: true, onClick: () => {
-    }, children: /* @__PURE__ */ jsxRuntime.jsx(AnimatedHamburger, { isOpen }) }) }),
-    /* @__PURE__ */ jsxRuntime.jsx(
-      PopoverContent,
-      {
-        align: "end",
-        className: "relative top-4 -right-4 block w-[calc(100vw-32px)] overflow-hidden rounded-xl p-0 sm:top-auto sm:right-auto sm:w-80 lg:hidden",
-        children: /* @__PURE__ */ jsxRuntime.jsxs("ul", { className: "w-full bg-background py-4 text-foreground", children: [
-          navItems.map((navItem, idx) => /* @__PURE__ */ jsxRuntime.jsx("li", { children: /* @__PURE__ */ jsxRuntime.jsx(
-            Pressable,
-            {
-              href: navItem.link,
-              onClick: () => setActiveItem(navItem.name),
-              className: `flex items-center border-l-[3px] px-6 py-4 text-sm font-medium text-foreground transition-all duration-75 ${activeItem === navItem.name ? "border-foreground text-foreground" : "border-transparent text-muted-foreground hover:text-foreground"}`,
-              children: navItem.name
-            }
-          ) }, idx)),
-          (actionsSlot || actions && actions.length > 0) && /* @__PURE__ */ jsxRuntime.jsx("li", { className: "flex flex-col gap-3 px-7 py-2", children: renderActions })
-        ] })
-      }
-    )
-  ] }) });
+              }
+            )
+          ]
+        }
+      ) }) }) })
+    }
+  );
 };
+var MOBILE_BREAKPOINT7 = 1024;
 var NavbarSimpleLinks = ({
   className,
   containerClassName,
@@ -62657,6 +62720,7 @@ var NavbarSimpleLinks = ({
   navigationMenuClassName,
   menuListClassName,
   actionsClassName,
+  mobileMenuClassName,
   logo,
   logoSlot,
   logoClassName,
@@ -62665,6 +62729,8 @@ var NavbarSimpleLinks = ({
   defaultActiveItem,
   actions,
   actionsSlot,
+  mobileActions,
+  mobileActionsSlot,
   layoutVariant = "fullScreenContainerizedLinks",
   background,
   spacing,
@@ -62675,8 +62741,20 @@ var NavbarSimpleLinks = ({
   const [activeItem, setActiveItem] = React52.useState(
     defaultActiveItem || navItems?.[0]?.name || ""
   );
+  const [isOpen, setIsOpen] = React52.useState(false);
   const indicatorRef = React52.useRef(null);
   const menuRef = React52.useRef(null);
+  React52.useEffect(() => {
+    if (typeof window === "undefined") return;
+    const handleResize = () => {
+      if (window.innerWidth > MOBILE_BREAKPOINT7) {
+        setIsOpen(false);
+      }
+    };
+    handleResize();
+    window.addEventListener("resize", handleResize);
+    return () => window.removeEventListener("resize", handleResize);
+  }, []);
   React52.useEffect(() => {
     const updateIndicator = () => {
       const activeEl = document.querySelector(
@@ -62693,6 +62771,9 @@ var NavbarSimpleLinks = ({
     window.addEventListener("resize", updateIndicator);
     return () => window.removeEventListener("resize", updateIndicator);
   }, [activeItem]);
+  const handleMobileMenuClose = () => {
+    setIsOpen(false);
+  };
   const renderNavItems = React52.useMemo(() => {
     if (navItemsSlot) return navItemsSlot;
     if (!navItems || navItems.length === 0) return null;
@@ -62746,80 +62827,161 @@ var NavbarSimpleLinks = ({
     sectionContainerMaxWidth,
     spacingOverride
   } = getNavbarLayoutClasses(layoutVariant, { className, containerClassName });
+  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      Section,
+      {
+        background,
+        spacing: spacingOverride ?? spacing,
+        className: sectionClasses,
+        pattern,
+        patternOpacity,
+        containerClassName: sectionContainerClassName,
+        containerMaxWidth: sectionContainerMaxWidth,
+        children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: containerWrapperClasses, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: navWrapperClasses, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: innerContainerClasses, children: /* @__PURE__ */ jsxRuntime.jsxs(
+          "nav",
+          {
+            className: cn("flex items-center justify-between", navClassName),
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsx(
+                NavbarLogo,
+                {
+                  logo,
+                  logoSlot,
+                  logoClassName,
+                  optixFlowConfig
+                }
+              ),
+              /* @__PURE__ */ jsxRuntime.jsx(
+                NavigationMenu,
+                {
+                  className: cn("hidden lg:block", navigationMenuClassName),
+                  children: /* @__PURE__ */ jsxRuntime.jsxs(
+                    NavigationMenuList,
+                    {
+                      ref: menuRef,
+                      className: cn(
+                        "flex items-center gap-6 rounded-4xl px-8 py-3",
+                        menuListClassName
+                      ),
+                      children: [
+                        renderNavItems,
+                        /* @__PURE__ */ jsxRuntime.jsx(
+                          "div",
+                          {
+                            ref: indicatorRef,
+                            className: "absolute bottom-2 flex h-1 items-center justify-center px-2 transition-all duration-300",
+                            children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-0.5 w-full rounded-t-none bg-foreground transition-all duration-300" })
+                          }
+                        )
+                      ]
+                    }
+                  )
+                }
+              ),
+              /* @__PURE__ */ jsxRuntime.jsx("div", { className: "lg:hidden", children: /* @__PURE__ */ jsxRuntime.jsx(
+                Pressable,
+                {
+                  className: "size-11",
+                  variant: "ghost",
+                  size: "icon",
+                  asButton: true,
+                  onClick: () => setIsOpen(!isOpen),
+                  children: /* @__PURE__ */ jsxRuntime.jsx(
+                    DynamicIcon,
+                    {
+                      name: "lucide/menu",
+                      size: 22,
+                      className: "stroke-foreground"
+                    }
+                  )
+                }
+              ) }),
+              /* @__PURE__ */ jsxRuntime.jsx(
+                "div",
+                {
+                  className: cn(
+                    "hidden items-center gap-2 lg:flex",
+                    actionsClassName
+                  ),
+                  children: renderActions
+                }
+              )
+            ]
+          }
+        ) }) }) })
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      MobileNavigationMenu9,
+      {
+        open: isOpen,
+        onClose: handleMobileMenuClose,
+        navItems: navItems ?? [],
+        mobileActions,
+        mobileActionsSlot,
+        mobileMenuClassName
+      }
+    )
+  ] });
+};
+var MobileNavigationMenu9 = ({
+  open,
+  onClose,
+  navItems,
+  mobileActions,
+  mobileActionsSlot,
+  mobileMenuClassName
+}) => {
+  const renderMobileActions = React52.useMemo(() => {
+    if (mobileActionsSlot) return mobileActionsSlot;
+    if (!mobileActions || mobileActions.length === 0) return null;
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-4 px-4", children: mobileActions.map((action, index) => {
+      const {
+        label,
+        icon,
+        iconAfter,
+        children,
+        className: actionClassName,
+        ...pressableProps
+      } = action;
+      return /* @__PURE__ */ jsxRuntime.jsx(
+        Pressable,
+        {
+          asButton: true,
+          className: cn("w-full", actionClassName),
+          onClick: onClose,
+          ...pressableProps,
+          children: children ?? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+            icon,
+            label,
+            iconAfter
+          ] })
+        },
+        index
+      );
+    }) });
+  }, [mobileActionsSlot, mobileActions, onClose]);
   return /* @__PURE__ */ jsxRuntime.jsx(
-    Section,
+    NavbarMobileMenu,
     {
-      background,
-      spacing: spacingOverride ?? spacing,
-      className: sectionClasses,
-      pattern,
-      patternOpacity,
-      containerClassName: sectionContainerClassName,
-      containerMaxWidth: sectionContainerMaxWidth,
-      children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: containerWrapperClasses, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: navWrapperClasses, children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: innerContainerClasses, children: /* @__PURE__ */ jsxRuntime.jsxs(
-        "nav",
-        {
-          className: cn("flex items-center justify-between", navClassName),
-          children: [
-            /* @__PURE__ */ jsxRuntime.jsx(
-              NavbarLogo,
-              {
-                logo,
-                logoSlot,
-                logoClassName,
-                optixFlowConfig
-              }
-            ),
-            /* @__PURE__ */ jsxRuntime.jsx(
-              NavigationMenu,
-              {
-                className: cn("hidden lg:block", navigationMenuClassName),
-                children: /* @__PURE__ */ jsxRuntime.jsxs(
-                  NavigationMenuList,
-                  {
-                    ref: menuRef,
-                    className: cn(
-                      "flex items-center gap-6 rounded-4xl px-8 py-3",
-                      menuListClassName
-                    ),
-                    children: [
-                      renderNavItems,
-                      /* @__PURE__ */ jsxRuntime.jsx(
-                        "div",
-                        {
-                          ref: indicatorRef,
-                          className: "absolute bottom-2 flex h-1 items-center justify-center px-2 transition-all duration-300",
-                          children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-0.5 w-full rounded-t-none bg-foreground transition-all duration-300" })
-                        }
-                      )
-                    ]
-                  }
-                )
-              }
-            ),
-            /* @__PURE__ */ jsxRuntime.jsx(
-              MobileNav,
-              {
-                navItems: navItems ?? [],
-                activeItem,
-                setActiveItem,
-                actions,
-                actionsSlot
-              }
-            ),
-            /* @__PURE__ */ jsxRuntime.jsx(
-              "div",
-              {
-                className: cn(
-                  "hidden items-center gap-2 lg:flex",
-                  actionsClassName
-                ),
-                children: renderActions
-              }
-            )
-          ]
-        }
-      ) }) }) })
+      open,
+      onClose,
+      title: "Navigation",
+      className: mobileMenuClassName,
+      children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "max-w-screen-sm mx-auto", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-6", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("nav", { className: "flex flex-col", children: navItems.map((item, index) => /* @__PURE__ */ jsxRuntime.jsx(
+          Pressable,
+          {
+            href: item.link,
+            className: "flex h-15 items-center rounded-md px-4 text-left text-base leading-[3.75] font-normal text-muted-foreground ring-ring/10 outline-ring/50 transition-all hover:bg-muted focus-visible:ring-4 focus-visible:outline-1",
+            onClick: onClose,
+            children: item.name
+          },
+          `nav-link-${index}`
+        )) }),
+        renderMobileActions
+      ] }) })
     }
   );
 };
@@ -62983,8 +63145,8 @@ var NavbarSplitCta = ({
                 open: isOpen,
                 onClose: () => setIsOpen(false),
                 title: "Navigation Menu",
-                children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "max-w-screen-sm mx-auto", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-6", children: [
-                  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "border-t pt-4", children: menuSlot ? menuSlot : renderMenu?.map(
+                children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "max-w-screen-sm mx-auto", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-4", children: [
+                  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "pt-0", children: menuSlot ? menuSlot : renderMenu?.map(
                     (item, index) => item.items ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-4", children: [
                       /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-2 text-sm font-medium text-muted-foreground", children: item.title }),
                       /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-1 pl-2", children: item.items.map((subItem, subIndex) => /* @__PURE__ */ jsxRuntime.jsxs(
@@ -63065,6 +63227,7 @@ var NavbarIconLinks = ({
         /* @__PURE__ */ jsxRuntime.jsx(TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(
           Pressable,
           {
+            size: "icon",
             className: cn(
               "flex h-10 w-10 items-center justify-center rounded-md transition-colors",
               "text-muted-foreground hover:bg-accent hover:text-accent-foreground",
@@ -63464,55 +63627,6 @@ var NavbarTabbedSections = ({
     }
   );
 };
-var platformIconMap = {
-  instagram: "cib/instagram",
-  linkedin: "cib/linkedin",
-  google: "cib/google",
-  facebook: "cib/facebook",
-  tiktok: "cib/tiktok",
-  youtube: "cib/youtube",
-  yelp: "cib/yelp",
-  spotify: "cib/spotify",
-  apple: "cib/apple",
-  x: "line-md/twitter-x"
-};
-var SocialLinkIcon = React52__namespace.forwardRef(
-  ({
-    platformName,
-    label,
-    iconSize = 20,
-    iconColor,
-    iconClassName,
-    className,
-    ...pressableProps
-  }, ref) => {
-    const iconName = platformIconMap[platformName];
-    const accessibleLabel = label || platformName;
-    return /* @__PURE__ */ jsxRuntime.jsx(
-      Pressable,
-      {
-        ref,
-        "aria-label": accessibleLabel,
-        className: cn(
-          "inline-flex items-center justify-center transition-colors",
-          className
-        ),
-        ...pressableProps,
-        children: /* @__PURE__ */ jsxRuntime.jsx(
-          DynamicIcon,
-          {
-            name: iconName,
-            size: iconSize,
-            color: iconColor,
-            className: iconClassName,
-            alt: accessibleLabel
-          }
-        )
-      }
-    );
-  }
-);
-SocialLinkIcon.displayName = "SocialLinkIcon";
 var NavbarFullscreenMenu = ({
   logo,
   logoSlot,
@@ -78535,7 +78649,7 @@ function ListSearchableGrid({
     }
   );
 }
-var { useMemo: useMemo442 } = React52__namespace;
+var { useMemo: useMemo443 } = React52__namespace;
 function OfferModalNewsletterDiscount({
   title,
   emailPlaceholder,
@@ -78603,7 +78717,7 @@ function OfferModalNewsletterDiscount({
   });
   const formMethod = formConfig?.method?.toLowerCase() === "get" ? "get" : "post";
   const dialogProps = open !== void 0 ? { open, onOpenChange } : { defaultOpen };
-  const renderCloseButton = useMemo442(() => {
+  const renderCloseButton = useMemo443(() => {
     if (closeButtonSlot) return closeButtonSlot;
     if (!closeButtonText) return null;
     return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute end-1.5 top-1.5", children: /* @__PURE__ */ jsxRuntime.jsx(DialogClose, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(
@@ -78617,12 +78731,12 @@ function OfferModalNewsletterDiscount({
       }
     ) }) });
   }, [closeButtonSlot, closeButtonText, closeClassName]);
-  const renderHeader = useMemo442(() => {
+  const renderHeader = useMemo443(() => {
     if (headerSlot) return headerSlot;
     if (!title) return null;
     return /* @__PURE__ */ jsxRuntime.jsx(DialogHeader, { className: headerClassName, children: typeof title === "string" ? /* @__PURE__ */ jsxRuntime.jsx(DialogTitle, { className: cn("text-start font-serif text-2xl font-normal leading-snug", titleClassName), children: title }) : /* @__PURE__ */ jsxRuntime.jsx(DialogTitle, { className: cn("text-start font-serif text-2xl font-normal leading-snug", titleClassName), children: title }) });
   }, [headerSlot, title, headerClassName, titleClassName]);
-  const renderForm = useMemo442(() => {
+  const renderForm = useMemo443(() => {
     if (formSlot) return formSlot;
     return /* @__PURE__ */ jsxRuntime.jsxs(
       forms.Form,
@@ -78684,7 +78798,7 @@ function OfferModalNewsletterDiscount({
     }
   ) });
 }
-var { useMemo: useMemo443 } = React52__namespace;
+var { useMemo: useMemo444 } = React52__namespace;
 function OfferModalMembershipImage({
   overline,
   title,
@@ -78761,7 +78875,7 @@ function OfferModalMembershipImage({
   });
   const formMethod = formConfig?.method?.toLowerCase() === "get" ? "get" : "post";
   const dialogProps = open !== void 0 ? { open, onOpenChange } : { defaultOpen };
-  const renderImage = useMemo443(() => {
+  const renderImage = useMemo444(() => {
     if (imageSlot) return imageSlot;
     if (!image) return null;
     return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("max-h-[290px] h-full overflow-hidden max-lg:hidden", imageWrapperClassName), children: /* @__PURE__ */ jsxRuntime.jsx(
@@ -78774,7 +78888,7 @@ function OfferModalMembershipImage({
       }
     ) });
   }, [imageSlot, image, imageWrapperClassName, imageClassName, optixFlowConfig]);
-  const renderCloseButton = useMemo443(() => {
+  const renderCloseButton = useMemo444(() => {
     if (closeButtonSlot) return closeButtonSlot;
     return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute -end-px -top-px z-10", children: /* @__PURE__ */ jsxRuntime.jsx(DialogClose, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(
       Pressable,
@@ -78790,7 +78904,7 @@ function OfferModalMembershipImage({
       }
     ) }) });
   }, [closeButtonSlot, closeClassName]);
-  const renderForm = useMemo443(() => {
+  const renderForm = useMemo444(() => {
     if (formSlot) return formSlot;
     return /* @__PURE__ */ jsxRuntime.jsxs(
       forms.Form,
@@ -78853,7 +78967,7 @@ function OfferModalMembershipImage({
       }
     );
   }, [formSlot, form, formConfig, formMethod, emailPlaceholder, inputClassName, submitClassName, buttonText, formClassName]);
-  const renderFooter = useMemo443(() => {
+  const renderFooter = useMemo444(() => {
     if (footerSlot) return footerSlot;
     if (!description) return null;
     return /* @__PURE__ */ jsxRuntime.jsx(DialogFooter, { className: footerClassName, children: /* @__PURE__ */ jsxRuntime.jsx(DialogDescription, { className: cn("text-muted-foreground text-center text-xs leading-relaxed", descriptionClassName), children: description }) });
@@ -78973,7 +79087,7 @@ function SheetDescription({
     }
   );
 }
-var { useMemo: useMemo444 } = React52__namespace;
+var { useMemo: useMemo445 } = React52__namespace;
 function OfferModalSheetNewsletter({
   logo,
   logoSlot,
@@ -79056,7 +79170,7 @@ function OfferModalSheetNewsletter({
   });
   const formMethod = formConfig?.method?.toLowerCase() === "get" ? "get" : "post";
   const sheetProps = open !== void 0 ? { open, onOpenChange } : { defaultOpen };
-  const renderLogo = useMemo444(() => {
+  const renderLogo = useMemo445(() => {
     if (logoSlot) return logoSlot;
     if (!logo) return null;
     const logoSrc = typeof logo.src === "string" ? logo.src : logo.src.light;
@@ -79070,7 +79184,7 @@ function OfferModalSheetNewsletter({
       }
     );
   }, [logoSlot, logo, logoClassName, optixFlowConfig]);
-  const renderHeader = useMemo444(() => {
+  const renderHeader = useMemo445(() => {
     if (headerSlot) return headerSlot;
     return /* @__PURE__ */ jsxRuntime.jsxs(SheetHeader, { className: cn("gap-8 p-0", headerClassName), children: [
       renderLogo,
@@ -79080,7 +79194,7 @@ function OfferModalSheetNewsletter({
       ] })
     ] });
   }, [headerSlot, renderLogo, headerClassName, title, titleClassName, description, descriptionClassName]);
-  const renderForm = useMemo444(() => {
+  const renderForm = useMemo445(() => {
     if (formSlot) return formSlot;
     return /* @__PURE__ */ jsxRuntime.jsx(
       forms.Form,
@@ -79128,7 +79242,7 @@ function OfferModalSheetNewsletter({
       }
     );
   }, [formSlot, form, formConfig, formMethod, emailPlaceholder, inputClassName, submitClassName, buttonText, formClassName]);
-  const renderLegal = useMemo444(() => {
+  const renderLegal = useMemo445(() => {
     if (legalSlot) return legalSlot;
     if (!termsUrl || !termsText || !privacyUrl || !privacyText) return null;
     return /* @__PURE__ */ jsxRuntime.jsxs("p", { className: cn("text-muted-foreground text-xs", legalClassName), children: [
@@ -79142,7 +79256,7 @@ function OfferModalSheetNewsletter({
       "."
     ] });
   }, [legalSlot, termsUrl, termsText, privacyUrl, privacyText, legalClassName]);
-  const renderImage = useMemo444(() => {
+  const renderImage = useMemo445(() => {
     if (imageSlot) return imageSlot;
     if (!image) return null;
     return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("h-1/2 basis-1/2", imageWrapperClassName), children: /* @__PURE__ */ jsxRuntime.jsx(AspectRatio, { ratio: 1, className: "overflow-hidden", children: /* @__PURE__ */ jsxRuntime.jsx(