From 9b3639c850098a269ba2aeb021d511c4d6914846 Mon Sep 17 00:00:00 2001
From: Kurtis Holsapple <kurtis@openfunctioncomputers.com>
Date: Wed, 7 May 2025 13:34:26 -0700
Subject: [PATCH] WIP

---
 dist/app.css                          | 18 ++++++++++++++++++
 dist/mix-manifest.json                |  2 +-
 src/scss/flex-multiblock-callout.scss | 22 ++++++++++++++++++++++
 tpl/flex_multiblock_callout.tpl       |  4 ++--
 4 files changed, 43 insertions(+), 3 deletions(-)

diff --git a/dist/app.css b/dist/app.css
index e7f73eb..d9a982f 100644
--- a/dist/app.css
+++ b/dist/app.css
@@ -12101,6 +12101,24 @@ section.multiblock-callout h2, section.multiblock-callout .h2 {
 }
 section.multiblock-callout .callouts-wrapper .callout {
   padding-left: 3rem;
+  display: flex;
+  gap: 1rem;
+}
+section.multiblock-callout .callouts-wrapper .callout .image-wrapper {
+  width: 31px;
+  flex-shrink: 0;
+}
+section.multiblock-callout .callouts-wrapper .callout .content {
+  border-left: 1px solid #fff;
+  padding-left: 1rem;
+}
+section.multiblock-callout .callouts-wrapper .callout .content p {
+  margin-bottom: 0;
+}
+section.multiblock-callout .callouts-wrapper .callout .content p.headline {
+  color: #B9AF78;
+  font-size: 30px;
+  line-height: 34px;
 }
 
 .team-members .team-members-wrapper {
diff --git a/dist/mix-manifest.json b/dist/mix-manifest.json
index a7941f1..75815d5 100644
--- a/dist/mix-manifest.json
+++ b/dist/mix-manifest.json
@@ -1,4 +1,4 @@
 {
     "/app.js": "/app.js?id=099e96d934e937b07341f2ca9fb82ec2",
-    "/app.css": "/app.css?id=498a9c9c5655b675b5fc2248a3716116"
+    "/app.css": "/app.css?id=d248386ce132f1f5097afc85bbef6d61"
 }
diff --git a/src/scss/flex-multiblock-callout.scss b/src/scss/flex-multiblock-callout.scss
index 92da1a8..f456f99 100644
--- a/src/scss/flex-multiblock-callout.scss
+++ b/src/scss/flex-multiblock-callout.scss
@@ -17,6 +17,28 @@ section.multiblock-callout {
     .callouts-wrapper {
         .callout {
             padding-left: 3rem;
+            display: flex;
+            gap: 1rem;
+
+            .image-wrapper {
+                width: 31px;
+                flex-shrink: 0;
+            }
+
+            .content {
+                border-left: 1px solid $c-white;
+                padding-left: 1rem;
+
+                p {
+                    margin-bottom: 0;
+
+                    &.headline {
+                        color: $c-tan;
+                        font-size: 30px;
+                        line-height: 34px;
+                    }
+                }
+            }
         }
     }
 }
diff --git a/tpl/flex_multiblock_callout.tpl b/tpl/flex_multiblock_callout.tpl
index e8beccc..08da803 100644
--- a/tpl/flex_multiblock_callout.tpl
+++ b/tpl/flex_multiblock_callout.tpl
@@ -15,8 +15,8 @@
                         </div>
 
                         <div class="content">
-                            {{ headline }}
-                            {{ description }}
+                            <p class="headline">{{ headline }}</p>
+                            <p>{{ description }}</p>
                         </div>
                     </div>
                 {{/each}}