@levo-so/blocks 0.1.100 → 0.1.102

package/src/blocks/features/features-5.schema.ts

@@ -1,13 +1,42 @@
 import type { IBlock } from "@levo-so/studio";
 
-const DUMMY_ICON = {
+const ICON_CLOUD_CONNECTION = {
   kind: "icon",
   data: {
-    id: "archive-minus",
-    label: "Archive Minus",
-    tags: ["archive", "custom", "directional", "minus"],
+    id: "cloud-connection",
+    label: "Cloud Connection",
     svgCode:
-      '<svg   viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">\n<path d="M14.5 11.4H9.5C9.09 11.4 8.75 11.06 8.75 10.65C8.75 10.24 9.09 9.90002 9.5 9.90002H14.5C14.91 9.90002 15.25 10.24 15.25 10.65C15.25 11.06 14.91 11.4 14.5 11.4Z" fill="var(--color-icon-primary)"/>\n<path d="M4.92957 22.75C4.50957 22.75 4.11957 22.65 3.76957 22.45C2.99957 22 2.55957 21.09 2.55957 19.96V5.86C2.55957 3.32 4.62957 1.25 7.16957 1.25H16.8196C19.3596 1.25 21.4296 3.32 21.4296 5.86V19.95C21.4296 21.08 20.9896 21.99 20.2196 22.44C19.4496 22.89 18.4396 22.84 17.4496 22.29L12.5696 19.58C12.2796 19.42 11.7096 19.42 11.4196 19.58L6.53957 22.29C5.99957 22.59 5.44957 22.75 4.92957 22.75ZM7.17957 2.75C5.46957 2.75 4.06957 4.15 4.06957 5.86V19.95C4.06957 20.54 4.23957 20.98 4.53957 21.15C4.83957 21.33 5.30957 21.27 5.81957 20.98L10.6996 18.27C11.4396 17.86 12.5596 17.86 13.2996 18.27L18.1796 20.98C18.6896 21.27 19.1596 21.33 19.4596 21.15C19.7596 20.97 19.9296 20.53 19.9296 19.95V5.86C19.9296 4.15 18.5296 2.75 16.8196 2.75H7.17957Z" fill="var(--color-icon-primary)"/>\n</svg>',
+      '<svg   viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">\n<path d="M16.0598 16.7499C16.0498 16.7499 16.0398 16.7499 16.0198 16.7499H6.3598C3.7298 16.5699 2.5498 14.5499 2.5498 12.7499C2.5498 11.1699 3.45982 9.41994 5.43982 8.89994C4.91982 6.72994 5.39981 4.69989 6.80981 3.21989C8.44981 1.49989 11.0698 0.81994 13.3398 1.51994C15.3998 2.14994 16.8498 3.82989 17.3898 6.15989C19.1798 6.58989 20.6098 7.94994 21.1798 9.82994C21.8098 11.8899 21.2298 13.9999 19.6798 15.3499C18.7098 16.2499 17.4198 16.7499 16.0598 16.7499ZM6.39981 10.2599C4.78981 10.3899 4.06982 11.5999 4.06982 12.7499C4.06982 13.9099 4.79981 15.1299 6.42981 15.2499H16.0398C16.0498 15.2499 16.0598 15.2499 16.0698 15.2499C17.0498 15.2499 17.9898 14.8899 18.6998 14.2299C20.0198 13.0799 20.1098 11.4299 19.7598 10.2599C19.3998 9.08993 18.4098 7.76991 16.6698 7.54991C16.3398 7.50991 16.0798 7.25991 16.0198 6.92991C15.6798 4.87991 14.5698 3.46994 12.9098 2.95994C11.1998 2.43994 9.14982 2.96994 7.90982 4.26994C6.69982 5.53994 6.41981 7.30994 7.11981 9.26994C7.25981 9.65994 7.05983 10.0899 6.66983 10.2299C6.57983 10.2499 6.49981 10.2699 6.39981 10.2599Z" fill="var(--color-icon-primary)"/>\n<path d="M12 19.75C11.59 19.75 11.25 19.41 11.25 19V16C11.25 15.59 11.59 15.25 12 15.25C12.41 15.25 12.75 15.59 12.75 16V19C12.75 19.41 12.41 19.75 12 19.75Z" fill="var(--color-icon-primary)"/>\n<path d="M12 23.75C10.48 23.75 9.25 22.52 9.25 21C9.25 19.48 10.48 18.25 12 18.25C13.52 18.25 14.75 19.48 14.75 21C14.75 22.52 13.52 23.75 12 23.75ZM12 19.75C11.31 19.75 10.75 20.31 10.75 21C10.75 21.69 11.31 22.25 12 22.25C12.69 22.25 13.25 21.69 13.25 21C13.25 20.31 12.69 19.75 12 19.75Z" fill="var(--color-icon-primary)"/>\n<path d="M18 21.75H14C13.59 21.75 13.25 21.41 13.25 21C13.25 20.59 13.59 20.25 14 20.25H18C18.41 20.25 18.75 20.59 18.75 21C18.75 21.41 18.41 21.75 18 21.75Z" fill="var(--color-icon-primary)"/>\n<path d="M10 21.75H6C5.59 21.75 5.25 21.41 5.25 21C5.25 20.59 5.59 20.25 6 20.25H10C10.41 20.25 10.75 20.59 10.75 21C10.75 21.41 10.41 21.75 10 21.75Z" fill="var(--color-icon-primary)"/>\n</svg>',
+  },
+};
+
+const ICON_SHIELD_TICK = {
+  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_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_CHART_SUCCESS = {
+  kind: "icon",
+  data: {
+    id: "chart-success",
+    label: "Chart Success",
+    svgCode:
+      '<svg   viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">\n<path d="M13 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 9V13C22.75 13.41 22.41 13.75 22 13.75C21.59 13.75 21.25 13.41 21.25 13V9C21.25 4.39 19.61 2.75 15 2.75H9C4.39 2.75 2.75 4.39 2.75 9V15C2.75 19.61 4.39 21.25 9 21.25H13C13.41 21.25 13.75 21.59 13.75 22C13.75 22.41 13.41 22.75 13 22.75Z" fill="var(--color-icon-primary)"/>\n<path d="M7 14.69C6.59 14.69 6.25 14.35 6.25 13.94V10.73C6.25 10.32 6.59 9.98001 7 9.98001C7.41 9.98001 7.75 10.32 7.75 10.73V13.94C7.75 14.36 7.41 14.69 7 14.69Z" fill="var(--color-icon-primary)"/>\n<path d="M17 14.69C16.59 14.69 16.25 14.35 16.25 13.94V10.73C16.25 10.32 16.59 9.98001 17 9.98001C17.41 9.98001 17.75 10.32 17.75 10.73V13.94C17.75 14.36 17.41 14.69 17 14.69Z" fill="var(--color-icon-primary)"/>\n<path d="M17.5803 21.75C17.3803 21.75 17.1903 21.67 17.0503 21.53L15.4703 19.96C15.1803 19.67 15.1703 19.19 15.4703 18.9C15.7603 18.61 16.2403 18.6 16.5303 18.9L17.5403 19.9L20.4403 16.51C20.7103 16.19 21.1803 16.16 21.5003 16.43C21.8103 16.7 21.8503 17.17 21.5803 17.49L18.1603 21.49C18.0203 21.65 17.8303 21.74 17.6203 21.75C17.6003 21.75 17.5903 21.75 17.5803 21.75Z" fill="var(--color-icon-primary)"/>\n<path d="M12 14.25C11.59 14.25 11.25 13.91 11.25 13.5V10.5C11.25 10.09 11.59 9.75 12 9.75C12.41 9.75 12.75 10.09 12.75 10.5V13.5C12.75 13.91 12.41 14.25 12 14.25Z" fill="var(--color-icon-primary)"/>\n</svg>',
   },
 };
 
@@ -19,45 +48,49 @@ const DEFAULT_CONTENT = {
     {
       item_wrapper: null,
       icon_content_wrapper: null,
-      icon: DUMMY_ICON,
+      icon: ICON_CLOUD_CONNECTION,
       content_wrapper: null,
-      title: "Become a Volunteer",
-      description: "Join us to create meaningful change.",
+      title: "Zero-touch migration",
+      description:
+        "Lift-and-shift workloads with Terraform modules, automated DNS cutover, and blue-green deploys that keep traffic flowing.",
       ctas_levoGroup: null,
-      ctas: [{ cta: "Register" }, { cta: "Learn More" }],
+      ctas: [{ cta: "See architecture" }],
       separator: null,
     },
     {
       item_wrapper: null,
       icon_content_wrapper: null,
-      icon: DUMMY_ICON,
+      icon: ICON_SHIELD_TICK,
       content_wrapper: null,
-      title: "Partner with Us",
-      description: "Collaborate as a business or organization.",
+      title: "Compliant by design",
+      description:
+        "SOC 2 Type II and ISO 27001 certified, with hardware-backed KMS keys rotated hourly and fine-grained just-in-time IAM.",
       ctas_levoGroup: null,
-      ctas: [{ cta: "Get Started" }, { cta: "Contact Us" }],
+      ctas: [{ cta: "Read trust report" }],
       separator: null,
     },
     {
       item_wrapper: null,
       icon_content_wrapper: null,
-      icon: DUMMY_ICON,
+      icon: ICON_FLASH,
       content_wrapper: null,
-      title: "Join as Member",
-      description: "Be part of a strong network dedicated to community support.",
+      title: "Fast by default",
+      description:
+        "Multi-region failover in under 30 seconds, spot-instance pools, and prebuilt CI/CD pipelines that ship every runtime.",
       ctas_levoGroup: null,
-      ctas: [{ cta: "Join Today" }, { cta: "View Benefits" }],
+      ctas: [{ cta: "View benchmarks" }],
       separator: null,
     },
     {
       item_wrapper: null,
       icon_content_wrapper: null,
-      icon: DUMMY_ICON,
+      icon: ICON_CHART_SUCCESS,
       content_wrapper: null,
-      title: "Donate",
-      description: "Your contributions help sustain our programs.",
+      title: "Observability built-in",
+      description:
+        "OpenTelemetry traces, metrics, and logs in one pane, with cost anomaly alerts attributed to every service and team.",
       ctas_levoGroup: null,
-      ctas: [{ cta: "Donate Now" }, { cta: "Other Ways" }],
+      ctas: [{ cta: "Explore platform" }],
       separator: null,
     },
   ],
@@ -155,7 +188,7 @@ export const Features5: IBlock = {
             prompt_description:
               "Brief description explaining the feature benefit. Keep it concise and engaging (1-2 sentences).",
             min_characters: 20,
-            max_characters: 80,
+            max_characters: 160,
           },
         },
         {
@@ -199,15 +232,13 @@ export const Features5: IBlock = {
         features_levoGroup: {
           display: "flex",
           width: "100%",
-          "align-items": "center",
+          "align-items": "stretch",
           "justify-content": "space-between",
           mobile: {
             "flex-direction": "column",
             "row-gap": "xl",
-
             display: "flex",
           },
-
           tablet: {
             display: "grid",
             "column-gap": "none",
@@ -217,384 +248,257 @@ export const Features5: IBlock = {
           "grid-template-columns": "repeat(2, minmax(0, 1fr))",
           "grid-template-rows": "repeat(1, minmax(0, 1fr))",
         },
-        features: [
-          {
-            item_wrapper: {
-              display: "flex",
-              "align-items": "center",
-              "flex-grow": "1",
-              mobile: {
-                "flex-direction": "column",
-                width: "100%",
-
-                "border-bottom": "1px s",
-              },
-              tablet: {},
-            },
-            icon_content_wrapper: {
-              display: "flex",
-              "align-items": "start",
-              "column-gap": "base",
-              "text-align": "left",
-              mobile: {
-                "flex-direction": "row",
-                "row-gap": "sm",
-                "text-align": "center",
-
-                "border-bottom": "1px solid",
-                "column-gap": "base",
-              },
-
-              "justify-content": "start",
-            },
-            icon: {
-              "flex-shrink": "0",
-              mobile: {
-                width: "40px",
-                height: "40px",
-              },
-
-              height: "36px",
-              width: "36px",
-              "font-size": "36px",
-            },
-            content_wrapper: {
-              display: "flex",
+        features_levoGroupItem: {
+          item_wrapper: {
+            display: "flex",
+            "align-items": "center",
+            "flex-grow": "1",
+            mobile: {
               "flex-direction": "column",
-              "row-gap": "xs",
-
-              "justify-content": "start",
-              "align-items": "start",
-              mobile: {
-                "justify-content": "start",
-                "align-items": "start",
-              },
-            },
-            title: {
-              mobile: {
-                "text-align": "center",
-              },
-              "font-weight": 700,
-            },
-            description: {
-              "max-width": "200px",
-              mobile: {
-                "max-width": "180px",
-                "text-align": "left",
-              },
-            },
-            ctas_levoGroup: {
-              display: "flex",
-              "flex-direction": "row",
-              "column-gap": "md",
-              "row-gap": "md",
-              "flex-wrap": "wrap",
-              "align-items": "center",
-            },
-            ctas: Array(2)
-              .fill(0)
-              .map(() => ({ cta: {} })),
-            separator: {
-              width: "1px",
-              height: "150px",
-              "background-color": "var(--color-border)",
-              "margin-left": "xl",
-              "margin-right": "xl",
-              mobile: {
-                display: "none",
-              },
-
-              tablet: {
-                display: "none",
-                height: "80px",
-                "margin-left": "none",
-                "margin-right": "none",
-              },
+              width: "100%",
             },
+            tablet: {},
           },
-          {
-            item_wrapper: {
-              display: "flex",
-              "align-items": "center",
-              "flex-grow": "1",
-              mobile: {
-                "flex-direction": "column",
-                width: "100%",
-
-                "border-bottom": "1px s",
-              },
-              tablet: {},
-            },
-            icon_content_wrapper: {
-              display: "flex",
-              "align-items": "start",
-              "column-gap": "base",
+          icon_content_wrapper: {
+            display: "flex",
+            "align-items": "start",
+            "column-gap": "base",
+            "text-align": "left",
+            mobile: {
+              "flex-direction": "row",
+              "row-gap": "sm",
               "text-align": "left",
-              mobile: {
-                "flex-direction": "row",
-                "row-gap": "sm",
-                "text-align": "center",
-
-                "border-bottom": "1px solid",
-                "column-gap": "base",
-              },
-
-              "justify-content": "start",
-            },
-            icon: {
-              "flex-shrink": "0",
-              mobile: {
-                width: "40px",
-                height: "40px",
-              },
-
-              height: "36px",
-              width: "36px",
-              "font-size": "36px",
+              "column-gap": "base",
             },
-            content_wrapper: {
-              display: "flex",
-              "flex-direction": "column",
-              "row-gap": "xs",
-
+            "justify-content": "start",
+          },
+          icon: {
+            "flex-shrink": "0",
+            mobile: {
+              width: "20px",
+              height: "20px",
+            },
+            height: "20px",
+            width: "20px",
+            "font-size": "20px",
+          },
+          content_wrapper: {
+            display: "flex",
+            "flex-direction": "column",
+            "row-gap": "xs",
+            "justify-content": "start",
+            "align-items": "start",
+            mobile: {
               "justify-content": "start",
               "align-items": "start",
-              mobile: {
-                "justify-content": "start",
-                "align-items": "start",
-              },
-            },
-            title: {
-              mobile: {
-                "text-align": "center",
-              },
-              "font-weight": 700,
-            },
-            description: {
-              "max-width": "200px",
-              mobile: {
-                "max-width": "180px",
-                "text-align": "left",
-              },
-            },
-            ctas_levoGroup: {
-              display: "flex",
-              "flex-direction": "row",
-              "column-gap": "md",
-              "row-gap": "md",
-              "flex-wrap": "wrap",
-              "align-items": "center",
-            },
-            ctas: Array(2)
-              .fill(0)
-              .map(() => ({ cta: {} })),
-            separator: {
-              width: "1px",
-              height: "150px",
-              "background-color": "var(--color-border)",
-              "margin-left": "xl",
-              "margin-right": "xl",
-              mobile: {
-                display: "none",
-              },
-
-              tablet: {
-                display: "none",
-                height: "80px",
-                "margin-left": "none",
-                "margin-right": "none",
-              },
             },
           },
-          {
-            item_wrapper: {
-              display: "flex",
-              "align-items": "center",
-              "flex-grow": "1",
-              mobile: {
-                "flex-direction": "column",
-                width: "100%",
-
-                "border-bottom": "1px s",
-              },
-              tablet: {},
-            },
-            icon_content_wrapper: {
-              display: "flex",
-              "align-items": "start",
-              "column-gap": "base",
+          title: {
+            mobile: {
               "text-align": "left",
-              mobile: {
-                "flex-direction": "row",
-                "row-gap": "sm",
-                "text-align": "center",
-
-                "border-bottom": "1px solid",
-                "column-gap": "base",
-              },
-
-              "justify-content": "start",
-            },
-            icon: {
-              "flex-shrink": "0",
-              mobile: {
-                width: "40px",
-                height: "40px",
-              },
-
-              height: "36px",
-              width: "36px",
-              "font-size": "36px",
-            },
-            content_wrapper: {
-              display: "flex",
-              "flex-direction": "column",
-              "row-gap": "xs",
-
-              "justify-content": "start",
-              "align-items": "start",
-              mobile: {
-                "justify-content": "start",
-                "align-items": "start",
-              },
-            },
-            title: {
-              mobile: {
-                "text-align": "center",
-              },
-              "font-weight": 700,
-            },
-            description: {
-              "max-width": "200px",
-              mobile: {
-                "max-width": "180px",
-                "text-align": "left",
-              },
-            },
-            ctas_levoGroup: {
-              display: "flex",
-              "flex-direction": "row",
-              "column-gap": "md",
-              "row-gap": "md",
-              "flex-wrap": "wrap",
-              "align-items": "center",
-            },
-            ctas: Array(2)
-              .fill(0)
-              .map(() => ({ cta: {} })),
-            separator: {
-              width: "1px",
-              height: "150px",
-              "background-color": "var(--color-border)",
-              "margin-left": "xl",
-              "margin-right": "xl",
-              mobile: {
-                display: "none",
-              },
-
-              tablet: {
-                display: "none",
-                height: "80px",
-                "margin-left": "none",
-                "margin-right": "none",
-              },
             },
+            "font-weight": 700,
           },
-          {
-            item_wrapper: {
-              display: "flex",
-              "align-items": "center",
-              "flex-grow": "1",
-              mobile: {
-                "flex-direction": "column",
-                width: "100%",
-
-                "border-bottom": "1px s",
-              },
-              tablet: {},
-            },
-            icon_content_wrapper: {
-              display: "flex",
-              "align-items": "start",
-              "column-gap": "base",
+          description: {
+            "max-width": "220px",
+            mobile: {
+              "max-width": "100%",
               "text-align": "left",
-              mobile: {
-                "flex-direction": "row",
-                "row-gap": "sm",
-                "text-align": "center",
-
-                "border-bottom": "1px solid",
-                "column-gap": "base",
-              },
-
-              "justify-content": "start",
-            },
-            icon: {
-              "flex-shrink": "0",
-              mobile: {
-                width: "40px",
-                height: "40px",
-              },
-
-              height: "36px",
-              width: "36px",
-              "font-size": "36px",
             },
-            content_wrapper: {
-              display: "flex",
-              "flex-direction": "column",
-              "row-gap": "xs",
-
-              "justify-content": "start",
-              "align-items": "start",
-              mobile: {
-                "justify-content": "start",
-                "align-items": "start",
-              },
+          },
+          ctas_levoGroup: {
+            display: "flex",
+            "flex-direction": "row",
+            "column-gap": "md",
+            "row-gap": "md",
+            "flex-wrap": "wrap",
+            "align-items": "center",
+            "margin-top": "sm",
+          },
+          ctas_levoGroupItem: { cta: {} },
+          ctas: [{}],
+          separator: {
+            width: "1px",
+            height: "120px",
+            "background-color": "var(--color-border)",
+            "margin-left": "xl",
+            "margin-right": "xl",
+            "flex-shrink": "0",
+            mobile: {
+              display: "none",
+            },
+            tablet: {
+              display: "none",
+              height: "80px",
+              "margin-left": "none",
+              "margin-right": "none",
             },
+          },
+        },
+        features: [{}, {}, {}, {}],
+      },
+      content: {
+        layout: null,
+        container: null,
+        features_levoGroup: null,
+        features: [
+          {
+            item_wrapper: null,
+            icon_content_wrapper: null,
+            icon: ICON_CLOUD_CONNECTION,
+            content_wrapper: null,
+            title: "Zero-touch migration",
+            description:
+              "Lift-and-shift workloads with Terraform modules, automated DNS cutover, and blue-green deploys that keep traffic flowing.",
+            ctas_levoGroup: null,
+            ctas: [{ cta: "See architecture" }],
+            separator: null,
+          },
+          {
+            item_wrapper: null,
+            icon_content_wrapper: null,
+            icon: ICON_SHIELD_TICK,
+            content_wrapper: null,
+            title: "Compliant by design",
+            description:
+              "SOC 2 Type II and ISO 27001 certified, with hardware-backed KMS keys rotated hourly and fine-grained just-in-time IAM.",
+            ctas_levoGroup: null,
+            ctas: [{ cta: "Read trust report" }],
+            separator: null,
+          },
+          {
+            item_wrapper: null,
+            icon_content_wrapper: null,
+            icon: ICON_FLASH,
+            content_wrapper: null,
+            title: "Fast by default",
+            description:
+              "Multi-region failover in under 30 seconds, spot-instance pools, and prebuilt CI/CD pipelines that ship every runtime.",
+            ctas_levoGroup: null,
+            ctas: [{ cta: "View benchmarks" }],
+            separator: null,
+          },
+          {
+            item_wrapper: null,
+            icon_content_wrapper: null,
+            icon: ICON_CHART_SUCCESS,
+            content_wrapper: null,
+            title: "Observability built-in",
+            description:
+              "OpenTelemetry traces, metrics, and logs in one pane, with cost anomaly alerts attributed to every service and team.",
+            ctas_levoGroup: null,
+            ctas: [{ cta: "Explore platform" }],
+            separator: null,
+          },
+        ],
+      },
+      config: {
+        title: {
+          heading: {
+            level: 2,
+          },
+        },
+        features: Array(4)
+          .fill(0)
+          .map(() => ({
             title: {
-              mobile: {
-                "text-align": "center",
+              heading: {
+                level: "6",
               },
-              "font-weight": 700,
-            },
-            description: {
-              "max-width": "200px",
-              mobile: {
-                "max-width": "180px",
-                "text-align": "left",
+              selectedVariants: {
+                Heading_Level: "H6",
               },
             },
-            ctas_levoGroup: {
-              display: "flex",
-              "flex-direction": "row",
-              "column-gap": "md",
-              "row-gap": "md",
-              "flex-wrap": "wrap",
-              "align-items": "center",
+            description: {
+              selectedVariants: {},
             },
-            ctas: Array(2)
-              .fill(0)
-              .map(() => ({ cta: {} })),
-            separator: {
-              width: "1px",
-              height: "150px",
-              "background-color": "var(--color-border)",
-              "margin-left": "xl",
-              "margin-right": "xl",
-              mobile: {
-                display: "none",
-              },
-
-              tablet: {
-                display: "none",
-                height: "80px",
-                "margin-left": "none",
-                "margin-right": "none",
+            ctas: [
+              {
+                cta: {
+                  selectedVariants: {
+                    Button_Variants: "Outline",
+                  },
+                },
               },
+            ],
+            icon: {
+              selectedVariants: {},
             },
+          })),
+      },
+    },
+    {
+      key: "grid",
+      title: "Grid",
+      styles: {
+        layout: {},
+        container: {},
+        features_levoGroup: {
+          display: "grid",
+          "grid-template-columns": "repeat(2, minmax(0, 1fr))",
+          "column-gap": "2xl",
+          "row-gap": "2xl",
+          width: "100%",
+          mobile: {
+            "grid-template-columns": "repeat(1, minmax(0, 1fr))",
           },
-        ],
+        },
+        features_levoGroupItem: {
+          item_wrapper: {
+            display: "flex",
+            "align-items": "stretch",
+            "padding-top": "2xl",
+            "padding-bottom": "2xl",
+            "padding-left": "2xl",
+            "padding-right": "2xl",
+            "border-radius": "base",
+            "background-color": "var(--color-surface-1)",
+            height: "100%",
+          },
+          icon_content_wrapper: {
+            display: "flex",
+            "align-items": "start",
+            "column-gap": "lg",
+            "text-align": "left",
+            flex: "1 1 0%",
+          },
+          icon: {
+            "flex-shrink": "0",
+            height: "36px",
+            width: "36px",
+            "font-size": "36px",
+          },
+          content_wrapper: {
+            display: "flex",
+            "flex-direction": "column",
+            "row-gap": "sm",
+            "justify-content": "start",
+            "align-items": "start",
+            flex: "1 1 0%",
+          },
+          title: {
+            "font-weight": 700,
+          },
+          description: {
+            "max-width": "320px",
+          },
+          ctas_levoGroup: {
+            display: "flex",
+            "flex-direction": "row",
+            "column-gap": "md",
+            "row-gap": "md",
+            "flex-wrap": "wrap",
+            "align-items": "center",
+            "margin-top": "auto",
+            "padding-top": "sm",
+          },
+          ctas_levoGroupItem: { cta: {} },
+          ctas: [{}],
+          separator: {
+            display: "none",
+          },
+        },
+        features: [{}, {}, {}, {}],
       },
       content: DEFAULT_CONTENT,
       config: {
@@ -603,12 +507,11 @@ export const Features5: IBlock = {
             level: 2,
           },
         },
-        features: [
-          {
+        features: Array(4)
+          .fill(0)
+          .map((_, i) => ({
             title: {
-              heading: {
-                level: "4",
-              },
+              ...(i === 0 ? { heading: { level: "4" } } : {}),
               selectedVariants: {
                 Heading_Level: "H4",
               },
@@ -616,21 +519,104 @@ export const Features5: IBlock = {
             description: {
               selectedVariants: {},
             },
-            ctas: Array(2)
-              .fill(0)
-              .map(() => ({
+            ctas: [
+              {
                 cta: {
                   selectedVariants: {
                     Button_Variants: "Outline",
                   },
                 },
-              })),
+              },
+            ],
             icon: {
               selectedVariants: {},
             },
+          })),
+      },
+    },
+    {
+      key: "stacked",
+      title: "Stacked",
+      styles: {
+        layout: {},
+        container: {},
+        features_levoGroup: {
+          display: "flex",
+          "flex-direction": "column",
+          "row-gap": "0",
+          width: "100%",
+        },
+        features_levoGroupItem: {
+          item_wrapper: {
+            display: "flex",
+            "align-items": "center",
+            "padding-top": "2xl",
+            "padding-bottom": "2xl",
+            "border-bottom": "1px solid var(--color-border)",
+            width: "100%",
           },
-          {
+          icon_content_wrapper: {
+            display: "flex",
+            "align-items": "center",
+            "column-gap": "xl",
+            "text-align": "left",
+            width: "100%",
+            "justify-content": "space-between",
+            mobile: {
+              "flex-direction": "column",
+              "align-items": "start",
+              "row-gap": "base",
+            },
+          },
+          icon: {
+            "flex-shrink": "0",
+            height: "40px",
+            width: "40px",
+            "font-size": "40px",
+          },
+          content_wrapper: {
+            display: "flex",
+            "flex-direction": "column",
+            "row-gap": "xs",
+            flex: "1 1 0%",
+            "justify-content": "center",
+            "align-items": "start",
+          },
+          title: {
+            "font-weight": 700,
+          },
+          description: {
+            "max-width": "520px",
+          },
+          ctas_levoGroup: {
+            display: "flex",
+            "flex-direction": "row",
+            "column-gap": "md",
+            "row-gap": "md",
+            "flex-wrap": "wrap",
+            "align-items": "center",
+            "flex-shrink": "0",
+          },
+          ctas_levoGroupItem: { cta: {} },
+          ctas: [{}],
+          separator: {
+            display: "none",
+          },
+        },
+        features: [{}, {}, {}, {}],
+      },
+      content: DEFAULT_CONTENT,
+      config: {
+        title: {
+          heading: {
+            level: 2,
+          },
+        },
+        features: Array(4)
+          .fill(0)
+          .map((_, i) => ({
             title: {
+              ...(i === 0 ? { heading: { level: "4" } } : {}),
               selectedVariants: {
                 Heading_Level: "H4",
               },
@@ -638,21 +624,112 @@ export const Features5: IBlock = {
             description: {
               selectedVariants: {},
             },
-            ctas: Array(2)
-              .fill(0)
-              .map(() => ({
+            ctas: [
+              {
                 cta: {
                   selectedVariants: {
                     Button_Variants: "Outline",
                   },
                 },
-              })),
+              },
+            ],
             icon: {
               selectedVariants: {},
             },
+          })),
+      },
+    },
+    {
+      key: "centered",
+      title: "Centered",
+      styles: {
+        layout: {},
+        container: {},
+        features_levoGroup: {
+          display: "grid",
+          "grid-template-columns": "repeat(4, minmax(0, 1fr))",
+          "column-gap": "xl",
+          "row-gap": "xl",
+          width: "100%",
+          tablet: {
+            "grid-template-columns": "repeat(2, minmax(0, 1fr))",
           },
-          {
+          mobile: {
+            "grid-template-columns": "repeat(1, minmax(0, 1fr))",
+          },
+        },
+        features_levoGroupItem: {
+          item_wrapper: {
+            display: "flex",
+            "flex-direction": "column",
+            "align-items": "center",
+            "text-align": "center",
+            "padding-top": "2xl",
+            "padding-bottom": "2xl",
+            height: "100%",
+          },
+          icon_content_wrapper: {
+            display: "flex",
+            "flex-direction": "column",
+            "align-items": "center",
+            "row-gap": "lg",
+            "text-align": "center",
+            flex: "1 1 0%",
+            width: "100%",
+          },
+          icon: {
+            "flex-shrink": "0",
+            height: "48px",
+            width: "48px",
+            "font-size": "48px",
+          },
+          content_wrapper: {
+            display: "flex",
+            "flex-direction": "column",
+            "row-gap": "xs",
+            "justify-content": "center",
+            "align-items": "center",
+            flex: "1 1 0%",
+          },
+          title: {
+            "font-weight": 700,
+            "text-align": "center",
+          },
+          description: {
+            "max-width": "240px",
+            "text-align": "center",
+          },
+          ctas_levoGroup: {
+            display: "flex",
+            "flex-direction": "row",
+            "column-gap": "md",
+            "row-gap": "md",
+            "flex-wrap": "wrap",
+            "align-items": "center",
+            "justify-content": "center",
+            "margin-top": "auto",
+            "padding-top": "sm",
+          },
+          ctas_levoGroupItem: { cta: {} },
+          ctas: [{}],
+          separator: {
+            display: "none",
+          },
+        },
+        features: [{}, {}, {}, {}],
+      },
+      content: DEFAULT_CONTENT,
+      config: {
+        title: {
+          heading: {
+            level: 2,
+          },
+        },
+        features: Array(4)
+          .fill(0)
+          .map((_, i) => ({
             title: {
+              ...(i === 0 ? { heading: { level: "4" } } : {}),
               selectedVariants: {
                 Heading_Level: "H4",
               },
@@ -660,42 +737,124 @@ export const Features5: IBlock = {
             description: {
               selectedVariants: {},
             },
-            ctas: Array(2)
-              .fill(0)
-              .map(() => ({
+            ctas: [
+              {
                 cta: {
                   selectedVariants: {
                     Button_Variants: "Outline",
                   },
                 },
-              })),
+              },
+            ],
             icon: {
               selectedVariants: {},
             },
+          })),
+      },
+    },
+    {
+      key: "compact",
+      title: "Compact",
+      styles: {
+        layout: {},
+        container: {},
+        features_levoGroup: {
+          display: "flex",
+          width: "100%",
+          "align-items": "stretch",
+          "justify-content": "space-between",
+          "column-gap": "sm",
+          mobile: {
+            "flex-direction": "column",
+            "row-gap": "sm",
           },
-          {
+          tablet: {
+            display: "grid",
+            "grid-template-columns": "repeat(2, minmax(0, 1fr))",
+            "row-gap": "sm",
+          },
+        },
+        features_levoGroupItem: {
+          item_wrapper: {
+            display: "flex",
+            "align-items": "center",
+            "flex-grow": "1",
+            "padding-top": "base",
+            "padding-bottom": "base",
+            "padding-left": "base",
+            "padding-right": "base",
+            "border-radius": "base",
+            "background-color": "var(--color-surface-1)",
+          },
+          icon_content_wrapper: {
+            display: "flex",
+            "align-items": "center",
+            "column-gap": "sm",
+            "text-align": "left",
+          },
+          icon: {
+            "flex-shrink": "0",
+            height: "24px",
+            width: "24px",
+            "font-size": "24px",
+          },
+          content_wrapper: {
+            display: "flex",
+            "flex-direction": "column",
+            "row-gap": "2xs",
+            "justify-content": "center",
+            "align-items": "start",
+          },
+          title: {
+            "font-weight": 700,
+            "font-size": "sm",
+          },
+          description: {
+            display: "none",
+          },
+          ctas_levoGroup: {
+            display: "none",
+          },
+          ctas_levoGroupItem: { cta: {} },
+          ctas: [{}],
+          separator: {
+            display: "none",
+          },
+        },
+        features: [{}, {}, {}, {}],
+      },
+      content: DEFAULT_CONTENT,
+      config: {
+        title: {
+          heading: {
+            level: 2,
+          },
+        },
+        features: Array(4)
+          .fill(0)
+          .map((_, i) => ({
             title: {
+              ...(i === 0 ? { heading: { level: "5" } } : {}),
               selectedVariants: {
-                Heading_Level: "H4",
+                Heading_Level: "H5",
               },
             },
             description: {
               selectedVariants: {},
             },
-            ctas: Array(2)
-              .fill(0)
-              .map(() => ({
+            ctas: [
+              {
                 cta: {
                   selectedVariants: {
                     Button_Variants: "Outline",
                   },
                 },
-              })),
+              },
+            ],
             icon: {
               selectedVariants: {},
             },
-          },
-        ],
+          })),
       },
     },
   ],