Invert image order in beforeafter block preview

- Image "before" now displays on top (left side, clipped at 50%)
- Image "after" displays below (visible on right side)
- Update text block to support bullet lists
- Add heading fieldset to report blueprint

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

site/plugins/beforeafter/src/components/BeforeAfterBlock.vue

@@ -1,18 +1,18 @@
 <template>
   <div @click="$emit('open')" class="beforeafter-preview">
     <div v-if="hasImages" class="beforeafter-preview__images">
-      <img
-        v-if="imageBeforeUrl"
-        :src="imageBeforeUrl"
-        class="beforeafter-preview__image beforeafter-preview__image--before"
-        alt="Avant"
-      />
       <img
         v-if="imageAfterUrl"
         :src="imageAfterUrl"
         class="beforeafter-preview__image beforeafter-preview__image--after"
         alt="Après"
       />
+      <img
+        v-if="imageBeforeUrl"
+        :src="imageBeforeUrl"
+        class="beforeafter-preview__image beforeafter-preview__image--before"
+        alt="Avant"
+      />
       <div v-if="imageBeforeUrl && imageAfterUrl" class="beforeafter-preview__divider"></div>
     </div>
 
@@ -81,7 +81,7 @@ const hasImages = computed(() => {
   object-fit: cover;
 }
 
-.beforeafter-preview__image--after {
+.beforeafter-preview__image--before {
   clip-path: polygon(0 0, 50% 0, 50% 100%, 0 100%);
 }