@opensite/ui 3.7.4 → 3.7.6

package/dist/registry.cjs

@@ -22059,7 +22059,7 @@ function CarouselProgressSlider({
                     {
                       value: slide.id,
                       className: cn("absolute inset-0", slide.className),
-                      children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "aspect-video overflow-hidden rounded-lg", children: /* @__PURE__ */ jsxRuntime.jsx(
+                      children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "aspect-square md:aspect-video overflow-hidden rounded-lg", children: /* @__PURE__ */ jsxRuntime.jsx(
                         img$1.Img,
                         {
                           src: slide.image,
@@ -22068,7 +22068,8 @@ function CarouselProgressSlider({
                             "h-full w-full object-cover",
                             slide.imageClassName
                           ),
-                          optixFlowConfig
+                          optixFlowConfig,
+                          loading: "eager"
                         }
                       ) })
                     },
@@ -22250,7 +22251,8 @@ function CarouselScrollingFeatureShowcase({
                             "h-full w-full object-cover",
                             activeFeatureData.imageClassName
                           ),
-                          optixFlowConfig
+                          optixFlowConfig,
+                          loading: "eager"
                         }
                       )
                     },
@@ -22285,7 +22287,8 @@ function CarouselScrollingFeatureShowcase({
                               "h-full w-full object-cover",
                               feature.imageClassName
                             ),
-                            optixFlowConfig
+                            optixFlowConfig,
+                            loading: "eager"
                           }
                         ) }) }),
                         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start gap-4", children: [
@@ -25531,16 +25534,16 @@ function FeatureIntegrationCards({
     (integration) => {
       if (integration.iconSlot) return integration.iconSlot;
       if (!integration.icon) return null;
-      return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex h-12 w-40 max-w-full shrink-0 items-center justify-start", children: /* @__PURE__ */ jsxRuntime.jsx(
+      return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex shrink-0 items-center justify-start", children: /* @__PURE__ */ jsxRuntime.jsx(
         img$1.Img,
         {
           src: integration.icon,
           alt: integration.iconAlt || (typeof integration.title === "string" ? integration.title : "Integration icon"),
           className: cn(
-            "h-full w-full object-contain",
+            "h-12 w-auto object-contain",
             integration.iconClassName
           ),
-          loading: "lazy",
+          loading: "eager",
           optixFlowConfig
         }
       ) });
@@ -25564,16 +25567,7 @@ function FeatureIntegrationCards({
               ),
               children: integration.title
             }
