@opensite/ui 2.4.8 → 2.5.0

package/dist/about-network-spotlight.js

@@ -745,7 +745,8 @@ var spacingStyles = {
   sm: "py-12 md:py-16",
   md: "py-16 md:py-24",
   lg: "py-20 md:py-32",
-  xl: "py-24 md:py-40"
+  xl: "py-24 md:py-40",
+  hero: "pt-32 pb-12 md:pt-40 md:pb-40"
 };
 var predefinedSpacings = ["none", "sm", "md", "lg", "xl"];
 var isPredefinedSpacing = (spacing) => predefinedSpacings.includes(spacing);

package/dist/about-split-hero.d.cts

@@ -1,8 +1,8 @@
-export { A as AboutSplitHero, l as AboutSplitHeroProps, D as DirectionConfig } from './community-initiatives-DcLp6ycJ.cjs';
+export { A as AboutSplitHero, l as AboutSplitHeroProps, D as DirectionConfig } from './community-initiatives-B658AD6n.cjs';
 import 'react';
 import 'react/jsx-runtime';
-import './blocks-C1EhIN1e.cjs';
+import './blocks-DUr75v0S.cjs';
 import 'class-variance-authority';
-import './button-variants-8mtEHxev.cjs';
+import './button-variants-lRElsmTc.cjs';
 import 'class-variance-authority/types';
 import '@opensite/hooks/usePlatformFromUrl';

package/dist/about-split-hero.d.ts

@@ -1,8 +1,8 @@
-export { A as AboutSplitHero, l as AboutSplitHeroProps, D as DirectionConfig } from './community-initiatives-C2nDtDDs.js';
+export { A as AboutSplitHero, l as AboutSplitHeroProps, D as DirectionConfig } from './community-initiatives-BphRfrhZ.js';
 import 'react';
 import 'react/jsx-runtime';
-import './blocks-Y0T7PIol.js';
+import './blocks-BzFuQGP0.js';
 import 'class-variance-authority';
-import './button-variants-8mtEHxev.js';
+import './button-variants-lRElsmTc.js';
 import 'class-variance-authority/types';
 import '@opensite/hooks/usePlatformFromUrl';

package/dist/about-startup-team.cjs

@@ -765,7 +765,8 @@ var spacingStyles = {
   sm: "py-12 md:py-16",
   md: "py-16 md:py-24",
   lg: "py-20 md:py-32",
-  xl: "py-24 md:py-40"
+  xl: "py-24 md:py-40",
+  hero: "pt-32 pb-12 md:pt-40 md:pb-40"
 };
 var predefinedSpacings = ["none", "sm", "md", "lg", "xl"];
 var isPredefinedSpacing = (spacing) => predefinedSpacings.includes(spacing);

package/dist/about-startup-team.d.cts

@@ -1,9 +1,9 @@
 import * as React from 'react';
-import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-DcLp6ycJ.cjs';
-import { O as OptixFlowConfig } from './blocks-C1EhIN1e.cjs';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-B658AD6n.cjs';
+import { O as OptixFlowConfig } from './blocks-DUr75v0S.cjs';
 import 'react/jsx-runtime';
 import 'class-variance-authority';
-import './button-variants-8mtEHxev.cjs';
+import './button-variants-lRElsmTc.cjs';
 import 'class-variance-authority/types';
 import '@opensite/hooks/usePlatformFromUrl';
 

package/dist/about-startup-team.d.ts

@@ -1,9 +1,9 @@
 import * as React from 'react';
-import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-C2nDtDDs.js';
-import { O as OptixFlowConfig } from './blocks-Y0T7PIol.js';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-BphRfrhZ.js';
+import { O as OptixFlowConfig } from './blocks-BzFuQGP0.js';
 import 'react/jsx-runtime';
 import 'class-variance-authority';
-import './button-variants-8mtEHxev.js';
+import './button-variants-lRElsmTc.js';
 import 'class-variance-authority/types';
 import '@opensite/hooks/usePlatformFromUrl';
 

package/dist/about-startup-team.js

@@ -744,7 +744,8 @@ var spacingStyles = {
   sm: "py-12 md:py-16",
   md: "py-16 md:py-24",
   lg: "py-20 md:py-32",
-  xl: "py-24 md:py-40"
+  xl: "py-24 md:py-40",
+  hero: "pt-32 pb-12 md:pt-40 md:pb-40"
 };
 var predefinedSpacings = ["none", "sm", "md", "lg", "xl"];
 var isPredefinedSpacing = (spacing) => predefinedSpacings.includes(spacing);

