@opensite/ui 2.3.4 → 2.3.6

package/dist/registry.js

@@ -677,19 +677,18 @@ function AboutMissionFeatures({
     if (featuresSlot) return featuresSlot;
     if (!features || features.length === 0) return null;
     return features.map((feature, idx) => /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
-      /* @__PURE__ */ jsx(
+      feature.icon ? /* @__PURE__ */ 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__ */ jsx("h3", { className: "mt-2 mb-3 text-lg font-semibold", children: feature.title }) : feature.title),
-      feature.description && (typeof feature.description === "string" ? /* @__PURE__ */ jsx("p", { className: getTextColor(background, "muted"), children: feature.description }) : feature.description)
+      feature.description && (typeof feature.description === "string" ? /* @__PURE__ */ jsx("p", { className: "text-sm md:text-md", children: feature.description }) : feature.description)
     ] }, idx));
   }, [featuresSlot, features, background]);
   return /* @__PURE__ */ jsx(
@@ -699,7 +698,7 @@ function AboutMissionFeatures({
       spacing,
       pattern,
       patternOpacity,
-      className: cn(className),
+      className,
       containerClassName,
       children: /* @__PURE__ */ jsxs("div", { className: "relative", children: [
         /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-4 lg:gap-8", children: [
@@ -713,7 +712,7 @@ function AboutMissionFeatures({
               children: title
             }
           ) : /* @__PURE__ */ jsx("div", { className: titleClassName, children: title })),
-          description && (typeof description === "string" ? /* @__PURE__ */ jsx("p", { className: cn("max-w-xl text-xl", descriptionClassName), children: description }) : /* @__PURE__ */ jsx("div", { className: descriptionClassName, children: description }))
+          description && (typeof description === "string" ? /* @__PURE__ */ jsx("p", { className: cn("max-w-xl text-xl", descriptionClassName), children: description }) : description)
         ] }),
         /* @__PURE__ */ jsxs("div", { className: "grid gap-6 md:grid-cols-2", children: [
           mainImage && /* @__PURE__ */ jsx(
@@ -732,44 +731,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__ */ jsxs(Fragment$1, { children: [
-                  /* @__PURE__ */ jsx(
-                    Img,
-                    {
-                      src: missionBackgroundImage.src,
-                      alt: missionBackgroundImage.alt,
-                      className: "absolute inset-0 size-full object-cover",
-                      optixFlowConfig
-                    }
-                  ),
-                  /* @__PURE__ */ jsx("div", { className: "absolute inset-0 bg-linear-to-t from-foreground/80 via-foreground/50 to-foreground/30" })
-                ] }),
+                missionBackgroundImage && /* @__PURE__ */ jsx(Fragment$1, { children: /* @__PURE__ */ jsx(
+                  Img,
+                  {
+                    src: missionBackgroundImage.src,
+                    alt: missionBackgroundImage.alt,
+                    className: "absolute inset-0 size-full object-cover brightness-50",
+                    optixFlowConfig
+                  }
+                ) }),
                 /* @__PURE__ */ jsx("div", { className: "relative z-10", children: missionLabel && (typeof missionLabel === "string" ? /* @__PURE__ */ jsx(
                   "p",
                   {
                     className: cn(
-                      "text-sm font-semibold text-background",
+                      "text-sm font-bold uppercase",
                       missionLabelClassName
                     ),
                     children: missionLabel
                   }
-                ) : /* @__PURE__ */ jsx("div", { className: missionLabelClassName, children: missionLabel })) }),
+                ) : missionLabel) }),
                 /* @__PURE__ */ jsx("div", { className: "relative z-10", children: missionText && (typeof missionText === "string" ? /* @__PURE__ */ jsx(
                   "p",
                   {
-                    className: cn(
-                      "text-lg font-medium text-background",
-                      missionTextClassName
-                    ),
+                    className: cn("text-lg font-medium", missionTextClassName),
                     children: missionText
                   }
-                ) : /* @__PURE__ */ jsx("div", { className: missionTextClassName, children: missionText })) })
+                ) : missionText) })
               ]
             }
           )
@@ -785,18 +776,8 @@ function AboutMissionFeatures({
                 ),
                 children: featuresTitle
               }