-          ) : /* @__PURE__ */ jsxRuntime.jsx(
-            "div",
-            {
-              className: cn(
-                "font-semibold md:text-lg",
-                integration.titleClassName
-              ),
-              children: integration.title
-            }
-          )),
+          ) : integration.title),
           integration.description && (typeof integration.description === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
             "p",
             {
@@ -26126,7 +26120,6 @@ function FeatureImageOverlayBadge({
                 {
                   className: cn(
                     "text-base leading-relaxed lg:text-lg",
-                    getTextColor(background, "muted"),
                     descriptionClassName
                   ),
                   children: description
@@ -26136,7 +26129,6 @@ function FeatureImageOverlayBadge({
                 {
                   className: cn(
                     "text-base leading-relaxed lg:text-lg",
-                    getTextColor(background, "muted"),
                     descriptionClassName
                   ),
                   children: description
@@ -26160,7 +26152,7 @@ function FeatureImageOverlayBadge({
                   "div",
                   {
                     className: cn(
-                      "absolute inset-0 rounded-2xl bg-gradient-to-t from-black/80 via-black/30 to-transparent",
+                      "absolute inset-0 rounded-2xl bg-linear-to-t from-black/80 via-black/30 to-transparent",
                       overlayClassName
                     )
                   }
@@ -26170,7 +26162,7 @@ function FeatureImageOverlayBadge({
                     "span",
                     {
                       className: cn(
-                        "ml-auto flex w-fit items-center gap-2 rounded-full bg-white/20 px-4 py-2.5 text-sm font-semibold text-white backdrop-blur-md shadow-lg",
+                        "ml-auto flex w-fit items-center gap-2 rounded-full bg-card px-4 py-2.5 text-sm font-semibold text-card-foreground backdrop-blur-md shadow-lg",
                         avatarBadgeClassName
                       ),
                       children: [
@@ -26189,16 +26181,7 @@ function FeatureImageOverlayBadge({
                         ),
                         children: overlayTitle
                       }
-                    ) : /* @__PURE__ */ jsxRuntime.jsx(
-                      "div",
-                      {
-                        className: cn(
-                          "text-lg font-semibold text-white lg:text-2xl xl:text-3xl",
-                          overlayTitleClassName
-                        ),
-                        children: overlayTitle
-                      }
-                    )),
+                    ) : overlayTitle),
                     overlayLinkText && /* @__PURE__ */ jsxRuntime.jsxs(
                       pressable.Pressable,
                       {
@@ -26443,7 +26426,7 @@ function FeatureBentoImageGrid({
       const cardContent = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
         renderItemImage(
           item,
-          "h-full max-h-[580px] w-full rounded-xl object-cover object-center shadow-lg"
+          "h-full w-full rounded-xl object-cover object-center shadow-lg"
         ),
         /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute top-0 right-0 bottom-0 left-0 translate-y-10 rounded-xl bg-linear-to-t from-black to-transparent transition-transform duration-300 group-hover:translate-y-0" }),
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "absolute top-0 flex h-full w-full flex-col justify-between px-5 md:px-8 py-6 md:py-6", children: [
@@ -26493,7 +26476,7 @@ function FeatureBentoImageGrid({
           {
             href: item.link,
             className: cn(
-              "group relative col-span-2 row-span-3 overflow-hidden rounded-xl",
+              "group relative h-[22rem] overflow-hidden rounded-xl xl:col-span-2 xl:h-[580px]",
               largeCardClassName,
               item.className
             ),
@@ -26505,7 +26488,7 @@ function FeatureBentoImageGrid({
         "div",
         {
           className: cn(
-            "group relative col-span-2 row-span-3 overflow-hidden rounded-xl",
+            "group relative h-[22rem] overflow-hidden rounded-xl xl:col-span-2 xl:h-[580px]",
             largeCardClassName,
             item.className
           ),
@@ -26523,8 +26506,7 @@ function FeatureBentoImageGrid({
         renderItemImage(
           item,
           cn(
-            "h-full w-full rounded-xl object-cover object-center shadow-lg",
-            index === 0 ? "max-h-44" : "max-h-96"
+            "h-full w-full rounded-xl object-cover object-center shadow-lg"
           )
         ),
         /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute top-0 right-0 bottom-0 left-0 translate-y-10 rounded-xl bg-linear-to-t from-black to-transparent opacity-80 transition-transform duration-300 group-hover:translate-y-0" }),
@@ -26567,7 +26549,7 @@ function FeatureBentoImageGrid({
             href: item.link,
             className: cn(
               "group relative overflow-hidden rounded-xl",
-              index === 1 && "row-span-2",
+              index === 0 ? "h-56 xl:h-44" : "h-72 xl:h-96",
               smallCardClassName,
               item.className
             ),
@@ -26581,7 +26563,7 @@ function FeatureBentoImageGrid({
         {
           className: cn(
             "group relative overflow-hidden rounded-xl",
-            index === 1 && "row-span-2",
+            index === 0 ? "h-56 xl:h-44" : "h-72 xl:h-96",
             smallCardClassName,
             item.className
           ),
@@ -26599,7 +26581,7 @@ function FeatureBentoImageGrid({
     const smallItems = items.filter((item) => item.size !== "large").slice(0, 2);
     return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
       renderLargeCard(largeItem),
-      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid gap-y-5 xl:row-span-2", children: smallItems.map((item, index) => renderSmallCard(item, index)) })
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid gap-y-5", children: smallItems.map((item, index) => renderSmallCard(item, index)) })
     ] });
   }, [itemsSlot, items, renderLargeCard, renderSmallCard]);
   return /* @__PURE__ */ jsxRuntime.jsxs(
@@ -26629,7 +26611,7 @@ function FeatureBentoImageGrid({
           "div",
           {
             className: cn(
-              "grid grid-cols-1 gap-y-5 pt-14 xl:grid-cols-3 xl:grid-rows-2 xl:gap-x-5 xl:gap-y-0",
+              "grid grid-cols-1 gap-y-5 pt-14 xl:grid-cols-3 xl:gap-x-5 xl:gap-y-0",
               gridClassName
             ),
             children: itemsContent
@@ -31771,14 +31753,14 @@ function ExpandableCaseStudyCards({
                   }
                 ),
                 /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-end justify-between gap-3", children: [
-                  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-1.5", children: [
-                    item.logo && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-1", children: /* @__PURE__ */ jsxRuntime.jsx(
+                  /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex min-w-0 flex-1 flex-col gap-1.5", children: [
+                    item.logo && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-1 flex max-w-full items-center", children: /* @__PURE__ */ jsxRuntime.jsx(
                       img$1.Img,
                       {
                         src: item.logo,
                         alt: item.logoAlt || item.company || "Logo",
                         className: cn(
-                          "h-6 max-w-[120px] object-contain object-left invert lg:h-8 lg:max-w-[150px]",
+                          "h-6 w-auto max-w-full object-contain object-left invert lg:h-8",
                           logoClassName
                         ),
                         loading: "lazy",
@@ -32636,7 +32618,7 @@ function CarouselSidebarResources({
   resourcesSlot,
   sidebarSlot,
   viewAllText,
-  viewAllHref = "#",
+  viewAllHref,
   className,
   headingClassName,
   sidebarClassName,
@@ -32646,11 +32628,12 @@ function CarouselSidebarResources({
   imageClassName,
   controlsClassName,
   background,
-  spacing,
   pattern,
   patternOpacity,
   patternClassName,
-  optixFlowConfig
+  optixFlowConfig,
+  containerClassName = "px-6 sm:px-6 md:px-8 lg:px-8",
+  spacing = "lg"
 }) {
   const [lightboxOpen, setLightboxOpen] = React30.useState(false);
   const [lightboxIndex, setLightboxIndex] = React30.useState(0);
@@ -32684,7 +32667,7 @@ function CarouselSidebarResources({
         children: [
           resources?.slice(0, 3).map((resource, idx) => /* @__PURE__ */ jsxRuntime.jsxs(React30.Fragment, { children: [
             /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-1", children: [
-              /* @__PURE__ */ jsxRuntime.jsx("div", { className: "font-mono text-sm text-muted-foreground uppercase", children: resource.category }),
+              /* @__PURE__ */ jsxRuntime.jsx("div", { className: "font-mono text-sm opacity-70 uppercase", children: resource.category }),
               /* @__PURE__ */ jsxRuntime.jsxs(
                 pressable.Pressable,
                 {
@@ -32760,15 +32743,15 @@ function CarouselSidebarResources({
                   src: item.image,
                   alt: typeof item.title === "string" ? item.title : item.imageAlt || "Resource image",
                   className: cn("aspect-video object-cover", imageClassName),
-                  loading: "lazy",
+                  loading: "eager",
                   optixFlowConfig
                 }
               )
             }
           ),
-          /* @__PURE__ */ jsxRuntime.jsx(pressable.Pressable, { href: item.link, className: "block", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "px-6 py-8", children: [
-            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-sm text-muted-foreground uppercase", children: item.category }),
-            typeof item.title === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "mt-2 text-xl font-semibold lg:text-2xl", children: item.title }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-2 text-xl font-semibold lg:text-2xl", children: item.title })
+          /* @__PURE__ */ jsxRuntime.jsx(pressable.Pressable, { href: item.link, className: "block", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "px-6 py-6 md:py-8", children: [
+            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-sm opacity-70 uppercase", children: item.category }),
+            typeof item.title === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "mt-2 text-xl font-semibold lg:text-2xl", children: item.title }) : item.title
           ] }) })
         ] })
       },
@@ -32792,6 +32775,7 @@ function CarouselSidebarResources({
       patternOpacity,
       patternClassName,
       className: cn("overflow-hidden", className),
+      containerClassName,
       children: [
         heading && (typeof heading === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
           "h2",
@@ -32799,13 +32783,7 @@ function CarouselSidebarResources({
             className: cn("text-2xl font-bold text-pretty", headingClassName),
             children: heading
           }
-        ) : /* @__PURE__ */ jsxRuntime.jsx(
-          "div",
-          {
-            className: cn("text-2xl font-bold text-pretty", headingClassName),
-            children: heading
-          }
-        )),
+        ) : heading),
         /* @__PURE__ */ jsxRuntime.jsx(Carousel, { className: carouselClassName, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-6 grid gap-x-14 gap-y-10 lg:mt-16 lg:grid-cols-3", children: [
           sidebarContent,
           /* @__PURE__ */ jsxRuntime.jsx("div", { className: "order-1 lg:order-0 lg:col-span-2 [&>div[data-slot=carousel-content]]:overflow-visible [&>div[data-slot=carousel-content]]:[clip-path:inset(-100vw_-100vw_-100vw_0)]", children: /* @__PURE__ */ jsxRuntime.jsx(
@@ -32876,7 +32854,8 @@ function CarouselIconTabs({
   tabClassName,
   controlsClassName,
   background,
-  spacing,
+  containerClassName = "px-6 sm:px-6 md:px-8 lg:px-8",
+  spacing = "hero",
   pattern,
   patternOpacity,
   patternClassName,
@@ -32982,7 +32961,7 @@ function CarouselIconTabs({
           /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-8 flex cursor-pointer flex-col gap-2 md:hidden", children: [
             /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: item.icon, size: 20 }) }),
             /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-lg font-medium", children: item.title }),
-            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-lg text-muted-foreground", children: item.text })
+            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-base", children: item.text })
           ] })
         ]
       },
@@ -33017,8 +32996,8 @@ function CarouselIconTabs({
                 "div",
                 {
                   className: cn(
-                    "text-lg hover:text-muted-foreground",
-                    index + 1 === current ? "text-muted-foreground" : "text-muted-foreground/50"
+                    "text-lg hover:opacity-100",
+                    index + 1 === current ? "opacity-100" : "opacity-70"
                   ),
                   children: section.text
                 }
@@ -33040,6 +33019,7 @@ function CarouselIconTabs({
       patternOpacity,
       patternClassName,
       className,
+      containerClassName,
       children: [
         headerContent,
         /* @__PURE__ */ jsxRuntime.jsxs(
@@ -34241,7 +34221,7 @@ function CarouselTabsContent({
                         "h-full w-full rounded-xl object-cover",
                         imageClassName
                       ),
-                      loading: "lazy",
+                      loading: "eager",
                       optixFlowConfig
                     }
                   )
@@ -34452,7 +34432,7 @@ function CarouselScaleFocus({
             ),
             src: img2.src,
             alt: img2.alt,
-            loading: "lazy",
+            loading: "eager",
             optixFlowConfig
           }
         )
@@ -36350,7 +36330,8 @@ function BlogFeaturedPopular({
   featuredSlot,
   postsSlot,
   className,
-  containerClassName,
+  containerClassName = "px-6 sm:px-6 md:px-8 lg:px-8",
+  spacing = "lg",
   headerClassName,
   headingClassName,
   descriptionClassName,
@@ -36362,7 +36343,6 @@ function BlogFeaturedPopular({
   postCardClassName,
   optixFlowConfig,
   background,
-  spacing,
   pattern,
   patternOpacity
 }) {
@@ -36403,9 +36383,9 @@ function BlogFeaturedPopular({
                 featuredContentClassName
               ),
               children: [
-                (featuredPost.category || featuredPost.label) && /* @__PURE__ */ jsxRuntime.jsx(Badge, { variant: "secondary", className: "shrink", children: featuredPost.category || featuredPost.label }),
-                featuredPost.title && (typeof featuredPost.title === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-2xl font-semibold text-balance md:max-w-lg lg:text-3xl", children: featuredPost.title }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-2xl font-semibold text-balance md:max-w-lg lg:text-3xl", children: featuredPost.title })),
-                (featuredPost.description || featuredPost.summary) && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-muted-foreground md:max-w-lg", children: featuredPost.description || featuredPost.summary })
+                (featuredPost.category || featuredPost.label) && /* @__PURE__ */ jsxRuntime.jsx(Badge, { children: featuredPost.category || featuredPost.label }),
+                featuredPost.title && (typeof featuredPost.title === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-2xl font-semibold text-balance md:max-w-lg lg:text-3xl", children: featuredPost.title }) : featuredPost.title),
+                (featuredPost.description || featuredPost.summary) && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "opacity-70", children: featuredPost.description || featuredPost.summary })
               ]
             }
           )
@@ -36443,9 +36423,9 @@ function BlogFeaturedPopular({
                 optixFlowConfig
               }
             ),
-            (post.category || post.label) && /* @__PURE__ */ jsxRuntime.jsx(Badge, { variant: "secondary", className: "shrink", children: post.category || post.label }),
-            post.title && (typeof post.title === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-xl font-semibold text-balance md:max-w-md", children: post.title }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-xl font-semibold text-balance md:max-w-md", children: post.title })),
-            (post.description || post.summary) && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-muted-foreground md:max-w-md", children: post.description || post.summary })
+            (post.category || post.label) && /* @__PURE__ */ jsxRuntime.jsx(Badge, { children: post.category || post.label }),
+            post.title && (typeof post.title === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-xl font-semibold text-balance md:max-w-md", children: post.title }) : post.title),
+            (post.description || post.summary) && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "opacity-70", children: post.description || post.summary })
           ]
         },
         postId
@@ -36461,7 +36441,8 @@ function BlogFeaturedPopular({
       className: cn(className),
       pattern,
       patternOpacity,
-      children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("container", containerClassName), children: [
+      containerClassName,
+      children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
         (heading || description) && /* @__PURE__ */ jsxRuntime.jsxs(
           "div",
           {
@@ -36479,17 +36460,17 @@ function BlogFeaturedPopular({
                   ),
                   children: heading
                 }
-              ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: headingClassName, children: heading })),
+              ) : heading),
               description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
                 "p",
                 {
                   className: cn(
-                    "mx-auto mt-4 max-w-xl text-lg text-muted-foreground text-balance",
+                    "mx-auto mt-4 max-w-full md:max-w-md text-lg opacity-70 text-balance",
                     descriptionClassName
                   ),
                   children: description
                 }
-              ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: descriptionClassName, children: description }))
+              ) : description)
             ]
           }
         ),
@@ -36528,7 +36509,7 @@ function BlogRelatedArticles({
   articles,
   articlesSlot,
   className,
-  containerClassName,
+  containerClassName = "px-6 sm:px-6 md:px-8 lg:px-8",
   headerClassName,
   headingClassName,
   seeAllClassName,
@@ -36580,10 +36561,10 @@ function BlogRelatedArticles({
           href: itemHref,
           className: cn("flex flex-col gap-2", articleCardClassName),
           children: [
-            (item.category || item.label) && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm font-medium text-muted-foreground", children: item.category || item.label }),
-            item.title && (typeof item.title === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "mb-1 text-lg font-semibold", children: item.title }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-1 text-lg font-semibold", children: item.title })),
-            (item.description || item.summary) && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mb-4 text-sm text-muted-foreground", children: item.description || item.summary }),
-            (item.date || item.published) && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm font-medium text-muted-foreground", children: item.date || item.published })
+            (item.category || item.label) && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm font-medium opacity-70", children: item.category || item.label }),
+            item.title && (typeof item.title === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "mb-1 text-lg font-semibold", children: item.title }) : item.title),
+            (item.description || item.summary) && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mb-4 text-sm opacity-70", children: item.description || item.summary }),
+            (item.date || item.published) && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm font-medium", children: item.date || item.published })
           ]
         },
         itemId
@@ -36599,7 +36580,8 @@ function BlogRelatedArticles({
       className: cn(className),
       pattern,
       patternOpacity,
-      children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("container", containerClassName), children: [
+      containerClassName,
+      children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
         /* @__PURE__ */ jsxRuntime.jsxs(
           "div",
           {
@@ -36617,7 +36599,7 @@ function BlogRelatedArticles({
                   ),
                   children: heading
                 }
-              ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: headingClassName, children: heading })),
+              ) : heading),
               renderedSeeAllAction
             ]
           }
@@ -36851,7 +36833,8 @@ function BlogHorizontalCards({
   postsSlot,
   readMoreText,
   className,
-  containerClassName,
+  containerClassName = "px-6 sm:px-6 md:px-8 lg:px-8",
+  spacing = "lg",
   headerClassName,
   badgeClassName,
   headingClassName,
@@ -36861,7 +36844,6 @@ function BlogHorizontalCards({
   ctaClassName,
   optixFlowConfig,
   background,
-  spacing,
   pattern,
   patternOpacity
 }) {
@@ -36901,7 +36883,7 @@ function BlogHorizontalCards({
       const postSummary = post.summary || post.description;
       const postDate = post.published || post.date;
       return /* @__PURE__ */ jsxRuntime.jsx(
-        Card,
+        "div",
         {
           className: cn(
             "overflow-hidden border-0 bg-transparent shadow-none",
@@ -36925,31 +36907,24 @@ function BlogHorizontalCards({
               }
             ) }),
             /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex-1 space-y-3", children: [
-              /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-4 text-sm text-muted-foreground", children: [
+              /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-4 text-sm opacity-70", children: [
                 postLabel && /* @__PURE__ */ jsxRuntime.jsx(Badge, { variant: "secondary", children: postLabel }),
                 post.author && /* @__PURE__ */ jsxRuntime.jsx("span", { children: post.author }),
                 postDate && /* @__PURE__ */ jsxRuntime.jsx("span", { children: postDate })
               ] }),
               post.title && /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-xl leading-tight font-bold lg:text-2xl", children: /* @__PURE__ */ jsxRuntime.jsx(pressable.Pressable, { href: postHref, className: "hover:underline", children: post.title }) }),
-              postSummary && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-base text-muted-foreground", children: postSummary }),
-              readMoreText && /* @__PURE__ */ jsxRuntime.jsxs(
-                pressable.Pressable,
-                {
-                  href: postHref,
-                  className: "inline-flex items-center text-primary hover:underline",
-                  children: [
-                    readMoreText,
-                    /* @__PURE__ */ jsxRuntime.jsx(
-                      DynamicIcon,
-                      {
-                        name: "lucide/arrow-right",
-                        size: 16,
-                        className: "ml-2 size-4"
-                      }
-                    )
-                  ]
-                }
-              )
+              postSummary && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-base opacity-70", children: postSummary }),
+              readMoreText && /* @__PURE__ */ jsxRuntime.jsxs(pressable.Pressable, { href: postHref, variant: "link", children: [
+                readMoreText,
+                /* @__PURE__ */ jsxRuntime.jsx(
+                  DynamicIcon,
+                  {
+                    name: "lucide/arrow-right",
+                    size: 16,
+                    className: "ml-2 size-4"
+                  }
+                )
+              ] })
             ] })
           ] })
         },
@@ -36966,9 +36941,10 @@ function BlogHorizontalCards({
       className: cn(className),
       pattern,
       patternOpacity,
-      children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("flex flex-col items-center", containerClassName), children: [
+      containerClassName,
+      children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-center", children: [
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("mx-auto max-w-3xl text-center", headerClassName), children: [
-          badge && (typeof badge === "string" ? /* @__PURE__ */ jsxRuntime.jsx(Badge, { variant: "secondary", className: cn("mb-6", badgeClassName), children: badge }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("mb-6", badgeClassName), children: badge })),
+          badge && (typeof badge === "string" ? /* @__PURE__ */ jsxRuntime.jsx(Badge, { className: cn("mb-6", badgeClassName), children: badge }) : badge),
           heading && (typeof heading === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
             "h2",
             {
@@ -36978,17 +36954,17 @@ function BlogHorizontalCards({
               ),
               children: heading
             }
-          ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: headingClassName, children: heading })),
+          ) : heading),
           description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
             "p",
             {
               className: cn(
-                "mb-12 text-muted-foreground md:text-base lg:text-lg",
+                "mb-12 opacity-70 md:text-base lg:text-lg",
                 descriptionClassName
               ),
               children: description
             }
-          ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: descriptionClassName, children: description }))
+          ) : description)
         ] }),
         /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("mx-auto max-w-5xl space-y-12", postsClassName), children: postsContent }),
         (ctaSlot || ctaAction) && /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("mt-16 text-center", ctaClassName), children: ctaContent })
@@ -42840,7 +42816,8 @@ function FeatureAnimatedCarousel({
                         src: currentFeature.image,
                         alt: currentFeature.imageAlt || (typeof currentFeature.title === "string" ? currentFeature.title : "Feature image"),
                         className: "h-full w-full object-cover",
-                        optixFlowConfig
+                        optixFlowConfig,
+                        loading: "eager"
                       }
                     )
                   ]
@@ -42995,10 +42972,10 @@ function FooterNewsletterContact({
             ] })
           ] })
         ] }),
