diff --git a/src/components/accordion-item/accordion-item.scss b/src/components/accordion-item/accordion-item.scss
index 1a5a0c9b07123c8ace4ebf97e0e2f166a1f247bf..217d1f30fbd8700f872219bc3f0aff9ea20dcdbb 100644
--- a/src/components/accordion-item/accordion-item.scss
+++ b/src/components/accordion-item/accordion-item.scss
@@ -104,6 +104,21 @@
     span {
       text-align: left;
     }
+
+    // When accordion item is open.
+    &[aria-expanded='true'] {
+      position: relative;
+
+      &:after {
+        background: linear-gradient(to right, var(--grayscale-medium), var(--grayscale-white));
+        bottom: 0;
+        content: '';
+        height: 2px;
+        left: 0;
+        position: absolute;
+        width: 100%;
+      }
+    }
   }
 
   .hy-accordion--heading__icon {
@@ -187,9 +202,15 @@
     display: block;
   }
 
-  hy-box {
+  > hy-box {
+    padding: 20px 16px 0;
+
     @include breakpoint($narrow) {
-      padding: 0 2rem;
+      padding: 20px 24px 0;
+    }
+
+    @include breakpoint($extrawide) {
+      padding: 24px 32px 0;
     }
   }
 }
diff --git a/src/components/hy-two-columns/hy-two-columns.scss b/src/components/hy-two-columns/hy-two-columns.scss
index 532c5659e4800f061e8f41eed354ccb217894e86..616ce3efeb37f80231422a97987f876590000dde 100644
--- a/src/components/hy-two-columns/hy-two-columns.scss
+++ b/src/components/hy-two-columns/hy-two-columns.scss
@@ -29,18 +29,35 @@
       flex-direction: row-reverse;
     }
 
-    .hy-two-columns--side {
+    .hy-two-columns__item--side {
       margin-left: 0;
       margin-right: 0;
 
       @include breakpoint($narrow) {
         margin-right: 5.79%;
       }
+
       @include breakpoint($wide) {
         margin-right: 8.5%;
       }
     }
   }
+}
+
+.hy-two-columns__item {
+  width: 100%;
+
+  [slot='main'] {
+    width: 100%;
+
+    .hy-paragraph-text {
+      width: 100% !important;
+    }
+  }
+
+  [slot='side'] {
+    width: 100%;
+  }
 
   &--main {
     display: flex;
@@ -50,16 +67,10 @@
     @include breakpoint($narrow) {
       flex-basis: 67.01%;
     }
+
     @include breakpoint($wide) {
       flex-basis: 63%;
     }
-
-    [slot='main'] {
-      width: 100%;
-      .hy-paragraph-text {
-        width: 100% !important;
-      }
-    }
   }
 
   &--side {
@@ -75,16 +86,13 @@
       flex-basis: 32.99%; // sidebar width is always 4.5 column of the global 12-col content area grid.
       margin-left: 5.79%; // (half of the column+gutter) of global 12-col grid = gap between main and sidebar
     }
+
     @include breakpoint($wide) {
       flex-basis: 37%;
       margin-left: 8.5%; // (1 column + gutter) of global 12-col grid = gap between main and sidebar
       padding: 0;
     }
 
-    [slot='side'] {
-      width: 100%;
-    }
-
     // Key figure block inside Sidebar
     hy-key-figure {
       padding: 0 10.67%;
diff --git a/src/components/hy-two-columns/hy-two-columns.tsx b/src/components/hy-two-columns/hy-two-columns.tsx
index 850ac8911af5e860577252bf346db722050cf19d..2d7c3586673c3720226d7582c34b111bc667a478 100644
--- a/src/components/hy-two-columns/hy-two-columns.tsx
+++ b/src/components/hy-two-columns/hy-two-columns.tsx
@@ -14,10 +14,10 @@ export class HyTwoColumns {
     return (
       <Host>
         <div class={classAttributes}>
-          <div class="hy-two-columns--main">
+          <div class="hy-two-columns__item hy-two-columns__item--main">
             <slot name="main"></slot>
           </div>
-          <div class="hy-two-columns--side">
+          <div class="hy-two-columns__item hy-two-columns__item--side">
             <slot name="side"></slot>
           </div>
         </div>
diff --git a/src/components/hy-two-columns/test/hy-two-columns.spec.tsx b/src/components/hy-two-columns/test/hy-two-columns.spec.tsx
index 9f22b323821c8ff135ca2719d894f02a40033384..c618870cacc66c64f95cda90956c50c421cdced8 100644
--- a/src/components/hy-two-columns/test/hy-two-columns.spec.tsx
+++ b/src/components/hy-two-columns/test/hy-two-columns.spec.tsx
@@ -14,10 +14,10 @@ describe('hy-two-columns', () => {
     expect(page.root).toEqualHtml(`
       <hy-two-columns>
         <div class="hy-two-columns">
-          <div class="hy-two-columns--main">
+          <div class="hy-two-columns__item hy-two-columns__item--main">
             <div slot="main"></div>
           </div>
-          <div class="hy-two-columns--side">
+          <div class="hy-two-columns__item hy-two-columns__item--side">
             <div slot="side"></div>
           </div>
         </div>
diff --git a/src/components/paragraph-text/paragraph-text.scss b/src/components/paragraph-text/paragraph-text.scss
index 8d3e459a46167095176f5affe5874ebcc9eaa710..8f34f87eb4d376f782c8931ef4de5e3f1287bd45 100644
--- a/src/components/paragraph-text/paragraph-text.scss
+++ b/src/components/paragraph-text/paragraph-text.scss
@@ -65,6 +65,10 @@
   p {
     margin-top: 0;
     padding-top: 0;
+
+    &:last-of-type {
+      margin-bottom: 0;
+    }
   }
 
   // When hy-paragraph-text is the first child it will not add spacing to top. Will fix heading + text spacing issue.