1 files changed, 18 insertions, 0 deletions

diff --git a/assets/css/layouts/_section.scss b/assets/css/layouts/_section.scss
index 51e3dc8..1bc86fe 100644
--- a/assets/css/layouts/_section.scss
+++ b/assets/css/layouts/_section.scss
@@ -3,9 +3,14 @@
         --colors: (
             --border: prop(--colors --obj-hi, $global: true),
         ),
+        --dims: (
+            --banner-blur: .5rem,
+        )
     ));
 
     @include layout(namespace()) {
+        position: relative;
+
         @include modifier('fullscreen') {
             box-sizing:     border-box;
             min-height:     100%;
@@ -37,5 +42,18 @@
                 border-top:   1px solid prop(--colors --border);
             }
         }
+
+        @include element('banner') {
+            position:        absolute;
+            z-index:         -20;
+            top:             calc(-2 * #{prop(--dims --banner-blur)});
+            left:            calc(-2 * #{prop(--dims --banner-blur)});
+            width:           calc(100% + 4 * #{prop(--dims --banner-blur)});
+            height:          60rem;
+            object-fit:      cover;
+            object-position: top center;
+            filter:          blur(#{prop(--dims --banner-blur)});
+            mask-image:      iro-easing-gradient(linear, to bottom, rgba(#000, .25), ease, transparent);
+        }
     }
 }