-        logo && /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-between gap-4 md:gap-12", children: [
-          /* @__PURE__ */ jsxRuntime.jsx(Separator, { className: "flex-1" }),
-          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "basis-30 md:basis-40", children: /* @__PURE__ */ jsxRuntime.jsx(FooterLogo, { logo, optixFlowConfig }) }),
-          /* @__PURE__ */ jsxRuntime.jsx(Separator, { className: "flex-1" })
+        logo && /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center justify-center gap-4 md:gap-12", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(Separator, { className: "min-w-0 flex-1" }),
+          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex shrink-0 items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsx(FooterLogo, { logo, optixFlowConfig }) }),
+          /* @__PURE__ */ jsxRuntime.jsx(Separator, { className: "min-w-0 flex-1" })
         ] }) }),
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-wrap items-center justify-center gap-3 opacity-80 max-md:text-xs", children: [
           /* @__PURE__ */ jsxRuntime.jsx(FooterCopyright, { copyright }),
@@ -44868,7 +44845,8 @@ function TestimonialsCarouselImage({
                 "mx-auto mb-6 max-h-12 max-w-32 object-contain md:max-h-16 md:max-w-48",
                 logoClassName
               ),
-              optixFlowConfig
+              optixFlowConfig,
+              loading: "eager"
             }
           ) : /* @__PURE__ */ jsxRuntime.jsx(
             DynamicIcon,
@@ -44960,7 +44938,8 @@ function TestimonialsCarouselImage({
                   src: current.backgroundImage,
                   alt: "Testimonial background image",
                   className: "size-full object-cover",
-                  optixFlowConfig
+                  optixFlowConfig,
+                  loading: "eager"
                 }
               )
             },
@@ -45216,7 +45195,8 @@ function TestimonialsCompanyLogo({
             src: companyLogo,
             alt: companyLogoAlt,
             className: cn("h-12 w-auto object-contain", logoClassName),
-            optixFlowConfig
+            optixFlowConfig,
+            loading: "eager"
           }
         ),
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("space-y-1 text-right", authorClassName), children: [
@@ -45280,7 +45260,8 @@ function TestimonialsCompanyLogo({
                     src: imageSrc,
                     alt: imageAlt,
                     className: "size-full object-cover",
-                    optixFlowConfig
+                    optixFlowConfig,
+                    loading: "eager"
                   }
                 )
               }
@@ -47246,7 +47227,8 @@ function TestimonialsAnimatedSplit({
                   src: current.image,
                   alt: "Testimonial",
                   className: "size-full object-cover ",
-                  optixFlowConfig
+                  optixFlowConfig,
+                  loading: "eager"
                 }
               )
             },
@@ -47451,7 +47433,8 @@ function TestimonialsScrollingColumns({
                       src: testimonial.imageSrc,
                       alt: authorName,
                       className: "aspect-4/5 w-full object-cover",
-                      optixFlowConfig
+                      optixFlowConfig,
+                      loading: "eager"
                     }
                   ),
                   /* @__PURE__ */ jsxRuntime.jsx(GradientOverlay, {})
@@ -47465,7 +47448,8 @@ function TestimonialsScrollingColumns({
                       className: cn(
                         "flex justify-start items-start mb-6 max-h-10 max-w-32 object-contain md:max-h-10 md:max-w-48"
                       ),
-                      optixFlowConfig
+                      optixFlowConfig,
+                      loading: "eager"
                     }
                   ) : /* @__PURE__ */ jsxRuntime.jsx(
                     DynamicIcon,
@@ -49729,30 +49713,19 @@ function HeroSplitIconCards({
     if (cardsSlot) return cardsSlot;
     if (!cardItems || cardItems.length === 0) return null;
     return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-1 gap-4", children: cardItems.map((item, idx) => {
-      const card = /* @__PURE__ */ jsxRuntime.jsx(Card, { className: "h-full border-border/60 px-0 py-0", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start gap-4 p-6", children: [
+      const card = /* @__PURE__ */ jsxRuntime.jsx(Card, { className: "h-full border-border/60 px-0 py-0 hover:shadow-xl duration-500 transition-all", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start gap-4 p-6", children: [
         /* @__PURE__ */ jsxRuntime.jsx(
           "div",
           {
             className: cn(
-              "flex h-14 w-14 items-center justify-center rounded-xl",
-              `${getAccentColor(background)}/10`,
-              getAccentColor(background)
+              "flex h-14 w-14 items-center justify-center rounded-xl bg-primary text-primary-foreground"
             ),
             children: /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: item.icon, size: 24 })
           }
         ),
-        /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
-          /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-lg font-bold ", children: item.title }),
-          item.subtitle ? /* @__PURE__ */ jsxRuntime.jsx(
-            "p",
-            {
-              className: cn(
-                "mt-2 text-sm",
-                getTextColor(background, "muted")
-              ),
-              children: item.subtitle
-            }
-          ) : null
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-card-foreground", children: [
+          /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-lg font-bold", children: item.title }),
+          item.subtitle ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("text-sm opacity-70"), children: item.subtitle }) : null
         ] })
       ] }) });
       return item.href ? /* @__PURE__ */ jsxRuntime.jsx(pressable.Pressable, { href: item.href, className: "block", children: card }, idx) : /* @__PURE__ */ jsxRuntime.jsx("div", { children: card }, idx);
