@opensite/ui 0.8.5 → 0.8.7

package/dist/process-expandable-timeline.cjs

@@ -610,7 +610,7 @@ function ProcessExpandableTimeline({
                   }
                 )
               ] }),
-              step.description && (typeof step.description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-1 text-foreground/50", children: step.description }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-1 text-foreground/50", children: step.description }))
+              step.description && (typeof step.description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mt-1 text-muted-foreground", children: step.description }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-1 text-muted-foreground", children: step.description }))
             ] })
           ]
         }
@@ -630,7 +630,7 @@ function ProcessExpandableTimeline({
                 "border-b bg-muted/20 py-6 pl-16 pr-6",
                 expandedContentClassName
               ),
-              children: typeof step.expandedContent === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-foreground/70", children: step.expandedContent }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-foreground/70", children: step.expandedContent })
+              children: typeof step.expandedContent === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-muted-foreground", children: step.expandedContent }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-muted-foreground", children: step.expandedContent })
             }
           )
         }
@@ -661,7 +661,7 @@ function ProcessExpandableTimeline({
             "p",
             {
               className: cn(
-                "text-lg text-foreground/50",
+                "text-lg text-muted-foreground",
                 descriptionClassName
               ),
               children: description

package/dist/process-expandable-timeline.js

@@ -589,7 +589,7 @@ function ProcessExpandableTimeline({
                   }
                 )
               ] }),
-              step.description && (typeof step.description === "string" ? /* @__PURE__ */ jsx("p", { className: "mt-1 text-foreground/50", children: step.description }) : /* @__PURE__ */ jsx("div", { className: "mt-1 text-foreground/50", children: step.description }))
+              step.description && (typeof step.description === "string" ? /* @__PURE__ */ jsx("p", { className: "mt-1 text-muted-foreground", children: step.description }) : /* @__PURE__ */ jsx("div", { className: "mt-1 text-muted-foreground", children: step.description }))
             ] })
           ]
         }
@@ -609,7 +609,7 @@ function ProcessExpandableTimeline({
                 "border-b bg-muted/20 py-6 pl-16 pr-6",
                 expandedContentClassName
               ),
-              children: typeof step.expandedContent === "string" ? /* @__PURE__ */ jsx("p", { className: "text-foreground/70", children: step.expandedContent }) : /* @__PURE__ */ jsx("div", { className: "text-foreground/70", children: step.expandedContent })
+              children: typeof step.expandedContent === "string" ? /* @__PURE__ */ jsx("p", { className: "text-muted-foreground", children: step.expandedContent }) : /* @__PURE__ */ jsx("div", { className: "text-muted-foreground", children: step.expandedContent })
             }
           )
         }
@@ -640,7 +640,7 @@ function ProcessExpandableTimeline({
             "p",
             {
               className: cn(
-                "text-lg text-foreground/50",
+                "text-lg text-muted-foreground",
                 descriptionClassName
               ),
               children: description

package/dist/process-hover-cards.cjs

@@ -453,7 +453,7 @@ var ProcessCard = ({
           /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex w-fit items-center justify-center font-mono text-sm tracking-tighter text-muted-foreground", children: step.step ?? `0${index + 1}` }),
           /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
             step.title && (typeof step.title === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "mb-2 text-2xl font-semibold tracking-tighter transition-colors group-hover:text-primary lg:text-3xl", children: step.title }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-2", children: step.title })),
-            step.description && (typeof step.description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "max-w-md text-foreground/50", children: step.description }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "max-w-md text-foreground/50", children: step.description }))
+            step.description && (typeof step.description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "max-w-md text-muted-foreground", children: step.description }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "max-w-md text-muted-foreground", children: step.description }))
           ] })
         ] }) })
       ]
@@ -521,7 +521,7 @@ function ProcessHoverCards({
             "p",
             {
               className: cn(
-                "text-lg text-foreground/50",
+                "text-lg text-muted-foreground",
                 descriptionClassName
               ),
               children: description

package/dist/process-hover-cards.js

@@ -432,7 +432,7 @@ var ProcessCard = ({
           /* @__PURE__ */ jsx("div", { className: "flex w-fit items-center justify-center font-mono text-sm tracking-tighter text-muted-foreground", children: step.step ?? `0${index + 1}` }),
           /* @__PURE__ */ jsxs("div", { children: [
             step.title && (typeof step.title === "string" ? /* @__PURE__ */ jsx("h3", { className: "mb-2 text-2xl font-semibold tracking-tighter transition-colors group-hover:text-primary lg:text-3xl", children: step.title }) : /* @__PURE__ */ jsx("div", { className: "mb-2", children: step.title })),
-            step.description && (typeof step.description === "string" ? /* @__PURE__ */ jsx("p", { className: "max-w-md text-foreground/50", children: step.description }) : /* @__PURE__ */ jsx("div", { className: "max-w-md text-foreground/50", children: step.description }))
+            step.description && (typeof step.description === "string" ? /* @__PURE__ */ jsx("p", { className: "max-w-md text-muted-foreground", children: step.description }) : /* @__PURE__ */ jsx("div", { className: "max-w-md text-muted-foreground", children: step.description }))
           ] })
         ] }) })
       ]
