Add pattern for split hero product banner.

This adds a new pattern for a hero product banner with a 50/50 split,
heading and CTA on left and product image on right.

Uses the Media + Text block.

patterns/hero-product-split.php

@@ -0,0 +1,32 @@
+<?php
+/**
+ * Title: WooCommerce Hero Product - Split
+ * Slug: woocommerce-blocks/hero-product-split
+ * Categories: WooCommerce
+ */
+?>
+
+<!-- wp:group {"layout":{"type":"constrained"}} -->
+<div class="wp-block-group">
+	<!-- wp:media-text {"align":"full","mediaPosition":"right","mediaId":718,"mediaLink":"http://woo-dev.test/https-unsplash-com-photos-qjqqaq1ctdm/","mediaType":"image","mediaSizeSlug":"full","imageFill":false,"backgroundColor":"contrast","textColor":"base"} -->
+	<div class="wp-block-media-text alignfull has-media-on-the-right is-stacked-on-mobile has-base-color has-contrast-background-color has-text-color has-background">
+		<div class="wp-block-media-text__content"><!-- wp:heading -->
+			<h2 class="wp-block-heading">Get cozy this fall with<br>flannel shirts</h2>
+			<!-- /wp:heading -->
+
+			<!-- wp:buttons {"style":{"spacing":{"margin":{"bottom":"var:preset|spacing|40"}}}} -->
+			<div class="wp-block-buttons" style="margin-bottom:var(--wp--preset--spacing--40)">
+				<!-- wp:button -->
+				<div class="wp-block-button"><a class="wp-block-button__link wp-element-button">Shop now</a></div>
+				<!-- /wp:button -->
+			</div>
+			<!-- /wp:buttons -->
+		</div>
+
+		<figure class="wp-block-media-text__media">
+			<img src="http://woo-dev.test/wp-content/uploads/2023/04/pattern-product-split-e1682368228386-1024x861.jpg" alt="" class="wp-image-718 size-full"/>
+		</figure>
+	</div>
+	<!-- /wp:media-text -->
+</div>
+<!-- /wp:group -->