@@ -49774,8 +49747,7 @@ function HeroSplitIconCards({
             "p",
             {
               className: cn(
-                "text-xs font-semibold uppercase tracking-[0.25em]",
-                getAccentColor(background)
+                "text-xs font-semibold uppercase tracking-[0.25em]"
               ),
               children: eyebrow
             }
@@ -49800,17 +49772,7 @@ function HeroSplitIconCards({
               children: heading
             }
           )),
-          description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
-            "p",
-            {
-              className: cn(
-                "text-lg",
-                getTextColor(background, "muted"),
-                descriptionClassName
-              ),
-              children: description
-            }
-          ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: descriptionClassName, children: description })),
+          description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("text-lg", descriptionClassName), children: description }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: descriptionClassName, children: description })),
           renderActions
         ] }) }),
         renderCards
@@ -50198,10 +50160,11 @@ function HeroBadgeImageSplit({
             src: imageSrc,
             alt: imageAlt,
             className: cn(
-              "max-h-96 w-full rounded-md object-cover",
+              "max-h-96 w-full rounded-lg object-cover shadow-xl",
               imageClassName
             ),
-            optixFlowConfig
+            optixFlowConfig,
+            loading: "eager"
           }
         )
       ] }) })
@@ -50680,18 +50643,18 @@ function HeroCenteredImageGrid({
               imageGridClassName
             ),
             children: [
-              gridImages?.[0] && /* @__PURE__ */ jsxRuntime.jsx(
+              gridImages?.[0] && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative md:col-span-3", children: /* @__PURE__ */ jsxRuntime.jsx(
                 img$1.Img,
                 {
                   src: gridImages[0].src,
                   alt: gridImages[0].alt,
                   className: cn(
-                    "h-full max-h-[500px] w-full object-cover md:col-span-3 dark:invert",
+                    "block h-full max-h-[500px] w-full object-cover dark:invert",
                     gridImages[0].className
                   ),
                   optixFlowConfig
                 }
-              ),
+              ) }),
               gridImages?.[1] && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative md:col-span-2", children: [
                 /* @__PURE__ */ jsxRuntime.jsx(
                   img$1.Img,
@@ -50699,7 +50662,7 @@ function HeroCenteredImageGrid({
                     src: gridImages[1].src,
                     alt: gridImages[1].alt,
                     className: cn(
-                      "h-full max-h-[500px] w-full object-cover dark:invert",
+                      "block h-full max-h-[500px] w-full object-cover dark:invert",
                       gridImages[1].className
                     ),
                     optixFlowConfig
@@ -51143,6 +51106,10 @@ function HeroPatternLogoTechStack({
   techLogosClassName,
   optixFlowConfig
 }) {
+  const logoOptixFlowConfig = React30.useMemo(
+    () => optixFlowConfig ? { ...optixFlowConfig, objectFit: "contain" } : optixFlowConfig,
+    [optixFlowConfig]
+  );
   const renderLogo = React30.useMemo(() => {
     if (logoSlot2) return logoSlot2;
     if (!logo) return null;
@@ -51153,10 +51120,10 @@ function HeroPatternLogoTechStack({
         src: logoSrc,
         alt: logo.alt,
         className: cn("h-16 w-auto object-contain", logo.imgClassName),
-        optixFlowConfig
+        optixFlowConfig: logoOptixFlowConfig
       }
     ) });
-  }, [logoSlot2, logo, optixFlowConfig]);
+  }, [logoSlot2, logo, logoOptixFlowConfig]);
   const renderActions = React30.useMemo(() => {
     if (actionsSlot) return actionsSlot;
     if (!actions || actions.length === 0) return null;
@@ -51213,7 +51180,7 @@ function HeroPatternLogoTechStack({
               {
                 href: techLogo.href,
                 className: cn(
-                  "group flex w-auto h-12 md:h-10 items-center justify-center max-w-full md:max-w-30 max-h-12 md:max-h-10 min-h-12 md:min-h-10 p-2 md:p-1",
+                  "group flex shrink-0 items-center justify-center overflow-visible",
                   techLogo.className
                 ),
                 children: /* @__PURE__ */ jsxRuntime.jsx(
@@ -51222,10 +51189,10 @@ function HeroPatternLogoTechStack({
                     src: techLogoSrc,
                     alt: techLogo.alt,
                     className: cn(
-                      "h-full w-auto object-contain",
+                      "block h-6 max-h-6 w-auto max-w-none object-contain",
                       techLogo.imgClassName
                     ),
-                    optixFlowConfig
+                    optixFlowConfig: logoOptixFlowConfig
                   }
                 )
               },
@@ -51240,7 +51207,7 @@ function HeroPatternLogoTechStack({
     techLogos,
     techStackLabel,
     techLogosClassName,
-    optixFlowConfig
+    logoOptixFlowConfig
   ]);
   return /* @__PURE__ */ jsxRuntime.jsx(
     Section,
@@ -52893,7 +52860,8 @@ function HeroBadgeShadowOverlay({
             src: backgroundImageUrl,
             alt: "Background Image",
             className: "absolute inset-0 -z-10 h-full w-full object-cover brightness-50",
-            optixFlowConfig
+            optixFlowConfig,
+            loading: "eager"
           }
         )
       ]
@@ -53396,7 +53364,8 @@ function HeroDesignCarouselPortfolio({
             src: image.src,
             alt: image.alt,
             className: cn("size-full object-cover", image.className),
-            optixFlowConfig
+            optixFlowConfig,
+            loading: "eager"
           }
         ) }) }, index)) })
       }
@@ -54147,7 +54116,8 @@ function HeroGradientAvatarsRating({
                     "h-full w-full object-cover transition-transform duration-300 hover:scale-105",
                     images[0].className
                   ),
-                  optixFlowConfig
+                  optixFlowConfig,
+                  loading: "eager"
                 }
               )
             }
@@ -54167,7 +54137,8 @@ function HeroGradientAvatarsRating({
                     "h-full w-full object-cover transition-transform duration-300 hover:scale-105",
                     images[1].className
                   ),
-                  optixFlowConfig
+                  optixFlowConfig,
+                  loading: "eager"
                 }
               )
             }
@@ -54236,69 +54207,71 @@ function HeroGradientAvatarsRating({
     }
   );
 }
+function padTwo(n) {
+  return n.toString().padStart(2, "0");
+}
+var RING_RADIUS = 90;
+var RING_CIRCUMFERENCE = 2 * Math.PI * RING_RADIUS;
 function HeroTaskTimerAnimated({
   sectionId = "hero-task-timer-animated",
   heading,
+  headingSlot,
   description,
-  descriptionClassName,
   actions,
   actionsSlot,
   actionsClassName,
-  images,
-  imagesSlot,
+  taskItems,
+  timerMinutes = 25,
+  timerSeconds = 0,
   background,
   pattern,
   patternOpacity,
   className,
-  spacing = "xl",
+  spacing = "hero",
   containerClassName = "px-6 sm:px-6 md:px-8 lg:px-8",
   headerClassName,
   headingClassName,
-  imagesClassName,
-  optixFlowConfig,
+  descriptionClassName,
   logo,
   logoSlot: logoSlot2,
   logoClassName
 }) {
-  const renderImages = React30.useMemo(() => {
-    if (imagesSlot) return imagesSlot;
-    if (!images || images.length < 2) return null;
-    return /* @__PURE__ */ jsxRuntime.jsxs(
-      "div",
+  const initialTotal = timerMinutes * 60 + timerSeconds;
+  const [remaining, setRemaining] = React30.useState(initialTotal);
+  const [activeTaskIndex, setActiveTaskIndex] = React30.useState(0);
+  React30.useEffect(() => {
+    const interval = setInterval(() => {
+      setRemaining((prev) => prev <= 0 ? initialTotal : prev - 1);
+    }, 1e3);
+    return () => clearInterval(interval);
+  }, [initialTotal]);
+  const cycleTask = React30.useCallback(() => {
+    if (!taskItems || taskItems.length <= 1) return;
+    setActiveTaskIndex((prev) => (prev + 1) % taskItems.length);
+  }, [taskItems]);
+  React30.useEffect(() => {
+    if (!taskItems || taskItems.length <= 1) return;
+    const interval = setInterval(cycleTask, 3e3);
+    return () => clearInterval(interval);
+  }, [taskItems, cycleTask]);
+  const minutes = Math.floor(remaining / 60);
+  const seconds = remaining % 60;
+  const progress = initialTotal > 0 ? remaining / initialTotal : 1;
+  const strokeDashoffset = RING_CIRCUMFERENCE * (1 - progress);
+  const renderHeading = React30.useMemo(() => {
+    if (headingSlot) return headingSlot;
+    if (!heading) return null;
+    return typeof heading === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
+      "h1",
       {
         className: cn(
-          "flex flex-col mt-6 gap-6 md:gap-10 lg:flex-row",
-          imagesClassName
+          "max-w-3xl text-4xl font-bold tracking-tight md:text-5xl lg:text-6xl text-balance",
+          headingClassName
         ),
-        children: [
-          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-10 w-full lg:w-[60%]", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "overflow-hidden rounded-lg shadow-xl", children: /* @__PURE__ */ jsxRuntime.jsx(AspectRatio, { ratio: 1.916786227 / 1, children: /* @__PURE__ */ jsxRuntime.jsx(
-            img$1.Img,
-            {
-              src: images[0].src,
-              alt: images[0].alt,
-              className: cn(
-                "block size-full object-cover object-center",
-                images[0].className
-              ),
-              optixFlowConfig
-            }
-          ) }) }) }),
-          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex flex-col gap-10 w-full lg:w-[40%]", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "overflow-hidden rounded-lg shadow-xl", children: /* @__PURE__ */ jsxRuntime.jsx(AspectRatio, { ratio: 1.916786227 / 1, children: /* @__PURE__ */ jsxRuntime.jsx(
-            img$1.Img,
-            {
-              src: images[1].src,
-              alt: images[1].alt,
-              className: cn(
-                "block size-full object-cover object-center",
-                images[1].className
-              ),
-              optixFlowConfig
-            }
-          ) }) }) })
-        ]
+        children: heading
       }
