Sync styleguide 2026.05.18.1

docs/styleguide/components/interactive-elements.html

@@ -537,7 +537,7 @@
       <div class="sg-state-example">
         <p class="sg-state-example__label sg-table-label">form-invalid</p>
         <div class="sg-input-validation-stack sg-input-validation-stack--checkbox-invalid">
-          <label class="sg-checkbox-field-option sg-body" data-component="checkbox-field" data-component-state="default">
+          <label class="sg-checkbox-field-option" data-component="checkbox-field" data-component-state="default">
             <button class="sg-checkbox-field" type="button" role="checkbox" aria-checked="false" aria-label="Standard Checkbox mit Validierung" aria-invalid="true" aria-describedby="checkbox-invalid-feedback">
               <span class="sg-checkbox-field__mark" aria-hidden="true">✓</span>
             </button>

docs/styleguide/styles/10-components-interactive-elements.css

@@ -442,7 +442,7 @@
     }
 
     #component-checkbox-field .sg-input-validation-stack--checkbox-invalid {
-      gap: calc(var(--spacing-small) / 4);
+      gap: 0;
     }
 
     .sg-input-multi-line {

docs/styleguide/styles/25-patterns-form-sections.css

@@ -41,7 +41,7 @@
 }
 
 .sg-form-sections-card__chapter + .sg-form-sections-card__chapter {
-  margin-top: var(--spacing-large);
+  margin-top: calc(var(--spacing-large) * 2);
 }
 
 .sg-form-sections-card__chapter-title,