diff --git a/gulpfile.js b/gulpfile.js
index 4a85dd0..f5a5aa3 100644
--- a/gulpfile.js
+++ b/gulpfile.js
@@ -23,12 +23,12 @@ const pathsStore = {
 
 // Quick/efficient way to get the unique values from a array.
 function uniqValuesArray(a) {
-  var seen = {};
-  var out = [];
-  var len = a.length;
-  var j = 0;
-  for (var i = 0; i < len; i++) {
-    var item = a[i];
+  let seen = {};
+  let out = [];
+  let len = a.length;
+  let j = 0;
+  for (let i = 0; i < len; i++) {
+    let item = a[i];
     if (seen[item] !== 1) {
       seen[item] = 1;
       out[j++] = item;
diff --git a/store/blocks/pdp/product.jsonc b/store/blocks/pdp/product.jsonc
index 6a916dc..dea7449 100644
--- a/store/blocks/pdp/product.jsonc
+++ b/store/blocks/pdp/product.jsonc
@@ -18,6 +18,7 @@
     },
     "children": ["breadcrumb"]
   },
+
   "flex-layout.row#specifications-title": {
     "children": ["rich-text#specifications"]
   },
diff --git a/styles/configs/font-faces.css b/styles/configs/font-faces.css
new file mode 100644
index 0000000..92a5494
--- /dev/null
+++ b/styles/configs/font-faces.css
@@ -0,0 +1,4 @@
+@font-face {
+  font-family: "Open Sans", sans-serif;
+  src: url("https://fonts.googleapis.com/css2?family=Open+Sans&display=swap");
+}
diff --git a/styles/configs/style.json b/styles/configs/style.json
index 7b90b6b..64c4329 100644
--- a/styles/configs/style.json
+++ b/styles/configs/style.json
@@ -1,349 +1,351 @@
 {
-    "typeScale": [
-        3, 2.25, 1.5, 1.25, 1, 0.875, 0.75
-      ],
-      "spacing": [0.125, 0.25, 0.5, 0.75, 1, 1.5, 2, 3, 4, 8, 16],
-      "customMedia": [
-        { "s": 20 },
-        { "ns": {
-            "value": 40,
-            "minWidth": true
-          }
-        },
-        { "m": {
-            "value": 40,
-            "minWidth": true
-          }
-        },
-        { "l": {
-          "value": 64,
-          "minWidth": true
-        }
-        },
-        { "xl": {
-            "value": 80,
-            "minWidth": true
-          }
-        }
-      ],
-      "colors": {
-        "black-90": "rgba(0,0,0,.9)",
-        "black-80": "rgba(0,0,0,.8)",
-        "black-70": "rgba(0,0,0,.7)",
-        "black-60": "rgba(0,0,0,.6)",
-        "black-50": "rgba(0,0,0,.5)",
-        "black-40": "rgba(0,0,0,.4)",
-        "black-30": "rgba(0,0,0,.3)",
-        "black-20": "rgba(0,0,0,.2)",
-        "black-10": "rgba(0,0,0,.1)",
-        "black-05": "rgba(0,0,0,.05)",
-        "black-025": "rgba(0,0,0,.025)",
-        "black-0125": "rgba(0,0,0,.0125)",
+  "typeScale": [3, 2.25, 1.5, 1.25, 1, 0.875, 0.75],
+  "spacing": [0.125, 0.25, 0.5, 0.75, 1, 1.5, 2, 3, 4, 8, 16],
+  "customMedia": [
+    { "s": 20 },
+    {
+      "ns": {
+        "value": 40,
+        "minWidth": true
+      }
+    },
+    {
+      "m": {
+        "value": 40,
+        "minWidth": true
+      }
+    },
+    {
+      "l": {
+        "value": 64,
+        "minWidth": true
+      }
+    },
+    {
+      "xl": {
+        "value": 80,
+        "minWidth": true
+      }
+    }
+  ],
+  "colors": {
+    "black-90": "rgba(0,0,0,.9)",
+    "black-80": "rgba(0,0,0,.8)",
+    "black-70": "rgba(0,0,0,.7)",
+    "black-60": "rgba(0,0,0,.6)",
+    "black-50": "rgba(0,0,0,.5)",
+    "black-40": "rgba(0,0,0,.4)",
+    "black-30": "rgba(0,0,0,.3)",
+    "black-20": "rgba(0,0,0,.2)",
+    "black-10": "rgba(0,0,0,.1)",
+    "black-05": "rgba(0,0,0,.05)",
+    "black-025": "rgba(0,0,0,.025)",
+    "black-0125": "rgba(0,0,0,.0125)",
 
-        "white-90": "rgba(255,255,255,.9)",
-        "white-80": "rgba(255,255,255,.8)",
-        "white-70": "rgba(255,255,255,.7)",
-        "white-60": "rgba(255,255,255,.6)",
-        "white-50": "rgba(255,255,255,.5)",
-        "white-40": "rgba(255,255,255,.4)",
-        "white-30": "rgba(255,255,255,.3)",
-        "white-20": "rgba(255,255,255,.2)",
-        "white-10": "rgba(255,255,255,.1)",
-        "white-05": "rgba(255,255,255,.05)",
-        "white-025": "rgba(255,255,255,.025)",
-        "white-0125": "rgba(255,255,255,.0125)"
+    "white-90": "rgba(255,255,255,.9)",
+    "white-80": "rgba(255,255,255,.8)",
+    "white-70": "rgba(255,255,255,.7)",
+    "white-60": "rgba(255,255,255,.6)",
+    "white-50": "rgba(255,255,255,.5)",
+    "white-40": "rgba(255,255,255,.4)",
+    "white-30": "rgba(255,255,255,.3)",
+    "white-20": "rgba(255,255,255,.2)",
+    "white-10": "rgba(255,255,255,.1)",
+    "white-05": "rgba(255,255,255,.05)",
+    "white-025": "rgba(255,255,255,.025)",
+    "white-0125": "rgba(255,255,255,.0125)"
+  },
+  "semanticColors": {
+    "background": {
+      "base": "#ffffff",
+      "base--inverted": "#03044e",
+      "action-primary": "#0F3E99",
+      "action-secondary": "#eef3f7",
+      "emphasis": "#f71963",
+      "disabled": "#f2f4f5",
+      "success": "#8bc34a",
+      "success--faded": "#eafce3",
+      "danger": "#ff4c4c",
+      "danger--faded": "#ffe6e6",
+      "warning": "#ffb100",
+      "warning--faded": "#fff6e0",
+      "muted-1": "#727273",
+      "muted-2": "#979899",
+      "muted-3": "#cacbcc",
+      "muted-4": "#e3e4e6",
+      "muted-5": "#f2f4f5"
+    },
+    "hover-background": {
+      "action-primary": "#072c75",
+      "action-secondary": "#dbe9fd",
+      "emphasis": "#dd1659",
+      "success": "#8bc34a",
+      "success--faded": "#eafce3",
+      "danger": "#e13232",
+      "danger--faded": "#ffe6e6",
+      "warning": "#ffb100",
+      "warning--faded": "#fff6e0",
+      "muted-1": "#727273",
+      "muted-2": "#979899",
+      "muted-3": "#cacbcc",
+      "muted-4": "#e3e4e6",
+      "muted-5": "#f2f4f5"
+    },
+    "active-background": {
+      "action-primary": "#0c389f",
+      "action-secondary": "#d2defc",
+      "emphasis": "#dd1659",
+      "success": "#8bc34a",
+      "success--faded": "#eafce3",
+      "danger": "#ff4c4c",
+      "danger--faded": "#ffe6e6",
+      "warning": "#ffb100",
+      "warning--faded": "#fff6e0",
+      "muted-1": "#727273",
+      "muted-2": "#979899",
+      "muted-3": "#cacbcc",
+      "muted-4": "#e3e4e6",
+      "muted-5": "#f2f4f5"
+    },
+    "text": {
+      "action-primary": "#0F3E99",
+      "action-secondary": "#eef3f7",
+      "link": "#0F3E99",
+      "emphasis": "#f71963",
+      "disabled": "#979899",
+      "success": "#8bc34a",
+      "success--faded": "#eafce3",
+      "danger": "#ff4c4c",
+      "danger--faded": "#ffe6e6",
+      "warning": "#ffb100",
+      "warning--faded": "#fff6e0",
+      "muted-1": "#727273",
+      "muted-2": "#979899",
+      "muted-3": "#cacbcc",
+      "muted-4": "#e3e4e6",
+      "muted-5": "#f2f4f5"
+    },
+    "visited-text": {
+      "link": "#0c389f"
+    },
+    "hover-text": {
+      "action-primary": "#072c75",
+      "action-secondary": "#dbe9fd",
+      "link": "#0c389f",
+      "emphasis": "#dd1659",
+      "success": "#8bc34a",
+      "success--faded": "#eafce3",
+      "danger": "#e13232",
+      "danger--faded": "#ffe6e6",
+      "warning": "#ffb100",
+      "warning--faded": "#fff6e0"
+    },
+    "active-text": {
+      "link": "#0c389f",
+      "emphasis": "#dd1659",
+      "success": "#8bc34a",
+      "success--faded": "#eafce3",
+      "danger": "#ff4c4c",
+      "danger--faded": "#ffe6e6",
+      "warning": "#ffb100",
+      "warning--faded": "#fff6e0"
+    },
+    "border": {
+      "action-primary": "#0F3E99",
+      "action-secondary": "#eef3f7",
+      "emphasis": "#f71963",
+      "disabled": "#e3e4e6",
+      "success": "#8bc34a",
+      "success--faded": "#eafce3",
+      "danger": "#ff4c4c",
+      "danger--faded": "#ffe6e6",
+      "warning": "#ffb100",
+      "warning--faded": "#fff6e0",
+      "muted-1": "#727273",
+      "muted-2": "#979899",
+      "muted-3": "#cacbcc",
+      "muted-4": "#e3e4e6",
+      "muted-5": "#f2f4f5"
+    },
+    "hover-border": {
+      "action-primary": "#072c75",
+      "action-secondary": "#dbe9fd",
+      "emphasis": "#dd1659",
+      "success": "#8bc34a",
+      "success--faded": "#eafce3",
+      "danger": "#e13232",
+      "danger--faded": "#ffe6e6",
+      "warning": "#ffb100",
+      "warning--faded": "#fff6e0",
+      "muted-1": "#727273",
+      "muted-2": "#979899",
+      "muted-3": "#cacbcc",
+      "muted-4": "#e3e4e6",
+      "muted-5": "#f2f4f5"
+    },
+    "active-border": {
+      "action-primary": "#0c389f",
+      "action-secondary": "#d2defc",
+      "emphasis": "#dd1659",
+      "success": "#8bc34a",
+      "success--faded": "#eafce3",
+      "danger": "#ff4c4c",
+      "danger--faded": "#ffe6e6",
+      "warning": "#ffb100",
+      "warning--faded": "#fff6e0",
+      "muted-1": "#727273",
+      "muted-2": "#979899",
+      "muted-3": "#cacbcc",
+      "muted-4": "#e3e4e6",
+      "muted-5": "#f2f4f5"
+    },
+    "on": {
+      "base": "#3f3f40",
+      "base--inverted": "#ffffff",
+      "action-primary": "#ffffff",
+      "action-secondary": "#0F3E99",
+      "emphasis": "#ffffff",
+      "disabled": "#979899",
+      "success": "#ffffff",
+      "success--faded": "#3f3f40",
+      "danger": "#ffffff",
+      "danger--faded": "#3f3f40",
+      "warning": "#ffffff",
+      "warning--faded": "#1a1a1a",
+      "muted-1": "#ffffff",
+      "muted-2": "#ffffff",
+      "muted-3": "#3f3f40",
+      "muted-4": "#3f3f40",
+      "muted-5": "#3f3f40"
+    },
+    "hover-on": {
+      "action-primary": "#ffffff",
+      "action-secondary": "#0F3E99",
+      "emphasis": "#ffffff",
+      "success": "#ffffff",
+      "success--faded": "#3f3f40",
+      "danger": "#ffffff",
+      "danger--faded": "#3f3f40",
+      "warning": "#ffffff",
+      "warning--faded": "#1a1a1a"
+    },
+    "active-on": {
+      "action-primary": "#ffffff",
+      "action-secondary": "#0F3E99",
+      "emphasis": "#ffffff",
+      "success": "#ffffff",
+      "success--faded": "#3f3f40",
+      "danger": "#ffffff",
+      "danger--faded": "#3f3f40",
+      "warning": "#ffffff",
+      "warning--faded": "#1a1a1a"
+    }
+  },
+  "borderWidths": [0, 0.125, 0.25, 0.5, 1, 2],
+  "borderRadius": [0, 0.125, 0.25, 0.5, 1],
+  "widths": [1, 2, 4, 8, 16],
+  "maxWidths": [1, 2, 4, 8, 16, 32, 48, 64, 96],
+  "heights": [1, 2, 4, 8, 16],
+  "sizes": [
+    { "name": "small", "value": 2 },
+    { "name": "regular", "value": 2.5 },
+    { "name": "large", "value": 3 }
+  ],
+  "typography": {
+    "measure": [30, 34, 20],
+    "styles": {
+      "heading-1": {
+        "fontFamily": "Open Sans, sans-serif",
+        "fontWeight": "700",
+        "fontSize": "3rem",
+        "textTransform": "initial",
+        "letterSpacing": "0"
       },
-      "semanticColors": {
-        "background": {
-          "base": "#ffffff",
-          "base--inverted": "#03044e",
-          "action-primary": "#0F3E99",
-          "action-secondary": "#eef3f7",
-          "emphasis": "#f71963",
-          "disabled": "#f2f4f5",
-          "success": "#8bc34a",
-          "success--faded": "#eafce3",
-          "danger": "#ff4c4c",
-          "danger--faded": "#ffe6e6",
-          "warning": "#ffb100",
-          "warning--faded": "#fff6e0",
-          "muted-1": "#727273",
-          "muted-2": "#979899",
-          "muted-3": "#cacbcc",
-          "muted-4": "#e3e4e6",
-          "muted-5": "#f2f4f5"
-        },
-        "hover-background": {
-          "action-primary": "#072c75",
-          "action-secondary": "#dbe9fd",
-          "emphasis": "#dd1659",
-          "success": "#8bc34a",
-          "success--faded": "#eafce3",
-          "danger": "#e13232",
-          "danger--faded": "#ffe6e6",
-          "warning": "#ffb100",
-          "warning--faded": "#fff6e0",
-          "muted-1": "#727273",
-          "muted-2": "#979899",
-          "muted-3": "#cacbcc",
-          "muted-4": "#e3e4e6",
-          "muted-5": "#f2f4f5"
-        },
-        "active-background": {
-          "action-primary": "#0c389f",
-          "action-secondary": "#d2defc",
-          "emphasis": "#dd1659",
-          "success": "#8bc34a",
-          "success--faded": "#eafce3",
-          "danger": "#ff4c4c",
-          "danger--faded": "#ffe6e6",
-          "warning": "#ffb100",
-          "warning--faded": "#fff6e0",
-          "muted-1": "#727273",
-          "muted-2": "#979899",
-          "muted-3": "#cacbcc",
-          "muted-4": "#e3e4e6",
-          "muted-5": "#f2f4f5"
-        },
-        "text": {
-          "action-primary": "#0F3E99",
-          "action-secondary": "#eef3f7",
-          "link": "#0F3E99",
-          "emphasis": "#f71963",
-          "disabled": "#979899",
-          "success": "#8bc34a",
-          "success--faded": "#eafce3",
-          "danger": "#ff4c4c",
-          "danger--faded": "#ffe6e6",
-          "warning": "#ffb100",
-          "warning--faded": "#fff6e0",
-          "muted-1": "#727273",
-          "muted-2": "#979899",
-          "muted-3": "#cacbcc",
-          "muted-4": "#e3e4e6",
-          "muted-5": "#f2f4f5"
-        },
-        "visited-text": {
-          "link": "#0c389f"
-        },
-        "hover-text": {
-          "action-primary": "#072c75",
-          "action-secondary": "#dbe9fd",
-          "link": "#0c389f",
-          "emphasis": "#dd1659",
-          "success": "#8bc34a",
-          "success--faded": "#eafce3",
-          "danger": "#e13232",
-          "danger--faded": "#ffe6e6",
-          "warning": "#ffb100",
-          "warning--faded": "#fff6e0"
-        },
-        "active-text": {
-          "link": "#0c389f",
-          "emphasis": "#dd1659",
-          "success": "#8bc34a",
-          "success--faded": "#eafce3",
-          "danger": "#ff4c4c",
-          "danger--faded": "#ffe6e6",
-          "warning": "#ffb100",
-          "warning--faded": "#fff6e0"
-        },
-        "border": {
-          "action-primary": "#0F3E99",
-          "action-secondary": "#eef3f7",
-          "emphasis": "#f71963",
-          "disabled": "#e3e4e6",
-          "success": "#8bc34a",
-          "success--faded": "#eafce3",
-          "danger": "#ff4c4c",
-          "danger--faded": "#ffe6e6",
-          "warning": "#ffb100",
-          "warning--faded": "#fff6e0",
-          "muted-1": "#727273",
-          "muted-2": "#979899",
-          "muted-3": "#cacbcc",
-          "muted-4": "#e3e4e6",
-          "muted-5": "#f2f4f5"
-        },
-        "hover-border": {
-          "action-primary": "#072c75",
-          "action-secondary": "#dbe9fd",
-          "emphasis": "#dd1659",
-          "success": "#8bc34a",
-          "success--faded": "#eafce3",
-          "danger": "#e13232",
-          "danger--faded": "#ffe6e6",
-          "warning": "#ffb100",
-          "warning--faded": "#fff6e0",
-          "muted-1": "#727273",
-          "muted-2": "#979899",
-          "muted-3": "#cacbcc",
-          "muted-4": "#e3e4e6",
-          "muted-5": "#f2f4f5"
-        },
-        "active-border": {
-          "action-primary": "#0c389f",
-          "action-secondary": "#d2defc",
-          "emphasis": "#dd1659",
-          "success": "#8bc34a",
-          "success--faded": "#eafce3",
-          "danger": "#ff4c4c",
-          "danger--faded": "#ffe6e6",
-          "warning": "#ffb100",
-          "warning--faded": "#fff6e0",
-          "muted-1": "#727273",
-          "muted-2": "#979899",
-          "muted-3": "#cacbcc",
-          "muted-4": "#e3e4e6",
-          "muted-5": "#f2f4f5"
-        },
-        "on": {
-          "base": "#3f3f40",
-          "base--inverted": "#ffffff",
-          "action-primary": "#ffffff",
-          "action-secondary": "#0F3E99",
-          "emphasis": "#ffffff",
-          "disabled": "#979899",
-          "success": "#ffffff",
-          "success--faded": "#3f3f40",
-          "danger": "#ffffff",
-          "danger--faded": "#3f3f40",
-          "warning": "#ffffff",
-          "warning--faded": "#1a1a1a",
-          "muted-1": "#ffffff",
-          "muted-2": "#ffffff",
-          "muted-3": "#3f3f40",
-          "muted-4": "#3f3f40",
-          "muted-5": "#3f3f40"
-        },
-        "hover-on": {
-          "action-primary": "#ffffff",
-          "action-secondary": "#0F3E99",
-          "emphasis": "#ffffff",
-          "success": "#ffffff",
-          "success--faded": "#3f3f40",
-          "danger": "#ffffff",
-          "danger--faded": "#3f3f40",
-          "warning": "#ffffff",
-          "warning--faded": "#1a1a1a"
-        },
-        "active-on": {
-          "action-primary": "#ffffff",
-          "action-secondary": "#0F3E99",
-          "emphasis": "#ffffff",
-          "success": "#ffffff",
-          "success--faded": "#3f3f40",
-          "danger": "#ffffff",
-          "danger--faded": "#3f3f40",
-          "warning": "#ffffff",
-          "warning--faded": "#1a1a1a"
-        }
+      "heading-2": {
+        "fontFamily": "Open Sans, sans-serif",
+        "fontWeight": "700",
+        "fontSize": "2.25rem",
+        "textTransform": "initial",
+        "letterSpacing": "0"
       },
-      "borderWidths": [0, 0.125, 0.25, 0.5, 1, 2],
-      "borderRadius": [0, 0.125, 0.25, 0.5, 1],
-      "widths": [1, 2, 4, 8, 16],
-      "maxWidths": [1, 2, 4, 8, 16, 32, 48, 64, 96],
-      "heights": [1, 2, 4, 8, 16],
-      "sizes": [
-        {"name": "small", "value": 2},
-        {"name": "regular", "value": 2.5},
-        {"name": "large", "value": 3}
-      ],
-      "typography":{
-        "measure": [30, 34, 20],
-        "styles": {
-          "heading-1": {
-            "fontFamily": "San Francisco, -apple-system, BlinkMacSystemFont, avenir next, avenir, helvetica neue, helvetica, ubuntu, roboto, noto, segoe ui, arial, sans-serif",
-            "fontWeight": "700",
-            "fontSize": "3rem",
-            "textTransform": "initial",
-            "letterSpacing": "0"
-          },
-          "heading-2": {
-            "fontFamily": "San Francisco, -apple-system, BlinkMacSystemFont, avenir next, avenir, helvetica neue, helvetica, ubuntu, roboto, noto, segoe ui, arial, sans-serif",
-            "fontWeight": "700",
-            "fontSize": "2.25rem",
-            "textTransform": "initial",
-            "letterSpacing": "0"
-          },
-          "heading-3": {
-            "fontFamily": "San Francisco, -apple-system, BlinkMacSystemFont, avenir next, avenir, helvetica neue, helvetica, ubuntu, roboto, noto, segoe ui, arial, sans-serif",
-            "fontWeight": "700",
-            "fontSize": "1.75rem",
-            "textTransform": "initial",
-            "letterSpacing": "0"
-          },
-          "heading-4": {
-            "fontFamily": "San Francisco, -apple-system, BlinkMacSystemFont, avenir next, avenir, helvetica neue, helvetica, ubuntu, roboto, noto, segoe ui, arial, sans-serif",
-            "fontWeight": "normal",
-            "fontSize": "1.5rem",
-            "textTransform": "initial",
-            "letterSpacing": "0"
-          },
-          "heading-5": {
-            "fontFamily": "San Francisco, -apple-system, BlinkMacSystemFont, avenir next, avenir, helvetica neue, helvetica, ubuntu, roboto, noto, segoe ui, arial, sans-serif",
-            "fontWeight": "normal",
-            "fontSize": "1.25rem",
-            "textTransform": "initial",
-            "letterSpacing": "0"
-          },
-          "heading-6": {
-            "fontFamily": "San Francisco, -apple-system, BlinkMacSystemFont, avenir next, avenir, helvetica neue, helvetica, ubuntu, roboto, noto, segoe ui, arial, sans-serif",
-            "fontWeight": "normal",
-            "fontSize": "1.25rem",
-            "textTransform": "initial",
-            "letterSpacing": "0"
-          },
-          "body": {
-            "fontFamily": "San Francisco, -apple-system, BlinkMacSystemFont, avenir next, avenir, helvetica neue, helvetica, ubuntu, roboto, noto, segoe ui, arial, sans-serif",
-            "fontWeight": "normal",
-            "fontSize": "1rem",
-            "textTransform": "initial",
-            "letterSpacing": "0"
-          },
-          "small": {
-            "fontFamily": "San Francisco, -apple-system, BlinkMacSystemFont, avenir next, avenir, helvetica neue, helvetica, ubuntu, roboto, noto, segoe ui, arial, sans-serif",
-            "fontWeight": "normal",
-            "fontSize": "0.875rem",
-            "textTransform": "initial",
-            "letterSpacing": "0"
-          },
-          "mini": {
-            "fontFamily": "San Francisco, -apple-system, BlinkMacSystemFont, avenir next, avenir, helvetica neue, helvetica, ubuntu, roboto, noto, segoe ui, arial, sans-serif",
-            "fontWeight": "normal",
-            "fontSize": "0.75rem",
-            "textTransform": "initial",
-            "letterSpacing": "0"
-          },
-          "action": {
-            "fontFamily": "San Francisco, -apple-system, BlinkMacSystemFont, avenir next, avenir, helvetica neue, helvetica, ubuntu, roboto, noto, segoe ui, arial, sans-serif",
-            "fontWeight": "500",
-            "fontSize": "1rem",
-            "textTransform": "uppercase",
-            "letterSpacing": "0"
-          },
-          "action--small": {
-            "fontFamily": "San Francisco, -apple-system, BlinkMacSystemFont, avenir next, avenir, helvetica neue, helvetica, ubuntu, roboto, noto, segoe ui, arial, sans-serif",
-            "fontWeight": "500",
-            "fontSize": "0.875rem",
-            "textTransform": "uppercase",
-            "letterSpacing": "0"
-          },
-          "action--large": {
-            "fontFamily": "San Francisco, -apple-system, BlinkMacSystemFont, avenir next, avenir, helvetica neue, helvetica, ubuntu, roboto, noto, segoe ui, arial, sans-serif",
-            "fontWeight": "500",
-            "fontSize": "1.25rem",
-            "textTransform": "uppercase",
-            "letterSpacing": "0"
-          },
-          "code": {
-            "fontFamily": "Consolas, monaco, monospace",
-            "fontWeight": "normal",
-            "fontSize": "1rem",
-            "textTransform": "initial",
-            "letterSpacing": "0"
-          }
-        }
+      "heading-3": {
+        "fontFamily": "Open Sans, sans-serif",
+        "fontWeight": "700",
+        "fontSize": "1.75rem",
+        "textTransform": "initial",
+        "letterSpacing": "0"
       },
-      "opacity": [1, 0.9, 0.8, 0.7, 0.6, 0.5, 0.4, 0.3, 0.2, 0.1, 0.05, 0.025, 0]
+      "heading-4": {
+        "fontFamily": "Open Sans, sans-serif",
+        "fontWeight": "normal",
+        "fontSize": "1.5rem",
+        "textTransform": "initial",
+        "letterSpacing": "0"
+      },
+      "heading-5": {
+        "fontFamily": "Open Sans, sans-serif",
+        "fontWeight": "normal",
+        "fontSize": "1.25rem",
+        "textTransform": "initial",
+        "letterSpacing": "0"
+      },
+      "heading-6": {
+        "fontFamily": "Open Sans, sans-serif",
+        "fontWeight": "normal",
+        "fontSize": "1.25rem",
+        "textTransform": "initial",
+        "letterSpacing": "0"
+      },
+      "body": {
+        "fontFamily": "Open Sans, sans-serif",
+        "fontWeight": "normal",
+        "fontSize": "1rem",
+        "textTransform": "initial",
+        "letterSpacing": "0"
+      },
+      "small": {
+        "fontFamily": "Open Sans, sans-serif",
+        "fontWeight": "normal",
+        "fontSize": "0.875rem",
+        "textTransform": "initial",
+        "letterSpacing": "0"
+      },
+      "mini": {
+        "fontFamily": "Open Sans, sans-serif",
+        "fontWeight": "normal",
+        "fontSize": "0.75rem",
+        "textTransform": "initial",
+        "letterSpacing": "0"
+      },
+      "action": {
+        "fontFamily": "Open Sans, sans-serif",
+        "fontWeight": "500",
+        "fontSize": "1rem",
+        "textTransform": "uppercase",
+        "letterSpacing": "0"
+      },
+      "action--small": {
+        "fontFamily": "Open Sans, sans-serif",
+        "fontWeight": "500",
+        "fontSize": "0.875rem",
+        "textTransform": "uppercase",
+        "letterSpacing": "0"
+      },
+      "action--large": {
+        "fontFamily": "Open Sans, sans-serif",
+        "fontWeight": "500",
+        "fontSize": "1.25rem",
+        "textTransform": "uppercase",
+        "letterSpacing": "0"
+      },
+      "code": {
+        "fontFamily": "Open Sans, sans-serif",
+        "fontWeight": "normal",
+        "fontSize": "1rem",
+        "textTransform": "initial",
+        "letterSpacing": "0"
+      }
+    }
+  },
+  "opacity": [1, 0.9, 0.8, 0.7, 0.6, 0.5, 0.4, 0.3, 0.2, 0.1, 0.05, 0.025, 0]
 }
diff --git a/styles/css/agenciamagma.store-theme.css b/styles/css/agenciamagma.store-theme.css
index 5e37ba5..54b243e 100644
--- a/styles/css/agenciamagma.store-theme.css
+++ b/styles/css/agenciamagma.store-theme.css
@@ -7,10 +7,11 @@
 */
 /* Media Query M3 */
 /* Grid breakpoints */
-.html {
-  background-color: red;
-}
-
 .html--pdp-breadcrumb {
-  background-color: green;
+  margin: 0 40px;
+}
+@media screen and (min-width: 2500px) {
+  .html--pdp-breadcrumb {
+    margin: 0 360px;
+  }
 }
\ No newline at end of file
diff --git a/styles/css/vtex.breadcrumb.css b/styles/css/vtex.breadcrumb.css
new file mode 100644
index 0000000..707e8c4
--- /dev/null
+++ b/styles/css/vtex.breadcrumb.css
@@ -0,0 +1,26 @@
+/*
+0 - 600PX: Phone
+600 - 900px: Table portrait
+900 - 1200px: Tablet landscape
+[1200 - 1800] is where our nortal styles apply
+1800px + : Big desktop
+*/
+/* Media Query M3 */
+/* Grid breakpoints */
+.container {
+  margin: 0;
+}
+.container .link,
+.container .term {
+  color: #929292;
+  font-style: normal;
+  font-weight: 400;
+  font-size: 14px;
+  line-height: 19px;
+}
+.container .homeLink::before {
+  content: "Home";
+}
+.container .homeLink .homeIcon {
+  display: none;
+}
\ No newline at end of file
diff --git a/styles/css/vtex.flex-layout.css b/styles/css/vtex.flex-layout.css
index a7c5732..34c4328 100644
--- a/styles/css/vtex.flex-layout.css
+++ b/styles/css/vtex.flex-layout.css
@@ -1,98 +1,9 @@
-.flexRowContent--menu-link,
-.flexRowContent--main-header {
-  padding: 0 0.5rem;
-}
-
-@media screen and (min-width: 40em) {
-  .flexRowContent--menu-link,
-  .flexRowContent--main-header {
-    padding: 0 1rem;
-  }
-}
-
-@media screen and (min-width: 80rem) {
-  .flexRowContent--menu-link,
-  .flexRowContent--main-header {
-    padding: 0 0.25rem;
-  }
-}
-
-.flexRowContent--menu-link {
-  background-color: #03044e;
-  color: #fff;
-}
-
-.flexRowContent--main-header {
-  background-color: #f0f0f0;
-}
-
-.flexRowContent--main-header-mobile {
-  align-items: center;
-  padding: 0.625rem 0.5rem;
-  background-color: #f0f0f0;
-}
-
-.flexRowContent--menu-link :global(.vtex-menu-2-x-styledLink) {
-  color: #ffffff;
-  font-size: 14px;
-}
-
-.flexRowContent--main-header :global(.vtex-menu-2-x-styledLink) {
-  color: #727273;
-  font-size: 14px;
-}
-
-.flexRow--deals {
-  background-color: #0F3E99;
-  padding: 14px 0px;
-}
-
-.flexRow--deals .stretchChildrenWidth {
-  align-items: center;
-}
-
-.flexRow--deals .flexCol {
-  align-items: center;
-  margin-bottom: 5px;
-  padding-top: 5px;
-}
-
-.flexCol--filterCol {
-  max-width: 500px;
-  min-width: 230px;
-}
-
-.flexCol--productCountCol {
-  align-items: flex-start;
-}
-
-.flexCol--orderByCol {
-  align-items: flex-end;
-}
-
-.flexCol--orderByMobileCol {
-  width: 42%;
-}
-
-.flexCol--filterMobileCol {
-  width: 38%;
-}
-
-.flexRow--quickviewMainRow {
-  display: flex;
-  max-height: 100%;
-}
-
-.flexColChild--quickviewDetails:first-child {
-  overflow-y: auto;
-  height: 66% !important;
-  overflow-x: hidden;
-}
-
-.flexColChild--quickviewDetails:last-child {
-  height: 34% !important;
-}
-
-.flexRow--addToCartRow {
-  padding-bottom: 1rem;
-}
+/*
+0 - 600PX: Phone
+600 - 900px: Table portrait
+900 - 1200px: Tablet landscape
+[1200 - 1800] is where our nortal styles apply
+1800px + : Big desktop
+*/
+/* Media Query M3 */
+/* Grid breakpoints */
\ No newline at end of file
diff --git a/styles/sass/pages/product/agenciamagma.store-theme.scss b/styles/sass/pages/product/agenciamagma.store-theme.scss
index ea7d5b9..ee45a0d 100644
--- a/styles/sass/pages/product/agenciamagma.store-theme.scss
+++ b/styles/sass/pages/product/agenciamagma.store-theme.scss
@@ -1,8 +1,11 @@
-.html {
-  background-color: red;
-}
+// .html {
+//   background-color: red;
+// }
 
 .html--pdp-breadcrumb {
-  background-color: green;
-}
+  margin: 0 40px;
 
+  @media screen and (min-width: 2500px) {
+    margin: 0 360px;
+  }
+}
diff --git a/styles/sass/pages/product/vtex.breadcrumb.scss b/styles/sass/pages/product/vtex.breadcrumb.scss
new file mode 100644
index 0000000..3447b2f
--- /dev/null
+++ b/styles/sass/pages/product/vtex.breadcrumb.scss
@@ -0,0 +1,24 @@
+.container {
+  margin: 0;
+
+  .link,
+  .term {
+    color: $gray-500;
+
+    font-style: normal;
+    font-weight: 400;
+    font-size: 14px;
+    line-height: 19px;
+  }
+
+  .homeLink {
+    &::before {
+      content: "Home";
+    }
+
+    .homeIcon {
+      display: none;
+    }
+  }
+}
+ 
\ No newline at end of file
diff --git a/styles/sass/pages/product/vtex.flex-layout.scss b/styles/sass/pages/product/vtex.flex-layout.scss
new file mode 100644
index 0000000..eafb088
--- /dev/null
+++ b/styles/sass/pages/product/vtex.flex-layout.scss
@@ -0,0 +1,3 @@
+// .flexRowContent {
+//   background-color: red;
+// }
diff --git a/styles/sass/pages/product/vtex.rich-text.scss b/styles/sass/pages/product/vtex.rich-text.scss
index e69de29..1719a4c 100644
--- a/styles/sass/pages/product/vtex.rich-text.scss
+++ b/styles/sass/pages/product/vtex.rich-text.scss
@@ -0,0 +1,3 @@
+// .paragraph--teste {
+//   background-color: red;
+// }
diff --git a/styles/sass/utils/_vars.scss b/styles/sass/utils/_vars.scss
index daf3adb..46395da 100644
--- a/styles/sass/utils/_vars.scss
+++ b/styles/sass/utils/_vars.scss
@@ -12,6 +12,8 @@ $color-blue: #4267b2;
 
 $color-green: #4caf50;
 
+$gray-500: #929292;
+
 /* Grid breakpoints */
 $grid-breakpoints: (
 	xs: 0,
@@ -19,7 +21,8 @@ $grid-breakpoints: (
 	sm: 576px,
 	md: 768px,
 	lg: 992px,
-	xl: 1200px
+	xl: 1200px,
+  ultrawide: 2499px
 ) !default;
 
 $z-index: (