-    );
-  }, [imagesSlot, images, imagesClassName, optixFlowConfig]);
+    ) : heading;
+  }, [headingSlot, heading, headingClassName]);
   return /* @__PURE__ */ jsxRuntime.jsx(
     Section,
     {
@@ -54309,48 +54282,140 @@ function HeroTaskTimerAnimated({
       patternOpacity,
       className,
       containerClassName,
-      children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative flex flex-col gap-6 md:gap-16", children: [
+      children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative flex flex-col items-center gap-10 lg:flex-row lg:items-center lg:gap-16", children: [
         /* @__PURE__ */ jsxRuntime.jsxs(
           "div",
           {
             className: cn(
-              "flex flex-col gap-4 w-full pt-12 lg:pt-0",
+              "flex flex-col gap-5 w-full lg:w-1/2 pt-8 lg:pt-0",
               headerClassName
             ),
             children: [
               (logo || logoSlot2) && /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("mb-4", logoClassName), children: /* @__PURE__ */ jsxRuntime.jsx(BrandLogo, { logo, logoSlot: logoSlot2, size: "lg" }) }),
-              heading && (typeof heading === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
-                "h1",
+              renderHeading,
+              description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
+                "p",
                 {
                   className: cn(
-                    "max-w-2xl text-6xl font-bold tracking-tight md:text-7xl lg:text-8xl text-balance",
-                    headingClassName
+                    "max-w-xl text-lg text-muted-foreground text-balance",
+                    descriptionClassName
                   ),
-                  children: heading
+                  children: description
                 }
-              ) : /* @__PURE__ */ jsxRuntime.jsx(
-                "h1",
+              ) : description),
+              taskItems && taskItems.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-2 flex flex-col gap-3", children: taskItems.map((task, index) => /* @__PURE__ */ jsxRuntime.jsxs(
+                "div",
                 {
-                  className: cn(
-                    "max-w-2xl text-6xl font-bold tracking-tight md:text-7xl lg:text-8xl text-balance",
-                    headingClassName
-                  ),
-                  children: heading
-                }
-              )),
-              description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("text-lg text-balance", descriptionClassName), children: description }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: descriptionClassName, children: description })),
+                  className: "flex items-center gap-3 transition-all duration-700 ease-in-out",
+                  style: {
+                    opacity: index === activeTaskIndex ? 1 : 0.35,
+                    transform: index === activeTaskIndex ? "translateX(8px)" : "translateX(0)"
+                  },
+                  children: [
+                    /* @__PURE__ */ jsxRuntime.jsx(
+                      "div",
+                      {
+                        className: cn(
+                          "size-2.5 shrink-0 rounded-full transition-colors duration-700",
+                          index === activeTaskIndex ? "bg-primary" : "bg-muted-foreground/30"
+                        )
+                      }
+                    ),
+                    /* @__PURE__ */ jsxRuntime.jsx(
+                      "span",
+                      {
+                        className: cn(
+                          "text-sm font-medium transition-colors duration-700",
+                          index === activeTaskIndex ? "text-foreground" : "text-muted-foreground/50"
+                        ),
+                        children: task
+                      }
+                    )
+                  ]
+                },
+                index
+              )) }),
               /* @__PURE__ */ jsxRuntime.jsx(
                 BlockActions,
                 {
                   actions,
                   actionsSlot,
-                  actionsClassName
+                  actionsClassName: cn("mt-2", actionsClassName)
                 }
               )
             ]
           }
         ),
-        renderImages
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex w-full items-center justify-center lg:w-1/2", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative flex flex-col items-center gap-6", children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
+            /* @__PURE__ */ jsxRuntime.jsxs(
+              "svg",
+              {
+                width: "240",
+                height: "240",
+                viewBox: "0 0 220 220",
+                className: "drop-shadow-lg",
+                children: [
+                  /* @__PURE__ */ jsxRuntime.jsx(
+                    "circle",
+                    {
+                      cx: "110",
+                      cy: "110",
+                      r: RING_RADIUS,
+                      fill: "none",
+                      stroke: "currentColor",
+                      strokeWidth: "5",
+                      className: "text-muted-foreground/15"
+                    }
+                  ),
+                  /* @__PURE__ */ jsxRuntime.jsx(
+                    "circle",
+                    {
+                      cx: "110",
+                      cy: "110",
+                      r: RING_RADIUS,
+                      fill: "none",
+                      stroke: "currentColor",
+                      strokeWidth: "5",
+                      strokeLinecap: "round",
+                      className: "text-primary transition-[stroke-dashoffset] duration-1000 ease-linear",
+                      strokeDasharray: RING_CIRCUMFERENCE,
+                      strokeDashoffset,
+                      transform: "rotate(-90 110 110)"
+                    }
+                  )
+                ]
+              }
+            ),
+            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute inset-0 flex items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-baseline gap-1 font-mono", children: [
+              /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-5xl font-bold tabular-nums tracking-tight md:text-6xl", children: padTwo(minutes) }),
+              /* @__PURE__ */ jsxRuntime.jsx("span", { className: "animate-pulse text-3xl font-bold text-primary md:text-4xl", children: ":" }),
+              /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-5xl font-bold tabular-nums tracking-tight md:text-6xl", children: padTwo(seconds) })
+            ] }) })
+          ] }),
+          taskItems && taskItems.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative h-8 w-full max-w-[280px] overflow-hidden", children: taskItems.map((task, index) => /* @__PURE__ */ jsxRuntime.jsx(
+            "div",
+            {
+              className: "absolute inset-0 flex items-center justify-center transition-all duration-700 ease-in-out",
+              style: {
+                opacity: index === activeTaskIndex ? 1 : 0,
+                transform: index === activeTaskIndex ? "translateY(0)" : "translateY(12px)"
+              },
+              children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "truncate rounded-full bg-primary/10 px-4 py-1.5 text-sm font-medium text-primary", children: task })
+            },
+            index
+          )) }),
+          taskItems && taskItems.length > 1 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex gap-2", children: taskItems.map((_, index) => /* @__PURE__ */ jsxRuntime.jsx(
+            "div",
+            {
+              className: cn(
+                "size-2 rounded-full transition-all duration-500",
+                index === activeTaskIndex ? "scale-125 bg-primary" : "bg-muted-foreground/25"
+              )
+            },
+            index
+          )) })
+        ] }) })
       ] })
     }
   );
@@ -54469,7 +54534,8 @@ function HeroAiPoweredCarousel({
                       "rounded-lg shadow-lg",
                       image.className
                     ),
-                    optixFlowConfig
+                    optixFlowConfig,
+                    loading: "eager"
                   }
                 ) }, index)) })
               }
@@ -54783,7 +54849,8 @@ function HeroAdaptableProductGrid({
                     "max-h-[400px] w-full object-cover",
                     imageClassName
                   ),
-                  optixFlowConfig
+                  optixFlowConfig,
+                  loading: "eager"
                 }
               )
             }
@@ -55190,7 +55257,7 @@ function HeroCrmStreamlined({
           "div",
           {
             className: cn("relative basis-[42%] py-2 md:py-16", imageClassName),
-            children: imageSlot2 ? imageSlot2 : image ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "aspect-square w-full overflow-hidden rounded-xl shadow-xl", children: [
+            children: imageSlot2 ? imageSlot2 : image ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "aspect-square w-full overflow-hidden rounded-2xl shadow-xl", children: [
               /* @__PURE__ */ jsxRuntime.jsx(
                 img$1.Img,
                 {
@@ -55208,7 +55275,7 @@ function HeroCrmStreamlined({
                 "div",
                 {
                   className: cn(
-                    "absolute top-0 left-25 z-10 hidden bg-muted aspect-[1.378254211/1] h-full w-225 rounded-xl md:block"
+                    "absolute top-0 left-25 z-10 hidden bg-muted aspect-[1.378254211/1] h-full w-225 rounded-2xl md:block opacity-30"
                   )
                 }
               )
@@ -55324,10 +55391,11 @@ function HeroBillingPlatformLogos({
                   "relative z-10 w-full object-cover",
                   mainImage.className
                 ),
-                optixFlowConfig
+                optixFlowConfig,
+                loading: "eager"
               }
             ) }),
-            overlayImages?.[0] && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute top-[19.84%] -left-[-2%] z-30 aspect-[1.765043789/1] w-[30.49%] max-w-47.5 overflow-hidden rounded-lg shadow-lg", children: /* @__PURE__ */ jsxRuntime.jsx(
+            overlayImages?.[0] && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute top-[19.84%] -left-[-2%] z-30 aspect-[1.765043789/1] w-[30.49%] max-w-47.5 overflow-hidden rounded-lg shadow-xl", children: /* @__PURE__ */ jsxRuntime.jsx(
               img$1.Img,
               {
                 src: overlayImages[0].src,
@@ -55336,10 +55404,11 @@ function HeroBillingPlatformLogos({
                   "size-full object-cover",
                   overlayImages[0].className
                 ),
-                optixFlowConfig
+                optixFlowConfig,
+                loading: "eager"
               }
             ) }),
-            overlayImages?.[1] && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute top-[55%] left-[0%] z-30 aspect-[1.776555024/1] w-[43.6%] max-w-65.5 overflow-hidden rounded-lg shadow-lg", children: /* @__PURE__ */ jsxRuntime.jsx(
+            overlayImages?.[1] && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute top-[55%] left-[0%] z-30 aspect-[1.776555024/1] w-[43.6%] max-w-65.5 overflow-hidden rounded-lg shadow-xl", children: /* @__PURE__ */ jsxRuntime.jsx(
               img$1.Img,
               {
                 src: overlayImages[1].src,
@@ -55348,10 +55417,11 @@ function HeroBillingPlatformLogos({
                   "size-full object-cover",
                   overlayImages[1].className
                 ),
-                optixFlowConfig
+                optixFlowConfig,
+                loading: "eager"
               }
             ) }),
-            overlayImages?.[2] && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute top-[40%] right-[0%] z-30 aspect-[1.170212766/1] w-[26.48%] max-w-41.25 overflow-hidden rounded-lg shadow-lg", children: /* @__PURE__ */ jsxRuntime.jsx(
+            overlayImages?.[2] && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute top-[40%] right-[0%] z-30 aspect-[1.170212766/1] w-[26.48%] max-w-41.25 overflow-hidden rounded-lg shadow-xl", children: /* @__PURE__ */ jsxRuntime.jsx(
               img$1.Img,
               {
                 src: overlayImages[2].src,
@@ -55360,7 +55430,8 @@ function HeroBillingPlatformLogos({
                   "size-full object-cover",
                   overlayImages[2].className
                 ),
-                optixFlowConfig
+                optixFlowConfig,
+                loading: "eager"
               }
             ) })
           ] }) }) : null
