@techrox/page-studio-blocks 1.0.0 → 1.1.1

package/dist/index.js

@@ -72,6 +72,14 @@ var Hero = {
         { label: "Landing (gradient halo)", value: "landing" },
         { label: "Simple (plain section)", value: "simple" }
       ]
+    },
+    background: {
+      type: "radio",
+      label: "Background",
+      options: [
+        { label: "Light", value: "light" },
+        { label: "Dark", value: "dark" }
+      ]
     }
   },
   defaultProps: {
@@ -83,7 +91,8 @@ var Hero = {
     secondary_cta_label: "Learn more",
     secondary_cta_href: "/about",
     align: "left",
-    variant: "landing"
+    variant: "landing",
+    background: "light"
   },
   render: ({
     eyebrow,
@@ -94,10 +103,11 @@ var Hero = {
     secondary_cta_label,
     secondary_cta_href,
     align,
-    variant
+    variant,
+    background
   }) => {
     const isLanding = variant === "landing";
-    const sectionClass = isLanding ? "tps-hero" : "tps-section";
+    const sectionClass = `${isLanding ? "tps-hero" : "tps-section"}${background === "dark" ? " tps-section-dark" : ""}`;
     const innerClass = isLanding ? "tps-hero-inner" : "tps-container";
     return /* @__PURE__ */ jsx2(
       "section",
@@ -173,7 +183,8 @@ var StatsStrip = {
       label: "Background",
       options: [
         { label: "Soft", value: "soft" },
-        { label: "White", value: "white" }
+        { label: "White", value: "white" },
+        { label: "Dark", value: "dark" }
       ]
     }
   },
@@ -189,7 +200,7 @@ var StatsStrip = {
   render: ({ items, background }) => /* @__PURE__ */ jsx3(
     "section",
     {
-      className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}`,
+      className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}${background === "dark" ? " tps-section-dark" : ""}`,
       style: { paddingTop: 32, paddingBottom: 32 },
       children: /* @__PURE__ */ jsx3("div", { className: "tps-container", children: /* @__PURE__ */ jsx3(
         "div",
@@ -255,7 +266,8 @@ var SectionHeader = {
       label: "Background",
       options: [
         { label: "White", value: "white" },
-        { label: "Soft", value: "soft" }
+        { label: "Soft", value: "soft" },
+        { label: "Dark", value: "dark" }
       ]
     },
     spacing: {
@@ -281,7 +293,7 @@ var SectionHeader = {
     return /* @__PURE__ */ jsx4(
       "section",
       {
-        className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}`,
+        className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}${background === "dark" ? " tps-section-dark" : ""}`,
         style: { paddingTop: pad, paddingBottom: pad },
         children: /* @__PURE__ */ jsxs3(
           "div",
@@ -415,7 +427,8 @@ var PillarsRow = {
       label: "Background",
       options: [
         { label: "White", value: "white" },
-        { label: "Soft", value: "soft" }
+        { label: "Soft", value: "soft" },
+        { label: "Dark", value: "dark" }
       ]
     }
   },
@@ -443,7 +456,7 @@ var PillarsRow = {
   render: ({ items, columns, background }) => /* @__PURE__ */ jsx6(
     "section",
     {
-      className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}`,
+      className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}${background === "dark" ? " tps-section-dark" : ""}`,
       style: { paddingTop: 56, paddingBottom: 56 },
       children: /* @__PURE__ */ jsx6("div", { className: "tps-container", children: /* @__PURE__ */ jsx6(
         "div",
@@ -459,7 +472,7 @@ var PillarsRow = {
               "div",
               {
                 style: {
-                  background: "#fff",
+                  background: "var(--tps-bg)",
                   border: "1px solid var(--tps-line)",
                   borderRadius: "var(--tps-radius)",
                   padding: 32
@@ -504,7 +517,8 @@ var ApproachSteps = {
       label: "Background",
       options: [
         { label: "White", value: "white" },
-        { label: "Soft", value: "soft" }
+        { label: "Soft", value: "soft" },
+        { label: "Dark", value: "dark" }
       ]
     }
   },
@@ -520,7 +534,7 @@ var ApproachSteps = {
   render: ({ items, background }) => /* @__PURE__ */ jsx7(
     "section",
     {
-      className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}`,
+      className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}${background === "dark" ? " tps-section-dark" : ""}`,
       style: { paddingTop: 56, paddingBottom: 56 },
       children: /* @__PURE__ */ jsx7("div", { className: "tps-container", children: /* @__PURE__ */ jsx7(
         "div",
@@ -574,7 +588,8 @@ var ServicesGrid = {
       label: "Background",
       options: [
         { label: "White", value: "white" },
-        { label: "Soft", value: "soft" }
+        { label: "Soft", value: "soft" },
+        { label: "Dark", value: "dark" }
       ]
     }
   },
@@ -590,7 +605,7 @@ var ServicesGrid = {
     return /* @__PURE__ */ jsx8(
       "section",
       {
-        className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}`,
+        className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}${background === "dark" ? " tps-section-dark" : ""}`,
         style: { paddingTop: 56, paddingBottom: 56 },
         children: /* @__PURE__ */ jsxs6("div", { className: "tps-container", children: [
           (eyebrow || heading) && /* @__PURE__ */ jsxs6("div", { style: { marginBottom: 32 }, children: [
@@ -612,7 +627,7 @@ var ServicesGrid = {
                   style: {
                     display: "block",
                     padding: 24,
-                    background: "#fff",
+                    background: "var(--tps-bg)",
                     border: "1px solid var(--tps-line)",
                     borderRadius: "var(--tps-radius)",
                     textDecoration: "none",
@@ -670,13 +685,8 @@ var CTABanner = {
     return /* @__PURE__ */ jsx9(
       "section",
       {
-        className: `tps-section ${!dark ? "tps-section-soft" : ""}`,
-        style: {
-          paddingTop: 80,
-          paddingBottom: 80,
-          background: dark ? "#0F172A" : void 0,
-          color: dark ? "#fff" : void 0
-        },
+        className: `tps-section ${!dark ? "tps-section-soft" : "tps-section-dark"}`,
+        style: { paddingTop: 80, paddingBottom: 80 },
         children: /* @__PURE__ */ jsxs7("div", { className: "tps-container", style: { textAlign: "center", maxWidth: 720 }, children: [
           tagline && /* @__PURE__ */ jsx9(
             "div",
@@ -685,7 +695,7 @@ var CTABanner = {
                 fontSize: 12,
                 fontWeight: 700,
                 letterSpacing: 2,
-                color: dark ? "#F59E0B" : "var(--tps-accent-dark)",
+                color: dark ? "var(--tps-accent)" : "var(--tps-accent-dark)",
                 marginBottom: 12
               },
               children: tagline
@@ -695,18 +705,10 @@ var CTABanner = {
             "h2",
             {
               className: "tps-h2",
-              style: { color: dark ? "#fff" : void 0 },
               dangerouslySetInnerHTML: { __html: heading_html }
             }
           ),
-          body && /* @__PURE__ */ jsx9(
-            "p",
-            {
-              className: "tps-lede",
-              style: { margin: "16px auto 32px", color: dark ? "rgba(255,255,255,0.85)" : void 0 },
-              children: body
-            }
-          ),
+          body && /* @__PURE__ */ jsx9("p", { className: "tps-lede", style: { margin: "16px auto 32px" }, children: body }),
           button_label && /* @__PURE__ */ jsx9(StudioLink, { href: button_href || "/contact", children: /* @__PURE__ */ jsxs7(Button2, { type: "primary", size: "large", children: [
             button_label,
             " ",
@@ -839,7 +841,8 @@ var TwoColumn = {
       label: "Background",
       options: [
         { label: "White", value: "white" },
-        { label: "Soft", value: "soft" }
+        { label: "Soft", value: "soft" },
+        { label: "Dark", value: "dark" }
       ]
     }
   },
@@ -853,7 +856,7 @@ var TwoColumn = {
   render: ({ left_heading, left_body, right_heading, right_body, background }) => /* @__PURE__ */ jsx11(
     "section",
     {
-      className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}`,
+      className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}${background === "dark" ? " tps-section-dark" : ""}`,
       style: { paddingTop: 56, paddingBottom: 56 },
       children: /* @__PURE__ */ jsx11("div", { className: "tps-container", children: /* @__PURE__ */ jsxs9(
         "div",
@@ -1154,7 +1157,10 @@ function ContactSectionRender({
               {
                 size: "large",
                 placeholder: "Select the stage that best describes you",
-                options: stagesList.map((s) => ({ value: s, label: s }))
+                options: stagesList.map((s) => {
+                  const v = typeof s === "string" ? s : s?.text || String(s);
+                  return { value: v, label: v };
+                })
               }
             ) }),
             /* @__PURE__ */ jsx14(Form.Item, { label: "Which capabilities interest you?", name: "interest", children: /* @__PURE__ */ jsx14(
@@ -1288,7 +1294,8 @@ var ImageText = {
       label: "Background",
       options: [
         { label: "White", value: "white" },
-        { label: "Soft", value: "soft" }
+        { label: "Soft", value: "soft" },
+        { label: "Dark", value: "dark" }
       ]
     }
   },
@@ -1332,7 +1339,7 @@ var ImageText = {
         style: {
           width: "100%",
           aspectRatio: "4 / 3",
-          background: "#E2E8F0",
+          background: "var(--tps-line)",
           borderRadius: "var(--tps-radius)",
           display: "flex",
           alignItems: "center",
@@ -1356,7 +1363,7 @@ var ImageText = {
     return /* @__PURE__ */ jsx15(
       "section",
       {
-        className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}`,
+        className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}${background === "dark" ? " tps-section-dark" : ""}`,
         style: { paddingTop: 56, paddingBottom: 56 },
         children: /* @__PURE__ */ jsx15("div", { className: "tps-container", children: /* @__PURE__ */ jsx15(
           "div",
@@ -1415,7 +1422,8 @@ var VideoEmbed = {
       label: "Background",
       options: [
         { label: "White", value: "white" },
-        { label: "Soft", value: "soft" }
+        { label: "Soft", value: "soft" },
+        { label: "Dark", value: "dark" }
       ]
     }
   },
@@ -1431,7 +1439,7 @@ var VideoEmbed = {
     return /* @__PURE__ */ jsx16(
       "section",
       {
-        className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}`,
+        className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}${background === "dark" ? " tps-section-dark" : ""}`,
         style: { paddingTop: 48, paddingBottom: 48 },
         children: /* @__PURE__ */ jsxs12("div", { className: "tps-container", style: { maxWidth: max_width }, children: [
           /* @__PURE__ */ jsx16(
@@ -1521,7 +1529,8 @@ var LogoStrip = {
       label: "Background",
       options: [
         { label: "White", value: "white" },
-        { label: "Soft", value: "soft" }
+        { label: "Soft", value: "soft" },
+        { label: "Dark", value: "dark" }
       ]
     }
   },
@@ -1539,7 +1548,7 @@ var LogoStrip = {
   render: ({ heading, items, background }) => /* @__PURE__ */ jsx17(
     "section",
     {
-      className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}`,
+      className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}${background === "dark" ? " tps-section-dark" : ""}`,
       style: { paddingTop: 40, paddingBottom: 40 },
       children: /* @__PURE__ */ jsxs13("div", { className: "tps-container", style: { textAlign: "center" }, children: [
         heading && /* @__PURE__ */ jsx17(
@@ -1784,7 +1793,8 @@ var TestimonialGrid = {
       label: "Background",
       options: [
         { label: "White", value: "white" },
-        { label: "Soft", value: "soft" }
+        { label: "Soft", value: "soft" },
+        { label: "Dark", value: "dark" }
       ]
     }
   },
@@ -1817,7 +1827,7 @@ var TestimonialGrid = {
   render: ({ eyebrow, heading, items, columns, background }) => /* @__PURE__ */ jsx19(
     "section",
     {
-      className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}`,
+      className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}${background === "dark" ? " tps-section-dark" : ""}`,
       style: { paddingTop: 64, paddingBottom: 64 },
       children: /* @__PURE__ */ jsxs15("div", { className: "tps-container", children: [
         (eyebrow || heading) && /* @__PURE__ */ jsxs15("div", { style: { textAlign: "center", marginBottom: 40 }, children: [
@@ -1836,7 +1846,7 @@ var TestimonialGrid = {
               "div",
               {
                 style: {
-                  background: "#fff",
+                  background: "var(--tps-bg)",
                   border: "1px solid var(--tps-line)",
                   borderRadius: "var(--tps-radius)",
                   padding: 28,
@@ -1927,7 +1937,8 @@ var FAQ = {
       label: "Background",
       options: [
         { label: "White", value: "white" },
-        { label: "Soft", value: "soft" }
+        { label: "Soft", value: "soft" },
+        { label: "Dark", value: "dark" }
       ]
     }
   },
@@ -1953,7 +1964,7 @@ var FAQ = {
   render: ({ eyebrow, heading, items, background }) => /* @__PURE__ */ jsx20(
     "section",
     {
-      className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}`,
+      className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}${background === "dark" ? " tps-section-dark" : ""}`,
       style: { paddingTop: 56, paddingBottom: 56 },
       children: /* @__PURE__ */ jsxs16("div", { className: "tps-container", style: { maxWidth: 820 }, children: [
         (eyebrow || heading) && /* @__PURE__ */ jsxs16("div", { style: { marginBottom: 32 }, children: [
@@ -1978,7 +1989,7 @@ var FAQ = {
                 }
               ),
               style: {
-                background: "#fff",
+                background: "var(--tps-bg)",
                 border: "1px solid var(--tps-line)",
                 borderRadius: "var(--tps-radius)",
                 marginBottom: 12,
@@ -2019,7 +2030,8 @@ var Timeline = {
       label: "Background",
       options: [
         { label: "White", value: "white" },
-        { label: "Soft", value: "soft" }
+        { label: "Soft", value: "soft" },
+        { label: "Dark", value: "dark" }
       ]
     }
   },
@@ -2037,7 +2049,7 @@ var Timeline = {
   render: ({ eyebrow, heading, items, background }) => /* @__PURE__ */ jsx21(
     "section",
     {
-      className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}`,
+      className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}${background === "dark" ? " tps-section-dark" : ""}`,
       style: { paddingTop: 56, paddingBottom: 56 },
       children: /* @__PURE__ */ jsxs17("div", { className: "tps-container", style: { maxWidth: 720 }, children: [
         (eyebrow || heading) && /* @__PURE__ */ jsxs17("div", { style: { marginBottom: 32 }, children: [
@@ -2089,7 +2101,7 @@ var Timeline = {
                           height: 12,
                           borderRadius: "50%",
                           background: "var(--tps-primary)",
-                          boxShadow: "0 0 0 4px #fff"
+                          boxShadow: "0 0 0 4px var(--tps-bg)"
                         }
                       }
                     ),
@@ -2310,7 +2322,8 @@ var TeamGrid = {
       label: "Background",
       options: [
         { label: "White", value: "white" },
-        { label: "Soft", value: "soft" }
+        { label: "Soft", value: "soft" },
+        { label: "Dark", value: "dark" }
       ]
     }
   },
@@ -2346,7 +2359,7 @@ var TeamGrid = {
   render: ({ eyebrow, heading, columns, members, background }) => /* @__PURE__ */ jsx23(
     "section",
     {
-      className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}`,
+      className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}${background === "dark" ? " tps-section-dark" : ""}`,
       style: { paddingTop: 64, paddingBottom: 64 },
       children: /* @__PURE__ */ jsxs19("div", { className: "tps-container", children: [
         (eyebrow || heading) && /* @__PURE__ */ jsxs19("div", { style: { marginBottom: 40 }, children: [
@@ -2365,7 +2378,7 @@ var TeamGrid = {
               "div",
               {
                 style: {
-                  background: "#fff",
+                  background: "var(--tps-bg)",
                   border: "1px solid var(--tps-line)",
                   borderRadius: "var(--tps-radius)",
                   overflow: "hidden"
@@ -2377,7 +2390,7 @@ var TeamGrid = {
                       style: {
                         width: "100%",
                         aspectRatio: "4 / 3",
-                        background: m.image_url ? `url(${m.image_url}) center/cover` : "#E2E8F0",
+                        background: m.image_url ? `url(${m.image_url}) center/cover` : "var(--tps-line)",
                         display: "flex",
                         alignItems: "center",
                         justifyContent: "center",
@@ -2577,6 +2590,15 @@ var ArticleFeatured = {
         { label: "Right", value: "right" },
         { label: "Left", value: "left" }
       ]
+    },
+    background: {
+      type: "radio",
+      label: "Background",
+      options: [
+        { label: "White", value: "white" },
+        { label: "Soft", value: "soft" },
+        { label: "Dark", value: "dark" }
+      ]
     }
   },
   defaultProps: {
@@ -2591,7 +2613,8 @@ var ArticleFeatured = {
     read_minutes: "6 min",
     link_label: "Read more",
     link_href: "#",
-    image_position: "right"
+    image_position: "right",
+    background: "white"
   },
   render: ({
     eyebrow,
@@ -2605,7 +2628,8 @@ var ArticleFeatured = {
     read_minutes,
     link_label,
     link_href,
-    image_position
+    image_position,
+    background
   }) => {
     const image = /* @__PURE__ */ jsx25(
       "div",
@@ -2696,27 +2720,34 @@ var ArticleFeatured = {
         /* @__PURE__ */ jsx25(ArrowRightOutlined6, {})
       ] }) })
     ] });
-    return /* @__PURE__ */ jsx25("section", { className: "tps-section", style: { paddingTop: 64, paddingBottom: 64 }, children: /* @__PURE__ */ jsxs21("div", { className: "tps-container", children: [
-      eyebrow && /* @__PURE__ */ jsx25("div", { style: { marginBottom: 32 }, children: /* @__PURE__ */ jsx25("span", { className: "tps-eyebrow", children: eyebrow }) }),
-      /* @__PURE__ */ jsx25(
-        "div",
-        {
-          style: {
-            display: "grid",
-            gridTemplateColumns: "repeat(auto-fit, minmax(min(320px, 100%), 1fr))",
-            gap: 48,
-            alignItems: "center"
-          },
-          children: image_position === "left" ? /* @__PURE__ */ jsxs21(Fragment3, { children: [
-            image,
-            text
-          ] }) : /* @__PURE__ */ jsxs21(Fragment3, { children: [
-            text,
-            image
-          ] })
-        }
-      )
-    ] }) });
+    return /* @__PURE__ */ jsx25(
+      "section",
+      {
+        className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}${background === "dark" ? " tps-section-dark" : ""}`,
+        style: { paddingTop: 64, paddingBottom: 64 },
+        children: /* @__PURE__ */ jsxs21("div", { className: "tps-container", children: [
+          eyebrow && /* @__PURE__ */ jsx25("div", { style: { marginBottom: 32 }, children: /* @__PURE__ */ jsx25("span", { className: "tps-eyebrow", children: eyebrow }) }),
+          /* @__PURE__ */ jsx25(
+            "div",
+            {
+              style: {
+                display: "grid",
+                gridTemplateColumns: "repeat(auto-fit, minmax(min(320px, 100%), 1fr))",
+                gap: 48,
+                alignItems: "center"
+              },
+              children: image_position === "left" ? /* @__PURE__ */ jsxs21(Fragment3, { children: [
+                image,
+                text
+              ] }) : /* @__PURE__ */ jsxs21(Fragment3, { children: [
+                text,
+                image
+              ] })
+            }
+          )
+        ] })
+      }
+    );
   }
 };
 
@@ -2763,7 +2794,8 @@ var ArticleGrid = {
       label: "Background",
       options: [
         { label: "White", value: "white" },
-        { label: "Soft", value: "soft" }
+        { label: "Soft", value: "soft" },
+        { label: "Dark", value: "dark" }
       ]
     }
   },
@@ -2805,7 +2837,7 @@ var ArticleGrid = {
   render: ({ eyebrow, heading, columns, items, background }) => /* @__PURE__ */ jsx26(
     "section",
     {
-      className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}`,
+      className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}${background === "dark" ? " tps-section-dark" : ""}`,
       style: { paddingTop: 64, paddingBottom: 64 },
       children: /* @__PURE__ */ jsxs22("div", { className: "tps-container", children: [
         (eyebrow || heading) && /* @__PURE__ */ jsxs22("div", { style: { marginBottom: 40 }, children: [
@@ -2827,7 +2859,7 @@ var ArticleGrid = {
                 style: {
                   display: "flex",
                   flexDirection: "column",
-                  background: "#fff",
+                  background: "var(--tps-bg)",
                   border: "1px solid var(--tps-line)",
                   borderRadius: "var(--tps-radius)",
                   overflow: "hidden",
@@ -2843,7 +2875,7 @@ var ArticleGrid = {
                       style: {
                         width: "100%",
                         aspectRatio: "16 / 10",
-                        background: a.image_url ? `url(${a.image_url}) center/cover no-repeat` : "#E2E8F0"
+                        background: a.image_url ? `url(${a.image_url}) center/cover no-repeat` : "var(--tps-line)"
                       }
                     }
                   ),
@@ -2925,7 +2957,8 @@ var ArticleList = {
       label: "Background",
       options: [
         { label: "White", value: "white" },
-        { label: "Soft", value: "soft" }
+        { label: "Soft", value: "soft" },
+        { label: "Dark", value: "dark" }
       ]
     }
   },
@@ -2943,7 +2976,7 @@ var ArticleList = {
   render: ({ eyebrow, heading, items, background }) => /* @__PURE__ */ jsx27(
     "section",
     {
-      className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}`,
+      className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}${background === "dark" ? " tps-section-dark" : ""}`,
       style: { paddingTop: 56, paddingBottom: 56 },
       children: /* @__PURE__ */ jsxs23("div", { className: "tps-container", style: { maxWidth: 820 }, children: [
         (eyebrow || heading) && /* @__PURE__ */ jsxs23("div", { style: { marginBottom: 32 }, children: [
@@ -3101,7 +3134,8 @@ var IconCards = {
       label: "Background",
       options: [
         { label: "White", value: "white" },
-        { label: "Soft", value: "soft" }
+        { label: "Soft", value: "soft" },
+        { label: "Dark", value: "dark" }
       ]
     }
   },
@@ -3120,7 +3154,7 @@ var IconCards = {
   render: ({ eyebrow, heading, columns, items, background }) => /* @__PURE__ */ jsx28(
     "section",
     {
-      className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}`,
+      className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}${background === "dark" ? " tps-section-dark" : ""}`,
       style: { paddingTop: 56, paddingBottom: 56 },
       children: /* @__PURE__ */ jsxs24("div", { className: "tps-container", children: [
         (eyebrow || heading) && /* @__PURE__ */ jsxs24("div", { style: { marginBottom: 40 }, children: [
@@ -3142,7 +3176,7 @@ var IconCards = {
                 {
                   style: {
                     padding: 24,
-                    background: "#fff",
+                    background: "var(--tps-bg)",
                     border: "1px solid var(--tps-line)",
                     borderRadius: "var(--tps-radius)"
                   },
@@ -3229,35 +3263,15 @@ var MetricCards = {
     background: "white"
   },
   render: ({ eyebrow, heading, items, background }) => {
-    const dark = background === "dark";
     return /* @__PURE__ */ jsx29(
       "section",
       {
-        className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}`,
-        style: {
-          paddingTop: 64,
-          paddingBottom: 64,
-          background: dark ? "#0F172A" : void 0,
-          color: dark ? "#fff" : void 0
-        },
+        className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}${background === "dark" ? " tps-section-dark" : ""}`,
+        style: { paddingTop: 64, paddingBottom: 64 },
         children: /* @__PURE__ */ jsxs25("div", { className: "tps-container", children: [
           (eyebrow || heading) && /* @__PURE__ */ jsxs25("div", { style: { marginBottom: 40 }, children: [
-            eyebrow && /* @__PURE__ */ jsx29(
-              "span",
-              {
-                className: "tps-eyebrow",
-                style: { color: dark ? "#F59E0B" : void 0 },
-                children: eyebrow
-              }
-            ),
-            heading && /* @__PURE__ */ jsx29(
-              "h2",
-              {
-                className: "tps-h2",
-                style: { marginTop: 8, color: dark ? "#fff" : void 0 },
-                children: heading
-              }
-            )
+            eyebrow && /* @__PURE__ */ jsx29("span", { className: "tps-eyebrow", children: eyebrow }),
+            heading && /* @__PURE__ */ jsx29("h2", { className: "tps-h2", style: { marginTop: 8 }, children: heading })
           ] }),
           /* @__PURE__ */ jsx29(
             "div",
@@ -3272,8 +3286,8 @@ var MetricCards = {
                 {
                   style: {
                     padding: 28,
-                    background: dark ? "rgba(255,255,255,0.04)" : "#fff",
-                    border: dark ? "1px solid rgba(255,255,255,0.08)" : "1px solid var(--tps-line)",
+                    background: "var(--tps-bg)",
+                    border: "1px solid var(--tps-line)",
                     borderRadius: "var(--tps-radius)"
                   },
                   children: [
@@ -3283,7 +3297,7 @@ var MetricCards = {
                         style: {
                           fontSize: "clamp(28px, 6vw, 44px)",
                           fontWeight: 800,
-                          color: dark ? "#fff" : "var(--tps-primary)",
+                          color: "var(--tps-primary)",
                           letterSpacing: "-0.02em",
                           lineHeight: 1.05,
                           marginBottom: 12
@@ -3296,7 +3310,7 @@ var MetricCards = {
                       {
                         style: {
                           fontSize: 14,
-                          color: dark ? "rgba(255,255,255,0.85)" : "var(--tps-ink-2)",
+                          color: "var(--tps-ink-2)",
                           lineHeight: 1.55,
                           marginBottom: m.delta ? 12 : 0
                         },
@@ -3375,7 +3389,8 @@ var ImageOverlayCards = {
       label: "Background",
       options: [
         { label: "White", value: "white" },
-        { label: "Soft", value: "soft" }
+        { label: "Soft", value: "soft" },
+        { label: "Dark", value: "dark" }
       ]
     }
   },
@@ -3393,7 +3408,7 @@ var ImageOverlayCards = {
   render: ({ eyebrow, heading, columns, items, background }) => /* @__PURE__ */ jsx30(
     "section",
     {
-      className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}`,
+      className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}${background === "dark" ? " tps-section-dark" : ""}`,
       style: { paddingTop: 64, paddingBottom: 64 },
       children: /* @__PURE__ */ jsxs26("div", { className: "tps-container", children: [
         (eyebrow || heading) && /* @__PURE__ */ jsxs26("div", { style: { marginBottom: 40 }, children: [
@@ -3546,7 +3561,7 @@ var PricingTable = {
     background: {
       type: "radio",
       label: "Background",
-      options: [{ label: "White", value: "white" }, { label: "Soft", value: "soft" }]
+      options: [{ label: "White", value: "white" }, { label: "Soft", value: "soft" }, { label: "Dark", value: "dark" }]
     }
   },
   defaultProps: {
@@ -3559,7 +3574,7 @@ var PricingTable = {
     ],
     background: "soft"
   },
-  render: ({ eyebrow, heading, tiers, background }) => /* @__PURE__ */ jsx31("section", { className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}`, style: { paddingTop: 64, paddingBottom: 64 }, children: /* @__PURE__ */ jsxs27("div", { className: "tps-container", children: [
+  render: ({ eyebrow, heading, tiers, background }) => /* @__PURE__ */ jsx31("section", { className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}${background === "dark" ? " tps-section-dark" : ""}`, style: { paddingTop: 64, paddingBottom: 64 }, children: /* @__PURE__ */ jsxs27("div", { className: "tps-container", children: [
     (eyebrow || heading) && /* @__PURE__ */ jsxs27("div", { style: { textAlign: "center", marginBottom: 40 }, children: [
       eyebrow && /* @__PURE__ */ jsx31("span", { className: "tps-eyebrow", children: eyebrow }),
       heading && /* @__PURE__ */ jsx31("h2", { className: "tps-h2", style: { marginTop: 8 }, children: heading })
@@ -3569,7 +3584,7 @@ var PricingTable = {
       return /* @__PURE__ */ jsxs27("div", { style: {
         position: "relative",
         padding: 28,
-        background: t.highlighted ? "var(--tps-primary)" : "#fff",
+        background: t.highlighted ? "var(--tps-primary)" : "var(--tps-bg)",
         color: t.highlighted ? "#fff" : "var(--tps-ink)",
         border: t.highlighted ? "none" : "1px solid var(--tps-line)",
         borderRadius: "var(--tps-radius)",
@@ -3627,7 +3642,7 @@ var PricingComparison = {
     background: {
       type: "radio",
       label: "Background",
-      options: [{ label: "White", value: "white" }, { label: "Soft", value: "soft" }]
+      options: [{ label: "White", value: "white" }, { label: "Soft", value: "soft" }, { label: "Dark", value: "dark" }]
     }
   },
   defaultProps: {
@@ -3646,12 +3661,12 @@ var PricingComparison = {
   },
   render: ({ eyebrow, heading, tiers, rows, background }) => {
     const tierList = tiers || [];
-    return /* @__PURE__ */ jsx32("section", { className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}`, style: { paddingTop: 56, paddingBottom: 56 }, children: /* @__PURE__ */ jsxs28("div", { className: "tps-container", style: { maxWidth: 940 }, children: [
+    return /* @__PURE__ */ jsx32("section", { className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}${background === "dark" ? " tps-section-dark" : ""}`, style: { paddingTop: 56, paddingBottom: 56 }, children: /* @__PURE__ */ jsxs28("div", { className: "tps-container", style: { maxWidth: 940 }, children: [
       (eyebrow || heading) && /* @__PURE__ */ jsxs28("div", { style: { marginBottom: 32, textAlign: "center" }, children: [
         eyebrow && /* @__PURE__ */ jsx32("span", { className: "tps-eyebrow", children: eyebrow }),
         heading && /* @__PURE__ */ jsx32("h2", { className: "tps-h2", style: { marginTop: 8 }, children: heading })
       ] }),
-      /* @__PURE__ */ jsx32("div", { style: { overflowX: "auto", border: "1px solid var(--tps-line)", borderRadius: "var(--tps-radius)", background: "#fff" }, children: /* @__PURE__ */ jsxs28("table", { style: { width: "100%", borderCollapse: "collapse" }, children: [
+      /* @__PURE__ */ jsx32("div", { style: { overflowX: "auto", border: "1px solid var(--tps-line)", borderRadius: "var(--tps-radius)", background: "var(--tps-bg)" }, children: /* @__PURE__ */ jsxs28("table", { style: { width: "100%", borderCollapse: "collapse" }, children: [
         /* @__PURE__ */ jsx32("thead", { children: /* @__PURE__ */ jsxs28("tr", { children: [
           /* @__PURE__ */ jsx32("th", { style: { textAlign: "left", padding: "14px 16px", fontSize: 13, fontWeight: 700, color: "var(--tps-muted)", borderBottom: "1px solid var(--tps-line)" }, children: "Feature" }),
           tierList.map((t, i) => /* @__PURE__ */ jsx32("th", { style: { textAlign: "center", padding: "14px 16px", fontSize: 13, fontWeight: 700, color: "var(--tps-ink)", borderBottom: "1px solid var(--tps-line)" }, children: t.name }, i))
@@ -3694,7 +3709,7 @@ var AwardsBar = {
     background: {
       type: "radio",
       label: "Background",
-      options: [{ label: "White", value: "white" }, { label: "Soft", value: "soft" }]
+      options: [{ label: "White", value: "white" }, { label: "Soft", value: "soft" }, { label: "Dark", value: "dark" }]
     }
   },
   defaultProps: {
@@ -3706,7 +3721,7 @@ var AwardsBar = {
     ],
     background: "white"
   },
-  render: ({ heading, items, background }) => /* @__PURE__ */ jsx33("section", { className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}`, style: { paddingTop: 56, paddingBottom: 56 }, children: /* @__PURE__ */ jsxs29("div", { className: "tps-container", style: { textAlign: "center" }, children: [
+  render: ({ heading, items, background }) => /* @__PURE__ */ jsx33("section", { className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}${background === "dark" ? " tps-section-dark" : ""}`, style: { paddingTop: 56, paddingBottom: 56 }, children: /* @__PURE__ */ jsxs29("div", { className: "tps-container", style: { textAlign: "center" }, children: [
     heading && /* @__PURE__ */ jsx33("h3", { style: { fontSize: 13, fontWeight: 700, letterSpacing: 1.5, color: "var(--tps-muted)", textTransform: "uppercase", marginBottom: 32 }, children: heading }),
     /* @__PURE__ */ jsx33("div", { style: { display: "grid", gridTemplateColumns: "repeat(auto-fit, minmax(min(220px, 100%), 1fr))", gap: 24 }, children: (items || []).map((a, i) => /* @__PURE__ */ jsxs29("div", { style: { display: "flex", flexDirection: "column", alignItems: "center", gap: 8, padding: 16 }, children: [
       /* @__PURE__ */ jsx33(TrophyOutlined2, { style: { fontSize: 28, color: "var(--tps-accent)" } }),
@@ -3824,7 +3839,7 @@ var ImageGallery = {
     background: {
       type: "radio",
       label: "Background",
-      options: [{ label: "White", value: "white" }, { label: "Soft", value: "soft" }]
+      options: [{ label: "White", value: "white" }, { label: "Soft", value: "soft" }, { label: "Dark", value: "dark" }]
     }
   },
   defaultProps: {
@@ -3838,7 +3853,7 @@ var ImageGallery = {
     ],
     background: "white"
   },
-  render: ({ eyebrow, heading, columns, items, background }) => /* @__PURE__ */ jsx35("section", { className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}`, style: { paddingTop: 56, paddingBottom: 56 }, children: /* @__PURE__ */ jsxs31("div", { className: "tps-container", children: [
+  render: ({ eyebrow, heading, columns, items, background }) => /* @__PURE__ */ jsx35("section", { className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}${background === "dark" ? " tps-section-dark" : ""}`, style: { paddingTop: 56, paddingBottom: 56 }, children: /* @__PURE__ */ jsxs31("div", { className: "tps-container", children: [
     (eyebrow || heading) && /* @__PURE__ */ jsxs31("div", { style: { marginBottom: 32 }, children: [
       eyebrow && /* @__PURE__ */ jsx35("span", { className: "tps-eyebrow", children: eyebrow }),
       heading && /* @__PURE__ */ jsx35("h2", { className: "tps-h2", style: { marginTop: 8 }, children: heading })
@@ -3851,7 +3866,7 @@ var ImageGallery = {
           alt: img.alt || "",
           style: { borderRadius: "var(--tps-radius)", objectFit: "cover", aspectRatio: "4 / 3", width: "100%" }
         }
-      ) : /* @__PURE__ */ jsx35("div", { style: { aspectRatio: "4 / 3", background: "#E2E8F0", borderRadius: "var(--tps-radius)", display: "flex", alignItems: "center", justifyContent: "center", color: "#94A3B8", fontSize: 12 }, children: "Image" }),
+      ) : /* @__PURE__ */ jsx35("div", { style: { aspectRatio: "4 / 3", background: "var(--tps-line)", borderRadius: "var(--tps-radius)", display: "flex", alignItems: "center", justifyContent: "center", color: "#94A3B8", fontSize: 12 }, children: "Image" }),
       img.caption && /* @__PURE__ */ jsx35("figcaption", { style: { marginTop: 6, fontSize: 12, color: "var(--tps-muted)" }, children: img.caption })
     ] }, i)) }) })
   ] }) })
@@ -3904,7 +3919,7 @@ var InlineCTA = {
     background: {
       type: "radio",
       label: "Background",
-      options: [{ label: "Soft", value: "soft" }, { label: "Primary", value: "primary" }]
+      options: [{ label: "Soft", value: "soft" }, { label: "Primary", value: "primary" }, { label: "Dark", value: "dark" }]
     }
   },
   defaultProps: {
@@ -3916,7 +3931,7 @@ var InlineCTA = {
   },
   render: ({ headline, body, button_label, button_href, background }) => {
     const primary = background === "primary";
-    return /* @__PURE__ */ jsx37("section", { className: "tps-section", style: { paddingTop: 24, paddingBottom: 24 }, children: /* @__PURE__ */ jsx37("div", { className: "tps-container", children: /* @__PURE__ */ jsxs33("div", { style: {
+    return /* @__PURE__ */ jsx37("section", { className: `tps-section${background === "dark" ? " tps-section-dark" : ""}`, style: { paddingTop: 24, paddingBottom: 24 }, children: /* @__PURE__ */ jsx37("div", { className: "tps-container", children: /* @__PURE__ */ jsxs33("div", { style: {
       display: "flex",
       flexWrap: "wrap",
       alignItems: "center",
@@ -4060,7 +4075,7 @@ var KeyValueList = {
     background: {
       type: "radio",
       label: "Background",
-      options: [{ label: "White", value: "white" }, { label: "Soft", value: "soft" }]
+      options: [{ label: "White", value: "white" }, { label: "Soft", value: "soft" }, { label: "Dark", value: "dark" }]
     }
   },
   defaultProps: {
@@ -4074,7 +4089,7 @@ var KeyValueList = {
     ],
     background: "white"
   },
-  render: ({ eyebrow, heading, items, background }) => /* @__PURE__ */ jsx41("section", { className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}`, style: { paddingTop: 48, paddingBottom: 48 }, children: /* @__PURE__ */ jsxs37("div", { className: "tps-container", style: { maxWidth: 820 }, children: [
+  render: ({ eyebrow, heading, items, background }) => /* @__PURE__ */ jsx41("section", { className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}${background === "dark" ? " tps-section-dark" : ""}`, style: { paddingTop: 48, paddingBottom: 48 }, children: /* @__PURE__ */ jsxs37("div", { className: "tps-container", style: { maxWidth: 820 }, children: [
     (eyebrow || heading) && /* @__PURE__ */ jsxs37("div", { style: { marginBottom: 24 }, children: [
       eyebrow && /* @__PURE__ */ jsx41("span", { className: "tps-eyebrow", children: eyebrow }),
       heading && /* @__PURE__ */ jsx41("h2", { className: "tps-h2", style: { marginTop: 8 }, children: heading })
@@ -4106,7 +4121,7 @@ var StepsVertical = {
     background: {
       type: "radio",
       label: "Background",
-      options: [{ label: "White", value: "white" }, { label: "Soft", value: "soft" }]
+      options: [{ label: "White", value: "white" }, { label: "Soft", value: "soft" }, { label: "Dark", value: "dark" }]
     }
   },
   defaultProps: {
@@ -4120,7 +4135,7 @@ var StepsVertical = {
     ],
     background: "white"
   },
-  render: ({ eyebrow, heading, items, background }) => /* @__PURE__ */ jsx42("section", { className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}`, style: { paddingTop: 56, paddingBottom: 56 }, children: /* @__PURE__ */ jsxs38("div", { className: "tps-container", style: { maxWidth: 820 }, children: [
+  render: ({ eyebrow, heading, items, background }) => /* @__PURE__ */ jsx42("section", { className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}${background === "dark" ? " tps-section-dark" : ""}`, style: { paddingTop: 56, paddingBottom: 56 }, children: /* @__PURE__ */ jsxs38("div", { className: "tps-container", style: { maxWidth: 820 }, children: [
     (eyebrow || heading) && /* @__PURE__ */ jsxs38("div", { style: { marginBottom: 32 }, children: [
       eyebrow && /* @__PURE__ */ jsx42("span", { className: "tps-eyebrow", children: eyebrow }),
       heading && /* @__PURE__ */ jsx42("h2", { className: "tps-h2", style: { marginTop: 8 }, children: heading })
@@ -4156,7 +4171,7 @@ var TabsBlock = {
     background: {
       type: "radio",
       label: "Background",
-      options: [{ label: "White", value: "white" }, { label: "Soft", value: "soft" }]
+      options: [{ label: "White", value: "white" }, { label: "Soft", value: "soft" }, { label: "Dark", value: "dark" }]
     }
   },
   defaultProps: {
@@ -4169,7 +4184,7 @@ var TabsBlock = {
     ],
     background: "white"
   },
-  render: ({ eyebrow, heading, items, background }) => /* @__PURE__ */ jsx43("section", { className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}`, style: { paddingTop: 56, paddingBottom: 56 }, children: /* @__PURE__ */ jsxs39("div", { className: "tps-container", style: { maxWidth: 920 }, children: [
+  render: ({ eyebrow, heading, items, background }) => /* @__PURE__ */ jsx43("section", { className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}${background === "dark" ? " tps-section-dark" : ""}`, style: { paddingTop: 56, paddingBottom: 56 }, children: /* @__PURE__ */ jsxs39("div", { className: "tps-container", style: { maxWidth: 920 }, children: [
     (eyebrow || heading) && /* @__PURE__ */ jsxs39("div", { style: { marginBottom: 32 }, children: [
       eyebrow && /* @__PURE__ */ jsx43("span", { className: "tps-eyebrow", children: eyebrow }),
       heading && /* @__PURE__ */ jsx43("h2", { className: "tps-h2", style: { marginTop: 8 }, children: heading })
@@ -4213,7 +4228,7 @@ var AccordionBlock = {
     background: {
       type: "radio",
       label: "Background",
-      options: [{ label: "White", value: "white" }, { label: "Soft", value: "soft" }]
+      options: [{ label: "White", value: "white" }, { label: "Soft", value: "soft" }, { label: "Dark", value: "dark" }]
     }
   },
   defaultProps: {
@@ -4226,7 +4241,7 @@ var AccordionBlock = {
     multiple_open: false,
     background: "white"
   },
-  render: ({ eyebrow, heading, items, multiple_open, background }) => /* @__PURE__ */ jsx44("section", { className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}`, style: { paddingTop: 48, paddingBottom: 48 }, children: /* @__PURE__ */ jsxs40("div", { className: "tps-container", style: { maxWidth: 820 }, children: [
+  render: ({ eyebrow, heading, items, multiple_open, background }) => /* @__PURE__ */ jsx44("section", { className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}${background === "dark" ? " tps-section-dark" : ""}`, style: { paddingTop: 48, paddingBottom: 48 }, children: /* @__PURE__ */ jsxs40("div", { className: "tps-container", style: { maxWidth: 820 }, children: [
     (eyebrow || heading) && /* @__PURE__ */ jsxs40("div", { style: { marginBottom: 24 }, children: [
       eyebrow && /* @__PURE__ */ jsx44("span", { className: "tps-eyebrow", children: eyebrow }),
       heading && /* @__PURE__ */ jsx44("h2", { className: "tps-h2", style: { marginTop: 8 }, children: heading })
@@ -4242,7 +4257,7 @@ var AccordionBlock = {
           key: String(i),
           label: /* @__PURE__ */ jsx44("span", { style: { fontSize: 15, fontWeight: 600, color: "var(--tps-ink)" }, children: it.title }),
           children: /* @__PURE__ */ jsx44("div", { style: { color: "var(--tps-ink-2)", lineHeight: 1.7 }, dangerouslySetInnerHTML: { __html: it.content_html || "" } }),
-          style: { background: "#fff", border: "1px solid var(--tps-line)", borderRadius: "var(--tps-radius)", marginBottom: 10, overflow: "hidden" }
+          style: { background: "var(--tps-bg)", border: "1px solid var(--tps-line)", borderRadius: "var(--tps-radius)", marginBottom: 10, overflow: "hidden" }
         }))
       }
     )
@@ -4297,7 +4312,7 @@ var SocialLinks = {
     background: {
       type: "radio",
       label: "Background",
-      options: [{ label: "White", value: "white" }, { label: "Soft", value: "soft" }]
+      options: [{ label: "White", value: "white" }, { label: "Soft", value: "soft" }, { label: "Dark", value: "dark" }]
     }
   },
   defaultProps: {
@@ -4310,7 +4325,7 @@ var SocialLinks = {
     ],
     background: "white"
   },
-  render: ({ label, align, items, background }) => /* @__PURE__ */ jsx45("section", { className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}`, style: { paddingTop: 32, paddingBottom: 32 }, children: /* @__PURE__ */ jsxs41("div", { className: "tps-container", style: { textAlign: align }, children: [
+  render: ({ label, align, items, background }) => /* @__PURE__ */ jsx45("section", { className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}${background === "dark" ? " tps-section-dark" : ""}`, style: { paddingTop: 32, paddingBottom: 32 }, children: /* @__PURE__ */ jsxs41("div", { className: "tps-container", style: { textAlign: align }, children: [
     label && /* @__PURE__ */ jsx45("div", { style: { fontSize: 12, fontWeight: 700, letterSpacing: 1.5, color: "var(--tps-muted)", textTransform: "uppercase", marginBottom: 12 }, children: label }),
     /* @__PURE__ */ jsx45("div", { style: { display: "inline-flex", gap: 14 }, children: (items || []).filter((l) => l.href).map((l, i) => {
       const Icon = (NETWORKS[l.network] || NETWORKS.linkedin).icon;
@@ -4345,7 +4360,7 @@ var ContactInfo = {
     background: {
       type: "radio",
       label: "Background",
-      options: [{ label: "White", value: "white" }, { label: "Soft", value: "soft" }]
+      options: [{ label: "White", value: "white" }, { label: "Soft", value: "soft" }, { label: "Dark", value: "dark" }]
     }
   },
   defaultProps: {
@@ -4357,12 +4372,12 @@ var ContactInfo = {
     hours: "Mon\u2013Fri \xB7 09:00\u201318:00",
     background: "soft"
   },
-  render: ({ eyebrow, heading, email, phone, address, hours, background }) => /* @__PURE__ */ jsx46("section", { className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}`, style: { paddingTop: 48, paddingBottom: 48 }, children: /* @__PURE__ */ jsxs42("div", { className: "tps-container", style: { maxWidth: 720 }, children: [
+  render: ({ eyebrow, heading, email, phone, address, hours, background }) => /* @__PURE__ */ jsx46("section", { className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}${background === "dark" ? " tps-section-dark" : ""}`, style: { paddingTop: 48, paddingBottom: 48 }, children: /* @__PURE__ */ jsxs42("div", { className: "tps-container", style: { maxWidth: 720 }, children: [
     (eyebrow || heading) && /* @__PURE__ */ jsxs42("div", { style: { marginBottom: 24 }, children: [
       eyebrow && /* @__PURE__ */ jsx46("span", { className: "tps-eyebrow", children: eyebrow }),
       heading && /* @__PURE__ */ jsx46("h2", { className: "tps-h2", style: { marginTop: 8 }, children: heading })
     ] }),
-    /* @__PURE__ */ jsx46("div", { style: { background: "#fff", border: "1px solid var(--tps-line)", borderRadius: "var(--tps-radius)", padding: 28 }, children: /* @__PURE__ */ jsxs42("div", { style: { display: "grid", gridTemplateColumns: "repeat(auto-fit, minmax(min(200px, 100%), 1fr))", gap: 20 }, children: [
+    /* @__PURE__ */ jsx46("div", { style: { background: "var(--tps-bg)", border: "1px solid var(--tps-line)", borderRadius: "var(--tps-radius)", padding: 28 }, children: /* @__PURE__ */ jsxs42("div", { style: { display: "grid", gridTemplateColumns: "repeat(auto-fit, minmax(min(200px, 100%), 1fr))", gap: 20 }, children: [
       email && /* @__PURE__ */ jsxs42("div", { children: [
         /* @__PURE__ */ jsxs42("div", { style: { display: "flex", alignItems: "center", gap: 8, color: "var(--tps-muted)", fontSize: 12, fontWeight: 700, letterSpacing: 1, textTransform: "uppercase", marginBottom: 6 }, children: [
           /* @__PURE__ */ jsx46(MailOutlined3, {}),
@@ -4423,9 +4438,935 @@ var MapEmbed = {
   ] }) })
 };
 
+// src/blocks/_FormBlockBase.jsx
+import { useState as useState5 } from "react";
+import { Form as Form4, Row as Row2, Col as Col2, Button as Button10, App as AntdApp3 } from "antd";
+import { SendOutlined as SendOutlined2, CheckCircleOutlined as CheckCircleOutlined2 } from "@ant-design/icons";
+
+// src/blocks/_DynamicFormField.jsx
+import {
+  Form as Form3,
+  Input as Input3,
+  Select as Select2,
+  Radio,
+  Checkbox,
+  DatePicker,
+  Rate,
+  InputNumber,
+  Upload,
+  Button as Button9
+} from "antd";
+import { UploadOutlined } from "@ant-design/icons";
+import { jsx as jsx48 } from "react/jsx-runtime";
+var COUNTRY_OPTIONS = [
+  { value: "AU", label: "Australia" },
+  { value: "AT", label: "Austria" },
+  { value: "BE", label: "Belgium" },
+  { value: "BR", label: "Brazil" },
+  { value: "CA", label: "Canada" },
+  { value: "CN", label: "China" },
+  { value: "DK", label: "Denmark" },
+  { value: "EG", label: "Egypt" },
+  { value: "FI", label: "Finland" },
+  { value: "FR", label: "France" },
+  { value: "DE", label: "Germany" },
+  { value: "GH", label: "Ghana" },
+  { value: "GR", label: "Greece" },
+  { value: "HK", label: "Hong Kong" },
+  { value: "IN", label: "India" },
+  { value: "ID", label: "Indonesia" },
+  { value: "IE", label: "Ireland" },
+  { value: "IL", label: "Israel" },
+  { value: "IT", label: "Italy" },
+  { value: "JP", label: "Japan" },
+  { value: "KE", label: "Kenya" },
+  { value: "MY", label: "Malaysia" },
+  { value: "MX", label: "Mexico" },
+  { value: "NL", label: "Netherlands" },
+  { value: "NZ", label: "New Zealand" },
+  { value: "NG", label: "Nigeria" },
+  { value: "NO", label: "Norway" },
+  { value: "PK", label: "Pakistan" },
+  { value: "PH", label: "Philippines" },
+  { value: "PL", label: "Poland" },
+  { value: "PT", label: "Portugal" },
+  { value: "QA", label: "Qatar" },
+  { value: "SA", label: "Saudi Arabia" },
+  { value: "SG", label: "Singapore" },
+  { value: "ZA", label: "South Africa" },
+  { value: "KR", label: "South Korea" },
+  { value: "ES", label: "Spain" },
+  { value: "SE", label: "Sweden" },
+  { value: "CH", label: "Switzerland" },
+  { value: "TW", label: "Taiwan" },
+  { value: "TH", label: "Thailand" },
+  { value: "TR", label: "Turkey" },
+  { value: "AE", label: "UAE" },
+  { value: "GB", label: "United Kingdom" },
+  { value: "US", label: "United States" },
+  { value: "VN", label: "Vietnam" }
+];
+var GENDER_OPTIONS = [
+  { value: "male", label: "Male" },
+  { value: "female", label: "Female" },
+  { value: "nonbinary", label: "Non-binary" },
+  { value: "prefer_not", label: "Prefer not to say" }
+];
+function parseOptions(str) {
+  if (!str) return [];
+  return str.split("\n").map((s) => s.trim()).filter(Boolean).map((s) => ({ value: s, label: s }));
+}
+function buildRules(field) {
+  const isRequired = field.required === "yes" || field.required === true;
+  const rules = [];
+  if (isRequired) {
+    rules.push({ required: true, message: `${field.label || "This field"} is required` });
+  }
+  switch (field.validation) {
+    case "email":
+      rules.push({ type: "email", message: "Enter a valid email address" });
+      break;
+    case "url":
+      rules.push({ type: "url", message: "Enter a valid URL" });
+      break;
+    case "phone":
+      rules.push({ pattern: /^\+?[\d\s\-().]{7,20}$/, message: "Enter a valid phone number" });
+      break;
+    case "number_positive":
+      rules.push({ type: "number", min: 0, message: "Must be a positive number" });
+      break;
+    case "min6":
+      rules.push({ min: 6, message: "Must be at least 6 characters" });
+      break;
+    case "min8":
+      rules.push({ min: 8, message: "Must be at least 8 characters" });
+      break;
+    default:
+      break;
+  }
+  return rules;
+}
+function DynamicFormField({ field }) {
+  const {
+    field_type = "text",
+    field_key,
+    label,
+    placeholder,
+    help_text,
+    options,
+    default_value
+  } = field;
+  if (!field_key) return null;
+  const rules = buildRules(field);
+  const opts = parseOptions(options);
+  const lg = { size: "large" };
+  if (field_type === "upload") {
+    return /* @__PURE__ */ jsx48(
+      Form3.Item,
+      {
+        name: field_key,
+        label,
+        valuePropName: "fileList",
+        getValueFromEvent: (e) => Array.isArray(e) ? e : e?.fileList,
+        rules,
+        help: help_text || void 0,
+        children: /* @__PURE__ */ jsx48(Upload, { beforeUpload: () => false, children: /* @__PURE__ */ jsx48(Button9, { icon: /* @__PURE__ */ jsx48(UploadOutlined, {}), children: placeholder || "Choose file" }) })
+      }
+    );
+  }
+  if (field_type === "checkbox") {
+    const isRequired = field.required === "yes" || field.required === true;
+    return /* @__PURE__ */ jsx48(
+      Form3.Item,
+      {
+        name: field_key,
+        valuePropName: "checked",
+        rules: isRequired ? [
+          {
+            validator: (_, value) => value ? Promise.resolve() : Promise.reject(
+              new Error(help_text || `${label || "This field"} is required`)
+            )
+          }
+        ] : [],
+        style: { marginBottom: 16 },
+        children: /* @__PURE__ */ jsx48(Checkbox, { children: label })
+      }
+    );
+  }
+  const initialValue = field_type === "date" || field_type === "rating" ? void 0 : default_value || void 0;
+  let control;
+  switch (field_type) {
+    case "email":
+      control = /* @__PURE__ */ jsx48(Input3, { ...lg, placeholder, type: "email" });
+      break;
+    case "tel":
+      control = /* @__PURE__ */ jsx48(Input3, { ...lg, placeholder, type: "tel" });
+      break;
+    case "textarea":
+      control = /* @__PURE__ */ jsx48(Input3.TextArea, { rows: 4, placeholder });
+      break;
+    case "number":
+      control = /* @__PURE__ */ jsx48(InputNumber, { size: "large", style: { width: "100%" }, placeholder });
+      break;
+    case "currency":
+      control = /* @__PURE__ */ jsx48(
+        InputNumber,
+        {
+          size: "large",
+          style: { width: "100%" },
+          placeholder,
+          prefix: "$",
+          precision: 2,
+          formatter: (v) => `${v}`.replace(/\B(?=(\d{3})+(?!\d))/g, ","),
+          parser: (v) => v?.replace(/[^\d.]/g, "")
+        }
+      );
+      break;
+    case "select":
+      control = /* @__PURE__ */ jsx48(Select2, { ...lg, placeholder, options: opts });
+      break;
+    case "multiselect":
+      control = /* @__PURE__ */ jsx48(Select2, { ...lg, mode: "multiple", placeholder, options: opts });
+      break;
+    case "radio":
+      control = /* @__PURE__ */ jsx48(Radio.Group, { options: opts });
+      break;
+    case "checkbox_group":
+      control = /* @__PURE__ */ jsx48(Checkbox.Group, { options: opts });
+      break;
+    case "date":
+      control = /* @__PURE__ */ jsx48(DatePicker, { size: "large", style: { width: "100%" }, placeholder });
+      break;
+    case "rating":
+      control = /* @__PURE__ */ jsx48(Rate, {});
+      break;
+    case "country":
+      control = /* @__PURE__ */ jsx48(
+        Select2,
+        {
+          ...lg,
+          showSearch: true,
+          placeholder: placeholder || "Select country",
+          options: COUNTRY_OPTIONS,
+          filterOption: (input, opt) => opt.label.toLowerCase().includes(input.toLowerCase())
+        }
+      );
+      break;
+    case "gender":
+      control = /* @__PURE__ */ jsx48(Select2, { ...lg, placeholder: placeholder || "Select gender", options: GENDER_OPTIONS });
+      break;
+    case "otp":
+      control = /* @__PURE__ */ jsx48(Input3.OTP, { length: 6 });
+      break;
+    default:
+      control = /* @__PURE__ */ jsx48(Input3, { ...lg, placeholder });
+  }
+  return /* @__PURE__ */ jsx48(
+    Form3.Item,
+    {
+      label,
+      name: field_key,
+      rules,
+      help: help_text || void 0,
+      initialValue,
+      children: control
+    }
+  );
+}
+
+// src/blocks/_FormBlockBase.jsx
+import { jsx as jsx49, jsxs as jsxs44 } from "react/jsx-runtime";
+var FORM_FIELD_ARRAY_DEF = {
+  type: "array",
+  label: "Form fields",
+  arrayFields: {
+    field_type: {
+      type: "select",
+      label: "Field type",
+      options: [
+        { value: "text", label: "Text" },
+        { value: "email", label: "Email" },
+        { value: "tel", label: "Phone" },
+        { value: "textarea", label: "Long text" },
+        { value: "number", label: "Number" },
+        { value: "currency", label: "Currency" },
+        { value: "select", label: "Dropdown (single)" },
+        { value: "multiselect", label: "Dropdown (multiple)" },
+        { value: "radio", label: "Radio buttons" },
+        { value: "checkbox", label: "Checkbox / agree" },
+        { value: "checkbox_group", label: "Checkbox group" },
+        { value: "date", label: "Date picker" },
+        { value: "rating", label: "Star rating" },
+        { value: "upload", label: "File upload" },
+        { value: "country", label: "Country select" },
+        { value: "gender", label: "Gender select" },
+        { value: "otp", label: "OTP code" }
+      ]
+    },
+    field_key: { type: "text", label: "Field key (unique identifier)" },
+    label: { type: "text", label: "Label" },
+    placeholder: { type: "text", label: "Placeholder text" },
+    required: {
+      type: "radio",
+      label: "Required",
+      options: [
+        { value: "no", label: "No" },
+        { value: "yes", label: "Yes" }
+      ]
+    },
+    width: {
+      type: "radio",
+      label: "Width",
+      options: [
+        { value: "full", label: "Full width" },
+        { value: "half", label: "Half width" }
+      ]
+    },
+    options: {
+      type: "textarea",
+      label: "Options \u2014 one per line (dropdown, radio, checkboxes)"
+    },
+    default_value: { type: "text", label: "Default value" },
+    help_text: { type: "text", label: "Help / hint text" },
+    validation: {
+      type: "select",
+      label: "Validation preset",
+      options: [
+        { value: "none", label: "None" },
+        { value: "email", label: "Email format" },
+        { value: "phone", label: "Phone format" },
+        { value: "url", label: "URL / website" },
+        { value: "number_positive", label: "Positive number" },
+        { value: "min6", label: "Min. 6 characters" },
+        { value: "min8", label: "Min. 8 characters" }
+      ]
+    }
+  },
+  getItemSummary: (item, i) => `${item?.label || item?.field_key || `Field ${i + 1}`} (${item?.field_type || "text"})`,
+  defaultItemProps: {
+    field_type: "text",
+    field_key: "",
+    label: "New field",
+    placeholder: "",
+    required: "no",
+    width: "full",
+    options: "",
+    default_value: "",
+    help_text: "",
+    validation: "none"
+  }
+};
+var COMMON_FORM_FIELDS = {
+  form_heading: { type: "text", label: "Heading" },
+  form_lede: { type: "textarea", label: "Lede" },
+  form_submit_label: { type: "text", label: "Submit button label" },
+  form_privacy_html: { type: "textarea", label: "Privacy footer (HTML allowed)" },
+  success_heading: { type: "text", label: "Success heading" },
+  success_body: { type: "textarea", label: "Success body" },
+  background: {
+    type: "radio",
+    label: "Background",
+    options: [
+      { label: "White", value: "white" },
+      { label: "Soft", value: "soft" },
+      { label: "Dark", value: "dark" }
+    ]
+  },
+  fields: FORM_FIELD_ARRAY_DEF
+};
+var COMMON_FORM_DEFAULTS = {
+  form_heading: "",
+  form_lede: "",
+  form_submit_label: "Submit",
+  form_privacy_html: "We respect your privacy. Your information is kept secure and never sold.",
+  success_heading: "Thank you.",
+  success_body: "We've received your submission and will be in touch shortly.",
+  background: "white"
+};
+function groupIntoRows(fields) {
+  const rows = [];
+  let buffer = [];
+  for (const f of fields) {
+    if (!f?.field_key) continue;
+    if (f.width === "half") {
+      buffer.push(f);
+      if (buffer.length === 2) {
+        rows.push(buffer);
+        buffer = [];
+      }
+    } else {
+      if (buffer.length > 0) {
+        rows.push(buffer);
+        buffer = [];
+      }
+      rows.push([f]);
+    }
+  }
+  if (buffer.length > 0) rows.push(buffer);
+  return rows;
+}
+function SuccessState({ heading, body, onReset }) {
+  return /* @__PURE__ */ jsxs44("div", { style: { textAlign: "center", padding: "48px 24px" }, children: [
+    /* @__PURE__ */ jsx49(
+      CheckCircleOutlined2,
+      {
+        style: { fontSize: 48, color: "var(--tps-primary, #0b60d8)", marginBottom: 20 }
+      }
+    ),
+    heading && /* @__PURE__ */ jsx49("h3", { className: "tps-h3", style: { marginBottom: 12 }, children: heading }),
+    body && /* @__PURE__ */ jsx49("p", { className: "tps-lede", style: { margin: "0 auto 24px", maxWidth: 480 }, children: body }),
+    /* @__PURE__ */ jsx49(Button10, { type: "link", onClick: onReset, style: { padding: 0 }, children: "Submit another response" })
+  ] });
+}
+function FormBlockBase({
+  form_heading,
+  form_lede,
+  form_submit_label,
+  form_privacy_html,
+  success_heading,
+  success_body,
+  background = "white",
+  fields = []
+}) {
+  const [form] = Form4.useForm();
+  const { message } = AntdApp3.useApp();
+  const { submitLead, track } = useStudio();
+  const [submitting, setSubmitting] = useState5(false);
+  const [submitted, setSubmitted] = useState5(false);
+  const [started, setStarted] = useState5(false);
+  const validFields = Array.isArray(fields) ? fields.filter((f) => f?.field_key && f?.field_type) : [];
+  const rows = groupIntoRows(validFields);
+  const onFinish = async (values) => {
+    setSubmitting(true);
+    try {
+      await submitLead({ ...values, source: "form_block" });
+      track("form_submit");
+      form.resetFields();
+      setSubmitted(true);
+    } catch (err) {
+      message.error(err?.message || "Something went wrong. Please try again.");
+    } finally {
+      setSubmitting(false);
+    }
+  };
+  const onValuesChange = () => {
+    if (!started) {
+      setStarted(true);
+      track("form_start");
+    }
+  };
+  return /* @__PURE__ */ jsx49(
+    "section",
+    {
+      className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}${background === "dark" ? " tps-section-dark" : ""}`,
+      children: /* @__PURE__ */ jsxs44("div", { className: "tps-container", children: [
+        (form_heading || form_lede) && /* @__PURE__ */ jsxs44("div", { style: { marginBottom: 40, maxWidth: 640 }, children: [
+          form_heading && /* @__PURE__ */ jsx49("h2", { className: "tps-h2", children: form_heading }),
+          form_lede && /* @__PURE__ */ jsx49("p", { className: "tps-lede", style: { marginBottom: 0 }, children: form_lede })
+        ] }),
+        /* @__PURE__ */ jsx49("div", { className: "tps-form-card", style: { maxWidth: 720 }, children: submitted ? /* @__PURE__ */ jsx49(
+          SuccessState,
+          {
+            heading: success_heading,
+            body: success_body,
+            onReset: () => setSubmitted(false)
+          }
+        ) : /* @__PURE__ */ jsxs44(
+          Form4,
+          {
+            form,
+            layout: "vertical",
+            onFinish,
+            onValuesChange,
+            requiredMark: false,
+            children: [
+              rows.map((row, ri) => /* @__PURE__ */ jsx49(Row2, { gutter: 16, children: row.map((field) => /* @__PURE__ */ jsx49(Col2, { xs: 24, sm: row.length > 1 ? 12 : 24, children: /* @__PURE__ */ jsx49(DynamicFormField, { field }) }, field.field_key)) }, ri)),
+              /* @__PURE__ */ jsx49(Form4.Item, { style: { marginTop: 8, marginBottom: 0 }, children: /* @__PURE__ */ jsx49(
+                Button10,
+                {
+                  type: "primary",
+                  size: "large",
+                  htmlType: "submit",
+                  loading: submitting,
+                  icon: /* @__PURE__ */ jsx49(SendOutlined2, {}),
+                  style: { minWidth: 180, height: 48, fontWeight: 600 },
+                  children: form_submit_label || "Submit"
+                }
+              ) }),
+              form_privacy_html && /* @__PURE__ */ jsx49(
+                "p",
+                {
+                  style: {
+                    fontSize: 13,
+                    color: "var(--tps-muted)",
+                    marginTop: 16,
+                    marginBottom: 0
+                  },
+                  dangerouslySetInnerHTML: { __html: form_privacy_html }
+                }
+              )
+            ]
+          }
+        ) })
+      ] })
+    }
+  );
+}
+
+// src/blocks/FormContact.jsx
+import { jsx as jsx50 } from "react/jsx-runtime";
+var FormContact = {
+  label: "Contact form",
+  fields: COMMON_FORM_FIELDS,
+  defaultProps: {
+    ...COMMON_FORM_DEFAULTS,
+    form_heading: "Get in touch",
+    form_lede: "Have a question or want to work together? Fill in the form and we'll get back to you within one business day.",
+    form_submit_label: "Send message",
+    fields: [
+      { field_type: "text", field_key: "full_name", label: "Full name", placeholder: "Your name", required: "yes", width: "half", validation: "none", options: "", default_value: "", help_text: "" },
+      { field_type: "email", field_key: "email", label: "Work email", placeholder: "you@company.com", required: "yes", width: "half", validation: "email", options: "", default_value: "", help_text: "" },
+      { field_type: "tel", field_key: "phone", label: "Phone", placeholder: "+1 555 000 0000", required: "no", width: "half", validation: "phone", options: "", default_value: "", help_text: "Optional" },
+      { field_type: "text", field_key: "organization", label: "Organization", placeholder: "Your company", required: "yes", width: "half", validation: "none", options: "", default_value: "", help_text: "" },
+      { field_type: "textarea", field_key: "message", label: "Message", placeholder: "What's on your mind?", required: "yes", width: "full", validation: "none", options: "", default_value: "", help_text: "" }
+    ]
+  },
+  render: (props) => /* @__PURE__ */ jsx50(FormBlockBase, { ...props })
+};
+
+// src/blocks/FormLeadCapture.jsx
+import { jsx as jsx51 } from "react/jsx-runtime";
+var FormLeadCapture = {
+  label: "Lead capture form",
+  fields: COMMON_FORM_FIELDS,
+  defaultProps: {
+    ...COMMON_FORM_DEFAULTS,
+    form_heading: "Tell us about your project",
+    form_lede: "Share a few details and we'll come prepared with ideas specific to your situation.",
+    form_submit_label: "Start the conversation",
+    fields: [
+      { field_type: "text", field_key: "full_name", label: "Full name", placeholder: "Your name", required: "yes", width: "half", validation: "none", options: "", default_value: "", help_text: "" },
+      { field_type: "email", field_key: "email", label: "Work email", placeholder: "you@company.com", required: "yes", width: "half", validation: "email", options: "", default_value: "", help_text: "" },
+      { field_type: "text", field_key: "company", label: "Company", placeholder: "Your organisation", required: "yes", width: "half", validation: "none", options: "", default_value: "", help_text: "" },
+      { field_type: "tel", field_key: "phone", label: "Phone", placeholder: "+1 555 000 0000", required: "no", width: "half", validation: "phone", options: "", default_value: "", help_text: "Optional" },
+      {
+        field_type: "select",
+        field_key: "stage",
+        label: "Where are you in your journey?",
+        placeholder: "Select the stage that fits best",
+        required: "no",
+        width: "full",
+        validation: "none",
+        options: "Just exploring\nStarting a new project\nImproving an existing process\nNeed help with strategy\nOther",
+        default_value: "",
+        help_text: ""
+      },
+      {
+        field_type: "multiselect",
+        field_key: "interests",
+        label: "Which capabilities interest you?",
+        placeholder: "Pick one or more (optional)",
+        required: "no",
+        width: "full",
+        validation: "none",
+        options: "Product design\nEngineering\nData & analytics\nMarketing\nStrategy\nOther",
+        default_value: "",
+        help_text: ""
+      },
+      { field_type: "textarea", field_key: "message", label: "Anything else to share?", placeholder: "Current systems, target markets, challenges\u2026", required: "no", width: "full", validation: "none", options: "", default_value: "", help_text: "" }
+    ]
+  },
+  render: (props) => /* @__PURE__ */ jsx51(FormBlockBase, { ...props })
+};
+
+// src/blocks/FormNewsletter.jsx
+import { jsx as jsx52 } from "react/jsx-runtime";
+var FormNewsletter = {
+  label: "Newsletter form",
+  fields: COMMON_FORM_FIELDS,
+  defaultProps: {
+    ...COMMON_FORM_DEFAULTS,
+    form_heading: "Stay in the loop",
+    form_lede: "Join our newsletter for updates, articles, and early access to new features.",
+    form_submit_label: "Subscribe",
+    success_heading: "You're subscribed.",
+    success_body: "Thank you for subscribing. Check your inbox for a confirmation email.",
+    fields: [
+      { field_type: "text", field_key: "full_name", label: "Name", placeholder: "Your name", required: "yes", width: "half", validation: "none", options: "", default_value: "", help_text: "" },
+      { field_type: "email", field_key: "email", label: "Email", placeholder: "you@example.com", required: "yes", width: "half", validation: "email", options: "", default_value: "", help_text: "" },
+      { field_type: "checkbox", field_key: "consent", label: "I agree to receive marketing emails. Unsubscribe any time.", placeholder: "", required: "yes", width: "full", validation: "none", options: "", default_value: "", help_text: "" }
+    ]
+  },
+  render: (props) => /* @__PURE__ */ jsx52(FormBlockBase, { ...props })
+};
+
+// src/blocks/FormFeedback.jsx
+import { jsx as jsx53 } from "react/jsx-runtime";
+var FormFeedback = {
+  label: "Feedback form",
+  fields: COMMON_FORM_FIELDS,
+  defaultProps: {
+    ...COMMON_FORM_DEFAULTS,
+    form_heading: "Share your feedback",
+    form_lede: "Your honest opinion helps us improve. Takes less than two minutes.",
+    form_submit_label: "Submit feedback",
+    success_heading: "Feedback received.",
+    success_body: "Thank you \u2014 every response shapes what we build next.",
+    fields: [
+      { field_type: "rating", field_key: "rating", label: "Overall rating", placeholder: "", required: "yes", width: "full", validation: "none", options: "", default_value: "", help_text: "1 = poor, 5 = excellent" },
+      {
+        field_type: "select",
+        field_key: "category",
+        label: "Feedback category",
+        placeholder: "What's this about?",
+        required: "no",
+        width: "full",
+        validation: "none",
+        options: "Product quality\nCustomer support\nWebsite experience\nPricing\nOther",
+        default_value: "",
+        help_text: ""
+      },
+      { field_type: "textarea", field_key: "comments", label: "Your comments", placeholder: "Tell us what you loved or what we could do better\u2026", required: "yes", width: "full", validation: "none", options: "", default_value: "", help_text: "" },
+      { field_type: "text", field_key: "full_name", label: "Name", placeholder: "Your name", required: "no", width: "half", validation: "none", options: "", default_value: "", help_text: "Optional" },
+      { field_type: "email", field_key: "email", label: "Email", placeholder: "you@example.com", required: "no", width: "half", validation: "email", options: "", default_value: "", help_text: "Optional \u2014 if you'd like a reply" }
+    ]
+  },
+  render: (props) => /* @__PURE__ */ jsx53(FormBlockBase, { ...props })
+};
+
+// src/blocks/FormSurvey.jsx
+import { jsx as jsx54 } from "react/jsx-runtime";
+var FormSurvey = {
+  label: "Survey form",
+  fields: COMMON_FORM_FIELDS,
+  defaultProps: {
+    ...COMMON_FORM_DEFAULTS,
+    form_heading: "Quick survey",
+    form_lede: "Three questions, under two minutes. Your answers help us get better.",
+    form_submit_label: "Submit survey",
+    success_heading: "Survey submitted.",
+    success_body: "Thank you for taking the time. Your input is genuinely valued.",
+    fields: [
+      { field_type: "rating", field_key: "satisfaction", label: "How satisfied are you overall?", placeholder: "", required: "yes", width: "full", validation: "none", options: "", default_value: "", help_text: "1 = very dissatisfied \xB7 5 = very satisfied" },
+      {
+        field_type: "radio",
+        field_key: "recommend",
+        label: "Would you recommend us to a colleague?",
+        placeholder: "",
+        required: "yes",
+        width: "full",
+        validation: "none",
+        options: "Definitely yes\nProbably yes\nNot sure\nProbably not\nDefinitely not",
+        default_value: "",
+        help_text: ""
+      },
+      { field_type: "textarea", field_key: "improvements", label: "What could we do better?", placeholder: "Any suggestions are welcome\u2026", required: "no", width: "full", validation: "none", options: "", default_value: "", help_text: "Optional" },
+      { field_type: "text", field_key: "full_name", label: "Name", placeholder: "Your name", required: "no", width: "half", validation: "none", options: "", default_value: "", help_text: "Optional" },
+      { field_type: "email", field_key: "email", label: "Email", placeholder: "you@example.com", required: "no", width: "half", validation: "email", options: "", default_value: "", help_text: "Optional" }
+    ]
+  },
+  render: (props) => /* @__PURE__ */ jsx54(FormBlockBase, { ...props })
+};
+
+// src/blocks/FormBooking.jsx
+import { jsx as jsx55 } from "react/jsx-runtime";
+var FormBooking = {
+  label: "Booking / demo form",
+  fields: COMMON_FORM_FIELDS,
+  defaultProps: {
+    ...COMMON_FORM_DEFAULTS,
+    form_heading: "Book a demo",
+    form_lede: "Pick a date and time that works for you. We'll send a calendar invite within a few hours.",
+    form_submit_label: "Request booking",
+    success_heading: "Request received.",
+    success_body: "We'll confirm your booking by email within a few hours.",
+    fields: [
+      { field_type: "text", field_key: "full_name", label: "Full name", placeholder: "Your name", required: "yes", width: "half", validation: "none", options: "", default_value: "", help_text: "" },
+      { field_type: "email", field_key: "email", label: "Email", placeholder: "you@company.com", required: "yes", width: "half", validation: "email", options: "", default_value: "", help_text: "" },
+      { field_type: "text", field_key: "company", label: "Company", placeholder: "Your organisation", required: "yes", width: "full", validation: "none", options: "", default_value: "", help_text: "" },
+      { field_type: "date", field_key: "preferred_date", label: "Preferred date", placeholder: "Pick a date", required: "yes", width: "half", validation: "none", options: "", default_value: "", help_text: "" },
+      {
+        field_type: "select",
+        field_key: "preferred_time",
+        label: "Preferred time",
+        placeholder: "Select a slot",
+        required: "yes",
+        width: "half",
+        validation: "none",
+        options: "Morning (9 am \u2013 12 pm)\nAfternoon (12 pm \u2013 5 pm)\nEvening (5 pm \u2013 7 pm)",
+        default_value: "",
+        help_text: ""
+      },
+      { field_type: "textarea", field_key: "notes", label: "Anything to prepare?", placeholder: "Topics, questions, or context that would help us tailor the session\u2026", required: "no", width: "full", validation: "none", options: "", default_value: "", help_text: "Optional" }
+    ]
+  },
+  render: (props) => /* @__PURE__ */ jsx55(FormBlockBase, { ...props })
+};
+
+// src/blocks/FormRegistration.jsx
+import { jsx as jsx56 } from "react/jsx-runtime";
+var FormRegistration = {
+  label: "Registration form",
+  fields: COMMON_FORM_FIELDS,
+  defaultProps: {
+    ...COMMON_FORM_DEFAULTS,
+    form_heading: "Register for the event",
+    form_lede: "Secure your spot. We'll email your confirmation and joining instructions.",
+    form_submit_label: "Register now",
+    success_heading: "You're registered.",
+    success_body: "Check your inbox for a confirmation email with all the details.",
+    fields: [
+      { field_type: "text", field_key: "full_name", label: "Full name", placeholder: "Your name", required: "yes", width: "half", validation: "none", options: "", default_value: "", help_text: "" },
+      { field_type: "email", field_key: "email", label: "Email", placeholder: "you@company.com", required: "yes", width: "half", validation: "email", options: "", default_value: "", help_text: "" },
+      { field_type: "tel", field_key: "phone", label: "Phone", placeholder: "+1 555 000 0000", required: "no", width: "half", validation: "phone", options: "", default_value: "", help_text: "Optional" },
+      { field_type: "text", field_key: "company", label: "Organisation", placeholder: "Your company", required: "no", width: "half", validation: "none", options: "", default_value: "", help_text: "Optional" },
+      {
+        field_type: "select",
+        field_key: "role",
+        label: "Your role",
+        placeholder: "Select your role",
+        required: "no",
+        width: "half",
+        validation: "none",
+        options: "Developer\nDesigner\nProduct manager\nMarketer\nFounder / exec\nStudent\nOther",
+        default_value: "",
+        help_text: ""
+      },
+      {
+        field_type: "select",
+        field_key: "tshirt_size",
+        label: "T-shirt size",
+        placeholder: "Select size",
+        required: "no",
+        width: "half",
+        validation: "none",
+        options: "XS\nS\nM\nL\nXL\nXXL",
+        default_value: "",
+        help_text: "Optional \u2014 if swag is included"
+      },
+      {
+        field_type: "select",
+        field_key: "dietary",
+        label: "Dietary requirements",
+        placeholder: "Select one",
+        required: "no",
+        width: "full",
+        validation: "none",
+        options: "No restrictions\nVegetarian\nVegan\nGluten-free\nHalal\nKosher\nOther",
+        default_value: "No restrictions",
+        help_text: ""
+      },
+      { field_type: "textarea", field_key: "notes", label: "Additional notes", placeholder: "Accessibility needs, questions, or anything else\u2026", required: "no", width: "full", validation: "none", options: "", default_value: "", help_text: "Optional" }
+    ]
+  },
+  render: (props) => /* @__PURE__ */ jsx56(FormBlockBase, { ...props })
+};
+
+// src/blocks/FormQuoteRequest.jsx
+import { jsx as jsx57 } from "react/jsx-runtime";
+var FormQuoteRequest = {
+  label: "Quote request form",
+  fields: COMMON_FORM_FIELDS,
+  defaultProps: {
+    ...COMMON_FORM_DEFAULTS,
+    form_heading: "Request a quote",
+    form_lede: "Tell us about your project and we'll put together a tailored proposal within two business days.",
+    form_submit_label: "Request quote",
+    success_heading: "Request received.",
+    success_body: "We'll review your requirements and send a tailored proposal within two business days.",
+    fields: [
+      { field_type: "text", field_key: "company", label: "Company", placeholder: "Your organisation", required: "yes", width: "half", validation: "none", options: "", default_value: "", help_text: "" },
+      { field_type: "text", field_key: "full_name", label: "Your name", placeholder: "Full name", required: "yes", width: "half", validation: "none", options: "", default_value: "", help_text: "" },
+      { field_type: "email", field_key: "email", label: "Email", placeholder: "you@company.com", required: "yes", width: "half", validation: "email", options: "", default_value: "", help_text: "" },
+      { field_type: "tel", field_key: "phone", label: "Phone", placeholder: "+1 555 000 0000", required: "no", width: "half", validation: "phone", options: "", default_value: "", help_text: "Optional" },
+      {
+        field_type: "select",
+        field_key: "project_type",
+        label: "Project type",
+        placeholder: "What are you building?",
+        required: "yes",
+        width: "half",
+        validation: "none",
+        options: "Website\nMobile app\nWeb application\nBranding\nMarketing campaign\nData / analytics\nOther",
+        default_value: "",
+        help_text: ""
+      },
+      {
+        field_type: "select",
+        field_key: "budget",
+        label: "Budget range",
+        placeholder: "Approximate budget",
+        required: "no",
+        width: "half",
+        validation: "none",
+        options: "Under $5k\n$5k \u2013 $20k\n$20k \u2013 $50k\n$50k \u2013 $100k\n$100k+\nNot sure yet",
+        default_value: "",
+        help_text: ""
+      },
+      {
+        field_type: "select",
+        field_key: "timeline",
+        label: "Desired timeline",
+        placeholder: "When do you need this?",
+        required: "no",
+        width: "full",
+        validation: "none",
+        options: "As soon as possible\n1 \u2013 3 months\n3 \u2013 6 months\n6+ months\nFlexible",
+        default_value: "",
+        help_text: ""
+      },
+      { field_type: "textarea", field_key: "requirements", label: "Project requirements", placeholder: "Describe what you need \u2014 features, integrations, constraints, goals\u2026", required: "yes", width: "full", validation: "none", options: "", default_value: "", help_text: "" }
+    ]
+  },
+  render: (props) => /* @__PURE__ */ jsx57(FormBlockBase, { ...props })
+};
+
+// src/blocks/FormApplication.jsx
+import { jsx as jsx58 } from "react/jsx-runtime";
+var FormApplication = {
+  label: "Application form",
+  fields: COMMON_FORM_FIELDS,
+  defaultProps: {
+    ...COMMON_FORM_DEFAULTS,
+    form_heading: "Apply now",
+    form_lede: "Tell us about yourself. We read every application carefully.",
+    form_submit_label: "Submit application",
+    success_heading: "Application submitted.",
+    success_body: "Thanks for applying. We'll review your application and be in touch within 5\u20137 business days.",
+    fields: [
+      { field_type: "text", field_key: "full_name", label: "Full name", placeholder: "Your name", required: "yes", width: "half", validation: "none", options: "", default_value: "", help_text: "" },
+      { field_type: "email", field_key: "email", label: "Email", placeholder: "you@example.com", required: "yes", width: "half", validation: "email", options: "", default_value: "", help_text: "" },
+      { field_type: "tel", field_key: "phone", label: "Phone", placeholder: "+1 555 000 0000", required: "no", width: "half", validation: "phone", options: "", default_value: "", help_text: "Optional" },
+      { field_type: "text", field_key: "linkedin", label: "LinkedIn", placeholder: "linkedin.com/in/you", required: "no", width: "half", validation: "url", options: "", default_value: "", help_text: "Optional" },
+      { field_type: "text", field_key: "portfolio", label: "Portfolio / website", placeholder: "https://yoursite.com", required: "no", width: "half", validation: "url", options: "", default_value: "", help_text: "Optional" },
+      {
+        field_type: "select",
+        field_key: "role",
+        label: "Role applying for",
+        placeholder: "Select a role",
+        required: "yes",
+        width: "half",
+        validation: "none",
+        options: "Engineering\nDesign\nProduct\nMarketing\nOperations\nOther",
+        default_value: "",
+        help_text: ""
+      },
+      { field_type: "textarea", field_key: "cover_note", label: "Cover note", placeholder: "Why are you interested? What would you bring to the role?", required: "yes", width: "full", validation: "none", options: "", default_value: "", help_text: "" },
+      { field_type: "upload", field_key: "cv", label: "CV / r\xE9sum\xE9", placeholder: "Upload CV (PDF preferred)", required: "no", width: "full", validation: "none", options: "", default_value: "", help_text: "PDF, DOC, or DOCX \u2014 max 5 MB" }
+    ]
+  },
+  render: (props) => /* @__PURE__ */ jsx58(FormBlockBase, { ...props })
+};
+
+// src/blocks/FormSupport.jsx
+import { jsx as jsx59 } from "react/jsx-runtime";
+var FormSupport = {
+  label: "Support ticket form",
+  fields: COMMON_FORM_FIELDS,
+  defaultProps: {
+    ...COMMON_FORM_DEFAULTS,
+    form_heading: "Open a support ticket",
+    form_lede: "Describe the issue and we'll get back to you as quickly as we can.",
+    form_submit_label: "Submit ticket",
+    success_heading: "Ticket submitted.",
+    success_body: "We've logged your request. Expect a reply to your email within one business day.",
+    fields: [
+      { field_type: "text", field_key: "full_name", label: "Name", placeholder: "Your name", required: "yes", width: "half", validation: "none", options: "", default_value: "", help_text: "" },
+      { field_type: "email", field_key: "email", label: "Email", placeholder: "you@company.com", required: "yes", width: "half", validation: "email", options: "", default_value: "", help_text: "" },
+      {
+        field_type: "select",
+        field_key: "category",
+        label: "Category",
+        placeholder: "What's this about?",
+        required: "yes",
+        width: "half",
+        validation: "none",
+        options: "Technical issue\nBilling\nAccount access\nFeature request\nGeneral enquiry\nOther",
+        default_value: "",
+        help_text: ""
+      },
+      {
+        field_type: "select",
+        field_key: "priority",
+        label: "Priority",
+        placeholder: "How urgent is this?",
+        required: "yes",
+        width: "half",
+        validation: "none",
+        options: "Low\nMedium\nHigh\nUrgent",
+        default_value: "Medium",
+        help_text: ""
+      },
+      { field_type: "text", field_key: "subject", label: "Subject", placeholder: "One-line summary of the issue", required: "yes", width: "full", validation: "none", options: "", default_value: "", help_text: "" },
+      { field_type: "textarea", field_key: "description", label: "Description", placeholder: "Steps to reproduce, error messages, expected vs actual behaviour\u2026", required: "yes", width: "full", validation: "none", options: "", default_value: "", help_text: "" },
+      { field_type: "upload", field_key: "attachment", label: "Attachment", placeholder: "Upload a screenshot or file", required: "no", width: "full", validation: "none", options: "", default_value: "", help_text: "Optional \u2014 screenshots, logs, or related files" }
+    ]
+  },
+  render: (props) => /* @__PURE__ */ jsx59(FormBlockBase, { ...props })
+};
+
+// src/blocks/FormWaitlist.jsx
+import { jsx as jsx60 } from "react/jsx-runtime";
+var FormWaitlist = {
+  label: "Waitlist form",
+  fields: COMMON_FORM_FIELDS,
+  defaultProps: {
+    ...COMMON_FORM_DEFAULTS,
+    form_heading: "Join the waitlist",
+    form_lede: "We're rolling out access in batches. Sign up and we'll let you know when your spot is ready.",
+    form_submit_label: "Join waitlist",
+    success_heading: "You're on the list.",
+    success_body: "We'll email you as soon as your spot is available. No spam, ever.",
+    fields: [
+      { field_type: "text", field_key: "full_name", label: "Name", placeholder: "Your name", required: "yes", width: "half", validation: "none", options: "", default_value: "", help_text: "" },
+      { field_type: "email", field_key: "email", label: "Email", placeholder: "you@example.com", required: "yes", width: "half", validation: "email", options: "", default_value: "", help_text: "" },
+      { field_type: "text", field_key: "company", label: "Company", placeholder: "Your organisation", required: "no", width: "half", validation: "none", options: "", default_value: "", help_text: "Optional" },
+      {
+        field_type: "select",
+        field_key: "role",
+        label: "Your role",
+        placeholder: "Select your role",
+        required: "no",
+        width: "half",
+        validation: "none",
+        options: "Founder\nProduct manager\nDeveloper\nDesigner\nMarketer\nOther",
+        default_value: "",
+        help_text: ""
+      },
+      { field_type: "textarea", field_key: "use_case", label: "How would you use it?", placeholder: "A sentence or two about your intended use case\u2026", required: "no", width: "full", validation: "none", options: "", default_value: "", help_text: "Optional \u2014 helps us prioritise access" }
+    ]
+  },
+  render: (props) => /* @__PURE__ */ jsx60(FormBlockBase, { ...props })
+};
+
+// src/blocks/FormAddress.jsx
+import { jsx as jsx61 } from "react/jsx-runtime";
+var FormAddress = {
+  label: "Address form",
+  fields: COMMON_FORM_FIELDS,
+  defaultProps: {
+    ...COMMON_FORM_DEFAULTS,
+    form_heading: "Your address",
+    form_lede: "Please provide your delivery or billing address.",
+    form_submit_label: "Save address",
+    success_heading: "Address saved.",
+    success_body: "Your address details have been recorded.",
+    fields: [
+      { field_type: "text", field_key: "full_name", label: "Full name", placeholder: "Recipient name", required: "yes", width: "full", validation: "none", options: "", default_value: "", help_text: "" },
+      { field_type: "text", field_key: "line1", label: "Address line 1", placeholder: "Street address", required: "yes", width: "full", validation: "none", options: "", default_value: "", help_text: "" },
+      { field_type: "text", field_key: "line2", label: "Address line 2", placeholder: "Apartment, suite, unit\u2026", required: "no", width: "full", validation: "none", options: "", default_value: "", help_text: "Optional" },
+      { field_type: "text", field_key: "city", label: "City", placeholder: "City", required: "yes", width: "half", validation: "none", options: "", default_value: "", help_text: "" },
+      { field_type: "text", field_key: "state", label: "State / region", placeholder: "State or region", required: "no", width: "half", validation: "none", options: "", default_value: "", help_text: "" },
+      { field_type: "country", field_key: "country", label: "Country", placeholder: "Select country", required: "yes", width: "half", validation: "none", options: "", default_value: "", help_text: "" },
+      { field_type: "text", field_key: "pincode", label: "Postal / ZIP code", placeholder: "Postal code", required: "yes", width: "half", validation: "none", options: "", default_value: "", help_text: "" }
+    ]
+  },
+  render: (props) => /* @__PURE__ */ jsx61(FormBlockBase, { ...props })
+};
+
 // src/blocks/EventsList.jsx
 import { CalendarOutlined, EnvironmentOutlined as EnvironmentOutlined2 } from "@ant-design/icons";
-import { jsx as jsx48, jsxs as jsxs44 } from "react/jsx-runtime";
+import { jsx as jsx62, jsxs as jsxs45 } from "react/jsx-runtime";
 var EventsList = {
   label: "Events list",
   fields: {
@@ -4449,7 +5390,7 @@ var EventsList = {
     background: {
       type: "radio",
       label: "Background",
-      options: [{ label: "White", value: "white" }, { label: "Soft", value: "soft" }]
+      options: [{ label: "White", value: "white" }, { label: "Soft", value: "soft" }, { label: "Dark", value: "dark" }]
     }
   },
   defaultProps: {
@@ -4462,29 +5403,29 @@ var EventsList = {
     ],
     background: "white"
   },
-  render: ({ eyebrow, heading, items, background }) => /* @__PURE__ */ jsx48("section", { className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}`, style: { paddingTop: 56, paddingBottom: 56 }, children: /* @__PURE__ */ jsxs44("div", { className: "tps-container", style: { maxWidth: 920 }, children: [
-    (eyebrow || heading) && /* @__PURE__ */ jsxs44("div", { style: { marginBottom: 32 }, children: [
-      eyebrow && /* @__PURE__ */ jsx48("span", { className: "tps-eyebrow", children: eyebrow }),
-      heading && /* @__PURE__ */ jsx48("h2", { className: "tps-h2", style: { marginTop: 8 }, children: heading })
+  render: ({ eyebrow, heading, items, background }) => /* @__PURE__ */ jsx62("section", { className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}${background === "dark" ? " tps-section-dark" : ""}`, style: { paddingTop: 56, paddingBottom: 56 }, children: /* @__PURE__ */ jsxs45("div", { className: "tps-container", style: { maxWidth: 920 }, children: [
+    (eyebrow || heading) && /* @__PURE__ */ jsxs45("div", { style: { marginBottom: 32 }, children: [
+      eyebrow && /* @__PURE__ */ jsx62("span", { className: "tps-eyebrow", children: eyebrow }),
+      heading && /* @__PURE__ */ jsx62("h2", { className: "tps-h2", style: { marginTop: 8 }, children: heading })
     ] }),
-    /* @__PURE__ */ jsx48("ul", { style: { listStyle: "none", padding: 0, margin: 0, display: "flex", flexDirection: "column", gap: 12 }, children: (items || []).map((e, i) => /* @__PURE__ */ jsxs44("li", { className: "tps-row-stack", style: { display: "grid", gridTemplateColumns: "88px 1fr auto", gap: 24, alignItems: "center", padding: 20, background: "#fff", border: "1px solid var(--tps-line)", borderRadius: "var(--tps-radius)" }, children: [
-      /* @__PURE__ */ jsxs44("div", { style: { background: "rgba(15,118,110,0.08)", color: "var(--tps-primary)", padding: "12px 8px", borderRadius: "var(--tps-radius)", textAlign: "center", fontWeight: 700, fontSize: 13, lineHeight: 1.2, letterSpacing: 0.5 }, children: [
-        /* @__PURE__ */ jsx48(CalendarOutlined, { style: { display: "block", marginBottom: 4 } }),
+    /* @__PURE__ */ jsx62("ul", { style: { listStyle: "none", padding: 0, margin: 0, display: "flex", flexDirection: "column", gap: 12 }, children: (items || []).map((e, i) => /* @__PURE__ */ jsxs45("li", { className: "tps-row-stack", style: { display: "grid", gridTemplateColumns: "88px 1fr auto", gap: 24, alignItems: "center", padding: 20, background: "var(--tps-bg)", border: "1px solid var(--tps-line)", borderRadius: "var(--tps-radius)" }, children: [
+      /* @__PURE__ */ jsxs45("div", { style: { background: "rgba(15,118,110,0.08)", color: "var(--tps-primary)", padding: "12px 8px", borderRadius: "var(--tps-radius)", textAlign: "center", fontWeight: 700, fontSize: 13, lineHeight: 1.2, letterSpacing: 0.5 }, children: [
+        /* @__PURE__ */ jsx62(CalendarOutlined, { style: { display: "block", marginBottom: 4 } }),
         e.date_short
       ] }),
-      /* @__PURE__ */ jsxs44("div", { children: [
-        /* @__PURE__ */ jsx48("h3", { style: { fontSize: 17, fontWeight: 700, margin: "0 0 4px" }, children: e.title }),
-        e.body && /* @__PURE__ */ jsx48("p", { style: { color: "var(--tps-muted)", margin: "0 0 6px", fontSize: 14, lineHeight: 1.5 }, children: e.body }),
-        /* @__PURE__ */ jsxs44("div", { style: { display: "flex", gap: 14, fontSize: 12, color: "var(--tps-muted)" }, children: [
-          /* @__PURE__ */ jsx48("span", { children: e.date_long }),
-          e.venue && /* @__PURE__ */ jsxs44("span", { children: [
-            /* @__PURE__ */ jsx48(EnvironmentOutlined2, {}),
+      /* @__PURE__ */ jsxs45("div", { children: [
+        /* @__PURE__ */ jsx62("h3", { style: { fontSize: 17, fontWeight: 700, margin: "0 0 4px" }, children: e.title }),
+        e.body && /* @__PURE__ */ jsx62("p", { style: { color: "var(--tps-muted)", margin: "0 0 6px", fontSize: 14, lineHeight: 1.5 }, children: e.body }),
+        /* @__PURE__ */ jsxs45("div", { style: { display: "flex", gap: 14, fontSize: 12, color: "var(--tps-muted)" }, children: [
+          /* @__PURE__ */ jsx62("span", { children: e.date_long }),
+          e.venue && /* @__PURE__ */ jsxs45("span", { children: [
+            /* @__PURE__ */ jsx62(EnvironmentOutlined2, {}),
             " ",
             e.venue
           ] })
         ] })
       ] }),
-      e.cta_label && /* @__PURE__ */ jsxs44(StudioLink, { href: e.cta_href || "#", style: { color: "var(--tps-primary)", fontWeight: 700, fontSize: 14, textDecoration: "none", whiteSpace: "nowrap" }, children: [
+      e.cta_label && /* @__PURE__ */ jsxs45(StudioLink, { href: e.cta_href || "#", style: { color: "var(--tps-primary)", fontWeight: 700, fontSize: 14, textDecoration: "none", whiteSpace: "nowrap" }, children: [
         e.cta_label,
         " \u2192"
       ] })
@@ -4493,7 +5434,7 @@ var EventsList = {
 };
 
 // src/blocks/Divider.jsx
-import { jsx as jsx49, jsxs as jsxs45 } from "react/jsx-runtime";
+import { jsx as jsx63, jsxs as jsxs46 } from "react/jsx-runtime";
 var Divider = {
   label: "Divider",
   fields: {
@@ -4519,15 +5460,15 @@ var Divider = {
     }
   },
   defaultProps: { label: "", style: "hairline", spacing: 48 },
-  render: ({ label, style, spacing }) => /* @__PURE__ */ jsx49("section", { style: { padding: `${spacing}px 24px` }, children: /* @__PURE__ */ jsx49("div", { className: "tps-container", style: { maxWidth: 820 }, children: style === "dot" ? /* @__PURE__ */ jsx49("div", { style: { display: "flex", justifyContent: "center", gap: 8 }, children: [0, 1, 2].map((i) => /* @__PURE__ */ jsx49("span", { style: { width: 4, height: 4, borderRadius: "50%", background: "#CBD5E1" } }, i)) }) : label ? /* @__PURE__ */ jsxs45("div", { style: { display: "flex", alignItems: "center", gap: 12 }, children: [
-    /* @__PURE__ */ jsx49("span", { style: { flex: 1, height: style === "thick" ? 2 : 1, borderTop: style === "dashed" ? `1px dashed #CBD5E1` : "none", background: style !== "dashed" ? "#E2E8F0" : "none" } }),
-    /* @__PURE__ */ jsx49("span", { style: { fontSize: 11, fontWeight: 700, letterSpacing: 1.5, color: "#94A3B8", textTransform: "uppercase" }, children: label }),
-    /* @__PURE__ */ jsx49("span", { style: { flex: 1, height: style === "thick" ? 2 : 1, borderTop: style === "dashed" ? `1px dashed #CBD5E1` : "none", background: style !== "dashed" ? "#E2E8F0" : "none" } })
-  ] }) : /* @__PURE__ */ jsx49("hr", { style: { margin: 0, border: 0, borderTop: style === "dashed" ? "1px dashed #CBD5E1" : `${style === "thick" ? 2 : 1}px solid #E2E8F0` } }) }) })
+  render: ({ label, style, spacing }) => /* @__PURE__ */ jsx63("section", { style: { padding: `${spacing}px 24px` }, children: /* @__PURE__ */ jsx63("div", { className: "tps-container", style: { maxWidth: 820 }, children: style === "dot" ? /* @__PURE__ */ jsx63("div", { style: { display: "flex", justifyContent: "center", gap: 8 }, children: [0, 1, 2].map((i) => /* @__PURE__ */ jsx63("span", { style: { width: 4, height: 4, borderRadius: "50%", background: "#CBD5E1" } }, i)) }) : label ? /* @__PURE__ */ jsxs46("div", { style: { display: "flex", alignItems: "center", gap: 12 }, children: [
+    /* @__PURE__ */ jsx63("span", { style: { flex: 1, height: style === "thick" ? 2 : 1, borderTop: style === "dashed" ? `1px dashed #CBD5E1` : "none", background: style !== "dashed" ? "#E2E8F0" : "none" } }),
+    /* @__PURE__ */ jsx63("span", { style: { fontSize: 11, fontWeight: 700, letterSpacing: 1.5, color: "#94A3B8", textTransform: "uppercase" }, children: label }),
+    /* @__PURE__ */ jsx63("span", { style: { flex: 1, height: style === "thick" ? 2 : 1, borderTop: style === "dashed" ? `1px dashed #CBD5E1` : "none", background: style !== "dashed" ? "#E2E8F0" : "none" } })
+  ] }) : /* @__PURE__ */ jsx63("hr", { style: { margin: 0, border: 0, borderTop: style === "dashed" ? "1px dashed #CBD5E1" : `${style === "thick" ? 2 : 1}px solid #E2E8F0` } }) }) })
 };
 
 // src/blocks/ThreeColumn.jsx
-import { jsx as jsx50, jsxs as jsxs46 } from "react/jsx-runtime";
+import { jsx as jsx64, jsxs as jsxs47 } from "react/jsx-runtime";
 var ThreeColumn = {
   label: "Three columns",
   fields: {
@@ -4546,7 +5487,7 @@ var ThreeColumn = {
     background: {
       type: "radio",
       label: "Background",
-      options: [{ label: "White", value: "white" }, { label: "Soft", value: "soft" }]
+      options: [{ label: "White", value: "white" }, { label: "Soft", value: "soft" }, { label: "Dark", value: "dark" }]
     }
   },
   defaultProps: {
@@ -4559,20 +5500,20 @@ var ThreeColumn = {
     ],
     background: "white"
   },
-  render: ({ eyebrow, heading, columns, background }) => /* @__PURE__ */ jsx50("section", { className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}`, style: { paddingTop: 56, paddingBottom: 56 }, children: /* @__PURE__ */ jsxs46("div", { className: "tps-container", children: [
-    (eyebrow || heading) && /* @__PURE__ */ jsxs46("div", { style: { marginBottom: 32 }, children: [
-      eyebrow && /* @__PURE__ */ jsx50("span", { className: "tps-eyebrow", children: eyebrow }),
-      heading && /* @__PURE__ */ jsx50("h2", { className: "tps-h2", style: { marginTop: 8 }, children: heading })
+  render: ({ eyebrow, heading, columns, background }) => /* @__PURE__ */ jsx64("section", { className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}${background === "dark" ? " tps-section-dark" : ""}`, style: { paddingTop: 56, paddingBottom: 56 }, children: /* @__PURE__ */ jsxs47("div", { className: "tps-container", children: [
+    (eyebrow || heading) && /* @__PURE__ */ jsxs47("div", { style: { marginBottom: 32 }, children: [
+      eyebrow && /* @__PURE__ */ jsx64("span", { className: "tps-eyebrow", children: eyebrow }),
+      heading && /* @__PURE__ */ jsx64("h2", { className: "tps-h2", style: { marginTop: 8 }, children: heading })
     ] }),
-    /* @__PURE__ */ jsx50("div", { style: { display: "grid", gridTemplateColumns: "repeat(auto-fit, minmax(min(260px, 100%), 1fr))", gap: 32 }, children: (columns || []).map((c, i) => /* @__PURE__ */ jsxs46("div", { children: [
-      /* @__PURE__ */ jsx50("h3", { style: { fontSize: 18, fontWeight: 700, margin: "0 0 8px" }, children: c.title }),
-      /* @__PURE__ */ jsx50("p", { style: { color: "var(--tps-muted)", lineHeight: 1.7, fontSize: 15, margin: 0 }, children: c.body })
+    /* @__PURE__ */ jsx64("div", { style: { display: "grid", gridTemplateColumns: "repeat(auto-fit, minmax(min(260px, 100%), 1fr))", gap: 32 }, children: (columns || []).map((c, i) => /* @__PURE__ */ jsxs47("div", { children: [
+      /* @__PURE__ */ jsx64("h3", { style: { fontSize: 18, fontWeight: 700, margin: "0 0 8px" }, children: c.title }),
+      /* @__PURE__ */ jsx64("p", { style: { color: "var(--tps-muted)", lineHeight: 1.7, fontSize: 15, margin: 0 }, children: c.body })
     ] }, i)) })
   ] }) })
 };
 
 // src/blocks/PressMentions.jsx
-import { jsx as jsx51, jsxs as jsxs47 } from "react/jsx-runtime";
+import { jsx as jsx65, jsxs as jsxs48 } from "react/jsx-runtime";
 var PressMentions = {
   label: "Press mentions",
   fields: {
@@ -4592,7 +5533,7 @@ var PressMentions = {
     background: {
       type: "radio",
       label: "Background",
-      options: [{ label: "White", value: "white" }, { label: "Soft", value: "soft" }]
+      options: [{ label: "White", value: "white" }, { label: "Soft", value: "soft" }, { label: "Dark", value: "dark" }]
     }
   },
   defaultProps: {
@@ -4604,17 +5545,17 @@ var PressMentions = {
     ],
     background: "soft"
   },
-  render: ({ heading, items, background }) => /* @__PURE__ */ jsx51("section", { className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}`, style: { paddingTop: 48, paddingBottom: 48 }, children: /* @__PURE__ */ jsxs47("div", { className: "tps-container", style: { textAlign: "center" }, children: [
-    heading && /* @__PURE__ */ jsx51("div", { style: { fontSize: 11, fontWeight: 700, letterSpacing: 2, color: "var(--tps-muted)", marginBottom: 28, textTransform: "uppercase" }, children: heading }),
-    /* @__PURE__ */ jsx51("div", { style: { display: "flex", flexWrap: "wrap", justifyContent: "center", alignItems: "center", gap: 40 }, children: (items || []).map((p, i) => {
-      const inner = p.image_url ? /* @__PURE__ */ jsx51("img", { src: p.image_url, alt: p.name, style: { height: 28, opacity: 0.7, filter: "grayscale(100%)" } }) : /* @__PURE__ */ jsx51("span", { style: { fontFamily: "Georgia, serif", fontSize: 18, fontWeight: 600, color: "var(--tps-ink)", fontStyle: "italic" }, children: p.name });
-      return p.link ? /* @__PURE__ */ jsx51("a", { href: p.link, target: "_blank", rel: "noreferrer", children: inner }, i) : /* @__PURE__ */ jsx51("span", { children: inner }, i);
+  render: ({ heading, items, background }) => /* @__PURE__ */ jsx65("section", { className: `tps-section ${background === "soft" ? "tps-section-soft" : ""}${background === "dark" ? " tps-section-dark" : ""}`, style: { paddingTop: 48, paddingBottom: 48 }, children: /* @__PURE__ */ jsxs48("div", { className: "tps-container", style: { textAlign: "center" }, children: [
+    heading && /* @__PURE__ */ jsx65("div", { style: { fontSize: 11, fontWeight: 700, letterSpacing: 2, color: "var(--tps-muted)", marginBottom: 28, textTransform: "uppercase" }, children: heading }),
+    /* @__PURE__ */ jsx65("div", { style: { display: "flex", flexWrap: "wrap", justifyContent: "center", alignItems: "center", gap: 40 }, children: (items || []).map((p, i) => {
+      const inner = p.image_url ? /* @__PURE__ */ jsx65("img", { src: p.image_url, alt: p.name, style: { height: 28, opacity: 0.7, filter: "grayscale(100%)" } }) : /* @__PURE__ */ jsx65("span", { style: { fontFamily: "Georgia, serif", fontSize: 18, fontWeight: 600, color: "var(--tps-ink)", fontStyle: "italic" }, children: p.name });
+      return p.link ? /* @__PURE__ */ jsx65("a", { href: p.link, target: "_blank", rel: "noreferrer", children: inner }, i) : /* @__PURE__ */ jsx65("span", { children: inner }, i);
     }) })
   ] }) })
 };
 
 // src/blocks/Container.jsx
-import { jsx as jsx52, jsxs as jsxs48 } from "react/jsx-runtime";
+import { jsx as jsx66, jsxs as jsxs49 } from "react/jsx-runtime";
 var Container = {
   label: "Container box",
   fields: {
@@ -4651,10 +5592,10 @@ var Container = {
       dark: { bg: "#0F172A", fg: "#fff", border: "none" },
       white: { bg: "#fff", fg: "var(--tps-ink)", border: "1px solid var(--tps-line)" }
     }[background] || { bg: "var(--tps-bg-soft)", fg: "var(--tps-ink)", border: "1px solid var(--tps-line)" };
-    return /* @__PURE__ */ jsx52("section", { className: "tps-section", style: { paddingTop: 32, paddingBottom: 32 }, children: /* @__PURE__ */ jsx52("div", { className: "tps-container", style: { maxWidth: 820 }, children: /* @__PURE__ */ jsxs48("div", { style: { background: bg.bg, color: bg.fg, border: bg.border, borderRadius: "var(--tps-radius)", padding: 32, textAlign: align }, children: [
-      eyebrow && /* @__PURE__ */ jsx52("span", { className: "tps-eyebrow", style: { color: background === "dark" ? "#F59E0B" : void 0 }, children: eyebrow }),
-      heading && /* @__PURE__ */ jsx52("h3", { style: { fontSize: 22, fontWeight: 700, margin: "8px 0 14px" }, children: heading }),
-      body_html && /* @__PURE__ */ jsx52("div", { style: { lineHeight: 1.7, fontSize: 15, opacity: background === "dark" ? 0.92 : 1 }, dangerouslySetInnerHTML: { __html: body_html } })
+    return /* @__PURE__ */ jsx66("section", { className: "tps-section", style: { paddingTop: 32, paddingBottom: 32 }, children: /* @__PURE__ */ jsx66("div", { className: "tps-container", style: { maxWidth: 820 }, children: /* @__PURE__ */ jsxs49("div", { style: { background: bg.bg, color: bg.fg, border: bg.border, borderRadius: "var(--tps-radius)", padding: 32, textAlign: align }, children: [
+      eyebrow && /* @__PURE__ */ jsx66("span", { className: "tps-eyebrow", style: { color: background === "dark" ? "#F59E0B" : void 0 }, children: eyebrow }),
+      heading && /* @__PURE__ */ jsx66("h3", { style: { fontSize: 22, fontWeight: 700, margin: "8px 0 14px" }, children: heading }),
+      body_html && /* @__PURE__ */ jsx66("div", { style: { lineHeight: 1.7, fontSize: 15, opacity: background === "dark" ? 0.92 : 1 }, dangerouslySetInnerHTML: { __html: body_html } })
     ] }) }) });
   }
 };
@@ -4675,39 +5616,71 @@ function withReveal(component, animation = "fade-up") {
   return { ...component, render: RenderWrapped };
 }
 
+// src/withTheme.jsx
+import { cloneElement as cloneElement2, isValidElement as isValidElement2 } from "react";
+var THEME_OPTIONS = [
+  { label: "Inherit", value: "" },
+  { label: "Light", value: "light" },
+  { label: "Dark", value: "dark" }
+];
+var themeField = {
+  type: "select",
+  label: "Theme",
+  options: THEME_OPTIONS
+};
+function withTheme(component) {
+  const fields = { ...component.fields || {}, theme: themeField };
+  const defaultProps = { theme: "", ...component.defaultProps || {} };
+  const RenderThemed = (props) => {
+    const node = component.render(props);
+    const theme = props?.theme;
+    if (!theme || !isValidElement2(node)) return node;
+    return cloneElement2(node, { "data-tps-theme": theme });
+  };
+  return { ...component, fields, defaultProps, render: RenderThemed };
+}
+
 // src/BlockThumbnail.jsx
-import { useState as useState5, useEffect as useEffect2 } from "react";
-import { Fragment as Fragment5, jsx as jsx53, jsxs as jsxs49 } from "react/jsx-runtime";
-var BG = "#F8FAFC";
-var BORDER = "#E2E8F0";
-var TEXT = "#0F172A";
-var MUTED = "#94A3B8";
-var DEFAULT_BRAND_COLORS = {
+import { useState as useState6, useEffect as useEffect2 } from "react";
+import { Fragment as Fragment5, jsx as jsx67, jsxs as jsxs50 } from "react/jsx-runtime";
+var DEFAULT_COLORS = {
   PRIMARY: "#0b60d8",
   PRIMARY_SOFT: "#dbeafe",
-  ACCENT: "#F59E0B"
+  ACCENT: "#F59E0B",
+  BG: "#F8FAFC",
+  BG_SOFT: "#F1F5F9",
+  CARD: "#ffffff",
+  BORDER: "#E2E8F0",
+  TEXT: "#0F172A",
+  MUTED: "#94A3B8"
 };
-function readBrandColors() {
-  if (typeof window === "undefined") return DEFAULT_BRAND_COLORS;
+function readColors() {
+  if (typeof window === "undefined") return DEFAULT_COLORS;
   const root = document.querySelector("[data-brand]") || document.documentElement;
   const style = getComputedStyle(root);
   const get = (name, fallback) => style.getPropertyValue(name).trim() || fallback;
   return {
-    PRIMARY: get("--tps-primary", DEFAULT_BRAND_COLORS.PRIMARY),
-    PRIMARY_SOFT: get("--tps-primary-soft", DEFAULT_BRAND_COLORS.PRIMARY_SOFT),
-    ACCENT: get("--tps-accent", DEFAULT_BRAND_COLORS.ACCENT)
+    PRIMARY: get("--tps-primary", DEFAULT_COLORS.PRIMARY),
+    PRIMARY_SOFT: get("--tps-primary-soft", DEFAULT_COLORS.PRIMARY_SOFT),
+    ACCENT: get("--tps-accent", DEFAULT_COLORS.ACCENT),
+    BG: get("--tps-bg-section", DEFAULT_COLORS.BG),
+    BG_SOFT: get("--tps-bg-soft", DEFAULT_COLORS.BG_SOFT),
+    CARD: get("--tps-bg", DEFAULT_COLORS.CARD),
+    BORDER: get("--tps-line", DEFAULT_COLORS.BORDER),
+    TEXT: get("--tps-ink", DEFAULT_COLORS.TEXT),
+    MUTED: get("--tps-muted", DEFAULT_COLORS.MUTED)
   };
 }
-function useBrandColors() {
-  const [colors, setColors] = useState5(readBrandColors);
+function useThemeColors() {
+  const [colors, setColors] = useState6(readColors);
   useEffect2(() => {
-    setColors(readBrandColors());
+    setColors(readColors());
     if (typeof window === "undefined") return;
     const target = document.querySelector("[data-brand]") || document.documentElement;
-    const observer = new MutationObserver(() => setColors(readBrandColors()));
+    const observer = new MutationObserver(() => setColors(readColors()));
     observer.observe(target, {
       attributes: true,
-      attributeFilter: ["data-brand", "style", "class"]
+      attributeFilter: ["data-brand", "data-tps-theme", "style", "class"]
     });
     return () => observer.disconnect();
   }, []);
@@ -4715,8 +5688,9 @@ function useBrandColors() {
 }
 var FRAME_W = 120;
 var FRAME_H = 70;
-function Frame({ children, soft = false }) {
-  return /* @__PURE__ */ jsxs49(
+function getPreviews(c) {
+  const { PRIMARY, PRIMARY_SOFT, ACCENT, BG, BG_SOFT, CARD, BORDER, TEXT, MUTED } = c;
+  const Frame = ({ children, soft = false }) => /* @__PURE__ */ jsxs50(
     "svg",
     {
       viewBox: `0 0 ${FRAME_W} ${FRAME_H}`,
@@ -4725,7 +5699,7 @@ function Frame({ children, soft = false }) {
       preserveAspectRatio: "xMidYMid meet",
       style: { display: "block", borderRadius: 4 },
       children: [
-        /* @__PURE__ */ jsx53(
+        /* @__PURE__ */ jsx67(
           "rect",
           {
             x: "0.5",
@@ -4733,7 +5707,7 @@ function Frame({ children, soft = false }) {
             width: FRAME_W - 1,
             height: FRAME_H - 1,
             rx: "3",
-            fill: soft ? "#F1F5F9" : BG,
+            fill: soft ? BG_SOFT : BG,
             stroke: BORDER,
             strokeWidth: "1"
           }
@@ -4742,28 +5716,25 @@ function Frame({ children, soft = false }) {
       ]
     }
   );
-}
-function getPreviews(c) {
-  const { PRIMARY, PRIMARY_SOFT, ACCENT } = c;
   return {
-    Hero: /* @__PURE__ */ jsxs49(Frame, { children: [
-      /* @__PURE__ */ jsx53("rect", { x: "14", y: "14", width: "20", height: "3", rx: "1", fill: PRIMARY, opacity: "0.7" }),
-      /* @__PURE__ */ jsx53("rect", { x: "14", y: "22", width: "92", height: "6", rx: "1.5", fill: TEXT }),
-      /* @__PURE__ */ jsx53("rect", { x: "14", y: "32", width: "80", height: "3", rx: "1", fill: MUTED }),
-      /* @__PURE__ */ jsx53("rect", { x: "14", y: "38", width: "60", height: "3", rx: "1", fill: MUTED }),
-      /* @__PURE__ */ jsx53("rect", { x: "14", y: "50", width: "32", height: "9", rx: "2", fill: PRIMARY }),
-      /* @__PURE__ */ jsx53("rect", { x: "50", y: "50", width: "32", height: "9", rx: "2", fill: "none", stroke: TEXT, strokeWidth: "0.8" })
+    Hero: /* @__PURE__ */ jsxs50(Frame, { children: [
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "14", width: "20", height: "3", rx: "1", fill: PRIMARY, opacity: "0.7" }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "22", width: "92", height: "6", rx: "1.5", fill: TEXT }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "32", width: "80", height: "3", rx: "1", fill: MUTED }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "38", width: "60", height: "3", rx: "1", fill: MUTED }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "50", width: "32", height: "9", rx: "2", fill: PRIMARY }),
+      /* @__PURE__ */ jsx67("rect", { x: "50", y: "50", width: "32", height: "9", rx: "2", fill: "none", stroke: TEXT, strokeWidth: "0.8" })
     ] }),
-    SectionHeader: /* @__PURE__ */ jsxs49(Frame, { children: [
-      /* @__PURE__ */ jsx53("rect", { x: "14", y: "22", width: "18", height: "3", rx: "1", fill: PRIMARY, opacity: "0.7" }),
-      /* @__PURE__ */ jsx53("rect", { x: "14", y: "30", width: "78", height: "6", rx: "1.5", fill: TEXT }),
-      /* @__PURE__ */ jsx53("rect", { x: "14", y: "42", width: "64", height: "3", rx: "1", fill: MUTED })
+    SectionHeader: /* @__PURE__ */ jsxs50(Frame, { children: [
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "22", width: "18", height: "3", rx: "1", fill: PRIMARY, opacity: "0.7" }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "30", width: "78", height: "6", rx: "1.5", fill: TEXT }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "42", width: "64", height: "3", rx: "1", fill: MUTED })
     ] }),
-    StatsStrip: /* @__PURE__ */ jsx53(Frame, { soft: true, children: [14, 38, 62, 86].map((x, i) => /* @__PURE__ */ jsxs49("g", { children: [
-      /* @__PURE__ */ jsx53("rect", { x, y: "22", width: "20", height: "6", rx: "1.5", fill: PRIMARY, opacity: "0.85" }),
-      /* @__PURE__ */ jsx53("rect", { x: x + 2, y: "32", width: "16", height: "3", rx: "1", fill: MUTED })
+    StatsStrip: /* @__PURE__ */ jsx67(Frame, { soft: true, children: [14, 38, 62, 86].map((x, i) => /* @__PURE__ */ jsxs50("g", { children: [
+      /* @__PURE__ */ jsx67("rect", { x, y: "22", width: "20", height: "6", rx: "1.5", fill: PRIMARY, opacity: "0.85" }),
+      /* @__PURE__ */ jsx67("rect", { x: x + 2, y: "32", width: "16", height: "3", rx: "1", fill: MUTED })
     ] }, i)) }),
-    RichText: /* @__PURE__ */ jsx53(Frame, { children: [14, 21, 28, 35, 42, 49, 56].map((y, i) => /* @__PURE__ */ jsx53(
+    RichText: /* @__PURE__ */ jsx67(Frame, { children: [14, 21, 28, 35, 42, 49, 56].map((y, i) => /* @__PURE__ */ jsx67(
       "rect",
       {
         x: "14",
@@ -4776,8 +5747,8 @@ function getPreviews(c) {
       },
       i
     )) }),
-    PillarsRow: /* @__PURE__ */ jsx53(Frame, { soft: true, children: [10, 44, 78].map((x, i) => /* @__PURE__ */ jsxs49("g", { children: [
-      /* @__PURE__ */ jsx53(
+    PillarsRow: /* @__PURE__ */ jsx67(Frame, { soft: true, children: [10, 44, 78].map((x, i) => /* @__PURE__ */ jsxs50("g", { children: [
+      /* @__PURE__ */ jsx67(
         "rect",
         {
           x,
@@ -4785,19 +5756,19 @@ function getPreviews(c) {
           width: "32",
           height: "42",
           rx: "2",
-          fill: "#fff",
+          fill: CARD,
           stroke: BORDER,
           strokeWidth: "0.8"
         }
       ),
-      /* @__PURE__ */ jsx53("circle", { cx: x + 8, cy: "22", r: "3", fill: PRIMARY, opacity: "0.85" }),
-      /* @__PURE__ */ jsx53("rect", { x: x + 4, y: "30", width: "20", height: "3", rx: "1", fill: TEXT }),
-      /* @__PURE__ */ jsx53("rect", { x: x + 4, y: "36", width: "24", height: "2", rx: "1", fill: MUTED }),
-      /* @__PURE__ */ jsx53("rect", { x: x + 4, y: "40", width: "22", height: "2", rx: "1", fill: MUTED }),
-      /* @__PURE__ */ jsx53("rect", { x: x + 4, y: "44", width: "18", height: "2", rx: "1", fill: MUTED })
+      /* @__PURE__ */ jsx67("circle", { cx: x + 8, cy: "22", r: "3", fill: PRIMARY, opacity: "0.85" }),
+      /* @__PURE__ */ jsx67("rect", { x: x + 4, y: "30", width: "20", height: "3", rx: "1", fill: TEXT }),
+      /* @__PURE__ */ jsx67("rect", { x: x + 4, y: "36", width: "24", height: "2", rx: "1", fill: MUTED }),
+      /* @__PURE__ */ jsx67("rect", { x: x + 4, y: "40", width: "22", height: "2", rx: "1", fill: MUTED }),
+      /* @__PURE__ */ jsx67("rect", { x: x + 4, y: "44", width: "18", height: "2", rx: "1", fill: MUTED })
     ] }, i)) }),
-    ApproachSteps: /* @__PURE__ */ jsx53(Frame, { children: [10, 38, 66, 94].map((x, i) => /* @__PURE__ */ jsxs49("g", { children: [
-      /* @__PURE__ */ jsx53(
+    ApproachSteps: /* @__PURE__ */ jsx67(Frame, { children: [10, 38, 66, 94].map((x, i) => /* @__PURE__ */ jsxs50("g", { children: [
+      /* @__PURE__ */ jsx67(
         "text",
         {
           x,
@@ -4809,19 +5780,19 @@ function getPreviews(c) {
           children: `0${i + 1}`
         }
       ),
-      /* @__PURE__ */ jsx53("rect", { x, y: "28", width: "20", height: "3.5", rx: "1", fill: TEXT }),
-      /* @__PURE__ */ jsx53("rect", { x, y: "36", width: "22", height: "2", rx: "1", fill: MUTED }),
-      /* @__PURE__ */ jsx53("rect", { x, y: "40", width: "18", height: "2", rx: "1", fill: MUTED })
+      /* @__PURE__ */ jsx67("rect", { x, y: "28", width: "20", height: "3.5", rx: "1", fill: TEXT }),
+      /* @__PURE__ */ jsx67("rect", { x, y: "36", width: "22", height: "2", rx: "1", fill: MUTED }),
+      /* @__PURE__ */ jsx67("rect", { x, y: "40", width: "18", height: "2", rx: "1", fill: MUTED })
     ] }, i)) }),
-    ServicesGrid: /* @__PURE__ */ jsx53(Frame, { children: [
+    ServicesGrid: /* @__PURE__ */ jsx67(Frame, { children: [
       [10, 12],
       [44, 12],
       [78, 12],
       [10, 38],
       [44, 38],
       [78, 38]
-    ].map(([x, y], i) => /* @__PURE__ */ jsxs49("g", { children: [
-      /* @__PURE__ */ jsx53(
+    ].map(([x, y], i) => /* @__PURE__ */ jsxs50("g", { children: [
+      /* @__PURE__ */ jsx67(
         "rect",
         {
           x,
@@ -4829,27 +5800,27 @@ function getPreviews(c) {
           width: "32",
           height: "20",
           rx: "2",
-          fill: "#fff",
+          fill: CARD,
           stroke: BORDER,
           strokeWidth: "0.8"
         }
       ),
-      /* @__PURE__ */ jsx53("circle", { cx: x + 5, cy: y + 6, r: "2", fill: PRIMARY, opacity: "0.85" }),
-      /* @__PURE__ */ jsx53("rect", { x: x + 4, y: y + 11, width: "22", height: "2", rx: "1", fill: TEXT }),
-      /* @__PURE__ */ jsx53("rect", { x: x + 4, y: y + 15, width: "18", height: "2", rx: "1", fill: MUTED })
+      /* @__PURE__ */ jsx67("circle", { cx: x + 5, cy: y + 6, r: "2", fill: PRIMARY, opacity: "0.85" }),
+      /* @__PURE__ */ jsx67("rect", { x: x + 4, y: y + 11, width: "22", height: "2", rx: "1", fill: TEXT }),
+      /* @__PURE__ */ jsx67("rect", { x: x + 4, y: y + 15, width: "18", height: "2", rx: "1", fill: MUTED })
     ] }, i)) }),
-    CTABanner: /* @__PURE__ */ jsxs49(Frame, { soft: true, children: [
-      /* @__PURE__ */ jsx53("rect", { x: "14", y: "16", width: "14", height: "2.5", rx: "1", fill: ACCENT }),
-      /* @__PURE__ */ jsx53("rect", { x: "14", y: "22", width: "74", height: "6", rx: "1.5", fill: TEXT }),
-      /* @__PURE__ */ jsx53("rect", { x: "14", y: "32", width: "92", height: "3", rx: "1", fill: MUTED }),
-      /* @__PURE__ */ jsx53("rect", { x: "14", y: "44", width: "40", height: "11", rx: "2", fill: PRIMARY })
+    CTABanner: /* @__PURE__ */ jsxs50(Frame, { soft: true, children: [
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "16", width: "14", height: "2.5", rx: "1", fill: ACCENT }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "22", width: "74", height: "6", rx: "1.5", fill: TEXT }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "32", width: "92", height: "3", rx: "1", fill: MUTED }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "44", width: "40", height: "11", rx: "2", fill: PRIMARY })
     ] }),
-    PrinciplesList: /* @__PURE__ */ jsxs49(Frame, { children: [
-      /* @__PURE__ */ jsx53("rect", { x: "10", y: "14", width: "14", height: "2.5", rx: "1", fill: PRIMARY, opacity: "0.7" }),
-      /* @__PURE__ */ jsx53("rect", { x: "10", y: "20", width: "40", height: "5", rx: "1.5", fill: TEXT }),
-      /* @__PURE__ */ jsx53("rect", { x: "10", y: "30", width: "36", height: "2", rx: "1", fill: MUTED }),
-      /* @__PURE__ */ jsx53("rect", { x: "10", y: "34", width: "34", height: "2", rx: "1", fill: MUTED }),
-      /* @__PURE__ */ jsx53(
+    PrinciplesList: /* @__PURE__ */ jsxs50(Frame, { children: [
+      /* @__PURE__ */ jsx67("rect", { x: "10", y: "14", width: "14", height: "2.5", rx: "1", fill: PRIMARY, opacity: "0.7" }),
+      /* @__PURE__ */ jsx67("rect", { x: "10", y: "20", width: "40", height: "5", rx: "1.5", fill: TEXT }),
+      /* @__PURE__ */ jsx67("rect", { x: "10", y: "30", width: "36", height: "2", rx: "1", fill: MUTED }),
+      /* @__PURE__ */ jsx67("rect", { x: "10", y: "34", width: "34", height: "2", rx: "1", fill: MUTED }),
+      /* @__PURE__ */ jsx67(
         "rect",
         {
           x: "60",
@@ -4861,26 +5832,26 @@ function getPreviews(c) {
           opacity: "0.5"
         }
       ),
-      [20, 30, 40, 50].map((y, i) => /* @__PURE__ */ jsxs49("g", { children: [
-        /* @__PURE__ */ jsx53("circle", { cx: "66", cy: y + 2, r: "2", fill: PRIMARY }),
-        /* @__PURE__ */ jsx53("rect", { x: "71", y: y + 1, width: "32", height: "2", rx: "1", fill: TEXT, opacity: "0.8" })
+      [20, 30, 40, 50].map((y, i) => /* @__PURE__ */ jsxs50("g", { children: [
+        /* @__PURE__ */ jsx67("circle", { cx: "66", cy: y + 2, r: "2", fill: PRIMARY }),
+        /* @__PURE__ */ jsx67("rect", { x: "71", y: y + 1, width: "32", height: "2", rx: "1", fill: TEXT, opacity: "0.8" })
       ] }, i))
     ] }),
-    TwoColumn: /* @__PURE__ */ jsxs49(Frame, { children: [
-      /* @__PURE__ */ jsx53("rect", { x: "10", y: "14", width: "48", height: "3.5", rx: "1", fill: TEXT }),
-      /* @__PURE__ */ jsx53("rect", { x: "10", y: "22", width: "42", height: "2", rx: "1", fill: MUTED }),
-      /* @__PURE__ */ jsx53("rect", { x: "10", y: "26", width: "46", height: "2", rx: "1", fill: MUTED }),
-      /* @__PURE__ */ jsx53("rect", { x: "10", y: "30", width: "40", height: "2", rx: "1", fill: MUTED }),
-      /* @__PURE__ */ jsx53("rect", { x: "62", y: "14", width: "48", height: "3.5", rx: "1", fill: TEXT }),
-      /* @__PURE__ */ jsx53("rect", { x: "62", y: "22", width: "42", height: "2", rx: "1", fill: MUTED }),
-      /* @__PURE__ */ jsx53("rect", { x: "62", y: "26", width: "46", height: "2", rx: "1", fill: MUTED }),
-      /* @__PURE__ */ jsx53("rect", { x: "62", y: "30", width: "40", height: "2", rx: "1", fill: MUTED })
+    TwoColumn: /* @__PURE__ */ jsxs50(Frame, { children: [
+      /* @__PURE__ */ jsx67("rect", { x: "10", y: "14", width: "48", height: "3.5", rx: "1", fill: TEXT }),
+      /* @__PURE__ */ jsx67("rect", { x: "10", y: "22", width: "42", height: "2", rx: "1", fill: MUTED }),
+      /* @__PURE__ */ jsx67("rect", { x: "10", y: "26", width: "46", height: "2", rx: "1", fill: MUTED }),
+      /* @__PURE__ */ jsx67("rect", { x: "10", y: "30", width: "40", height: "2", rx: "1", fill: MUTED }),
+      /* @__PURE__ */ jsx67("rect", { x: "62", y: "14", width: "48", height: "3.5", rx: "1", fill: TEXT }),
+      /* @__PURE__ */ jsx67("rect", { x: "62", y: "22", width: "42", height: "2", rx: "1", fill: MUTED }),
+      /* @__PURE__ */ jsx67("rect", { x: "62", y: "26", width: "46", height: "2", rx: "1", fill: MUTED }),
+      /* @__PURE__ */ jsx67("rect", { x: "62", y: "30", width: "40", height: "2", rx: "1", fill: MUTED })
     ] }),
-    ContactSection: /* @__PURE__ */ jsxs49(Frame, { children: [
-      /* @__PURE__ */ jsx53("rect", { x: "10", y: "10", width: "20", height: "3", rx: "1", fill: PRIMARY, opacity: "0.7" }),
-      /* @__PURE__ */ jsx53("rect", { x: "10", y: "16", width: "80", height: "5", rx: "1.5", fill: TEXT }),
-      /* @__PURE__ */ jsx53("rect", { x: "10", y: "28", width: "34", height: "32", rx: "2", fill: PRIMARY_SOFT, opacity: "0.5" }),
-      /* @__PURE__ */ jsx53(
+    ContactSection: /* @__PURE__ */ jsxs50(Frame, { children: [
+      /* @__PURE__ */ jsx67("rect", { x: "10", y: "10", width: "20", height: "3", rx: "1", fill: PRIMARY, opacity: "0.7" }),
+      /* @__PURE__ */ jsx67("rect", { x: "10", y: "16", width: "80", height: "5", rx: "1.5", fill: TEXT }),
+      /* @__PURE__ */ jsx67("rect", { x: "10", y: "28", width: "34", height: "32", rx: "2", fill: PRIMARY_SOFT, opacity: "0.5" }),
+      /* @__PURE__ */ jsx67(
         "rect",
         {
           x: "50",
@@ -4888,18 +5859,18 @@ function getPreviews(c) {
           width: "60",
           height: "32",
           rx: "2",
-          fill: "#fff",
+          fill: CARD,
           stroke: BORDER,
           strokeWidth: "0.8"
         }
       ),
-      /* @__PURE__ */ jsx53("rect", { x: "54", y: "32", width: "24", height: "3", rx: "1", fill: MUTED }),
-      /* @__PURE__ */ jsx53("rect", { x: "54", y: "38", width: "52", height: "3", rx: "1", fill: "#fff", stroke: BORDER, strokeWidth: "0.5" }),
-      /* @__PURE__ */ jsx53("rect", { x: "54", y: "44", width: "52", height: "3", rx: "1", fill: "#fff", stroke: BORDER, strokeWidth: "0.5" }),
-      /* @__PURE__ */ jsx53("rect", { x: "54", y: "50", width: "20", height: "6", rx: "1.5", fill: PRIMARY })
+      /* @__PURE__ */ jsx67("rect", { x: "54", y: "32", width: "24", height: "3", rx: "1", fill: MUTED }),
+      /* @__PURE__ */ jsx67("rect", { x: "54", y: "38", width: "52", height: "3", rx: "1", fill: CARD, stroke: BORDER, strokeWidth: "0.5" }),
+      /* @__PURE__ */ jsx67("rect", { x: "54", y: "44", width: "52", height: "3", rx: "1", fill: CARD, stroke: BORDER, strokeWidth: "0.5" }),
+      /* @__PURE__ */ jsx67("rect", { x: "54", y: "50", width: "20", height: "6", rx: "1.5", fill: PRIMARY })
     ] }),
-    Spacer: /* @__PURE__ */ jsxs49(Frame, { children: [
-      /* @__PURE__ */ jsx53(
+    Spacer: /* @__PURE__ */ jsxs50(Frame, { children: [
+      /* @__PURE__ */ jsx67(
         "line",
         {
           x1: "14",
@@ -4911,7 +5882,7 @@ function getPreviews(c) {
           strokeDasharray: "3 2"
         }
       ),
-      /* @__PURE__ */ jsx53(
+      /* @__PURE__ */ jsx67(
         "text",
         {
           x: "60",
@@ -4924,8 +5895,8 @@ function getPreviews(c) {
         }
       )
     ] }),
-    RawHtml: /* @__PURE__ */ jsxs49(Frame, { children: [
-      /* @__PURE__ */ jsx53(
+    RawHtml: /* @__PURE__ */ jsxs50(Frame, { children: [
+      /* @__PURE__ */ jsx67(
         "text",
         {
           x: "14",
@@ -4937,31 +5908,31 @@ function getPreviews(c) {
           children: "</>"
         }
       ),
-      /* @__PURE__ */ jsx53("rect", { x: "56", y: "22", width: "50", height: "2", rx: "1", fill: MUTED }),
-      /* @__PURE__ */ jsx53("rect", { x: "56", y: "28", width: "42", height: "2", rx: "1", fill: MUTED }),
-      /* @__PURE__ */ jsx53("rect", { x: "56", y: "34", width: "48", height: "2", rx: "1", fill: MUTED }),
-      /* @__PURE__ */ jsx53("rect", { x: "56", y: "40", width: "40", height: "2", rx: "1", fill: MUTED }),
-      /* @__PURE__ */ jsx53("rect", { x: "56", y: "46", width: "44", height: "2", rx: "1", fill: MUTED })
+      /* @__PURE__ */ jsx67("rect", { x: "56", y: "22", width: "50", height: "2", rx: "1", fill: MUTED }),
+      /* @__PURE__ */ jsx67("rect", { x: "56", y: "28", width: "42", height: "2", rx: "1", fill: MUTED }),
+      /* @__PURE__ */ jsx67("rect", { x: "56", y: "34", width: "48", height: "2", rx: "1", fill: MUTED }),
+      /* @__PURE__ */ jsx67("rect", { x: "56", y: "40", width: "40", height: "2", rx: "1", fill: MUTED }),
+      /* @__PURE__ */ jsx67("rect", { x: "56", y: "46", width: "44", height: "2", rx: "1", fill: MUTED })
     ] }),
-    ImageText: /* @__PURE__ */ jsxs49(Frame, { children: [
-      /* @__PURE__ */ jsx53("rect", { x: "10", y: "14", width: "44", height: "42", rx: "2", fill: PRIMARY_SOFT }),
-      /* @__PURE__ */ jsx53("line", { x1: "20", y1: "22", x2: "44", y2: "48", stroke: PRIMARY, strokeWidth: "0.6", opacity: "0.6" }),
-      /* @__PURE__ */ jsx53("line", { x1: "44", y1: "22", x2: "20", y2: "48", stroke: PRIMARY, strokeWidth: "0.6", opacity: "0.6" }),
-      /* @__PURE__ */ jsx53("rect", { x: "62", y: "18", width: "14", height: "2.5", rx: "1", fill: PRIMARY, opacity: "0.7" }),
-      /* @__PURE__ */ jsx53("rect", { x: "62", y: "24", width: "44", height: "5", rx: "1.5", fill: TEXT }),
-      /* @__PURE__ */ jsx53("rect", { x: "62", y: "34", width: "46", height: "2", rx: "1", fill: MUTED }),
-      /* @__PURE__ */ jsx53("rect", { x: "62", y: "38", width: "40", height: "2", rx: "1", fill: MUTED }),
-      /* @__PURE__ */ jsx53("rect", { x: "62", y: "42", width: "42", height: "2", rx: "1", fill: MUTED }),
-      /* @__PURE__ */ jsx53("rect", { x: "62", y: "50", width: "28", height: "6", rx: "1.5", fill: PRIMARY })
+    ImageText: /* @__PURE__ */ jsxs50(Frame, { children: [
+      /* @__PURE__ */ jsx67("rect", { x: "10", y: "14", width: "44", height: "42", rx: "2", fill: PRIMARY_SOFT }),
+      /* @__PURE__ */ jsx67("line", { x1: "20", y1: "22", x2: "44", y2: "48", stroke: PRIMARY, strokeWidth: "0.6", opacity: "0.6" }),
+      /* @__PURE__ */ jsx67("line", { x1: "44", y1: "22", x2: "20", y2: "48", stroke: PRIMARY, strokeWidth: "0.6", opacity: "0.6" }),
+      /* @__PURE__ */ jsx67("rect", { x: "62", y: "18", width: "14", height: "2.5", rx: "1", fill: PRIMARY, opacity: "0.7" }),
+      /* @__PURE__ */ jsx67("rect", { x: "62", y: "24", width: "44", height: "5", rx: "1.5", fill: TEXT }),
+      /* @__PURE__ */ jsx67("rect", { x: "62", y: "34", width: "46", height: "2", rx: "1", fill: MUTED }),
+      /* @__PURE__ */ jsx67("rect", { x: "62", y: "38", width: "40", height: "2", rx: "1", fill: MUTED }),
+      /* @__PURE__ */ jsx67("rect", { x: "62", y: "42", width: "42", height: "2", rx: "1", fill: MUTED }),
+      /* @__PURE__ */ jsx67("rect", { x: "62", y: "50", width: "28", height: "6", rx: "1.5", fill: PRIMARY })
     ] }),
-    VideoEmbed: /* @__PURE__ */ jsxs49(Frame, { children: [
-      /* @__PURE__ */ jsx53("rect", { x: "20", y: "16", width: "80", height: "38", rx: "2", fill: "#0F172A" }),
-      /* @__PURE__ */ jsx53("polygon", { points: "55,26 55,44 70,35", fill: "#fff", opacity: "0.95" }),
-      /* @__PURE__ */ jsx53("rect", { x: "40", y: "60", width: "40", height: "2", rx: "1", fill: MUTED })
+    VideoEmbed: /* @__PURE__ */ jsxs50(Frame, { children: [
+      /* @__PURE__ */ jsx67("rect", { x: "20", y: "16", width: "80", height: "38", rx: "2", fill: "#0F172A" }),
+      /* @__PURE__ */ jsx67("polygon", { points: "55,26 55,44 70,35", fill: "#ffffff", opacity: "0.95" }),
+      /* @__PURE__ */ jsx67("rect", { x: "40", y: "60", width: "40", height: "2", rx: "1", fill: MUTED })
     ] }),
-    LogoStrip: /* @__PURE__ */ jsxs49(Frame, { soft: true, children: [
-      /* @__PURE__ */ jsx53("rect", { x: "48", y: "14", width: "24", height: "2", rx: "1", fill: MUTED }),
-      [14, 36, 58, 80, 102].map((cx, i) => /* @__PURE__ */ jsx53(
+    LogoStrip: /* @__PURE__ */ jsxs50(Frame, { soft: true, children: [
+      /* @__PURE__ */ jsx67("rect", { x: "48", y: "14", width: "24", height: "2", rx: "1", fill: MUTED }),
+      [14, 36, 58, 80, 102].map((cx, i) => /* @__PURE__ */ jsx67(
         "rect",
         {
           x: cx - 8,
@@ -4969,15 +5940,15 @@ function getPreviews(c) {
           width: "16",
           height: "10",
           rx: "2",
-          fill: "#fff",
+          fill: CARD,
           stroke: BORDER,
           strokeWidth: "0.5"
         },
         i
       ))
     ] }),
-    TestimonialQuote: /* @__PURE__ */ jsxs49(Frame, { soft: true, children: [
-      /* @__PURE__ */ jsx53(
+    TestimonialQuote: /* @__PURE__ */ jsxs50(Frame, { soft: true, children: [
+      /* @__PURE__ */ jsx67(
         "text",
         {
           x: "20",
@@ -4989,15 +5960,15 @@ function getPreviews(c) {
           children: '"'
         }
       ),
-      /* @__PURE__ */ jsx53("rect", { x: "14", y: "28", width: "92", height: "3", rx: "1", fill: TEXT }),
-      /* @__PURE__ */ jsx53("rect", { x: "14", y: "34", width: "86", height: "3", rx: "1", fill: TEXT }),
-      /* @__PURE__ */ jsx53("rect", { x: "14", y: "40", width: "60", height: "3", rx: "1", fill: TEXT }),
-      /* @__PURE__ */ jsx53("circle", { cx: "42", cy: "56", r: "4", fill: PRIMARY }),
-      /* @__PURE__ */ jsx53("rect", { x: "50", y: "52", width: "22", height: "2.5", rx: "1", fill: TEXT }),
-      /* @__PURE__ */ jsx53("rect", { x: "50", y: "56", width: "34", height: "2", rx: "1", fill: MUTED })
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "28", width: "92", height: "3", rx: "1", fill: TEXT }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "34", width: "86", height: "3", rx: "1", fill: TEXT }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "40", width: "60", height: "3", rx: "1", fill: TEXT }),
+      /* @__PURE__ */ jsx67("circle", { cx: "42", cy: "56", r: "4", fill: PRIMARY }),
+      /* @__PURE__ */ jsx67("rect", { x: "50", y: "52", width: "22", height: "2.5", rx: "1", fill: TEXT }),
+      /* @__PURE__ */ jsx67("rect", { x: "50", y: "56", width: "34", height: "2", rx: "1", fill: MUTED })
     ] }),
-    TestimonialGrid: /* @__PURE__ */ jsx53(Frame, { children: [10, 44, 78].map((x, i) => /* @__PURE__ */ jsxs49("g", { children: [
-      /* @__PURE__ */ jsx53(
+    TestimonialGrid: /* @__PURE__ */ jsx67(Frame, { children: [10, 44, 78].map((x, i) => /* @__PURE__ */ jsxs50("g", { children: [
+      /* @__PURE__ */ jsx67(
         "rect",
         {
           x,
@@ -5005,21 +5976,21 @@ function getPreviews(c) {
           width: "32",
           height: "42",
           rx: "2",
-          fill: "#fff",
+          fill: CARD,
           stroke: BORDER,
           strokeWidth: "0.8"
         }
       ),
-      /* @__PURE__ */ jsx53("text", { x: x + 4, y: "22", fontSize: "6", fontFamily: "Georgia", fill: PRIMARY, opacity: "0.6", children: '"' }),
-      /* @__PURE__ */ jsx53("rect", { x: x + 4, y: "24", width: "22", height: "2", rx: "1", fill: TEXT }),
-      /* @__PURE__ */ jsx53("rect", { x: x + 4, y: "28", width: "24", height: "2", rx: "1", fill: TEXT }),
-      /* @__PURE__ */ jsx53("rect", { x: x + 4, y: "32", width: "20", height: "2", rx: "1", fill: TEXT }),
-      /* @__PURE__ */ jsx53("circle", { cx: x + 7, cy: "46", r: "3", fill: PRIMARY }),
-      /* @__PURE__ */ jsx53("rect", { x: x + 12, y: "44", width: "14", height: "2", rx: "1", fill: TEXT }),
-      /* @__PURE__ */ jsx53("rect", { x: x + 12, y: "48", width: "18", height: "1.5", rx: "0.5", fill: MUTED })
+      /* @__PURE__ */ jsx67("text", { x: x + 4, y: "22", fontSize: "6", fontFamily: "Georgia", fill: PRIMARY, opacity: "0.6", children: '"' }),
+      /* @__PURE__ */ jsx67("rect", { x: x + 4, y: "24", width: "22", height: "2", rx: "1", fill: TEXT }),
+      /* @__PURE__ */ jsx67("rect", { x: x + 4, y: "28", width: "24", height: "2", rx: "1", fill: TEXT }),
+      /* @__PURE__ */ jsx67("rect", { x: x + 4, y: "32", width: "20", height: "2", rx: "1", fill: TEXT }),
+      /* @__PURE__ */ jsx67("circle", { cx: x + 7, cy: "46", r: "3", fill: PRIMARY }),
+      /* @__PURE__ */ jsx67("rect", { x: x + 12, y: "44", width: "14", height: "2", rx: "1", fill: TEXT }),
+      /* @__PURE__ */ jsx67("rect", { x: x + 12, y: "48", width: "18", height: "1.5", rx: "0.5", fill: MUTED })
     ] }, i)) }),
-    FAQ: /* @__PURE__ */ jsx53(Frame, { children: [14, 30, 46].map((y, i) => /* @__PURE__ */ jsxs49("g", { children: [
-      /* @__PURE__ */ jsx53(
+    FAQ: /* @__PURE__ */ jsx67(Frame, { children: [14, 30, 46].map((y, i) => /* @__PURE__ */ jsxs50("g", { children: [
+      /* @__PURE__ */ jsx67(
         "rect",
         {
           x: "14",
@@ -5027,14 +5998,14 @@ function getPreviews(c) {
           width: "92",
           height: "10",
           rx: "2",
-          fill: i === 0 ? PRIMARY_SOFT : "#fff",
+          fill: i === 0 ? PRIMARY_SOFT : CARD,
           stroke: BORDER,
           strokeWidth: "0.6",
           opacity: i === 0 ? 0.7 : 1
         }
       ),
-      /* @__PURE__ */ jsx53("rect", { x: "20", y: y + 4, width: "50", height: "2", rx: "1", fill: TEXT }),
-      /* @__PURE__ */ jsx53(
+      /* @__PURE__ */ jsx67("rect", { x: "20", y: y + 4, width: "50", height: "2", rx: "1", fill: TEXT }),
+      /* @__PURE__ */ jsx67(
         "text",
         {
           x: "98",
@@ -5047,21 +6018,21 @@ function getPreviews(c) {
         }
       )
     ] }, i)) }),
-    Timeline: /* @__PURE__ */ jsxs49(Frame, { children: [
-      /* @__PURE__ */ jsx53("line", { x1: "22", y1: "14", x2: "22", y2: "58", stroke: BORDER, strokeWidth: "1" }),
-      [16, 32, 48].map((y, i) => /* @__PURE__ */ jsxs49("g", { children: [
-        /* @__PURE__ */ jsx53("circle", { cx: "22", cy: y, r: "3", fill: PRIMARY }),
-        /* @__PURE__ */ jsx53("rect", { x: "32", y: y - 5, width: "14", height: "2", rx: "1", fill: ACCENT }),
-        /* @__PURE__ */ jsx53("rect", { x: "32", y: y - 1, width: "40", height: "3", rx: "1", fill: TEXT }),
-        /* @__PURE__ */ jsx53("rect", { x: "32", y: y + 4, width: "60", height: "2", rx: "1", fill: MUTED })
+    Timeline: /* @__PURE__ */ jsxs50(Frame, { children: [
+      /* @__PURE__ */ jsx67("line", { x1: "22", y1: "14", x2: "22", y2: "58", stroke: BORDER, strokeWidth: "1" }),
+      [16, 32, 48].map((y, i) => /* @__PURE__ */ jsxs50("g", { children: [
+        /* @__PURE__ */ jsx67("circle", { cx: "22", cy: y, r: "3", fill: PRIMARY }),
+        /* @__PURE__ */ jsx67("rect", { x: "32", y: y - 5, width: "14", height: "2", rx: "1", fill: ACCENT }),
+        /* @__PURE__ */ jsx67("rect", { x: "32", y: y - 1, width: "40", height: "3", rx: "1", fill: TEXT }),
+        /* @__PURE__ */ jsx67("rect", { x: "32", y: y + 4, width: "60", height: "2", rx: "1", fill: MUTED })
       ] }, i))
     ] }),
-    NewsletterSignup: /* @__PURE__ */ jsxs49(Frame, { soft: true, children: [
-      /* @__PURE__ */ jsx53("rect", { x: "14", y: "14", width: "22", height: "2.5", rx: "1", fill: ACCENT }),
-      /* @__PURE__ */ jsx53("rect", { x: "14", y: "20", width: "76", height: "5", rx: "1.5", fill: TEXT }),
-      /* @__PURE__ */ jsx53("rect", { x: "14", y: "30", width: "92", height: "2", rx: "1", fill: MUTED }),
-      /* @__PURE__ */ jsx53("rect", { x: "14", y: "34", width: "80", height: "2", rx: "1", fill: MUTED }),
-      /* @__PURE__ */ jsx53(
+    NewsletterSignup: /* @__PURE__ */ jsxs50(Frame, { soft: true, children: [
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "14", width: "22", height: "2.5", rx: "1", fill: ACCENT }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "20", width: "76", height: "5", rx: "1.5", fill: TEXT }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "30", width: "92", height: "2", rx: "1", fill: MUTED }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "34", width: "80", height: "2", rx: "1", fill: MUTED }),
+      /* @__PURE__ */ jsx67(
         "rect",
         {
           x: "14",
@@ -5069,15 +6040,15 @@ function getPreviews(c) {
           width: "64",
           height: "9",
           rx: "2",
-          fill: "#fff",
+          fill: CARD,
           stroke: BORDER,
           strokeWidth: "0.6"
         }
       ),
-      /* @__PURE__ */ jsx53("rect", { x: "82", y: "44", width: "24", height: "9", rx: "2", fill: PRIMARY })
+      /* @__PURE__ */ jsx67("rect", { x: "82", y: "44", width: "24", height: "9", rx: "2", fill: PRIMARY })
     ] }),
-    TeamGrid: /* @__PURE__ */ jsx53(Frame, { children: [10, 44, 78].map((x, i) => /* @__PURE__ */ jsxs49("g", { children: [
-      /* @__PURE__ */ jsx53(
+    TeamGrid: /* @__PURE__ */ jsx67(Frame, { children: [10, 44, 78].map((x, i) => /* @__PURE__ */ jsxs50("g", { children: [
+      /* @__PURE__ */ jsx67(
         "rect",
         {
           x,
@@ -5085,25 +6056,25 @@ function getPreviews(c) {
           width: "32",
           height: "48",
           rx: "2",
-          fill: "#fff",
+          fill: CARD,
           stroke: BORDER,
           strokeWidth: "0.6"
         }
       ),
-      /* @__PURE__ */ jsx53("rect", { x, y: "12", width: "32", height: "22", rx: "2", fill: PRIMARY_SOFT }),
-      /* @__PURE__ */ jsx53("circle", { cx: x + 16, cy: "22", r: "6", fill: PRIMARY, opacity: "0.7" }),
-      /* @__PURE__ */ jsx53("rect", { x: x + 4, y: "38", width: "20", height: "2.5", rx: "1", fill: TEXT }),
-      /* @__PURE__ */ jsx53("rect", { x: x + 4, y: "44", width: "14", height: "2", rx: "1", fill: ACCENT }),
-      /* @__PURE__ */ jsx53("rect", { x: x + 4, y: "50", width: "22", height: "1.5", rx: "0.5", fill: MUTED }),
-      /* @__PURE__ */ jsx53("rect", { x: x + 4, y: "54", width: "18", height: "1.5", rx: "0.5", fill: MUTED })
+      /* @__PURE__ */ jsx67("rect", { x, y: "12", width: "32", height: "22", rx: "2", fill: PRIMARY_SOFT }),
+      /* @__PURE__ */ jsx67("circle", { cx: x + 16, cy: "22", r: "6", fill: PRIMARY, opacity: "0.7" }),
+      /* @__PURE__ */ jsx67("rect", { x: x + 4, y: "38", width: "20", height: "2.5", rx: "1", fill: TEXT }),
+      /* @__PURE__ */ jsx67("rect", { x: x + 4, y: "44", width: "14", height: "2", rx: "1", fill: ACCENT }),
+      /* @__PURE__ */ jsx67("rect", { x: x + 4, y: "50", width: "22", height: "1.5", rx: "0.5", fill: MUTED }),
+      /* @__PURE__ */ jsx67("rect", { x: x + 4, y: "54", width: "18", height: "1.5", rx: "0.5", fill: MUTED })
     ] }, i)) }),
-    Banner: /* @__PURE__ */ jsxs49(Frame, { children: [
-      /* @__PURE__ */ jsx53("rect", { x: "0", y: "26", width: FRAME_W, height: "18", fill: PRIMARY_SOFT }),
-      /* @__PURE__ */ jsx53("rect", { x: "14", y: "32", width: "14", height: "6", rx: "1.5", fill: PRIMARY }),
-      /* @__PURE__ */ jsx53("rect", { x: "32", y: "33", width: "32", height: "3", rx: "1", fill: TEXT }),
-      /* @__PURE__ */ jsx53("rect", { x: "32", y: "38", width: "22", height: "2", rx: "1", fill: PRIMARY, opacity: "0.7" }),
-      /* @__PURE__ */ jsx53("rect", { x: "80", y: "33", width: "22", height: "3", rx: "1", fill: PRIMARY }),
-      /* @__PURE__ */ jsx53(
+    Banner: /* @__PURE__ */ jsxs50(Frame, { children: [
+      /* @__PURE__ */ jsx67("rect", { x: "0", y: "26", width: FRAME_W, height: "18", fill: PRIMARY_SOFT }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "32", width: "14", height: "6", rx: "1.5", fill: PRIMARY }),
+      /* @__PURE__ */ jsx67("rect", { x: "32", y: "33", width: "32", height: "3", rx: "1", fill: TEXT }),
+      /* @__PURE__ */ jsx67("rect", { x: "32", y: "38", width: "22", height: "2", rx: "1", fill: PRIMARY, opacity: "0.7" }),
+      /* @__PURE__ */ jsx67("rect", { x: "80", y: "33", width: "22", height: "3", rx: "1", fill: PRIMARY }),
+      /* @__PURE__ */ jsx67(
         "text",
         {
           x: "100",
@@ -5116,19 +6087,19 @@ function getPreviews(c) {
         }
       )
     ] }),
-    ArticleFeatured: /* @__PURE__ */ jsxs49(Frame, { children: [
-      /* @__PURE__ */ jsx53("rect", { x: "62", y: "14", width: "44", height: "42", rx: "2", fill: PRIMARY_SOFT }),
-      /* @__PURE__ */ jsx53("line", { x1: "68", y1: "22", x2: "100", y2: "48", stroke: PRIMARY, strokeWidth: "0.4", opacity: "0.4" }),
-      /* @__PURE__ */ jsx53("line", { x1: "100", y1: "22", x2: "68", y2: "48", stroke: PRIMARY, strokeWidth: "0.4", opacity: "0.4" }),
-      /* @__PURE__ */ jsx53("rect", { x: "14", y: "14", width: "20", height: "4", rx: "1", fill: PRIMARY }),
-      /* @__PURE__ */ jsx53("rect", { x: "14", y: "22", width: "40", height: "5", rx: "1.5", fill: TEXT }),
-      /* @__PURE__ */ jsx53("rect", { x: "14", y: "30", width: "44", height: "2", rx: "1", fill: MUTED }),
-      /* @__PURE__ */ jsx53("rect", { x: "14", y: "34", width: "38", height: "2", rx: "1", fill: MUTED }),
-      /* @__PURE__ */ jsx53("rect", { x: "14", y: "42", width: "32", height: "2", rx: "1", fill: MUTED, opacity: "0.7" }),
-      /* @__PURE__ */ jsx53("rect", { x: "14", y: "50", width: "22", height: "6", rx: "1.5", fill: PRIMARY })
+    ArticleFeatured: /* @__PURE__ */ jsxs50(Frame, { children: [
+      /* @__PURE__ */ jsx67("rect", { x: "62", y: "14", width: "44", height: "42", rx: "2", fill: PRIMARY_SOFT }),
+      /* @__PURE__ */ jsx67("line", { x1: "68", y1: "22", x2: "100", y2: "48", stroke: PRIMARY, strokeWidth: "0.4", opacity: "0.4" }),
+      /* @__PURE__ */ jsx67("line", { x1: "100", y1: "22", x2: "68", y2: "48", stroke: PRIMARY, strokeWidth: "0.4", opacity: "0.4" }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "14", width: "20", height: "4", rx: "1", fill: PRIMARY }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "22", width: "40", height: "5", rx: "1.5", fill: TEXT }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "30", width: "44", height: "2", rx: "1", fill: MUTED }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "34", width: "38", height: "2", rx: "1", fill: MUTED }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "42", width: "32", height: "2", rx: "1", fill: MUTED, opacity: "0.7" }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "50", width: "22", height: "6", rx: "1.5", fill: PRIMARY })
     ] }),
-    ArticleGrid: /* @__PURE__ */ jsx53(Frame, { children: [10, 44, 78].map((x, i) => /* @__PURE__ */ jsxs49("g", { children: [
-      /* @__PURE__ */ jsx53(
+    ArticleGrid: /* @__PURE__ */ jsx67(Frame, { children: [10, 44, 78].map((x, i) => /* @__PURE__ */ jsxs50("g", { children: [
+      /* @__PURE__ */ jsx67(
         "rect",
         {
           x,
@@ -5136,20 +6107,20 @@ function getPreviews(c) {
           width: "32",
           height: "48",
           rx: "2",
-          fill: "#fff",
+          fill: CARD,
           stroke: BORDER,
           strokeWidth: "0.6"
         }
       ),
-      /* @__PURE__ */ jsx53("rect", { x, y: "12", width: "32", height: "20", rx: "2", fill: PRIMARY_SOFT }),
-      /* @__PURE__ */ jsx53("rect", { x: x + 4, y: "36", width: "10", height: "2", rx: "1", fill: PRIMARY, opacity: "0.7" }),
-      /* @__PURE__ */ jsx53("rect", { x: x + 4, y: "40", width: "22", height: "3", rx: "1", fill: TEXT }),
-      /* @__PURE__ */ jsx53("rect", { x: x + 4, y: "46", width: "20", height: "1.5", rx: "0.5", fill: MUTED }),
-      /* @__PURE__ */ jsx53("rect", { x: x + 4, y: "49", width: "18", height: "1.5", rx: "0.5", fill: MUTED }),
-      /* @__PURE__ */ jsx53("rect", { x: x + 4, y: "55", width: "14", height: "1.5", rx: "0.5", fill: MUTED, opacity: "0.7" })
+      /* @__PURE__ */ jsx67("rect", { x, y: "12", width: "32", height: "20", rx: "2", fill: PRIMARY_SOFT }),
+      /* @__PURE__ */ jsx67("rect", { x: x + 4, y: "36", width: "10", height: "2", rx: "1", fill: PRIMARY, opacity: "0.7" }),
+      /* @__PURE__ */ jsx67("rect", { x: x + 4, y: "40", width: "22", height: "3", rx: "1", fill: TEXT }),
+      /* @__PURE__ */ jsx67("rect", { x: x + 4, y: "46", width: "20", height: "1.5", rx: "0.5", fill: MUTED }),
+      /* @__PURE__ */ jsx67("rect", { x: x + 4, y: "49", width: "18", height: "1.5", rx: "0.5", fill: MUTED }),
+      /* @__PURE__ */ jsx67("rect", { x: x + 4, y: "55", width: "14", height: "1.5", rx: "0.5", fill: MUTED, opacity: "0.7" })
     ] }, i)) }),
-    ArticleList: /* @__PURE__ */ jsx53(Frame, { children: [14, 28, 42, 56].map((y, i) => /* @__PURE__ */ jsxs49("g", { children: [
-      /* @__PURE__ */ jsx53(
+    ArticleList: /* @__PURE__ */ jsx67(Frame, { children: [14, 28, 42, 56].map((y, i) => /* @__PURE__ */ jsxs50("g", { children: [
+      /* @__PURE__ */ jsx67(
         "line",
         {
           x1: "14",
@@ -5160,18 +6131,18 @@ function getPreviews(c) {
           strokeWidth: "0.5"
         }
       ),
-      /* @__PURE__ */ jsx53("rect", { x: "14", y, width: "14", height: "2", rx: "1", fill: MUTED }),
-      /* @__PURE__ */ jsx53("rect", { x: "34", y: y - 1, width: "10", height: "2", rx: "1", fill: PRIMARY, opacity: "0.7" }),
-      /* @__PURE__ */ jsx53("rect", { x: "48", y: y - 1, width: "50", height: "2.5", rx: "1", fill: TEXT }),
-      /* @__PURE__ */ jsx53("text", { x: "106", y: y + 1, fontSize: "6", fill: MUTED, textAnchor: "end", fontFamily: "system-ui", children: "\u2192" })
+      /* @__PURE__ */ jsx67("rect", { x: "14", y, width: "14", height: "2", rx: "1", fill: MUTED }),
+      /* @__PURE__ */ jsx67("rect", { x: "34", y: y - 1, width: "10", height: "2", rx: "1", fill: PRIMARY, opacity: "0.7" }),
+      /* @__PURE__ */ jsx67("rect", { x: "48", y: y - 1, width: "50", height: "2.5", rx: "1", fill: TEXT }),
+      /* @__PURE__ */ jsx67("text", { x: "106", y: y + 1, fontSize: "6", fill: MUTED, textAnchor: "end", fontFamily: "system-ui", children: "\u2192" })
     ] }, i)) }),
-    IconCards: /* @__PURE__ */ jsx53(Frame, { children: [
+    IconCards: /* @__PURE__ */ jsx67(Frame, { children: [
       [10, 12],
       [38, 12],
       [66, 12],
       [94, 12]
-    ].map(([x, y], i) => /* @__PURE__ */ jsxs49("g", { children: [
-      /* @__PURE__ */ jsx53(
+    ].map(([x, y], i) => /* @__PURE__ */ jsxs50("g", { children: [
+      /* @__PURE__ */ jsx67(
         "rect",
         {
           x: x - 4,
@@ -5179,24 +6150,24 @@ function getPreviews(c) {
           width: "24",
           height: "46",
           rx: "2",
-          fill: "#fff",
+          fill: CARD,
           stroke: BORDER,
           strokeWidth: "0.6"
         }
       ),
-      /* @__PURE__ */ jsx53("rect", { x: x - 1, y: y + 4, width: "10", height: "10", rx: "2", fill: PRIMARY_SOFT }),
-      /* @__PURE__ */ jsx53("circle", { cx: x + 4, cy: y + 9, r: "2.5", fill: PRIMARY }),
-      /* @__PURE__ */ jsx53("rect", { x: x - 1, y: y + 18, width: "14", height: "2", rx: "1", fill: TEXT }),
-      /* @__PURE__ */ jsx53("rect", { x: x - 1, y: y + 24, width: "16", height: "1.5", rx: "0.5", fill: MUTED }),
-      /* @__PURE__ */ jsx53("rect", { x: x - 1, y: y + 28, width: "14", height: "1.5", rx: "0.5", fill: MUTED })
+      /* @__PURE__ */ jsx67("rect", { x: x - 1, y: y + 4, width: "10", height: "10", rx: "2", fill: PRIMARY_SOFT }),
+      /* @__PURE__ */ jsx67("circle", { cx: x + 4, cy: y + 9, r: "2.5", fill: PRIMARY }),
+      /* @__PURE__ */ jsx67("rect", { x: x - 1, y: y + 18, width: "14", height: "2", rx: "1", fill: TEXT }),
+      /* @__PURE__ */ jsx67("rect", { x: x - 1, y: y + 24, width: "16", height: "1.5", rx: "0.5", fill: MUTED }),
+      /* @__PURE__ */ jsx67("rect", { x: x - 1, y: y + 28, width: "14", height: "1.5", rx: "0.5", fill: MUTED })
     ] }, i)) }),
-    MetricCards: /* @__PURE__ */ jsx53(Frame, { children: [
+    MetricCards: /* @__PURE__ */ jsx67(Frame, { children: [
       [10, 12],
       [38, 12],
       [66, 12],
       [94, 12]
-    ].map(([x, y], i) => /* @__PURE__ */ jsxs49("g", { children: [
-      /* @__PURE__ */ jsx53(
+    ].map(([x, y], i) => /* @__PURE__ */ jsxs50("g", { children: [
+      /* @__PURE__ */ jsx67(
         "rect",
         {
           x: x - 4,
@@ -5204,12 +6175,12 @@ function getPreviews(c) {
           width: "24",
           height: "46",
           rx: "2",
-          fill: "#fff",
+          fill: CARD,
           stroke: BORDER,
           strokeWidth: "0.6"
         }
       ),
-      /* @__PURE__ */ jsx53(
+      /* @__PURE__ */ jsx67(
         "text",
         {
           x: x + 8,
@@ -5222,9 +6193,9 @@ function getPreviews(c) {
           children: ["80%", "8wk", "4.8", "0"][i]
         }
       ),
-      /* @__PURE__ */ jsx53("rect", { x: x - 1, y: y + 25, width: "20", height: "1.5", rx: "0.5", fill: MUTED }),
-      /* @__PURE__ */ jsx53("rect", { x: x - 1, y: y + 29, width: "16", height: "1.5", rx: "0.5", fill: MUTED }),
-      /* @__PURE__ */ jsx53(
+      /* @__PURE__ */ jsx67("rect", { x: x - 1, y: y + 25, width: "20", height: "1.5", rx: "0.5", fill: MUTED }),
+      /* @__PURE__ */ jsx67("rect", { x: x - 1, y: y + 29, width: "16", height: "1.5", rx: "0.5", fill: MUTED }),
+      /* @__PURE__ */ jsx67(
         "rect",
         {
           x,
@@ -5237,175 +6208,308 @@ function getPreviews(c) {
         }
       )
     ] }, i)) }),
-    ImageOverlayCards: /* @__PURE__ */ jsx53(Frame, { children: [10, 44, 78].map((x, i) => /* @__PURE__ */ jsxs49("g", { children: [
-      /* @__PURE__ */ jsx53("defs", { children: /* @__PURE__ */ jsxs49("linearGradient", { id: `oc-grad-${i}`, x1: "0", y1: "0", x2: "0", y2: "1", children: [
-        /* @__PURE__ */ jsx53("stop", { offset: "0%", stopColor: PRIMARY, stopOpacity: "0.3" }),
-        /* @__PURE__ */ jsx53("stop", { offset: "100%", stopColor: "#0F172A" })
+    ImageOverlayCards: /* @__PURE__ */ jsx67(Frame, { children: [10, 44, 78].map((x, i) => /* @__PURE__ */ jsxs50("g", { children: [
+      /* @__PURE__ */ jsx67("defs", { children: /* @__PURE__ */ jsxs50("linearGradient", { id: `oc-grad-${i}`, x1: "0", y1: "0", x2: "0", y2: "1", children: [
+        /* @__PURE__ */ jsx67("stop", { offset: "0%", stopColor: PRIMARY, stopOpacity: "0.3" }),
+        /* @__PURE__ */ jsx67("stop", { offset: "100%", stopColor: "#0F172A" })
       ] }) }),
-      /* @__PURE__ */ jsx53("rect", { x, y: "12", width: "32", height: "48", rx: "2", fill: `url(#oc-grad-${i})` }),
-      /* @__PURE__ */ jsx53("rect", { x: x + 4, y: "38", width: "10", height: "2", rx: "1", fill: ACCENT }),
-      /* @__PURE__ */ jsx53("rect", { x: x + 4, y: "44", width: "22", height: "3", rx: "1", fill: "#fff" }),
-      /* @__PURE__ */ jsx53("rect", { x: x + 4, y: "50", width: "20", height: "1.5", rx: "0.5", fill: "#fff", opacity: "0.85" }),
-      /* @__PURE__ */ jsx53("rect", { x: x + 4, y: "53", width: "14", height: "1.5", rx: "0.5", fill: "#fff", opacity: "0.85" })
+      /* @__PURE__ */ jsx67("rect", { x, y: "12", width: "32", height: "48", rx: "2", fill: `url(#oc-grad-${i})` }),
+      /* @__PURE__ */ jsx67("rect", { x: x + 4, y: "38", width: "10", height: "2", rx: "1", fill: ACCENT }),
+      /* @__PURE__ */ jsx67("rect", { x: x + 4, y: "44", width: "22", height: "3", rx: "1", fill: "#ffffff" }),
+      /* @__PURE__ */ jsx67("rect", { x: x + 4, y: "50", width: "20", height: "1.5", rx: "0.5", fill: "#ffffff", opacity: "0.85" }),
+      /* @__PURE__ */ jsx67("rect", { x: x + 4, y: "53", width: "14", height: "1.5", rx: "0.5", fill: "#ffffff", opacity: "0.85" })
     ] }, i)) }),
-    PricingTable: /* @__PURE__ */ jsx53(Frame, { children: [10, 44, 78].map((x, i) => /* @__PURE__ */ jsxs49("g", { children: [
-      /* @__PURE__ */ jsx53("rect", { x, y: "10", width: "32", height: "50", rx: "2", fill: i === 1 ? PRIMARY : "#fff", stroke: BORDER, strokeWidth: "0.6" }),
-      /* @__PURE__ */ jsx53("rect", { x: x + 4, y: "14", width: "14", height: "2", rx: "1", fill: i === 1 ? "#fff" : MUTED }),
-      /* @__PURE__ */ jsx53("rect", { x: x + 4, y: "20", width: "18", height: "6", rx: "1.5", fill: i === 1 ? "#fff" : TEXT }),
-      [32, 38, 44].map((y, j) => /* @__PURE__ */ jsx53("rect", { x: x + 4, y, width: "22", height: "1.5", rx: "0.5", fill: i === 1 ? "#fff" : MUTED, opacity: i === 1 ? 0.9 : 0.7 }, j)),
-      /* @__PURE__ */ jsx53("rect", { x: x + 4, y: "52", width: "22", height: "5", rx: "1.5", fill: i === 1 ? "#fff" : PRIMARY })
+    PricingTable: /* @__PURE__ */ jsx67(Frame, { children: [10, 44, 78].map((x, i) => /* @__PURE__ */ jsxs50("g", { children: [
+      /* @__PURE__ */ jsx67("rect", { x, y: "10", width: "32", height: "50", rx: "2", fill: i === 1 ? PRIMARY : CARD, stroke: BORDER, strokeWidth: "0.6" }),
+      /* @__PURE__ */ jsx67("rect", { x: x + 4, y: "14", width: "14", height: "2", rx: "1", fill: i === 1 ? "#fff" : MUTED }),
+      /* @__PURE__ */ jsx67("rect", { x: x + 4, y: "20", width: "18", height: "6", rx: "1.5", fill: i === 1 ? "#fff" : TEXT }),
+      [32, 38, 44].map((y, j) => /* @__PURE__ */ jsx67("rect", { x: x + 4, y, width: "22", height: "1.5", rx: "0.5", fill: i === 1 ? "#fff" : MUTED, opacity: i === 1 ? 0.9 : 0.7 }, j)),
+      /* @__PURE__ */ jsx67("rect", { x: x + 4, y: "52", width: "22", height: "5", rx: "1.5", fill: i === 1 ? "#fff" : PRIMARY })
     ] }, i)) }),
-    PricingComparison: /* @__PURE__ */ jsxs49(Frame, { children: [
-      /* @__PURE__ */ jsx53("rect", { x: "10", y: "14", width: "100", height: "6", fill: PRIMARY_SOFT }),
-      /* @__PURE__ */ jsx53("rect", { x: "14", y: "16", width: "22", height: "2", rx: "1", fill: TEXT }),
-      /* @__PURE__ */ jsx53("rect", { x: "42", y: "16", width: "14", height: "2", rx: "1", fill: TEXT }),
-      /* @__PURE__ */ jsx53("rect", { x: "62", y: "16", width: "14", height: "2", rx: "1", fill: TEXT }),
-      /* @__PURE__ */ jsx53("rect", { x: "82", y: "16", width: "14", height: "2", rx: "1", fill: TEXT }),
-      [26, 34, 42, 50].map((y, i) => /* @__PURE__ */ jsxs49("g", { children: [
-        /* @__PURE__ */ jsx53("rect", { x: "14", y, width: "22", height: "1.5", rx: "0.5", fill: MUTED }),
-        [42, 62, 82].map((cx, j) => /* @__PURE__ */ jsx53("text", { x: cx + 7, y: y + 2, fontSize: "5", fill: (i + j) % 2 ? PRIMARY : MUTED, textAnchor: "middle", fontFamily: "system-ui", children: (i + j) % 2 ? "\u2713" : "\xB7" }, j))
+    PricingComparison: /* @__PURE__ */ jsxs50(Frame, { children: [
+      /* @__PURE__ */ jsx67("rect", { x: "10", y: "14", width: "100", height: "6", fill: PRIMARY_SOFT }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "16", width: "22", height: "2", rx: "1", fill: TEXT }),
+      /* @__PURE__ */ jsx67("rect", { x: "42", y: "16", width: "14", height: "2", rx: "1", fill: TEXT }),
+      /* @__PURE__ */ jsx67("rect", { x: "62", y: "16", width: "14", height: "2", rx: "1", fill: TEXT }),
+      /* @__PURE__ */ jsx67("rect", { x: "82", y: "16", width: "14", height: "2", rx: "1", fill: TEXT }),
+      [26, 34, 42, 50].map((y, i) => /* @__PURE__ */ jsxs50("g", { children: [
+        /* @__PURE__ */ jsx67("rect", { x: "14", y, width: "22", height: "1.5", rx: "0.5", fill: MUTED }),
+        [42, 62, 82].map((cx, j) => /* @__PURE__ */ jsx67("text", { x: cx + 7, y: y + 2, fontSize: "5", fill: (i + j) % 2 ? PRIMARY : MUTED, textAnchor: "middle", fontFamily: "system-ui", children: (i + j) % 2 ? "\u2713" : "\xB7" }, j))
       ] }, i))
     ] }),
-    AwardsBar: /* @__PURE__ */ jsx53(Frame, { children: [24, 60, 96].map((x, i) => /* @__PURE__ */ jsxs49("g", { children: [
-      /* @__PURE__ */ jsx53("circle", { cx: x, cy: "22", r: "6", fill: ACCENT, opacity: "0.85" }),
-      /* @__PURE__ */ jsx53("rect", { x: x - 12, y: "32", width: "24", height: "2.5", rx: "1", fill: TEXT }),
-      /* @__PURE__ */ jsx53("rect", { x: x - 8, y: "38", width: "16", height: "2", rx: "1", fill: MUTED }),
-      /* @__PURE__ */ jsx53("rect", { x: x - 5, y: "44", width: "10", height: "1.5", rx: "0.5", fill: MUTED, opacity: "0.6" })
+    AwardsBar: /* @__PURE__ */ jsx67(Frame, { children: [24, 60, 96].map((x, i) => /* @__PURE__ */ jsxs50("g", { children: [
+      /* @__PURE__ */ jsx67("circle", { cx: x, cy: "22", r: "6", fill: ACCENT, opacity: "0.85" }),
+      /* @__PURE__ */ jsx67("rect", { x: x - 12, y: "32", width: "24", height: "2.5", rx: "1", fill: TEXT }),
+      /* @__PURE__ */ jsx67("rect", { x: x - 8, y: "38", width: "16", height: "2", rx: "1", fill: MUTED }),
+      /* @__PURE__ */ jsx67("rect", { x: x - 5, y: "44", width: "10", height: "1.5", rx: "0.5", fill: MUTED, opacity: "0.6" })
     ] }, i)) }),
-    CountUpStats: /* @__PURE__ */ jsx53(Frame, { soft: true, children: [24, 60, 96].map((x, i) => /* @__PURE__ */ jsxs49("g", { children: [
-      /* @__PURE__ */ jsxs49("text", { x, y: "28", fontSize: "14", fontWeight: "800", fill: PRIMARY, textAnchor: "middle", fontFamily: "system-ui", children: [
+    CountUpStats: /* @__PURE__ */ jsx67(Frame, { soft: true, children: [24, 60, 96].map((x, i) => /* @__PURE__ */ jsxs50("g", { children: [
+      /* @__PURE__ */ jsxs50("text", { x, y: "28", fontSize: "14", fontWeight: "800", fill: PRIMARY, textAnchor: "middle", fontFamily: "system-ui", children: [
         ["80", "50", "14"][i],
         ["%", "+", ""][i]
       ] }),
-      /* @__PURE__ */ jsx53("rect", { x: x - 16, y: "36", width: "32", height: "2", rx: "1", fill: MUTED }),
-      /* @__PURE__ */ jsx53("rect", { x: x - 12, y: "42", width: "24", height: "2", rx: "1", fill: MUTED, opacity: "0.7" })
+      /* @__PURE__ */ jsx67("rect", { x: x - 16, y: "36", width: "32", height: "2", rx: "1", fill: MUTED }),
+      /* @__PURE__ */ jsx67("rect", { x: x - 12, y: "42", width: "24", height: "2", rx: "1", fill: MUTED, opacity: "0.7" })
     ] }, i)) }),
-    ImageGallery: /* @__PURE__ */ jsx53(Frame, { children: [
+    ImageGallery: /* @__PURE__ */ jsx67(Frame, { children: [
       [10, 12, 32, 22],
       [44, 12, 32, 22],
       [78, 12, 32, 22],
       [10, 36, 32, 22],
       [44, 36, 32, 22],
       [78, 36, 32, 22]
-    ].map(([x, y, w, h], i) => /* @__PURE__ */ jsx53("rect", { x, y, width: w, height: h, rx: "2", fill: PRIMARY_SOFT, stroke: BORDER, strokeWidth: "0.5" }, i)) }),
-    ImageCaption: /* @__PURE__ */ jsxs49(Frame, { children: [
-      /* @__PURE__ */ jsx53("rect", { x: "20", y: "12", width: "80", height: "34", rx: "2", fill: PRIMARY_SOFT, stroke: BORDER, strokeWidth: "0.6" }),
-      /* @__PURE__ */ jsx53("line", { x1: "30", y1: "20", x2: "90", y2: "38", stroke: PRIMARY, strokeWidth: "0.4", opacity: "0.4" }),
-      /* @__PURE__ */ jsx53("line", { x1: "90", y1: "20", x2: "30", y2: "38", stroke: PRIMARY, strokeWidth: "0.4", opacity: "0.4" }),
-      /* @__PURE__ */ jsx53("rect", { x: "34", y: "52", width: "52", height: "2", rx: "1", fill: MUTED }),
-      /* @__PURE__ */ jsx53("rect", { x: "42", y: "56", width: "36", height: "2", rx: "1", fill: MUTED, opacity: "0.7" })
+    ].map(([x, y, w, h], i) => /* @__PURE__ */ jsx67("rect", { x, y, width: w, height: h, rx: "2", fill: PRIMARY_SOFT, stroke: BORDER, strokeWidth: "0.5" }, i)) }),
+    ImageCaption: /* @__PURE__ */ jsxs50(Frame, { children: [
+      /* @__PURE__ */ jsx67("rect", { x: "20", y: "12", width: "80", height: "34", rx: "2", fill: PRIMARY_SOFT, stroke: BORDER, strokeWidth: "0.6" }),
+      /* @__PURE__ */ jsx67("line", { x1: "30", y1: "20", x2: "90", y2: "38", stroke: PRIMARY, strokeWidth: "0.4", opacity: "0.4" }),
+      /* @__PURE__ */ jsx67("line", { x1: "90", y1: "20", x2: "30", y2: "38", stroke: PRIMARY, strokeWidth: "0.4", opacity: "0.4" }),
+      /* @__PURE__ */ jsx67("rect", { x: "34", y: "52", width: "52", height: "2", rx: "1", fill: MUTED }),
+      /* @__PURE__ */ jsx67("rect", { x: "42", y: "56", width: "36", height: "2", rx: "1", fill: MUTED, opacity: "0.7" })
     ] }),
-    InlineCTA: /* @__PURE__ */ jsxs49(Frame, { soft: true, children: [
-      /* @__PURE__ */ jsx53("rect", { x: "10", y: "22", width: "100", height: "26", rx: "3", fill: "#fff", stroke: BORDER, strokeWidth: "0.6" }),
-      /* @__PURE__ */ jsx53("rect", { x: "16", y: "28", width: "50", height: "3.5", rx: "1", fill: TEXT }),
-      /* @__PURE__ */ jsx53("rect", { x: "16", y: "36", width: "58", height: "2", rx: "1", fill: MUTED }),
-      /* @__PURE__ */ jsx53("rect", { x: "80", y: "30", width: "24", height: "10", rx: "2", fill: PRIMARY })
+    InlineCTA: /* @__PURE__ */ jsxs50(Frame, { soft: true, children: [
+      /* @__PURE__ */ jsx67("rect", { x: "10", y: "22", width: "100", height: "26", rx: "3", fill: CARD, stroke: BORDER, strokeWidth: "0.6" }),
+      /* @__PURE__ */ jsx67("rect", { x: "16", y: "28", width: "50", height: "3.5", rx: "1", fill: TEXT }),
+      /* @__PURE__ */ jsx67("rect", { x: "16", y: "36", width: "58", height: "2", rx: "1", fill: MUTED }),
+      /* @__PURE__ */ jsx67("rect", { x: "80", y: "30", width: "24", height: "10", rx: "2", fill: PRIMARY })
     ] }),
-    AnnouncementBar: /* @__PURE__ */ jsxs49(Frame, { children: [
-      /* @__PURE__ */ jsx53("rect", { x: "0", y: "20", width: FRAME_W, height: "14", fill: "#0F172A" }),
-      /* @__PURE__ */ jsx53("rect", { x: "30", y: "25", width: "38", height: "2", rx: "1", fill: "#fff" }),
-      /* @__PURE__ */ jsx53("rect", { x: "72", y: "25", width: "22", height: "2", rx: "1", fill: ACCENT })
+    AnnouncementBar: /* @__PURE__ */ jsxs50(Frame, { children: [
+      /* @__PURE__ */ jsx67("rect", { x: "0", y: "20", width: FRAME_W, height: "14", fill: "#0F172A" }),
+      /* @__PURE__ */ jsx67("rect", { x: "30", y: "25", width: "38", height: "2", rx: "1", fill: "#ffffff" }),
+      /* @__PURE__ */ jsx67("rect", { x: "72", y: "25", width: "22", height: "2", rx: "1", fill: ACCENT })
     ] }),
-    Quote: /* @__PURE__ */ jsxs49(Frame, { children: [
-      /* @__PURE__ */ jsx53("text", { x: "14", y: "24", fontSize: "14", fontFamily: "Georgia", fill: PRIMARY, opacity: "0.6", children: '"' }),
-      /* @__PURE__ */ jsx53("rect", { x: "22", y: "24", width: "80", height: "3.5", rx: "1", fill: TEXT }),
-      /* @__PURE__ */ jsx53("rect", { x: "22", y: "32", width: "74", height: "3.5", rx: "1", fill: TEXT }),
-      /* @__PURE__ */ jsx53("rect", { x: "22", y: "40", width: "58", height: "3.5", rx: "1", fill: TEXT }),
-      /* @__PURE__ */ jsx53("rect", { x: "22", y: "50", width: "22", height: "2", rx: "1", fill: MUTED })
+    Quote: /* @__PURE__ */ jsxs50(Frame, { children: [
+      /* @__PURE__ */ jsx67("text", { x: "14", y: "24", fontSize: "14", fontFamily: "Georgia", fill: PRIMARY, opacity: "0.6", children: '"' }),
+      /* @__PURE__ */ jsx67("rect", { x: "22", y: "24", width: "80", height: "3.5", rx: "1", fill: TEXT }),
+      /* @__PURE__ */ jsx67("rect", { x: "22", y: "32", width: "74", height: "3.5", rx: "1", fill: TEXT }),
+      /* @__PURE__ */ jsx67("rect", { x: "22", y: "40", width: "58", height: "3.5", rx: "1", fill: TEXT }),
+      /* @__PURE__ */ jsx67("rect", { x: "22", y: "50", width: "22", height: "2", rx: "1", fill: MUTED })
     ] }),
-    CodeBlock: /* @__PURE__ */ jsxs49(Frame, { children: [
-      /* @__PURE__ */ jsx53("rect", { x: "10", y: "12", width: "100", height: "48", rx: "2", fill: "#0F172A" }),
-      /* @__PURE__ */ jsx53("rect", { x: "10", y: "12", width: "100", height: "8", fill: "#1E293B" }),
-      /* @__PURE__ */ jsx53("rect", { x: "14", y: "14", width: "20", height: "3", rx: "0.5", fill: MUTED }),
-      /* @__PURE__ */ jsx53("text", { x: "14", y: "29", fontSize: "6", fill: "#7DD3FC", fontFamily: "ui-monospace, monospace", children: "$ make" }),
-      /* @__PURE__ */ jsx53("text", { x: "14", y: "38", fontSize: "6", fill: "#86EFAC", fontFamily: "ui-monospace, monospace", children: "  build" }),
-      /* @__PURE__ */ jsx53("text", { x: "14", y: "47", fontSize: "6", fill: "#FCA5A5", fontFamily: "ui-monospace, monospace", children: "  deploy" }),
-      /* @__PURE__ */ jsx53("text", { x: "14", y: "56", fontSize: "6", fill: "#E2E8F0", fontFamily: "ui-monospace, monospace", children: `{ ok: true }` })
+    CodeBlock: /* @__PURE__ */ jsxs50(Frame, { children: [
+      /* @__PURE__ */ jsx67("rect", { x: "10", y: "12", width: "100", height: "48", rx: "2", fill: "#0F172A" }),
+      /* @__PURE__ */ jsx67("rect", { x: "10", y: "12", width: "100", height: "8", fill: "#1E293B" }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "14", width: "20", height: "3", rx: "0.5", fill: MUTED }),
+      /* @__PURE__ */ jsx67("text", { x: "14", y: "29", fontSize: "6", fill: "#7DD3FC", fontFamily: "ui-monospace, monospace", children: "$ make" }),
+      /* @__PURE__ */ jsx67("text", { x: "14", y: "38", fontSize: "6", fill: "#86EFAC", fontFamily: "ui-monospace, monospace", children: "  build" }),
+      /* @__PURE__ */ jsx67("text", { x: "14", y: "47", fontSize: "6", fill: "#FCA5A5", fontFamily: "ui-monospace, monospace", children: "  deploy" }),
+      /* @__PURE__ */ jsx67("text", { x: "14", y: "56", fontSize: "6", fill: "#E2E8F0", fontFamily: "ui-monospace, monospace", children: `{ ok: true }` })
     ] }),
-    KeyValueList: /* @__PURE__ */ jsx53(Frame, { children: [18, 30, 42, 54].map((y, i) => /* @__PURE__ */ jsxs49("g", { children: [
-      /* @__PURE__ */ jsx53("line", { x1: "14", y1: y - 6, x2: "106", y2: y - 6, stroke: BORDER, strokeWidth: "0.5" }),
-      /* @__PURE__ */ jsx53("rect", { x: "14", y: y - 2, width: "28", height: "2", rx: "1", fill: MUTED }),
-      /* @__PURE__ */ jsx53("rect", { x: "50", y: y - 2, width: "50", height: "2", rx: "1", fill: TEXT })
+    KeyValueList: /* @__PURE__ */ jsx67(Frame, { children: [18, 30, 42, 54].map((y, i) => /* @__PURE__ */ jsxs50("g", { children: [
+      /* @__PURE__ */ jsx67("line", { x1: "14", y1: y - 6, x2: "106", y2: y - 6, stroke: BORDER, strokeWidth: "0.5" }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: y - 2, width: "28", height: "2", rx: "1", fill: MUTED }),
+      /* @__PURE__ */ jsx67("rect", { x: "50", y: y - 2, width: "50", height: "2", rx: "1", fill: TEXT })
     ] }, i)) }),
-    StepsVertical: /* @__PURE__ */ jsxs49(Frame, { children: [
-      /* @__PURE__ */ jsx53("line", { x1: "22", y1: "14", x2: "22", y2: "58", stroke: BORDER, strokeWidth: "0.6" }),
-      [16, 32, 48].map((y, i) => /* @__PURE__ */ jsxs49("g", { children: [
-        /* @__PURE__ */ jsx53("circle", { cx: "22", cy: y, r: "5", fill: PRIMARY_SOFT, stroke: PRIMARY, strokeWidth: "0.7" }),
-        /* @__PURE__ */ jsx53("text", { x: "22", y: y + 1.5, fontSize: "5", fontWeight: "700", fill: PRIMARY, textAnchor: "middle", fontFamily: "system-ui", children: i + 1 }),
-        /* @__PURE__ */ jsx53("rect", { x: "34", y: y - 2, width: "28", height: "3", rx: "1", fill: TEXT }),
-        /* @__PURE__ */ jsx53("rect", { x: "34", y: y + 4, width: "48", height: "2", rx: "1", fill: MUTED })
+    StepsVertical: /* @__PURE__ */ jsxs50(Frame, { children: [
+      /* @__PURE__ */ jsx67("line", { x1: "22", y1: "14", x2: "22", y2: "58", stroke: BORDER, strokeWidth: "0.6" }),
+      [16, 32, 48].map((y, i) => /* @__PURE__ */ jsxs50("g", { children: [
+        /* @__PURE__ */ jsx67("circle", { cx: "22", cy: y, r: "5", fill: PRIMARY_SOFT, stroke: PRIMARY, strokeWidth: "0.7" }),
+        /* @__PURE__ */ jsx67("text", { x: "22", y: y + 1.5, fontSize: "5", fontWeight: "700", fill: PRIMARY, textAnchor: "middle", fontFamily: "system-ui", children: i + 1 }),
+        /* @__PURE__ */ jsx67("rect", { x: "34", y: y - 2, width: "28", height: "3", rx: "1", fill: TEXT }),
+        /* @__PURE__ */ jsx67("rect", { x: "34", y: y + 4, width: "48", height: "2", rx: "1", fill: MUTED })
       ] }, i))
     ] }),
-    TabsBlock: /* @__PURE__ */ jsxs49(Frame, { children: [
-      /* @__PURE__ */ jsx53("rect", { x: "14", y: "14", width: "20", height: "6", rx: "1", fill: PRIMARY }),
-      /* @__PURE__ */ jsx53("rect", { x: "36", y: "14", width: "20", height: "6", rx: "1", fill: "#fff", stroke: BORDER, strokeWidth: "0.5" }),
-      /* @__PURE__ */ jsx53("rect", { x: "58", y: "14", width: "20", height: "6", rx: "1", fill: "#fff", stroke: BORDER, strokeWidth: "0.5" }),
-      /* @__PURE__ */ jsx53("line", { x1: "14", y1: "22", x2: "106", y2: "22", stroke: BORDER, strokeWidth: "0.5" }),
-      /* @__PURE__ */ jsx53("rect", { x: "14", y: "28", width: "78", height: "2", rx: "1", fill: TEXT }),
-      /* @__PURE__ */ jsx53("rect", { x: "14", y: "34", width: "86", height: "2", rx: "1", fill: MUTED }),
-      /* @__PURE__ */ jsx53("rect", { x: "14", y: "40", width: "80", height: "2", rx: "1", fill: MUTED }),
-      /* @__PURE__ */ jsx53("rect", { x: "14", y: "46", width: "60", height: "2", rx: "1", fill: MUTED })
+    TabsBlock: /* @__PURE__ */ jsxs50(Frame, { children: [
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "14", width: "20", height: "6", rx: "1", fill: PRIMARY }),
+      /* @__PURE__ */ jsx67("rect", { x: "36", y: "14", width: "20", height: "6", rx: "1", fill: CARD, stroke: BORDER, strokeWidth: "0.5" }),
+      /* @__PURE__ */ jsx67("rect", { x: "58", y: "14", width: "20", height: "6", rx: "1", fill: CARD, stroke: BORDER, strokeWidth: "0.5" }),
+      /* @__PURE__ */ jsx67("line", { x1: "14", y1: "22", x2: "106", y2: "22", stroke: BORDER, strokeWidth: "0.5" }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "28", width: "78", height: "2", rx: "1", fill: TEXT }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "34", width: "86", height: "2", rx: "1", fill: MUTED }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "40", width: "80", height: "2", rx: "1", fill: MUTED }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "46", width: "60", height: "2", rx: "1", fill: MUTED })
     ] }),
-    AccordionBlock: /* @__PURE__ */ jsx53(Frame, { children: [14, 30, 46].map((y, i) => /* @__PURE__ */ jsxs49("g", { children: [
-      /* @__PURE__ */ jsx53("rect", { x: "14", y, width: "92", height: "10", rx: "2", fill: i === 0 ? PRIMARY_SOFT : "#fff", stroke: BORDER, strokeWidth: "0.5" }),
-      /* @__PURE__ */ jsx53("rect", { x: "20", y: y + 4, width: "44", height: "2.5", rx: "1", fill: TEXT }),
-      /* @__PURE__ */ jsx53("text", { x: "100", y: y + 7, fontSize: "6", fill: MUTED, textAnchor: "middle", fontFamily: "system-ui", children: i === 0 ? "\u2212" : "+" }),
-      i === 0 && /* @__PURE__ */ jsxs49(Fragment5, { children: [
-        /* @__PURE__ */ jsx53("rect", { x: "20", y: y + 12, width: "68", height: "1.5", rx: "0.5", fill: MUTED }),
-        /* @__PURE__ */ jsx53("rect", { x: "20", y: y + 16, width: "60", height: "1.5", rx: "0.5", fill: MUTED })
+    AccordionBlock: /* @__PURE__ */ jsx67(Frame, { children: [14, 30, 46].map((y, i) => /* @__PURE__ */ jsxs50("g", { children: [
+      /* @__PURE__ */ jsx67("rect", { x: "14", y, width: "92", height: "10", rx: "2", fill: i === 0 ? PRIMARY_SOFT : CARD, stroke: BORDER, strokeWidth: "0.5" }),
+      /* @__PURE__ */ jsx67("rect", { x: "20", y: y + 4, width: "44", height: "2.5", rx: "1", fill: TEXT }),
+      /* @__PURE__ */ jsx67("text", { x: "100", y: y + 7, fontSize: "6", fill: MUTED, textAnchor: "middle", fontFamily: "system-ui", children: i === 0 ? "\u2212" : "+" }),
+      i === 0 && /* @__PURE__ */ jsxs50(Fragment5, { children: [
+        /* @__PURE__ */ jsx67("rect", { x: "20", y: y + 12, width: "68", height: "1.5", rx: "0.5", fill: MUTED }),
+        /* @__PURE__ */ jsx67("rect", { x: "20", y: y + 16, width: "60", height: "1.5", rx: "0.5", fill: MUTED })
       ] })
     ] }, i)) }),
-    SocialLinks: /* @__PURE__ */ jsxs49(Frame, { children: [
-      /* @__PURE__ */ jsx53("rect", { x: "40", y: "22", width: "40", height: "2", rx: "1", fill: MUTED }),
-      [42, 54, 66, 78].map((x, i) => /* @__PURE__ */ jsx53("circle", { cx: x, cy: "42", r: "5", fill: PRIMARY_SOFT, stroke: PRIMARY, strokeWidth: "0.5" }, i))
+    SocialLinks: /* @__PURE__ */ jsxs50(Frame, { children: [
+      /* @__PURE__ */ jsx67("rect", { x: "40", y: "22", width: "40", height: "2", rx: "1", fill: MUTED }),
+      [42, 54, 66, 78].map((x, i) => /* @__PURE__ */ jsx67("circle", { cx: x, cy: "42", r: "5", fill: PRIMARY_SOFT, stroke: PRIMARY, strokeWidth: "0.5" }, i))
     ] }),
-    ContactInfo: /* @__PURE__ */ jsxs49(Frame, { children: [
-      /* @__PURE__ */ jsx53("rect", { x: "10", y: "14", width: "100", height: "46", rx: "2", fill: "#fff", stroke: BORDER, strokeWidth: "0.6" }),
-      [[18, 22], [62, 22], [18, 42], [62, 42]].map(([x, y], i) => /* @__PURE__ */ jsxs49("g", { children: [
-        /* @__PURE__ */ jsx53("circle", { cx: x + 4, cy: y + 4, r: "2.5", fill: PRIMARY, opacity: "0.7" }),
-        /* @__PURE__ */ jsx53("rect", { x: x + 10, y, width: "14", height: "2", rx: "1", fill: MUTED }),
-        /* @__PURE__ */ jsx53("rect", { x: x + 10, y: y + 4, width: "22", height: "2.5", rx: "1", fill: TEXT })
+    ContactInfo: /* @__PURE__ */ jsxs50(Frame, { children: [
+      /* @__PURE__ */ jsx67("rect", { x: "10", y: "14", width: "100", height: "46", rx: "2", fill: CARD, stroke: BORDER, strokeWidth: "0.6" }),
+      [[18, 22], [62, 22], [18, 42], [62, 42]].map(([x, y], i) => /* @__PURE__ */ jsxs50("g", { children: [
+        /* @__PURE__ */ jsx67("circle", { cx: x + 4, cy: y + 4, r: "2.5", fill: PRIMARY, opacity: "0.7" }),
+        /* @__PURE__ */ jsx67("rect", { x: x + 10, y, width: "14", height: "2", rx: "1", fill: MUTED }),
+        /* @__PURE__ */ jsx67("rect", { x: x + 10, y: y + 4, width: "22", height: "2.5", rx: "1", fill: TEXT })
       ] }, i))
     ] }),
-    MapEmbed: /* @__PURE__ */ jsxs49(Frame, { children: [
-      /* @__PURE__ */ jsx53("rect", { x: "10", y: "12", width: "100", height: "44", rx: "2", fill: "#DCFCE7", stroke: BORDER, strokeWidth: "0.5" }),
-      /* @__PURE__ */ jsx53("path", { d: "M 14 28 Q 30 14 50 28 T 90 28 L 106 22", stroke: MUTED, strokeWidth: "0.5", fill: "none" }),
-      /* @__PURE__ */ jsx53("path", { d: "M 14 42 Q 40 32 70 44 L 106 38", stroke: MUTED, strokeWidth: "0.5", fill: "none" }),
-      /* @__PURE__ */ jsx53("circle", { cx: "60", cy: "32", r: "3", fill: "#DC2626" }),
-      /* @__PURE__ */ jsx53("path", { d: "M 60 35 L 58 40 L 62 40 Z", fill: "#DC2626" })
+    MapEmbed: /* @__PURE__ */ jsxs50(Frame, { children: [
+      /* @__PURE__ */ jsx67("rect", { x: "10", y: "12", width: "100", height: "44", rx: "2", fill: "#DCFCE7", stroke: BORDER, strokeWidth: "0.5" }),
+      /* @__PURE__ */ jsx67("path", { d: "M 14 28 Q 30 14 50 28 T 90 28 L 106 22", stroke: MUTED, strokeWidth: "0.5", fill: "none" }),
+      /* @__PURE__ */ jsx67("path", { d: "M 14 42 Q 40 32 70 44 L 106 38", stroke: MUTED, strokeWidth: "0.5", fill: "none" }),
+      /* @__PURE__ */ jsx67("circle", { cx: "60", cy: "32", r: "3", fill: "#DC2626" }),
+      /* @__PURE__ */ jsx67("path", { d: "M 60 35 L 58 40 L 62 40 Z", fill: "#DC2626" })
     ] }),
-    EventsList: /* @__PURE__ */ jsx53(Frame, { children: [14, 30, 46].map((y, i) => /* @__PURE__ */ jsxs49("g", { children: [
-      /* @__PURE__ */ jsx53("rect", { x: "14", y, width: "92", height: "11", rx: "2", fill: "#fff", stroke: BORDER, strokeWidth: "0.5" }),
-      /* @__PURE__ */ jsx53("rect", { x: "18", y: y + 2, width: "14", height: "7", rx: "1", fill: PRIMARY_SOFT }),
-      /* @__PURE__ */ jsx53("text", { x: "25", y: y + 7, fontSize: "4", fontWeight: "700", fill: PRIMARY, textAnchor: "middle", fontFamily: "system-ui", children: ["MAR", "APR", "MAY"][i] }),
-      /* @__PURE__ */ jsx53("rect", { x: "36", y: y + 3, width: "40", height: "2", rx: "1", fill: TEXT }),
-      /* @__PURE__ */ jsx53("rect", { x: "36", y: y + 7, width: "50", height: "1.5", rx: "0.5", fill: MUTED }),
-      /* @__PURE__ */ jsx53("text", { x: "100", y: y + 7, fontSize: "5", fill: PRIMARY, textAnchor: "middle", fontFamily: "system-ui", children: "\u2192" })
+    EventsList: /* @__PURE__ */ jsx67(Frame, { children: [14, 30, 46].map((y, i) => /* @__PURE__ */ jsxs50("g", { children: [
+      /* @__PURE__ */ jsx67("rect", { x: "14", y, width: "92", height: "11", rx: "2", fill: CARD, stroke: BORDER, strokeWidth: "0.5" }),
+      /* @__PURE__ */ jsx67("rect", { x: "18", y: y + 2, width: "14", height: "7", rx: "1", fill: PRIMARY_SOFT }),
+      /* @__PURE__ */ jsx67("text", { x: "25", y: y + 7, fontSize: "4", fontWeight: "700", fill: PRIMARY, textAnchor: "middle", fontFamily: "system-ui", children: ["MAR", "APR", "MAY"][i] }),
+      /* @__PURE__ */ jsx67("rect", { x: "36", y: y + 3, width: "40", height: "2", rx: "1", fill: TEXT }),
+      /* @__PURE__ */ jsx67("rect", { x: "36", y: y + 7, width: "50", height: "1.5", rx: "0.5", fill: MUTED }),
+      /* @__PURE__ */ jsx67("text", { x: "100", y: y + 7, fontSize: "5", fill: PRIMARY, textAnchor: "middle", fontFamily: "system-ui", children: "\u2192" })
     ] }, i)) }),
-    Divider: /* @__PURE__ */ jsxs49(Frame, { children: [
-      /* @__PURE__ */ jsx53("line", { x1: "14", y1: "35", x2: "50", y2: "35", stroke: BORDER, strokeWidth: "0.8" }),
-      /* @__PURE__ */ jsx53("text", { x: "60", y: "38", fontSize: "6", fill: MUTED, textAnchor: "middle", fontWeight: "700", fontFamily: "system-ui", children: "\u2014 OR \u2014" }),
-      /* @__PURE__ */ jsx53("line", { x1: "70", y1: "35", x2: "106", y2: "35", stroke: BORDER, strokeWidth: "0.8" })
+    Divider: /* @__PURE__ */ jsxs50(Frame, { children: [
+      /* @__PURE__ */ jsx67("line", { x1: "14", y1: "35", x2: "50", y2: "35", stroke: BORDER, strokeWidth: "0.8" }),
+      /* @__PURE__ */ jsx67("text", { x: "60", y: "38", fontSize: "6", fill: MUTED, textAnchor: "middle", fontWeight: "700", fontFamily: "system-ui", children: "\u2014 OR \u2014" }),
+      /* @__PURE__ */ jsx67("line", { x1: "70", y1: "35", x2: "106", y2: "35", stroke: BORDER, strokeWidth: "0.8" })
     ] }),
-    ThreeColumn: /* @__PURE__ */ jsx53(Frame, { children: [10, 44, 78].map((x, i) => /* @__PURE__ */ jsxs49("g", { children: [
-      /* @__PURE__ */ jsx53("rect", { x, y: "14", width: "32", height: "3.5", rx: "1", fill: TEXT }),
-      /* @__PURE__ */ jsx53("rect", { x, y: "22", width: "28", height: "2", rx: "1", fill: MUTED }),
-      /* @__PURE__ */ jsx53("rect", { x, y: "26", width: "32", height: "2", rx: "1", fill: MUTED }),
-      /* @__PURE__ */ jsx53("rect", { x, y: "30", width: "26", height: "2", rx: "1", fill: MUTED }),
-      /* @__PURE__ */ jsx53("rect", { x, y: "34", width: "30", height: "2", rx: "1", fill: MUTED }),
-      /* @__PURE__ */ jsx53("rect", { x, y: "38", width: "22", height: "2", rx: "1", fill: MUTED })
+    ThreeColumn: /* @__PURE__ */ jsx67(Frame, { children: [10, 44, 78].map((x, i) => /* @__PURE__ */ jsxs50("g", { children: [
+      /* @__PURE__ */ jsx67("rect", { x, y: "14", width: "32", height: "3.5", rx: "1", fill: TEXT }),
+      /* @__PURE__ */ jsx67("rect", { x, y: "22", width: "28", height: "2", rx: "1", fill: MUTED }),
+      /* @__PURE__ */ jsx67("rect", { x, y: "26", width: "32", height: "2", rx: "1", fill: MUTED }),
+      /* @__PURE__ */ jsx67("rect", { x, y: "30", width: "26", height: "2", rx: "1", fill: MUTED }),
+      /* @__PURE__ */ jsx67("rect", { x, y: "34", width: "30", height: "2", rx: "1", fill: MUTED }),
+      /* @__PURE__ */ jsx67("rect", { x, y: "38", width: "22", height: "2", rx: "1", fill: MUTED })
     ] }, i)) }),
-    PressMentions: /* @__PURE__ */ jsxs49(Frame, { soft: true, children: [
-      /* @__PURE__ */ jsx53("rect", { x: "40", y: "14", width: "40", height: "2", rx: "1", fill: MUTED }),
-      [20, 50, 80].map((cx, i) => /* @__PURE__ */ jsx53("text", { x: cx, y: "42", fontSize: "9", fontFamily: "Georgia", fontStyle: "italic", fontWeight: "600", fill: MUTED, textAnchor: "middle", children: ["Forbes", "WSJ", "TechCrunch"][i] }, i))
+    PressMentions: /* @__PURE__ */ jsxs50(Frame, { soft: true, children: [
+      /* @__PURE__ */ jsx67("rect", { x: "40", y: "14", width: "40", height: "2", rx: "1", fill: MUTED }),
+      [20, 50, 80].map((cx, i) => /* @__PURE__ */ jsx67("text", { x: cx, y: "42", fontSize: "9", fontFamily: "Georgia", fontStyle: "italic", fontWeight: "600", fill: MUTED, textAnchor: "middle", children: ["Forbes", "WSJ", "TechCrunch"][i] }, i))
+    ] }),
+    Container: /* @__PURE__ */ jsxs50(Frame, { children: [
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "14", width: "92", height: "46", rx: "3", fill: PRIMARY_SOFT, stroke: PRIMARY, strokeWidth: "0.5", strokeDasharray: "2 2" }),
+      /* @__PURE__ */ jsx67("rect", { x: "22", y: "22", width: "20", height: "2.5", rx: "1", fill: PRIMARY }),
+      /* @__PURE__ */ jsx67("rect", { x: "22", y: "30", width: "60", height: "4", rx: "1.5", fill: TEXT }),
+      /* @__PURE__ */ jsx67("rect", { x: "22", y: "40", width: "76", height: "2", rx: "1", fill: MUTED }),
+      /* @__PURE__ */ jsx67("rect", { x: "22", y: "44", width: "68", height: "2", rx: "1", fill: MUTED }),
+      /* @__PURE__ */ jsx67("rect", { x: "22", y: "48", width: "50", height: "2", rx: "1", fill: MUTED })
+    ] }),
+    // ── Form blocks ──────────────────────────────────────────────────────────
+    FormContact: /* @__PURE__ */ jsxs50(Frame, { children: [
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "9", width: "46", height: "3", rx: "1", fill: TEXT }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "17", width: "42", height: "6", rx: "1.5", fill: CARD, stroke: BORDER, strokeWidth: "0.5" }),
+      /* @__PURE__ */ jsx67("rect", { x: "62", y: "17", width: "44", height: "6", rx: "1.5", fill: CARD, stroke: BORDER, strokeWidth: "0.5" }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "27", width: "42", height: "6", rx: "1.5", fill: CARD, stroke: BORDER, strokeWidth: "0.5" }),
+      /* @__PURE__ */ jsx67("rect", { x: "62", y: "27", width: "44", height: "6", rx: "1.5", fill: CARD, stroke: BORDER, strokeWidth: "0.5" }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "37", width: "92", height: "18", rx: "1.5", fill: CARD, stroke: BORDER, strokeWidth: "0.5" }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "59", width: "28", height: "8", rx: "2", fill: PRIMARY })
+    ] }),
+    FormLeadCapture: /* @__PURE__ */ jsxs50(Frame, { children: [
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "9", width: "52", height: "3", rx: "1", fill: TEXT }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "17", width: "42", height: "6", rx: "1.5", fill: CARD, stroke: BORDER, strokeWidth: "0.5" }),
+      /* @__PURE__ */ jsx67("rect", { x: "62", y: "17", width: "44", height: "6", rx: "1.5", fill: CARD, stroke: BORDER, strokeWidth: "0.5" }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "27", width: "92", height: "6", rx: "1.5", fill: CARD, stroke: BORDER, strokeWidth: "0.5" }),
+      /* @__PURE__ */ jsx67("text", { x: "100", y: "31.5", fontSize: "5", fill: MUTED, fontFamily: "system-ui", children: "\u25BC" }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "37", width: "92", height: "6", rx: "1.5", fill: PRIMARY_SOFT, stroke: PRIMARY, strokeWidth: "0.5", opacity: "0.7" }),
+      /* @__PURE__ */ jsx67("rect", { x: "17", y: "39.5", width: "14", height: "2.5", rx: "1", fill: PRIMARY, opacity: "0.8" }),
+      /* @__PURE__ */ jsx67("rect", { x: "33", y: "39.5", width: "18", height: "2.5", rx: "1", fill: PRIMARY, opacity: "0.8" }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "47", width: "92", height: "11", rx: "1.5", fill: CARD, stroke: BORDER, strokeWidth: "0.5" }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "62", width: "32", height: "6", rx: "2", fill: PRIMARY })
+    ] }),
+    FormNewsletter: /* @__PURE__ */ jsxs50(Frame, { soft: true, children: [
+      /* @__PURE__ */ jsx67("rect", { x: "28", y: "9", width: "64", height: "4", rx: "1.5", fill: TEXT }),
+      /* @__PURE__ */ jsx67("rect", { x: "28", y: "17", width: "60", height: "2.5", rx: "1", fill: MUTED }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "28", width: "60", height: "8", rx: "2", fill: CARD, stroke: BORDER, strokeWidth: "0.6" }),
+      /* @__PURE__ */ jsx67("rect", { x: "78", y: "28", width: "28", height: "8", rx: "2", fill: PRIMARY }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "42", width: "5", height: "5", rx: "1", fill: CARD, stroke: BORDER, strokeWidth: "0.6" }),
+      /* @__PURE__ */ jsx67("rect", { x: "22", y: "43", width: "50", height: "2", rx: "1", fill: MUTED }),
+      /* @__PURE__ */ jsx67("rect", { x: "22", y: "48", width: "38", height: "2", rx: "1", fill: MUTED })
+    ] }),
+    FormFeedback: /* @__PURE__ */ jsxs50(Frame, { children: [
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "9", width: "44", height: "3", rx: "1", fill: TEXT }),
+      [14, 22, 30, 38, 46].map((x, i) => /* @__PURE__ */ jsx67("text", { x, y: "22", fontSize: "8", fill: i < 4 ? ACCENT : BORDER, fontFamily: "system-ui", children: "\u2605" }, i)),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "28", width: "92", height: "6", rx: "1.5", fill: CARD, stroke: BORDER, strokeWidth: "0.5" }),
+      /* @__PURE__ */ jsx67("text", { x: "100", y: "32.5", fontSize: "5", fill: MUTED, fontFamily: "system-ui", children: "\u25BC" }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "38", width: "92", height: "18", rx: "1.5", fill: CARD, stroke: BORDER, strokeWidth: "0.5" }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "60", width: "30", height: "7", rx: "2", fill: PRIMARY })
+    ] }),
+    FormSurvey: /* @__PURE__ */ jsxs50(Frame, { children: [
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "9", width: "40", height: "3", rx: "1", fill: TEXT }),
+      [14, 22, 30, 38, 46].map((x, i) => /* @__PURE__ */ jsx67("text", { x, y: "21", fontSize: "8", fill: i < 3 ? ACCENT : BORDER, fontFamily: "system-ui", children: "\u2605" }, i)),
+      [27, 35, 43, 51].map((y, i) => /* @__PURE__ */ jsxs50("g", { children: [
+        /* @__PURE__ */ jsx67("circle", { cx: "19", cy: y, r: "2.5", fill: i === 0 ? PRIMARY_SOFT : CARD, stroke: i === 0 ? PRIMARY : BORDER, strokeWidth: "0.7" }),
+        i === 0 && /* @__PURE__ */ jsx67("circle", { cx: "19", cy: y, r: "1.2", fill: PRIMARY }),
+        /* @__PURE__ */ jsx67("rect", { x: "25", y: y - 1.5, width: "30", height: "2.5", rx: "1", fill: MUTED })
+      ] }, i)),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "57", width: "92", height: "10", rx: "1.5", fill: CARD, stroke: BORDER, strokeWidth: "0.5" })
+    ] }),
+    FormBooking: /* @__PURE__ */ jsxs50(Frame, { children: [
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "9", width: "36", height: "3", rx: "1", fill: TEXT }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "17", width: "42", height: "6", rx: "1.5", fill: CARD, stroke: BORDER, strokeWidth: "0.5" }),
+      /* @__PURE__ */ jsx67("rect", { x: "62", y: "17", width: "44", height: "6", rx: "1.5", fill: CARD, stroke: BORDER, strokeWidth: "0.5" }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "27", width: "92", height: "6", rx: "1.5", fill: CARD, stroke: BORDER, strokeWidth: "0.5" }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "37", width: "42", height: "6", rx: "1.5", fill: PRIMARY_SOFT, stroke: PRIMARY, strokeWidth: "0.5", opacity: "0.8" }),
+      /* @__PURE__ */ jsx67("rect", { x: "16", y: "39", width: "8", height: "4", rx: "0.5", fill: PRIMARY, opacity: "0.7" }),
+      /* @__PURE__ */ jsx67("rect", { x: "62", y: "37", width: "44", height: "6", rx: "1.5", fill: CARD, stroke: BORDER, strokeWidth: "0.5" }),
+      /* @__PURE__ */ jsx67("text", { x: "100", y: "41.5", fontSize: "5", fill: MUTED, fontFamily: "system-ui", children: "\u25BC" }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "47", width: "92", height: "12", rx: "1.5", fill: CARD, stroke: BORDER, strokeWidth: "0.5" }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "63", width: "30", height: "6", rx: "2", fill: PRIMARY })
+    ] }),
+    FormRegistration: /* @__PURE__ */ jsxs50(Frame, { children: [
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "8", width: "50", height: "3", rx: "1", fill: TEXT }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "16", width: "42", height: "5.5", rx: "1.5", fill: CARD, stroke: BORDER, strokeWidth: "0.5" }),
+      /* @__PURE__ */ jsx67("rect", { x: "62", y: "16", width: "44", height: "5.5", rx: "1.5", fill: CARD, stroke: BORDER, strokeWidth: "0.5" }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "25", width: "42", height: "5.5", rx: "1.5", fill: CARD, stroke: BORDER, strokeWidth: "0.5" }),
+      /* @__PURE__ */ jsx67("rect", { x: "62", y: "25", width: "44", height: "5.5", rx: "1.5", fill: CARD, stroke: BORDER, strokeWidth: "0.5" }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "34", width: "42", height: "5.5", rx: "1.5", fill: CARD, stroke: BORDER, strokeWidth: "0.5" }),
+      /* @__PURE__ */ jsx67("text", { x: "49", y: "38.5", fontSize: "5", fill: MUTED, fontFamily: "system-ui", children: "\u25BC" }),
+      /* @__PURE__ */ jsx67("rect", { x: "62", y: "34", width: "44", height: "5.5", rx: "1.5", fill: CARD, stroke: BORDER, strokeWidth: "0.5" }),
+      /* @__PURE__ */ jsx67("text", { x: "100", y: "38.5", fontSize: "5", fill: MUTED, fontFamily: "system-ui", children: "\u25BC" }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "43", width: "92", height: "5.5", rx: "1.5", fill: CARD, stroke: BORDER, strokeWidth: "0.5" }),
+      /* @__PURE__ */ jsx67("text", { x: "100", y: "47.5", fontSize: "5", fill: MUTED, fontFamily: "system-ui", children: "\u25BC" }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "53", width: "92", height: "8", rx: "1.5", fill: CARD, stroke: BORDER, strokeWidth: "0.5" }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "63", width: "28", height: "6", rx: "2", fill: PRIMARY })
+    ] }),
+    FormQuoteRequest: /* @__PURE__ */ jsxs50(Frame, { children: [
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "9", width: "44", height: "3", rx: "1", fill: TEXT }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "17", width: "42", height: "6", rx: "1.5", fill: CARD, stroke: BORDER, strokeWidth: "0.5" }),
+      /* @__PURE__ */ jsx67("rect", { x: "62", y: "17", width: "44", height: "6", rx: "1.5", fill: CARD, stroke: BORDER, strokeWidth: "0.5" }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "27", width: "42", height: "6", rx: "1.5", fill: CARD, stroke: BORDER, strokeWidth: "0.5" }),
+      /* @__PURE__ */ jsx67("text", { x: "49", y: "31.5", fontSize: "5", fill: MUTED, fontFamily: "system-ui", children: "\u25BC" }),
+      /* @__PURE__ */ jsx67("rect", { x: "62", y: "27", width: "44", height: "6", rx: "1.5", fill: CARD, stroke: BORDER, strokeWidth: "0.5" }),
+      /* @__PURE__ */ jsx67("text", { x: "100", y: "31.5", fontSize: "5", fill: MUTED, fontFamily: "system-ui", children: "\u25BC" }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "37", width: "92", height: "6", rx: "1.5", fill: CARD, stroke: BORDER, strokeWidth: "0.5" }),
+      /* @__PURE__ */ jsx67("text", { x: "100", y: "41.5", fontSize: "5", fill: MUTED, fontFamily: "system-ui", children: "\u25BC" }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "47", width: "92", height: "14", rx: "1.5", fill: CARD, stroke: BORDER, strokeWidth: "0.5" }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "63", width: "30", height: "5", rx: "1.5", fill: PRIMARY })
+    ] }),
+    FormApplication: /* @__PURE__ */ jsxs50(Frame, { children: [
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "9", width: "36", height: "3", rx: "1", fill: TEXT }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "17", width: "42", height: "6", rx: "1.5", fill: CARD, stroke: BORDER, strokeWidth: "0.5" }),
+      /* @__PURE__ */ jsx67("rect", { x: "62", y: "17", width: "44", height: "6", rx: "1.5", fill: CARD, stroke: BORDER, strokeWidth: "0.5" }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "27", width: "42", height: "6", rx: "1.5", fill: CARD, stroke: BORDER, strokeWidth: "0.5" }),
+      /* @__PURE__ */ jsx67("rect", { x: "62", y: "27", width: "44", height: "6", rx: "1.5", fill: CARD, stroke: BORDER, strokeWidth: "0.5" }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "37", width: "92", height: "12", rx: "1.5", fill: CARD, stroke: BORDER, strokeWidth: "0.5" }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "53", width: "92", height: "11", rx: "2", fill: PRIMARY_SOFT, stroke: PRIMARY, strokeWidth: "0.5", strokeDasharray: "2 2" }),
+      /* @__PURE__ */ jsx67("text", { x: "38", y: "61", fontSize: "6", fill: PRIMARY, fontFamily: "system-ui", opacity: "0.85", children: "\u2191 Upload CV" })
+    ] }),
+    FormSupport: /* @__PURE__ */ jsxs50(Frame, { children: [
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "9", width: "52", height: "3", rx: "1", fill: TEXT }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "17", width: "42", height: "6", rx: "1.5", fill: CARD, stroke: BORDER, strokeWidth: "0.5" }),
+      /* @__PURE__ */ jsx67("rect", { x: "62", y: "17", width: "44", height: "6", rx: "1.5", fill: CARD, stroke: BORDER, strokeWidth: "0.5" }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "27", width: "42", height: "6", rx: "1.5", fill: CARD, stroke: BORDER, strokeWidth: "0.5" }),
+      /* @__PURE__ */ jsx67("text", { x: "49", y: "31.5", fontSize: "5", fill: MUTED, fontFamily: "system-ui", children: "\u25BC" }),
+      /* @__PURE__ */ jsx67("rect", { x: "62", y: "27", width: "44", height: "6", rx: "1.5", fill: ACCENT, opacity: "0.15", stroke: ACCENT, strokeWidth: "0.5" }),
+      /* @__PURE__ */ jsx67("rect", { x: "65", y: "29.5", width: "18", height: "2", rx: "1", fill: MUTED }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "37", width: "92", height: "6", rx: "1.5", fill: CARD, stroke: BORDER, strokeWidth: "0.5" }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "47", width: "92", height: "16", rx: "1.5", fill: CARD, stroke: BORDER, strokeWidth: "0.5" }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "65", width: "28", height: "5", rx: "1.5", fill: PRIMARY })
+    ] }),
+    FormWaitlist: /* @__PURE__ */ jsxs50(Frame, { soft: true, children: [
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "9", width: "44", height: "3", rx: "1", fill: TEXT }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "15", width: "70", height: "2.5", rx: "1", fill: MUTED }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "23", width: "42", height: "6", rx: "1.5", fill: CARD, stroke: BORDER, strokeWidth: "0.5" }),
+      /* @__PURE__ */ jsx67("rect", { x: "62", y: "23", width: "44", height: "6", rx: "1.5", fill: CARD, stroke: BORDER, strokeWidth: "0.5" }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "33", width: "42", height: "6", rx: "1.5", fill: CARD, stroke: BORDER, strokeWidth: "0.5" }),
+      /* @__PURE__ */ jsx67("rect", { x: "62", y: "33", width: "44", height: "6", rx: "1.5", fill: CARD, stroke: BORDER, strokeWidth: "0.5" }),
+      /* @__PURE__ */ jsx67("text", { x: "100", y: "37.5", fontSize: "5", fill: MUTED, fontFamily: "system-ui", children: "\u25BC" }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "43", width: "92", height: "14", rx: "1.5", fill: CARD, stroke: BORDER, strokeWidth: "0.5" }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "61", width: "28", height: "7", rx: "2", fill: PRIMARY })
     ] }),
-    Container: /* @__PURE__ */ jsxs49(Frame, { children: [
-      /* @__PURE__ */ jsx53("rect", { x: "14", y: "14", width: "92", height: "46", rx: "3", fill: PRIMARY_SOFT, stroke: PRIMARY, strokeWidth: "0.5", strokeDasharray: "2 2" }),
-      /* @__PURE__ */ jsx53("rect", { x: "22", y: "22", width: "20", height: "2.5", rx: "1", fill: PRIMARY }),
-      /* @__PURE__ */ jsx53("rect", { x: "22", y: "30", width: "60", height: "4", rx: "1.5", fill: TEXT }),
-      /* @__PURE__ */ jsx53("rect", { x: "22", y: "40", width: "76", height: "2", rx: "1", fill: MUTED }),
-      /* @__PURE__ */ jsx53("rect", { x: "22", y: "44", width: "68", height: "2", rx: "1", fill: MUTED }),
-      /* @__PURE__ */ jsx53("rect", { x: "22", y: "48", width: "50", height: "2", rx: "1", fill: MUTED })
+    FormAddress: /* @__PURE__ */ jsxs50(Frame, { children: [
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "9", width: "38", height: "3", rx: "1", fill: TEXT }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "17", width: "92", height: "6", rx: "1.5", fill: CARD, stroke: BORDER, strokeWidth: "0.5" }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "27", width: "92", height: "6", rx: "1.5", fill: CARD, stroke: BORDER, strokeWidth: "0.5" }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "37", width: "42", height: "6", rx: "1.5", fill: CARD, stroke: BORDER, strokeWidth: "0.5" }),
+      /* @__PURE__ */ jsx67("rect", { x: "62", y: "37", width: "44", height: "6", rx: "1.5", fill: CARD, stroke: BORDER, strokeWidth: "0.5" }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "47", width: "42", height: "6", rx: "1.5", fill: CARD, stroke: BORDER, strokeWidth: "0.5" }),
+      /* @__PURE__ */ jsx67("text", { x: "49", y: "51.5", fontSize: "5", fill: MUTED, fontFamily: "system-ui", children: "\u25BC" }),
+      /* @__PURE__ */ jsx67("rect", { x: "62", y: "47", width: "44", height: "6", rx: "1.5", fill: CARD, stroke: BORDER, strokeWidth: "0.5" }),
+      /* @__PURE__ */ jsx67("rect", { x: "14", y: "57", width: "28", height: "8", rx: "2", fill: PRIMARY })
     ] })
   };
 }
@@ -5460,27 +6564,65 @@ var BLOCK_DESCRIPTIONS = {
   Divider: "Horizontal divider with optional centered label. Hairline / dashed / thick / dot styles.",
   ThreeColumn: "Generic 3-col text layout. Lighter than PillarsRow.",
   PressMentions: '"As featured in" press logos. Italic serif text fallback when no logos.',
-  Container: "Decorative box (soft / primary / dark / white) wrapping a single titled callout."
+  Container: "Decorative box (soft / primary / dark / white) wrapping a single titled callout.",
+  FormContact: "Lightweight contact form \u2014 name, email, phone, company, message. No hero or sidebar.",
+  FormLeadCapture: "Lead-gen form with journey-stage select, capability multi-select, and notes.",
+  FormNewsletter: "Newsletter signup with name, email, and consent checkbox.",
+  FormFeedback: "Customer feedback \u2014 star rating, category select, free-text comment, optional contact.",
+  FormSurvey: "Configurable survey \u2014 defaults to NPS-style with rating, recommend radio, and open text.",
+  FormBooking: "Demo / appointment request \u2014 name, email, company, date picker, time slot, notes.",
+  FormRegistration: "Event registration \u2014 name, contact, role, t-shirt size, dietary select.",
+  FormQuoteRequest: "Quote request \u2014 company, project type, budget range, timeline, requirements.",
+  FormApplication: "Job / programme application \u2014 contact, LinkedIn, portfolio, role, cover note, CV upload.",
+  FormSupport: "Support ticket \u2014 name, email, category, priority, subject, description, attachment.",
+  FormWaitlist: "Product waitlist \u2014 name, email, company, role, intended use case.",
+  FormAddress: "Address / location form \u2014 name, street, city, state, country select, postal code."
 };
 function BlockThumbnail({ name }) {
-  const colors = useBrandColors();
+  const colors = useThemeColors();
   const previews = getPreviews(colors);
-  return previews[name] || /* @__PURE__ */ jsx53(Frame, { children: /* @__PURE__ */ jsx53(
-    "text",
+  if (previews[name]) return previews[name];
+  return /* @__PURE__ */ jsxs50(
+    "svg",
     {
-      x: "60",
-      y: "40",
-      fontSize: "8",
-      fill: MUTED,
-      textAnchor: "middle",
-      fontFamily: "system-ui",
-      children: name
+      viewBox: `0 0 ${FRAME_W} ${FRAME_H}`,
+      width: "100%",
+      height: "auto",
+      preserveAspectRatio: "xMidYMid meet",
+      style: { display: "block", borderRadius: 4 },
+      children: [
+        /* @__PURE__ */ jsx67(
+          "rect",
+          {
+            x: "0.5",
+            y: "0.5",
+            width: FRAME_W - 1,
+            height: FRAME_H - 1,
+            rx: "3",
+            fill: colors.BG,
+            stroke: colors.BORDER,
+            strokeWidth: "1"
+          }
+        ),
+        /* @__PURE__ */ jsx67(
+          "text",
+          {
+            x: "60",
+            y: "40",
+            fontSize: "8",
+            fill: colors.MUTED,
+            textAnchor: "middle",
+            fontFamily: "system-ui",
+            children: name
+          }
+        )
+      ]
     }
-  ) });
+  );
 }
 
 // src/config.jsx
-import { jsx as jsx54, jsxs as jsxs50 } from "react/jsx-runtime";
+import { jsx as jsx68, jsxs as jsxs51 } from "react/jsx-runtime";
 var DEFAULT_REVEAL = {
   Hero: "fade-up",
   SectionHeader: "fade-up",
@@ -5503,6 +6645,18 @@ var DEFAULT_REVEAL = {
   VideoEmbed: "scale-in",
   ContactSection: "fade-up",
   NewsletterSignup: "fade-up",
+  FormContact: "fade-up",
+  FormLeadCapture: "fade-up",
+  FormNewsletter: "fade-up",
+  FormFeedback: "fade-up",
+  FormSurvey: "fade-up",
+  FormBooking: "fade-up",
+  FormRegistration: "fade-up",
+  FormQuoteRequest: "fade-up",
+  FormApplication: "fade-up",
+  FormSupport: "fade-up",
+  FormWaitlist: "fade-up",
+  FormAddress: "fade-up",
   ArticleFeatured: "fade-up",
   ArticleGrid: "fade-up",
   ArticleList: "fade-up",
@@ -5556,6 +6710,18 @@ var defaultBlocks = {
   VideoEmbed,
   ContactSection,
   NewsletterSignup,
+  FormContact,
+  FormLeadCapture,
+  FormNewsletter,
+  FormFeedback,
+  FormSurvey,
+  FormBooking,
+  FormRegistration,
+  FormQuoteRequest,
+  FormApplication,
+  FormSupport,
+  FormWaitlist,
+  FormAddress,
   ArticleFeatured,
   ArticleGrid,
   ArticleList,
@@ -5616,7 +6782,24 @@ var defaultCategories = {
     components: ["VideoEmbed", "ImageGallery", "ImageCaption", "MapEmbed"]
   },
   Forms: {
-    components: ["ContactSection", "NewsletterSignup", "ContactInfo", "SocialLinks"]
+    components: [
+      "ContactSection",
+      "NewsletterSignup",
+      "ContactInfo",
+      "SocialLinks",
+      "FormContact",
+      "FormLeadCapture",
+      "FormNewsletter",
+      "FormFeedback",
+      "FormSurvey",
+      "FormBooking",
+      "FormRegistration",
+      "FormQuoteRequest",
+      "FormApplication",
+      "FormSupport",
+      "FormWaitlist",
+      "FormAddress"
+    ]
   },
   Layout: {
     components: ["Spacer", "Divider", "RawHtml"]
@@ -5629,11 +6812,11 @@ var defaultOverrides = {
   drawerItem: ({ name }) => {
     const label = prettyName(name);
     const desc = BLOCK_DESCRIPTIONS[name] || "";
-    return /* @__PURE__ */ jsxs50("div", { className: "tps-block-card", title: desc, children: [
-      /* @__PURE__ */ jsx54("div", { className: "tps-block-card__preview", children: /* @__PURE__ */ jsx54(BlockThumbnail, { name }) }),
-      /* @__PURE__ */ jsxs50("div", { className: "tps-block-card__text", children: [
-        /* @__PURE__ */ jsx54("div", { className: "tps-block-card__name", children: label }),
-        desc && /* @__PURE__ */ jsx54("div", { className: "tps-block-card__desc", children: desc })
+    return /* @__PURE__ */ jsxs51("div", { className: "tps-block-card", title: desc, children: [
+      /* @__PURE__ */ jsx68("div", { className: "tps-block-card__preview", children: /* @__PURE__ */ jsx68(BlockThumbnail, { name }) }),
+      /* @__PURE__ */ jsxs51("div", { className: "tps-block-card__text", children: [
+        /* @__PURE__ */ jsx68("div", { className: "tps-block-card__name", children: label }),
+        desc && /* @__PURE__ */ jsx68("div", { className: "tps-block-card__desc", children: desc })
       ] })
     ] });
   }
@@ -5692,7 +6875,8 @@ function createPuckConfig({
     const animation = reveal && reveal[name];
     const override = defaults && defaults[name];
     const withDefaults = override ? { ...block, defaultProps: { ...block.defaultProps || {}, ...override } } : block;
-    components[name] = animation ? withReveal(withDefaults, animation) : withDefaults;
+    const themed = withTheme(withDefaults);
+    components[name] = animation ? withReveal(themed, animation) : themed;
   }
   return { components, categories, root };
 }
@@ -5716,6 +6900,18 @@ export {
   Divider,
   EventsList,
   FAQ,
+  FormAddress,
+  FormApplication,
+  FormBooking,
+  FormContact,
+  FormFeedback,
+  FormLeadCapture,
+  FormNewsletter,
+  FormQuoteRequest,
+  FormRegistration,
+  FormSupport,
+  FormSurvey,
+  FormWaitlist,
   Hero,
   IconCards,
   ImageCaption,
@@ -5744,6 +6940,7 @@ export {
   StatsStrip,
   StepsVertical,
   StudioLink,
+  THEME_OPTIONS,
   TabsBlock,
   TeamGrid,
   TestimonialGrid,
@@ -5759,7 +6956,9 @@ export {
   defaultOverrides,
   emptyPuckData,
   normalizePuckData,
+  themeField,
   useStudio,
-  withReveal
+  withReveal,
+  withTheme
 };
 //# sourceMappingURL=index.js.map