@levo-so/blocks 0.1.101 → 0.1.103

package/src/blocks/cards/cards-8.schema.ts

@@ -1,90 +1,157 @@
 import type { IBlock } from "@levo-so/studio";
 
+const ICON_ARROW_RIGHT = {
+  kind: "icon",
+  data: {
+    id: "arrow-right",
+    label: "Arrow Right",
+    svgCode:
+      '<svg   viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">\n<path d="M15 22.75H9C3.57 22.75 1.25 20.43 1.25 15V9C1.25 3.57 3.57 1.25 9 1.25H15C20.43 1.25 22.75 3.57 22.75 9V15C22.75 20.43 20.43 22.75 15 22.75ZM9 2.75C4.39 2.75 2.75 4.39 2.75 9V15C2.75 19.61 4.39 21.25 9 21.25H15C19.61 21.25 21.25 19.61 21.25 15V9C21.25 4.39 19.61 2.75 15 2.75H9Z" fill="var(--color-icon-primary)"/>\n<path d="M10.7397 16.28C10.5497 16.28 10.3597 16.21 10.2097 16.06C9.91969 15.77 9.91969 15.29 10.2097 15L13.2097 12L10.2097 8.99997C9.91969 8.70997 9.91969 8.22997 10.2097 7.93997C10.4997 7.64997 10.9797 7.64997 11.2697 7.93997L14.7997 11.47C15.0897 11.76 15.0897 12.24 14.7997 12.53L11.2697 16.06C11.1197 16.21 10.9297 16.28 10.7397 16.28Z" fill="var(--color-icon-primary)"/>\n</svg>',
+  },
+};
+
 const DEFAULT_CONTENT = {
   layout: null,
   container: null,
   header_section: null,
-  main_title: "Career Opportunity",
+  title_container: null,
+  main_title: "Why teams switch to one workspace",
   main_description:
-    "Career Opportunity Career Opportunity Career Opportunity Career Opportunity Career Opportunity ",
+    "Four product surfaces that quietly compound across every sprint — collaboration, automation, signal, and insight in a single place.",
   header_buttons_levoGroup: null,
-  header_buttons: [{ header_button: "View All" }, { header_button: "Learn More" }],
+  header_buttons: [
+    { header_button: "See all features" },
+    { header_button: "Book a demo" },
+  ],
   grid: [
     {
       card: null,
-      badge: "3+ Years of Experience",
+      badge: "Real-time editing",
       content_container: null,
       text_section: null,
-      title: "Senior Software Engineer",
+      title: "Multiplayer by default",
       description:
-        "Join our innovative development team to build cutting-edge solutions using modern technologies and agile methodologies.",
-      ctas_levoGroup: null,
-      ctas: [{ cta: "Apply Now" }, { cta: "Learn More" }],
+        "Presence cursors, inline comments, and conflict-free CRDT documents — your team thinks together without sharing a screen.",
+      cta: "Tour collaboration",
     },
     {
       card: null,
-      badge: "1+ Years of Experience",
+      badge: "No-code automations",
       content_container: null,
       text_section: null,
-      title: "Product Marketing Manager",
+      title: "Workflows on autopilot",
       description:
-        "Drive product growth and market expansion through strategic marketing campaigns and data-driven insights.",
-      ctas_levoGroup: null,
-      ctas: [{ cta: "Apply Now" }, { cta: "Learn More" }],
+        "Chain triggers across Slack, Linear, and HubSpot in minutes — handoffs fire the moment a status changes, never twice.",
+      cta: "Browse recipes",
     },
     {
       card: null,
-      badge: "2+ Years of Experience",
+      badge: "Unified inbox",
       content_container: null,
       text_section: null,
-      title: "UX Research Specialist",
+      title: "One queue to clear",
       description:
-        "Lead user research initiatives to enhance product experiences and inform design decisions across our platform.",
-      ctas_levoGroup: null,
-      ctas: [{ cta: "Apply Now" }, { cta: "Learn More" }],
+        "Slack threads, GitHub PRs, and Linear updates roll into a single ranked list — answer once, route anywhere.",
+      cta: "Connect tools",
     },
     {
       card: null,
-      badge: "5+ Years of Experience",
+      badge: "Live operating signal",
       content_container: null,
       text_section: null,
-      title: "Data Science Lead",
+      title: "Insights that ship",
       description:
-        "Spearhead machine learning projects and analytics initiatives to unlock business insights and drive innovation.",
-      ctas_levoGroup: null,
-      ctas: [{ cta: "Apply Now" }, { cta: "Learn More" }],
+        "Cycle time, burndown, and team load on a shared dashboard — answer 'are we on track' without pinging anyone.",
+      cta: "View dashboards",
     },
   ],
-  header_button_rightIcon: {
-    kind: "custom",
-    data: {
-      id: "UpLVWyg9E9QC",
-      location: "https://static.levostg.online/W6OEVMW8/image-sR8IjbcW18vs.png",
-      mimetype: "image/png",
-      kind: "image",
-      srcset: {
-        "1080w": "https://static.levostg.online/W6OEVMW8/image-sR8IjbcW18vs-1080w.webp",
-        "1200w": "https://static.levostg.online/W6OEVMW8/image-sR8IjbcW18vs-1200w.webp",
-        "1920w": "https://static.levostg.online/W6OEVMW8/image-sR8IjbcW18vs-1920w.webp",
-        "320w": "https://static.levostg.online/W6OEVMW8/image-sR8IjbcW18vs-320w.webp",
-        "640w": "https://static.levostg.online/W6OEVMW8/image-sR8IjbcW18vs-640w.webp",
-        "750w": "https://static.levostg.online/W6OEVMW8/image-sR8IjbcW18vs-750w.webp",
-        "828w": "https://static.levostg.online/W6OEVMW8/image-sR8IjbcW18vs-828w.webp",
-        path: "https://static.levostg.online/W6OEVMW8/image-sR8IjbcW18vs-320w.webp 320w, https://static.levostg.online/W6OEVMW8/image-sR8IjbcW18vs-750w.webp 750w, https://static.levostg.online/W6OEVMW8/image-sR8IjbcW18vs-640w.webp 640w, https://static.levostg.online/W6OEVMW8/image-sR8IjbcW18vs-1200w.webp 1200w, https://static.levostg.online/W6OEVMW8/image-sR8IjbcW18vs-1920w.webp 1920w, https://static.levostg.online/W6OEVMW8/image-sR8IjbcW18vs-828w.webp 828w, https://static.levostg.online/W6OEVMW8/image-sR8IjbcW18vs-1080w.webp 1080w",
-      },
-    },
-  },
+  header_button_rightIcon: ICON_ARROW_RIGHT,
 };
 
 export type ICards8Content = typeof DEFAULT_CONTENT;
 
