@opensite/ui 2.3.3 → 2.3.5

package/dist/registry.cjs

@@ -717,19 +717,18 @@ function AboutMissionFeatures({
     if (featuresSlot) return featuresSlot;
     if (!features || features.length === 0) return null;
     return features.map((feature, idx) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col", children: [
-      /* @__PURE__ */ jsxRuntime.jsx(
+      feature.icon ? /* @__PURE__ */ jsxRuntime.jsx(
         "div",
         {
           className: cn(
-            "mb-5 flex size-12 items-center justify-center rounded-2xl text-primary-foreground",
-            getAccentColor(background),
+            "mb-5 flex size-12 items-center justify-center rounded-2xl",
             feature.iconBgClass
           ),
           children: feature.icon
         }
-      ),
+      ) : null,
       feature.title && (typeof feature.title === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "mt-2 mb-3 text-lg font-semibold", children: feature.title }) : feature.title),
-      feature.description && (typeof feature.description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: getTextColor(background, "muted"), children: feature.description }) : feature.description)
+      feature.description && (typeof feature.description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm md:text-md", children: feature.description }) : feature.description)
     ] }, idx));
   }, [featuresSlot, features, background]);
   return /* @__PURE__ */ jsxRuntime.jsx(
@@ -739,7 +738,7 @@ function AboutMissionFeatures({
       spacing,
       pattern,
       patternOpacity,
-      className: cn(className),
+      className,
       containerClassName,
       children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative", children: [
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-4 lg:gap-8", children: [
@@ -753,7 +752,7 @@ function AboutMissionFeatures({
               children: title
             }
           ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: titleClassName, children: title })),
-          description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("max-w-xl text-xl", descriptionClassName), children: description }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: descriptionClassName, children: description }))
+          description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("max-w-xl text-xl", descriptionClassName), children: description }) : description)
         ] }),
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid gap-6 md:grid-cols-2", children: [
           mainImage && /* @__PURE__ */ jsxRuntime.jsx(
@@ -772,44 +771,36 @@ function AboutMissionFeatures({
             "div",
             {
               className: cn(
-                "relative flex flex-col justify-between gap-10 overflow-hidden rounded-2xl p-10",
-                getNestedCardBg(background),
-                getNestedCardTextColor(background),
+                "relative flex flex-col justify-between gap-10 overflow-hidden rounded-2xl p-10 text-white text-shadow-2xl",
                 missionSectionClassName
               ),
               children: [
-                missionBackgroundImage && /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-                  /* @__PURE__ */ jsxRuntime.jsx(
-                    img.Img,
-                    {
-                      src: missionBackgroundImage.src,
-                      alt: missionBackgroundImage.alt,
-                      className: "absolute inset-0 size-full object-cover",
-                      optixFlowConfig
-                    }
-                  ),
-                  /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute inset-0 bg-linear-to-t from-foreground/80 via-foreground/50 to-foreground/30" })
-                ] }),
+                missionBackgroundImage && /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: /* @__PURE__ */ jsxRuntime.jsx(
+                  img.Img,
+                  {
+                    src: missionBackgroundImage.src,
+                    alt: missionBackgroundImage.alt,
+                    className: "absolute inset-0 size-full object-cover brightness-50",
+                    optixFlowConfig
+                  }
+                ) }),
                 /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative z-10", children: missionLabel && (typeof missionLabel === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
                   "p",
                   {
                     className: cn(
-                      "text-sm font-semibold text-background",
+                      "text-sm font-bold uppercase",
                       missionLabelClassName
                     ),
                     children: missionLabel
                   }
-                ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: missionLabelClassName, children: missionLabel })) }),
+                ) : missionLabel) }),
                 /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative z-10", children: missionText && (typeof missionText === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
                   "p",
                   {
-                    className: cn(
-                      "text-lg font-medium text-background",
-                      missionTextClassName
-                    ),
+                    className: cn("text-lg font-medium", missionTextClassName),
                     children: missionText
                   }
-                ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: missionTextClassName, children: missionText })) })
+                ) : missionText) })
               ]
             }
           )
@@ -825,18 +816,8 @@ function AboutMissionFeatures({
                 ),
                 children: featuresTitle
               }
-            ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: featuresTitleClassName, children: featuresTitle })),
-            featuresDescription && (typeof featuresDescription === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
-              "p",
-              {
-                className: cn(
-                  "text-lg",
-                  getTextColor(background, "muted"),
-                  featuresDescriptionClassName
-                ),
-                children: featuresDescription
-              }
-            ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: featuresDescriptionClassName, children: featuresDescription }))
+            ) : featuresTitle),
+            featuresDescription && (typeof featuresDescription === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("text-lg", featuresDescriptionClassName), children: featuresDescription }) : featuresDescription)
           ] }),
           /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("grid gap-10 md:grid-cols-3", featuresClassName), children: featuresContent })
         ] })
@@ -898,10 +879,14 @@ function AboutStatsShowcase({
     return /* @__PURE__ */ jsxRuntime.jsx(
       "div",
       {
-        className: cn("grid grid-cols-2 gap-6 md:grid-cols-3", statsClassName),
+        className: cn(
+          "grid grid-cols-2 md:grid-cols-3",
+          "gap-6 md:gap-16",
+          statsClassName
+        ),
         children: stats.map((stat, idx) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-6 border-b pb-8", children: [
           stat.value && (typeof stat.value === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-4xl font-medium md:text-5xl", children: stat.value }) : stat.value),
-          stat.label && (typeof stat.label === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: getTextColor(background, "muted"), children: stat.label }) : stat.label)
+          stat.label && (typeof stat.label === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-base", children: stat.label }) : stat.label)
         ] }, idx))
       }
     );