-            ) : /* @__PURE__ */ jsx("div", { className: featuresTitleClassName, children: featuresTitle })),
-            featuresDescription && (typeof featuresDescription === "string" ? /* @__PURE__ */ jsx(
-              "p",
-              {
-                className: cn(
-                  "text-lg",
-                  getTextColor(background, "muted"),
-                  featuresDescriptionClassName
-                ),
-                children: featuresDescription
-              }
-            ) : /* @__PURE__ */ jsx("div", { className: featuresDescriptionClassName, children: featuresDescription }))
+            ) : featuresTitle),
+            featuresDescription && (typeof featuresDescription === "string" ? /* @__PURE__ */ jsx("p", { className: cn("text-lg", featuresDescriptionClassName), children: featuresDescription }) : featuresDescription)
           ] }),
           /* @__PURE__ */ jsx("div", { className: cn("grid gap-10 md:grid-cols-3", featuresClassName), children: featuresContent })
         ] })
@@ -858,10 +839,14 @@ function AboutStatsShowcase({
     return /* @__PURE__ */ jsx(
       "div",
       {
-        className: cn("grid grid-cols-2 gap-6 md:grid-cols-3", statsClassName),
-        children: stats.map((stat, idx) => /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-6 border-b pb-8", children: [
+        className: cn(
+          "grid grid-cols-2 md:grid-cols-3",
+          "gap-6 md:gap-16",
+          statsClassName
+        ),
+        children: stats.map((stat, idx) => /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-6", children: [
           stat.value && (typeof stat.value === "string" ? /* @__PURE__ */ jsx("p", { className: "text-4xl font-medium md:text-5xl", children: stat.value }) : stat.value),
-          stat.label && (typeof stat.label === "string" ? /* @__PURE__ */ jsx("p", { className: getTextColor(background, "muted"), children: stat.label }) : stat.label)
+          stat.label && (typeof stat.label === "string" ? /* @__PURE__ */ jsx("p", { className: "text-base", children: stat.label }) : stat.label)
         ] }, idx))
       }
     );
@@ -869,36 +854,47 @@ function AboutStatsShowcase({
   const logosContent = useMemo(() => {
     if (logosSlot) return logosSlot;
     if (!logos || logos.length === 0) return null;
-    return /* @__PURE__ */ jsx("div", { className: cn("py-24", getNestedCardBg(background, "subtle")), children: /* @__PURE__ */ jsxs("div", { className: "container flex flex-col items-center gap-11", children: [
-      logosTitle && (typeof logosTitle === "string" ? /* @__PURE__ */ jsx(
-        "p",
-        {
-          className: cn(
-            "text-center text-xl font-medium",
-            logosTitleClassName
-          ),
-          children: logosTitle
-        }
-      ) : /* @__PURE__ */ jsx("div", { className: logosTitleClassName, children: logosTitle })),
-      /* @__PURE__ */ 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__ */ jsx("div", { className: "flex items-center justify-center", children: /* @__PURE__ */ jsx(
-            Img,
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: cn(
+          "px-6 md:px-8 py-8 md:py-24",
+          "bg-transparent border rounded-xl shadow-lg"
+        ),
+        children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col items-center gap-11", children: [
+          logosTitle && (typeof logosTitle === "string" ? /* @__PURE__ */ 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__ */ jsx(
+            "div",
+            {
+              className: cn(
+                "flex flex-col md:flex-row",
+                "justify-center items-center flex-wrap",
+                "gap-6 md:gap-12 opacity-50",
+                logosClassName
+              ),
+              children: logos.map((logo, idx) => /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center", children: /* @__PURE__ */ jsx(
+                Img,
+                {
+                  src: logo.src,
+                  alt: logo.alt,
+                  className: "h-8 object-contain w-auto md:h-10 max-h-10",
+                  optixFlowConfig
+                }
+              ) }, idx))
+            }
+          )
+        ] })
+      }
+    );
   }, [
     logosSlot,
     logos,
@@ -920,7 +916,7 @@ function AboutStatsShowcase({
           ),
           children: benefitsTitle
         }
-      ) : /* @__PURE__ */ jsx("div", { className: benefitsTitleClassName, children: benefitsTitle })),
+      ) : benefitsTitle),
       /* @__PURE__ */ jsx(
         "div",
         {
@@ -934,7 +930,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
               }
             ),
@@ -942,18 +938,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__ */ jsx("p", { className: "mb-2 text-4xl font-medium", children: benefit.stat.value }) : /* @__PURE__ */ jsx("div", { className: "mb-2", children: benefit.stat.value })),
-                  benefit.stat.label && (typeof benefit.stat.label === "string" ? /* @__PURE__ */ jsx("p", { className: "mb-6 font-semibold", children: benefit.stat.label }) : /* @__PURE__ */ jsx("div", { className: "mb-6", children: benefit.stat.label })),
-                  benefit.stat.description && (typeof benefit.stat.description === "string" ? /* @__PURE__ */ jsx("p", { className: getTextColor(background, "muted"), children: benefit.stat.description }) : benefit.stat.description)
+                  benefit.stat.value && (typeof benefit.stat.value === "string" ? /* @__PURE__ */ 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__ */ jsx("p", { className: "mb-6 font-semibold", children: benefit.stat.label }) : benefit.stat.label),
+                  benefit.stat.description && (typeof benefit.stat.description === "string" ? /* @__PURE__ */ jsx("p", { className: "relative", children: benefit.stat.description }) : benefit.stat.description)
                 ]
               }
             ),
