From 44758853688c947dc7e8b8e341de513ac6df63a8 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Mathias=20Gla=CC=88ser?= <mathias.glaeser@beaufort.ch>
Date: Thu, 28 May 2026 10:43:57 +0200
Subject: [PATCH] Add second group card variant with h2 heading

---
 components/cards.html | 31 +++++++++++++++++++++++++++++++
 1 file changed, 31 insertions(+)

diff --git a/components/cards.html b/components/cards.html
index 2ffaff8..950713a 100644
--- a/components/cards.html
+++ b/components/cards.html
@@ -166,6 +166,37 @@
       </article>
 
     </div>
+
+    <p class="sg-preview-label">Variante: Group Card mit H2 Überschrift</p>
+
+    <div class="sg-group-card" data-component="group-card">
+      <h2>Gruppenüberschrift</h2>
+
+      <article class="sg-card" data-component="card" data-component-context="group-card">
+        <div class="sg-card-segment sg-card-segment--header sg-card-segment--darkblue" data-component-part="card-header">
+          <div class="sg-strong">Card in Group</div>
+        </div>
+
+        <div class="sg-card-segment sg-card-segment--body" data-component-part="card-body">
+          <p class="sg-body">
+            Group Cards bündeln mehrere zusammengehörige Cards.
+          </p>
+        </div>
+      </article>
+
+      <article class="sg-card" data-component="card" data-component-context="group-card">
+        <div class="sg-card-segment sg-card-segment--header sg-card-segment--darkgreen" data-component-part="card-header">
+          <div class="sg-strong">Weitere Card</div>
+        </div>
+
+        <div class="sg-card-segment sg-card-segment--body" data-component-part="card-body">
+          <p class="sg-body">
+            Die Group Card enthält hier zusätzlich eine H2-Überschrift.
+          </p>
+        </div>
+      </article>
+
+    </div>
   </section>
 
   <!-- Component: Multisegment Card -->