feat(copy-module): respect visualStyle field now

assets/stylesheets/landing-page/modules/copy.css

@@ -0,0 +1,64 @@
+@block module-copy {
+  @modifier emphasized {
+    display: flex;
+    justify-content: space-between;
+    flex-wrap: wrap;
+    padding: calc(var(--grid-gutter) * 0.75) 0;
+    background-color: var(--module-copy-emphasized-bg);
+    border-radius: var(--border-radius);
+    color: var(--module-copy-emphasized-color);
+
+    @media (--breakpoint-desktop) {
+      flex-wrap: nowrap;
+    }
+  }
+
+  @element first {
+    @modifier emphasized {
+      flex: 1 1 auto;
+      width: 50vw;
+      padding: 0 var(--grid-gutter);
+
+      @media (--breakpoint-desktop) {
+        padding-left: var(--grid-gutter);
+      }
+    }
+  }
+
+  @element second {
+    @modifier emphasized {
+      flex: 1 1 auto;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+
+      @media (--breakpoint-desktop) {
+        flex: 1 1 auto;
+        padding: 0 var(--grid-gutter);
+        width: 20vw;
+      }
+    }
+  }
+
+
+  @element headline {
+    @modifier emphasized {
+      color: var(--module-copy-emphasized-headlines-color);
+      font-size: 1.25em;
+    }
+  }
+
+  @element copy {
+    @modifier emphasized {
+      font-size: 0.875em;
+    }
+  }
+
+  @element cta {
+    @modifier emphasized {
+      background-color: var(--module-copy-emphasized-cta-bg);
+      color: var(--module-copy-emphasized-cta-color);
+      margin-bottom: 0;
+    }
+  }
+}

assets/stylesheets/landing-page/modules/index.css

@@ -1,3 +1,4 @@
+@import './copy';
 @import './hero-image';
 @import './highlighted-course';
 

assets/stylesheets/variables.css

@@ -58,6 +58,12 @@
   --cta-bg-hover: var(--color-palette-blue-medium);
   --cta-radius: 3px;
 
+  --module-copy-emphasized-bg: #8091a5;
+  --module-copy-emphasized-color: #c3cfd5;
+  --module-copy-emphasized-headlines-color: #fff;
+  --module-copy-emphasized-cta-bg: #536171;
+  --module-copy-emphasized-cta-color: #fff;
+
   --code-bg: var(--color-bg-grey);
   --code-trigger-bg: color(var(--color-bg-grey) shade(20%));
   --code-trigger-bg-active: var(--code-bg);