-            benefit.testimonial && /* @__PURE__ */ jsxs("div", { className: "rounded-xl bg-background p-4", children: [
+            benefit.testimonial && /* @__PURE__ */ jsxs("div", { className: "p-4", children: [
               /* @__PURE__ */ jsxs("div", { className: "mb-4 flex items-center gap-2", children: [
                 benefit.testimonial.logo && /* @__PURE__ */ jsx(
                   Img,
@@ -966,22 +962,13 @@ function AboutStatsShowcase({
                 ),
                 benefit.testimonial.company && (typeof benefit.testimonial.company === "string" ? /* @__PURE__ */ jsx("span", { className: "text-lg font-semibold", children: benefit.testimonial.company }) : benefit.testimonial.company)
               ] }),
-              benefit.testimonial.quote && (typeof benefit.testimonial.quote === "string" ? /* @__PURE__ */ jsx("p", { className: "mb-6 text-sm", children: benefit.testimonial.quote }) : /* @__PURE__ */ jsx("div", { className: "mb-6", children: benefit.testimonial.quote })),
+              benefit.testimonial.quote && (typeof benefit.testimonial.quote === "string" ? /* @__PURE__ */ jsx("p", { className: "mb-6 text-sm", children: benefit.testimonial.quote }) : benefit.testimonial.quote),
               /* @__PURE__ */ jsxs("div", { className: "flex items-baseline gap-1", children: [
                 benefit.testimonial.author && (typeof benefit.testimonial.author === "string" ? /* @__PURE__ */ jsxs("span", { className: "font-medium", children: [
                   benefit.testimonial.author,
                   ","
                 ] }) : benefit.testimonial.author),
-                benefit.testimonial.role && (typeof benefit.testimonial.role === "string" ? /* @__PURE__ */ 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__ */ jsx("span", { className: "text-sm", children: benefit.testimonial.role }) : benefit.testimonial.role)
               ] })
             ] })
           ] }, idx))
@@ -1003,7 +990,7 @@ function AboutStatsShowcase({
       spacing,
       pattern,
       patternOpacity,
-      className: cn(className),
+      className,
       containerClassName,
       children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-10 md:gap-24", children: [
         /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-10 text-center md:gap-24 mb-4 md:mb-8", children: [
@@ -1017,18 +1004,17 @@ function AboutStatsShowcase({
                 ),
                 children: title
               }
-            ) : /* @__PURE__ */ jsx("div", { className: titleClassName, children: title })),
+            ) : title),
             description && (typeof description === "string" ? /* @__PURE__ */ jsx(
               "p",
               {
                 className: cn(
                   "text-lg md:text-xl text-balance",
-                  getTextColor(background, "muted"),
                   descriptionClassName
                 ),
                 children: description
               }
-            ) : /* @__PURE__ */ jsx("div", { className: descriptionClassName, children: description }))
+            ) : description)
           ] }),
           imagesContent
         ] }),
@@ -1042,7 +1028,7 @@ function AboutStatsShowcase({
               ),
               children: statsTitle
             }
-          ) : /* @__PURE__ */ jsx("div", { className: statsTitleClassName, children: statsTitle })),
+          ) : statsTitle),
           statsContent
         ] }),
         logosContent,