@@ -909,36 +894,47 @@ function AboutStatsShowcase({
   const logosContent = React26.useMemo(() => {
     if (logosSlot) return logosSlot;
     if (!logos || logos.length === 0) return null;
-    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("py-24", getNestedCardBg(background, "subtle")), children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "container flex flex-col items-center gap-11", children: [
-      logosTitle && (typeof logosTitle === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
-        "p",
-        {
-          className: cn(
-            "text-center text-xl font-medium",
-            logosTitleClassName
-          ),
-          children: logosTitle
-        }
-      ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: logosTitleClassName, children: logosTitle })),
-      /* @__PURE__ */ jsxRuntime.jsx(
-        "div",
-        {
-          className: cn(
-            "grid grid-cols-2 gap-x-7 gap-y-12 lg:grid-cols-4",
-            logosClassName
-          ),
-          children: logos.map((logo, idx) => /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsx(
-            img.Img,
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        className: cn(
+          "px-6 md:px-8 py-8 md:py-24",
+          "bg-transparent border rounded-xl shadow-lg"
+        ),
+        children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-center gap-11", children: [
+          logosTitle && (typeof logosTitle === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
+            "p",
             {
-              src: logo.src,
-              alt: logo.alt,
-              className: "h-8 object-contain w-auto md:h-14 max-h-24",
-              optixFlowConfig
+              className: cn(
+                "text-center text-xl font-medium",
+                logosTitleClassName
+              ),
+              children: logosTitle
             }
-          ) }, idx))
-        }
-      )
-    ] }) });
+          ) : logosTitle),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            "div",
+            {
+              className: cn(
+                "flex flex-col md:flex-row",
+                "justify-center items-center flex-wrap",
+                "gap-6 md:gap-12 opacity-70",
+                logosClassName
+              ),
+              children: logos.map((logo, idx) => /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex items-center justify-center", children: /* @__PURE__ */ jsxRuntime.jsx(
+                img.Img,
+                {
+                  src: logo.src,
+                  alt: logo.alt,
+                  className: "h-8 object-contain w-auto md:h-14 max-h-14",
+                  optixFlowConfig
+                }
+              ) }, idx))
+            }
+          )
+        ] })
+      }
+    );
   }, [
     logosSlot,
     logos,
@@ -960,7 +956,7 @@ function AboutStatsShowcase({
           ),
           children: benefitsTitle
         }
-      ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: benefitsTitleClassName, children: benefitsTitle })),
+      ) : benefitsTitle),
       /* @__PURE__ */ jsxRuntime.jsx(
         "div",
         {
@@ -974,7 +970,7 @@ function AboutStatsShowcase({
               {
                 src: benefit.image.src,
                 alt: benefit.image.alt,
-                className: "max-h-96 w-full rounded-xl object-cover",
+                className: "max-h-96 w-full rounded-xl object-cover shadow-lg",
                 optixFlowConfig
               }
             ),
@@ -982,18 +978,18 @@ function AboutStatsShowcase({
               "div",
               {
                 className: cn(
-                  "flex flex-col justify-center rounded-xl p-8",
-                  getNestedCardBg(background),
-                  getNestedCardTextColor(background)
+                  "flex flex-col justify-center",
+                  "p-6 md:p-8",
+                  "bg-muted text-muted-foreground rounded-xl"
                 ),
                 children: [
-                  benefit.stat.value && (typeof benefit.stat.value === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mb-2 text-4xl font-medium", children: benefit.stat.value }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-2", children: benefit.stat.value })),
-                  benefit.stat.label && (typeof benefit.stat.label === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mb-6 font-semibold", children: benefit.stat.label }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-6", children: benefit.stat.label })),
-                  benefit.stat.description && (typeof benefit.stat.description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: getTextColor(background, "muted"), children: benefit.stat.description }) : benefit.stat.description)
+                  benefit.stat.value && (typeof benefit.stat.value === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mb-2 text-4xl font-medium", children: benefit.stat.value }) : benefit.stat.value),
+                  benefit.stat.label && (typeof benefit.stat.label === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mb-6 font-semibold", children: benefit.stat.label }) : benefit.stat.label),
+                  benefit.stat.description && (typeof benefit.stat.description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "relative", children: benefit.stat.description }) : benefit.stat.description)
                 ]
               }
             ),
-            benefit.testimonial && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "rounded-xl bg-background p-4", children: [
+            benefit.testimonial && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "p-4", children: [
               /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mb-4 flex items-center gap-2", children: [
                 benefit.testimonial.logo && /* @__PURE__ */ jsxRuntime.jsx(
                   img.Img,
@@ -1006,22 +1002,13 @@ function AboutStatsShowcase({
                 ),
                 benefit.testimonial.company && (typeof benefit.testimonial.company === "string" ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-lg font-semibold", children: benefit.testimonial.company }) : benefit.testimonial.company)
               ] }),
-              benefit.testimonial.quote && (typeof benefit.testimonial.quote === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mb-6 text-sm", children: benefit.testimonial.quote }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-6", children: benefit.testimonial.quote })),
+              benefit.testimonial.quote && (typeof benefit.testimonial.quote === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mb-6 text-sm", children: benefit.testimonial.quote }) : benefit.testimonial.quote),
               /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-baseline gap-1", children: [
                 benefit.testimonial.author && (typeof benefit.testimonial.author === "string" ? /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "font-medium", children: [
                   benefit.testimonial.author,
                   ","
                 ] }) : benefit.testimonial.author),
-                benefit.testimonial.role && (typeof benefit.testimonial.role === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
-                  "span",
-                  {
-                    className: cn(
-                      "text-sm",
-                      getTextColor(background, "muted")
-                    ),
-                    children: benefit.testimonial.role
-                  }
-                ) : benefit.testimonial.role)
+                benefit.testimonial.role && (typeof benefit.testimonial.role === "string" ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm", children: benefit.testimonial.role }) : benefit.testimonial.role)
               ] })
             ] })
           ] }, idx))
