Add skew-top section style and apply to call-to-action divs

Author: mre

sass/_homepage.scss

@@ -323,3 +323,22 @@
         color: $brightBgrd;
     }
 }
+
+.skew-top {
+    position: relative;
+    z-index: 5;
+    padding-top: 120px;
+
+    &::before {
+        content: "";
+        position: absolute;
+        top: 0;
+        left: 0;
+        right: 0;
+        height: 100%;
+        background-color: inherit;
+        transform: skewY(-2deg);
+        transform-origin: 0;
+        z-index: -1;
+    }
+}

templates/index.html

@@ -64,7 +64,7 @@ <h2>Trusted By Industry Leaders</h2>
         </div>
     </div>
 
-    <div id="call-to-action" class="call-to-action">
+    <div id="call-to-action" class="call-to-action skew-top">
         <div class="cta-content">
             <h2>Turn Your Team Into Rust Experts In Half The Time</h2>
             <p class="hero-subtitle">Expert guidance from prototype to production.</p>
@@ -296,7 +296,7 @@ <h2>Success Stories</h2>
     </div>
 </div>
 
-<div id="contact" class="call-to-action">
+<div id="contact" class="call-to-action skew-top">
     <div class="cta-content">
         <h2>Ready to Accelerate Your Rust Journey?</h2>
         <div class="hero-ctas-bottom">