@@ -2588,25 +2574,21 @@ function AboutMissionPrinciples({
         children: principles.map((principle, idx) => /* @__PURE__ */ 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__ */ jsx(
                 "div",
                 {
                   className: cn(
                     "absolute right-4 top-4 text-3xl font-bold",
-                    getAccentColor(background),
-                    "opacity-20"
+                    "opacity-50"
                   ),
                   children: principle.number
                 }
               ),
               /* @__PURE__ */ jsxs("div", { className: "space-y-3", children: [
                 principle.title && (typeof principle.title === "string" ? /* @__PURE__ */ jsx("h3", { className: "text-xl font-bold", children: principle.title }) : principle.title),
-                principle.description && (typeof principle.description === "string" ? /* @__PURE__ */ jsx("p", { className: getTextColor(background, "muted"), children: principle.description }) : principle.description)
+                principle.description && (typeof principle.description === "string" ? /* @__PURE__ */ jsx("p", { className: "text-pretty text-lg", children: principle.description }) : principle.description)
               ] })
             ]
           },
@@ -2653,17 +2635,7 @@ function AboutMissionPrinciples({
       children: [
         /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-1 items-center gap-12 lg:grid-cols-2 lg:gap-24", children: [
           /* @__PURE__ */ jsxs("div", { className: "space-y-4 md:space-y-8", children: [
-            badgeText && (typeof badgeText === "string" ? /* @__PURE__ */ jsx(
-              "div",
-              {
-                className: cn(
-                  "inline-block rounded-lg bg-primary/10 px-3 py-1 text-sm",
-                  getAccentColor(background),
-                  badgeClassName
-                ),
-                children: badgeText
-              }
-            ) : /* @__PURE__ */ jsx("div", { className: badgeClassName, children: badgeText })),
+            badgeText && (typeof badgeText === "string" ? /* @__PURE__ */ jsx(Badge, { className: cn("px-3", badgeClassName), children: badgeText }) : badgeText),
             missionHeading && (typeof missionHeading === "string" ? /* @__PURE__ */ jsx(
               "h2",
               {
@@ -2673,18 +2645,8 @@ function AboutMissionPrinciples({
                 ),
                 children: missionHeading
               }
-            ) : /* @__PURE__ */ jsx("div", { className: missionHeadingClassName, children: missionHeading })),
-            missionDescription && (typeof missionDescription === "string" ? /* @__PURE__ */ jsx(
-              "p",
-              {
-                className: cn(
-                  "text-xl",
-                  getTextColor(background, "muted"),
-                  missionDescriptionClassName
-                ),
-                children: missionDescription
-              }
-            ) : /* @__PURE__ */ jsx("div", { className: missionDescriptionClassName, children: missionDescription })),
+            ) : missionHeading),
+            missionDescription && (typeof missionDescription === "string" ? /* @__PURE__ */ jsx("p", { className: cn("text-xl", missionDescriptionClassName), children: missionDescription }) : missionDescription),
             missionActionContent
           ] }),
           principlesContent
@@ -2693,9 +2655,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__ */ jsxs("div", { className: "grid grid-cols-1 items-center gap-8 lg:grid-cols-3", children: [
@@ -2709,18 +2671,8 @@ function AboutMissionPrinciples({
                     ),
                     children: visionHeading
                   }
-                ) : /* @__PURE__ */ jsx("div", { className: cn("mb-4", visionHeadingClassName), children: visionHeading })),
-                visionDescription && (typeof visionDescription === "string" ? /* @__PURE__ */ jsx(
-                  "p",
-                  {
-                    className: cn(
-                      "mb-4",
-                      getTextColor(background, "muted"),
-                      visionDescriptionClassName
-                    ),
-                    children: visionDescription
-                  }
-                ) : /* @__PURE__ */ jsx("div", { className: cn("mb-4", visionDescriptionClassName), children: visionDescription }))
+                ) : visionHeading),
+                visionDescription && (typeof visionDescription === "string" ? /* @__PURE__ */ jsx("p", { className: cn("mb-4", visionDescriptionClassName), children: visionDescription }) : visionDescription)
               ] }),
               /* @__PURE__ */ jsx("div", { className: "flex justify-center lg:col-span-1 lg:justify-end", children: visionActionContent })
             ] })
@@ -8190,7 +8142,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
       },
@@ -8227,31 +8179,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__ */ jsx(
-                DynamicIcon,
-                {
-                  name: "lucide/user",
-                  size: 40,
-                  className: cn(getTextColor(background, "muted"))
-                }
-              )
+              children: /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/user", size: 40 })
             }
           ),
           member.name && (typeof member.name === "string" ? /* @__PURE__ */ jsx("h3", { className: "mt-4 font-semibold", children: member.name }) : /* @__PURE__ */ jsx("div", { className: "mt-4", children: member.name })),