package/dist/about-stats-showcase.cjs

@@ -325,7 +325,8 @@ var spacingStyles = {
   sm: "py-12 md:py-16",
   md: "py-16 md:py-24",
   lg: "py-20 md:py-32",
-  xl: "py-24 md:py-40"
+  xl: "py-24 md:py-40",
+  hero: "pt-32 pb-12 md:pt-40 md:pb-40"
 };
 var predefinedSpacings = ["none", "sm", "md", "lg", "xl"];
 var isPredefinedSpacing = (spacing) => predefinedSpacings.includes(spacing);

package/dist/about-stats-showcase.d.cts

@@ -1,9 +1,9 @@
 import * as React from 'react';
-import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-DcLp6ycJ.cjs';
-import { O as OptixFlowConfig } from './blocks-C1EhIN1e.cjs';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-B658AD6n.cjs';
+import { O as OptixFlowConfig } from './blocks-DUr75v0S.cjs';
 import 'react/jsx-runtime';
 import 'class-variance-authority';
-import './button-variants-8mtEHxev.cjs';
+import './button-variants-lRElsmTc.cjs';
 import 'class-variance-authority/types';
 import '@opensite/hooks/usePlatformFromUrl';
 

package/dist/about-stats-showcase.d.ts

@@ -1,9 +1,9 @@
 import * as React from 'react';
-import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-C2nDtDDs.js';
-import { O as OptixFlowConfig } from './blocks-Y0T7PIol.js';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-BphRfrhZ.js';
+import { O as OptixFlowConfig } from './blocks-BzFuQGP0.js';
 import 'react/jsx-runtime';
 import 'class-variance-authority';
-import './button-variants-8mtEHxev.js';
+import './button-variants-lRElsmTc.js';
 import 'class-variance-authority/types';
 import '@opensite/hooks/usePlatformFromUrl';
 

package/dist/about-stats-showcase.js

@@ -319,7 +319,8 @@ var spacingStyles = {
   sm: "py-12 md:py-16",
   md: "py-16 md:py-24",
   lg: "py-20 md:py-32",
-  xl: "py-24 md:py-40"
+  xl: "py-24 md:py-40",
+  hero: "pt-32 pb-12 md:pt-40 md:pb-40"
 };
 var predefinedSpacings = ["none", "sm", "md", "lg", "xl"];
 var isPredefinedSpacing = (spacing) => predefinedSpacings.includes(spacing);

package/dist/about-stats-sidebar.cjs

@@ -324,7 +324,8 @@ var spacingStyles = {
   sm: "py-12 md:py-16",
   md: "py-16 md:py-24",
   lg: "py-20 md:py-32",
-  xl: "py-24 md:py-40"
+  xl: "py-24 md:py-40",
+  hero: "pt-32 pb-12 md:pt-40 md:pb-40"
 };
 var predefinedSpacings = ["none", "sm", "md", "lg", "xl"];
 var isPredefinedSpacing = (spacing) => predefinedSpacings.includes(spacing);
@@ -447,7 +448,9 @@ function AboutStatsSidebar({
       "div",
       {
         className: cn(
-          "mt-8 space-y-6 p-6 bg-card text-card-foreground rounded-xl shadow-xl",
+          "bg-card text-card-foreground",
+          "mt-4 md:mt-6 space-y-6 p-6",
+          "rounded-xl shadow-xl",
           featuresClassName
         ),
         children: features.map((feature, idx) => /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex gap-4", children: [
@@ -495,8 +498,8 @@ function AboutStatsSidebar({
                   ),
                   children: title
                 }
-              ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: titleClassName, children: title })),
-              description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("mt-4 text-lg", descriptionClassName), children: description }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("mt-4", descriptionClassName), children: description }))
+              ) : title),
+              description && (typeof description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("mt-4 text-lg", descriptionClassName), children: description }) : description)
             ]
           }
         ),

package/dist/about-stats-sidebar.d.cts

@@ -1,9 +1,9 @@
 import * as React from 'react';
-import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-DcLp6ycJ.cjs';
-import { S as StatItem, F as FeatureItem } from './blocks-C1EhIN1e.cjs';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-B658AD6n.cjs';
+import { S as StatItem, F as FeatureItem } from './blocks-DUr75v0S.cjs';
 import 'react/jsx-runtime';
 import 'class-variance-authority';
