add option to invert header filter

assets/sass/_theme/_configuration.sass

@@ -172,6 +172,7 @@ $header-logo-height: 32px !default
 $header-logo-height-md: $header-logo-height !default
 $header-height: 99px !default
 $header-height-md: 74px !default
+$header-sticky-invert-logo: false !default
 
 // Navs
 $body-overlay-color: rgba(0, 0, 0, 0.3) !default

assets/sass/_theme/design-system/header.sass

@@ -37,6 +37,9 @@ header[role="banner"]
                 text-decoration-color: transparent
             span
                 color: $header-sticky-color
+        @if $header-sticky-invert-logo
+            .logo img
+                filter: invert(1)
     html.is-scrolling-down:not(.has-menu-opened) &
         @include media-breakpoint-down(md)
             transform: translateY(-100%)
@@ -48,5 +51,7 @@ header[role="banner"]
             display: block
             height: $header-logo-height
             width: auto
+            @if $header-sticky-invert-logo
+                transition: filter $header-sticky-transition
             @include media-breakpoint-up(md)
                 height: $header-logo-height-md