diff --git a/.changeset/few-shoes-develop.md b/.changeset/few-shoes-develop.md
new file mode 100644
index 000000000..9cd3e4773
--- /dev/null
+++ b/.changeset/few-shoes-develop.md
@@ -0,0 +1,5 @@
+---
+'@primer/react-brand': patch
+---
+
+Increase space between river heading and description to 16px from 8px
diff --git a/.changeset/lovely-dryers-itch.md b/.changeset/lovely-dryers-itch.md
new file mode 100644
index 000000000..8a72f851c
--- /dev/null
+++ b/.changeset/lovely-dryers-itch.md
@@ -0,0 +1,5 @@
+---
+'@primer/react-brand': patch
+---
+
+Fixed a bug in `Hero` where an empty div with end-specific margin is erroneously defined for CTAs.
diff --git a/.changeset/tiny-seahorses-boil.md b/.changeset/tiny-seahorses-boil.md
new file mode 100644
index 000000000..16c69714d
--- /dev/null
+++ b/.changeset/tiny-seahorses-boil.md
@@ -0,0 +1,5 @@
+---
+'@primer/react-brand': patch
+---
+
+Update FormControl hasBorder color value to match control borders
diff --git a/.changeset/tough-planets-reply.md b/.changeset/tough-planets-reply.md
new file mode 100644
index 000000000..5da9c0c9c
--- /dev/null
+++ b/.changeset/tough-planets-reply.md
@@ -0,0 +1,12 @@
+---
+'@primer/react-brand': patch
+---
+
+Add `none` option to Box spacing props to reset defined paddings at larger viewports.
+
+```
+<Box padding={{
+    narrow: 24,
+    wide: 'none' // <-- this will remove padding at the wide viewport
+}} />
+```
diff --git a/package-lock.json b/package-lock.json
index 5ff3edb15..b0c51564f 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -45,7 +45,7 @@
     },
     "apps/storybook": {
       "name": "@primer/brand-storybook",
-      "version": "0.24.0",
+      "version": "0.25.0",
       "license": "MIT",
       "devDependencies": {
         "@babel/preset-env": "^7.22.0",
@@ -26787,7 +26787,7 @@
     },
     "packages/design-tokens": {
       "name": "@primer/brand-primitives",
-      "version": "0.24.0",
+      "version": "0.25.0",
       "license": "MIT",
       "devDependencies": {
         "@primer/primitives": "^7.11.10",
@@ -26801,7 +26801,7 @@
     },
     "packages/e2e": {
       "name": "@primer/brand-e2e",
-      "version": "0.24.0",
+      "version": "0.25.0",
       "license": "MIT",
       "devDependencies": {
         "@github/axe-github": "^0.5.0",
@@ -26815,7 +26815,7 @@
     },
     "packages/fonts": {
       "name": "@primer/brand-fonts",
-      "version": "0.24.0",
+      "version": "0.25.0",
       "license": "MIT",
       "engines": {
         "node": ">=16.0.0",
@@ -26824,7 +26824,7 @@
     },
     "packages/react": {
       "name": "@primer/react-brand",
-      "version": "0.24.0",
+      "version": "0.25.0",
       "license": "MIT",
       "dependencies": {
         "@primer/behaviors": "^1.3.4",
@@ -26872,7 +26872,7 @@
     },
     "packages/repo-configs": {
       "name": "@primer/brand-config",
-      "version": "0.24.0",
+      "version": "0.25.0",
       "license": "MIT"
     }
   },
diff --git a/packages/design-tokens/src/tokens/functional/components/river/base.json b/packages/design-tokens/src/tokens/functional/components/river/base.json
index ad78c9b57..2d52befc4 100644
--- a/packages/design-tokens/src/tokens/functional/components/river/base.json
+++ b/packages/design-tokens/src/tokens/functional/components/river/base.json
@@ -3,7 +3,7 @@
     "River": {
       "heading": {
         "margin": {
-          "value": "var(--base-size-8)"
+          "value": "var(--base-size-16)"
         }
       },
       "visual": {
diff --git a/packages/react/src/Bento/Bento.visual.spec.ts-snapshots/Visual-Comparison-Bento-Bento-Mixed-1-linux.png b/packages/react/src/Bento/Bento.visual.spec.ts-snapshots/Visual-Comparison-Bento-Bento-Mixed-1-linux.png
index a1c86fcae..d17647532 100644
Binary files a/packages/react/src/Bento/Bento.visual.spec.ts-snapshots/Visual-Comparison-Bento-Bento-Mixed-1-linux.png and b/packages/react/src/Bento/Bento.visual.spec.ts-snapshots/Visual-Comparison-Bento-Bento-Mixed-1-linux.png differ
diff --git a/packages/react/src/Bento/Bento.visual.spec.ts-snapshots/Visual-Comparison-Bento-Bento-Mixed-2-1-linux.png b/packages/react/src/Bento/Bento.visual.spec.ts-snapshots/Visual-Comparison-Bento-Bento-Mixed-2-1-linux.png
index 50ffdbcb8..b6c6236be 100644
Binary files a/packages/react/src/Bento/Bento.visual.spec.ts-snapshots/Visual-Comparison-Bento-Bento-Mixed-2-1-linux.png and b/packages/react/src/Bento/Bento.visual.spec.ts-snapshots/Visual-Comparison-Bento-Bento-Mixed-2-1-linux.png differ
diff --git a/packages/react/src/Box/Box.module.css b/packages/react/src/Box/Box.module.css
index d3c472ed6..c331a1f71 100644
--- a/packages/react/src/Box/Box.module.css
+++ b/packages/react/src/Box/Box.module.css
@@ -33,6 +33,11 @@
 .Box-padding--spacious {
   padding: var(--brand-box-spacing-spacious);
 }
+
+.Box-padding--none {
+  padding: 0;
+}
+
 .Box-padding--4 {
   padding: var(--base-size-4);
 }
@@ -93,6 +98,11 @@
 .Box-narrow-padding--spacious {
   padding: var(--brand-box-spacing-spacious);
 }
+
+.Box-narrow-padding--none {
+  padding: 0;
+}
+
 .Box-narrow-padding--4 {
   padding: var(--base-size-4);
 }
@@ -149,6 +159,10 @@
   .Box-regular-padding--spacious {
     padding: var(--brand-box-spacing-spacious);
   }
+
+  .Box-regular-padding--none {
+    padding: 0;
+  }
   .Box-regular-padding--4 {
     padding: var(--base-size-4);
   }
@@ -212,6 +226,10 @@
   .Box-wide-padding--spacious {
     padding: var(--brand-box-spacing-spacious);
   }
+
+  .Box-wide-padding--none {
+    padding: 0;
+  }
   .Box-wide-padding--4 {
     padding: var(--base-size-4);
   }
@@ -277,6 +295,10 @@
 .Box-paddingBlockStart--spacious {
   padding-block-start: var(--brand-box-spacing-spacious);
 }
+
+.Box-paddingBlockStart--none {
+  padding-block-start: 0;
+}
 .Box-paddingBlockStart--4 {
   padding-block-start: var(--base-size-4);
 }
@@ -338,6 +360,11 @@
 .Box-narrow-paddingBlockStart--spacious {
   padding-block-start: var(--brand-box-spacing-spacious);
 }
+
+.Box-narrow-paddingBlockStart--none {
+  padding-block-start: 0;
+}
+
 .Box-narrow-paddingBlockStart--4 {
   padding-block-start: var(--base-size-4);
 }
@@ -400,6 +427,10 @@
   .Box-regular-paddingBlockStart--spacious {
     padding-block-start: var(--brand-box-spacing-spacious);
   }
+
+  .Box-regular-paddingBlockStart--none {
+    padding-block-start: 0;
+  }
   .Box-regular-paddingBlockStart--4 {
     padding-block-start: var(--base-size-4);
   }
@@ -463,6 +494,10 @@
   .Box-wide-paddingBlockStart--spacious {
     padding-block-start: var(--brand-box-spacing-spacious);
   }
+
+  .Box-wide-paddingBlockStart--none {
+    padding-block-start: 0;
+  }
   .Box-wide-paddingBlockStart--4 {
     padding-block-start: var(--base-size-4);
   }
@@ -528,6 +563,10 @@
 .Box-paddingInlineEnd--spacious {
   padding-inline-end: var(--brand-box-spacing-spacious);
 }
+
+.Box-paddingInlineEnd--none {
+  padding-inline-end: 0;
+}
 .Box-paddingInlineEnd--4 {
   padding-inline-end: var(--base-size-4);
 }
@@ -589,6 +628,10 @@
 .Box-narrow-paddingInlineEnd--spacious {
   padding-inline-end: var(--brand-box-spacing-spacious);
 }
+
+.Box-narrow-paddingInlineEnd--none {
+  padding-inline-end: 0;
+}
 .Box-narrow-paddingInlineEnd--4 {
   padding-inline-end: var(--base-size-4);
 }
@@ -645,6 +688,10 @@
   .Box-regular-paddingInlineEnd--spacious {
     padding-inline-end: var(--brand-box-spacing-spacious);
   }
+
+  .Box-regular-paddingInlineEnd--none {
+    padding-inline-end: 0;
+  }
   .Box-regular-paddingInlineEnd--4 {
     padding-inline-end: var(--base-size-4);
   }
@@ -708,6 +755,10 @@
   .Box-wide-paddingInlineEnd--spacious {
     padding-inline-end: var(--brand-box-spacing-spacious);
   }
+
+  .Box-wide-paddingInlineEnd--none {
+    padding-inline-end: 0;
+  }
   .Box-wide-paddingInlineEnd--4 {
     padding-inline-end: var(--base-size-4);
   }
@@ -772,6 +823,10 @@
 .Box-paddingBlockEnd--spacious {
   padding-block-end: var(--brand-box-spacing-spacious);
 }
+
+.Box-paddingBlockEnd--none {
+  padding-block-end: 0;
+}
 .Box-paddingBlockEnd--4 {
   padding-block-end: var(--base-size-4);
 }
@@ -833,6 +888,10 @@
 .Box-narrow-paddingBlockEnd--spacious {
   padding-block-end: var(--brand-box-spacing-spacious);
 }
+
+.Box-narrow-paddingBlockEnd--none {
+  padding-block-end: 0;
+}
 .Box-narrow-paddingBlockEnd--4 {
   padding-block-end: var(--base-size-4);
 }
@@ -895,6 +954,10 @@
   .Box-regular-paddingBlockEnd--spacious {
     padding-block-end: var(--brand-box-spacing-spacious);
   }
+
+  .Box-regular-paddingBlockEnd--none {
+    padding-block-end: 0;
+  }
   .Box-regular-paddingBlockEnd--4 {
     padding-block-end: var(--base-size-4);
   }
@@ -958,6 +1021,10 @@
   .Box-wide-paddingBlockEnd--spacious {
     padding-block-end: var(--brand-box-spacing-spacious);
   }
+
+  .Box-wide-paddingBlockEnd--none {
+    padding-block-end: 0;
+  }
   .Box-wide-paddingBlockEnd--4 {
     padding-block-end: var(--base-size-4);
   }
@@ -1023,6 +1090,10 @@
 .Box-paddingInlineStart--spacious {
   padding-inline-start: var(--brand-box-spacing-spacious);
 }
+
+.Box-paddingInlineStart--none {
+  padding-inline-start: 0;
+}
 .Box-paddingInlineStart--4 {
   padding-inline-start: var(--base-size-4);
 }
@@ -1084,6 +1155,10 @@
 .Box-narrow-paddingInlineStart--spacious {
   padding-inline-start: var(--brand-box-spacing-spacious);
 }
+
+.Box-narrow-paddingInlineStart--none {
+  padding-inline-start: 0;
+}
 .Box-narrow-paddingInlineStart--4 {
   padding-inline-start: var(--base-size-4);
 }
@@ -1146,6 +1221,10 @@
   .Box-regular-paddingInlineStart--spacious {
     padding-inline-start: var(--brand-box-spacing-spacious);
   }
+
+  .Box-regular-paddingInlineStart--none {
+    padding-inline-start: 0;
+  }
   .Box-regular-paddingInlineStart--4 {
     padding-inline-start: var(--base-size-4);
   }
@@ -1209,6 +1288,10 @@
   .Box-wide-paddingInlineStart--spacious {
     padding-inline-start: var(--brand-box-spacing-spacious);
   }
+
+  .Box-wide-paddingInlineStart--none {
+    padding-inline-start: 0;
+  }
   .Box-wide-paddingInlineStart--4 {
     padding-inline-start: var(--base-size-4);
   }
@@ -1274,6 +1357,10 @@
 .Box-margin--spacious {
   margin: var(--brand-box-spacing-spacious);
 }
+
+.Box-margin--none {
+  margin: 0;
+}
 .Box-margin--4 {
   margin: var(--base-size-4);
 }
@@ -1334,6 +1421,10 @@
 .Box-narrow-margin--spacious {
   margin: var(--brand-box-spacing-spacious);
 }
+
+.Box-narrow-margin--none {
+  margin: 0;
+}
 .Box-narrow-margin--4 {
   margin: var(--base-size-4);
 }
@@ -1396,6 +1487,10 @@
   .Box-regular-margin--spacious {
     margin: var(--brand-box-spacing-spacious);
   }
+
+  .Box-regular-margin--none {
+    margin: 0;
+  }
   .Box-regular-margin--4 {
     margin: var(--base-size-4);
   }
@@ -1459,6 +1554,10 @@
   .Box-wide-margin--spacious {
     margin: var(--brand-box-spacing-spacious);
   }
+
+  .Box-wide-margin--none {
+    margin: 0;
+  }
   .Box-wide-margin--4 {
     margin: var(--base-size-4);
   }
@@ -1521,6 +1620,10 @@
 .Box-marginBlockStart--spacious {
   margin-block-start: var(--brand-box-spacing-spacious);
 }
+
+.Box-marginBlockStart--none {
+  margin-block-start: 0;
+}
 .Box-marginBlockStart--4 {
   margin-block-start: var(--base-size-4);
 }
@@ -1582,6 +1685,10 @@
 .Box-narrow-marginBlockStart--spacious {
   margin-block-start: var(--brand-box-spacing-spacious);
 }
+
+.Box-narrow-marginBlockStart--none {
+  margin-block-start: 0;
+}
 .Box-narrow-marginBlockStart--4 {
   margin-block-start: var(--base-size-4);
 }
@@ -1644,6 +1751,10 @@
   .Box-regular-marginBlockStart--spacious {
     margin-block-start: var(--brand-box-spacing-spacious);
   }
+
+  .Box-regular-marginBlockStart--none {
+    margin-block-start: 0;
+  }
   .Box-regular-marginBlockStart--4 {
     margin-block-start: var(--base-size-4);
   }
@@ -1707,6 +1818,10 @@
   .Box-wide-marginBlockStart--spacious {
     margin-block-start: var(--brand-box-spacing-spacious);
   }
+
+  .Box-wide-marginBlockStart--none {
+    margin-block-start: 0;
+  }
   .Box-wide-marginBlockStart--4 {
     margin-block-start: var(--base-size-4);
   }
@@ -1772,6 +1887,10 @@
 .Box-marginInlineEnd--spacious {
   margin-inline-end: var(--brand-box-spacing-spacious);
 }
+
+.Box-marginInlineEnd--none {
+  margin-inline-end: 0;
+}
 .Box-marginInlineEnd--4 {
   margin-inline-end: var(--base-size-4);
 }
@@ -1833,6 +1952,10 @@
 .Box-narrow-marginInlineEnd--spacious {
   margin-inline-end: var(--brand-box-spacing-spacious);
 }
+
+.Box-narrow-marginInlineEnd--none {
+  margin-inline-end: 0;
+}
 .Box-narrow-marginInlineEnd--4 {
   margin-inline-end: var(--base-size-4);
 }
@@ -1889,6 +2012,10 @@
   .Box-regular-marginInlineEnd--spacious {
     margin-inline-end: var(--brand-box-spacing-spacious);
   }
+
+  .Box-regular-marginInlineEnd--none {
+    margin-inline-end: 0;
+  }
   .Box-regular-marginInlineEnd--4 {
     margin-inline-end: var(--base-size-4);
   }
@@ -1946,6 +2073,10 @@
   .Box-wide-marginInlineEnd--spacious {
     margin-inline-end: var(--brand-box-spacing-spacious);
   }
+
+  .Box-wide-marginInlineEnd--none {
+    margin-inline-end: 0;
+  }
   .Box-wide-marginInlineEnd--4 {
     margin-inline-end: var(--base-size-4);
   }
@@ -2004,6 +2135,10 @@
 .Box-marginBlockEnd--spacious {
   margin-block-end: var(--brand-box-spacing-spacious);
 }
+
+.Box-marginBlockEnd--none {
+  margin-block-end: 0;
+}
 .Box-marginBlockEnd--4 {
   margin-block-end: var(--base-size-4);
 }
@@ -2065,6 +2200,10 @@
 .Box-narrow-marginBlockEnd--spacious {
   margin-block-end: var(--brand-box-spacing-spacious);
 }
+
+.Box-narrow-marginBlockEnd--none {
+  margin-block-end: 0;
+}
 .Box-narrow-marginBlockEnd--4 {
   margin-block-end: var(--base-size-4);
 }
@@ -2121,6 +2260,10 @@
   .Box-regular-marginBlockEnd--spacious {
     margin-block-end: var(--brand-box-spacing-spacious);
   }
+
+  .Box-regular-marginBlockEnd--none {
+    margin-block-end: 0;
+  }
   .Box-regular-marginBlockEnd--4 {
     margin-block-end: var(--base-size-4);
   }
@@ -2184,6 +2327,10 @@
   .Box-wide-marginBlockEnd--spacious {
     margin-block-end: var(--brand-box-spacing-spacious);
   }
+
+  .Box-wide-marginBlockEnd--none {
+    margin-block-end: 0;
+  }
   .Box-wide-marginBlockEnd--4 {
     margin-block-end: var(--base-size-4);
   }
@@ -2249,6 +2396,10 @@
 .Box-marginInlineStart--spacious {
   margin-inline-start: var(--brand-box-spacing-spacious);
 }
+
+.Box-marginInlineStart--none {
+  margin-inline-start: 0;
+}
 .Box-marginInlineStart--4 {
   margin-inline-start: var(--base-size-4);
 }
@@ -2310,6 +2461,10 @@
 .Box-narrow-marginInlineStart--spacious {
   margin-inline-start: var(--brand-box-spacing-spacious);
 }
+
+.Box-narrow-marginInlineStart--none {
+  margin-inline-start: 0;
+}
 .Box-narrow-marginInlineStart--4 {
   margin-inline-start: var(--base-size-4);
 }
@@ -2372,6 +2527,10 @@
   .Box-regular-marginInlineStart--spacious {
     margin-inline-start: var(--brand-box-spacing-spacious);
   }
+
+  .Box-regular-marginInlineStart--none {
+    margin-inline-start: 0;
+  }
   .Box-regular-marginInlineStart--4 {
     margin-inline-start: var(--base-size-4);
   }
@@ -2435,6 +2594,10 @@
   .Box-wide-marginInlineStart--spacious {
     margin-inline-start: var(--brand-box-spacing-spacious);
   }
+
+  .Box-wide-marginInlineStart--none {
+    margin-inline-start: 0;
+  }
   .Box-wide-marginInlineStart--4 {
     margin-inline-start: var(--base-size-4);
   }
diff --git a/packages/react/src/Box/Box.module.css.d.ts b/packages/react/src/Box/Box.module.css.d.ts
index 48a409073..0188e7f91 100644
--- a/packages/react/src/Box/Box.module.css.d.ts
+++ b/packages/react/src/Box/Box.module.css.d.ts
@@ -2,6 +2,7 @@ declare const styles: {
   readonly "Box-padding--condensed": string;
   readonly "Box-padding--normal": string;
   readonly "Box-padding--spacious": string;
+  readonly "Box-padding--none": string;
   readonly "Box-padding--4": string;
   readonly "Box-padding--8": string;
   readonly "Box-padding--12": string;
@@ -22,6 +23,7 @@ declare const styles: {
   readonly "Box-narrow-padding--condensed": string;
   readonly "Box-narrow-padding--normal": string;
   readonly "Box-narrow-padding--spacious": string;
+  readonly "Box-narrow-padding--none": string;
   readonly "Box-narrow-padding--4": string;
   readonly "Box-narrow-padding--8": string;
   readonly "Box-narrow-padding--12": string;
@@ -40,6 +42,7 @@ declare const styles: {
   readonly "Box-regular-padding--condensed": string;
   readonly "Box-regular-padding--normal": string;
   readonly "Box-regular-padding--spacious": string;
+  readonly "Box-regular-padding--none": string;
   readonly "Box-regular-padding--4": string;
   readonly "Box-regular-padding--8": string;
   readonly "Box-regular-padding--12": string;
@@ -60,6 +63,7 @@ declare const styles: {
   readonly "Box-wide-padding--condensed": string;
   readonly "Box-wide-padding--normal": string;
   readonly "Box-wide-padding--spacious": string;
+  readonly "Box-wide-padding--none": string;
   readonly "Box-wide-padding--4": string;
   readonly "Box-wide-padding--8": string;
   readonly "Box-wide-padding--12": string;
@@ -80,6 +84,7 @@ declare const styles: {
   readonly "Box-paddingBlockStart--condensed": string;
   readonly "Box-paddingBlockStart--normal": string;
   readonly "Box-paddingBlockStart--spacious": string;
+  readonly "Box-paddingBlockStart--none": string;
   readonly "Box-paddingBlockStart--4": string;
   readonly "Box-paddingBlockStart--8": string;
   readonly "Box-paddingBlockStart--12": string;
@@ -100,6 +105,7 @@ declare const styles: {
   readonly "Box-narrow-paddingBlockStart--condensed": string;
   readonly "Box-narrow-paddingBlockStart--normal": string;
   readonly "Box-narrow-paddingBlockStart--spacious": string;
+  readonly "Box-narrow-paddingBlockStart--none": string;
   readonly "Box-narrow-paddingBlockStart--4": string;
   readonly "Box-narrow-paddingBlockStart--8": string;
   readonly "Box-narrow-paddingBlockStart--12": string;
@@ -120,6 +126,7 @@ declare const styles: {
   readonly "Box-regular-paddingBlockStart--condensed": string;
   readonly "Box-regular-paddingBlockStart--normal": string;
   readonly "Box-regular-paddingBlockStart--spacious": string;
+  readonly "Box-regular-paddingBlockStart--none": string;
   readonly "Box-regular-paddingBlockStart--4": string;
   readonly "Box-regular-paddingBlockStart--8": string;
   readonly "Box-regular-paddingBlockStart--12": string;
@@ -140,6 +147,7 @@ declare const styles: {
   readonly "Box-wide-paddingBlockStart--condensed": string;
   readonly "Box-wide-paddingBlockStart--normal": string;
   readonly "Box-wide-paddingBlockStart--spacious": string;
+  readonly "Box-wide-paddingBlockStart--none": string;
   readonly "Box-wide-paddingBlockStart--4": string;
   readonly "Box-wide-paddingBlockStart--8": string;
   readonly "Box-wide-paddingBlockStart--12": string;
@@ -160,6 +168,7 @@ declare const styles: {
   readonly "Box-paddingInlineEnd--condensed": string;
   readonly "Box-paddingInlineEnd--normal": string;
   readonly "Box-paddingInlineEnd--spacious": string;
+  readonly "Box-paddingInlineEnd--none": string;
   readonly "Box-paddingInlineEnd--4": string;
   readonly "Box-paddingInlineEnd--8": string;
   readonly "Box-paddingInlineEnd--12": string;
@@ -180,6 +189,7 @@ declare const styles: {
   readonly "Box-narrow-paddingInlineEnd--condensed": string;
   readonly "Box-narrow-paddingInlineEnd--normal": string;
   readonly "Box-narrow-paddingInlineEnd--spacious": string;
+  readonly "Box-narrow-paddingInlineEnd--none": string;
   readonly "Box-narrow-paddingInlineEnd--4": string;
   readonly "Box-narrow-paddingInlineEnd--8": string;
   readonly "Box-narrow-paddingInlineEnd--12": string;
@@ -198,6 +208,7 @@ declare const styles: {
   readonly "Box-regular-paddingInlineEnd--condensed": string;
   readonly "Box-regular-paddingInlineEnd--normal": string;
   readonly "Box-regular-paddingInlineEnd--spacious": string;
+  readonly "Box-regular-paddingInlineEnd--none": string;
   readonly "Box-regular-paddingInlineEnd--4": string;
   readonly "Box-regular-paddingInlineEnd--8": string;
   readonly "Box-regular-paddingInlineEnd--12": string;
@@ -218,6 +229,7 @@ declare const styles: {
   readonly "Box-wide-paddingInlineEnd--condensed": string;
   readonly "Box-wide-paddingInlineEnd--normal": string;
   readonly "Box-wide-paddingInlineEnd--spacious": string;
+  readonly "Box-wide-paddingInlineEnd--none": string;
   readonly "Box-wide-paddingInlineEnd--4": string;
   readonly "Box-wide-paddingInlineEnd--8": string;
   readonly "Box-wide-paddingInlineEnd--12": string;
@@ -238,6 +250,7 @@ declare const styles: {
   readonly "Box-paddingBlockEnd--condensed": string;
   readonly "Box-paddingBlockEnd--normal": string;
   readonly "Box-paddingBlockEnd--spacious": string;
+  readonly "Box-paddingBlockEnd--none": string;
   readonly "Box-paddingBlockEnd--4": string;
   readonly "Box-paddingBlockEnd--8": string;
   readonly "Box-paddingBlockEnd--12": string;
@@ -258,6 +271,7 @@ declare const styles: {
   readonly "Box-narrow-paddingBlockEnd--condensed": string;
   readonly "Box-narrow-paddingBlockEnd--normal": string;
   readonly "Box-narrow-paddingBlockEnd--spacious": string;
+  readonly "Box-narrow-paddingBlockEnd--none": string;
   readonly "Box-narrow-paddingBlockEnd--4": string;
   readonly "Box-narrow-paddingBlockEnd--8": string;
   readonly "Box-narrow-paddingBlockEnd--12": string;
@@ -278,6 +292,7 @@ declare const styles: {
   readonly "Box-regular-paddingBlockEnd--condensed": string;
   readonly "Box-regular-paddingBlockEnd--normal": string;
   readonly "Box-regular-paddingBlockEnd--spacious": string;
+  readonly "Box-regular-paddingBlockEnd--none": string;
   readonly "Box-regular-paddingBlockEnd--4": string;
   readonly "Box-regular-paddingBlockEnd--8": string;
   readonly "Box-regular-paddingBlockEnd--12": string;
@@ -298,6 +313,7 @@ declare const styles: {
   readonly "Box-wide-paddingBlockEnd--condensed": string;
   readonly "Box-wide-paddingBlockEnd--normal": string;
   readonly "Box-wide-paddingBlockEnd--spacious": string;
+  readonly "Box-wide-paddingBlockEnd--none": string;
   readonly "Box-wide-paddingBlockEnd--4": string;
   readonly "Box-wide-paddingBlockEnd--8": string;
   readonly "Box-wide-paddingBlockEnd--12": string;
@@ -318,6 +334,7 @@ declare const styles: {
   readonly "Box-paddingInlineStart--condensed": string;
   readonly "Box-paddingInlineStart--normal": string;
   readonly "Box-paddingInlineStart--spacious": string;
+  readonly "Box-paddingInlineStart--none": string;
   readonly "Box-paddingInlineStart--4": string;
   readonly "Box-paddingInlineStart--8": string;
   readonly "Box-paddingInlineStart--12": string;
@@ -338,6 +355,7 @@ declare const styles: {
   readonly "Box-narrow-paddingInlineStart--condensed": string;
   readonly "Box-narrow-paddingInlineStart--normal": string;
   readonly "Box-narrow-paddingInlineStart--spacious": string;
+  readonly "Box-narrow-paddingInlineStart--none": string;
   readonly "Box-narrow-paddingInlineStart--4": string;
   readonly "Box-narrow-paddingInlineStart--8": string;
   readonly "Box-narrow-paddingInlineStart--12": string;
@@ -358,6 +376,7 @@ declare const styles: {
   readonly "Box-regular-paddingInlineStart--condensed": string;
   readonly "Box-regular-paddingInlineStart--normal": string;
   readonly "Box-regular-paddingInlineStart--spacious": string;
+  readonly "Box-regular-paddingInlineStart--none": string;
   readonly "Box-regular-paddingInlineStart--4": string;
   readonly "Box-regular-paddingInlineStart--8": string;
   readonly "Box-regular-paddingInlineStart--12": string;
@@ -378,6 +397,7 @@ declare const styles: {
   readonly "Box-wide-paddingInlineStart--condensed": string;
   readonly "Box-wide-paddingInlineStart--normal": string;
   readonly "Box-wide-paddingInlineStart--spacious": string;
+  readonly "Box-wide-paddingInlineStart--none": string;
   readonly "Box-wide-paddingInlineStart--4": string;
   readonly "Box-wide-paddingInlineStart--8": string;
   readonly "Box-wide-paddingInlineStart--12": string;
@@ -398,6 +418,7 @@ declare const styles: {
   readonly "Box-margin--condensed": string;
   readonly "Box-margin--normal": string;
   readonly "Box-margin--spacious": string;
+  readonly "Box-margin--none": string;
   readonly "Box-margin--4": string;
   readonly "Box-margin--8": string;
   readonly "Box-margin--12": string;
@@ -418,6 +439,7 @@ declare const styles: {
   readonly "Box-narrow-margin--condensed": string;
   readonly "Box-narrow-margin--normal": string;
   readonly "Box-narrow-margin--spacious": string;
+  readonly "Box-narrow-margin--none": string;
   readonly "Box-narrow-margin--4": string;
   readonly "Box-narrow-margin--8": string;
   readonly "Box-narrow-margin--12": string;
@@ -438,6 +460,7 @@ declare const styles: {
   readonly "Box-regular-margin--condensed": string;
   readonly "Box-regular-margin--normal": string;
   readonly "Box-regular-margin--spacious": string;
+  readonly "Box-regular-margin--none": string;
   readonly "Box-regular-margin--4": string;
   readonly "Box-regular-margin--8": string;
   readonly "Box-regular-margin--12": string;
@@ -458,6 +481,7 @@ declare const styles: {
   readonly "Box-wide-margin--condensed": string;
   readonly "Box-wide-margin--normal": string;
   readonly "Box-wide-margin--spacious": string;
+  readonly "Box-wide-margin--none": string;
   readonly "Box-wide-margin--4": string;
   readonly "Box-wide-margin--8": string;
   readonly "Box-wide-margin--12": string;
@@ -477,6 +501,7 @@ declare const styles: {
   readonly "Box-marginBlockStart--condensed": string;
   readonly "Box-marginBlockStart--normal": string;
   readonly "Box-marginBlockStart--spacious": string;
+  readonly "Box-marginBlockStart--none": string;
   readonly "Box-marginBlockStart--4": string;
   readonly "Box-marginBlockStart--8": string;
   readonly "Box-marginBlockStart--12": string;
@@ -497,6 +522,7 @@ declare const styles: {
   readonly "Box-narrow-marginBlockStart--condensed": string;
   readonly "Box-narrow-marginBlockStart--normal": string;
   readonly "Box-narrow-marginBlockStart--spacious": string;
+  readonly "Box-narrow-marginBlockStart--none": string;
   readonly "Box-narrow-marginBlockStart--4": string;
   readonly "Box-narrow-marginBlockStart--8": string;
   readonly "Box-narrow-marginBlockStart--12": string;
@@ -517,6 +543,7 @@ declare const styles: {
   readonly "Box-regular-marginBlockStart--condensed": string;
   readonly "Box-regular-marginBlockStart--normal": string;
   readonly "Box-regular-marginBlockStart--spacious": string;
+  readonly "Box-regular-marginBlockStart--none": string;
   readonly "Box-regular-marginBlockStart--4": string;
   readonly "Box-regular-marginBlockStart--8": string;
   readonly "Box-regular-marginBlockStart--12": string;
@@ -537,6 +564,7 @@ declare const styles: {
   readonly "Box-wide-marginBlockStart--condensed": string;
   readonly "Box-wide-marginBlockStart--normal": string;
   readonly "Box-wide-marginBlockStart--spacious": string;
+  readonly "Box-wide-marginBlockStart--none": string;
   readonly "Box-wide-marginBlockStart--4": string;
   readonly "Box-wide-marginBlockStart--8": string;
   readonly "Box-wide-marginBlockStart--12": string;
@@ -557,6 +585,7 @@ declare const styles: {
   readonly "Box-marginInlineEnd--condensed": string;
   readonly "Box-marginInlineEnd--normal": string;
   readonly "Box-marginInlineEnd--spacious": string;
+  readonly "Box-marginInlineEnd--none": string;
   readonly "Box-marginInlineEnd--4": string;
   readonly "Box-marginInlineEnd--8": string;
   readonly "Box-marginInlineEnd--12": string;
@@ -577,6 +606,7 @@ declare const styles: {
   readonly "Box-narrow-marginInlineEnd--condensed": string;
   readonly "Box-narrow-marginInlineEnd--normal": string;
   readonly "Box-narrow-marginInlineEnd--spacious": string;
+  readonly "Box-narrow-marginInlineEnd--none": string;
   readonly "Box-narrow-marginInlineEnd--4": string;
   readonly "Box-narrow-marginInlineEnd--8": string;
   readonly "Box-narrow-marginInlineEnd--12": string;
@@ -595,6 +625,7 @@ declare const styles: {
   readonly "Box-regular-marginInlineEnd--condensed": string;
   readonly "Box-regular-marginInlineEnd--normal": string;
   readonly "Box-regular-marginInlineEnd--spacious": string;
+  readonly "Box-regular-marginInlineEnd--none": string;
   readonly "Box-regular-marginInlineEnd--4": string;
   readonly "Box-regular-marginInlineEnd--8": string;
   readonly "Box-regular-marginInlineEnd--12": string;
@@ -613,6 +644,7 @@ declare const styles: {
   readonly "Box-wide-marginInlineEnd--condensed": string;
   readonly "Box-wide-marginInlineEnd--normal": string;
   readonly "Box-wide-marginInlineEnd--spacious": string;
+  readonly "Box-wide-marginInlineEnd--none": string;
   readonly "Box-wide-marginInlineEnd--4": string;
   readonly "Box-wide-marginInlineEnd--8": string;
   readonly "Box-wide-marginInlineEnd--12": string;
@@ -631,6 +663,7 @@ declare const styles: {
   readonly "Box-marginBlockEnd--condensed": string;
   readonly "Box-marginBlockEnd--normal": string;
   readonly "Box-marginBlockEnd--spacious": string;
+  readonly "Box-marginBlockEnd--none": string;
   readonly "Box-marginBlockEnd--4": string;
   readonly "Box-marginBlockEnd--8": string;
   readonly "Box-marginBlockEnd--12": string;
@@ -651,6 +684,7 @@ declare const styles: {
   readonly "Box-narrow-marginBlockEnd--condensed": string;
   readonly "Box-narrow-marginBlockEnd--normal": string;
   readonly "Box-narrow-marginBlockEnd--spacious": string;
+  readonly "Box-narrow-marginBlockEnd--none": string;
   readonly "Box-narrow-marginBlockEnd--4": string;
   readonly "Box-narrow-marginBlockEnd--8": string;
   readonly "Box-narrow-marginBlockEnd--12": string;
@@ -669,6 +703,7 @@ declare const styles: {
   readonly "Box-regular-marginBlockEnd--condensed": string;
   readonly "Box-regular-marginBlockEnd--normal": string;
   readonly "Box-regular-marginBlockEnd--spacious": string;
+  readonly "Box-regular-marginBlockEnd--none": string;
   readonly "Box-regular-marginBlockEnd--4": string;
   readonly "Box-regular-marginBlockEnd--8": string;
   readonly "Box-regular-marginBlockEnd--12": string;
@@ -689,6 +724,7 @@ declare const styles: {
   readonly "Box-wide-marginBlockEnd--condensed": string;
   readonly "Box-wide-marginBlockEnd--normal": string;
   readonly "Box-wide-marginBlockEnd--spacious": string;
+  readonly "Box-wide-marginBlockEnd--none": string;
   readonly "Box-wide-marginBlockEnd--4": string;
   readonly "Box-wide-marginBlockEnd--8": string;
   readonly "Box-wide-marginBlockEnd--12": string;
@@ -709,6 +745,7 @@ declare const styles: {
   readonly "Box-marginInlineStart--condensed": string;
   readonly "Box-marginInlineStart--normal": string;
   readonly "Box-marginInlineStart--spacious": string;
+  readonly "Box-marginInlineStart--none": string;
   readonly "Box-marginInlineStart--4": string;
   readonly "Box-marginInlineStart--8": string;
   readonly "Box-marginInlineStart--12": string;
@@ -729,6 +766,7 @@ declare const styles: {
   readonly "Box-narrow-marginInlineStart--condensed": string;
   readonly "Box-narrow-marginInlineStart--normal": string;
   readonly "Box-narrow-marginInlineStart--spacious": string;
+  readonly "Box-narrow-marginInlineStart--none": string;
   readonly "Box-narrow-marginInlineStart--4": string;
   readonly "Box-narrow-marginInlineStart--8": string;
   readonly "Box-narrow-marginInlineStart--12": string;
@@ -749,6 +787,7 @@ declare const styles: {
   readonly "Box-regular-marginInlineStart--condensed": string;
   readonly "Box-regular-marginInlineStart--normal": string;
   readonly "Box-regular-marginInlineStart--spacious": string;
+  readonly "Box-regular-marginInlineStart--none": string;
   readonly "Box-regular-marginInlineStart--4": string;
   readonly "Box-regular-marginInlineStart--8": string;
   readonly "Box-regular-marginInlineStart--12": string;
@@ -769,6 +808,7 @@ declare const styles: {
   readonly "Box-wide-marginInlineStart--condensed": string;
   readonly "Box-wide-marginInlineStart--normal": string;
   readonly "Box-wide-marginInlineStart--spacious": string;
+  readonly "Box-wide-marginInlineStart--none": string;
   readonly "Box-wide-marginInlineStart--4": string;
   readonly "Box-wide-marginInlineStart--8": string;
   readonly "Box-wide-marginInlineStart--12": string;
diff --git a/packages/react/src/Box/Box.tsx b/packages/react/src/Box/Box.tsx
index 32ad96003..2d1420d50 100644
--- a/packages/react/src/Box/Box.tsx
+++ b/packages/react/src/Box/Box.tsx
@@ -7,7 +7,7 @@ import {BaseSizeScale} from '../constants'
 /** * Main Stylesheet (as a CSS Module) */
 import styles from './Box.module.css'
 
-export const BoxSpacingValues = ['condensed', 'normal', 'spacious', ...BaseSizeScale] as const
+export const BoxSpacingValues = ['none', 'condensed', 'normal', 'spacious', ...BaseSizeScale] as const
 type SpacingValues = (typeof BoxSpacingValues)[number]
 
 type ResponsiveSpacingMap = {
diff --git a/packages/react/src/Box/Box.visual.spec.ts-snapshots/Visual-Comparison-Box-Box-Directional-Margin-Block-end-bottom-1-linux.png b/packages/react/src/Box/Box.visual.spec.ts-snapshots/Visual-Comparison-Box-Box-Directional-Margin-Block-end-bottom-1-linux.png
index 1aaa76a29..4aad2babc 100644
Binary files a/packages/react/src/Box/Box.visual.spec.ts-snapshots/Visual-Comparison-Box-Box-Directional-Margin-Block-end-bottom-1-linux.png and b/packages/react/src/Box/Box.visual.spec.ts-snapshots/Visual-Comparison-Box-Box-Directional-Margin-Block-end-bottom-1-linux.png differ
diff --git a/packages/react/src/Box/Box.visual.spec.ts-snapshots/Visual-Comparison-Box-Box-Directional-Margin-Block-start-top-1-linux.png b/packages/react/src/Box/Box.visual.spec.ts-snapshots/Visual-Comparison-Box-Box-Directional-Margin-Block-start-top-1-linux.png
index 0c2e84e77..2a3ba190b 100644
Binary files a/packages/react/src/Box/Box.visual.spec.ts-snapshots/Visual-Comparison-Box-Box-Directional-Margin-Block-start-top-1-linux.png and b/packages/react/src/Box/Box.visual.spec.ts-snapshots/Visual-Comparison-Box-Box-Directional-Margin-Block-start-top-1-linux.png differ
diff --git a/packages/react/src/Box/Box.visual.spec.ts-snapshots/Visual-Comparison-Box-Box-Directional-Margin-Inline-end-right-1-linux.png b/packages/react/src/Box/Box.visual.spec.ts-snapshots/Visual-Comparison-Box-Box-Directional-Margin-Inline-end-right-1-linux.png
index ac70e67bb..ace3e03b5 100644
Binary files a/packages/react/src/Box/Box.visual.spec.ts-snapshots/Visual-Comparison-Box-Box-Directional-Margin-Inline-end-right-1-linux.png and b/packages/react/src/Box/Box.visual.spec.ts-snapshots/Visual-Comparison-Box-Box-Directional-Margin-Inline-end-right-1-linux.png differ
diff --git a/packages/react/src/Box/Box.visual.spec.ts-snapshots/Visual-Comparison-Box-Box-Directional-Margin-Inline-start-left-1-linux.png b/packages/react/src/Box/Box.visual.spec.ts-snapshots/Visual-Comparison-Box-Box-Directional-Margin-Inline-start-left-1-linux.png
index b3ed5e0f7..b596a1481 100644
Binary files a/packages/react/src/Box/Box.visual.spec.ts-snapshots/Visual-Comparison-Box-Box-Directional-Margin-Inline-start-left-1-linux.png and b/packages/react/src/Box/Box.visual.spec.ts-snapshots/Visual-Comparison-Box-Box-Directional-Margin-Inline-start-left-1-linux.png differ
diff --git a/packages/react/src/Box/Box.visual.spec.ts-snapshots/Visual-Comparison-Box-Box-Directional-Padding-Block-end-bottom-1-linux.png b/packages/react/src/Box/Box.visual.spec.ts-snapshots/Visual-Comparison-Box-Box-Directional-Padding-Block-end-bottom-1-linux.png
index b3d7242c9..a2c7ca2a2 100644
Binary files a/packages/react/src/Box/Box.visual.spec.ts-snapshots/Visual-Comparison-Box-Box-Directional-Padding-Block-end-bottom-1-linux.png and b/packages/react/src/Box/Box.visual.spec.ts-snapshots/Visual-Comparison-Box-Box-Directional-Padding-Block-end-bottom-1-linux.png differ
diff --git a/packages/react/src/Box/Box.visual.spec.ts-snapshots/Visual-Comparison-Box-Box-Directional-Padding-Block-start-top-1-linux.png b/packages/react/src/Box/Box.visual.spec.ts-snapshots/Visual-Comparison-Box-Box-Directional-Padding-Block-start-top-1-linux.png
index be7c657ba..59d407aef 100644
Binary files a/packages/react/src/Box/Box.visual.spec.ts-snapshots/Visual-Comparison-Box-Box-Directional-Padding-Block-start-top-1-linux.png and b/packages/react/src/Box/Box.visual.spec.ts-snapshots/Visual-Comparison-Box-Box-Directional-Padding-Block-start-top-1-linux.png differ
diff --git a/packages/react/src/Box/Box.visual.spec.ts-snapshots/Visual-Comparison-Box-Box-Directional-Padding-Inline-end-right-1-linux.png b/packages/react/src/Box/Box.visual.spec.ts-snapshots/Visual-Comparison-Box-Box-Directional-Padding-Inline-end-right-1-linux.png
index 98435371b..087c8b35b 100644
Binary files a/packages/react/src/Box/Box.visual.spec.ts-snapshots/Visual-Comparison-Box-Box-Directional-Padding-Inline-end-right-1-linux.png and b/packages/react/src/Box/Box.visual.spec.ts-snapshots/Visual-Comparison-Box-Box-Directional-Padding-Inline-end-right-1-linux.png differ
diff --git a/packages/react/src/Box/Box.visual.spec.ts-snapshots/Visual-Comparison-Box-Box-Directional-Padding-Inline-start-left-1-linux.png b/packages/react/src/Box/Box.visual.spec.ts-snapshots/Visual-Comparison-Box-Box-Directional-Padding-Inline-start-left-1-linux.png
index 77b01a184..6a3a12f67 100644
Binary files a/packages/react/src/Box/Box.visual.spec.ts-snapshots/Visual-Comparison-Box-Box-Directional-Padding-Inline-start-left-1-linux.png and b/packages/react/src/Box/Box.visual.spec.ts-snapshots/Visual-Comparison-Box-Box-Directional-Padding-Inline-start-left-1-linux.png differ
diff --git a/packages/react/src/Box/Box.visual.spec.ts-snapshots/Visual-Comparison-Box-Box-Margin-1-linux.png b/packages/react/src/Box/Box.visual.spec.ts-snapshots/Visual-Comparison-Box-Box-Margin-1-linux.png
index 4934ce928..29f620265 100644
Binary files a/packages/react/src/Box/Box.visual.spec.ts-snapshots/Visual-Comparison-Box-Box-Margin-1-linux.png and b/packages/react/src/Box/Box.visual.spec.ts-snapshots/Visual-Comparison-Box-Box-Margin-1-linux.png differ
diff --git a/packages/react/src/Box/Box.visual.spec.ts-snapshots/Visual-Comparison-Box-Box-Padding-1-linux.png b/packages/react/src/Box/Box.visual.spec.ts-snapshots/Visual-Comparison-Box-Box-Padding-1-linux.png
index 707856495..280467fb0 100644
Binary files a/packages/react/src/Box/Box.visual.spec.ts-snapshots/Visual-Comparison-Box-Box-Padding-1-linux.png and b/packages/react/src/Box/Box.visual.spec.ts-snapshots/Visual-Comparison-Box-Box-Padding-1-linux.png differ
diff --git a/packages/react/src/FAQ/FAQ.visual.spec.ts-snapshots/Visual-Comparison-FAQ-FAQ-Groups-1-linux.png b/packages/react/src/FAQ/FAQ.visual.spec.ts-snapshots/Visual-Comparison-FAQ-FAQ-Groups-1-linux.png
index dcbec58e5..93ef9cc88 100644
Binary files a/packages/react/src/FAQ/FAQ.visual.spec.ts-snapshots/Visual-Comparison-FAQ-FAQ-Groups-1-linux.png and b/packages/react/src/FAQ/FAQ.visual.spec.ts-snapshots/Visual-Comparison-FAQ-FAQ-Groups-1-linux.png differ
diff --git a/packages/react/src/FAQ/FAQ.visual.spec.ts-snapshots/Visual-Comparison-FAQ-Mobile-viewport-test-fo-8d50b-iew-mobile-FAQ-Group-narrow-view-mobile-1-linux.png b/packages/react/src/FAQ/FAQ.visual.spec.ts-snapshots/Visual-Comparison-FAQ-Mobile-viewport-test-fo-8d50b-iew-mobile-FAQ-Group-narrow-view-mobile-1-linux.png
index daccb5cb9..dbb6a0285 100644
Binary files a/packages/react/src/FAQ/FAQ.visual.spec.ts-snapshots/Visual-Comparison-FAQ-Mobile-viewport-test-fo-8d50b-iew-mobile-FAQ-Group-narrow-view-mobile-1-linux.png and b/packages/react/src/FAQ/FAQ.visual.spec.ts-snapshots/Visual-Comparison-FAQ-Mobile-viewport-test-fo-8d50b-iew-mobile-FAQ-Group-narrow-view-mobile-1-linux.png differ
diff --git a/packages/react/src/FAQ/FAQGroup.module.css b/packages/react/src/FAQ/FAQGroup.module.css
index 8a39f7930..efb09060c 100644
--- a/packages/react/src/FAQ/FAQGroup.module.css
+++ b/packages/react/src/FAQ/FAQGroup.module.css
@@ -14,10 +14,6 @@
   }
 }
 
-.FAQ__subheading {
-  margin-block-end: var(--base-size-16);
-}
-
 .FAQGroup__panel-subHeading {
   margin-block-start: calc(var(--base-size-8) + 1px);
 }
diff --git a/packages/react/src/FAQ/FAQGroup.module.css.d.ts b/packages/react/src/FAQ/FAQGroup.module.css.d.ts
index 479c26eea..ca7dba5a3 100644
--- a/packages/react/src/FAQ/FAQGroup.module.css.d.ts
+++ b/packages/react/src/FAQ/FAQGroup.module.css.d.ts
@@ -1,7 +1,6 @@
 declare const styles: {
   readonly "FAQGroup": string;
   readonly "FAQGroup__accordion": string;
-  readonly "FAQ__subheading": string;
   readonly "FAQGroup__panel-subHeading": string;
   readonly "FAQGroup__tablist": string;
   readonly "FAQ__heading": string;
diff --git a/packages/react/src/FAQ/FAQGroup.tsx b/packages/react/src/FAQ/FAQGroup.tsx
index 6c6d0ae88..ff1733205 100644
--- a/packages/react/src/FAQ/FAQGroup.tsx
+++ b/packages/react/src/FAQ/FAQGroup.tsx
@@ -19,7 +19,7 @@ import styles from './FAQGroup.module.css'
 
 function _Heading({children, className, as = 'h3', ...rest}: FAQSubheadingProps) {
   return (
-    <Heading as={as} className={clsx(styles.FAQ__subheading, className)} {...rest}>
+    <Heading as={as} className={clsx(className)} {...rest}>
       {children}
     </Heading>
   )
@@ -137,7 +137,7 @@ function _FAQGroup({children, id, defaultSelectedIndex = 0, ...rest}: FAQGroupPr
     <Grid {...rest}>
       <Grid.Column>
         {GroupHeading && (
-          <Box marginBlockEnd={{narrow: 48, regular: 112}}>
+          <Box marginBlockEnd={{narrow: 48, regular: 80}}>
             <Grid>
               <Grid.Column>{GroupHeading}</Grid.Column>
             </Grid>
diff --git a/packages/react/src/Hero/Hero.tsx b/packages/react/src/Hero/Hero.tsx
index 6aadfd9e1..e9623b82e 100644
--- a/packages/react/src/Hero/Hero.tsx
+++ b/packages/react/src/Hero/Hero.tsx
@@ -71,7 +71,7 @@ const Root = forwardRef<HTMLElement, PropsWithChildren<HeroProps>>(
               justifyContent={imagePosition === 'inline-end' ? undefined : align === 'start' ? 'flex-start' : 'center'}
             >
               {HeroChildren}
-              <div className={styles['Hero-actions']}>{HeroActions}</div>
+              {HeroActions.length > 0 && <div className={styles['Hero-actions']}>{HeroActions}</div>}
             </Stack>
           </Grid.Column>
           {HeroImageChild && (
diff --git a/packages/react/src/SubdomainNavBar/SubdomainNavBar.visual.spec.ts-snapshots/Visual-Comparison-SubdomainNavBar-Mobile-view-8d921-for-Mobile-View-SubdomainNavBar-Mobile-View-1-linux.png b/packages/react/src/SubdomainNavBar/SubdomainNavBar.visual.spec.ts-snapshots/Visual-Comparison-SubdomainNavBar-Mobile-view-8d921-for-Mobile-View-SubdomainNavBar-Mobile-View-1-linux.png
index e885e7ddd..8ca3682e5 100644
Binary files a/packages/react/src/SubdomainNavBar/SubdomainNavBar.visual.spec.ts-snapshots/Visual-Comparison-SubdomainNavBar-Mobile-view-8d921-for-Mobile-View-SubdomainNavBar-Mobile-View-1-linux.png and b/packages/react/src/SubdomainNavBar/SubdomainNavBar.visual.spec.ts-snapshots/Visual-Comparison-SubdomainNavBar-Mobile-view-8d921-for-Mobile-View-SubdomainNavBar-Mobile-View-1-linux.png differ
diff --git a/packages/react/src/forms/FormControl/FormControl.module.css b/packages/react/src/forms/FormControl/FormControl.module.css
index d60a27221..13d57b10b 100644
--- a/packages/react/src/forms/FormControl/FormControl.module.css
+++ b/packages/react/src/forms/FormControl/FormControl.module.css
@@ -17,7 +17,7 @@
 }
 
 .FormControl--border {
-  border: 1px solid var(--brand-color-border-default);
+  border: 1px solid var(--brand-control-color-border-default);
   border-radius: var(--brand-control-border-radius);
   padding: var(--base-size-12);
 }
diff --git a/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelOne/FeaturePreviewLevelOne.module.css b/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelOne/FeaturePreviewLevelOne.module.css
index fab6f8786..b3612781c 100644
--- a/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelOne/FeaturePreviewLevelOne.module.css
+++ b/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelOne/FeaturePreviewLevelOne.module.css
@@ -19,7 +19,11 @@
 }
 
 .FeaturePreview__borderTop {
-  border-top: var(--brand-borderWidth-thin) solid var(--brand-color-border-default);
+  border-top: var(--brand-borderWidth-thin) solid var(--brand-control-color-border-default);
+}
+
+.FeaturePreview__contactMe {
+  border-top: var(--brand-borderWidth-thin) solid var(--brand-control-color-border-default);
 }
 
 .FeaturePreview__hero {
diff --git a/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelOne/FeaturePreviewLevelOne.module.css.d.ts b/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelOne/FeaturePreviewLevelOne.module.css.d.ts
index 7d8afd319..6e3247ef4 100644
--- a/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelOne/FeaturePreviewLevelOne.module.css.d.ts
+++ b/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelOne/FeaturePreviewLevelOne.module.css.d.ts
@@ -3,6 +3,7 @@ declare const styles: {
   readonly "FeaturePreview__trailingSection": string;
   readonly "FeaturePreview__mainContentGrid": string;
   readonly "FeaturePreview__borderTop": string;
+  readonly "FeaturePreview__contactMe": string;
   readonly "FeaturePreview__hero": string;
   readonly "FeaturePreview__heroBg": string;
   readonly "FeaturePreview__splitLayout": string;
diff --git a/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelOne/FeaturePreviewLevelOne.tsx b/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelOne/FeaturePreviewLevelOne.tsx
index 6753f520a..d7d9574bc 100644
--- a/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelOne/FeaturePreviewLevelOne.tsx
+++ b/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelOne/FeaturePreviewLevelOne.tsx
@@ -66,11 +66,11 @@ export function FeaturePreviewLevelOne({accentColor, colorMode, ...args}: Featur
             <Grid.Column>
               <section>
                 <Grid enableOverlay={enableGridOverlay}>
-                  <Grid.Column span={{small: 12, medium: 8}} start={{medium: 3}}>
+                  <Grid.Column span={{small: 12, xlarge: 8}} start={{xlarge: 3}}>
                     <Box
                       backgroundColor="subtle"
                       borderRadius="large"
-                      borderColor="subtle"
+                      borderColor={colorMode === ColorModesEnum.LIGHT ? 'subtle' : 'default'}
                       borderWidth="thin"
                       borderStyle="solid"
                       paddingBlockStart={{narrow: 24, regular: 80}}
diff --git a/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelOne/FeaturePreviewLevelOne.visual.spec.ts-snapshots/Visual-Comparison-FeaturePreviewLevelOne-FeaturePreviewLevelOne-Default-1-linux.png b/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelOne/FeaturePreviewLevelOne.visual.spec.ts-snapshots/Visual-Comparison-FeaturePreviewLevelOne-FeaturePreviewLevelOne-Default-1-linux.png
index c08bb331c..8296adf3d 100644
Binary files a/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelOne/FeaturePreviewLevelOne.visual.spec.ts-snapshots/Visual-Comparison-FeaturePreviewLevelOne-FeaturePreviewLevelOne-Default-1-linux.png and b/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelOne/FeaturePreviewLevelOne.visual.spec.ts-snapshots/Visual-Comparison-FeaturePreviewLevelOne-FeaturePreviewLevelOne-Default-1-linux.png differ
diff --git a/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelOne/FeaturePreviewLevelOne.visual.spec.ts-snapshots/Visual-Comparison-FeaturePreviewLevelOne-FeaturePreviewLevelOne-Side-by-side-1-linux.png b/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelOne/FeaturePreviewLevelOne.visual.spec.ts-snapshots/Visual-Comparison-FeaturePreviewLevelOne-FeaturePreviewLevelOne-Side-by-side-1-linux.png
index 769fb4aac..3c8ec1879 100644
Binary files a/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelOne/FeaturePreviewLevelOne.visual.spec.ts-snapshots/Visual-Comparison-FeaturePreviewLevelOne-FeaturePreviewLevelOne-Side-by-side-1-linux.png and b/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelOne/FeaturePreviewLevelOne.visual.spec.ts-snapshots/Visual-Comparison-FeaturePreviewLevelOne-FeaturePreviewLevelOne-Side-by-side-1-linux.png differ
diff --git a/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelOne/FeaturePreviewLevelOneSideBySide.tsx b/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelOne/FeaturePreviewLevelOneSideBySide.tsx
index 997a74556..69616e0e0 100644
--- a/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelOne/FeaturePreviewLevelOneSideBySide.tsx
+++ b/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelOne/FeaturePreviewLevelOneSideBySide.tsx
@@ -4,12 +4,12 @@ import {
   ColorModesEnum,
   Grid,
   Heading,
-  Hero,
+  Label,
   MinimalFooter,
   Stack,
   SubdomainNavBar,
+  Text,
   ThemeProvider,
-  UnorderedList,
 } from '../../..'
 
 import {Themes, themeDetailsMap} from '../helpers'
@@ -93,22 +93,38 @@ export function FeaturePreviewLevelOneSideBySide({
             <Stack padding="none" justifyContent={{wide: 'flex-end'}}>
               <Box padding={24}>
                 <ThemeProvider colorMode="dark">
-                  <Hero align="start">
-                    {args.heroLabel && <Hero.Label color="blue-purple">{args.heroLabel}</Hero.Label>}
-                    {args.heroTitle && (
-                      <Hero.Heading size="3">
-                        Set up your <br /> enterprise trial
-                      </Hero.Heading>
-                    )}
-                    {args.heroDescription && <Hero.Description>{args.heroDescription}</Hero.Description>}
-                    <Box marginBlockStart={48}>
-                      <UnorderedList variant="checked">
-                        <UnorderedList.Item>Access to core collaboration features</UnorderedList.Item>
-                        <UnorderedList.Item>Unlimited public repositories</UnorderedList.Item>
-                        <UnorderedList.Item>Community support</UnorderedList.Item>
-                      </UnorderedList>
-                    </Box>
-                  </Hero>
+                  <Box
+                    paddingBlockStart={{
+                      narrow: 80,
+                      wide: 'none',
+                    }}
+                    paddingBlockEnd={{
+                      narrow: 80,
+                      wide: 'none',
+                    }}
+                    marginBlockStart={{
+                      wide: 128,
+                    }}
+                  >
+                    <Stack direction="vertical" padding="none" alignItems="flex-start">
+                      {args.heroLabel && <Label color="blue-purple">{args.heroLabel}</Label>}
+                      {args.heroTitle && (
+                        <Heading size="3">
+                          Set up your <br /> enterprise trial
+                        </Heading>
+                      )}
+
+                      <Heading as="h2" size="subhead-large" style={{color: 'var(--base-color-scale-purple-2)'}}>
+                        Subheader
+                      </Heading>
+
+                      {args.heroDescription && (
+                        <Text as="p" variant="muted">
+                          {args.heroDescription}
+                        </Text>
+                      )}
+                    </Stack>
+                  </Box>
                 </ThemeProvider>
               </Box>
             </Stack>
@@ -116,6 +132,8 @@ export function FeaturePreviewLevelOneSideBySide({
           <Grid.Column span={{large: 5}} start={{xlarge: 8}}>
             <Box
               padding={24}
+              paddingBlockStart={{narrow: 64, regular: 128, wide: 24}}
+              paddingBlockEnd={{narrow: 24, regular: 80}}
               marginBlockStart={{
                 wide: 128,
               }}
diff --git a/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelOne/components/FormExample.tsx b/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelOne/components/FormExample.tsx
index d569c92a9..1032a9a43 100644
--- a/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelOne/components/FormExample.tsx
+++ b/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelOne/components/FormExample.tsx
@@ -6,7 +6,7 @@ export function FormExample() {
   return (
     <form>
       <>
-        <Stack direction="vertical" padding="none">
+        <Stack direction="vertical" padding="none" gap={24}>
           <Box marginBlockEnd={16}>
             <Text as="p" size="100">
               All fields marked with an asterisk (*) are required
@@ -44,28 +44,30 @@ export function FormExample() {
         </Stack>
 
         <Box
-          className={styles.FeaturePreview__borderTop}
+          className={styles.FeaturePreview__contactMe}
           paddingBlockStart={{narrow: 16, regular: 24}}
           marginBlockStart={{narrow: 16, regular: 24}}
           paddingBlockEnd={{narrow: 16, regular: 24}}
           marginBlockEnd={{narrow: 16, regular: 24}}
         >
-          <Stack direction="vertical" padding="none">
-            <FormControl hasBorder required>
-              <FormControl.Label>
-                Contact me about GitHub Enterprise Server{' '}
-                <FormControl.Hint>
-                  <Text size="100" variant="muted">
-                    I&apos;m interested in learning more about{' '}
-                    <InlineLink size="100" href="https://github.com/enterprise" target="_blank">
-                      GitHub Enterprise Server
-                    </InlineLink>{' '}
-                    and would like to be contacted by GitHub’s sales team.
-                  </Text>
-                </FormControl.Hint>
-              </FormControl.Label>
-              <Checkbox />
-            </FormControl>
+          <Stack direction="vertical" padding="none" gap={24}>
+            <Box backgroundColor="default">
+              <FormControl hasBorder required>
+                <FormControl.Label>
+                  Contact me about GitHub Enterprise Server{' '}
+                  <FormControl.Hint>
+                    <Text size="100" variant="muted">
+                      I&apos;m interested in learning more about{' '}
+                      <InlineLink size="100" href="https://github.com/enterprise" target="_blank">
+                        GitHub Enterprise Server
+                      </InlineLink>{' '}
+                      and would like to be contacted by GitHub’s sales team.
+                    </Text>
+                  </FormControl.Hint>
+                </FormControl.Label>
+                <Checkbox />
+              </FormControl>
+            </Box>
             <div
               style={{
                 borderWidth: 1,
@@ -106,7 +108,18 @@ export function FormExample() {
               <Checkbox />
             </FormControl>
             <Box marginBlockStart={16}>
-              <Stack direction="horizontal" padding="none" justifyContent="flex-end">
+              <Stack
+                direction={{
+                  narrow: 'vertical',
+                  regular: 'vertical',
+                  wide: 'horizontal',
+                }}
+                padding="none"
+                justifyContent={{
+                  narrow: 'flex-start',
+                  regular: 'flex-end',
+                }}
+              >
                 <Button variant="subtle">Skip trial and upgrade</Button>
                 <Button variant="primary" type="submit">
                   Start trial
diff --git a/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelTwo/FeaturePreviewLevelTwo.module.css b/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelTwo/FeaturePreviewLevelTwo.module.css
index 0eae265cc..29446bb7d 100644
--- a/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelTwo/FeaturePreviewLevelTwo.module.css
+++ b/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelTwo/FeaturePreviewLevelTwo.module.css
@@ -17,6 +17,12 @@
   }
 }
 
+.FeaturePreview__heroBg {
+  background-repeat: no-repeat;
+  background-size: cover;
+  background-position: right center;
+}
+
 .FeaturePreview__heroImageContainer {
   background-repeat: no-repeat;
   background-size: cover;
diff --git a/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelTwo/FeaturePreviewLevelTwo.module.css.d.ts b/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelTwo/FeaturePreviewLevelTwo.module.css.d.ts
index 6197680b2..b2858443b 100644
--- a/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelTwo/FeaturePreviewLevelTwo.module.css.d.ts
+++ b/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelTwo/FeaturePreviewLevelTwo.module.css.d.ts
@@ -1,6 +1,7 @@
 declare const styles: {
   readonly "Hero": string;
   readonly "FeaturePreview": string;
+  readonly "FeaturePreview__heroBg": string;
   readonly "FeaturePreview__heroImageContainer": string;
   readonly "FeaturePreview__ctaBanner": string;
   readonly "FeaturePreview__trailingSection": string;
diff --git a/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelTwo/FeaturePreviewLevelTwo.stories.tsx b/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelTwo/FeaturePreviewLevelTwo.stories.tsx
index 24f10eae6..27b47e2a1 100644
--- a/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelTwo/FeaturePreviewLevelTwo.stories.tsx
+++ b/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelTwo/FeaturePreviewLevelTwo.stories.tsx
@@ -19,6 +19,7 @@ export default {
     colorMode: ColorModesEnum.LIGHT,
     accentColor: 'ai',
     heroAlign: 'start',
+    heroBg: false,
     showHeroVisual: true,
     heroLabel: 'Label',
     heroTitle: 'Expressive headline about a sweet feature',
@@ -98,6 +99,13 @@ export default {
         category: 'Section: Hero',
       },
     },
+    heroBg: {
+      control: 'boolean',
+      name: 'has background',
+      table: {
+        category: 'Section: Hero',
+      },
+    },
     showHeroVisual: {
       control: 'boolean',
       name: 'show visual',
@@ -413,6 +421,7 @@ LevelTwoPointTwo.storyName = '2.2 variant'
 LevelTwoPointTwo.args = {
   showHeroVisual: false,
   heroAlign: 'start',
+  heroBg: true,
   sectionIntroAlign: 'start',
   pillarBackground: true,
   testimonialVisible: false,
@@ -427,6 +436,7 @@ LevelTwoPointThree.args = {
   showHeroVisual: false,
   heroLabel: '',
   heroAlign: 'center',
+  heroBg: true,
   sectionIntroAlign: 'center',
   sectionIntroText: [
     <em key="highlighted-statement">Highlighted statement in 4-6 words max.</em>,
diff --git a/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelTwo/FeaturePreviewLevelTwo.tsx b/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelTwo/FeaturePreviewLevelTwo.tsx
index 0ea7d8a86..0f62adcff 100644
--- a/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelTwo/FeaturePreviewLevelTwo.tsx
+++ b/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelTwo/FeaturePreviewLevelTwo.tsx
@@ -41,6 +41,7 @@ type FeaturePreviewLevelTwoProps = {
   colorMode?: ColorModesEnum.LIGHT | ColorModesEnum.DARK
   accentColor: Themes
   heroAlign: 'start' | 'center'
+  heroBg: boolean
   showHeroVisual: boolean
   heroLabel: string
   heroTitle: string
@@ -149,46 +150,60 @@ export function FeaturePreviewLevelTwo({accentColor, colorMode, ...args}: Featur
         </SubdomainNavBar.PrimaryAction>
       </SubdomainNavBar>
       <div className={styles.FeaturePreview}>
-        <Grid enableOverlay={enableGridOverlay}>
-          <Grid.Column>
-            <Box
-              marginBlockStart={{
-                narrow: 24,
-                regular: 64,
-                wide: 112,
-              }}
-            >
-              <Hero
-                align={args.heroAlign}
-                className={styles.Hero}
-                imageContainerClassName={styles.FeaturePreview__heroImageContainer}
-                imageContainerStyle={{
-                  backgroundImage: `url(${themeDetailsMap[accentColor][selectedColorMode].images.heroVisualBg})`,
+        <Box
+          backgroundColor={args.heroBg ? 'subtle' : 'default'}
+          className={args.heroBg ? styles['FeaturePreview__heroBg'] : ''}
+          paddingBlockEnd={args.heroBg ? 24 : 'none'}
+          marginBlockEnd={args.heroBg ? 96 : 'none'}
+        >
+          <Grid enableOverlay={enableGridOverlay}>
+            <Grid.Column>
+              <Box
+                paddingBlockEnd={{wide: 8}}
+                marginBlockStart={{
+                  narrow: 24,
+                  regular: 64,
+                  wide: 80,
                 }}
               >
-                {args.heroLabel && <Hero.Label>{args.heroLabel}</Hero.Label>}
-                {args.heroTitle && <Hero.Heading>{args.heroTitle}</Hero.Heading>}
-                {args.heroDescription && <Hero.Description>{args.heroDescription}</Hero.Description>}
-                {args.heroCtaTextPrimary && <Hero.PrimaryAction href="#">{args.heroCtaTextPrimary}</Hero.PrimaryAction>}
-                {args.heroCtaTextSecondary && (
-                  <Hero.SecondaryAction href="#">{args.heroCtaTextSecondary}</Hero.SecondaryAction>
-                )}
-                {args.showHeroVisual && (
-                  <Hero.Image
-                    src={isLightMode ? emptyBrowser : emptyBrowserDark}
-                    alt="placeholder, blank area with an off-white background color"
-                  />
-                )}
-              </Hero>
-            </Box>
+                <Hero
+                  align={args.heroAlign}
+                  className={styles.Hero}
+                  imageContainerClassName={styles.FeaturePreview__heroImageContainer}
+                  imageContainerStyle={{
+                    backgroundImage: `url(${themeDetailsMap[accentColor][selectedColorMode].images.heroVisualBg})`,
+                  }}
+                >
+                  {args.heroLabel && <Hero.Label>{args.heroLabel}</Hero.Label>}
+                  {args.heroTitle && <Hero.Heading>{args.heroTitle}</Hero.Heading>}
+                  {args.heroDescription && <Hero.Description>{args.heroDescription}</Hero.Description>}
+                  {args.heroCtaTextPrimary && (
+                    <Hero.PrimaryAction href="#">{args.heroCtaTextPrimary}</Hero.PrimaryAction>
+                  )}
+                  {args.heroCtaTextSecondary && (
+                    <Hero.SecondaryAction href="#">{args.heroCtaTextSecondary}</Hero.SecondaryAction>
+                  )}
+                  {args.showHeroVisual && (
+                    <Hero.Image
+                      src={isLightMode ? emptyBrowser : emptyBrowserDark}
+                      alt="placeholder, blank area with an off-white background color"
+                    />
+                  )}
+                </Hero>
+              </Box>
+            </Grid.Column>
+          </Grid>
+        </Box>
+        <Grid enableOverlay={enableGridOverlay}>
+          <Grid.Column>
             <section>
               {args.sectionIntroText && args.sectionIntroVisible && (
                 <Grid enableOverlay={enableGridOverlay}>
                   <Grid.Column
-                    span={args.sectionIntroAlign === 'center' ? 8 : 9}
+                    span={{medium: args.sectionIntroAlign === 'center' ? 8 : 9}}
                     start={{medium: args.sectionIntroAlign === 'center' ? 3 : 1}}
                   >
-                    <Box marginBlockEnd={64}>
+                    <Box marginBlockEnd={40}>
                       <SectionIntro fullWidth align={args.sectionIntroAlign}>
                         <SectionIntro.Heading>{args.sectionIntroText}</SectionIntro.Heading>
                       </SectionIntro>
@@ -257,7 +272,7 @@ export function FeaturePreviewLevelTwo({accentColor, colorMode, ...args}: Featur
                 </Box>
               )}
             </section>
-            <Box paddingBlockEnd={48}>
+            <Box paddingBlockStart={48} paddingBlockEnd={80}>
               {args.riverOneVisible && (
                 <>
                   {args.riverOneType === 'breakout' ? (
@@ -452,16 +467,16 @@ export function FeaturePreviewLevelTwo({accentColor, colorMode, ...args}: Featur
             {args.testimonialVisible && (
               <>
                 {args.testimonialQuantity === 1 ? (
-                  <Grid.Column start={2} span={10}>
-                    <Box marginBlockEnd={128}>{renderTestimonial(args.testimonialQuantity)}</Box>
+                  <Grid.Column start={{medium: 2}} span={{medium: 10}}>
+                    <Box marginBlockEnd={112}>{renderTestimonial(args.testimonialQuantity)}</Box>
                   </Grid.Column>
                 ) : (
                   <>
                     <Grid.Column span={6}>
-                      <Box marginBlockEnd={128}>{renderTestimonial(args.testimonialQuantity)}</Box>
+                      <Box marginBlockEnd={112}>{renderTestimonial(args.testimonialQuantity)}</Box>
                     </Grid.Column>
                     <Grid.Column span={6}>
-                      <Box marginBlockEnd={128}>{renderTestimonial(args.testimonialQuantity)}</Box>
+                      <Box marginBlockEnd={112}>{renderTestimonial(args.testimonialQuantity)}</Box>
                     </Grid.Column>
                   </>
                 )}
@@ -469,8 +484,72 @@ export function FeaturePreviewLevelTwo({accentColor, colorMode, ...args}: Featur
             )}
 
             <Grid.Column>
+              {args.ctaBannerVisible && (
+                <Grid.Column>
+                  <Box>
+                    <CTABanner
+                      className={styles.FeaturePreview__ctaBanner}
+                      align="center"
+                      hasShadow={false}
+                      hasBackground={args.ctaBannerShowBg ? false : true}
+                      style={
+                        args.ctaBannerShowBg
+                          ? {
+                              backgroundImage: `url(${themeDetailsMap[accentColor][selectedColorMode].images.ctaBannerBg})`,
+                            }
+                          : {}
+                      }
+                    >
+                      <CTABanner.Heading>Get it, it&apos;s super nice</CTABanner.Heading>
+                      <CTABanner.Description>
+                        Lorem ipsum dolor sit amet, consectetur adipiscing elit. In sapien sit ullamcorper id. Aliquam
+                        luctus sed turpis felis nam pulvinar.
+                      </CTABanner.Description>
+                      <CTABanner.ButtonGroup>
+                        <Button>Primary Action</Button>
+                        <Button>Secondary Action</Button>
+                      </CTABanner.ButtonGroup>
+                    </CTABanner>
+                  </Box>
+                </Grid.Column>
+              )}
+              {args.cardsVisible && (
+                <Box marginBlockStart={args.ctaBannerVisible ? 128 : undefined}>
+                  <Stack direction="vertical" padding="none" gap={64} alignItems="center">
+                    <Heading as="h3" size="3">
+                      Go further with these
+                    </Heading>
+                    <Grid>
+                      <Grid.Column span={{medium: 4}}>
+                        <Card href="#">
+                          <Card.Heading>Collaboration is the key to DevOps success</Card.Heading>
+                          <Card.Description>
+                            Everything you need to know about getting started with GitHub Actions.
+                          </Card.Description>
+                        </Card>
+                      </Grid.Column>
+                      <Grid.Column span={{medium: 4}}>
+                        <Card href="#">
+                          <Card.Heading>Collaboration is the key to DevOps success</Card.Heading>
+                          <Card.Description>
+                            Everything you need to know about getting started with GitHub Actions.
+                          </Card.Description>
+                        </Card>
+                      </Grid.Column>
+                      <Grid.Column span={{medium: 4}}>
+                        <Card href="#">
+                          <Card.Heading>Collaboration is the key to DevOps success</Card.Heading>
+                          <Card.Description>
+                            Everything you need to know about getting started with GitHub Actions.
+                          </Card.Description>
+                        </Card>
+                      </Grid.Column>
+                    </Grid>
+                  </Stack>
+                </Box>
+              )}
               {args.faqVisible && (
-                <Box>
+                <Box marginBlockStart={args.cardsVisible || args.ctaBannerVisible ? 128 : undefined}>
                   {args.faqType === 'single' ? (
                     <FAQ>
                       <FAQ.Heading>Frequently asked questions</FAQ.Heading>
@@ -619,70 +698,6 @@ export function FeaturePreviewLevelTwo({accentColor, colorMode, ...args}: Featur
                   )}
                 </Box>
               )}
-              {args.ctaBannerVisible && (
-                <Grid.Column>
-                  <Box marginBlockStart={args.faqVisible ? 128 : undefined}>
-                    <CTABanner
-                      className={styles.FeaturePreview__ctaBanner}
-                      align="center"
-                      hasShadow={false}
-                      hasBackground={args.ctaBannerShowBg ? false : true}
-                      style={
-                        args.ctaBannerShowBg
-                          ? {
-                              backgroundImage: `url(${themeDetailsMap[accentColor][selectedColorMode].images.ctaBannerBg})`,
-                            }
-                          : {}
-                      }
-                    >
-                      <CTABanner.Heading>Get it, it&apos;s super nice</CTABanner.Heading>
-                      <CTABanner.Description>
-                        Lorem ipsum dolor sit amet, consectetur adipiscing elit. In sapien sit ullamcorper id. Aliquam
-                        luctus sed turpis felis nam pulvinar.
-                      </CTABanner.Description>
-                      <CTABanner.ButtonGroup>
-                        <Button>Primary Action</Button>
-                        <Button>Secondary Action</Button>
-                      </CTABanner.ButtonGroup>
-                    </CTABanner>
-                  </Box>
-                </Grid.Column>
-              )}
-              {args.cardsVisible && (
-                <Box marginBlockStart={args.ctaBannerVisible ? 128 : undefined}>
-                  <Stack direction="vertical" padding="none" gap={64} alignItems="center">
-                    <Heading as="h3" size="3">
-                      Go further with these
-                    </Heading>
-                    <Grid>
-                      <Grid.Column span={{medium: 4}}>
-                        <Card href="#">
-                          <Card.Heading>Collaboration is the key to DevOps success</Card.Heading>
-                          <Card.Description>
-                            Everything you need to know about getting started with GitHub Actions.
-                          </Card.Description>
-                        </Card>
-                      </Grid.Column>
-                      <Grid.Column span={{medium: 4}}>
-                        <Card href="#">
-                          <Card.Heading>Collaboration is the key to DevOps success</Card.Heading>
-                          <Card.Description>
-                            Everything you need to know about getting started with GitHub Actions.
-                          </Card.Description>
-                        </Card>
-                      </Grid.Column>
-                      <Grid.Column span={{medium: 4}}>
-                        <Card href="#">
-                          <Card.Heading>Collaboration is the key to DevOps success</Card.Heading>
-                          <Card.Description>
-                            Everything you need to know about getting started with GitHub Actions.
-                          </Card.Description>
-                        </Card>
-                      </Grid.Column>
-                    </Grid>
-                  </Stack>
-                </Box>
-              )}
             </Grid.Column>
           </Grid>
         </Box>
diff --git a/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelTwo/FeaturePreviewLevelTwo.visual.spec.ts-snapshots/Visual-Comparison-FeaturePreviewLevelTwo-FeaturePreviewLevelTwo-2-1-variant-1-linux.png b/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelTwo/FeaturePreviewLevelTwo.visual.spec.ts-snapshots/Visual-Comparison-FeaturePreviewLevelTwo-FeaturePreviewLevelTwo-2-1-variant-1-linux.png
index 3fecab280..6579a4eff 100644
Binary files a/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelTwo/FeaturePreviewLevelTwo.visual.spec.ts-snapshots/Visual-Comparison-FeaturePreviewLevelTwo-FeaturePreviewLevelTwo-2-1-variant-1-linux.png and b/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelTwo/FeaturePreviewLevelTwo.visual.spec.ts-snapshots/Visual-Comparison-FeaturePreviewLevelTwo-FeaturePreviewLevelTwo-2-1-variant-1-linux.png differ
diff --git a/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelTwo/FeaturePreviewLevelTwo.visual.spec.ts-snapshots/Visual-Comparison-FeaturePreviewLevelTwo-FeaturePreviewLevelTwo-2-2-variant-1-linux.png b/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelTwo/FeaturePreviewLevelTwo.visual.spec.ts-snapshots/Visual-Comparison-FeaturePreviewLevelTwo-FeaturePreviewLevelTwo-2-2-variant-1-linux.png
index aeb2e42f4..97cc4a6a2 100644
Binary files a/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelTwo/FeaturePreviewLevelTwo.visual.spec.ts-snapshots/Visual-Comparison-FeaturePreviewLevelTwo-FeaturePreviewLevelTwo-2-2-variant-1-linux.png and b/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelTwo/FeaturePreviewLevelTwo.visual.spec.ts-snapshots/Visual-Comparison-FeaturePreviewLevelTwo-FeaturePreviewLevelTwo-2-2-variant-1-linux.png differ
diff --git a/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelTwo/FeaturePreviewLevelTwo.visual.spec.ts-snapshots/Visual-Comparison-FeaturePreviewLevelTwo-FeaturePreviewLevelTwo-2-3-variant-1-linux.png b/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelTwo/FeaturePreviewLevelTwo.visual.spec.ts-snapshots/Visual-Comparison-FeaturePreviewLevelTwo-FeaturePreviewLevelTwo-2-3-variant-1-linux.png
index e7427995e..f617895f4 100644
Binary files a/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelTwo/FeaturePreviewLevelTwo.visual.spec.ts-snapshots/Visual-Comparison-FeaturePreviewLevelTwo-FeaturePreviewLevelTwo-2-3-variant-1-linux.png and b/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelTwo/FeaturePreviewLevelTwo.visual.spec.ts-snapshots/Visual-Comparison-FeaturePreviewLevelTwo-FeaturePreviewLevelTwo-2-3-variant-1-linux.png differ
diff --git a/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelTwo/FeaturePreviewLevelTwo.visual.spec.ts-snapshots/Visual-Comparison-FeaturePreviewLevelTwo-FeaturePreviewLevelTwo-Minimal-1-linux.png b/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelTwo/FeaturePreviewLevelTwo.visual.spec.ts-snapshots/Visual-Comparison-FeaturePreviewLevelTwo-FeaturePreviewLevelTwo-Minimal-1-linux.png
index 13948e2f7..969b0bb77 100644
Binary files a/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelTwo/FeaturePreviewLevelTwo.visual.spec.ts-snapshots/Visual-Comparison-FeaturePreviewLevelTwo-FeaturePreviewLevelTwo-Minimal-1-linux.png and b/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelTwo/FeaturePreviewLevelTwo.visual.spec.ts-snapshots/Visual-Comparison-FeaturePreviewLevelTwo-FeaturePreviewLevelTwo-Minimal-1-linux.png differ
diff --git a/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelTwo/FeaturePreviewLevelTwo.visual.spec.ts-snapshots/Visual-Comparison-FeaturePreviewLevelTwo-FeaturePreviewLevelTwo-Playground-1-linux.png b/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelTwo/FeaturePreviewLevelTwo.visual.spec.ts-snapshots/Visual-Comparison-FeaturePreviewLevelTwo-FeaturePreviewLevelTwo-Playground-1-linux.png
index 3fecab280..c7bf7be29 100644
Binary files a/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelTwo/FeaturePreviewLevelTwo.visual.spec.ts-snapshots/Visual-Comparison-FeaturePreviewLevelTwo-FeaturePreviewLevelTwo-Playground-1-linux.png and b/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelTwo/FeaturePreviewLevelTwo.visual.spec.ts-snapshots/Visual-Comparison-FeaturePreviewLevelTwo-FeaturePreviewLevelTwo-Playground-1-linux.png differ
diff --git a/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelZero/FeaturePreviewLevelZero.tsx b/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelZero/FeaturePreviewLevelZero.tsx
index e925bc650..99336fda2 100644
--- a/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelZero/FeaturePreviewLevelZero.tsx
+++ b/packages/react/src/recipes/FeaturePreviewLPs/FeaturePreviewLevelZero/FeaturePreviewLevelZero.tsx
@@ -104,7 +104,7 @@ export function FeaturePreviewLevelZero({accentColor, colorMode, ...args}: Featu
           <Grid.Column>
             <section>
               <Grid enableOverlay={enableGridOverlay}>
-                <Grid.Column span={6} start={4}>
+                <Grid.Column span={{large: 6}} start={{large: 4}}>
                   <Stack padding="none">
                     <SectionIntro fullWidth align={args.heroAlign === 'center' ? 'center' : 'start'}>
                       <SectionIntro.Heading size="5">
diff --git a/packages/react/src/river/River/River.visual.spec.ts-snapshots/Visual-Comparison-River-River-Alternating-Layout-1-linux.png b/packages/react/src/river/River/River.visual.spec.ts-snapshots/Visual-Comparison-River-River-Alternating-Layout-1-linux.png
index aea728559..c896a9dce 100644
Binary files a/packages/react/src/river/River/River.visual.spec.ts-snapshots/Visual-Comparison-River-River-Alternating-Layout-1-linux.png and b/packages/react/src/river/River/River.visual.spec.ts-snapshots/Visual-Comparison-River-River-Alternating-Layout-1-linux.png differ
diff --git a/packages/react/src/river/River/River.visual.spec.ts-snapshots/Visual-Comparison-River-River-Alternative-Heading-Level-1-linux.png b/packages/react/src/river/River/River.visual.spec.ts-snapshots/Visual-Comparison-River-River-Alternative-Heading-Level-1-linux.png
index 4bebd6853..5ef3d949c 100644
Binary files a/packages/react/src/river/River/River.visual.spec.ts-snapshots/Visual-Comparison-River-River-Alternative-Heading-Level-1-linux.png and b/packages/react/src/river/River/River.visual.spec.ts-snapshots/Visual-Comparison-River-River-Alternative-Heading-Level-1-linux.png differ
diff --git a/packages/react/src/river/River/River.visual.spec.ts-snapshots/Visual-Comparison-River-River-Alternative-Heading-Size-1-linux.png b/packages/react/src/river/River/River.visual.spec.ts-snapshots/Visual-Comparison-River-River-Alternative-Heading-Size-1-linux.png
index 937b3472a..f59ee3492 100644
Binary files a/packages/react/src/river/River/River.visual.spec.ts-snapshots/Visual-Comparison-River-River-Alternative-Heading-Size-1-linux.png and b/packages/react/src/river/River/River.visual.spec.ts-snapshots/Visual-Comparison-River-River-Alternative-Heading-Size-1-linux.png differ
diff --git a/packages/react/src/river/River/River.visual.spec.ts-snapshots/Visual-Comparison-River-River-Center-1-linux.png b/packages/react/src/river/River/River.visual.spec.ts-snapshots/Visual-Comparison-River-River-Center-1-linux.png
index 3b86c311f..88c71ae25 100644
Binary files a/packages/react/src/river/River/River.visual.spec.ts-snapshots/Visual-Comparison-River-River-Center-1-linux.png and b/packages/react/src/river/River/River.visual.spec.ts-snapshots/Visual-Comparison-River-River-Center-1-linux.png differ
diff --git a/packages/react/src/river/River/River.visual.spec.ts-snapshots/Visual-Comparison-River-River-Copilot-1-linux.png b/packages/react/src/river/River/River.visual.spec.ts-snapshots/Visual-Comparison-River-River-Copilot-1-linux.png
index b77f2a220..e76ff8266 100644
Binary files a/packages/react/src/river/River/River.visual.spec.ts-snapshots/Visual-Comparison-River-River-Copilot-1-linux.png and b/packages/react/src/river/River/River.visual.spec.ts-snapshots/Visual-Comparison-River-River-Copilot-1-linux.png differ
diff --git a/packages/react/src/river/River/River.visual.spec.ts-snapshots/Visual-Comparison-River-River-Custom-trailing-content-1-linux.png b/packages/react/src/river/River/River.visual.spec.ts-snapshots/Visual-Comparison-River-River-Custom-trailing-content-1-linux.png
index d3fa6e41a..2be290dd8 100644
Binary files a/packages/react/src/river/River/River.visual.spec.ts-snapshots/Visual-Comparison-River-River-Custom-trailing-content-1-linux.png and b/packages/react/src/river/River/River.visual.spec.ts-snapshots/Visual-Comparison-River-River-Custom-trailing-content-1-linux.png differ
diff --git a/packages/react/src/river/River/River.visual.spec.ts-snapshots/Visual-Comparison-River-River-Custom-trailing-content-w-divider-1-linux.png b/packages/react/src/river/River/River.visual.spec.ts-snapshots/Visual-Comparison-River-River-Custom-trailing-content-w-divider-1-linux.png
index e38c8c182..dd9a1bd2f 100644
Binary files a/packages/react/src/river/River/River.visual.spec.ts-snapshots/Visual-Comparison-River-River-Custom-trailing-content-w-divider-1-linux.png and b/packages/react/src/river/River/River.visual.spec.ts-snapshots/Visual-Comparison-River-River-Custom-trailing-content-w-divider-1-linux.png differ
diff --git a/packages/react/src/river/River/River.visual.spec.ts-snapshots/Visual-Comparison-River-River-Default-1-linux.png b/packages/react/src/river/River/River.visual.spec.ts-snapshots/Visual-Comparison-River-River-Default-1-linux.png
index 4c2c5f1af..2923a6140 100644
Binary files a/packages/react/src/river/River/River.visual.spec.ts-snapshots/Visual-Comparison-River-River-Default-1-linux.png and b/packages/react/src/river/River/River.visual.spec.ts-snapshots/Visual-Comparison-River-River-Default-1-linux.png differ
diff --git a/packages/react/src/river/River/River.visual.spec.ts-snapshots/Visual-Comparison-River-River-Larger-Placeholder-Image-1-linux.png b/packages/react/src/river/River/River.visual.spec.ts-snapshots/Visual-Comparison-River-River-Larger-Placeholder-Image-1-linux.png
index 313c4f2b5..30eddd688 100644
Binary files a/packages/react/src/river/River/River.visual.spec.ts-snapshots/Visual-Comparison-River-River-Larger-Placeholder-Image-1-linux.png and b/packages/react/src/river/River/River.visual.spec.ts-snapshots/Visual-Comparison-River-River-Larger-Placeholder-Image-1-linux.png differ
diff --git a/packages/react/src/river/River/River.visual.spec.ts-snapshots/Visual-Comparison-River-River-Left-1-linux.png b/packages/react/src/river/River/River.visual.spec.ts-snapshots/Visual-Comparison-River-River-Left-1-linux.png
index 9a13aa847..c07c79208 100644
Binary files a/packages/react/src/river/River/River.visual.spec.ts-snapshots/Visual-Comparison-River-River-Left-1-linux.png and b/packages/react/src/river/River/River.visual.spec.ts-snapshots/Visual-Comparison-River-River-Left-1-linux.png differ
diff --git a/packages/react/src/river/River/River.visual.spec.ts-snapshots/Visual-Comparison-River-River-No-Rounded-Visual-Corners-1-linux.png b/packages/react/src/river/River/River.visual.spec.ts-snapshots/Visual-Comparison-River-River-No-Rounded-Visual-Corners-1-linux.png
index f3dedf538..fb3074e8f 100644
Binary files a/packages/react/src/river/River/River.visual.spec.ts-snapshots/Visual-Comparison-River-River-No-Rounded-Visual-Corners-1-linux.png and b/packages/react/src/river/River/River.visual.spec.ts-snapshots/Visual-Comparison-River-River-No-Rounded-Visual-Corners-1-linux.png differ
diff --git a/packages/react/src/river/River/River.visual.spec.ts-snapshots/Visual-Comparison-River-River-Right-1-linux.png b/packages/react/src/river/River/River.visual.spec.ts-snapshots/Visual-Comparison-River-River-Right-1-linux.png
index 6e154f0e5..7c2f3cd7d 100644
Binary files a/packages/react/src/river/River/River.visual.spec.ts-snapshots/Visual-Comparison-River-River-Right-1-linux.png and b/packages/react/src/river/River/River.visual.spec.ts-snapshots/Visual-Comparison-River-River-Right-1-linux.png differ