@@ -500,7 +500,7 @@ function ProcessHoverCards({
             "p",
             {
               className: cn(
-                "text-lg text-foreground/50",
+                "text-lg text-muted-foreground",
                 descriptionClassName
               ),
               children: description

package/dist/process-icon-timeline.cjs

@@ -548,7 +548,7 @@ function ProcessIconTimeline({
             "div",
             {
               className: cn(
-                "absolute left-0 flex size-12 items-center justify-center rounded-full text-white lg:left-1/2 lg:-translate-x-1/2",
+                "absolute left-0 flex size-12 items-center justify-center rounded-full text-primary-foreground lg:left-1/2 lg:-translate-x-1/2",
                 step.badgeColor || "bg-primary",
                 stepBadgeClassName
               ),
@@ -572,7 +572,7 @@ function ProcessIconTimeline({
                   ),
                   children: [
                     step.title && (typeof step.title === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "mb-2 text-xl font-semibold tracking-tight", children: step.title }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-2 text-xl font-semibold tracking-tight", children: step.title })),
-                    step.description && (typeof step.description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mb-4 text-foreground/50", children: step.description }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-4 text-foreground/50", children: step.description })),
+                    step.description && (typeof step.description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mb-4 text-muted-foreground", children: step.description }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-4 text-muted-foreground", children: step.description })),
                     step.highlights?.length ? /* @__PURE__ */ jsxRuntime.jsx(
                       "div",
                       {
@@ -625,7 +625,7 @@ function ProcessIconTimeline({
             "p",
             {
               className: cn(
-                "text-lg text-foreground/50",
+                "text-lg text-muted-foreground",
                 descriptionClassName
               ),
               children: description

package/dist/process-icon-timeline.js

@@ -527,7 +527,7 @@ function ProcessIconTimeline({
             "div",
             {
               className: cn(
-                "absolute left-0 flex size-12 items-center justify-center rounded-full text-white lg:left-1/2 lg:-translate-x-1/2",
+                "absolute left-0 flex size-12 items-center justify-center rounded-full text-primary-foreground lg:left-1/2 lg:-translate-x-1/2",
                 step.badgeColor || "bg-primary",
                 stepBadgeClassName
               ),
@@ -551,7 +551,7 @@ function ProcessIconTimeline({
                   ),
                   children: [
                     step.title && (typeof step.title === "string" ? /* @__PURE__ */ jsx("h3", { className: "mb-2 text-xl font-semibold tracking-tight", children: step.title }) : /* @__PURE__ */ jsx("div", { className: "mb-2 text-xl font-semibold tracking-tight", children: step.title })),
-                    step.description && (typeof step.description === "string" ? /* @__PURE__ */ jsx("p", { className: "mb-4 text-foreground/50", children: step.description }) : /* @__PURE__ */ jsx("div", { className: "mb-4 text-foreground/50", children: step.description })),
+                    step.description && (typeof step.description === "string" ? /* @__PURE__ */ jsx("p", { className: "mb-4 text-muted-foreground", children: step.description }) : /* @__PURE__ */ jsx("div", { className: "mb-4 text-muted-foreground", children: step.description })),
                     step.highlights?.length ? /* @__PURE__ */ jsx(
                       "div",
                       {
@@ -604,7 +604,7 @@ function ProcessIconTimeline({
             "p",
             {
               className: cn(
-                "text-lg text-foreground/50",
+                "text-lg text-muted-foreground",
                 descriptionClassName
               ),
               children: description

package/dist/process-mission-principles.cjs

@@ -446,7 +446,7 @@ function ProcessMissionPrinciples({
               ),
               /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "pt-4", children: [
                 principle.title && (typeof principle.title === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "mb-3 text-xl font-semibold tracking-tight", children: principle.title }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-3 text-xl font-semibold tracking-tight", children: principle.title })),
-                principle.description && (typeof principle.description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-foreground/50 leading-relaxed", children: principle.description }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-foreground/50 leading-relaxed", children: principle.description }))
+                principle.description && (typeof principle.description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-muted-foreground leading-relaxed", children: principle.description }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-muted-foreground leading-relaxed", children: principle.description }))
               ] })
             ]
           },
@@ -489,7 +489,7 @@ function ProcessMissionPrinciples({
             "p",
             {
               className: cn(
-                "text-lg text-foreground/50 leading-relaxed",
+                "text-lg text-muted-foreground leading-relaxed",
                 missionDescriptionClassName
               ),
               children: missionDescription

package/dist/process-mission-principles.js

@@ -440,7 +440,7 @@ function ProcessMissionPrinciples({
               ),
               /* @__PURE__ */ jsxs("div", { className: "pt-4", children: [
                 principle.title && (typeof principle.title === "string" ? /* @__PURE__ */ jsx("h3", { className: "mb-3 text-xl font-semibold tracking-tight", children: principle.title }) : /* @__PURE__ */ jsx("div", { className: "mb-3 text-xl font-semibold tracking-tight", children: principle.title })),
-                principle.description && (typeof principle.description === "string" ? /* @__PURE__ */ jsx("p", { className: "text-foreground/50 leading-relaxed", children: principle.description }) : /* @__PURE__ */ jsx("div", { className: "text-foreground/50 leading-relaxed", children: principle.description }))
+                principle.description && (typeof principle.description === "string" ? /* @__PURE__ */ jsx("p", { className: "text-muted-foreground leading-relaxed", children: principle.description }) : /* @__PURE__ */ jsx("div", { className: "text-muted-foreground leading-relaxed", children: principle.description }))
               ] })
             ]
           },
@@ -483,7 +483,7 @@ function ProcessMissionPrinciples({
             "p",
             {
               className: cn(
-                "text-lg text-foreground/50 leading-relaxed",
+                "text-lg text-muted-foreground leading-relaxed",
                 missionDescriptionClassName
               ),
               children: missionDescription

package/dist/process-numbered-services.cjs

@@ -1010,7 +1010,7 @@ function ProcessNumberedServices({
           ) }),
           /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "lg:col-span-4", children: [
             service.title && (typeof service.title === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "mb-3 text-2xl font-semibold tracking-tight", children: service.title }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-3 text-2xl font-semibold tracking-tight", children: service.title })),
-            service.description && (typeof service.description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-foreground/50 leading-relaxed", children: service.description }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-foreground/50 leading-relaxed", children: service.description })),
+            service.description && (typeof service.description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-muted-foreground leading-relaxed", children: service.description }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-muted-foreground leading-relaxed", children: service.description })),
             renderServiceAction(service)
           ] }),
           /* @__PURE__ */ jsxRuntime.jsx("div", { className: "lg:col-span-7", children: service.capabilities?.length ? /* @__PURE__ */ jsxRuntime.jsx(
@@ -1069,7 +1069,7 @@ function ProcessNumberedServices({
             "p",
             {
               className: cn(
-                "text-lg text-foreground/50",
+                "text-lg text-muted-foreground",
                 descriptionClassName
               ),
               children: description

package/dist/process-numbered-services.js

@@ -989,7 +989,7 @@ function ProcessNumberedServices({
           ) }),
           /* @__PURE__ */ jsxs("div", { className: "lg:col-span-4", children: [
             service.title && (typeof service.title === "string" ? /* @__PURE__ */ jsx("h3", { className: "mb-3 text-2xl font-semibold tracking-tight", children: service.title }) : /* @__PURE__ */ jsx("div", { className: "mb-3 text-2xl font-semibold tracking-tight", children: service.title })),
-            service.description && (typeof service.description === "string" ? /* @__PURE__ */ jsx("p", { className: "text-foreground/50 leading-relaxed", children: service.description }) : /* @__PURE__ */ jsx("div", { className: "text-foreground/50 leading-relaxed", children: service.description })),
+            service.description && (typeof service.description === "string" ? /* @__PURE__ */ jsx("p", { className: "text-muted-foreground leading-relaxed", children: service.description }) : /* @__PURE__ */ jsx("div", { className: "text-muted-foreground leading-relaxed", children: service.description })),
             renderServiceAction(service)
           ] }),
           /* @__PURE__ */ jsx("div", { className: "lg:col-span-7", children: service.capabilities?.length ? /* @__PURE__ */ jsx(
@@ -1048,7 +1048,7 @@ function ProcessNumberedServices({
             "p",
             {
               className: cn(
-                "text-lg text-foreground/50",
+                "text-lg text-muted-foreground",
                 descriptionClassName
               ),
               children: description

package/dist/process-roadmap-timeline.cjs

@@ -517,17 +517,17 @@ var StatusBadge = ({
   const config = {
     completed: {
       label: "Completed",
-      badgeClassName: "bg-success/10 text-success dark:bg-success/10 dark:text-success",
+      badgeClassName: "bg-success/10 text-success",
       icon: "lucide/check-circle-2"
     },
     "in-progress": {
       label: "In Progress",
-      badgeClassName: "bg-primary/10 text-primary dark:bg-primary/10 dark:text-primary",
+      badgeClassName: "bg-primary/10 text-primary",
       icon: "lucide/loader-2"
     },
     upcoming: {
       label: "Upcoming",
-      badgeClassName: "bg-gray-100 text-gray-700 dark:bg-gray-800 dark:text-gray-400",
+      badgeClassName: "bg-muted text-muted-foreground",
       icon: "lucide/clock"
     }
   };
@@ -611,7 +611,7 @@ function ProcessRoadmapTimeline({
                       }
                     ),
                     milestone.title && (typeof milestone.title === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "mb-2 text-xl font-semibold tracking-tight", children: milestone.title }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-2 text-xl font-semibold tracking-tight", children: milestone.title })),
-                    milestone.description && (typeof milestone.description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mb-4 text-foreground/50", children: milestone.description }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-4 text-foreground/50", children: milestone.description })),
+                    milestone.description && (typeof milestone.description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mb-4 text-muted-foreground", children: milestone.description }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-4 text-muted-foreground", children: milestone.description })),
                     milestone.features?.length ? /* @__PURE__ */ jsxRuntime.jsx(
                       "div",
                       {
@@ -639,7 +639,7 @@ function ProcessRoadmapTimeline({
             {
               className: cn(
                 "absolute left-1/2 flex size-10 -translate-x-1/2 items-center justify-center rounded-full border-2 bg-background",
-                milestone.status === "completed" ? "border-success bg-success text-white" : milestone.status === "in-progress" ? "border-primary bg-primary text-primary-foreground" : "border-border text-muted-foreground",
+                milestone.status === "completed" ? "border-success bg-success text-background" : milestone.status === "in-progress" ? "border-primary bg-primary text-primary-foreground" : "border-border text-muted-foreground",
                 milestoneNodeClassName
               ),
               children: milestone.status === "completed" ? /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/check", size: 20 }) : /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-sm font-semibold", children: index + 1 })
@@ -675,7 +675,7 @@ function ProcessRoadmapTimeline({
             "p",
             {
               className: cn(
-                "mx-auto max-w-2xl text-lg text-foreground/50",
+                "mx-auto max-w-2xl text-lg text-muted-foreground",
                 descriptionClassName
               ),
               children: description

package/dist/process-roadmap-timeline.js

@@ -496,17 +496,17 @@ var StatusBadge = ({
   const config = {
     completed: {
       label: "Completed",
-      badgeClassName: "bg-success/10 text-success dark:bg-success/10 dark:text-success",
+      badgeClassName: "bg-success/10 text-success",
       icon: "lucide/check-circle-2"
     },
     "in-progress": {
       label: "In Progress",
-      badgeClassName: "bg-primary/10 text-primary dark:bg-primary/10 dark:text-primary",
+      badgeClassName: "bg-primary/10 text-primary",
       icon: "lucide/loader-2"
     },
     upcoming: {
       label: "Upcoming",
-      badgeClassName: "bg-gray-100 text-gray-700 dark:bg-gray-800 dark:text-gray-400",
+      badgeClassName: "bg-muted text-muted-foreground",
       icon: "lucide/clock"
     }
   };
@@ -590,7 +590,7 @@ function ProcessRoadmapTimeline({
                       }
                     ),
                     milestone.title && (typeof milestone.title === "string" ? /* @__PURE__ */ jsx("h3", { className: "mb-2 text-xl font-semibold tracking-tight", children: milestone.title }) : /* @__PURE__ */ jsx("div", { className: "mb-2 text-xl font-semibold tracking-tight", children: milestone.title })),
-                    milestone.description && (typeof milestone.description === "string" ? /* @__PURE__ */ jsx("p", { className: "mb-4 text-foreground/50", children: milestone.description }) : /* @__PURE__ */ jsx("div", { className: "mb-4 text-foreground/50", children: milestone.description })),
+                    milestone.description && (typeof milestone.description === "string" ? /* @__PURE__ */ jsx("p", { className: "mb-4 text-muted-foreground", children: milestone.description }) : /* @__PURE__ */ jsx("div", { className: "mb-4 text-muted-foreground", children: milestone.description })),
                     milestone.features?.length ? /* @__PURE__ */ jsx(
                       "div",
                       {
@@ -618,7 +618,7 @@ function ProcessRoadmapTimeline({
             {
               className: cn(
                 "absolute left-1/2 flex size-10 -translate-x-1/2 items-center justify-center rounded-full border-2 bg-background",
-                milestone.status === "completed" ? "border-success bg-success text-white" : milestone.status === "in-progress" ? "border-primary bg-primary text-primary-foreground" : "border-border text-muted-foreground",
+                milestone.status === "completed" ? "border-success bg-success text-background" : milestone.status === "in-progress" ? "border-primary bg-primary text-primary-foreground" : "border-border text-muted-foreground",
                 milestoneNodeClassName
               ),
               children: milestone.status === "completed" ? /* @__PURE__ */ jsx(DynamicIcon, { name: "lucide/check", size: 20 }) : /* @__PURE__ */ jsx("span", { className: "text-sm font-semibold", children: index + 1 })
@@ -654,7 +654,7 @@ function ProcessRoadmapTimeline({
             "p",
             {
               className: cn(
-                "mx-auto max-w-2xl text-lg text-foreground/50",
+                "mx-auto max-w-2xl text-lg text-muted-foreground",
                 descriptionClassName
               ),
               children: description

package/dist/process-scroll-image.cjs

@@ -969,7 +969,7 @@ var ProcessCard = ({
         /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex w-fit items-center justify-center px-4 py-1 text-9xl tracking-tighter", children: step.step ?? `0${index + 1}` }),
         /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
           step.title && (typeof step.title === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "mb-4 text-2xl font-semibold tracking-tighter lg:text-3xl", children: step.title }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-4", children: step.title })),
-          step.description && (typeof step.description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-foreground/50", children: step.description }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-foreground/50", children: step.description }))
+          step.description && (typeof step.description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-muted-foreground", children: step.description }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-muted-foreground", children: step.description }))
         ] })
       ]
     }
@@ -1109,7 +1109,7 @@ function ProcessScrollImage({
                     "p",
                     {
                       className: cn(
-                        "text-base text-foreground/50",
+                        "text-base text-muted-foreground",
                         descriptionClassName
                       ),
                       children: description

package/dist/process-scroll-image.js

@@ -948,7 +948,7 @@ var ProcessCard = ({
         /* @__PURE__ */ jsx("div", { className: "flex w-fit items-center justify-center px-4 py-1 text-9xl tracking-tighter", children: step.step ?? `0${index + 1}` }),
         /* @__PURE__ */ jsxs("div", { children: [
           step.title && (typeof step.title === "string" ? /* @__PURE__ */ jsx("h3", { className: "mb-4 text-2xl font-semibold tracking-tighter lg:text-3xl", children: step.title }) : /* @__PURE__ */ jsx("div", { className: "mb-4", children: step.title })),
-          step.description && (typeof step.description === "string" ? /* @__PURE__ */ jsx("p", { className: "text-foreground/50", children: step.description }) : /* @__PURE__ */ jsx("div", { className: "text-foreground/50", children: step.description }))
+          step.description && (typeof step.description === "string" ? /* @__PURE__ */ jsx("p", { className: "text-muted-foreground", children: step.description }) : /* @__PURE__ */ jsx("div", { className: "text-muted-foreground", children: step.description }))
         ] })
       ]
     }
@@ -1088,7 +1088,7 @@ function ProcessScrollImage({
                     "p",
                     {
                       className: cn(
-                        "text-base text-foreground/50",
+                        "text-base text-muted-foreground",
                         descriptionClassName
                       ),
                       children: description

package/dist/process-steps-grid.cjs

@@ -563,7 +563,7 @@ function ProcessStepsGrid({
                   }
                 ),
                 step.title && (typeof step.title === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "mb-3 text-xl font-semibold tracking-tight", children: step.title }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-3 text-xl font-semibold tracking-tight", children: step.title })),
-                step.description && (typeof step.description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-foreground/50 leading-relaxed", children: step.description }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-foreground/50 leading-relaxed", children: step.description }))
+                step.description && (typeof step.description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-muted-foreground leading-relaxed", children: step.description }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-muted-foreground leading-relaxed", children: step.description }))
               ] })
             ]
           },
@@ -596,7 +596,7 @@ function ProcessStepsGrid({
             "p",
             {
               className: cn(
-                "mx-auto max-w-2xl text-lg text-foreground/50",
+                "mx-auto max-w-2xl text-lg text-muted-foreground",
                 descriptionClassName
               ),
               children: description

package/dist/process-steps-grid.js

@@ -542,7 +542,7 @@ function ProcessStepsGrid({
                   }
                 ),
                 step.title && (typeof step.title === "string" ? /* @__PURE__ */ jsx("h3", { className: "mb-3 text-xl font-semibold tracking-tight", children: step.title }) : /* @__PURE__ */ jsx("div", { className: "mb-3 text-xl font-semibold tracking-tight", children: step.title })),
-                step.description && (typeof step.description === "string" ? /* @__PURE__ */ jsx("p", { className: "text-foreground/50 leading-relaxed", children: step.description }) : /* @__PURE__ */ jsx("div", { className: "text-foreground/50 leading-relaxed", children: step.description }))
+                step.description && (typeof step.description === "string" ? /* @__PURE__ */ jsx("p", { className: "text-muted-foreground leading-relaxed", children: step.description }) : /* @__PURE__ */ jsx("div", { className: "text-muted-foreground leading-relaxed", children: step.description }))
               ] })
             ]
           },
@@ -575,7 +575,7 @@ function ProcessStepsGrid({
             "p",
             {
               className: cn(
-                "mx-auto max-w-2xl text-lg text-foreground/50",
+                "mx-auto max-w-2xl text-lg text-muted-foreground",
                 descriptionClassName
               ),
               children: description

package/dist/process-sticky-steps.cjs

@@ -1054,7 +1054,7 @@ function ProcessStickySteps({
           /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex size-12 items-center justify-center bg-muted px-4 py-1 tracking-tighter", children: step.step ?? `0${index + 1}` }),
           /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
             step.title && (typeof step.title === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "mb-4 text-2xl font-semibold tracking-tighter lg:text-3xl", children: step.title }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mb-4", children: step.title })),
-            step.description && (typeof step.description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-foreground/50", children: step.description }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-foreground/50", children: step.description }))
+            step.description && (typeof step.description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-muted-foreground", children: step.description }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-muted-foreground", children: step.description }))
           ] })
         ]
       },
@@ -1093,7 +1093,7 @@ function ProcessStickySteps({
                 "p",
                 {
                   className: cn(
-                    "text-base text-foreground/50",
+                    "text-base text-muted-foreground",
                     descriptionClassName
                   ),
                   children: description

package/dist/process-sticky-steps.js

@@ -1033,7 +1033,7 @@ function ProcessStickySteps({
           /* @__PURE__ */ jsx("div", { className: "flex size-12 items-center justify-center bg-muted px-4 py-1 tracking-tighter", children: step.step ?? `0${index + 1}` }),
           /* @__PURE__ */ jsxs("div", { children: [
             step.title && (typeof step.title === "string" ? /* @__PURE__ */ jsx("h3", { className: "mb-4 text-2xl font-semibold tracking-tighter lg:text-3xl", children: step.title }) : /* @__PURE__ */ jsx("div", { className: "mb-4", children: step.title })),
-            step.description && (typeof step.description === "string" ? /* @__PURE__ */ jsx("p", { className: "text-foreground/50", children: step.description }) : /* @__PURE__ */ jsx("div", { className: "text-foreground/50", children: step.description }))
+            step.description && (typeof step.description === "string" ? /* @__PURE__ */ jsx("p", { className: "text-muted-foreground", children: step.description }) : /* @__PURE__ */ jsx("div", { className: "text-muted-foreground", children: step.description }))
           ] })
         ]
       },
@@ -1072,7 +1072,7 @@ function ProcessStickySteps({
                 "p",
                 {
                   className: cn(
-                    "text-base text-foreground/50",
+                    "text-base text-muted-foreground",
                     descriptionClassName
                   ),
                   children: description

package/dist/project-alternating-motion.cjs

@@ -461,7 +461,7 @@ function ProjectAlternatingMotion({
           /* @__PURE__ */ jsxRuntime.jsxs("div", { className: cn("flex flex-col justify-between", contentClassName), children: [
             /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "mb-2 text-lg font-medium sm:text-4xl", children: project.title }),
             /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
-              /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mb-3 max-w-sm text-sm font-medium text-foreground", children: project.description }),
+              /* @__PURE__ */ jsxRuntime.jsx("p", { className: "mb-3 max-w-sm text-sm font-medium", children: project.description }),
               /* @__PURE__ */ jsxRuntime.jsx(Badge, { variant: "outline", className: "px-3 py-2", children: project.tag })
             ] })
           ] }),

package/dist/project-alternating-motion.js

@@ -455,7 +455,7 @@ function ProjectAlternatingMotion({
           /* @__PURE__ */ jsxs("div", { className: cn("flex flex-col justify-between", contentClassName), children: [
             /* @__PURE__ */ jsx("h3", { className: "mb-2 text-lg font-medium sm:text-4xl", children: project.title }),
             /* @__PURE__ */ jsxs("div", { children: [
-              /* @__PURE__ */ jsx("p", { className: "mb-3 max-w-sm text-sm font-medium text-foreground", children: project.description }),
+              /* @__PURE__ */ jsx("p", { className: "mb-3 max-w-sm text-sm font-medium", children: project.description }),
               /* @__PURE__ */ jsx(Badge, { variant: "outline", className: "px-3 py-2", children: project.tag })
             ] })
           ] }),

package/dist/project-background-reveal.cjs

@@ -965,7 +965,7 @@ function ProjectBackgroundReveal({
           backgroundImage: `url(${project.image})`
         },
         children: [
-          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative z-10 flex flex-col gap-7 text-white/80 transition-colors duration-300 ease-out group-hover:text-white lg:flex-row", children: [
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative z-10 flex flex-col gap-7 text-background/80 transition-colors duration-300 ease-out group-hover:text-background lg:flex-row", children: [
             /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-1 text-2xl font-bold", children: [
               /* @__PURE__ */ jsxRuntime.jsx("span", { children: "/" }),
               /* @__PURE__ */ jsxRuntime.jsx("span", { children: String(idx + 1).padStart(2, "0") })
@@ -990,7 +990,7 @@ function ProjectBackgroundReveal({
               ) }) })
             ] }) })
           ] }),
-          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute inset-0 z-0 bg-black/80 backdrop-blur-sm transition-all duration-300 ease-out group-hover:bg-black/50 group-hover:backdrop-blur-none" })
+          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute inset-0 z-0 bg-foreground/80 backdrop-blur-sm transition-all duration-300 ease-out group-hover:bg-foreground/50 group-hover:backdrop-blur-none" })
         ]
       },
       idx

package/dist/project-background-reveal.js

@@ -944,7 +944,7 @@ function ProjectBackgroundReveal({
           backgroundImage: `url(${project.image})`
         },
         children: [
-          /* @__PURE__ */ jsxs("div", { className: "relative z-10 flex flex-col gap-7 text-white/80 transition-colors duration-300 ease-out group-hover:text-white lg:flex-row", children: [
+          /* @__PURE__ */ jsxs("div", { className: "relative z-10 flex flex-col gap-7 text-background/80 transition-colors duration-300 ease-out group-hover:text-background lg:flex-row", children: [
             /* @__PURE__ */ jsxs("div", { className: "flex gap-1 text-2xl font-bold", children: [
               /* @__PURE__ */ jsx("span", { children: "/" }),
               /* @__PURE__ */ jsx("span", { children: String(idx + 1).padStart(2, "0") })
@@ -969,7 +969,7 @@ function ProjectBackgroundReveal({
               ) }) })
             ] }) })
           ] }),
-          /* @__PURE__ */ jsx("div", { className: "absolute inset-0 z-0 bg-black/80 backdrop-blur-sm transition-all duration-300 ease-out group-hover:bg-black/50 group-hover:backdrop-blur-none" })
+          /* @__PURE__ */ jsx("div", { className: "absolute inset-0 z-0 bg-foreground/80 backdrop-blur-sm transition-all duration-300 ease-out group-hover:bg-foreground/50 group-hover:backdrop-blur-none" })
         ]
       },
       idx

package/dist/project-card-overlay.cjs

@@ -544,7 +544,7 @@ var ProjectCard = ({
       whileHover: { scale: 1.02 },
       whileTap: { scale: 0.98 },
       className: cn(
-        "group relative cursor-pointer overflow-hidden rounded-3xl bg-black shadow-2xl",
+        "group relative cursor-pointer overflow-hidden rounded-3xl bg-foreground shadow-2xl",
         className
       ),
       children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "relative aspect-square overflow-hidden", children: [
@@ -557,19 +557,19 @@ var ProjectCard = ({
             optixFlowConfig
           }
         ),
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute inset-0 bg-linear-to-t from-black/80 via-black/20 to-transparent" }),
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute top-4 left-4", children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "inline-block rounded-full border border-white/20 bg-black/50 px-3 py-1.5 text-xs font-semibold text-white backdrop-blur-sm", children: project.category }) }),
-        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute top-4 right-4 translate-x-2 transform opacity-0 transition-all duration-300 group-hover:translate-x-0 group-hover:opacity-100", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex h-8 w-8 items-center justify-center rounded-full border border-white/30 bg-white/20 backdrop-blur-sm", children: /* @__PURE__ */ jsxRuntime.jsx(
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute inset-0 bg-linear-to-t from-foreground/80 via-foreground/20 to-transparent" }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute top-4 left-4", children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "inline-block rounded-full border border-border/20 bg-foreground/50 px-3 py-1.5 text-xs font-semibold text-background backdrop-blur-sm", children: project.category }) }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "absolute top-4 right-4 translate-x-2 transform opacity-0 transition-all duration-300 group-hover:translate-x-0 group-hover:opacity-100", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex h-8 w-8 items-center justify-center rounded-full border border-border/30 bg-card/20 backdrop-blur-sm", children: /* @__PURE__ */ jsxRuntime.jsx(
           DynamicIcon,
           {
             name: "lucide/arrow-up-right",
             size: 16,
-            className: "text-white"
+            className: "text-background"
           }
         ) }) }),
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "absolute right-4 bottom-4 left-4", children: [
-          /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "mb-1 text-2xl font-bold tracking-tight text-white md:text-3xl", children: project.title }),
-          /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-white/70 opacity-0 transition-opacity duration-300 group-hover:opacity-100", children: project.description })
+          /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "mb-1 text-2xl font-bold tracking-tight text-background md:text-3xl", children: project.title }),
+          /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-background/70 opacity-0 transition-opacity duration-300 group-hover:opacity-100", children: project.description })
         ] })
       ] })
     }

