@levo-so/blocks 0.1.101 → 0.1.103

package/src/blocks/hero/hero-3.schema.ts

@@ -1,106 +1,270 @@
 import type { IBlock } from "@levo-so/studio";
 
+const BADGE_ICON = {
+  kind: "icon",
+  data: {
+    id: "status-up",
+    label: "Status Up",
+    svgCode:
+      '<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">\n<path d="M6.87988 18.9C6.46988 18.9 6.12988 18.56 6.12988 18.15V16.08C6.12988 15.67 6.46988 15.33 6.87988 15.33C7.28988 15.33 7.62988 15.67 7.62988 16.08V18.15C7.62988 18.57 7.28988 18.9 6.87988 18.9Z" fill="var(--color-icon-primary)"/>\n<path d="M12 18.9C11.59 18.9 11.25 18.56 11.25 18.15V14C11.25 13.59 11.59 13.25 12 13.25C12.41 13.25 12.75 13.59 12.75 14V18.15C12.75 18.57 12.41 18.9 12 18.9Z" fill="var(--color-icon-primary)"/>\n<path d="M17.1201 18.9C16.7101 18.9 16.3701 18.56 16.3701 18.15V11.93C16.3701 11.52 16.7101 11.18 17.1201 11.18C17.5301 11.18 17.8701 11.52 17.8701 11.93V18.15C17.8701 18.57 17.5401 18.9 17.1201 18.9Z" fill="var(--color-icon-primary)"/>\n<path d="M6.87958 13.18C6.53958 13.18 6.23958 12.95 6.14958 12.61C6.04958 12.21 6.28958 11.8 6.69958 11.7C10.3796 10.78 13.6196 8.77001 16.0896 5.90001L16.5496 5.36001C16.8196 5.05001 17.2896 5.01001 17.6096 5.28001C17.9196 5.55001 17.9596 6.02001 17.6896 6.34001L17.2296 6.88001C14.5596 10 11.0396 12.17 7.05958 13.16C6.99958 13.18 6.93958 13.18 6.87958 13.18Z" fill="var(--color-icon-primary)"/>\n<path d="M17.1204 9.52001C16.7104 9.52001 16.3704 9.18001 16.3704 8.77001V6.60001H14.1904C13.7804 6.60001 13.4404 6.26001 13.4404 5.85001C13.4404 5.44001 13.7804 5.10001 14.1904 5.10001H17.1204C17.5304 5.10001 17.8704 5.44001 17.8704 5.85001V8.78001C17.8704 9.19001 17.5404 9.52001 17.1204 9.52001Z" fill="var(--color-icon-primary)"/>\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</svg>',
+  },
+};
+
+const ICON_FLASH = {
+  kind: "icon",
+  data: {
+    id: "flash",
+    label: "Flash",
+    svgCode:
+      '<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">\n<path d="M9.98959 22.75C9.78959 22.75 9.62959 22.71 9.50959 22.66C9.10959 22.51 8.42959 22.02 8.42959 20.47V14.02H6.08959C4.74959 14.02 4.26959 13.39 4.09959 13.02C3.92959 12.64 3.77959 11.87 4.65959 10.86L12.2296 2.26001C13.2496 1.10001 14.0796 1.18001 14.4796 1.33001C14.8796 1.48001 15.5596 1.97001 15.5596 3.52001V9.97001H17.8996C19.2396 9.97001 19.7196 10.6 19.8896 10.97C20.0596 11.35 20.2096 12.12 19.3296 13.13L11.7596 21.73C11.0496 22.54 10.4296 22.75 9.98959 22.75ZM13.9296 2.74001C13.8996 2.78001 13.6896 2.88001 13.3596 3.26001L5.78959 11.86C5.50959 12.18 5.46959 12.38 5.46959 12.42C5.48959 12.43 5.66959 12.53 6.08959 12.53H9.17959C9.58959 12.53 9.92959 12.87 9.92959 13.28V20.48C9.92959 20.98 10.0196 21.2 10.0596 21.26C10.0896 21.22 10.2996 21.12 10.6296 20.74L18.1996 12.14C18.4796 11.82 18.5196 11.62 18.5196 11.58C18.4996 11.57 18.3196 11.47 17.8996 11.47H14.8096C14.3996 11.47 14.0596 11.13 14.0596 10.72V3.52001C14.0696 3.02001 13.9696 2.81001 13.9296 2.74001Z" fill="var(--color-icon-primary)"/>\n</svg>',
+  },
+};
+
+const ICON_SHIELD = {
+  kind: "icon",
+  data: {
+    id: "shield-tick",
+    label: "Shield Tick",
+    svgCode:
+      '<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">\n<path d="M12.0004 22.7599C10.9104 22.7599 9.83039 22.4399 8.98039 21.8099L4.68039 18.5999C3.54039 17.7499 2.65039 15.9699 2.65039 14.5599V7.11994C2.65039 5.57994 3.78039 3.93994 5.23039 3.39994L10.2204 1.52994C11.2104 1.15994 12.7704 1.15994 13.7604 1.52994L18.7504 3.39994C20.2004 3.93994 21.3304 5.57994 21.3304 7.11994V14.5499C21.3304 15.9699 20.4404 17.7399 19.3004 18.5899L15.0004 21.7999C14.1704 22.4399 13.0904 22.7599 12.0004 22.7599ZM10.7504 2.93994L5.76039 4.80994C4.91039 5.12994 4.16039 6.20994 4.16039 7.12994V14.5599C4.16039 15.5099 4.83039 16.8399 5.58039 17.3999L9.88039 20.6099C11.0304 21.4699 12.9704 21.4699 14.1304 20.6099L18.4304 17.3999C19.1904 16.8299 19.8504 15.5099 19.8504 14.5599V7.11994C19.8504 6.20994 19.1004 5.12994 18.2504 4.79994L13.2604 2.92994C12.5804 2.68994 11.4204 2.68994 10.7504 2.93994Z" fill="var(--color-icon-primary)"/>\n<path d="M10.6602 14.2301C10.4702 14.2301 10.2802 14.1601 10.1302 14.0101L8.52023 12.4001C8.23023 12.1101 8.23023 11.6301 8.52023 11.3401C8.81023 11.0501 9.29023 11.0501 9.58023 11.3401L10.6602 12.4201L14.4302 8.65012C14.7202 8.36012 15.2002 8.36012 15.4902 8.65012C15.7802 8.94012 15.7802 9.42012 15.4902 9.71012L11.1902 14.0101C11.0402 14.1601 10.8502 14.2301 10.6602 14.2301Z" fill="var(--color-icon-primary)"/>\n</svg>',
+  },
+};
+
+const ICON_CHART = {
+  kind: "icon",
+  data: {
+    id: "chart-2",
+    label: "Chart 2",
+    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="M15.5 19.25C13.98 19.25 12.75 18.02 12.75 16.5V7.5C12.75 5.98 13.98 4.75 15.5 4.75C17.02 4.75 18.25 5.98 18.25 7.5V16.5C18.25 18.02 17.02 19.25 15.5 19.25ZM15.5 6.25C14.81 6.25 14.25 6.81 14.25 7.5V16.5C14.25 17.19 14.81 17.75 15.5 17.75C16.19 17.75 16.75 17.19 16.75 16.5V7.5C16.75 6.81 16.19 6.25 15.5 6.25Z" fill="var(--color-icon-primary)"/>\n<path d="M8.5 19.25C6.98 19.25 5.75 18.02 5.75 16.5V13C5.75 11.48 6.98 10.25 8.5 10.25C10.02 10.25 11.25 11.48 11.25 13V16.5C11.25 18.02 10.02 19.25 8.5 19.25ZM8.5 11.75C7.81 11.75 7.25 12.31 7.25 13V16.5C7.25 17.19 7.81 17.75 8.5 17.75C9.19 17.75 9.75 17.19 9.75 16.5V13C9.75 12.31 9.19 11.75 8.5 11.75Z" fill="var(--color-icon-primary)"/>\n</svg>',
+  },
+};
+
+const ICON_TEAM = {
+  kind: "icon",
+  data: {
+    id: "profile-2user",
+    label: "Profile 2user",
+    svgCode:
+      '<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">\n<path d="M9.15957 11.62C9.12957 11.62 9.10957 11.62 9.07957 11.62C9.02957 11.61 8.95957 11.61 8.89957 11.62C5.99957 11.53 3.80957 9.25 3.80957 6.44C3.80957 3.58 6.13957 1.25 8.99957 1.25C11.8596 1.25 14.1896 3.58 14.1896 6.44C14.1796 9.25 11.9796 11.53 9.18957 11.62C9.17957 11.62 9.16957 11.62 9.15957 11.62ZM8.99957 2.75C6.96957 2.75 5.30957 4.41 5.30957 6.44C5.30957 8.44 6.86957 10.05 8.85957 10.12C8.91957 10.11 9.04957 10.11 9.17957 10.12C11.1396 10.03 12.6796 8.42 12.6896 6.44C12.6896 4.41 11.0296 2.75 8.99957 2.75Z" fill="var(--color-icon-primary)"/>\n<path d="M16.5394 11.75C16.5094 11.75 16.4794 11.75 16.4494 11.74C16.0394 11.78 15.6194 11.49 15.5794 11.08C15.5394 10.67 15.7894 10.3 16.1994 10.25C16.3194 10.24 16.4494 10.24 16.5594 10.24C18.0194 10.16 19.1594 8.96 19.1594 7.49C19.1594 5.97 17.9294 4.74 16.4094 4.74C15.9994 4.75 15.6594 4.41 15.6594 4C15.6594 3.59 15.9994 3.25 16.4094 3.25C18.7494 3.25 20.6594 5.16 20.6594 7.5C20.6594 9.8 18.8594 11.66 16.5694 11.75C16.5594 11.75 16.5494 11.75 16.5394 11.75Z" fill="var(--color-icon-primary)"/>\n<path d="M9.16961 22.55C7.20961 22.55 5.23961 22.05 3.74961 21.05C2.35961 20.13 1.59961 18.87 1.59961 17.5C1.59961 16.13 2.35961 14.86 3.74961 13.93C6.74961 11.94 11.6096 11.94 14.5896 13.93C15.9696 14.85 16.7396 16.11 16.7396 17.48C16.7396 18.85 15.9796 20.12 14.5896 21.05C13.0896 22.05 11.1296 22.55 9.16961 22.55ZM4.57961 15.19C3.61961 15.83 3.09961 16.65 3.09961 17.51C3.09961 18.36 3.62961 19.18 4.57961 19.81C7.06961 21.48 11.2696 21.48 13.7596 19.81C14.7196 19.17 15.2396 18.35 15.2396 17.49C15.2396 16.64 14.7096 15.82 13.7596 15.19C11.2696 13.53 7.06961 13.53 4.57961 15.19Z" fill="var(--color-icon-primary)"/>\n<path d="M18.3392 20.75C17.9892 20.75 17.6792 20.51 17.6092 20.15C17.5292 19.74 17.7892 19.35 18.1892 19.26C18.8192 19.13 19.3992 18.88 19.8492 18.53C20.4192 18.1 20.7292 17.56 20.7292 16.99C20.7292 16.42 20.4192 15.88 19.8592 15.46C19.4192 15.12 18.8692 14.88 18.2192 14.73C17.8192 14.64 17.5592 14.24 17.6492 13.83C17.7392 13.43 18.1392 13.17 18.5492 13.26C19.4092 13.45 20.1592 13.79 20.7692 14.26C21.6992 14.96 22.2292 15.95 22.2292 16.99C22.2292 18.03 21.6892 19.02 20.7592 19.73C20.1392 20.21 19.3592 20.56 18.4992 20.73C18.4392 20.75 18.3892 20.75 18.3392 20.75Z" fill="var(--color-icon-primary)"/>\n</svg>',
+  },
+};
+
 const DEFAULT_CONTENT = {
   layout: null,
   header_wrapper: null,
   badge_wrapper: null,
-  badge_icon: {
-    id: "7141014160938075687",
-    location: "https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH.png",
-    kind: "image",
-    mimetype: "image/png",
-    srcset: {
-      "1080w": "https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-1080w.webp",
-      "1200w": "https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-1200w.webp",
-      "1920w": "https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-1920w.webp",
-      "320w": "https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-320w.webp",
-      "640w": "https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-640w.webp",
-      "750w": "https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-750w.webp",
-      "828w": "https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-828w.webp",
-      path: "https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-640w.webp 640w, https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-1080w.webp 1080w, https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-1200w.webp 1200w, https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-1920w.webp 1920w, https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-320w.webp 320w, https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-750w.webp 750w, https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-828w.webp 828w",
-    },
-  },
-  badge_text: "Your Trusted Partner in Financial Growth & Security.",
+  badge_icon: BADGE_ICON,
+  badge_text: "MODERN TEAM OS",
   headings_wrapper: null,
-  title: "Empowering Your Financial Future",
+  title: "Operating System for fast-moving teams",
   description:
-    "Experience a higher standard of banking and investment with tailored solutions designed for individuals and institutions.",
+    "Replace a dozen tools with one workspace. Plan, ship, and measure product from a single source of truth — built for teams that ship weekly.",
   features_levoGroup: null,
   features: [
     {
       card: null,
       icon_wrapper: null,
-      icon: {
-        id: "7141014160938075687",
-        location: "https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH.png",
-        kind: "image",
-        mimetype: "image/png",
-        srcset: {
-          "1080w": "https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-1080w.webp",
-          "1200w": "https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-1200w.webp",
-          "1920w": "https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-1920w.webp",
-          "320w": "https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-320w.webp",
-          "640w": "https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-640w.webp",
-          "750w": "https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-750w.webp",
-          "828w": "https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-828w.webp",
-          path: "https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-640w.webp 640w, https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-1080w.webp 1080w, https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-1200w.webp 1200w, https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-1920w.webp 1920w, https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-320w.webp 320w, https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-750w.webp 750w, https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-828w.webp 828w",
-        },
-      },
-      title: "Comprehensive Wealth Management",
+      icon: ICON_FLASH,
+      title: "Workflows on autopilot",
       description:
-        "Personalized strategies to preserve, grow, and transfer wealth for individuals and families.",
+        "Trigger status updates, Slack pings, and webhooks the moment work moves. No Zapier glue, no polling loops.",
     },
     {
       card: null,
       icon_wrapper: null,
-      icon: {
-        id: "7141014160938075687",
-        location: "https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH.png",
-        kind: "image",
-        mimetype: "image/png",
-        srcset: {
-          "1080w": "https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-1080w.webp",
-          "1200w": "https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-1200w.webp",
-          "1920w": "https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-1920w.webp",
-          "320w": "https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-320w.webp",
-          "640w": "https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-640w.webp",
-          "750w": "https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-750w.webp",
-          "828w": "https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-828w.webp",
-          path: "https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-640w.webp 640w, https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-1080w.webp 1080w, https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-1200w.webp 1200w, https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-1920w.webp 1920w, https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-320w.webp 320w, https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-750w.webp 750w, https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-828w.webp 828w",
-        },
-      },
-      title: "Strategic Investment Advisory",
+      icon: ICON_SHIELD,
+      title: "Enterprise-grade by default",
       description:
-        "Expert market insights and portfolio diversification tailored to your financial ambitions.",
+        "SOC 2 Type II, SSO, SCIM, and row-level audit logs on every plan. Your security team signs off in a day, not a quarter.",
     },
     {
       card: null,
       icon_wrapper: null,
-      icon: {
-        id: "7141014160938075687",
-        location: "https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH.png",
-        kind: "image",
-        mimetype: "image/png",
-        srcset: {
-          "1080w": "https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-1080w.webp",
-          "1200w": "https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-1200w.webp",
-          "1920w": "https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-1920w.webp",
-          "320w": "https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-320w.webp",
-          "640w": "https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-640w.webp",
-          "750w": "https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-750w.webp",
-          "828w": "https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-828w.webp",
-          path: "https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-640w.webp 640w, https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-1080w.webp 1080w, https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-1200w.webp 1200w, https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-1920w.webp 1920w, https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-320w.webp 320w, https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-750w.webp 750w, https://space.levo.so/WLZ1TXTD/defaultblue-tryFJ012mgyH-828w.webp 828w",
-        },
-      },
-      title: "Secure Digital Banking",
+      icon: ICON_CHART,
+      title: "Metrics that compound",
+      description:
+        "Cycle time, throughput, and DORA metrics update live as work moves. Spot regressions in hours, not retros.",
+    },
+    {
+      card: null,
+      icon_wrapper: null,
+      icon: ICON_TEAM,
+      title: "Real-time, every surface",
       description:
-        "Modern, secure and seamless banking experiences—anytime, anywhere, for your business and personal needs.",
+        "Presence, cursors, and instant sync across every doc and board. Backed by 99.99% uptime and a P1 under ten minutes.",
     },
   ],
 };
 
 export type IHero3Content = typeof DEFAULT_CONTENT;
 
