@opensite/ui 0.8.6 → 0.8.8

package/dist/hero-hiring-animated-text.cjs

@@ -847,7 +847,7 @@ function HeroHiringAnimatedText({
 }) {
   const renderHeading = React.useMemo(() => {
     if (headingSlot) return headingSlot;
-    return /* @__PURE__ */ jsxRuntime.jsxs("h1", { className: cn("text-4xl leading-9 font-bold text-foreground lg:text-5xl lg:leading-12! xl:text-7xl xl:leading-22!", headingClassName), children: [
+    return /* @__PURE__ */ jsxRuntime.jsxs("h1", { className: cn("text-4xl leading-9 font-bold lg:text-5xl lg:leading-12! xl:text-7xl xl:leading-22!", headingClassName), children: [
       /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-2", children: headingPrefix }),
       animatedTexts && animatedTexts.length > 0 && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative h-[calc(2.25rem*3)] md:h-9 lg:h-12 xl:h-22", children: animatedTexts.map((text, index) => /* @__PURE__ */ jsxRuntime.jsx(
         "div",
@@ -908,7 +908,7 @@ function HeroHiringAnimatedText({
       children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("relative z-10 container flex size-full max-w-412.5 flex-col justify-between pt-24 pb-14 md:justify-end", containerClassName), children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("flex h-full flex-col justify-between gap-6 md:justify-end", contentClassName), children: [
         renderHeading,
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col gap-8", children: [
-          description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("text-lg text-foreground lg:text-2xl", descriptionClassName), children: description }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: descriptionClassName, children: description })),
+          description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("text-lg lg:text-2xl", descriptionClassName), children: description }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: descriptionClassName, children: description })),
           /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-wrap items-center justify-between gap-5", children: [
             renderActions,
             renderScrollAction

package/dist/hero-hiring-animated-text.js

@@ -826,7 +826,7 @@ function HeroHiringAnimatedText({
 }) {
   const renderHeading = useMemo(() => {
     if (headingSlot) return headingSlot;
-    return /* @__PURE__ */ jsxs("h1", { className: cn("text-4xl leading-9 font-bold text-foreground lg:text-5xl lg:leading-12! xl:text-7xl xl:leading-22!", headingClassName), children: [
+    return /* @__PURE__ */ jsxs("h1", { className: cn("text-4xl leading-9 font-bold lg:text-5xl lg:leading-12! xl:text-7xl xl:leading-22!", headingClassName), children: [
       /* @__PURE__ */ jsx("div", { className: "mb-2", children: headingPrefix }),
       animatedTexts && animatedTexts.length > 0 && /* @__PURE__ */ jsx("div", { className: "relative h-[calc(2.25rem*3)] md:h-9 lg:h-12 xl:h-22", children: animatedTexts.map((text, index) => /* @__PURE__ */ jsx(
         "div",
@@ -887,7 +887,7 @@ function HeroHiringAnimatedText({
       children: /* @__PURE__ */ jsx("div", { className: cn("relative z-10 container flex size-full max-w-412.5 flex-col justify-between pt-24 pb-14 md:justify-end", containerClassName), children: /* @__PURE__ */ jsxs("div", { className: cn("flex h-full flex-col justify-between gap-6 md:justify-end", contentClassName), children: [
         renderHeading,
         /* @__PURE__ */ jsxs("div", { className: "flex flex-col gap-8", children: [
-          description && (typeof description === "string" ? /* @__PURE__ */ jsx("p", { className: cn("text-lg text-foreground lg:text-2xl", descriptionClassName), children: description }) : /* @__PURE__ */ jsx("div", { className: descriptionClassName, children: description })),
+          description && (typeof description === "string" ? /* @__PURE__ */ jsx("p", { className: cn("text-lg lg:text-2xl", descriptionClassName), children: description }) : /* @__PURE__ */ jsx("div", { className: descriptionClassName, children: description })),
           /* @__PURE__ */ jsxs("div", { className: "flex flex-wrap items-center justify-between gap-5", children: [
             renderActions,
             renderScrollAction

package/dist/hero-image-slider.cjs

@@ -536,7 +536,6 @@ var ImageSlider = ({
               img.Img,
               {
                 src: activeImage.src,
-                mediaId: activeImage.mediaId,
                 alt: activeImage.alt,
                 className: cn(
                   "h-full w-full object-cover object-center",
@@ -548,7 +547,7 @@ var ImageSlider = ({
               }
             )
           },
-          `${currentIndex}-${activeImage.src ?? activeImage.mediaId ?? "image"}`
+          `${currentIndex}-${activeImage.src ?? "image"}`
         ) : null }),
         overlayContent,
         children ? /* @__PURE__ */ jsxRuntime.jsx(

package/dist/hero-image-slider.js

@@ -515,7 +515,6 @@ var ImageSlider = ({
               Img,
               {
                 src: activeImage.src,
-                mediaId: activeImage.mediaId,
                 alt: activeImage.alt,
                 className: cn(
                   "h-full w-full object-cover object-center",
@@ -527,7 +526,7 @@ var ImageSlider = ({
               }
             )
           },
-          `${currentIndex}-${activeImage.src ?? activeImage.mediaId ?? "image"}`
+          `${currentIndex}-${activeImage.src ?? "image"}`
         ) : null }),
         overlayContent,
         children ? /* @__PURE__ */ jsx(

package/dist/hero-innovation-image-grid.cjs

@@ -962,10 +962,10 @@ function HeroInnovationImageGrid({
     const { label, icon, iconAfter, children, className: actionClassName, ...pressableProps } = action;
     return /* @__PURE__ */ jsxRuntime.jsx(Pressable, { asButton: true, className: actionClassName, ...pressableProps, children: children ?? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
       icon,
-      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "font-medium text-white", children: label }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "font-medium text-background", children: label }),
       /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative h-6 w-7 overflow-hidden", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "absolute top-0 left-0 flex -translate-x-1/2 items-center transition-all duration-500 group-hover:translate-x-0", children: [
-        /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/move-right", size: 24, className: "fill-white px-1" }),
-        /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/move-right", size: 24, className: "fill-white px-1" })
+        /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/move-right", size: 24, className: "fill-background px-1" }),
+        /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/move-right", size: 24, className: "fill-background px-1" })
       ] }) }),
       iconAfter
     ] }) });

package/dist/hero-innovation-image-grid.js

@@ -940,10 +940,10 @@ function HeroInnovationImageGrid({
     const { label, icon, iconAfter, children, className: actionClassName, ...pressableProps } = action;
     return /* @__PURE__ */ jsx(Pressable, { asButton: true, className: actionClassName, ...pressableProps, children: children ?? /* @__PURE__ */ jsxs(Fragment, { children: [
       icon,
-      /* @__PURE__ */ jsx("div", { className: "font-medium text-white", children: label }),
+      /* @__PURE__ */ jsx("div", { className: "font-medium text-background", children: label }),
       /* @__PURE__ */ jsx("div", { className: "relative h-6 w-7 overflow-hidden", children: /* @__PURE__ */ jsxs("div", { className: "absolute top-0 left-0 flex -translate-x-1/2 items-center transition-all duration-500 group-hover:translate-x-0", children: [
-        /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/move-right", size: 24, className: "fill-white px-1" }),
-        /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/move-right", size: 24, className: "fill-white px-1" })
+        /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/move-right", size: 24, className: "fill-background px-1" }),
+        /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/move-right", size: 24, className: "fill-background px-1" })
       ] }) }),
       iconAfter
     ] }) });

package/dist/hero-mental-health-team.cjs

@@ -449,12 +449,12 @@ function HeroMentalHealthTeam({
         }
       ) }),
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex h-full w-full flex-col justify-between gap-2", children: [
-        /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "text-lg font-medium text-foreground", children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "text-lg font-medium ", children: [
           '"',
           testimonial.quote,
           '"'
         ] }),
-        /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-foreground", children: testimonial.author })
+        /* @__PURE__ */ jsxRuntime.jsx("p", { className: "", children: testimonial.author })
       ] })
     ] }) });
   }, [testimonialSlot, testimonial, optixFlowConfig]);
@@ -477,8 +477,8 @@ function HeroMentalHealthTeam({
       className: cn("dark bg-background py-12 font-sans md:py-20", className),
       children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("container", containerClassName), children: [
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("mx-auto mb-24 flex max-w-[900px] flex-col items-center gap-3", headerClassName), children: [
-          subtitle && (typeof subtitle === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-center text-foreground", children: subtitle }) : subtitle),
-          heading && (typeof heading === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h1", { className: cn("text-center text-4xl leading-tight font-medium text-foreground sm:text-5xl md:text-6xl", headingClassName), children: heading }) : /* @__PURE__ */ jsxRuntime.jsx("h1", { className: cn("text-center text-4xl leading-tight font-medium text-foreground sm:text-5xl md:text-6xl", headingClassName), children: heading }))
+          subtitle && (typeof subtitle === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-center ", children: subtitle }) : subtitle),
+          heading && (typeof heading === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h1", { className: cn("text-center text-4xl leading-tight font-medium sm:text-5xl md:text-6xl", headingClassName), children: heading }) : /* @__PURE__ */ jsxRuntime.jsx("h1", { className: cn("text-center text-4xl leading-tight font-medium sm:text-5xl md:text-6xl", headingClassName), children: heading }))
         ] }),
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("grid w-full max-w-332.5 auto-cols-auto grid-cols-2 grid-rows-[auto_auto] justify-center gap-5 md:grid-cols-[repeat(4,1fr)]", gridClassName), children: [
           renderTeamImages,

package/dist/hero-mental-health-team.js

@@ -443,12 +443,12 @@ function HeroMentalHealthTeam({
         }
       ) }),
       /* @__PURE__ */ jsxs("div", { className: "flex h-full w-full flex-col justify-between gap-2", children: [
-        /* @__PURE__ */ jsxs("p", { className: "text-lg font-medium text-foreground", children: [
+        /* @__PURE__ */ jsxs("p", { className: "text-lg font-medium ", children: [
           '"',
           testimonial.quote,
           '"'
         ] }),
-        /* @__PURE__ */ jsx("p", { className: "text-foreground", children: testimonial.author })
+        /* @__PURE__ */ jsx("p", { className: "", children: testimonial.author })
       ] })
     ] }) });
   }, [testimonialSlot, testimonial, optixFlowConfig]);
@@ -471,8 +471,8 @@ function HeroMentalHealthTeam({
       className: cn("dark bg-background py-12 font-sans md:py-20", className),
       children: /* @__PURE__ */ jsxs("div", { className: cn("container", containerClassName), children: [
         /* @__PURE__ */ jsxs("div", { className: cn("mx-auto mb-24 flex max-w-[900px] flex-col items-center gap-3", headerClassName), children: [
-          subtitle && (typeof subtitle === "string" ? /* @__PURE__ */ jsx("p", { className: "text-center text-foreground", children: subtitle }) : subtitle),
-          heading && (typeof heading === "string" ? /* @__PURE__ */ jsx("h1", { className: cn("text-center text-4xl leading-tight font-medium text-foreground sm:text-5xl md:text-6xl", headingClassName), children: heading }) : /* @__PURE__ */ jsx("h1", { className: cn("text-center text-4xl leading-tight font-medium text-foreground sm:text-5xl md:text-6xl", headingClassName), children: heading }))
+          subtitle && (typeof subtitle === "string" ? /* @__PURE__ */ jsx("p", { className: "text-center ", children: subtitle }) : subtitle),
+          heading && (typeof heading === "string" ? /* @__PURE__ */ jsx("h1", { className: cn("text-center text-4xl leading-tight font-medium sm:text-5xl md:text-6xl", headingClassName), children: heading }) : /* @__PURE__ */ jsx("h1", { className: cn("text-center text-4xl leading-tight font-medium sm:text-5xl md:text-6xl", headingClassName), children: heading }))
         ] }),
         /* @__PURE__ */ jsxs("div", { className: cn("grid w-full max-w-332.5 auto-cols-auto grid-cols-2 grid-rows-[auto_auto] justify-center gap-5 md:grid-cols-[repeat(4,1fr)]", gridClassName), children: [
           renderTeamImages,

package/dist/hero-minimal-centered-dark.cjs

@@ -890,7 +890,7 @@ function HeroMinimalCenteredDark({
           ] }),
           typeof badge === "string" ? /* @__PURE__ */ jsxRuntime.jsx("span", { children: badge }) : badge
         ] }),
-        (heading || headingHighlight) && (typeof heading === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h1", { className: cn("mt-8 max-w-4xl text-5xl font-bold tracking-tight text-foreground md:text-6xl lg:text-7xl", headingClassName), children: heading }) : heading ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: headingClassName, children: heading }) : headingHighlight ? /* @__PURE__ */ jsxRuntime.jsxs("h1", { className: cn("mt-8 max-w-4xl text-5xl font-bold tracking-tight text-foreground md:text-6xl lg:text-7xl", headingClassName), children: [
+        (heading || headingHighlight) && (typeof heading === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h1", { className: cn("mt-8 max-w-4xl text-5xl font-bold tracking-tight md:text-6xl lg:text-7xl", headingClassName), children: heading }) : heading ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: headingClassName, children: heading }) : headingHighlight ? /* @__PURE__ */ jsxRuntime.jsxs("h1", { className: cn("mt-8 max-w-4xl text-5xl font-bold tracking-tight md:text-6xl lg:text-7xl", headingClassName), children: [
           "The future of",
           " ",
           /* @__PURE__ */ jsxRuntime.jsx("span", { className: "bg-linear-to-r from-blue-400 to-violet-400 bg-clip-text text-transparent", children: headingHighlight }),

package/dist/hero-minimal-centered-dark.js

@@ -869,7 +869,7 @@ function HeroMinimalCenteredDark({
           ] }),
           typeof badge === "string" ? /* @__PURE__ */ jsx("span", { children: badge }) : badge
         ] }),
-        (heading || headingHighlight) && (typeof heading === "string" ? /* @__PURE__ */ jsx("h1", { className: cn("mt-8 max-w-4xl text-5xl font-bold tracking-tight text-foreground md:text-6xl lg:text-7xl", headingClassName), children: heading }) : heading ? /* @__PURE__ */ jsx("div", { className: headingClassName, children: heading }) : headingHighlight ? /* @__PURE__ */ jsxs("h1", { className: cn("mt-8 max-w-4xl text-5xl font-bold tracking-tight text-foreground md:text-6xl lg:text-7xl", headingClassName), children: [
+        (heading || headingHighlight) && (typeof heading === "string" ? /* @__PURE__ */ jsx("h1", { className: cn("mt-8 max-w-4xl text-5xl font-bold tracking-tight md:text-6xl lg:text-7xl", headingClassName), children: heading }) : heading ? /* @__PURE__ */ jsx("div", { className: headingClassName, children: heading }) : headingHighlight ? /* @__PURE__ */ jsxs("h1", { className: cn("mt-8 max-w-4xl text-5xl font-bold tracking-tight md:text-6xl lg:text-7xl", headingClassName), children: [
           "The future of",
           " ",
           /* @__PURE__ */ jsx("span", { className: "bg-linear-to-r from-blue-400 to-violet-400 bg-clip-text text-transparent", children: headingHighlight }),

package/dist/hero-mobile-app-download.cjs

@@ -1005,7 +1005,7 @@ function HeroMobileAppDownload({
     return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute -right-8 top-1/4 w-48 rounded-2xl bg-background p-4 shadow-lg", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex items-center gap-3", children: [
       notification.icon && /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("flex h-10 w-10 items-center justify-center rounded-full", notification.iconBgClass), children: /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: notification.icon, size: 20, className: notification.iconColorClass }) }),
       /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
-        notification.title && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "font-semibold text-foreground", children: notification.title }),
+        notification.title && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "font-semibold ", children: notification.title }),
         notification.subtitle && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-xs text-muted-foreground", children: notification.subtitle })
       ] })
     ] }) });
@@ -1037,7 +1037,7 @@ function HeroMobileAppDownload({
       children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("container", containerClassName), children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid items-center gap-12 lg:grid-cols-2 lg:gap-20", children: [
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("flex flex-col gap-8", contentClassName), children: [
           renderBadge,
-          heading && (typeof heading === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h1", { className: cn("text-4xl font-bold tracking-tight text-foreground md:text-5xl lg:text-6xl", headingClassName), children: heading }) : /* @__PURE__ */ jsxRuntime.jsx("h1", { className: cn("text-4xl font-bold tracking-tight text-foreground md:text-5xl lg:text-6xl", headingClassName), children: heading })),
+          heading && (typeof heading === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h1", { className: cn("text-4xl font-bold tracking-tight md:text-5xl lg:text-6xl", headingClassName), children: heading }) : /* @__PURE__ */ jsxRuntime.jsx("h1", { className: cn("text-4xl font-bold tracking-tight md:text-5xl lg:text-6xl", headingClassName), children: heading })),
           description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("text-lg text-muted-foreground", descriptionClassName), children: description }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: descriptionClassName, children: description })),
           renderStoreActions,
           renderRating

package/dist/hero-mobile-app-download.js

@@ -984,7 +984,7 @@ function HeroMobileAppDownload({
     return /* @__PURE__ */ jsx("div", { className: "absolute -right-8 top-1/4 w-48 rounded-2xl bg-background p-4 shadow-lg", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
       notification.icon && /* @__PURE__ */ jsx("div", { className: cn("flex h-10 w-10 items-center justify-center rounded-full", notification.iconBgClass), children: /* @__PURE__ */ jsx(DynamicIcon, { name: notification.icon, size: 20, className: notification.iconColorClass }) }),
       /* @__PURE__ */ jsxs("div", { children: [
-        notification.title && /* @__PURE__ */ jsx("div", { className: "font-semibold text-foreground", children: notification.title }),
+        notification.title && /* @__PURE__ */ jsx("div", { className: "font-semibold ", children: notification.title }),
         notification.subtitle && /* @__PURE__ */ jsx("div", { className: "text-xs text-muted-foreground", children: notification.subtitle })
       ] })
     ] }) });
@@ -1016,7 +1016,7 @@ function HeroMobileAppDownload({
       children: /* @__PURE__ */ jsx("div", { className: cn("container", containerClassName), children: /* @__PURE__ */ jsxs("div", { className: "grid items-center gap-12 lg:grid-cols-2 lg:gap-20", children: [
         /* @__PURE__ */ jsxs("div", { className: cn("flex flex-col gap-8", contentClassName), children: [
           renderBadge,
-          heading && (typeof heading === "string" ? /* @__PURE__ */ jsx("h1", { className: cn("text-4xl font-bold tracking-tight text-foreground md:text-5xl lg:text-6xl", headingClassName), children: heading }) : /* @__PURE__ */ jsx("h1", { className: cn("text-4xl font-bold tracking-tight text-foreground md:text-5xl lg:text-6xl", headingClassName), children: heading })),
+          heading && (typeof heading === "string" ? /* @__PURE__ */ jsx("h1", { className: cn("text-4xl font-bold tracking-tight md:text-5xl lg:text-6xl", headingClassName), children: heading }) : /* @__PURE__ */ jsx("h1", { className: cn("text-4xl font-bold tracking-tight md:text-5xl lg:text-6xl", headingClassName), children: heading })),
           description && (typeof description === "string" ? /* @__PURE__ */ jsx("p", { className: cn("text-lg text-muted-foreground", descriptionClassName), children: description }) : /* @__PURE__ */ jsx("div", { className: descriptionClassName, children: description })),
           renderStoreActions,
           renderRating

package/dist/hero-newsletter-minimal.cjs

@@ -906,7 +906,7 @@ function HeroNewsletterMinimal({
         className
       ),
       children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("container flex flex-col items-center justify-center text-center", containerClassName), children: [
-        heading && (typeof heading === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h1", { className: cn("max-w-3xl text-5xl font-bold tracking-tight text-foreground md:text-6xl lg:text-7xl", headingClassName), children: heading }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: headingClassName, children: heading })),
+        heading && (typeof heading === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h1", { className: cn("max-w-3xl text-5xl font-bold tracking-tight md:text-6xl lg:text-7xl", headingClassName), children: heading }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: headingClassName, children: heading })),
         description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("mt-6 max-w-xl text-lg text-muted-foreground md:text-xl", descriptionClassName), children: description }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: descriptionClassName, children: description })),
         /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("mt-10 flex w-full max-w-md flex-col gap-4 sm:flex-row", formClassName), children: renderForm }),
         disclaimer && (typeof disclaimer === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("mt-4 text-sm text-muted-foreground", disclaimerClassName), children: disclaimer }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: disclaimerClassName, children: disclaimer })),

package/dist/hero-newsletter-minimal.js

@@ -885,7 +885,7 @@ function HeroNewsletterMinimal({
         className
       ),
       children: /* @__PURE__ */ jsxs("div", { className: cn("container flex flex-col items-center justify-center text-center", containerClassName), children: [
-        heading && (typeof heading === "string" ? /* @__PURE__ */ jsx("h1", { className: cn("max-w-3xl text-5xl font-bold tracking-tight text-foreground md:text-6xl lg:text-7xl", headingClassName), children: heading }) : /* @__PURE__ */ jsx("div", { className: headingClassName, children: heading })),
+        heading && (typeof heading === "string" ? /* @__PURE__ */ jsx("h1", { className: cn("max-w-3xl text-5xl font-bold tracking-tight md:text-6xl lg:text-7xl", headingClassName), children: heading }) : /* @__PURE__ */ jsx("div", { className: headingClassName, children: heading })),
         description && (typeof description === "string" ? /* @__PURE__ */ jsx("p", { className: cn("mt-6 max-w-xl text-lg text-muted-foreground md:text-xl", descriptionClassName), children: description }) : /* @__PURE__ */ jsx("div", { className: descriptionClassName, children: description })),
         /* @__PURE__ */ jsx("div", { className: cn("mt-10 flex w-full max-w-md flex-col gap-4 sm:flex-row", formClassName), children: renderForm }),
         disclaimer && (typeof disclaimer === "string" ? /* @__PURE__ */ jsx("p", { className: cn("mt-4 text-sm text-muted-foreground", disclaimerClassName), children: disclaimer }) : /* @__PURE__ */ jsx("div", { className: disclaimerClassName, children: disclaimer })),

package/dist/hero-overlay-cta-grid.cjs

@@ -958,7 +958,7 @@ function HeroOverlayCtaGrid({
   const renderBadge = React.useMemo(() => {
     if (badgeSlot) return badgeSlot;
     if (!badgeText) return null;
-    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "inline-flex items-center gap-2 rounded-full border border-white/30 bg-white/15 px-6 py-2 text-sm font-semibold uppercase tracking-[0.2em]", children: [
+    return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "inline-flex items-center gap-2 rounded-full border border-background/30 bg-background/15 px-6 py-2 text-sm font-semibold uppercase tracking-[0.2em]", children: [
       badgeIcon ? /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: badgeIcon, size: 18 }) : null,
       badgeText
     ] });
@@ -982,7 +982,7 @@ function HeroOverlayCtaGrid({
         children: [
           /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative flex h-12 w-12 flex-none items-center justify-center rounded-full bg-primary/10 text-primary transition-colors group-hover:bg-primary group-hover:text-primary-foreground", children: /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: card.icon, size: 22 }) }),
           /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "min-w-0", children: [
-            /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-base font-semibold text-foreground", children: card.label }),
+            /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-base font-semibold ", children: card.label }),
             /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground", children: card.subtitle })
           ] }),
           /* @__PURE__ */ jsxRuntime.jsx(
@@ -1038,7 +1038,7 @@ function HeroOverlayCtaGrid({
                   initial: { opacity: 0, y: 28 },
                   animate: { opacity: 1, y: 0 },
                   transition: { duration: 0.6, ease: "easeOut" },
-                  className: "mx-auto max-w-3xl text-center text-balance text-white",
+                  className: "mx-auto max-w-3xl text-center text-balance text-background",
                   children: [
                     renderBadge,
                     heading && (typeof heading === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
@@ -1064,7 +1064,7 @@ function HeroOverlayCtaGrid({
                       "p",
                       {
                         className: cn(
-                          "mt-5 text-lg text-white/80 md:text-xl",
+                          "mt-5 text-lg text-background/80 md:text-xl",
                           descriptionClassName
                         ),
                         children: description
@@ -1073,7 +1073,7 @@ function HeroOverlayCtaGrid({
                       "div",
                       {
                         className: cn(
-                          "mt-5 text-lg text-white/80 md:text-xl",
+                          "mt-5 text-lg text-background/80 md:text-xl",
                           descriptionClassName
                         ),
                         children: description

package/dist/hero-overlay-cta-grid.js

@@ -937,7 +937,7 @@ function HeroOverlayCtaGrid({
   const renderBadge = useMemo(() => {
     if (badgeSlot) return badgeSlot;
     if (!badgeText) return null;
-    return /* @__PURE__ */ jsxs("div", { className: "inline-flex items-center gap-2 rounded-full border border-white/30 bg-white/15 px-6 py-2 text-sm font-semibold uppercase tracking-[0.2em]", children: [
+    return /* @__PURE__ */ jsxs("div", { className: "inline-flex items-center gap-2 rounded-full border border-background/30 bg-background/15 px-6 py-2 text-sm font-semibold uppercase tracking-[0.2em]", children: [
       badgeIcon ? /* @__PURE__ */ jsx(DynamicIcon, { name: badgeIcon, size: 18 }) : null,
       badgeText
     ] });
@@ -961,7 +961,7 @@ function HeroOverlayCtaGrid({
         children: [
           /* @__PURE__ */ jsx("div", { className: "relative flex h-12 w-12 flex-none items-center justify-center rounded-full bg-primary/10 text-primary transition-colors group-hover:bg-primary group-hover:text-primary-foreground", children: /* @__PURE__ */ jsx(DynamicIcon, { name: card.icon, size: 22 }) }),
           /* @__PURE__ */ jsxs("div", { className: "min-w-0", children: [
-            /* @__PURE__ */ jsx("p", { className: "text-base font-semibold text-foreground", children: card.label }),
+            /* @__PURE__ */ jsx("p", { className: "text-base font-semibold ", children: card.label }),
             /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: card.subtitle })
           ] }),
           /* @__PURE__ */ jsx(
@@ -1017,7 +1017,7 @@ function HeroOverlayCtaGrid({
                   initial: { opacity: 0, y: 28 },
                   animate: { opacity: 1, y: 0 },
                   transition: { duration: 0.6, ease: "easeOut" },
-                  className: "mx-auto max-w-3xl text-center text-balance text-white",
+                  className: "mx-auto max-w-3xl text-center text-balance text-background",
                   children: [
                     renderBadge,
                     heading && (typeof heading === "string" ? /* @__PURE__ */ jsx(
@@ -1043,7 +1043,7 @@ function HeroOverlayCtaGrid({
                       "p",
                       {
                         className: cn(
-                          "mt-5 text-lg text-white/80 md:text-xl",
+                          "mt-5 text-lg text-background/80 md:text-xl",
                           descriptionClassName
                         ),
                         children: description
@@ -1052,7 +1052,7 @@ function HeroOverlayCtaGrid({
                       "div",
                       {
                         className: cn(
-                          "mt-5 text-lg text-white/80 md:text-xl",
+                          "mt-5 text-lg text-background/80 md:text-xl",
                           descriptionClassName
                         ),
                         children: description

package/dist/hero-portfolio-creative.cjs

@@ -967,7 +967,7 @@ function HeroPortfolioCreative({
         }
       ) }),
       /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
-        profile.name && /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-lg font-semibold text-foreground", children: profile.name }),
+        profile.name && /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-lg font-semibold ", children: profile.name }),
         profile.title && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-muted-foreground", children: profile.title })
       ] })
     ] });
@@ -1000,7 +1000,7 @@ function HeroPortfolioCreative({
       Pressable,
       {
         href: link.href,
-        className: cn("text-muted-foreground hover:text-foreground", link.className),
+        className: cn("text-muted-foreground hover:", link.className),
         children: link.icon ?? (link.iconName && /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: link.iconName, size: 20 }))
       },
       index
@@ -1063,7 +1063,7 @@ function HeroPortfolioCreative({
       children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("container", containerClassName), children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "grid items-center gap-12 lg:grid-cols-2 lg:gap-20", children: [
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("flex flex-col gap-8", contentClassName), children: [
           renderProfile,
-          heading && (typeof heading === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h1", { className: cn("text-4xl font-bold tracking-tight text-foreground md:text-5xl lg:text-6xl", headingClassName), children: heading }) : /* @__PURE__ */ jsxRuntime.jsx("h1", { className: cn("text-4xl font-bold tracking-tight text-foreground md:text-5xl lg:text-6xl", headingClassName), children: heading })),
+          heading && (typeof heading === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h1", { className: cn("text-4xl font-bold tracking-tight md:text-5xl lg:text-6xl", headingClassName), children: heading }) : /* @__PURE__ */ jsxRuntime.jsx("h1", { className: cn("text-4xl font-bold tracking-tight md:text-5xl lg:text-6xl", headingClassName), children: heading })),
           description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("text-lg text-muted-foreground", descriptionClassName), children: description }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: descriptionClassName, children: description })),
           renderActions,
           renderSocialLinks

package/dist/hero-portfolio-creative.js

@@ -946,7 +946,7 @@ function HeroPortfolioCreative({
         }
       ) }),
       /* @__PURE__ */ jsxs("div", { children: [
-        profile.name && /* @__PURE__ */ jsx("h2", { className: "text-lg font-semibold text-foreground", children: profile.name }),
+        profile.name && /* @__PURE__ */ jsx("h2", { className: "text-lg font-semibold ", children: profile.name }),
         profile.title && /* @__PURE__ */ jsx("p", { className: "text-sm text-muted-foreground", children: profile.title })
       ] })
     ] });
@@ -979,7 +979,7 @@ function HeroPortfolioCreative({
       Pressable,
       {
         href: link.href,
-        className: cn("text-muted-foreground hover:text-foreground", link.className),
+        className: cn("text-muted-foreground hover:", link.className),
         children: link.icon ?? (link.iconName && /* @__PURE__ */ jsx(DynamicIcon, { name: link.iconName, size: 20 }))
       },
       index
@@ -1042,7 +1042,7 @@ function HeroPortfolioCreative({
       children: /* @__PURE__ */ jsx("div", { className: cn("container", containerClassName), children: /* @__PURE__ */ jsxs("div", { className: "grid items-center gap-12 lg:grid-cols-2 lg:gap-20", children: [
         /* @__PURE__ */ jsxs("div", { className: cn("flex flex-col gap-8", contentClassName), children: [
           renderProfile,
-          heading && (typeof heading === "string" ? /* @__PURE__ */ jsx("h1", { className: cn("text-4xl font-bold tracking-tight text-foreground md:text-5xl lg:text-6xl", headingClassName), children: heading }) : /* @__PURE__ */ jsx("h1", { className: cn("text-4xl font-bold tracking-tight text-foreground md:text-5xl lg:text-6xl", headingClassName), children: heading })),
+          heading && (typeof heading === "string" ? /* @__PURE__ */ jsx("h1", { className: cn("text-4xl font-bold tracking-tight md:text-5xl lg:text-6xl", headingClassName), children: heading }) : /* @__PURE__ */ jsx("h1", { className: cn("text-4xl font-bold tracking-tight md:text-5xl lg:text-6xl", headingClassName), children: heading })),
           description && (typeof description === "string" ? /* @__PURE__ */ jsx("p", { className: cn("text-lg text-muted-foreground", descriptionClassName), children: description }) : /* @__PURE__ */ jsx("div", { className: descriptionClassName, children: description })),
           renderActions,
           renderSocialLinks

package/dist/hero-premium-split-avatars.cjs

@@ -898,7 +898,7 @@ function HeroPremiumSplitAvatars({
 }) {
   const renderBrand = React.useMemo(() => {
     if (brandSlot) return brandSlot;
-    return /* @__PURE__ */ jsxRuntime.jsxs("h1", { className: "text-4xl text-foreground", children: [
+    return /* @__PURE__ */ jsxRuntime.jsxs("h1", { className: "text-4xl ", children: [
       brandName,
       " ",
       brandSuffix && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "bg-linear-to-tr from-foreground to-muted bg-clip-text text-transparent", children: brandSuffix })
@@ -922,7 +922,7 @@ function HeroPremiumSplitAvatars({
         /* @__PURE__ */ jsxRuntime.jsx(AvatarImage, { src: avatar.src }),
         /* @__PURE__ */ jsxRuntime.jsx(AvatarFallback, { children: avatar.fallback })
       ] }, index)) }),
-      socialProofText && (typeof socialProofText === "string" ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs text-foreground lg:text-sm", children: socialProofText }) : socialProofText)
+      socialProofText && (typeof socialProofText === "string" ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-xs lg:text-sm", children: socialProofText }) : socialProofText)
     ] });
   }, [avatarsSlot, avatars, socialProofText]);
   const renderImage = React.useMemo(() => {
@@ -950,8 +950,8 @@ function HeroPremiumSplitAvatars({
         /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex w-full items-center justify-center bg-background lg:w-1/2", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("container my-10 flex w-[500px] flex-col gap-24", contentClassName), children: [
           renderBrand,
           /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
-            heading && (typeof heading === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h2", { className: cn("text-4xl text-foreground lg:text-6xl", headingClassName), children: heading }) : /* @__PURE__ */ jsxRuntime.jsx("h2", { className: cn("text-4xl text-foreground lg:text-6xl", headingClassName), children: heading })),
-            description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("mt-2.5 text-foreground lg:text-xl", descriptionClassName), children: description }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: descriptionClassName, children: description })),
+            heading && (typeof heading === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h2", { className: cn("text-4xl lg:text-6xl", headingClassName), children: heading }) : /* @__PURE__ */ jsxRuntime.jsx("h2", { className: cn("text-4xl lg:text-6xl", headingClassName), children: heading })),
+            description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("mt-2.5 lg:text-xl", descriptionClassName), children: description }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: descriptionClassName, children: description })),
             renderAction
           ] }),
           renderAvatars

package/dist/hero-premium-split-avatars.js

@@ -876,7 +876,7 @@ function HeroPremiumSplitAvatars({
 }) {
   const renderBrand = useMemo(() => {
     if (brandSlot) return brandSlot;
-    return /* @__PURE__ */ jsxs("h1", { className: "text-4xl text-foreground", children: [
+    return /* @__PURE__ */ jsxs("h1", { className: "text-4xl ", children: [
       brandName,
       " ",
       brandSuffix && /* @__PURE__ */ jsx("span", { className: "bg-linear-to-tr from-foreground to-muted bg-clip-text text-transparent", children: brandSuffix })
@@ -900,7 +900,7 @@ function HeroPremiumSplitAvatars({
         /* @__PURE__ */ jsx(AvatarImage, { src: avatar.src }),
         /* @__PURE__ */ jsx(AvatarFallback, { children: avatar.fallback })
       ] }, index)) }),
-      socialProofText && (typeof socialProofText === "string" ? /* @__PURE__ */ jsx("span", { className: "text-xs text-foreground lg:text-sm", children: socialProofText }) : socialProofText)
+      socialProofText && (typeof socialProofText === "string" ? /* @__PURE__ */ jsx("span", { className: "text-xs lg:text-sm", children: socialProofText }) : socialProofText)
     ] });
   }, [avatarsSlot, avatars, socialProofText]);
   const renderImage = useMemo(() => {
@@ -928,8 +928,8 @@ function HeroPremiumSplitAvatars({
         /* @__PURE__ */ jsx("div", { className: "flex w-full items-center justify-center bg-background lg:w-1/2", children: /* @__PURE__ */ jsxs("div", { className: cn("container my-10 flex w-[500px] flex-col gap-24", contentClassName), children: [
           renderBrand,
           /* @__PURE__ */ jsxs("div", { children: [
-            heading && (typeof heading === "string" ? /* @__PURE__ */ jsx("h2", { className: cn("text-4xl text-foreground lg:text-6xl", headingClassName), children: heading }) : /* @__PURE__ */ jsx("h2", { className: cn("text-4xl text-foreground lg:text-6xl", headingClassName), children: heading })),
-            description && (typeof description === "string" ? /* @__PURE__ */ jsx("p", { className: cn("mt-2.5 text-foreground lg:text-xl", descriptionClassName), children: description }) : /* @__PURE__ */ jsx("div", { className: descriptionClassName, children: description })),
+            heading && (typeof heading === "string" ? /* @__PURE__ */ jsx("h2", { className: cn("text-4xl lg:text-6xl", headingClassName), children: heading }) : /* @__PURE__ */ jsx("h2", { className: cn("text-4xl lg:text-6xl", headingClassName), children: heading })),
+            description && (typeof description === "string" ? /* @__PURE__ */ jsx("p", { className: cn("mt-2.5 lg:text-xl", descriptionClassName), children: description }) : /* @__PURE__ */ jsx("div", { className: descriptionClassName, children: description })),
             renderAction
           ] }),
           renderAvatars

package/dist/hero-presentation-platform-video.cjs

@@ -865,7 +865,7 @@ function HeroPresentationPlatformVideo({
   }, [actionsSlot, actions]);
   const renderVideo = React.useMemo(() => {
     if (videoSlot) return videoSlot;
-    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("relative hidden h-[720px] w-[45%] overflow-hidden rounded-l-full bg-black lg:block", videoClassName), children: /* @__PURE__ */ jsxRuntime.jsx(
+    return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("relative hidden h-[720px] w-[45%] overflow-hidden rounded-l-full bg-foreground lg:block", videoClassName), children: /* @__PURE__ */ jsxRuntime.jsx(
       "video",
       {
         autoPlay: true,
@@ -888,9 +888,9 @@ function HeroPresentationPlatformVideo({
       ),
       children: [
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("flex flex-col gap-5 px-[10%] lg:w-[50%] lg:pr-0", contentClassName), children: [
-          subtitle && (typeof subtitle === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "font-light text-foreground uppercase", children: subtitle }) : subtitle),
-          heading && (typeof heading === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h1", { className: cn("text-5xl font-medium text-foreground md:text-6xl lg:text-7xl", headingClassName), children: heading }) : /* @__PURE__ */ jsxRuntime.jsx("h1", { className: cn("text-5xl font-medium text-foreground md:text-6xl lg:text-7xl", headingClassName), children: heading })),
-          description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("my-8 text-foreground md:text-xl", descriptionClassName), children: description }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: descriptionClassName, children: description })),
+          subtitle && (typeof subtitle === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "font-light uppercase", children: subtitle }) : subtitle),
+          heading && (typeof heading === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h1", { className: cn("text-5xl font-medium md:text-6xl lg:text-7xl", headingClassName), children: heading }) : /* @__PURE__ */ jsxRuntime.jsx("h1", { className: cn("text-5xl font-medium md:text-6xl lg:text-7xl", headingClassName), children: heading })),
+          description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("my-8 md:text-xl", descriptionClassName), children: description }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: descriptionClassName, children: description })),
           renderActions
         ] }),
         renderVideo

package/dist/hero-presentation-platform-video.js

@@ -844,7 +844,7 @@ function HeroPresentationPlatformVideo({
   }, [actionsSlot, actions]);
   const renderVideo = useMemo(() => {
     if (videoSlot) return videoSlot;
-    return /* @__PURE__ */ jsx("div", { className: cn("relative hidden h-[720px] w-[45%] overflow-hidden rounded-l-full bg-black lg:block", videoClassName), children: /* @__PURE__ */ jsx(
+    return /* @__PURE__ */ jsx("div", { className: cn("relative hidden h-[720px] w-[45%] overflow-hidden rounded-l-full bg-foreground lg:block", videoClassName), children: /* @__PURE__ */ jsx(
       "video",
       {
         autoPlay: true,
@@ -867,9 +867,9 @@ function HeroPresentationPlatformVideo({
       ),
       children: [
         /* @__PURE__ */ jsxs("div", { className: cn("flex flex-col gap-5 px-[10%] lg:w-[50%] lg:pr-0", contentClassName), children: [
-          subtitle && (typeof subtitle === "string" ? /* @__PURE__ */ jsx("p", { className: "font-light text-foreground uppercase", children: subtitle }) : subtitle),
-          heading && (typeof heading === "string" ? /* @__PURE__ */ jsx("h1", { className: cn("text-5xl font-medium text-foreground md:text-6xl lg:text-7xl", headingClassName), children: heading }) : /* @__PURE__ */ jsx("h1", { className: cn("text-5xl font-medium text-foreground md:text-6xl lg:text-7xl", headingClassName), children: heading })),
-          description && (typeof description === "string" ? /* @__PURE__ */ jsx("p", { className: cn("my-8 text-foreground md:text-xl", descriptionClassName), children: description }) : /* @__PURE__ */ jsx("div", { className: descriptionClassName, children: description })),
+          subtitle && (typeof subtitle === "string" ? /* @__PURE__ */ jsx("p", { className: "font-light uppercase", children: subtitle }) : subtitle),
+          heading && (typeof heading === "string" ? /* @__PURE__ */ jsx("h1", { className: cn("text-5xl font-medium md:text-6xl lg:text-7xl", headingClassName), children: heading }) : /* @__PURE__ */ jsx("h1", { className: cn("text-5xl font-medium md:text-6xl lg:text-7xl", headingClassName), children: heading })),
+          description && (typeof description === "string" ? /* @__PURE__ */ jsx("p", { className: cn("my-8 md:text-xl", descriptionClassName), children: description }) : /* @__PURE__ */ jsx("div", { className: descriptionClassName, children: description })),
           renderActions
         ] }),
         renderVideo

package/dist/hero-pricing-comparison.cjs

@@ -997,10 +997,10 @@ function HeroPricingComparison({
         ),
         children: [
           plan.isPopular && plan.popularBadge && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute -top-3 left-1/2 -translate-x-1/2", children: /* @__PURE__ */ jsxRuntime.jsx(Badge, { children: plan.popularBadge }) }),
-          /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-lg font-semibold text-foreground", children: plan.name }),
+          /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "text-lg font-semibold ", children: plan.name }),
           plan.description && /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-2 text-sm text-muted-foreground", children: plan.description }),
           /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-6", children: [
-            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-4xl font-bold text-foreground", children: plan.price }),
+            /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-4xl font-bold ", children: plan.price }),
             plan.pricePeriod && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-muted-foreground", children: plan.pricePeriod })
           ] }),
           plan.action && /* @__PURE__ */ jsxRuntime.jsx(
@@ -1033,7 +1033,7 @@ function HeroPricingComparison({
       children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("container", containerClassName), children: [
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("mx-auto max-w-4xl text-center", headerClassName), children: [
           renderBadge,
-          heading && (typeof heading === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h1", { className: cn("text-4xl font-bold tracking-tight text-foreground md:text-5xl lg:text-6xl", headingClassName), children: heading }) : /* @__PURE__ */ jsxRuntime.jsx("h1", { className: cn("text-4xl font-bold tracking-tight text-foreground md:text-5xl lg:text-6xl", headingClassName), children: heading })),
+          heading && (typeof heading === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h1", { className: cn("text-4xl font-bold tracking-tight md:text-5xl lg:text-6xl", headingClassName), children: heading }) : /* @__PURE__ */ jsxRuntime.jsx("h1", { className: cn("text-4xl font-bold tracking-tight md:text-5xl lg:text-6xl", headingClassName), children: heading })),
           description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("mt-6 text-lg text-muted-foreground md:text-xl", descriptionClassName), children: description }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: descriptionClassName, children: description }))
         ] }),
         renderPlans

package/dist/hero-pricing-comparison.js

@@ -976,10 +976,10 @@ function HeroPricingComparison({
         ),
         children: [
           plan.isPopular && plan.popularBadge && /* @__PURE__ */ jsx("div", { className: "absolute -top-3 left-1/2 -translate-x-1/2", children: /* @__PURE__ */ jsx(Badge, { children: plan.popularBadge }) }),
-          /* @__PURE__ */ jsx("h3", { className: "text-lg font-semibold text-foreground", children: plan.name }),
+          /* @__PURE__ */ jsx("h3", { className: "text-lg font-semibold ", children: plan.name }),
           plan.description && /* @__PURE__ */ jsx("p", { className: "mt-2 text-sm text-muted-foreground", children: plan.description }),
           /* @__PURE__ */ jsxs("div", { className: "mt-6", children: [
-            /* @__PURE__ */ jsx("span", { className: "text-4xl font-bold text-foreground", children: plan.price }),
+            /* @__PURE__ */ jsx("span", { className: "text-4xl font-bold ", children: plan.price }),
             plan.pricePeriod && /* @__PURE__ */ jsx("span", { className: "text-muted-foreground", children: plan.pricePeriod })
           ] }),
           plan.action && /* @__PURE__ */ jsx(
@@ -1012,7 +1012,7 @@ function HeroPricingComparison({
       children: /* @__PURE__ */ jsxs("div", { className: cn("container", containerClassName), children: [
         /* @__PURE__ */ jsxs("div", { className: cn("mx-auto max-w-4xl text-center", headerClassName), children: [
           renderBadge,
-          heading && (typeof heading === "string" ? /* @__PURE__ */ jsx("h1", { className: cn("text-4xl font-bold tracking-tight text-foreground md:text-5xl lg:text-6xl", headingClassName), children: heading }) : /* @__PURE__ */ jsx("h1", { className: cn("text-4xl font-bold tracking-tight text-foreground md:text-5xl lg:text-6xl", headingClassName), children: heading })),
+          heading && (typeof heading === "string" ? /* @__PURE__ */ jsx("h1", { className: cn("text-4xl font-bold tracking-tight md:text-5xl lg:text-6xl", headingClassName), children: heading }) : /* @__PURE__ */ jsx("h1", { className: cn("text-4xl font-bold tracking-tight md:text-5xl lg:text-6xl", headingClassName), children: heading })),
           description && (typeof description === "string" ? /* @__PURE__ */ jsx("p", { className: cn("mt-6 text-lg text-muted-foreground md:text-xl", descriptionClassName), children: description }) : /* @__PURE__ */ jsx("div", { className: descriptionClassName, children: description }))
         ] }),
         renderPlans