+const HEADER_SECTION_SPLIT = {
+  display: "flex",
+  "justify-content": "space-between",
+  "align-items": "flex-end",
+  "column-gap": "2xl",
+  "margin-bottom": "3xl",
+  tablet: {
+    "flex-direction": "column",
+    "align-items": "flex-start",
+    "row-gap": "lg",
+  },
+  mobile: {
+    "flex-direction": "column",
+    "align-items": "flex-start",
+    "row-gap": "md",
+  },
+};
+
+const HEADER_SECTION_CENTERED = {
+  display: "flex",
+  "flex-direction": "column",
+  "align-items": "center",
+  "text-align": "center",
+  "row-gap": "md",
+  "margin-bottom": "3xl",
+};
+
+const TITLE_CONTAINER_COLUMN = {
+  display: "flex",
+  "flex-direction": "column",
+  "row-gap": "sm",
+  "max-width": "640px",
+};
+
+const TITLE_CONTAINER_CENTERED = {
+  display: "flex",
+  "flex-direction": "column",
+  "align-items": "center",
+  "row-gap": "sm",
+  "max-width": "640px",
+};
+
+const MAIN_DESCRIPTION_STYLE = {
+  color: "muted-foreground",
+};
+
+const HEADER_BUTTONS_GROUP = {
+  display: "flex",
+  "flex-direction": "row",
+  "column-gap": "sm",
+  "row-gap": "sm",
+  "flex-wrap": "wrap",
+  "align-items": "center",
+};
+
+const HEADER_BUTTONS_GROUP_CENTERED = {
+  ...HEADER_BUTTONS_GROUP,
+  "justify-content": "center",
+};
+
+const BADGE_BRAND_LABEL = {
+  "font-weight": 600,
+  "font-size": "xs",
+  color: "brand",
+  "text-transform": "uppercase",
+  "letter-spacing": "0.08em",
+  "max-width": "fit-content",
+  "margin-bottom": "sm",
+};
+
+const HEADER_BUTTON_RIGHT_ICON_STYLE = {
+  width: "16px",
+  height: "16px",
+};
+
 export const Cards8: IBlock = {
   category_id: "cards",
   title: "Cards 8",
   key: "cards-8",
   version: "v1",
   prompt_description:
-    "Career opportunities section with header title and 'View All' button, featuring job cards in a grid layout. Each card displays a badge, job title, description, and a single CTA button in a flex layout.",
+    "Feature highlight section with a header (title, description, CTA group) and a grid of cards. Each card has a branded label, title, description, and a single CTA.",
   content_schema: [
     {
       key: "layout",
@@ -92,7 +159,7 @@ export const Cards8: IBlock = {
       field_interface: "LayoutWidget",
       hint: {
         prompt_description:
-          "Overall section layout for the career opportunities block. Controls spacing, background, and structure.",
+          "Overall section layout for the feature highlight block. Controls spacing, background, and structure.",
       },
     },
     {
@@ -100,7 +167,8 @@ export const Cards8: IBlock = {
       label: "Container",
       field_interface: "ContainerWidget",
       hint: {
-        prompt_description: "Main container for centering and constraining the content width.",
+        prompt_description:
+          "Main container for centering and constraining the content width.",
       },
     },
     {
@@ -109,7 +177,7 @@ export const Cards8: IBlock = {
       field_interface: "BoxWidget",
       hint: {
         prompt_description:
-          "Header area containing the main title and view all button, positioned horizontally.",
+          "Header area containing the title block and the CTA group.",
       },
     },
     {
@@ -123,15 +191,21 @@ export const Cards8: IBlock = {
       field_interface: "HeadingWidget",
       hint: {
         prompt_description:
-          "Main section heading that describes the career opportunities section. Should be engaging and professional.",
+          "Section heading. Punchy claim — what the product does for the team.",
         min_characters: 10,
-        max_characters: 40,
+        max_characters: 60,
       },
     },
     {
       key: "main_description",
       label: "Main Description",
       field_interface: "TypographyWidget",
+      hint: {
+        prompt_description:
+          "Supporting line under the title. One sentence, names a concrete mechanism.",
+        min_characters: 40,
+        max_characters: 180,
+      },
     },
     {
       key: "header_buttons",
@@ -145,22 +219,21 @@ export const Cards8: IBlock = {
           field_interface: "ButtonWidget",
           hint: {
             prompt_description:
-              "Action button for career opportunities. Should encourage exploration.",
+              "Primary action button in the header. Two to three words, action-led.",
             min_characters: 6,
-            max_characters: 20,
+            max_characters: 24,
           },
         },
       ],
       hint: {
-        prompt_description:
-          "Group of header action buttons for viewing career opportunities and related actions.",
+        prompt_description: "Group of header action buttons.",
         min_items: 1,
         max_items: 3,
       },
     },
     {
       key: "grid",
-      label: "Job Cards",
+      label: "Feature Cards",
       kind: "group",
       field_interface: "BoxWidget",
       fields: [
@@ -170,17 +243,17 @@ export const Cards8: IBlock = {
           field_interface: "BoxWidget",
           hint: {
             prompt_description:
-              "Individual job card container for styling and layout. No direct content.",
+              "Individual card container for styling and layout. No direct content.",
           },
         },
         {
           key: "badge",
-          label: "Experience Badge",
+          label: "Branded Label",
           field_interface: "TypographyWidget",
           hint: {
             prompt_description:
-              "Small badge showing experience requirements, displayed as a capsule above the card content.",
-            min_characters: 10,
+              "Short branded label sitting above the card title — eyebrow text.",
+            min_characters: 6,
             max_characters: 30,
           },
         },
@@ -188,70 +261,48 @@ export const Cards8: IBlock = {
           key: "content_container",
           label: "Content Container",
           field_interface: "BoxWidget",
-          hint: {
-            prompt_description:
-              "Main content container that holds the text section and CTA in a flex layout.",
-          },
         },
         {
           key: "text_section",
           label: "Text Section",
           field_interface: "BoxWidget",
-          hint: {
-            prompt_description:
-              "Left section containing job title and description in the flex layout.",
-          },
         },
         {
           key: "title",
-          label: "Job Title",
+          label: "Card Title",
           field_interface: "HeadingWidget",
           hint: {
             prompt_description:
-              "Job position title that's clear, professional, and attractive to potential candidates.",
-            min_characters: 15,
+              "Card title — 2 to 4 words, parallel structure across cards.",
+            min_characters: 8,
             max_characters: 40,
           },
         },
         {
           key: "description",
-          label: "Job Description",
+          label: "Card Description",
           field_interface: "TypographyWidget",
           hint: {
             prompt_description:
-              "Brief job description explaining key responsibilities and requirements. Should be engaging and informative.",
+              "One-sentence description with a concrete mechanism. ~22 words.",
             min_characters: 60,
-            max_characters: 150,
+            max_characters: 180,
           },
         },
         {
-          key: "ctas_levoGroup",
-          label: "Apply Buttons Group",
-          field_interface: "BoxWidget",
-        },
-        {
-          key: "ctas",
-          label: "Apply Buttons",
-          field_interface: "BoxWidget",
-          kind: "group",
-          fields: [
-            {
-              key: "cta",
-              label: "Apply Button",
-              field_interface: "ButtonWidget",
-              hint: {
-                prompt_description:
-                  "Primary call-to-action button for job application. Should be compelling and action-oriented.",
-                min_characters: 6,
-                max_characters: 20,
-              },
-            },
-          ],
+          key: "cta",
+          label: "Card CTA",
+          field_interface: "ButtonWidget",
+          hint: {
+            prompt_description:
+              "Single call-to-action per card. Two to three words.",
+            min_characters: 4,
+            max_characters: 24,
+          },
         },
       ],
       hint: {
-        prompt_description:
-          "Collection of job opportunity cards featuring experience badges, titles, descriptions, and apply buttons.",
+        prompt_description: "Collection of feature cards.",
         min_items: 2,
         max_items: 6,
       },
@@ -264,147 +315,458 @@ export const Cards8: IBlock = {
       styles: {
         layout: {},
         container: {},
-        header_section: {
-          display: "flex",
-          "justify-content": "space-between",
-          "align-items": "center",
-          "margin-bottom": "4xl",
+        header_section: HEADER_SECTION_SPLIT,
+        title_container: TITLE_CONTAINER_COLUMN,
+        main_description: MAIN_DESCRIPTION_STYLE,
+        header_buttons_levoGroup: HEADER_BUTTONS_GROUP,
+        header_buttons: [{}, {}],
+        grid_levoGroup: {
+          display: "grid",
+          "grid-template-columns": "repeat(2, minmax(0, 1fr))",
+          "row-gap": "xl",
+          "column-gap": "xl",
           mobile: {
+            "grid-template-columns": "repeat(1, minmax(0, 1fr))",
+          },
+        },
+        grid_levoGroupItem: {
+          card: {
+            display: "flex",
+            "flex-direction": "column",
+            "background-color": "card",
+            "padding-top": "2xl",
+            "padding-bottom": "2xl",
+            "padding-left": "2xl",
+            "padding-right": "2xl",
+            "border-radius": "xl",
+            border: "1px solid",
+            "border-color": "border",
+            height: "100%",
+            "row-gap": "lg",
+            mobile: {
+              "padding-top": "xl",
+              "padding-left": "xl",
+              "padding-right": "xl",
+              "padding-bottom": "xl",
+            },
+          },
+          badge: BADGE_BRAND_LABEL,
+          content_container: {
+            display: "flex",
             "flex-direction": "column",
-            "align-items": "center",
             "row-gap": "lg",
-            filter: "drop-shadow(0 2px 5px rgba(0, 0, 0, 0.2))",
-            "justify-content": "center",
+            "flex-grow": "1",
+          },
+          text_section: {
+            display: "flex",
+            "flex-direction": "column",
+            "row-gap": "sm",
+            "flex-grow": "1",
+          },
+          title: {
+            "font-weight": 600,
+          },
+          description: {
+            color: "muted-foreground",
+          },
+          cta: {
+            "margin-top": "auto",
+            "align-self": "flex-start",
+          },
+        },
+        grid: [{}, {}, {}, {}],
+        header_button_rightIcon: HEADER_BUTTON_RIGHT_ICON_STYLE,
+        header_buttons_levoGroupItem: {
+          header_button: {},
+        },
+      },
+      content: DEFAULT_CONTENT,
+      config: {
+        main_title: {
+          selectedVariants: { Heading_Level: "H2" },
+        },
+        header_buttons: [
+          {
+            header_button: {
+              selectedVariants: {},
+              button_icons: { right: { enabled: true } },
+            },
+          },
+          {
+            header_button: {
+              selectedVariants: { Button_Variants: "Secondary" },
+            },
+          },
+        ],
+        grid: [
+          {
+            title: {
+              heading: { level: "4" },
+              selectedVariants: { Heading_Level: "H5" },
+            },
+            cta: { selectedVariants: { Button_Variants: "Link" } },
+          },
+          {
+            title: {
+              heading: { level: "4" },
+              selectedVariants: { Heading_Level: "H5" },
+            },
+            cta: { selectedVariants: { Button_Variants: "Link" } },
+          },
+          {
+            title: {
+              heading: { level: "4" },
+              selectedVariants: { Heading_Level: "H5" },
+            },
+            cta: { selectedVariants: { Button_Variants: "Link" } },
+          },
+          {
+            title: {
+              heading: { level: "4" },
+              selectedVariants: { Heading_Level: "H5" },
+            },
+            cta: { selectedVariants: { Button_Variants: "Link" } },
+          },
+        ],
+      },
+    },
+    {
+      title: "List",
+      key: "list",
+      styles: {
+        layout: {},
+        container: {},
+        header_section: HEADER_SECTION_SPLIT,
+        title_container: TITLE_CONTAINER_COLUMN,
+        main_description: MAIN_DESCRIPTION_STYLE,
+        header_buttons_levoGroup: HEADER_BUTTONS_GROUP,
+        header_buttons: [{}, {}],
+        grid_levoGroup: {
+          display: "flex",
+          "flex-direction": "column",
+          "row-gap": "md",
+        },
+        grid_levoGroupItem: {
+          card: {
+            display: "flex",
+            "flex-direction": "row",
+            "align-items": "flex-start",
+            "column-gap": "lg",
+            "background-color": "card",
+            "padding-top": "lg",
+            "padding-bottom": "lg",
+            "padding-left": "xl",
+            "padding-right": "xl",
+            "border-radius": "lg",
+            border: "1px solid",
+            "border-color": "border",
+            tablet: {
+              "flex-direction": "column",
+              "align-items": "flex-start",
+              "row-gap": "md",
+              "padding-top": "lg",
+              "padding-left": "lg",
+              "padding-right": "lg",
+              "padding-bottom": "lg",
+            },
+            mobile: {
+              "flex-direction": "column",
+              "align-items": "flex-start",
+              "row-gap": "md",
+              "padding-top": "lg",
+              "padding-left": "lg",
+              "padding-right": "lg",
+              "padding-bottom": "lg",
+            },
+          },
+          badge: {
+            ...BADGE_BRAND_LABEL,
+            "margin-bottom": "0",
+            "flex-shrink": "0",
+            width: "200px",
+            "max-width": "200px",
+            "padding-top": "5px",
+            "line-height": 1.25,
+          },
+          content_container: {
+            display: "flex",
+            "flex-direction": "row",
+            "align-items": "center",
+            "column-gap": "lg",
+            flex: "1 1 0",
+            "min-width": "0",
+            width: "100%",
+            tablet: {
+              "flex-direction": "column",
+              "align-items": "flex-start",
+              "row-gap": "sm",
+            },
+            mobile: {
+              "flex-direction": "column",
+              "align-items": "flex-start",
+              "row-gap": "sm",
+            },
+          },
+          text_section: {
+            display: "flex",
+            "flex-direction": "column",
+            "row-gap": "3xs",
+            flex: "1 1 0",
+            "min-width": "0",
+          },
+          title: {
+            "font-weight": 600,
+            "line-height": 1.25,
+          },
+          description: {
+            color: "muted-foreground",
+            "line-height": 1.45,
+          },
+          cta: {
+            "flex-shrink": "0",
+            "white-space": "nowrap",
           },
-          filter: "drop-shadow(0 2px 5px rgba(0, 0, 0, 0.2))",
+        },
+        grid: [{}, {}, {}, {}],
+        header_button_rightIcon: HEADER_BUTTON_RIGHT_ICON_STYLE,
+        header_buttons_levoGroupItem: {
+          header_button: {},
+        },
+      },
+      content: DEFAULT_CONTENT,
+      config: {
+        main_title: {
+          selectedVariants: { Heading_Level: "H2" },
+        },
+        header_buttons: [
+          {
+            header_button: {
+              selectedVariants: {},
+              button_icons: { right: { enabled: true } },
+            },
+          },
+          {
+            header_button: {
+              selectedVariants: { Button_Variants: "Secondary" },
+            },
+          },
+        ],
+        grid: [
+          {
+            title: {
+              heading: { level: "4" },
+              selectedVariants: { Heading_Level: "H5" },
+            },
+            cta: { selectedVariants: { Button_Variants: "Link" } },
+          },
+          {
+            title: {
+              heading: { level: "4" },
+              selectedVariants: { Heading_Level: "H5" },
+            },
+            cta: { selectedVariants: { Button_Variants: "Link" } },
+          },
+          {
+            title: {
+              heading: { level: "4" },
+              selectedVariants: { Heading_Level: "H5" },
+            },
+            cta: { selectedVariants: { Button_Variants: "Link" } },
+          },
+          {
+            title: {
+              heading: { level: "4" },
+              selectedVariants: { Heading_Level: "H5" },
+            },
+            cta: { selectedVariants: { Button_Variants: "Link" } },
+          },
+        ],
+      },
+    },
+    {
+      title: "Centered",
+      key: "centered",
+      styles: {
+        layout: {},
+        container: {},
+        header_section: {
+          display: "flex",
+          "flex-direction": "column",
+          "align-items": "center",
+          "text-align": "center",
+          "row-gap": "md",
+          "margin-bottom": "3xl",
+        },
+        title_container: {
+          display: "flex",
+          "flex-direction": "column",
+          "align-items": "center",
+          "row-gap": "sm",
+          "max-width": "640px",
+        },
+        main_title: {
+          "text-align": "center",
+        },
+        main_description: {
+          color: "muted-foreground",
+          "text-align": "center",
         },
         header_buttons_levoGroup: {
           display: "flex",
           "flex-direction": "row",
-          "column-gap": "xs",
-          "row-gap": "xs",
+          "column-gap": "sm",
+          "row-gap": "sm",
           "flex-wrap": "wrap",
           "align-items": "center",
+          "justify-content": "center",
         },
         header_buttons: [{}, {}],
         grid_levoGroup: {
           display: "grid",
-          "grid-template-columns": "repeat(2, minmax(0, 1fr))",
+          "grid-template-columns": "repeat(3, minmax(0, 1fr))",
           "row-gap": "xl",
           "column-gap": "xl",
+          tablet: {
+            "grid-template-columns": "repeat(2, minmax(0, 1fr))",
+          },
           mobile: {
             "grid-template-columns": "repeat(1, minmax(0, 1fr))",
           },
         },
-        grid: Array(4)
-          .fill(0)
-          .map((v) => ({
-            card: {
-              filter: "drop-shadow(0 2px 5px rgba(0, 0, 0, 0.2))",
-              display: "block",
-              "background-color": "white",
-              "padding-top": "3xl",
-              "padding-bottom": "3xl",
-              "padding-left": "3xl",
-              "padding-right": "3xl",
-              "border-radius": "xl",
-              mobile: {
-                filter: "drop-shadow(0 2px 5px rgba(0, 0, 0, 0.2))",
-                "padding-top": "xl",
-                "padding-left": "xl",
-                "padding-right": "xl",
-                "padding-bottom": "xl",
-              },
-              tablet: {
-                filter: "drop-shadow(0 2px 5px rgba(0, 0, 0, 0.2))",
-                "padding-top": "xl",
-                "padding-right": "xl",
-                "padding-left": "xl",
-                "padding-bottom": "xl",
-              },
-            },
-            title: {
-              "font-weight": 700,
-            },
-            badge: {
-              "font-weight": 500,
-              "background-color": "brandSecondary",
-              color: "brandSecondaryForeground",
-              "padding-top": "xs",
-              "padding-bottom": "xs",
-              "padding-left": "sm",
-              "padding-right": "sm",
-              "border-radius": "3xl",
-              display: "inline-block",
-              "margin-bottom": "lg",
-            },
-            content_container: {
-              display: "flex",
-              "align-items": "start",
-              "column-gap": "lg",
-              mobile: {
-                "flex-direction": "column",
-                "row-gap": "lg",
-              },
-              tablet: {
-                "flex-direction": "column",
-                "row-gap": "lg",
-              },
-              "justify-content": "start",
-            },
-            text_section: {
-              display: "flex",
-              "flex-direction": "column",
-              "row-gap": "sm",
-              "flex-grow": "1",
-            },
-            description: {
-              display: "none",
-            },
-            ctas_levoGroup: {
-              display: "flex",
-              "flex-direction": "row",
-              "align-items": "center",
-              gap: "sm",
-
-              "border-radius": "base",
-              "flex-shrink": "0",
-              mobile: {
-                "flex-direction": "column",
-                width: "100%",
-              },
-              tablet: {
-                "flex-direction": "column",
-                width: "100%",
-              },
+        grid_levoGroupItem: {
+          card: {
+            display: "flex",
+            "flex-direction": "column",
+            "align-items": "center",
+            "background-color": "card",
+            "padding-top": "2xl",
+            "padding-bottom": "2xl",
+            "padding-left": "2xl",
+            "padding-right": "2xl",
+            "border-radius": "xl",
+            border: "1px solid",
+            "border-color": "border",
+            "text-align": "center",
+            height: "100%",
+            "row-gap": "lg",
+            mobile: {
+              "padding-top": "xl",
+              "padding-left": "xl",
+              "padding-right": "xl",
+              "padding-bottom": "xl",
             },
-            ctas: [
-              {
-                cta: {},
-              },
-              {
-                cta: {},
-              },
-            ],
-          })),
+          },
+          badge: {
+            "font-weight": 600,
+            "font-size": "xs",
+            color: "brand",
+            "text-transform": "uppercase",
+            "letter-spacing": "0.08em",
+            "max-width": "fit-content",
+            "margin-bottom": "0",
+            "align-self": "center",
+          },
+          content_container: {
+            display: "flex",
+            "flex-direction": "column",
+            "align-items": "center",
+            "row-gap": "lg",
+            "flex-grow": "1",
+            width: "100%",
+          },
+          text_section: {
+            display: "flex",
+            "flex-direction": "column",
+            "row-gap": "sm",
+            "align-items": "center",
+            "flex-grow": "1",
+          },
+          title: {
+            "font-weight": 600,
+            "text-align": "center",
+          },
+          description: {
+            color: "muted-foreground",
+            "text-align": "center",
+          },
+          cta: {
+            "margin-top": "auto",
+          },
+        },
+        grid: [{}, {}, {}],
         header_button_rightIcon: {
-          width: "18px",
+          width: "16px",
+          height: "16px",
         },
         header_buttons_levoGroupItem: {
           header_button: {},
         },
       },
-      content: DEFAULT_CONTENT,
+      content: {
+        layout: null,
+        container: null,
+        header_section: null,
+        title_container: null,
+        main_title: "Why teams switch to one workspace",
+        main_description:
+          "Four product surfaces that quietly compound across every sprint — collaboration, automation, signal, and insight in a single place.",
+        header_buttons_levoGroup: null,
+        header_buttons: [
+          {
+            header_button: "See all features",
+          },
+          {
+            header_button: "Book a demo",
+          },
+        ],
+        grid: [
+          {
+            card: null,
+            badge: "No-code automations",
+            content_container: null,
+            text_section: null,
+            title: "Workflows on autopilot",
+            description:
+              "Chain triggers across Slack, Linear, and HubSpot in minutes — handoffs fire the moment a status changes, never twice.",
+            cta: "Browse recipes",
+          },
+          {
+            card: null,
+            badge: "Unified inbox",
+            content_container: null,
+            text_section: null,
+            title: "One queue to clear",
+            description:
+              "Slack threads, GitHub PRs, and Linear updates roll into a single ranked list — answer once, route anywhere.",
+            cta: "Connect tools",
+          },
+          {
+            card: null,
+            badge: "Live operating signal",
+            content_container: null,
+            text_section: null,
+            title: "Insights that ship",
+            description:
+              "Cycle time, burndown, and team load on a shared dashboard — answer 'are we on track' without pinging anyone.",
+            cta: "View dashboards",
+          },
+        ],
+        header_button_rightIcon: {
+          kind: "icon",
+          data: {
+            id: "arrow-right",
+            label: "Arrow Right",
+            svgCode:
+              '<svg   viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">\n<path d="M15 22.75H9C3.57 22.75 1.25 20.43 1.25 15V9C1.25 3.57 3.57 1.25 9 1.25H15C20.43 1.25 22.75 3.57 22.75 9V15C22.75 20.43 20.43 22.75 15 22.75ZM9 2.75C4.39 2.75 2.75 4.39 2.75 9V15C2.75 19.61 4.39 21.25 9 21.25H15C19.61 21.25 21.25 19.61 21.25 15V9C21.25 4.39 19.61 2.75 15 2.75H9Z" fill="var(--color-icon-primary)"/>\n<path d="M10.7397 16.28C10.5497 16.28 10.3597 16.21 10.2097 16.06C9.91969 15.77 9.91969 15.29 10.2097 15L13.2097 12L10.2097 8.99997C9.91969 8.70997 9.91969 8.22997 10.2097 7.93997C10.4997 7.64997 10.9797 7.64997 11.2697 7.93997L14.7997 11.47C15.0897 11.76 15.0897 12.24 14.7997 12.53L11.2697 16.06C11.1197 16.21 10.9297 16.28 10.7397 16.28Z" fill="var(--color-icon-primary)"/>\n</svg>',
+          },
+        },
+      },
       config: {
         main_title: {
           selectedVariants: {
             Heading_Level: "H2",
           },
         },
-        "grid.0.ctas": [null, null],
-        "grid.1.ctas": [null, null],
-        "grid.2.ctas": [null, null],
-        "grid.3.ctas": [null, null],
         header_buttons: [
           {
             header_button: {
@@ -418,7 +780,9 @@ export const Cards8: IBlock = {
           },
           {
             header_button: {
-              selectedVariants: {},
+              selectedVariants: {
+                Button_Variants: "Secondary",
+              },
             },
           },
         ],
@@ -432,54 +796,54 @@ export const Cards8: IBlock = {
                 Heading_Level: "H5",
               },
             },
-            badge: {
+            cta: {
               selectedVariants: {
-                Typography_Variants: "Small",
+                Button_Variants: "Link",
               },
             },
           },
           {
             title: {
-              selectedVariants: {
-                Heading_Level: "H5",
-              },
               heading: {
                 level: "4",
               },
+              selectedVariants: {
+                Heading_Level: "H5",
+              },
             },
-            badge: {
+            cta: {
               selectedVariants: {
-                Typography_Variants: "Small",
+                Button_Variants: "Link",
               },
             },
           },
           {
             title: {
-              selectedVariants: {
-                Heading_Level: "H5",
-              },
               heading: {
                 level: "4",
               },
+              selectedVariants: {
+                Heading_Level: "H5",
+              },
             },
-            badge: {
+            cta: {
               selectedVariants: {
-                Typography_Variants: "Small",
+                Button_Variants: "Link",
               },
             },
           },
           {
             title: {
-              selectedVariants: {
-                Heading_Level: "H5",
-              },
               heading: {
                 level: "4",
               },
+              selectedVariants: {
+                Heading_Level: "H5",
+              },
             },
-            badge: {
+            cta: {
               selectedVariants: {
-                Typography_Variants: "Small",
+                Button_Variants: "Link",
               },
             },
           },