-import './button-variants-8mtEHxev.cjs';
+import './button-variants-lRElsmTc.cjs';
 import 'class-variance-authority/types';
 import '@opensite/hooks/usePlatformFromUrl';
 

package/dist/about-stats-sidebar.d.ts

@@ -1,9 +1,9 @@
 import * as React from 'react';
-import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-C2nDtDDs.js';
-import { S as StatItem, F as FeatureItem } from './blocks-Y0T7PIol.js';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-BphRfrhZ.js';
+import { S as StatItem, F as FeatureItem } from './blocks-BzFuQGP0.js';
 import 'react/jsx-runtime';
 import 'class-variance-authority';
-import './button-variants-8mtEHxev.js';
+import './button-variants-lRElsmTc.js';
 import 'class-variance-authority/types';
 import '@opensite/hooks/usePlatformFromUrl';
 

package/dist/about-stats-sidebar.js

@@ -318,7 +318,8 @@ var spacingStyles = {
   sm: "py-12 md:py-16",
   md: "py-16 md:py-24",
   lg: "py-20 md:py-32",
-  xl: "py-24 md:py-40"
+  xl: "py-24 md:py-40",
+  hero: "pt-32 pb-12 md:pt-40 md:pb-40"
 };
 var predefinedSpacings = ["none", "sm", "md", "lg", "xl"];
 var isPredefinedSpacing = (spacing) => predefinedSpacings.includes(spacing);
@@ -441,7 +442,9 @@ function AboutStatsSidebar({
       "div",
       {
         className: cn(
-          "mt-8 space-y-6 p-6 bg-card text-card-foreground rounded-xl shadow-xl",
+          "bg-card text-card-foreground",
+          "mt-4 md:mt-6 space-y-6 p-6",
+          "rounded-xl shadow-xl",
           featuresClassName
         ),
         children: features.map((feature, idx) => /* @__PURE__ */ jsxs("div", { className: "flex gap-4", children: [
@@ -489,8 +492,8 @@ function AboutStatsSidebar({
                   ),
                   children: title
                 }
-              ) : /* @__PURE__ */ jsx("div", { className: titleClassName, children: title })),
-              description && (typeof description === "string" ? /* @__PURE__ */ jsx("p", { className: cn("mt-4 text-lg", descriptionClassName), children: description }) : /* @__PURE__ */ jsx("div", { className: cn("mt-4", descriptionClassName), children: description }))
+              ) : title),
+              description && (typeof description === "string" ? /* @__PURE__ */ jsx("p", { className: cn("mt-4 text-lg", descriptionClassName), children: description }) : description)
             ]
           }
         ),

package/dist/about-story-expertise.cjs

@@ -343,7 +343,8 @@ var spacingStyles = {
   sm: "py-12 md:py-16",
   md: "py-16 md:py-24",
   lg: "py-20 md:py-32",
-  xl: "py-24 md:py-40"
+  xl: "py-24 md:py-40",
+  hero: "pt-32 pb-12 md:pt-40 md:pb-40"
 };
 var predefinedSpacings = ["none", "sm", "md", "lg", "xl"];
 var isPredefinedSpacing = (spacing) => predefinedSpacings.includes(spacing);

package/dist/about-story-expertise.d.cts

@@ -1,9 +1,9 @@
 import * as React from 'react';
-import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-DcLp6ycJ.cjs';
-import { A as ActionConfig, O as OptixFlowConfig } from './blocks-C1EhIN1e.cjs';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-B658AD6n.cjs';
+import { A as ActionConfig, O as OptixFlowConfig } from './blocks-DUr75v0S.cjs';
 import 'react/jsx-runtime';
 import 'class-variance-authority';
-import './button-variants-8mtEHxev.cjs';
+import './button-variants-lRElsmTc.cjs';
 import 'class-variance-authority/types';
 import '@opensite/hooks/usePlatformFromUrl';
 

package/dist/about-story-expertise.d.ts

@@ -1,9 +1,9 @@
 import * as React from 'react';
-import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-C2nDtDDs.js';
-import { A as ActionConfig, O as OptixFlowConfig } from './blocks-Y0T7PIol.js';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-BphRfrhZ.js';
+import { A as ActionConfig, O as OptixFlowConfig } from './blocks-BzFuQGP0.js';
 import 'react/jsx-runtime';
 import 'class-variance-authority';
-import './button-variants-8mtEHxev.js';
+import './button-variants-lRElsmTc.js';
 import 'class-variance-authority/types';
 import '@opensite/hooks/usePlatformFromUrl';
 