-          member.role && (typeof member.role === "string" ? /* @__PURE__ */ jsx("p", { className: cn("text-sm", getTextColor(background, "muted")), children: member.role }) : /* @__PURE__ */ jsx("div", { className: "text-sm", children: member.role })),
+          member.role && (typeof member.role === "string" ? /* @__PURE__ */ jsx("p", { className: "text-sm", children: member.role }) : member.role),
           member.socialLinks && member.socialLinks.length > 0 && /* @__PURE__ */ jsx("div", { className: "mt-4 flex justify-center gap-3", children: member.socialLinks.map((link, linkIdx) => /* @__PURE__ */ jsx(
             Pressable,
             {
               href: link.url,
               "aria-label": link.label,
-              className: cn(
-                getTextColor(background, "muted"),
-                `hover:${getAccentColor(background)}`
-              ),
               children: link.icon
             },
             linkIdx
@@ -8276,11 +8215,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
       },
@@ -8317,18 +8252,17 @@ function AboutStartupTeam({
               ),
               children: title
             }
-          ) : /* @__PURE__ */ jsx("div", { className: titleClassName, children: title })),
+          ) : title),
           description && (typeof description === "string" ? /* @__PURE__ */ jsx(
             "p",
             {
               className: cn(
                 "mt-6 text-lg whitespace-pre-line",
-                getTextColor(background, "muted"),
                 descriptionClassName
               ),
               children: description
             }
-          ) : /* @__PURE__ */ jsx("div", { className: cn("mt-6", descriptionClassName), children: description })),
+          ) : description),
           /* @__PURE__ */ jsxs("div", { className: "mt-8 md:mt-16", children: [
             mobileTabsNav,
             dynamicTeamTitle && (typeof dynamicTeamTitle === "string" ? /* @__PURE__ */ jsx(
@@ -8393,15 +8327,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__ */ jsxs("div", { children: [
         /* @__PURE__ */ jsx("p", { className: "font-semibold", children: author.name }),
-        /* @__PURE__ */ jsx("p", { className: cn("text-sm", getTextColor(background, "muted")), children: author.role })
+        /* @__PURE__ */ jsx("p", { className: "text-sm", children: author.role })
       ] })
     ] });
   }, [authorSlot, author, authorClassName, optixFlowConfig, background]);
@@ -8425,25 +8358,25 @@ function AboutMinimalStory({
             ),
             children: title
           }
-        ) : /* @__PURE__ */ jsx("div", { className: titleClassName, children: title })),
+        ) : title),
         content && (typeof content === "string" ? /* @__PURE__ */ jsx(
           "p",
           {
             className: cn(
               "mt-8 text-lg leading-relaxed whitespace-pre-line",
-              getTextColor(background, "muted"),
               bodyClassName
             ),
             children: content
           }
-        ) : /* @__PURE__ */ jsx("div", { className: cn("mt-8", bodyClassName), children: content })),
+        ) : content),
         featuredImage && /* @__PURE__ */ jsx(
           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
@@ -8851,34 +8784,6 @@ function AboutMissionDualImage({
   pattern,
   patternOpacity
 }) {
-  const actionsContent = 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__ */ jsx(
-        Pressable,
-        {
-          asButton: true,
-          className: cn("w-fit", actionClassName),
-          ...pressableProps,
-          children: children ?? /* @__PURE__ */ jsxs(Fragment$1, { children: [
-            icon,
-            label,
-            iconAfter
-          ] })
-        },
-        index
-      );
-    });
-  }, [actionsSlot, actions]);
   return /* @__PURE__ */ jsx(
     Section,
     {
@@ -8886,7 +8791,7 @@ function AboutMissionDualImage({
       spacing,
       pattern,
       patternOpacity,
-      className: cn(className),
+      className,
       containerClassName,
       children: /* @__PURE__ */ jsxs(
         "div",
@@ -8904,18 +8809,8 @@ function AboutMissionDualImage({
                     ),
                     children: missionTitle
                   }
-                ) : /* @__PURE__ */ jsx("div", { className: missionTitleClassName, children: missionTitle })),
-                missionContent && (typeof missionContent === "string" ? /* @__PURE__ */ jsx(
-                  "p",
-                  {
-                    className: cn(
-                      "mt-4 text-lg",
-                      getTextColor(background, "muted"),
-                      missionContentClassName
-                    ),
-                    children: missionContent
-                  }
-                ) : /* @__PURE__ */ jsx("div", { className: cn("mt-4", missionContentClassName), children: missionContent }))
+                ) : missionTitle),
+                missionContent && (typeof missionContent === "string" ? /* @__PURE__ */ jsx("p", { className: cn("mt-4 text-lg", missionContentClassName), children: missionContent }) : missionContent)
               ] }),
               /* @__PURE__ */ jsxs("div", { children: [
                 visionTitle && (typeof visionTitle === "string" ? /* @__PURE__ */ jsx(
@@ -8927,20 +8822,17 @@ function AboutMissionDualImage({
                     ),
                     children: visionTitle
                   }
-                ) : /* @__PURE__ */ jsx("div", { className: visionTitleClassName, children: visionTitle })),
-                visionContent && (typeof visionContent === "string" ? /* @__PURE__ */ jsx(
-                  "p",
-                  {
-                    className: cn(
-                      "mt-4 text-lg",
-                      getTextColor(background, "muted"),
-                      visionContentClassName
-                    ),
-                    children: visionContent
-                  }
-                ) : /* @__PURE__ */ jsx("div", { className: cn("mt-4", visionContentClassName), children: visionContent }))
+                ) : visionTitle),
+                visionContent && (typeof visionContent === "string" ? /* @__PURE__ */ jsx("p", { className: cn("mt-4 text-lg", visionContentClassName), children: visionContent }) : visionContent)
               ] }),