@@ -1043,7 +1030,7 @@ function AboutStatsShowcase({
       spacing,
       pattern,
       patternOpacity,
-      className: cn(className),
+      className,
       containerClassName,
       children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-10 md:gap-24", children: [
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-10 text-center md:gap-24 mb-4 md:mb-8", children: [
@@ -1057,18 +1044,17 @@ function AboutStatsShowcase({
                 ),
                 children: title
               }
-            ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: titleClassName, children: title })),
+            ) : title),
             description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
               "p",
               {
                 className: cn(
                   "text-lg md:text-xl text-balance",
-                  getTextColor(background, "muted"),
                   descriptionClassName
                 ),
                 children: description
               }
-            ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: descriptionClassName, children: description }))
+            ) : description)
           ] }),
           imagesContent
         ] }),
@@ -1082,7 +1068,7 @@ function AboutStatsShowcase({
               ),
               children: statsTitle
             }
-          ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: statsTitleClassName, children: statsTitle })),
+          ) : statsTitle),
           statsContent
         ] }),
         logosContent,
@@ -2628,25 +2614,21 @@ function AboutMissionPrinciples({
         children: principles.map((principle, idx) => /* @__PURE__ */ jsxRuntime.jsxs(
           "div",
           {
-            className: cn(
-              "relative rounded-lg border p-6 transition-colors",
-              `hover:${getNestedCardBg(background, "muted")}`
-            ),
+            className: cn("relative rounded-lg border p-6 transition-colors"),
             children: [
               principle.number && /* @__PURE__ */ jsxRuntime.jsx(
                 "div",
                 {
                   className: cn(
                     "absolute right-4 top-4 text-3xl font-bold",
-                    getAccentColor(background),
-                    "opacity-20"
+                    "opacity-50"
                   ),
                   children: principle.number
                 }
               ),
               /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-3", children: [
                 principle.title && (typeof principle.title === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-xl font-bold", children: principle.title }) : principle.title),
-                principle.description && (typeof principle.description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: getTextColor(background, "muted"), children: principle.description }) : principle.description)
+                principle.description && (typeof principle.description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-pretty text-lg", children: principle.description }) : principle.description)
               ] })
             ]
           },
@@ -2693,17 +2675,7 @@ function AboutMissionPrinciples({
       children: [
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-1 items-center gap-12 lg:grid-cols-2 lg:gap-24", children: [
           /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-4 md:space-y-8", children: [
-            badgeText && (typeof badgeText === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
-              "div",
-              {
-                className: cn(
-                  "inline-block rounded-lg bg-primary/10 px-3 py-1 text-sm",
-                  getAccentColor(background),
-                  badgeClassName
-                ),
-                children: badgeText
-              }
-            ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: badgeClassName, children: badgeText })),
+            badgeText && (typeof badgeText === "string" ? /* @__PURE__ */ jsxRuntime.jsx(Badge, { className: cn("px-3", badgeClassName), children: badgeText }) : badgeText),
             missionHeading && (typeof missionHeading === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
               "h2",
               {
@@ -2713,18 +2685,8 @@ function AboutMissionPrinciples({
                 ),
                 children: missionHeading
               }
-            ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: missionHeadingClassName, children: missionHeading })),
-            missionDescription && (typeof missionDescription === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
-              "p",
-              {
-                className: cn(
-                  "text-xl",
-                  getTextColor(background, "muted"),
-                  missionDescriptionClassName
-                ),
-                children: missionDescription
-              }
-            ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: missionDescriptionClassName, children: missionDescription })),
+            ) : missionHeading),
+            missionDescription && (typeof missionDescription === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("text-xl", missionDescriptionClassName), children: missionDescription }) : missionDescription),
             missionActionContent
           ] }),
           principlesContent
@@ -2733,9 +2695,9 @@ function AboutMissionPrinciples({
           "div",
           {
             className: cn(
-              "mt-6 md:mt-24 rounded-lg p-8 lg:p-12",
-              getNestedCardBg(background),
-              getNestedCardTextColor(background),
+              "mt-6 md:mt-24 p-6 lg:p-12",
+              "bg-muted text-muted-foreground",
+              "rounded-xl shadow-lg border",
               visionClassName
             ),
             children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid grid-cols-1 items-center gap-8 lg:grid-cols-3", children: [
@@ -2749,18 +2711,8 @@ function AboutMissionPrinciples({
                     ),
                     children: visionHeading
                   }
-                ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("mb-4", visionHeadingClassName), children: visionHeading })),
-                visionDescription && (typeof visionDescription === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
-                  "p",
-                  {
-                    className: cn(
-                      "mb-4",
-                      getTextColor(background, "muted"),
-                      visionDescriptionClassName
-                    ),
-                    children: visionDescription
-                  }
-                ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("mb-4", visionDescriptionClassName), children: visionDescription }))
+                ) : visionHeading),
+                visionDescription && (typeof visionDescription === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("mb-4", visionDescriptionClassName), children: visionDescription }) : visionDescription)
               ] }),
               /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex justify-center lg:col-span-1 lg:justify-end", children: visionActionContent })
             ] })
