From b92c36fe8431e223b7b40404773d478811b9cec6 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Mathias=20Gla=CC=88ser?= <mathias.glaeser@beaufort.ch>
Date: Wed, 10 Jun 2026 17:27:10 +0200
Subject: [PATCH] Align register form spacing to pattern

---
 patterns/vsf-register-step-1.html         | 70 +++++++++++------------
 styles/35-layouts-vsf-register-step-1.css |  4 --
 2 files changed, 34 insertions(+), 40 deletions(-)

diff --git a/patterns/vsf-register-step-1.html b/patterns/vsf-register-step-1.html
index 7739c56..1b16a12 100644
--- a/patterns/vsf-register-step-1.html
+++ b/patterns/vsf-register-step-1.html
@@ -49,46 +49,44 @@
       <div class="sg-card-segment sg-card-segment--body sg-object-card__content" data-pattern-part="object-card-content">
         <p class="sg-body">Teste ValueStockFinder 7 Tage kostenlos und unverbindlich. Erhalte direkten Zugriff auf fundierte Aktienanalysen, klare Bewertungen und übersichtliche Entscheidungshilfen – ohne Verpflichtung.</p>
       </div>
-      <footer class="sg-card-segment sg-card-segment--gray sg-vsf-register-step-1__form-segment" aria-label="Registrierungsformular">
-        <div class="sg-form-sections-card-wrapper" data-pattern="form-sections" aria-label="Formular mit Abschnitten">
-          <form class="sg-form-sections-card" action="#" method="post">
-            <div class="sg-form-sections-card__body" data-pattern-part="form-body">
-              <h2 class="sg-strong sg-form-sections-card__title">Formular</h2>
+      <div class="sg-form-sections-card-wrapper" data-pattern="form-sections" aria-label="Formular mit Abschnitten">
+        <form class="sg-form-sections-card" action="#" method="post">
+          <div class="sg-form-sections-card__body" data-pattern-part="form-body">
+            <h2 class="sg-strong sg-form-sections-card__title">Formular</h2>
 
-              <div class="sg-form-sections-card__field-group">
-                <label class="sg-labeled-input-row">
-                  <span class="sg-label">E-Mail</span>
-                  <input
-                    class="sg-interaction-element sg-input-single-line sg-input-single-line--inactive-selectable sg-form-inactive-selectable"
-                    type="email"
-                    placeholder="E-Mail eingeben"
-                    aria-label="E-Mail"
-                    autocomplete="email"
-                  >
-                </label>
+            <div class="sg-form-sections-card__field-group">
+              <label class="sg-labeled-input-row">
+                <span class="sg-label">E-Mail</span>
+                <input
+                  class="sg-interaction-element sg-input-single-line sg-input-single-line--inactive-selectable sg-form-inactive-selectable"
+                  type="email"
+                  placeholder="E-Mail eingeben"
+                  aria-label="E-Mail"
+                  autocomplete="email"
+                >
+              </label>
 
-                <label class="sg-labeled-input-row">
-                  <span class="sg-label">Passwort</span>
-                  <input
-                    class="sg-interaction-element sg-input-single-line sg-input-single-line--inactive-selectable sg-form-inactive-selectable"
-                    type="password"
-                    placeholder="Passwort eingeben"
-                    aria-label="Passwort"
-                    autocomplete="new-password"
-                  >
-                </label>
-              </div>
+              <label class="sg-labeled-input-row">
+                <span class="sg-label">Passwort</span>
+                <input
+                  class="sg-interaction-element sg-input-single-line sg-input-single-line--inactive-selectable sg-form-inactive-selectable"
+                  type="password"
+                  placeholder="Passwort eingeben"
+                  aria-label="Passwort"
+                  autocomplete="new-password"
+                >
+              </label>
             </div>
+          </div>
 
-            <footer class="sg-form-sections-card__actions-segment" data-pattern-part="form-actions-segment">
-              <div class="sg-form-sections-card__actions" data-pattern-part="form-actions">
-                <button class="sg-interaction-element sg-button sg-button--active sg-form-sections-card__action" type="button">Abbrechen</button>
-                <button class="sg-interaction-element sg-button sg-button--process sg-button--process-inactive sg-form-sections-card__action" type="submit" disabled aria-disabled="true">Registrieren</button>
-              </div>
-            </footer>
-          </form>
-        </div>
-      </footer>
+          <footer class="sg-form-sections-card__actions-segment" data-pattern-part="form-actions-segment">
+            <div class="sg-form-sections-card__actions" data-pattern-part="form-actions">
+              <button class="sg-interaction-element sg-button sg-button--active sg-form-sections-card__action" type="button">Abbrechen</button>
+              <button class="sg-interaction-element sg-button sg-button--process sg-button--process-inactive sg-form-sections-card__action" type="submit" disabled aria-disabled="true">Registrieren</button>
+            </div>
+          </footer>
+        </form>
+      </div>
     </article>
   </main>
 
diff --git a/styles/35-layouts-vsf-register-step-1.css b/styles/35-layouts-vsf-register-step-1.css
index e211212..54a46dd 100644
--- a/styles/35-layouts-vsf-register-step-1.css
+++ b/styles/35-layouts-vsf-register-step-1.css
@@ -20,7 +20,3 @@
   max-width: var(--layout-object-card-max-width);
   margin: 0 auto;
 }
-
-.sg-vsf-register-step-1__form-segment {
-  padding: 0;
-}