+const FEATURE_CONFIG = [
+  {
+    title: {
+      heading: { level: "4" },
+      selectedVariants: { Heading_Level: "H4" },
+    },
+  },
+  {
+    title: {
+      heading: { level: "4" },
+      selectedVariants: { Heading_Level: "H4" },
+    },
+  },
+  {
+    title: {
+      heading: { level: "4" },
+      selectedVariants: { Heading_Level: "H4" },
+    },
+  },
+  {
+    title: {
+      heading: { level: "4" },
+      selectedVariants: { Heading_Level: "H4" },
+    },
+  },
+];
+
+const TITLE_CONFIG = {
+  heading: { level: "1" },
+  selectedVariants: { Heading_Level: "H1" },
+};
+
+const GRID_ITEM_STYLES = {
+  title: {
+    "margin-bottom": "xs",
+  },
+  card: {
+    "background-color": "background-1",
+    "border-radius": "base",
+    border: "1px solid",
+    "border-color": "border",
+    "box-shadow": "default",
+    padding: "lg",
+    display: "flex",
+    "flex-direction": "column",
+    "align-items": "start",
+    height: "100%",
+  },
+  icon_wrapper: {
+    display: "none",
+    // was flex
+    "align-items": "center",
+    "justify-content": "center",
+    height: "3rem",
+    width: "3rem",
+    "border-radius": "base",
+    "background-color": "background-2",
+    "margin-bottom": "base",
+    "flex-shrink": 0,
+  },
+  icon: {
+    display: "none",
+    color: "brand",
+    width: "1.5rem",
+    height: "1.5rem",
+    "font-size": "1.5rem",
+  },
+  description: {},
+};
+
+const TWO_COL_ITEM_STYLES = {
+  title: {
+    "margin-bottom": "xs",
+  },
+  card: {
+    "background-color": "background-1",
+    "border-radius": "xl",
+    border: "1px solid",
+    "border-color": "border",
+    "box-shadow": "default",
+    padding: "xl",
+    display: "flex",
+    "flex-direction": "column",
+    "align-items": "start",
+    height: "100%",
+  },
+  icon_wrapper: {
+    display: "none",
+    // was flex
+    "align-items": "center",
+    "justify-content": "center",
+    height: "3.5rem",
+    width: "3.5rem",
+    "border-radius": "xl",
+    "background-color": "background-2",
+    "margin-bottom": "base",
+    "flex-shrink": 0,
+  },
+  icon: {
+    display: "none",
+    color: "brand",
+    width: "1.75rem",
+    height: "1.75rem",
+    "font-size": "1.75rem",
+  },
+  description: {},
+};
+
+const LIST_ITEM_STYLES = {
+  title: {
+    "margin-bottom": "xs",
+    flex: "1 1 0",
+    "min-width": "0",
+  },
+  card: {
+    display: "flex",
+    "flex-direction": "row",
+    "align-items": "start",
+    gap: "lg",
+    padding: "base",
+  },
+  icon_wrapper: {
+    display: "none",
+    // was flex
+    "align-items": "center",
+    "justify-content": "center",
+    height: "3rem",
+    width: "3rem",
+    "min-width": "3rem",
+    "border-radius": "base",
+    "background-color": "background-2",
+    "flex-shrink": 0,
+  },
+  icon: {
+    display: "none",
+    color: "brand",
+    width: "1.5rem",
+    height: "1.5rem",
+    "font-size": "1.5rem",
+  },
+  description: {
+    flex: "1 1 0",
+    "min-width": "0",
+  },
+};
+
+const BADGE_WRAPPER_STYLES = {
+  display: "inline-flex",
+  "align-items": "center",
+  gap: "xs",
+  color: "brand",
+  "text-transform": "uppercase",
+  "letter-spacing": "0.08em",
+  "font-weight": 600,
+  "font-size": "xs",
+};
+
+const BADGE_ICON_STYLES = {
+  display: "none",
+  width: "1rem",
+  height: "1rem",
+  "font-size": "1rem",
+  color: "brand",
+  "flex-shrink": 0,
+};
+
 export const Hero3: IBlock = {
   category_id: "hero",
   title: "Hero 3",
@@ -196,107 +360,86 @@ export const Hero3: IBlock = {
       key: "default",
       title: "Default",
       config: {
-        title: {
-          heading: {
-            level: "1",
-          },
-          selectedVariants: {
-            Heading_Level: "H1",
-          },
+        title: TITLE_CONFIG,
+        features: FEATURE_CONFIG,
+      },
+      content: DEFAULT_CONTENT,
+      styles: {
+        container: {},
+        header_wrapper: {
+          "margin-bottom": "3xl",
         },
-        "features.0.title": {
-          heading: {
-            level: 1,
-          },
-          selectedVariants: {
-            Heading_Level: "H1",
-          },
+        badge_wrapper: BADGE_WRAPPER_STYLES,
+        badge_icon: BADGE_ICON_STYLES,
+        headings_wrapper: {
+          "margin-top": "2xl",
+          display: "flex",
+          "flex-direction": "column",
+          "align-items": "flex-start",
+          gap: "lg",
         },
-        "features.1.title": {
-          heading: {
-            level: 1,
-          },
-          selectedVariants: {
-            Heading_Level: "H1",
-          },
+        title: {
+          "text-wrap": "balance",
+          "max-width": "48rem",
         },
-        "features.2.title": {
-          heading: {
-            level: 1,
-          },
-          selectedVariants: {
-            Heading_Level: "H1",
-          },
+        description: {
+          "max-width": "42rem",
         },
-        features: [
-          {
-            title: {
-              heading: {
-                level: "4",
-              },
-              selectedVariants: {
-                Heading_Level: "H4",
-              },
-            },
-          },
-          {
-            title: {
-              selectedVariants: {
-                Heading_Level: "H4",
-              },
-              heading: {
-                level: "4",
-              },
-            },
+        features_levoGroup: {
+          display: "grid",
+          "grid-template-columns": "repeat(4, minmax(0, 1fr))",
+          gap: "lg",
+          tablet: {
+            "grid-template-columns": "repeat(2, minmax(0, 1fr))",
           },
-          {
-            title: {
-              selectedVariants: {
-                Heading_Level: "H4",
-              },
-              heading: {
-                level: "4",
-              },
-            },
+          mobile: {
+            "grid-template-columns": "repeat(1, minmax(0, 1fr))",
           },
-        ],
+        },
+        features_levoGroupItem: GRID_ITEM_STYLES,
+        features: [{}, {}, {}, {}],
+      },
+    },
+    {
+      key: "centered_header",
+      title: "Centered Header",
+      config: {
+        title: TITLE_CONFIG,
+        features: FEATURE_CONFIG,
       },
       content: DEFAULT_CONTENT,
       styles: {
         container: {},
         header_wrapper: {
-          "margin-bottom": "3xl",
-        },
-        badge_wrapper: {
-          display: "inline-flex",
+          "margin-bottom": "5xl",
+          display: "flex",
+          "flex-direction": "column",
           "align-items": "center",
-          gap: "xs",
-          color: "text-2",
-        },
-        badge_icon: {
-          "border-radius": "base",
+          "text-align": "center",
         },
+        badge_wrapper: BADGE_WRAPPER_STYLES,
+        badge_icon: BADGE_ICON_STYLES,
         headings_wrapper: {
           "margin-top": "2xl",
           display: "flex",
-          "flex-direction": "row",
-          "justify-content": "space-between",
-          "align-items": "start",
+          "flex-direction": "column",
+          "align-items": "center",
+          "text-align": "center",
           gap: "lg",
-          mobile: {
-            "flex-direction": "column",
-          },
         },
         title: {
-          "max-width": "36rem",
+          "text-wrap": "balance",
+          "max-width": "40rem",
+          "text-align": "center",
         },
         description: {
-          "max-width": "28rem",
+          "max-width": "34rem",
+          "text-align": "center",
           "margin-top": "xs",
         },
         features_levoGroup: {
           display: "grid",
-          "grid-template-columns": "repeat(3, minmax(0, 1fr))",
+          "grid-template-columns": "repeat(4, minmax(0, 1fr))",
           gap: "lg",
           tablet: {
             "grid-template-columns": "repeat(2, minmax(0, 1fr))",
@@ -305,94 +448,87 @@ export const Hero3: IBlock = {
             "grid-template-columns": "repeat(1, minmax(0, 1fr))",
           },
         },
-        features: [
-          {
-            card: {
-              "background-color": "background-1",
-              "border-radius": "base",
-              border: "1px solid",
-              "border-color": "border",
-              "box-shadow": "default",
-              padding: "lg",
-              display: "flex",
-              "flex-direction": "column",
-              "align-items": "start",
-            },
-            icon_wrapper: {
-              display: "flex",
-              "align-items": "center",
-              "justify-content": "center",
-              height: "3rem",
-              width: "3rem",
-              "border-radius": "base",
-              "background-color": "background-2",
-              "margin-bottom": "base",
-            },
-            icon: {
-              color: "brand",
-            },
-            description: {},
-          },
-          {
-            card: {
-              "background-color": "background-1",
-              "border-radius": "base",
-              border: "1px solid",
-              "border-color": "border",
-              "box-shadow": "default",
-              padding: "lg",
-              display: "flex",
-              "flex-direction": "column",
-              "align-items": "start",
-            },
-            icon_wrapper: {
-              display: "flex",
-              "align-items": "center",
-              "justify-content": "center",
-              height: "3rem",
-              width: "3rem",
-              "border-radius": "base",
-              "background-color": "background-2",
-              "margin-bottom": "base",
-            },
-            icon: {
-              color: "brand",
-            },
-            description: {},
-          },
-          {
-            card: {
-              "background-color": "background-1",
-              "border-radius": "base",
-              border: "1px solid",
-              "border-color": "border",
-              "box-shadow": "default",
-              padding: "lg",
-              display: "flex",
-              "flex-direction": "column",
-              "align-items": "start",
-            },
-            icon_wrapper: {
-              display: "flex",
-              "align-items": "center",
-              "justify-content": "center",
-              height: "3rem",
-              width: "3rem",
-              "border-radius": "base",
-              "background-color": "background-2",
-              "margin-bottom": "base",
-            },
-            icon: {
-              color: "brand",
-            },
-            description: {},
-          },
-        ],
-        features_levoGroupItem: {
-          title: {
-            "margin-bottom": "xs",
+        features_levoGroupItem: GRID_ITEM_STYLES,
+        features: [{}, {}, {}, {}],
+      },
+    },
+    {
+      key: "two_column_features",
+      title: "Two Column Features",
+      config: {
+        title: TITLE_CONFIG,
+        features: FEATURE_CONFIG,
+      },
+      content: DEFAULT_CONTENT,
+      styles: {
+        container: {},
+        header_wrapper: {
+          "margin-bottom": "3xl",
+        },
+        badge_wrapper: BADGE_WRAPPER_STYLES,
+        badge_icon: BADGE_ICON_STYLES,
+        headings_wrapper: {
+          "margin-top": "2xl",
+          display: "flex",
+          "flex-direction": "column",
+          "align-items": "flex-start",
+          gap: "lg",
+        },
+        title: {
+          "text-wrap": "balance",
+          "max-width": "48rem",
+        },
+        description: {
+          "max-width": "42rem",
+        },
+        features_levoGroup: {
+          display: "grid",
+          "grid-template-columns": "repeat(2, minmax(0, 1fr))",
+          gap: "xl",
+          mobile: {
+            "grid-template-columns": "repeat(1, minmax(0, 1fr))",
           },
         },
+        features_levoGroupItem: TWO_COL_ITEM_STYLES,
+        features: [{}, {}, {}, {}],
+      },
+    },
+    {
+      key: "list_style",
+      title: "List Style",
+      config: {
+        title: TITLE_CONFIG,
+        features: FEATURE_CONFIG,
+      },
+      content: DEFAULT_CONTENT,
+      styles: {
+        container: {},
+        header_wrapper: {
+          "margin-bottom": "3xl",
+        },
+        badge_wrapper: BADGE_WRAPPER_STYLES,
+        badge_icon: BADGE_ICON_STYLES,
+        headings_wrapper: {
+          "margin-top": "2xl",
+          display: "flex",
+          "flex-direction": "column",
+          "align-items": "flex-start",
+          gap: "lg",
+        },
+        title: {
+          "text-wrap": "balance",
+          "max-width": "48rem",
+        },
+        description: {
+          "max-width": "42rem",
+        },
+        features_levoGroup: {
+          display: "flex",
+          "flex-direction": "column",
+          gap: "lg",
+        },
+        features_levoGroupItem: LIST_ITEM_STYLES,
+        features: [{}, {}, {}, {}],
       },
     },
   ],