@@ -8230,7 +8182,7 @@ function AboutStartupTeam({
         onClick: () => handleTabChange(link.value),
         className: cn(
           "block w-full text-left rounded-lg px-4 py-2 text-sm font-medium transition-colors",
-          activeTab === link.value ? "bg-primary text-primary-foreground" : cn(getTextColor(background, "muted"), "hover:bg-muted")
+          activeTab === link.value ? "bg-primary text-primary-foreground" : "bg-card text-card-foreground hover:bg-primary hover:text-primary-foreground"
         ),
         children: link.label
       },
@@ -8267,31 +8219,18 @@ function AboutStartupTeam({
             "div",
             {
               className: cn(
-                "mx-auto flex h-24 w-24 items-center justify-center rounded-full",
-                getNestedCardBg(background),
-                getNestedCardTextColor(background)
+                "mx-auto flex h-24 w-24 items-center justify-center rounded-full"
               ),
-              children: /* @__PURE__ */ jsxRuntime.jsx(
-                DynamicIcon,
-                {
-                  name: "lucide/user",
-                  size: 40,
-                  className: cn(getTextColor(background, "muted"))
-                }
-              )
+              children: /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/user", size: 40 })
             }
           ),
           member.name && (typeof member.name === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "mt-4 font-semibold", children: member.name }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-4", children: member.name })),
-          member.role && (typeof member.role === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("text-sm", getTextColor(background, "muted")), children: member.role }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-sm", children: member.role })),
+          member.role && (typeof member.role === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm", children: member.role }) : member.role),
           member.socialLinks && member.socialLinks.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-4 flex justify-center gap-3", children: member.socialLinks.map((link, linkIdx) => /* @__PURE__ */ jsxRuntime.jsx(
             Pressable,
             {
               href: link.url,
               "aria-label": link.label,
-              className: cn(
-                getTextColor(background, "muted"),
-                `hover:${getAccentColor(background)}`
-              ),
               children: link.icon
             },
             linkIdx
@@ -8316,11 +8255,7 @@ function AboutStartupTeam({
         onClick: () => handleTabChange(link.value),
         className: cn(
           "shrink-0 rounded-lg px-4 py-2 text-sm font-medium transition-colors",
-          activeTab === link.value ? "bg-primary text-primary-foreground" : cn(
-            "bg-muted",
-            getTextColor(background, "muted"),
-            "hover:bg-muted/80"
-          )
+          activeTab === link.value ? "bg-primary text-primary-foreground" : "bg-card text-card-foreground hover:bg-primary hover:text-primary-foreground"
         ),
         children: link.label
       },
@@ -8357,18 +8292,17 @@ function AboutStartupTeam({
               ),
               children: title
             }
-          ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: titleClassName, children: title })),
+          ) : title),
           description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
             "p",
             {
               className: cn(
                 "mt-6 text-lg whitespace-pre-line",
-                getTextColor(background, "muted"),
                 descriptionClassName
               ),
               children: description
             }
-          ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("mt-6", descriptionClassName), children: description })),
+          ) : description),
           /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-8 md:mt-16", children: [
             mobileTabsNav,
             dynamicTeamTitle && (typeof dynamicTeamTitle === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
@@ -8433,15 +8367,14 @@ function AboutMinimalStory({
         "div",
         {
           className: cn(
-            "flex h-16 w-16 items-center justify-center rounded-full text-2xl font-bold text-primary-foreground",
-            getAccentColor(background)
+            "flex h-16 w-16 items-center justify-center rounded-full text-2xl font-bold"
           ),
           children: author.name.charAt(0)
         }
       ),
       /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
         /* @__PURE__ */ jsxRuntime.jsx("p", { className: "font-semibold", children: author.name }),
-        /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("text-sm", getTextColor(background, "muted")), children: author.role })
+        /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm", children: author.role })
       ] })
     ] });
   }, [authorSlot, author, authorClassName, optixFlowConfig, background]);
@@ -8465,25 +8398,25 @@ function AboutMinimalStory({
             ),
             children: title
           }
-        ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: titleClassName, children: title })),
+        ) : title),
         content && (typeof content === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
           "p",
           {
             className: cn(
               "mt-8 text-lg leading-relaxed whitespace-pre-line",
-              getTextColor(background, "muted"),
               bodyClassName
             ),
             children: content
           }
-        ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("mt-8", bodyClassName), children: content })),
+        ) : content),
         featuredImage && /* @__PURE__ */ jsxRuntime.jsx(
           img.Img,
           {
             src: featuredImage.src,
             alt: featuredImage.alt,
             className: cn(
-              "mt-6 md:mt-12 w-full rounded-2xl object-cover",
+              "mt-6 md:mt-12 w-full",
+              "shadow-xl rounded-2xl object-cover",
               imageClassName
             ),
             optixFlowConfig
@@ -8891,34 +8824,6 @@ function AboutMissionDualImage({
   pattern,
   patternOpacity
 }) {
-  const actionsContent = React26.useMemo(() => {
-    if (actionsSlot) return actionsSlot;
-    if (!actions || actions.length === 0) return null;
-    return actions.map((action, index) => {
-      const {
-        label,
-        icon,
-        iconAfter,
-        children,
-        className: actionClassName,
-        ...pressableProps
-      } = action;
-      return /* @__PURE__ */ jsxRuntime.jsx(
-        Pressable,
-        {
-          asButton: true,
-          className: cn("w-fit", actionClassName),
-          ...pressableProps,
-          children: children ?? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
-            icon,
-            label,
-            iconAfter
-          ] })
-        },
-        index
-      );
-    });
-  }, [actionsSlot, actions]);
   return /* @__PURE__ */ jsxRuntime.jsx(
     Section,
     {
@@ -8926,7 +8831,7 @@ function AboutMissionDualImage({
       spacing,
       pattern,
       patternOpacity,
-      className: cn(className),
+      className,
       containerClassName,
       children: /* @__PURE__ */ jsxRuntime.jsxs(
         "div",
@@ -8944,18 +8849,8 @@ function AboutMissionDualImage({
                     ),
                     children: missionTitle
                   }
-                ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: missionTitleClassName, children: missionTitle })),
-                missionContent && (typeof missionContent === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
-                  "p",
-                  {
-                    className: cn(
-                      "mt-4 text-lg",
-                      getTextColor(background, "muted"),
-                      missionContentClassName
-                    ),
-                    children: missionContent
-                  }
-                ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("mt-4", missionContentClassName), children: missionContent }))
+                ) : missionTitle),
+                missionContent && (typeof missionContent === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("mt-4 text-lg", missionContentClassName), children: missionContent }) : missionContent)
               ] }),
               /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
                 visionTitle && (typeof visionTitle === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
@@ -8967,20 +8862,17 @@ function AboutMissionDualImage({
                     ),
                     children: visionTitle
                   }
-                ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: visionTitleClassName, children: visionTitle })),
-                visionContent && (typeof visionContent === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
-                  "p",
-                  {
-                    className: cn(
-                      "mt-4 text-lg",
-                      getTextColor(background, "muted"),
-                      visionContentClassName
-                    ),
-                    children: visionContent
-                  }
-                ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("mt-4", visionContentClassName), children: visionContent }))
+                ) : visionTitle),
+                visionContent && (typeof visionContent === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("mt-4 text-lg", visionContentClassName), children: visionContent }) : visionContent)
               ] }),
