Add heading to public page text and picture pattern

patterns/public-page-patterns.html

@@ -41,6 +41,8 @@
       <div class="sg-preview-area">
         <div class="sg-content-group-box" data-component="content-group-box">
           <div class="sg-public-page-pattern-text-and-picture-right" data-pattern="text-and-picture-right">
+            <h2 class="sg-sub-heading">Überschrift</h2>
+
             <div class="sg-public-page-pattern-text-and-picture-right__text">
               <p class="sg-body">
                 Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed non risus. Suspendisse lectus tortor, dignissim sit amet, adipiscing nec, ultricies sed, dolor. Cras elementum ultrices diam. Maecenas ligula massa, varius a, semper congue, euismod non, mi. Praesent eget sem vel lacus luctus blandit eu in massa.

styles/45-patterns-public-page-patterns.css

@@ -22,6 +22,12 @@
   color: var(--text-public-page-pattern-text-picture);
 }
 
+.sg-public-page-pattern-text-and-picture-right > .sg-sub-heading {
+  grid-column: 1 / -1;
+  margin: 0;
+  color: var(--text-public-page-pattern-text-picture);
+}
+
 .sg-public-page-pattern-text-and-picture-right__text {
   grid-area: text;
   min-width: 0;