@@ -55373,7 +55444,7 @@ function HeroBillingPlatformLogos({
               logosClassName
             ),
             children: [
-              logosTagline && (typeof logosTagline === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "px-5 text-center font-mono text-sm font-medium uppercase", children: logosTagline }) : /* @__PURE__ */ jsxRuntime.jsx("div", { children: logosTagline })),
+              logosTagline && (typeof logosTagline === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "px-5 text-center font-mono text-sm font-medium uppercase", children: logosTagline }) : logosTagline),
               logosSlot ? logosSlot : logos && logos.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx(
                 Carousel,
                 {
@@ -55604,7 +55675,8 @@ function HeroSoftwareGrowthVideoDialog({
               "size-full object-cover object-center rounded-xl shadow-xl",
               showcaseImages[index].className
             ),
-            optixFlowConfig
+            optixFlowConfig,
+            loading: "eager"
           }
         ) }) }, index))
       }
@@ -57351,7 +57423,8 @@ function HeroArchitectureFullscreen({
             src: backgroundImage,
             alt: "",
             className: "absolute inset-0 min-h-screen min-w-screen object-cover object-center brightness-50",
-            optixFlowConfig
+            optixFlowConfig,
+            loading: "eager"
           }
         ),
         /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative z-20 h-full w-full max-w-full md:max-w-lg p-8 md:p-24", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col justify-end gap-6", children: [
@@ -57366,7 +57439,7 @@ function HeroArchitectureFullscreen({
                 children: tagline
               }
             ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: taglineClassName, children: tagline })),
-            (logo || logoSlot2) && /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("mb-4 flex justify-center", logoClassName), children: /* @__PURE__ */ jsxRuntime.jsx(BrandLogo, { logo, logoSlot: logoSlot2, size: "xl" }) }),
+            (logo || logoSlot2) && /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("mb-4 flex justify-start", logoClassName), children: /* @__PURE__ */ jsxRuntime.jsx(BrandLogo, { logo, logoSlot: logoSlot2, size: "xl" }) }),
             heading && (typeof heading === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
               react.motion.h1,
               {
@@ -57902,7 +57975,8 @@ function HeroProductShowcaseFloating({
             "size-8 rounded-full border-2 border-background object-cover",
             avatar.className
           ),
-          optixFlowConfig
+          optixFlowConfig,
+          loading: "eager"
         },
         idx
       )) }),
@@ -57925,7 +57999,8 @@ function HeroProductShowcaseFloating({
             "h-full w-full rounded-lg object-cover shadow-2xl",
             productImage.className
           ),
-          optixFlowConfig
+          optixFlowConfig,
+          loading: "eager"
         }
       ) }),
       renderFloatingStat,
@@ -58204,7 +58279,8 @@ function HeroSaasDashboardPreview({
                 src: browserPreview.image.src,
                 alt: browserPreview.image.alt,
                 className: cn("w-full", browserPreview.image.className),
-                optixFlowConfig
+                optixFlowConfig,
+                loading: "eager"
               }
             )
           ]
@@ -58430,7 +58506,7 @@ function HeroMentalHealthTeam({
   pattern,
   patternOpacity,
   className,
-  spacing = "xl",
+  spacing = "hero",
   containerClassName = "px-6 sm:px-6 md:px-8 lg:px-8",
   headerClassName,
   headingClassName,
@@ -58450,7 +58526,8 @@ function HeroMentalHealthTeam({
             "block h-full w-full object-cover object-center",
             smallImages[0].className
           ),
-          optixFlowConfig
+          optixFlowConfig,
+          loading: "eager"
         }
       ) }) }),
       smallImages[1] && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "col-[2/3] row-[1/2] w-full md:col-[2/3] md:row-[1/2]", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "h-full max-h-77.5 w-full overflow-hidden rounded-2xl", children: /* @__PURE__ */ jsxRuntime.jsx(
@@ -58462,7 +58539,8 @@ function HeroMentalHealthTeam({
             "block h-full w-full object-cover object-center",
             smallImages[1].className
           ),
-          optixFlowConfig
+          optixFlowConfig,
+          loading: "eager"
         }
       ) }) })
     ] });
@@ -58484,16 +58562,17 @@ function HeroMentalHealthTeam({
               src: avatarSrc,
               alt: testimonial.avatar?.alt ?? "",
               className: "h-full w-full object-cover object-center",
-              optixFlowConfig
+              optixFlowConfig,
+              loading: "eager"
             }
           ) }),
-          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex h-full w-full flex-col justify-between gap-2 text-muted-foreground", children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex h-full w-full flex-col justify-between gap-2 opacity-70", children: [
             /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "text-lg font-medium", children: [
               '"',
               testimonial.quote,
               '"'
             ] }),
-            /* @__PURE__ */ jsxRuntime.jsx("p", { className: "", children: testimonial.author })
+            /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm", children: testimonial.author })
           ] })
         ]
       }
@@ -58511,7 +58590,8 @@ function HeroMentalHealthTeam({
           "block h-full w-full object-cover object-center",
           featureImage.className
         ),
-        optixFlowConfig
+        optixFlowConfig,
+        loading: "eager"
       }
     ) }) });
   }, [featureImageSlot, featureImage, optixFlowConfig]);
@@ -58543,16 +58623,7 @@ function HeroMentalHealthTeam({
                   ),
                   children: heading
                 }
-              ) : /* @__PURE__ */ jsxRuntime.jsx(
-                "h1",
-                {
-                  className: cn(
-                    "text-center text-4xl leading-tight font-medium sm:text-5xl md:text-6xl text-balance",
-                    headingClassName
-                  ),
-                  children: heading
-                }
-              )),
+              ) : heading),
               description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
                 "p",
                 {
@@ -58562,7 +58633,7 @@ function HeroMentalHealthTeam({
                   ),
                   children: description
                 }
-              ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: descriptionClassName, children: description })),
+              ) : description),
               /* @__PURE__ */ jsxRuntime.jsx(
                 BlockActions,
                 {
@@ -58665,7 +58736,7 @@ function HeroMentorshipVideoSplit({
         {
           onClick: () => setIsVideoOpen(true),
           className: cn(
-            "group relative flex overflow-hidden rounded-lg p-0",
+            "group relative flex overflow-hidden rounded-lg p-0 cursor-pointer",
             videoAspectRatio === "vertical" ? "h-36 w-20" : "h-20 w-36"
           ),
           children: /* @__PURE__ */ jsxRuntime.jsxs(AspectRatio, { ratio: aspectRatio, className: "flex h-full w-full", children: [
@@ -58681,14 +58752,7 @@ function HeroMentorshipVideoSplit({
                 optixFlowConfig
               }
             ),
-            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "m-auto aspect-square z-10 bg-card text-card-foreground p-2 rounded-xl shadow-xl", children: /* @__PURE__ */ jsxRuntime.jsx(
-              DynamicIcon,
-              {
-                name: "lucide/play",
-                size: 24,
-                className: "transition-transform group-hover:scale-125"
-              }
-            ) })
+            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "m-auto aspect-square z-10 bg-card text-card-foreground p-2 rounded-xl ring-4 ring-card flex items-center justify-center opacity-80 hover:opacity-100 transition-all duration-500", children: /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/play", size: 24 }) })
           ] })
         }
       )
@@ -58753,7 +58817,7 @@ function HeroMentorshipVideoSplit({
                     "p",
                     {
                       className: cn(
-                        "text-lg font-medium md:text-xl",
+                        "text-lg font-normal md:text-xl text-pretty",
                         descriptionClassName
                       ),
                       children: description
@@ -60182,7 +60246,8 @@ function HeroConversationIntelligence({
               "object-centers size-full object-cover shadow-xl rounded-xl",
               image.className
             ),
-            optixFlowConfig
+            optixFlowConfig,
+            loading: "eager"
           }
         )
       }
@@ -60383,7 +60448,8 @@ function HeroBusinessCarouselDots({
                         "h-full w-full object-cover",
                         activeImage.className
                       ),
-                      optixFlowConfig
+                      optixFlowConfig,
+                      loading: "eager"
                     }
                   )
                 },
@@ -60607,7 +60673,8 @@ function HeroEcommerceProductShowcase({
               "aspect-3/4 w-full object-cover",
               images[0].className
             ),
-            optixFlowConfig
+            optixFlowConfig,
+            loading: "eager"
           }
         ) }),
         images[1] && /* @__PURE__ */ jsxRuntime.jsx("div", { className: imgClassWrapper, children: /* @__PURE__ */ jsxRuntime.jsx(
@@ -60619,7 +60686,8 @@ function HeroEcommerceProductShowcase({
               "aspect-square w-full object-cover",
               images[1].className
             ),
-            optixFlowConfig
+            optixFlowConfig,
+            loading: "eager"
           }
         ) })
       ] }),
