@@ -3,7 +3,10 @@

   @include media-breakpoint-up(lg) {

     display: block;

-    position: sticky;

+    height: $benefits-bar-height;

+    overflow: hidden;

+    position: fixed;

+    width: 100%;

     top: 0;

     z-index: 100;

     background-color: $dark;

@@ -32,6 +35,7 @@

 // Header

 header.header-main {

+  margin-top: $benefits-bar-height;

   padding: 2.5rem .25rem 1rem;

 }

@@ -3,6 +3,8 @@

 @import 'areas/main';

 @import 'areas/footer';

+@import 'components/cms-sections';

+

 @import 'scaffolding/typo';

 @import 'scaffolding/lists';

 @import 'scaffolding/tables';

new file mode 100644

@@ -0,0 +1,9 @@

+.cms-section.sticky-sidebar {

+    overflow: visible;

+}

+

+.cms-section.sticky-sidebar .cms-section-sidebar-sidebar-content {

+    position: sticky;

+    top: $benefits-bar-height;

+    align-self: flex-start;

+}

\ No newline at end of file

@@ -39,7 +39,6 @@ $green: #3cc261;

 $blue: #26b6cf;

 $primary: $beige;

-//$secondary: #CDC6C3;

 $secondary: $light;

 $body-color: $dark;

@@ -69,6 +68,8 @@ $input-font-weight: $font-weight-light;

+$benefits-bar-height: 52px;

+

 :root{

   --animate-duration: .5s;

   --bs-body-color-inverse: #{$body-color-inverse};

@@ -1,65 +1,116 @@

-.is-ctl-product {

-  nav[aria-label="breadcrumb"] {

-    display: none;

-  }

-

-  .product-detail {

-    padding-top: 2.5rem;

-    @include media-breakpoint-up(md) {

-      padding-top: 3.5rem;

-    }

+.is-active-route-frontend-detail-page {

-    .product-detail-content {

-      .product-detail-delivery-information:not(:has(p)) {

-        display: none;

+  .cms-section-sidebar {

+    .cms-section-sidebar-sidebar-content.col-lg-4.col-xl-3,

+    .cms-section-sidebar-main-content.col-lg-8.col-xl-9 {

+      @include media-breakpoint-up(lg) {

+        width: 50%;

       }

+    }

-      .product-detail-price-container {

-        p.product-price.product-detail-price {

-          @include font-size(40px);

-          margin: 0;

-        }

+    .cms-section-sidebar-sidebar-content {

+      @include media-breakpoint-up(lg) {

+        display: flex;

+        flex-direction: column;

+        align-items: flex-end;

       }

+    }

-      .buy-widget-container {

-        flex-flow: nowrap;

+    .cms-section-sidebar-main-content .cms-block-gallery-buybox  .product-detail-media {

+      @include media-breakpoint-up(lg) {

+        display: none;

       }

+    }

+  }

-      .product-detail-tax-container {

-        p.product-detail-tax {

-          font-size: 0.75rem;

-

-          a.product-detail-tax-link {

-            color: $body-color;

-            &:hover {

-              color: $primary;

-            }

-          }

-        }

-      }

+  .product-heading-name-container {

+    .lage {

+      font-size: rfs-value(22px);

     }

-    .product-detail-cross-selling {

-      h2 {

-        @extend %special-headline;

-      }

+    h1 {

+      padding: .4rem 0;

+      font-size: rfs-value(28px);

+      margin: 0;

     }

-  }

-}

+    .weinlinie {

+      color: $primary;

+      font-size: rfs-value(22px);

-#productDetailPageBuyProductForm {

-  .row.g-2.mt-0.justify-content-end {

-    justify-content: flex-start !important;

-    padding-left: calc((var(--bs-gutter-x) * .25) + 25%) !important;

+      &::before {

+        content: open-quote;

+      }

-    .paypal-buttons {

-      width: 189px;

+      &::after {

+        content: close-quote;

+      }

     }

   }

-

-  .btn-buy {

-    width: 189px;

-  }

-}

\ No newline at end of file

+}

+//.is-ctl-product {

+//  nav[aria-label="breadcrumb"] {

+//    display: none;

+//  }

+//

+//  .product-detail {

+//    padding-top: 2.5rem;

+//    @include media-breakpoint-up(md) {

+//      padding-top: 3.5rem;

+//    }

+//

+//    .product-detail-content {

+//      .product-detail-delivery-information:not(:has(p)) {

+//        display: none;

+//      }

+//

+//      .product-detail-price-container {

+//        p.product-price.product-detail-price {

+//          @include font-size(40px);

+//          margin: 0;

+//        }

+//      }

+//

+//      .buy-widget-container {

+//        flex-flow: nowrap;

+//      }

+//

+//      .product-detail-tax-container {

+//        p.product-detail-tax {

+//          font-size: 0.75rem;

+//

+//          a.product-detail-tax-link {

+//            color: $body-color;

+//

+//            &:hover {

+//              color: $primary;

+//            }

+//          }

+//        }

+//      }

+//    }

+//

+//    .product-detail-cross-selling {

+//      h2 {

+//        @extend %special-headline;

+//      }

+//    }

+//  }

+//}

+//

+//

+//#productDetailPageBuyProductForm {

+//  .row.g-2.mt-0.justify-content-end {

+//    justify-content: flex-start !important;

+//    padding-left: calc((var(--bs-gutter-x) * .25) + 25%) !important;

+//

+//    .paypal-buttons {

+//      width: 189px;

+//    }

+//  }

+//

+//  .btn-buy {

+//    width: 189px;

+//  }

+//}

\ No newline at end of file

new file mode 100644

@@ -0,0 +1,16 @@

+{% sw_extends '@Storefront/storefront/block/cms-block-product-heading.html.twig' %}

+

+{% from '@WeinmanufakturTheme/storefront/utilities/macros.html.twig' import get_product_property %}

+

+{% block block_product_heading %}

+    {% set productNameElement = block.slots.getSlot('left') %}

+    {% block block_product_heading_product_name_element %}

+        <div class="col product-heading-name-container" data-cms-element-id="{{ productNameElement.id }}">

+            <div>{{ get_product_property('Lage', page.product) }}</div>

+            {% block block_product_heading_product_name_inner %}

+                {{ parent() }}

+            {% endblock %}

+            <div>{{ get_product_property('Weinlinie', page.product) }}</div>

+        </div>

+    {% endblock %}

+{% endblock %}

\ No newline at end of file

new file mode 100644

@@ -0,0 +1,3 @@

+{% macro get_product_property(name, product) %}

+    {{- (product.properties|filter(property => property.group.name == name)|first).name -}}

+{% endmacro %}