package/dist/about-story-expertise.js

@@ -322,7 +322,8 @@ var spacingStyles = {
   sm: "py-12 md:py-16",
   md: "py-16 md:py-24",
   lg: "py-20 md:py-32",
-  xl: "py-24 md:py-40"
+  xl: "py-24 md:py-40",
+  hero: "pt-32 pb-12 md:pt-40 md:pb-40"
 };
 var predefinedSpacings = ["none", "sm", "md", "lg", "xl"];
 var isPredefinedSpacing = (spacing) => predefinedSpacings.includes(spacing);

package/dist/about-story-gallery.cjs

@@ -326,7 +326,8 @@ var spacingStyles = {
   sm: "py-12 md:py-16",
   md: "py-16 md:py-24",
   lg: "py-20 md:py-32",
-  xl: "py-24 md:py-40"
+  xl: "py-24 md:py-40",
+  hero: "pt-32 pb-12 md:pt-40 md:pb-40"
 };
 var predefinedSpacings = ["none", "sm", "md", "lg", "xl"];
 var isPredefinedSpacing = (spacing) => predefinedSpacings.includes(spacing);

package/dist/about-story-gallery.d.cts

@@ -1,9 +1,9 @@
 import * as React from 'react';
-import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-DcLp6ycJ.cjs';
-import { O as OptixFlowConfig } from './blocks-C1EhIN1e.cjs';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-B658AD6n.cjs';
+import { O as OptixFlowConfig } from './blocks-DUr75v0S.cjs';
 import 'react/jsx-runtime';
 import 'class-variance-authority';
-import './button-variants-8mtEHxev.cjs';
+import './button-variants-lRElsmTc.cjs';
 import 'class-variance-authority/types';
 import '@opensite/hooks/usePlatformFromUrl';
 

package/dist/about-story-gallery.d.ts

@@ -1,9 +1,9 @@
 import * as React from 'react';
-import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-C2nDtDDs.js';
-import { O as OptixFlowConfig } from './blocks-Y0T7PIol.js';
+import { f as SectionBackground, g as SectionSpacing, t as PatternName } from './community-initiatives-BphRfrhZ.js';
+import { O as OptixFlowConfig } from './blocks-BzFuQGP0.js';
 import 'react/jsx-runtime';
 import 'class-variance-authority';
-import './button-variants-8mtEHxev.js';
+import './button-variants-lRElsmTc.js';
 import 'class-variance-authority/types';
 import '@opensite/hooks/usePlatformFromUrl';
 

package/dist/about-story-gallery.js

@@ -320,7 +320,8 @@ var spacingStyles = {
   sm: "py-12 md:py-16",
   md: "py-16 md:py-24",
   lg: "py-20 md:py-32",
-  xl: "py-24 md:py-40"
+  xl: "py-24 md:py-40",
+  hero: "pt-32 pb-12 md:pt-40 md:pb-40"
 };
 var predefinedSpacings = ["none", "sm", "md", "lg", "xl"];
 var isPredefinedSpacing = (spacing) => predefinedSpacings.includes(spacing);

package/dist/about-story-hero.cjs

@@ -1,80 +1,36 @@
 "use client";
 'use strict';
 
-var React = require('react');
+var React4 = require('react');
 var clsx = require('clsx');
 var tailwindMerge = require('tailwind-merge');
 var img = require('@page-speed/img');
 var jsxRuntime = require('react/jsx-runtime');
 
-function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
 
-var React__default = /*#__PURE__*/_interopDefault(React);
+var React4__namespace = /*#__PURE__*/_interopNamespace(React4);
 
 // components/blocks/about/about-story-hero.tsx
 function cn(...inputs) {
   return tailwindMerge.twMerge(clsx.clsx(inputs));
 }