@@ -60633,7 +60701,8 @@ function HeroEcommerceProductShowcase({
               "aspect-square w-full object-cover",
               images[2].className
             ),
-            optixFlowConfig
+            optixFlowConfig,
+            loading: "eager"
           }
         ) }),
         images[3] && /* @__PURE__ */ jsxRuntime.jsx("div", { className: imgClassWrapper, children: /* @__PURE__ */ jsxRuntime.jsx(
@@ -60645,7 +60714,8 @@ function HeroEcommerceProductShowcase({
               "aspect-3/4 w-full object-cover",
               images[3].className
             ),
-            optixFlowConfig
+            optixFlowConfig,
+            loading: "eager"
           }
         ) })
       ] })
@@ -61579,7 +61649,8 @@ function HeroEventRegistration({
               src: image.src,
               alt: image.alt,
               className: cn("aspect-square w-full object-cover", image.className),
-              optixFlowConfig
+              optixFlowConfig,
+              loading: "eager"
             }
           )
         }
@@ -64465,6 +64536,7 @@ var NavbarMegaMenu = ({
 var SolutionsMenu = ({
   solutionCards,
   platformItems,
+  platformTitle = "Platform",
   featuredHeroCard,
   optixFlowConfig
 }) => {
@@ -64507,7 +64579,7 @@ var SolutionsMenu = ({
     }
   ) : null;
   const platformSection = platformItems.length > 0 ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "min-w-0", children: [
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-3 text-left", children: /* @__PURE__ */ jsxRuntime.jsx("strong", { className: "text-xs font-medium tracking-wider text-muted-foreground uppercase", children: "Developer Platform" }) }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-3 text-left", children: /* @__PURE__ */ jsxRuntime.jsx("strong", { className: "text-xs font-medium tracking-wider text-muted-foreground uppercase", children: platformTitle }) }),
     /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-2 gap-2", children: platformItems.map((technology) => /* @__PURE__ */ jsxRuntime.jsxs(
       NavigationMenuLink,
       {
@@ -64708,6 +64780,7 @@ var ProductsMenu = ({
 ] });
 var ResourcesMenu = ({
   resourceItems,
+  resourcesTitle = "Resources",
   topicGroups,
   featuredHeroCard
 }) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid w-[1100px] grid-cols-[280px_1fr_220px] gap-6", children: [
@@ -64746,7 +64819,7 @@ var ResourcesMenu = ({
     }
   ) }),
   resourceItems.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "col-span-1", children: [
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-3 text-left", children: /* @__PURE__ */ jsxRuntime.jsx("strong", { className: "text-xs font-medium tracking-wider text-muted-foreground uppercase", children: "Resources" }) }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-3 text-left", children: /* @__PURE__ */ jsxRuntime.jsx("strong", { className: "text-xs font-medium tracking-wider text-muted-foreground uppercase", children: resourcesTitle }) }),
     /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-2 gap-3", children: resourceItems.map((resource) => /* @__PURE__ */ jsxRuntime.jsxs(
       NavigationMenuLink,
       {
@@ -64789,6 +64862,7 @@ var ResourcesMenu = ({
 var GlobalMenu = ({
   featureCategories,
   regions,
+  locationsTitle = "Locations",
   featuredHeroCard,
   optixFlowConfig
 }) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "w-[1100px]", children: [
@@ -64848,7 +64922,7 @@ var GlobalMenu = ({
     ] }, category.title)) })
   ] }),
   regions.length > 0 && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-6", children: [
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-3 border-b border-border pb-2 text-left", children: /* @__PURE__ */ jsxRuntime.jsx("strong", { className: "text-xs font-medium tracking-wider text-muted-foreground uppercase", children: "Popular Locations" }) }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-3 border-b border-border pb-2 text-left", children: /* @__PURE__ */ jsxRuntime.jsx("strong", { className: "text-xs font-medium tracking-wider text-muted-foreground uppercase", children: locationsTitle }) }),
     /* @__PURE__ */ jsxRuntime.jsx("div", { className: "grid grid-cols-4 gap-4", children: regions.map((region) => /* @__PURE__ */ jsxRuntime.jsxs(
       "div",
       {
@@ -65141,6 +65215,7 @@ var renderDropdownContent = (item, optixFlowConfig) => {
         {
           solutionCards: item.solutionCards ?? [],
           platformItems: item.platformItems ?? [],
+          platformTitle: item.platformTitle,
           featuredHeroCard: item.featuredHeroCard,
           optixFlowConfig
         }
@@ -65160,6 +65235,7 @@ var renderDropdownContent = (item, optixFlowConfig) => {
         {
           featureCategories: item.featureCategories ?? [],
           regions: item.regions ?? [],
+          locationsTitle: item.locationsTitle,
           featuredHeroCard: item.featuredHeroCard,
           optixFlowConfig
         }
@@ -65178,6 +65254,7 @@ var renderDropdownContent = (item, optixFlowConfig) => {
         ResourcesMenu,
         {
           resourceItems: item.resourceItems ?? [],
+          resourcesTitle: item.resourcesTitle,
           topicGroups: item.topicGroups ?? [],
           featuredHeroCard: item.featuredHeroCard
         }
@@ -66491,7 +66568,8 @@ var DesktopMenuItem3 = ({
             src: link.image,
             alt: typeof link.label === "string" ? link.label : "",
             className: `absolute top-0 left-0 h-full w-full object-cover transition-opacity duration-300 ${linkIndex === 0 ? "opacity-100" : "opacity-0"}`,
-            optixFlowConfig
+            optixFlowConfig,
+            loading: "eager"
           },
           linkIndex
         )) }),
@@ -66577,7 +66655,14 @@ var MobileNavigationMenu2 = ({
           children: children ?? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
             /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: icon, size: 16, className: "shrink-0" }),
             label,
-            /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: iconAfter, size: 16, className: "shrink-0" })
+            /* @__PURE__ */ jsxRuntime.jsx(
+              DynamicIcon,
+              {
+                name: iconAfter,
+                size: 16,
+                className: "shrink-0"
+              }
+            )
           ] })
         },
         index