-              (actionsSlot || actions && actions.length > 0) && /* @__PURE__ */ jsx("div", { className: cn("mt-8 flex flex-wrap gap-4", actionsClassName), children: actionsContent })
+              /* @__PURE__ */ jsx(
+                BlockActions,
+                {
+                  actions,
+                  actionsSlot,
+                  actionsClassName
+                }
+              )
             ] }),
             /* @__PURE__ */ jsxs("div", { className: "relative flex flex-col gap-4 sm:grid sm:grid-cols-2", children: [
               primaryImage && /* @__PURE__ */ jsx(
@@ -39571,12 +39463,12 @@ function FaqNumberedGrid({
   items,
   itemsSlot,
   background,
-  spacing = "py-6 md:py-32",
+  containerClassName = "px-6 sm:px-6 md:px-8 lg:px-8",
+  spacing = "lg",
   pattern,
   patternOpacity,
   patternClassName,
   className,
-  containerClassName,
   headerClassName,
   headingClassName,
   descriptionClassName,
@@ -39593,7 +39485,9 @@ function FaqNumberedGrid({
       "div",
       {
         className: cn(
-          "mx-auto mt-10 grid max-w-7xl gap-6 md:grid-cols-2",
+          "mx-0 md:mx-auto mt-6 md:mt-10",
+          "max-w-full md:max-w-7xl",
+          "grid gap-3 md:gap-6 grid-cols-1 md:grid-cols-2",
           gridClassName
         ),
         children: items.map((item, index) => /* @__PURE__ */ jsxs(
@@ -39608,27 +39502,17 @@ function FaqNumberedGrid({
                 "span",
                 {
                   className: cn(
-                    "flex size-10 shrink-0 items-center justify-center rounded-lg text-md font-semibold",
-                    getNestedCardBg(background),
-                    getNestedCardTextColor(background),
+                    "flex size-10 shrink-0 items-center justify-center",
+                    "rounded-lg text-md font-semibold shadow-lg",
+                    "bg-primary text-primary-foreground",
                     numberClassName
                   ),
                   children: index + 1
                 }
               ),
               /* @__PURE__ */ jsxs("div", { children: [
-                /* @__PURE__ */ jsx("div", { className: "mb-1 flex items-center justify-between", children: typeof item.question === "string" ? /* @__PURE__ */ jsx("h3", { className: cn("font-medium", questionClassName), children: item.question }) : /* @__PURE__ */ jsx("div", { className: questionClassName, children: item.question }) }),
-                typeof item.answer === "string" ? /* @__PURE__ */ jsx(
-                  "p",
-                  {
-                    className: cn(
-                      getTextColor(background, "muted"),
-                      "text-sm",
-                      answerClassName
-                    ),
-                    children: item.answer
-                  }
-                ) : /* @__PURE__ */ jsx("div", { className: answerClassName, children: item.answer })
+                /* @__PURE__ */ jsx("div", { className: "mb-1 flex items-center justify-between", children: typeof item.question === "string" ? /* @__PURE__ */ jsx("h3", { className: cn("font-medium", questionClassName), children: item.question }) : item.question }),
+                typeof item.answer === "string" ? /* @__PURE__ */ jsx("p", { className: cn("text-sm md:text-base", answerClassName), children: item.answer }) : item.answer
               ] })
             ]
           },
@@ -39655,7 +39539,8 @@ function FaqNumberedGrid({
       patternOpacity,
       patternClassName,
       className,
-      children: /* @__PURE__ */ jsxs("div", { className: containerClassName, children: [
+      containerClassName,
+      children: /* @__PURE__ */ jsxs("div", { className: "relative", children: [
         /* @__PURE__ */ jsxs(
           "div",
           {
@@ -39673,18 +39558,8 @@ function FaqNumberedGrid({
                   ),
                   children: heading
                 }
-              ) : /* @__PURE__ */ jsx("div", { className: headingClassName, children: heading })),
-              description && (typeof description === "string" ? /* @__PURE__ */ jsx(
-                "p",
-                {
-                  className: cn(
-                    getTextColor(background, "muted"),
-                    "lg:text-lg",
-                    descriptionClassName
-                  ),
-                  children: description
-                }
-              ) : /* @__PURE__ */ jsx("div", { className: descriptionClassName, children: description }))
+              ) : heading),
+              description && (typeof description === "string" ? /* @__PURE__ */ jsx("p", { className: cn("text-md lg:text-lg", descriptionClassName), children: description }) : description)
             ]
           }
         ),
@@ -81857,7 +81732,7 @@ function ListSearchableGrid({
     }
   );
 }
-var { useMemo: useMemo413 } = React26;
+var { useMemo: useMemo412 } = React26;
 function OfferModalNewsletterDiscount({
   title,
   emailPlaceholder,
@@ -81925,7 +81800,7 @@ function OfferModalNewsletterDiscount({
   });
   const formMethod = formConfig?.method?.toLowerCase() === "get" ? "get" : "post";
   const dialogProps = open !== void 0 ? { open, onOpenChange } : { defaultOpen };
-  const renderCloseButton = useMemo413(() => {
+  const renderCloseButton = useMemo412(() => {
     if (closeButtonSlot) return closeButtonSlot;
     if (!closeButtonText) return null;
     return /* @__PURE__ */ jsx("div", { className: "absolute end-1.5 top-1.5", children: /* @__PURE__ */ jsx(DialogClose, { asChild: true, children: /* @__PURE__ */ jsx(
@@ -81939,12 +81814,12 @@ function OfferModalNewsletterDiscount({
       }
     ) }) });
   }, [closeButtonSlot, closeButtonText, closeClassName]);
-  const renderHeader = useMemo413(() => {
+  const renderHeader = useMemo412(() => {
     if (headerSlot) return headerSlot;
     if (!title) return null;
     return /* @__PURE__ */ jsx(DialogHeader, { className: headerClassName, children: typeof title === "string" ? /* @__PURE__ */ jsx(DialogTitle, { className: cn("text-start font-serif text-2xl font-normal leading-snug", titleClassName), children: title }) : /* @__PURE__ */ jsx(DialogTitle, { className: cn("text-start font-serif text-2xl font-normal leading-snug", titleClassName), children: title }) });
   }, [headerSlot, title, headerClassName, titleClassName]);
-  const renderForm = useMemo413(() => {
+  const renderForm = useMemo412(() => {
     if (formSlot) return formSlot;
     return /* @__PURE__ */ jsxs(
       Form,
@@ -82006,7 +81881,7 @@ function OfferModalNewsletterDiscount({
     }
   ) });
 }
-var { useMemo: useMemo414 } = React26;
+var { useMemo: useMemo413 } = React26;
 function OfferModalMembershipImage({
   overline,
   title,
@@ -82083,7 +81958,7 @@ function OfferModalMembershipImage({
   });
   const formMethod = formConfig?.method?.toLowerCase() === "get" ? "get" : "post";
   const dialogProps = open !== void 0 ? { open, onOpenChange } : { defaultOpen };
-  const renderImage = useMemo414(() => {
+  const renderImage = useMemo413(() => {
     if (imageSlot) return imageSlot;
     if (!image) return null;
     return /* @__PURE__ */ jsx("div", { className: cn("max-h-[290px] h-full overflow-hidden max-lg:hidden", imageWrapperClassName), children: /* @__PURE__ */ jsx(
@@ -82096,7 +81971,7 @@ function OfferModalMembershipImage({
       }
     ) });
   }, [imageSlot, image, imageWrapperClassName, imageClassName, optixFlowConfig]);
-  const renderCloseButton = useMemo414(() => {
+  const renderCloseButton = useMemo413(() => {
     if (closeButtonSlot) return closeButtonSlot;
     return /* @__PURE__ */ jsx("div", { className: "absolute -end-px -top-px z-10", children: /* @__PURE__ */ jsx(DialogClose, { asChild: true, children: /* @__PURE__ */ jsx(
       Pressable,
@@ -82112,7 +81987,7 @@ function OfferModalMembershipImage({
       }
     ) }) });
   }, [closeButtonSlot, closeClassName]);
-  const renderForm = useMemo414(() => {
+  const renderForm = useMemo413(() => {
     if (formSlot) return formSlot;
     return /* @__PURE__ */ jsxs(
       Form,
@@ -82175,7 +82050,7 @@ function OfferModalMembershipImage({
       }
     );
   }, [formSlot, form, formConfig, formMethod, emailPlaceholder, inputClassName, submitClassName, buttonText, formClassName]);
-  const renderFooter = useMemo414(() => {
+  const renderFooter = useMemo413(() => {
     if (footerSlot) return footerSlot;
     if (!description) return null;
     return /* @__PURE__ */ jsx(DialogFooter, { className: footerClassName, children: /* @__PURE__ */ jsx(DialogDescription, { className: cn("text-muted-foreground text-center text-xs leading-relaxed", descriptionClassName), children: description }) });
@@ -82295,7 +82170,7 @@ function SheetDescription({
     }
   );
 }
-var { useMemo: useMemo415 } = React26;
+var { useMemo: useMemo414 } = React26;
 function OfferModalSheetNewsletter({
   logo,
   logoSlot,
@@ -82378,7 +82253,7 @@ function OfferModalSheetNewsletter({
   });
   const formMethod = formConfig?.method?.toLowerCase() === "get" ? "get" : "post";
   const sheetProps = open !== void 0 ? { open, onOpenChange } : { defaultOpen };
-  const renderLogo = useMemo415(() => {
+  const renderLogo = useMemo414(() => {
     if (logoSlot) return logoSlot;
     if (!logo) return null;
     const logoSrc = typeof logo.src === "string" ? logo.src : logo.src.light;
@@ -82392,7 +82267,7 @@ function OfferModalSheetNewsletter({
       }
     );
   }, [logoSlot, logo, logoClassName, optixFlowConfig]);
-  const renderHeader = useMemo415(() => {
+  const renderHeader = useMemo414(() => {
     if (headerSlot) return headerSlot;
     return /* @__PURE__ */ jsxs(SheetHeader, { className: cn("gap-8 p-0", headerClassName), children: [
       renderLogo,
@@ -82402,7 +82277,7 @@ function OfferModalSheetNewsletter({
       ] })
     ] });
   }, [headerSlot, renderLogo, headerClassName, title, titleClassName, description, descriptionClassName]);
-  const renderForm = useMemo415(() => {
+  const renderForm = useMemo414(() => {
     if (formSlot) return formSlot;
     return /* @__PURE__ */ jsx(
       Form,
@@ -82450,7 +82325,7 @@ function OfferModalSheetNewsletter({
       }
     );
   }, [formSlot, form, formConfig, formMethod, emailPlaceholder, inputClassName, submitClassName, buttonText, formClassName]);
-  const renderLegal = useMemo415(() => {
+  const renderLegal = useMemo414(() => {
     if (legalSlot) return legalSlot;
     if (!termsUrl || !termsText || !privacyUrl || !privacyText) return null;
     return /* @__PURE__ */ jsxs("p", { className: cn("text-muted-foreground text-xs", legalClassName), children: [
@@ -82464,7 +82339,7 @@ function OfferModalSheetNewsletter({
       "."
     ] });
   }, [legalSlot, termsUrl, termsText, privacyUrl, privacyText, legalClassName]);
-  const renderImage = useMemo415(() => {
+  const renderImage = useMemo414(() => {
     if (imageSlot) return imageSlot;
     if (!image) return null;
     return /* @__PURE__ */ jsx("div", { className: cn("h-1/2 basis-1/2", imageWrapperClassName), children: /* @__PURE__ */ jsx(AspectRatio, { ratio: 1, className: "overflow-hidden", children: /* @__PURE__ */ jsx(