-              (actionsSlot || actions && actions.length > 0) && /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("mt-8 flex flex-wrap gap-4", actionsClassName), children: actionsContent })
+              /* @__PURE__ */ jsxRuntime.jsx(
+                BlockActions,
+                {
+                  actions,
+                  actionsSlot,
+                  actionsClassName
+                }
+              )
             ] }),
             /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative flex flex-col gap-4 sm:grid sm:grid-cols-2", children: [
               primaryImage && /* @__PURE__ */ jsxRuntime.jsx(
@@ -41941,9 +41833,24 @@ function FooterNewsletterContact({
     }
   );
 }
+var DEFAULT_STYLE_RULES41 = {
+  formContainer: "flex items-stretch w-full",
+  fieldsContainer: "",
+  fieldClassName: "",
+  formClassName: ""
+};
+var DEFAULT_FORM_FIELDS42 = [
+  {
+    name: "email",
+    type: "email",
+    label: "Email Address",
+    placeholder: "Enter your email",
+    required: true,
+    columnSpan: 12
+  }
+];
 function FooterSplitImageAccordion({
   newsletterTitle,
-  emailPlaceholder,
   footerLinks,
   socialLinks,
   paymentPlatforms,
@@ -41952,7 +41859,7 @@ function FooterSplitImageAccordion({
   copyright,
   background,
   containerClassName = "w-screen px-0 sm:px-0 lg:px-0 max-w-screen relative z-10",
-  spacing = "py-6 md:py-0",
+  spacing = "none",
   pattern,
   patternOpacity,
   className,
@@ -41974,51 +41881,46 @@ function FooterSplitImageAccordion({
   copyrightClassName,
   submenuLinksClassName,
   optixFlowConfig,
-  formConfig,
-  onSubmit,
-  onSuccess,
-  onError
+  formEngineSetup,
+  buttonAction,
+  formSlot
 }) {
-  const form = forms.useForm({
-    initialValues: {
-      email: ""
-    },
-    validationSchema: {
-      email: (value) => {
-        if (!value) return "Email is required";
-        if (!integration.isValidEmail(value)) return "Please enter a valid email address";
-        return void 0;
-      }
-    },
-    onSubmit: async (values, helpers) => {
-      const shouldAutoSubmit = Boolean(formConfig?.endpoint);
-      if (!shouldAutoSubmit && !onSubmit) {
-        return;
-      }
-      try {
-        let result;
-        if (shouldAutoSubmit) {
-          result = await integration.submitPageSpeedForm(values, formConfig);
-        }
-        if (onSubmit) {
-          await onSubmit(values.email);
-        }
-        if (shouldAutoSubmit || onSubmit) {
-          if (formConfig?.resetOnSuccess !== false) {
-            helpers.resetForm();
+  const renderForm = React26__namespace.useMemo(() => {
+    if (formSlot) return formSlot;
+    if (!formEngineSetup) return null;
+    const defaultButtonAction = {
+      label: "",
+      variant: "default",
+      icon: /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/arrow-right", size: 16 })
+    };
+    const action = buttonAction || defaultButtonAction;
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      integration.FormEngine,
+      {
+        formEngineSetup: {
+          ...formEngineSetup,
+          formLayoutSettings: {
+            ...formEngineSetup.formLayoutSettings,
+            formLayout: "button-group",
+            buttonGroupSetup: {
+              ...formEngineSetup.formLayoutSettings?.buttonGroupSetup,
+              size: "default",
+              submitLabel: action.icon || action.label,
+              submitVariant: action.variant || "default"
+            }
           }
-          onSuccess?.(result);
-        }
-      } catch (error) {
-        if (error instanceof integration.PageSpeedFormSubmissionError && error.formErrors) {
-          helpers.setErrors(error.formErrors);
+        },
+        defaultFields: DEFAULT_FORM_FIELDS42,
+        defaultStyleRules: {
+          ...DEFAULT_STYLE_RULES41,
+          formContainer: cn(
+            DEFAULT_STYLE_RULES41.formContainer,
+            newsletterFormClassName
+          )
         }
-        onError?.(error);
-        throw error;
       }
-    }
-  });
-  const formMethod = formConfig?.method?.toLowerCase() === "get" ? "get" : "post";
+    );
+  }, [formSlot, formEngineSetup, buttonAction, newsletterFormClassName]);
   return /* @__PURE__ */ jsxRuntime.jsx(
     Section,
     {
@@ -42059,40 +41961,7 @@ function FooterSplitImageAccordion({
                 children: newsletterTitle
               }
             ),
-            /* @__PURE__ */ jsxRuntime.jsxs(
-              forms.Form,
-              {
-                form,
-                action: formConfig?.endpoint,
-                method: formMethod,
-                className: cn("flex items-stretch", newsletterFormClassName),
-                children: [
-                  /* @__PURE__ */ jsxRuntime.jsx(forms.Field, { name: "email", className: "flex-1", children: ({ field }) => /* @__PURE__ */ jsxRuntime.jsx(
-                    "input",
-                    {
-                      ...field,
-                      type: "email",
-                      placeholder: emailPlaceholder,
-                      className: "flex h-10 w-full rounded-l-md rounded-r-none border border-r-0 border-input px-3 py-2 text-sm ring-offset-background placeholder:opacity-50 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
-                      "aria-label": emailPlaceholder
-                    }
-                  ) }),
-                  /* @__PURE__ */ jsxRuntime.jsx(
-                    Pressable,
-                    {
-                      componentType: "button",
-                      type: "submit",
-                      variant: "default",
-                      size: "icon",
-                      asButton: true,
-                      className: "rounded-l-none rounded-r-md shrink-0 h-10",
-                      disabled: form.isSubmitting,
-                      children: /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/arrow-right", size: 16 })
-                    }
-                  )
-                ]
-              }
-            ),
+            renderForm,
             socialLinks && socialLinks.length > 0 && /* @__PURE__ */ jsxRuntime.jsx(
               "ul",
               {
@@ -42117,19 +41986,31 @@ function FooterSplitImageAccordion({
             footerData.logo && /* @__PURE__ */ jsxRuntime.jsx(
               FooterLogo,
               {
-                logo: { ...footerData.logo, url: footerData.logoUrl },
+                logo: { ...footerData.logo, url: footerData.logo.url || "/" },
                 logoClassName: cn("inline-block max-w-60", logoClassName),
                 optixFlowConfig
               }
             ),
-            footerData.title && /* @__PURE__ */ jsxRuntime.jsx(
+            footerData.heading && /* @__PURE__ */ jsxRuntime.jsx(
               "h4",
               {
-                className: cn("text-xl font-semibold", brandTitleClassName),
-                children: footerData.title
+                className: cn(
+                  "text-xl font-semibold text-pretty",
+                  brandTitleClassName
+                ),
+                children: footerData.heading
               }
             ),
-            footerData.description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("opacity-80", brandDescriptionClassName), children: footerData.description })
+            footerData.description && /* @__PURE__ */ jsxRuntime.jsx(
+              "p",
+              {
+                className: cn(
+                  "opacity-80 text-balance",
+                  brandDescriptionClassName
+                ),
+                children: footerData.description
+              }
+            )
           ] }),
           footerLinks && footerLinks.length > 0 && /* @__PURE__ */ jsxRuntime.jsx(
             "div",
@@ -47803,13 +47684,13 @@ function HeroImageLeftContent({
     }
   );
 }
-var DEFAULT_STYLE_RULES41 = {
+var DEFAULT_STYLE_RULES42 = {
   formContainer: "",
   fieldsContainer: "",
   fieldClassName: "",
   formClassName: "space-y-4"
 };
-var DEFAULT_FORM_FIELDS42 = [
+var DEFAULT_FORM_FIELDS43 = [
   {
     name: "firstName",
     type: "text",
@@ -48046,8 +47927,8 @@ function HeroImageSlider({
                             }
                           }
                         },
-                        defaultFields: DEFAULT_FORM_FIELDS42,
-                        defaultStyleRules: DEFAULT_STYLE_RULES41
+                        defaultFields: DEFAULT_FORM_FIELDS43,
+                        defaultStyleRules: DEFAULT_STYLE_RULES42
                       }
                     ),
                     privacyNotice && /* @__PURE__ */ jsxRuntime.jsx(
@@ -53544,7 +53425,7 @@ function HeroHiringAnimatedText({
     }
   );
 }
-var DEFAULT_FORM_FIELDS43 = [
+var DEFAULT_FORM_FIELDS44 = [
   {
     name: "email",
     type: "email",
@@ -53557,7 +53438,7 @@ var DEFAULT_FORM_FIELDS43 = [
 function HeroSplitImageNewsletter({
   heading,
   description,
-  formFields = DEFAULT_FORM_FIELDS43,
+  formFields = DEFAULT_FORM_FIELDS44,
   formConfig,
   onSubmit,
   onSuccess,
@@ -55048,7 +54929,7 @@ function HeroProductShowcaseFloating({
     }
   );
 }
-var DEFAULT_FORM_FIELDS44 = [
+var DEFAULT_FORM_FIELDS45 = [
   {
     name: "email",
     type: "email",
@@ -55064,7 +54945,7 @@ function HeroSaasDashboardPreview({
   badgeSlot,
   heading,
   description,
-  formFields = DEFAULT_FORM_FIELDS44,
+  formFields = DEFAULT_FORM_FIELDS45,
   formConfig,
   onSubmit,
   onSuccess,
@@ -57853,13 +57734,13 @@ function HeroPricingComparison({
     }
   );
 }
-var DEFAULT_STYLE_RULES42 = {
+var DEFAULT_STYLE_RULES43 = {
   formContainer: "mt-10 flex justify-center items-center w-full max-w-md flex-col gap-4 sm:flex-row",
   fieldsContainer: "",
   fieldClassName: "",
   formClassName: ""
 };
-var DEFAULT_FORM_FIELDS45 = [
+var DEFAULT_FORM_FIELDS46 = [
   {
     name: "email",
     type: "email",
@@ -57945,8 +57826,8 @@ function HeroNewsletterMinimal({
               }
             }
           },
-          defaultFields: DEFAULT_FORM_FIELDS45,
-          defaultStyleRules: DEFAULT_STYLE_RULES42
+          defaultFields: DEFAULT_FORM_FIELDS46,
+          defaultStyleRules: DEFAULT_STYLE_RULES43
         }
       ),
       helperText && (typeof helperText === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("text-sm mt-2 text-center"), children: helperText }) : helperText)
@@ -58004,7 +57885,7 @@ function HeroNewsletterMinimal({
     }
   );
 }
-var DEFAULT_FORM_FIELDS46 = [
+var DEFAULT_FORM_FIELDS47 = [
   {
     name: "email",
     type: "email",
@@ -58059,7 +57940,7 @@ function HeroComingSoonCountdown({
   description,
   countdownDate,
   countdownSlot,
-  formFields = DEFAULT_FORM_FIELDS46,
+  formFields = DEFAULT_FORM_FIELDS47,
   formConfig,
   onSubmit,
   onSuccess,
@@ -98701,32 +98582,20 @@ function LinkTreeBlock({
           "flex flex-wrap items-center justify-center gap-2",
           socialLinksClassName
         ),
-        children: socialLinks.map((social, index) => {
-          const { iconName, ...socialPressableProps } = social;
-          const icon = social.icon || (iconName ? /* @__PURE__ */ jsxRuntime.jsx(
-            DynamicIcon,
-            {
-              name: iconName,
-              size: 20,
-              className: socialIconClassName
-            }
-          ) : null);
-          const ariaLabel = social["aria-label"] || (typeof social.label === "string" ? social.label : void 0) || social.platform;
-          return /* @__PURE__ */ jsxRuntime.jsx(
-            Pressable,
-            {
-              ...socialPressableProps,
-              "aria-label": ariaLabel,
-              className: cn(
-                "flex h-12 w-12 items-center justify-center rounded-full p-2.5 transition-all duration-200",
-                socialLinkClassName,
-                social.className
-              ),
-              children: icon
-            },
-            social.id ?? index
-          );
-        })
+        children: socialLinks.map((social, index) => /* @__PURE__ */ jsxRuntime.jsx(
+          SocialLinkIcon,
+          {
+            href: social.href,
+            label: social["aria-label"] || (typeof social.label === "string" ? social.label : void 0),
+            className: cn(
+              "flex h-12 w-12 items-center justify-center rounded-full p-2.5 transition-all duration-200",
+              socialLinkClassName,
+              social.className
+            ),
+            iconClassName: socialIconClassName
+          },
+          social.id ?? social.href ?? index
+        ))
       }
     );
   }, [
@@ -98974,33 +98843,16 @@ function LinkPageMinimalProfile({
           "flex items-center justify-center gap-4 pt-4",
           socialLinksClassName
         ),
-        children: socialLinks.map((social, index) => {
-          const { iconName: socialIconName, ...socialRest } = social;
-          const icon = social.icon || (socialIconName ? /* @__PURE__ */ jsxRuntime.jsx(
-            DynamicIcon,
-            {
-              name: socialIconName,
-              size: 20,
-              className: socialIconClassName
-            }
-          ) : null);
-          const ariaLabel = social["aria-label"] || (typeof social.label === "string" ? social.label : void 0) || social.platform;
-          return /* @__PURE__ */ jsxRuntime.jsx(
-            Pressable,
-            {
-              href: social.href,
-              "aria-label": ariaLabel,
-              className: cn(
-                "rounded-full p-2 transition-colors",
-                "hover:opacity-80",
-                socialLinkClassName,
-                social.className
-              ),
-              children: icon
-            },
-            social.id ?? index
-          );
-        })
+        children: socialLinks.map((social, index) => /* @__PURE__ */ jsxRuntime.jsx(
+          SocialLinkIcon,
+          {
+            href: social.href,
+            label: social["aria-label"] || (typeof social.label === "string" ? social.label : void 0),
+            className: cn(socialLinkClassName, social.className),
+            iconClassName: socialIconClassName
+          },
+          social.href || index
+        ))
       }
     );
   }, [
@@ -99067,13 +98919,13 @@ function LinkPageMinimalProfile({
     }
   );
 }
-var DEFAULT_STYLE_RULES43 = {
+var DEFAULT_STYLE_RULES44 = {
   formContainer: "w-full flex flex-col gap-3 justify-center items-center",
   fieldsContainer: "",
   fieldClassName: "",
   formClassName: ""
 };
-var DEFAULT_FORM_FIELDS47 = [
+var DEFAULT_FORM_FIELDS48 = [
   {
     name: "email",
     type: "email",
@@ -99191,34 +99043,22 @@ function LinkPageNewsletterSocial({
           "flex items-center justify-center gap-3",
           socialLinksClassName
         ),
-        children: socialLinks.map((social, index) => {
-          const { iconName, ...socialPressableProps } = social;
-          const icon = social.icon || (iconName ? /* @__PURE__ */ jsxRuntime.jsx(
-            DynamicIcon,
-            {
-              name: iconName,
-              size: 20,
-              className: socialIconClassName
-            }
-          ) : null);
-          const ariaLabel = social["aria-label"] || (typeof social.label === "string" ? social.label : void 0) || social.platform;
-          return /* @__PURE__ */ jsxRuntime.jsx(
-            Pressable,
-            {
-              ...socialPressableProps,
-              "aria-label": ariaLabel,
-              asButton: true,
-              size: "icon-lg",
-              className: cn(
-                "rounded-full p-2.5 transition-all duration-200",
-                socialLinkClassName,
-                social.className
-              ),
-              children: icon
-            },
-            social.id ?? index
-          );
-        })
+        children: socialLinks.map((social, index) => /* @__PURE__ */ jsxRuntime.jsx(
+          SocialLinkIcon,
+          {
+            href: social.href,
+            label: social["aria-label"] || (typeof social.label === "string" ? social.label : void 0),
+            asButton: true,
+            size: "icon-lg",
+            className: cn(
+              "rounded-full p-2.5 transition-all duration-200",
+              socialLinkClassName,
+              social.className
+            ),
+            iconClassName: socialIconClassName
+          },
+          social.id ?? social.href ?? index
+        ))
       }
     );
   }, [
@@ -99256,8 +99096,8 @@ function LinkPageNewsletterSocial({
               }
             }
           },
-          defaultFields: DEFAULT_FORM_FIELDS47,
-          defaultStyleRules: DEFAULT_STYLE_RULES43
+          defaultFields: DEFAULT_FORM_FIELDS48,
+          defaultStyleRules: DEFAULT_STYLE_RULES44
         }
       ),
       helperText && (typeof helperText === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("text-sm mt-2 text-center"), children: helperText }) : helperText)
@@ -99525,34 +99365,22 @@ function LinkPageGridCards({
           "flex items-center justify-center gap-2",
           socialLinksClassName
         ),
-        children: socialLinks.map((social, index) => {
-          const { iconName, ...socialPressableProps } = social;
-          const icon = social.icon || (iconName ? /* @__PURE__ */ jsxRuntime.jsx(
-            DynamicIcon,
-            {
-              name: iconName,
-              size: 18,
-              className: socialIconClassName
-            }
-          ) : null);
-          const ariaLabel = social["aria-label"] || (typeof social.label === "string" ? social.label : void 0) || social.platform;
-          return /* @__PURE__ */ jsxRuntime.jsx(
-            Pressable,
-            {
-              ...socialPressableProps,
-              "aria-label": ariaLabel,
-              className: cn(
-                "rounded-lg p-2 transition-all duration-200",
-                "bg-card text-card-foreground hover:opacity-80",
-                "size-12 flex items-center justify-center",
-                socialLinkClassName,
-                social.className
-              ),
-              children: icon
-            },
-            social.id ?? index
-          );
-        })
+        children: socialLinks.map((social, index) => /* @__PURE__ */ jsxRuntime.jsx(
+          SocialLinkIcon,
+          {
+            href: social.href,
+            label: social["aria-label"] || (typeof social.label === "string" ? social.label : void 0),
+            className: cn(
+              "rounded-lg p-2 transition-all duration-200",
+              "bg-card text-card-foreground hover:opacity-80",
+              "size-12 flex items-center justify-center",
+              socialLinkClassName,
+              social.className
+            ),
+            iconClassName: socialIconClassName
+          },
+          social.id ?? social.href ?? index
+        ))
       }
     );
   }, [
@@ -99785,34 +99613,22 @@ function LinkPageBentoLayout({
   const renderSocialLinks = React26.useMemo(() => {
     if (socialLinksSlot) return socialLinksSlot;
     if (!socialLinks || socialLinks.length === 0) return null;
-    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("flex items-center gap-2 pt-1", socialLinksClassName), children: socialLinks.map((social, index) => {
-      const { iconName, ...socialPressableProps } = social;
-      const icon = social.icon || (iconName ? /* @__PURE__ */ jsxRuntime.jsx(
-        DynamicIcon,
-        {
-          name: iconName,
-          size: 18,
-          className: socialIconClassName
-        }
-      ) : null);
-      const ariaLabel = social["aria-label"] || (typeof social.label === "string" ? social.label : void 0) || social.platform;
-      return /* @__PURE__ */ jsxRuntime.jsx(
-        Pressable,
-        {
-          ...socialPressableProps,
-          "aria-label": ariaLabel,
-          className: cn(
-            "rounded-full p-2 transition-all duration-200",
-            "hover:scale-110 active:scale-95",
-            "hover:opacity-80",
-            socialLinkClassName,
-            social.className
-          ),
-          children: icon
-        },
-        social.id ?? index
-      );
-    }) });
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("flex items-center gap-2 pt-1", socialLinksClassName), children: socialLinks.map((social, index) => /* @__PURE__ */ jsxRuntime.jsx(
+      SocialLinkIcon,
+      {
+        href: social.href,
+        label: social["aria-label"] || (typeof social.label === "string" ? social.label : void 0),
+        className: cn(
+          "rounded-full p-2 transition-all duration-200",
+          "hover:scale-110 active:scale-95",
+          "hover:opacity-80",
+          socialLinkClassName,
+          social.className
+        ),
+        iconClassName: socialIconClassName
+      },
+      social.id ?? social.href ?? index
+    )) });
   }, [
     socialLinksSlot,
     socialLinks,
@@ -116710,7 +116526,7 @@ var BLOCK_REGISTRY = {
   "footer-split-image-accordion": {
     id: "footer-split-image-accordion",
     name: "Footer Split Image Accordion",
-    description: "A split-layout footer with large image, newsletter signup, accordion navigation, and payment methods. Features a two-column split with image on left, content on right, and responsive accordion links for mobile. Best for e-commerce sites, fashion brands, and lifestyle businesses.",
+    description: "A split-layout footer with large image, newsletter signup powered by FormEngine, accordion navigation, and payment methods. Features a two-column split with image on left, content on right, and responsive accordion links for mobile. Uses @page-speed/forms/integration for form handling. Best for e-commerce sites, fashion brands, and lifestyle businesses.",
     semanticTags: [
       "footer",
       "split",
@@ -116727,6 +116543,9 @@ var BLOCK_REGISTRY = {
     exampleUsage: `
 <FooterSplitImageAccordion
   newsletterTitle="Get updates and save 20%"
+  formEngineSetup={{
+    formConfig: { endpoint: "/api/subscribe", format: "json" },
+  }}
   footerLinks={[
     { title: "Collections", id: "collections", items: [...] },
   ]}