@@ -67410,7 +67495,7 @@ var FeaturedLink = ({ link, optixFlowConfig }) => {
       className: `group relative flex w-full overflow-hidden rounded-xl px-4 pt-24 pb-4 ${hasBgImg ? "" : "bg-primary"}`,
       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-card text-card-foreground shadow-lg", children: /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: link.icon || link.iconName, size: 20 }) }),
+          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center justify-center size-12 shrink-0 rounded-lg border bg-card text-card-foreground shadow-lg", children: /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: link.icon || link.iconName, size: 20 }) }),
           /* @__PURE__ */ jsxRuntime.jsxs(
             "div",
             {
@@ -79156,12 +79241,12 @@ var ProcessCard = ({
     {
       ref,
       className: cn(
-        "relative flex flex-col justify-between gap-12 border-b py-8 lg:py-16",
+        "relative flex flex-col justify-between gap-6 md:gap-8 border-b py-8 lg:py-16",
         itemClassName,
         step.className
       ),
       children: [
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex w-fit items-center justify-center px-4 py-1 text-5xl md:text-7xl tracking-tighter", children: step.step ?? `0${index + 1}` }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex w-fit items-center justify-center text-5xl md:text-7xl tracking-tighter", children: step.step ?? `0${index + 1}` }),
         /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
           step.title && (typeof step.title === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "mb-4 text-2xl font-semibold tracking-tighter lg:text-3xl", children: step.title }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-4", children: step.title })),
           step.description && (typeof step.description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { children: step.description }) : step.description)
@@ -79390,7 +79475,8 @@ var ProcessCard2 = ({
                 src: step.image,
                 alt: titleText,
                 className: "h-full w-full object-cover",
-                optixFlowConfig
+                optixFlowConfig,
+                loading: "eager"
               }
             )
           }
@@ -79401,7 +79487,8 @@ var ProcessCard2 = ({
             src: step.image,
             alt: titleText,
             className: "mb-4 md:mb-0 md:hidden h-full w-full object-cover aspect-square rounded-xl shadow-lg ring-2 ring-primary",
-            optixFlowConfig
+            optixFlowConfig,
+            loading: "eager"
           }
         ),
         /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-start justify-between gap-8", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-start md:items-center gap-4 md:gap-8", children: [
@@ -79551,8 +79638,7 @@ function ProcessIconTimeline({
             "div",
             {
               className: cn(
-                "absolute left-0 flex size-12 items-center justify-center rounded-full text-primary-foreground lg:left-1/2 lg:-translate-x-1/2",
-                step.badgeColor || "bg-primary",
+                "absolute left-0 flex size-12 items-center justify-center rounded-full bg-primary text-primary-foreground lg:left-1/2 lg:-translate-x-1/2",
                 stepBadgeClassName
               ),
               children: step.iconSlot ?? (step.icon && /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: step.icon, size: 24 }))
@@ -80203,7 +80289,8 @@ function ProcessStepsGrid({
           "div",
           {
             className: cn(
-              "group relative overflow-hidden rounded-lg p-8 transition-all hover:shadow-lg",
+              "group relative overflow-hidden rounded-lg p-8",
+              "transition-all hover:shadow-lg duration-500",
               "border border-border hover:border-primary",
               "bg-card text-card-foreground",
               stepCardClassName,
@@ -80214,9 +80301,9 @@ function ProcessStepsGrid({
                 "span",
                 {
                   className: cn(
-                    "absolute -right-4 -top-4 text-[120px] font-bold leading-none transition-colors",
-                    "opacity-20 group-hover:opacity-100",
-                    "group-hover:text-primary"
+                    "absolute -right-4 -top-4 text-[120px] font-bold leading-none",
+                    "transition-colors duration-500 opacity-20",
+                    "group-hover:text-primary group-hover:opacity-100"
                   ),
                   children: String(index + 1).padStart(2, "0")
                 }
@@ -80226,7 +80313,8 @@ function ProcessStepsGrid({
                   "div",
                   {
                     className: cn(
-                      "mb-6 flex size-14 items-center justify-center rounded-lg transition-colors",
+                      "mb-6 flex size-14 items-center justify-center rounded-lg",
+                      "transition-colors duration-500",
                       "bg-primary/10 group-hover:bg-primary group-hover:text-primary-foreground",
                       stepIconClassName
                     ),
@@ -106951,35 +107039,31 @@ var PROCESS_BLOCK_CONTRACTS = {
       title: "Concept & Validation",
       description: "Validate your idea through market research and user interviews.",
       highlights: ["Market Research", "User Surveys", "Competitive Analysis"],
-      badgeColor: "bg-blue-500",
     },
     {
       icon: "lucide/layout",
       title: "Design & Wireframing",
       description: "Create wireframes and a cohesive design system that scales.",
       highlights: ["Wireframes", "Design System", "User Flows"],
-      badgeColor: "bg-purple-500",
     },
     {
       icon: "lucide/code",
       title: "Development Sprint",
       description: "Build the MVP with agile methodology and automated testing.",
       highlights: ["Agile Sprints", "Code Reviews", "Automated Tests"],
-      badgeColor: "bg-green-500",
     },
     {
       icon: "lucide/rocket",
       title: "Production Launch",
       description: "Deploy to production and execute the go-to-market strategy.",
       highlights: ["Production Deploy", "Marketing Launch", "Customer Support"],
-      badgeColor: "bg-red-500",
     },
   ]}
   spacing="xl"
   background="gray"
 />
     `.trim(),
-    importantUsageNotes: "Renders a zigzag icon-badge timeline. icon must be a Lucide icon identifier string (e.g. 'lucide/rocket'). badgeColor is a Tailwind background class (e.g. 'bg-blue-500'). highlights are small pill badges shown under the description. No image props \u2014 this block is icon/text only.",
+    importantUsageNotes: "Renders a zigzag icon-badge timeline. icon must be a Lucide icon identifier string (e.g. 'lucide/rocket'). Icon badges use bg-primary/text-primary-foreground automatically. highlights are small pill badges shown under the description. No image props \u2014 this block is icon/text only.",
     usageRequirements: {
       requiredProps: ["steps"],
       propConstraints: {
@@ -106989,8 +107073,7 @@ var PROCESS_BLOCK_CONTRACTS = {
         "steps[].icon": { required: true, note: "Lucide icon string, e.g. 'lucide/rocket'." },
         "steps[].title": { required: true, maxLength: 60 },
         "steps[].description": { maxLength: 220 },
-        "steps[].highlights": { maxItems: 5, note: "Short tag strings shown as pills." },
-        "steps[].badgeColor": { note: "Tailwind bg class, e.g. 'bg-blue-500'. Defaults to bg-primary." }
+        "steps[].highlights": { maxItems: 5, note: "Short tag strings shown as pills." }
       },
       mediaSlots: {}
     },
@@ -106998,10 +107081,10 @@ var PROCESS_BLOCK_CONTRACTS = {
       heading: "Product Development Timeline",
       description: "From concept to launch, our proven process ensures success at every milestone.",
       steps: [
-        { icon: "lucide/lightbulb", title: "Concept & Validation", description: "Validate your idea through research and user interviews.", highlights: ["Market Research", "User Surveys", "Competitive Analysis"], badgeColor: "bg-blue-500" },
-        { icon: "lucide/layout", title: "Design & Wireframing", description: "Create wireframes and a cohesive design system.", highlights: ["Wireframes", "Design System", "User Flows"], badgeColor: "bg-purple-500" },
-        { icon: "lucide/code", title: "Development Sprint", description: "Build the MVP with agile methodology.", highlights: ["Agile Sprints", "Code Reviews", "Automated Tests"], badgeColor: "bg-green-500" },
-        { icon: "lucide/rocket", title: "Production Launch", description: "Deploy to production and execute go-to-market.", highlights: ["Production Deploy", "Marketing Launch", "Customer Support"], badgeColor: "bg-red-500" }
+        { icon: "lucide/lightbulb", title: "Concept & Validation", description: "Validate your idea through research and user interviews.", highlights: ["Market Research", "User Surveys", "Competitive Analysis"] },
+        { icon: "lucide/layout", title: "Design & Wireframing", description: "Create wireframes and a cohesive design system.", highlights: ["Wireframes", "Design System", "User Flows"] },
+        { icon: "lucide/code", title: "Development Sprint", description: "Build the MVP with agile methodology.", highlights: ["Agile Sprints", "Code Reviews", "Automated Tests"] },
+        { icon: "lucide/rocket", title: "Production Launch", description: "Deploy to production and execute go-to-market.", highlights: ["Production Deploy", "Marketing Launch", "Customer Support"] }
       ],
       spacing: "xl",
       background: "gray"
@@ -111926,7 +112009,7 @@ var NAVBAR_BLOCK_CONTRACTS = {
   },
   "navbar-enterprise-mega": {
     exampleUsage: "An enterprise-grade mega menu navbar with specialized layout types for each dropdown panel. Supports solutions-with-platform, products-categorized, features-with-locations, partners-promotional, and resources-with-topics layouts. Each panel can feature a hero card with an image.",
-    importantUsageNotes: `${NAVBAR_MEDIA_NOTE} Each menuLink requires a 'layout' field to determine the dropdown panel type. For 'solutions-with-platform': provide 'solutionCards' (with subpages) and 'platformItems'. For 'products-categorized': provide 'productCategories' with 'products' arrays; each product may have an 'image' URL. For 'resources-with-topics': provide 'resourceItems' and 'topicGroups'. All 'featuredHeroCard.image' values must be absolute URLs.`,
+    importantUsageNotes: `${NAVBAR_MEDIA_NOTE} Each menuLink requires a 'layout' field to determine the dropdown panel type. For 'solutions-with-platform': provide 'solutionCards' (with subpages), 'platformItems', and optionally 'platformTitle' (defaults to "Platform"). For 'products-categorized': provide 'productCategories' with 'products' arrays; each product may have an 'image' URL. For 'features-with-locations': provide 'featureCategories', 'regions', and optionally 'locationsTitle' (defaults to "Locations"). For 'resources-with-topics': provide 'resourceItems', 'topicGroups', and optionally 'resourcesTitle' (defaults to "Resources"). All 'featuredHeroCard.image' values must be absolute URLs.`,
     usageRequirements: {
       requiredProps: ["logo", "menuLinks"],
       mediaSlots: {
@@ -111979,6 +112062,7 @@ var NAVBAR_BLOCK_CONTRACTS = {
           platformItems: [
             { id: "react", title: "React", href: "#", icon: "lucide/code" }
           ],
+          platformTitle: "Developer Platform",
           featuredHeroCard: {
             title: "New Platform Release",
             description: "Experience the next generation platform",
@@ -118005,39 +118089,35 @@ var HERO_BLOCK_CONTRACTS = {
 <HeroTaskTimerAnimated
   heading="Track time, boost productivity"
   description="Stay focused and manage your time effectively with our intuitive task timer."
+  taskItems={["Design mockups", "Code review", "Write documentation", "Ship feature"]}
+  timerMinutes={25}
   actions={[
     { label: "Start Tracking", href: "#", variant: "default" },
     { label: "View Features", href: "#", variant: "outline" },
   ]}
-  images={[
-    { src: "${HERO_EXAMPLE_IMAGE_URL}", alt: "Timer interface" },
-    { src: "${HERO_EXAMPLE_IMAGE_URL}", alt: "Task tracking" },
-  ]}
   background="dark"
 />
     `.trim(),
-    importantUsageNotes: `Supply exactly 2 images. Do not exceed 40 characters for 'heading'. Do not exceed 130 characters for 'description'. If you supply multiple 'actions', use 'default' for the first and 'outline' for the second.  ${HERO_MEDIA_NOTE}`,
+    importantUsageNotes: `Supply 2-6 taskItems for cycling animation. Do not exceed 40 characters for 'heading'. Do not exceed 130 characters for 'description'. If you supply multiple 'actions', use 'default' for the first and 'outline' for the second. timerMinutes defaults to 25 (Pomodoro style). No images required \u2014 the animated countdown timer and task list provide the visual element.`,
     usageRequirements: {
-      requiredProps: ["heading", "images"],
+      requiredProps: ["heading", "taskItems"],
       propConstraints: {
         heading: { required: true, maxLength: 40 },
         description: { maxLength: 130 },
-        images: { required: true, count: 2, minItems: 2, maxItems: 2 },
+        taskItems: { required: true, minItems: 2, maxItems: 6 },
+        timerMinutes: { note: "Defaults to 25 (Pomodoro style)." },
         actions: { maxItems: 2, pinnedValues: { "0.variant": "default", "1.variant": "outline" } }
       },
-      mediaSlots: {
-        "images[]": imageSlot("images[]", "Animated product screenshot images.", ["feature", "hero"], "medium", true)
-      },
-      requiresSiteCapabilities: heroCapabilities("media_library")
+      mediaSlots: {},
+      requiresSiteCapabilities: []
     },
     exampleProps: {
       logo: { src: "https://cdn.ing/assets/i/r/287634/e4cmvu8nbwoqy2qer90t4gpap0ed/logo-light.png", alt: "Brand Logo" },
       heading: "Track time, boost productivity",
       description: "Stay focused and manage your time effectively.",
-      images: [
-        { src: HERO_EXAMPLE_IMAGE_URL, alt: "Timer interface" },
-        { src: HERO_EXAMPLE_IMAGE_URL, alt: "Task tracking" }
-      ],
+      taskItems: ["Design mockups", "Code review", "Write documentation", "Ship feature"],
+      timerMinutes: 25,
+      timerSeconds: 0,
       background: "dark",
       actions: [
         { label: "Start Tracking", href: "#", variant: "default" },