-function getNestedCardBg(parentBg, variant = "muted", options) {
-  const isDark = parentBg === "dark" || parentBg === "secondary" || parentBg === "primary";
-  if (isDark) {
-    switch (variant) {
-      case "muted":
-        return "bg-background";
-      case "card":
-        return "bg-card";
-      case "accent":
-        return "bg-accent";
-      case "subtle":
-        return "bg-background/50";
-    }
-  } else {
-    switch (variant) {
-      case "muted":
-        return "bg-muted";
-      case "card":
-        return "bg-card";
-      case "accent":
-        return "bg-accent";
-      case "subtle":
-        return "bg-muted/50";
-    }
-  }
-}
-function getNestedCardTextColor(parentBg, options) {
-  const isDark = parentBg === "dark" || parentBg === "secondary" || parentBg === "primary";
-  return isDark ? "text-foreground" : "";
-}
-function getTextColor(parentBg, variant = "default", options) {
-  const isDark = parentBg === "dark" || parentBg === "secondary" || parentBg === "primary";
-  if (isDark) {
-    switch (variant) {
-      case "default":
-        return "text-foreground";
-      case "muted":
-        return "text-foreground/80";
-      case "subtle":
-        return "text-foreground/60";
-      case "accent":
-        return "text-accent-foreground";
-    }
-  } else {
-    switch (variant) {
-      case "default":
-        return "text-foreground";
-      case "muted":
-        return "text-muted-foreground";
-      case "subtle":
-        return "text-muted-foreground/70";
-      case "accent":
-        return "text-primary";
-    }
-  }
-}
-function getAccentColor(parentBg, options) {
-  const isDark = parentBg === "dark" || parentBg === "secondary" || parentBg === "primary";
-  return isDark ? "text-accent-foreground" : "text-primary";
-}
 var maxWidthStyles = {
   sm: "max-w-screen-sm",
   md: "max-w-screen-md",
@@ -84,7 +40,7 @@ var maxWidthStyles = {
   "4xl": "max-w-[1536px]",
   full: "max-w-full"
 };
-var Container = React__default.default.forwardRef(
+var Container = React4__namespace.default.forwardRef(
   ({ children, maxWidth = "xl", className, as = "div", ...props }, ref) => {
     const Component = as;
     return /* @__PURE__ */ jsxRuntime.jsx(
@@ -385,11 +341,12 @@ var spacingStyles = {
   sm: "py-12 md:py-16",
   md: "py-16 md:py-24",
   lg: "py-20 md:py-32",
-  xl: "py-24 md:py-40"
+  xl: "py-24 md:py-40",
+  hero: "pt-32 pb-12 md:pt-40 md:pb-40"
 };
 var predefinedSpacings = ["none", "sm", "md", "lg", "xl"];
 var isPredefinedSpacing = (spacing) => predefinedSpacings.includes(spacing);
-var Section = React__default.default.forwardRef(
+var Section = React4__namespace.default.forwardRef(
   ({
     id,
     title,
@@ -450,6 +407,38 @@ var Section = React__default.default.forwardRef(
   }
 );
 Section.displayName = "Section";
+function TextInner({ as, className, children, ...props }, ref) {
+  const Component = as || "span";
+  return /* @__PURE__ */ jsxRuntime.jsx(Component, { ref, className: cn(className), ...props, children });
+}
+var Text = React4__namespace.forwardRef(TextInner);
+Text.displayName = "Text";
+function isContentTextItem(item) {
+  return item !== null && typeof item === "object" && !React4__namespace.isValidElement(item) && "_type" in item && item._type === "text";
+}
+var ContentGroup = React4__namespace.forwardRef(
+  ({ items, className, children, ...props }, ref) => {
+    const hasContent = items && items.length > 0;
+    if (!hasContent) {
+      return null;
+    }
+    return /* @__PURE__ */ jsxRuntime.jsxs("div", { ref, className: cn(className), ...props, children: [
+      items.map((item, idx) => {
+        if (isContentTextItem(item)) {
+          const { _type, ...textProps } = item;
+          return /* @__PURE__ */ jsxRuntime.jsx(Text, { ...textProps }, idx);
+        }
+        const reactNode = item;
+        if (React4__namespace.isValidElement(reactNode)) {
+          return React4__namespace.cloneElement(reactNode, { key: reactNode.key ?? idx });
+        }
+        return /* @__PURE__ */ jsxRuntime.jsx(React4__namespace.Fragment, { children: reactNode }, idx);
+      }),
+      children
+    ] });
+  }
+);
+ContentGroup.displayName = "ContentGroup";
 function AboutStoryHero({
   title,
   subtitle,
@@ -471,25 +460,75 @@ function AboutStoryHero({
   pattern,
   patternOpacity
 }) {
-  const teamInfoContent = React.useMemo(() => {
+  const teamInfoContent = React4.useMemo(() => {
     if (teamInfoSlot) return teamInfoSlot;
     if (!teamInfo) return null;
     return /* @__PURE__ */ jsxRuntime.jsxs(
       "div",
       {
         className: cn(
-          "mt-6 md:mt-8 rounded-2xl p-6",
-          getNestedCardBg(background),
-          getNestedCardTextColor(background),
+          "rounded-2xl bg-muted text-muted-foreground",
+          "flex flex-col items-start gap-2",
           teamInfoClassName
         ),
         children: [
-          typeof teamInfo.title === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-2xl font-bold", children: teamInfo.title }) : teamInfo.title,
-          typeof teamInfo.description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: cn("mt-1", getTextColor(background, "muted")), children: teamInfo.description }) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "mt-1", children: teamInfo.description })
+          teamInfo.title ? typeof teamInfo.title === "string" ? /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "text-xl md:text-2xl font-bold", children: teamInfo.title }) : teamInfo.title : null,
+          teamInfo.description ? typeof teamInfo.description === "string" ? /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-lg", children: teamInfo.description }) : teamInfo.description : null
         ]
       }
     );
   }, [teamInfoSlot, teamInfo, teamInfoClassName, background]);
+  const contentItems = React4.useMemo(() => {
+    const items = [];
+    if (subtitle) {
+      if (typeof subtitle === "string") {
+        items.push({
+          _type: "text",
+          as: "p",
+          className: cn(
+            "text-sm font-semibold",
+            "uppercase tracking-wider opacity-65",
+            subtitleClassName
+          ),
+          children: subtitle
+        });
+      } else {
+        items.push(subtitle);
+      }
+    }
+    if (title) {
+      if (typeof title === "string") {
+        items.push({
+          _type: "text",
+          as: "h1",
+          className: cn("text-4xl font-bold tracking-tight md:text-5xl", title),
+          children: title
+        });
+      } else {
+        items.push(title);
+      }
+    }
+    if (content) {
+      if (typeof content === "string") {
+        items.push({
+          _type: "text",
+          as: "p",
+          className: cn("text-lg whitespace-pre-line", bodyClassName),
+          children: content
+        });
+      } else {
+        items.push(content);
+      }
+    }
+    return items;
+  }, [
+    subtitle,
+    subtitleClassName,
+    title,
+    titleClassName,
+    content,
+    bodyClassName
+  ]);
   return /* @__PURE__ */ jsxRuntime.jsx(
     Section,
     {
@@ -497,49 +536,24 @@ function AboutStoryHero({
       spacing,
       pattern,
       patternOpacity,
-      className: cn(className),
+      className,
       containerClassName,
       children: /* @__PURE__ */ jsxRuntime.jsxs(
         "div",
         {
           className: cn(
-            "grid gap:6 md:gap-12 lg:grid-cols-2 lg:items-center",
+            "grid gap-6 md:gap-12 grid-cols-1 lg:grid-cols-2 items-center",
             contentClassName
           ),
           children: [
-            /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
-              subtitle && (typeof subtitle === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
-                "p",
-                {
-                  className: cn(
-                    "text-sm font-semibold uppercase tracking-wider",
-                    getAccentColor(background),
-                    subtitleClassName
-                  ),
-                  children: subtitle
-                }
-              ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: subtitleClassName, children: subtitle })),
-              title && (typeof title === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
-                "h1",
-                {
-                  className: cn(
-                    "mt-4 text-4xl font-bold tracking-tight md:text-5xl",
-                    titleClassName
-                  ),
-                  children: title
-                }
-              ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("mt-4", titleClassName), children: title })),
-              content && (typeof content === "string" ? /* @__PURE__ */ jsxRuntime.jsx(
-                "p",
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "space-y-6 md:space-y-8", children: [
+              /* @__PURE__ */ jsxRuntime.jsx(
+                ContentGroup,
                 {
-                  className: cn(
-                    "mt-6 text-lg whitespace-pre-line",
-                    getTextColor(background, "muted"),
-                    bodyClassName
-                  ),
-                  children: content
+                  items: contentItems,
+                  className: "space-y-4 md:space-y-6"
                 }
-              ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("mt-6", bodyClassName), children: content })),
+              ),
               (teamInfoSlot || teamInfo) && teamInfoContent
             ] }),
             heroImage && /* @__PURE__ */ jsxRuntime.jsx(
@@ -548,7 +562,8 @@ function AboutStoryHero({
                 src: heroImage.src,
                 alt: heroImage.alt,
                 className: cn(
-                  "mt-6 md:mt-0 w-full h-auto rounded-2xl object-cover sm:h-full",
+                  "w-full h-auto sm:h-full",
+                  "rounded-2xl object-cover shadow-xl",
                   imageClassName
                 ),
                 optixFlowConfig