package/dist/project-card-overlay.js

@@ -523,7 +523,7 @@ var ProjectCard = ({
       whileHover: { scale: 1.02 },
       whileTap: { scale: 0.98 },
       className: cn(
-        "group relative cursor-pointer overflow-hidden rounded-3xl bg-black shadow-2xl",
+        "group relative cursor-pointer overflow-hidden rounded-3xl bg-foreground shadow-2xl",
         className
       ),
       children: /* @__PURE__ */ jsxs("div", { className: "relative aspect-square overflow-hidden", children: [
@@ -536,19 +536,19 @@ var ProjectCard = ({
             optixFlowConfig
           }
         ),
-        /* @__PURE__ */ jsx("div", { className: "absolute inset-0 bg-linear-to-t from-black/80 via-black/20 to-transparent" }),
-        /* @__PURE__ */ jsx("div", { className: "absolute top-4 left-4", children: /* @__PURE__ */ jsx("span", { className: "inline-block rounded-full border border-white/20 bg-black/50 px-3 py-1.5 text-xs font-semibold text-white backdrop-blur-sm", children: project.category }) }),
-        /* @__PURE__ */ jsx("div", { className: "absolute top-4 right-4 translate-x-2 transform opacity-0 transition-all duration-300 group-hover:translate-x-0 group-hover:opacity-100", children: /* @__PURE__ */ jsx("div", { className: "flex h-8 w-8 items-center justify-center rounded-full border border-white/30 bg-white/20 backdrop-blur-sm", children: /* @__PURE__ */ jsx(
+        /* @__PURE__ */ jsx("div", { className: "absolute inset-0 bg-linear-to-t from-foreground/80 via-foreground/20 to-transparent" }),
+        /* @__PURE__ */ jsx("div", { className: "absolute top-4 left-4", children: /* @__PURE__ */ jsx("span", { className: "inline-block rounded-full border border-border/20 bg-foreground/50 px-3 py-1.5 text-xs font-semibold text-background backdrop-blur-sm", children: project.category }) }),
+        /* @__PURE__ */ jsx("div", { className: "absolute top-4 right-4 translate-x-2 transform opacity-0 transition-all duration-300 group-hover:translate-x-0 group-hover:opacity-100", children: /* @__PURE__ */ jsx("div", { className: "flex h-8 w-8 items-center justify-center rounded-full border border-border/30 bg-card/20 backdrop-blur-sm", children: /* @__PURE__ */ jsx(
           DynamicIcon,
           {
             name: "lucide/arrow-up-right",
             size: 16,
-            className: "text-white"
+            className: "text-background"
           }
         ) }) }),
         /* @__PURE__ */ jsxs("div", { className: "absolute right-4 bottom-4 left-4", children: [
-          /* @__PURE__ */ jsx("h3", { className: "mb-1 text-2xl font-bold tracking-tight text-white md:text-3xl", children: project.title }),
-          /* @__PURE__ */ jsx("p", { className: "text-sm text-white/70 opacity-0 transition-opacity duration-300 group-hover:opacity-100", children: project.description })
+          /* @__PURE__ */ jsx("h3", { className: "mb-1 text-2xl font-bold tracking-tight text-background md:text-3xl", children: project.title }),
+          /* @__PURE__ */ jsx("p", { className: "text-sm text-background/70 opacity-0 transition-opacity duration-300 group-hover:opacity-100", children: project.description })
         ] })
       ] })
     }

package/dist/project-carousel-cinematic.cjs

@@ -1172,7 +1172,7 @@ function ProjectCarouselCinematic({
                 variant: "outline",
                 onClick: () => carouselApi?.scrollPrev(),
                 disabled: !canScrollPrev,
-                className: "pointer-events-auto ml-4 h-12 w-12 rounded-full border-gray-200 bg-white/90 hover:bg-white",
+                className: "pointer-events-auto ml-4 h-12 w-12 rounded-full border-border bg-card/90 hover:bg-card",
                 children: /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/arrow-left", size: 20 })
               }
             ),
@@ -1183,7 +1183,7 @@ function ProjectCarouselCinematic({
                 variant: "outline",
                 onClick: () => carouselApi?.scrollNext(),
                 disabled: !canScrollNext,
-                className: "pointer-events-auto mr-4 h-12 w-12 rounded-full border-gray-200 bg-white/90 hover:bg-white",
+                className: "pointer-events-auto mr-4 h-12 w-12 rounded-full border-border bg-card/90 hover:bg-card",
                 children: /* @__PURE__ */ jsxRuntime.jsx(DynamicIcon, { name: "lucide/arrow-right", size: 20 })
               }
             )