system
You are an assistant that generates WordPress patterns.
user
Feature a product category in the main banner of a homepage with an H1 heading, description, button call to action. Highlight two products or subcategories with an image and short description. Includes bottom bar for linking to sub categories quickly.
assistant
<!-- wp:group {"align":"full","style":{"color":{"background":"#f7f2ea"},"spacing":{"padding":{"top":"0","right":"0","bottom":"0","left":"0"}}},"layout":{"type":"constrained","contentSize":"100%"}} -->
<div class="wp-block-group alignfull has-background" style="background-color:#f7f2ea;padding-top:0;padding-right:0;padding-bottom:0;padding-left:0"><!-- wp:group {"align":"wide","style":{"spacing":{"padding":{"top":"var:preset|spacing|60","right":"var:preset|spacing|60","bottom":"var:preset|spacing|60","left":"var:preset|spacing|60"}}},"layout":{"type":"constrained","contentSize":"1200px"}} -->
<div class="wp-block-group alignwide" style="padding-top:var(--wp--preset--spacing--60);padding-right:var(--wp--preset--spacing--60);padding-bottom:var(--wp--preset--spacing--60);padding-left:var(--wp--preset--spacing--60)"><!-- wp:columns {"verticalAlignment":"center","style":{"spacing":{"blockGap":{"top":"var:preset|spacing|60","left":"var:preset|spacing|60"},"padding":{"top":"0","right":"0","bottom":"0","left":"0"},"margin":{"top":"0","bottom":"0"}}}} -->
<div class="wp-block-columns are-vertically-aligned-center" style="margin-top:0;margin-bottom:0;padding-top:0;padding-right:0;padding-bottom:0;padding-left:0"><!-- wp:column {"verticalAlignment":"center"} -->
<div class="wp-block-column is-vertically-aligned-center"><!-- wp:paragraph {"style":{"spacing":{"margin":{"top":"0","right":"0","bottom":"10px","left":"0"}},"typography":{"fontSize":"16px"}}} -->
<p style="margin-top:0;margin-right:0;margin-bottom:10px;margin-left:0;font-size:16px"><strong>HATS</strong></p>
<!-- /wp:paragraph -->

<!-- wp:heading {"level":1,"style":{"spacing":{"margin":{"top":"0"}},"color":{"text":"#2f7f33"}},"fontSize":"large"} -->
<h1 class="wp-block-heading has-text-color has-large-font-size" style="color:#2f7f33;margin-top:0">Shop sustainable hats</h1>
<!-- /wp:heading -->

<!-- wp:paragraph {"style":{"typography":{"fontSize":"21px"}}} -->
<p style="font-size:21px">All our hats are made to order using the finest, organic materials.</p>
<!-- /wp:paragraph -->

<!-- wp:buttons -->
<div class="wp-block-buttons"><!-- wp:button {"textColor":"white","style":{"color":{"background":"#2f7f33"},"border":{"radius":"0px"}}} -->
<div class="wp-block-button"><a class="wp-block-button__link has-white-color has-text-color has-background wp-element-button" href="#" style="border-radius:0px;background-color:#2f7f33"><strong>Find a Hat</strong></a></div>
<!-- /wp:button --></div>
<!-- /wp:buttons --></div>
<!-- /wp:column -->

<!-- wp:column {"verticalAlignment":"center"} -->
<div class="wp-block-column is-vertically-aligned-center"><!-- wp:group {"align":"wide","style":{"spacing":{"padding":{"top":"0","right":"0","bottom":"0","left":"0"}},"border":{"radius":"0rem","color":"#e9dccb","style":"solid","width":"2px"},"color":{"background":"#f9f9f8"}},"layout":{"type":"constrained"}} -->
<div class="wp-block-group alignwide has-border-color has-background" style="border-color:#e9dccb;border-style:solid;border-width:2px;border-radius:0rem;background-color:#f9f9f8;padding-top:0;padding-right:0;padding-bottom:0;padding-left:0"><!-- wp:media-text {"mediaType":"image","mediaWidth":29,"mediaSizeSlug":"medium","imageFill":false,"style":{"spacing":{"padding":{"top":"10px","right":"10px","bottom":"10px","left":"10px"}}}} -->
<div class="wp-block-media-text alignwide is-stacked-on-mobile" style="padding-top:10px;padding-right:10px;padding-bottom:10px;padding-left:10px;grid-template-columns:29% auto"><figure class="wp-block-media-text__media"><img src="https://images.rawpixel.com/image_1300/czNmcy1wcml2YXRlL3Jhd3BpeGVsX2ltYWdlcy93ZWJzaXRlX2NvbnRlbnQvbHIvZmw4NDg5NDkwNTAzLWltYWdlLWt5YmVoc3VhLmpwZw.jpg" alt="" /></figure><div class="wp-block-media-text__content"><!-- wp:paragraph {"placeholder":"المحتوى…","style":{"typography":{"fontSize":"18px"}}} -->
<p style="font-size:18px">The softest beanies ever! Over 100 color options!</p>
<!-- /wp:paragraph --></div></div>
<!-- /wp:media-text --></div>
<!-- /wp:group -->

<!-- wp:group {"align":"wide","style":{"spacing":{"padding":{"top":"0","right":"0","bottom":"0","left":"0"}},"border":{"radius":"0rem","color":"#e9dccb","width":"2px"},"color":{"background":"#f9f9f8"}},"layout":{"type":"constrained"}} -->
<div class="wp-block-group alignwide has-border-color has-background" style="border-color:#e9dccb;border-width:2px;border-radius:0rem;background-color:#f9f9f8;padding-top:0;padding-right:0;padding-bottom:0;padding-left:0"><!-- wp:media-text {"mediaPosition":"right","mediaType":"image","mediaWidth":31,"mediaSizeSlug":"medium","style":{"spacing":{"padding":{"top":"10px","right":"10px","bottom":"10px","left":"10px"}}}} -->
<div class="wp-block-media-text alignwide has-media-on-the-right is-stacked-on-mobile" style="padding-top:10px;padding-right:10px;padding-bottom:10px;padding-left:10px;grid-template-columns:auto 31%"><div class="wp-block-media-text__content"><!-- wp:paragraph {"placeholder":"المحتوى…","style":{"typography":{"fontSize":"18px"}}} -->
<p style="font-size:18px">Custom fitted baseball caps! Add a team logo!</p>
<!-- /wp:paragraph --></div><figure class="wp-block-media-text__media"><img src="https://images.rawpixel.com/image_1300/czNmcy1wcml2YXRlL3Jhd3BpeGVsX2ltYWdlcy93ZWJzaXRlX2NvbnRlbnQvbHIvZmwzNjQ2NjU5OTIxMy1wdWJsaWMtaW1hZ2Uta293c2ZsY2Eta3plbDJ1enAuanBn.jpg" alt="" /></figure></div>
<!-- /wp:media-text --></div>
<!-- /wp:group --></div>
<!-- /wp:column --></div>
<!-- /wp:columns --></div>
<!-- /wp:group -->

<!-- wp:group {"align":"full","style":{"color":{"background":"#e9dccb"},"spacing":{"padding":{"top":"15px","right":"var:preset|spacing|60","bottom":"15px","left":"var:preset|spacing|60"},"margin":{"top":"0","bottom":"0"}}},"layout":{"type":"constrained","contentSize":"1200px"}} -->
<div class="wp-block-group alignfull has-background" style="background-color:#e9dccb;margin-top:0;margin-bottom:0;padding-top:15px;padding-right:var(--wp--preset--spacing--60);padding-bottom:15px;padding-left:var(--wp--preset--spacing--60)"><!-- wp:group {"style":{"spacing":{"blockGap":"var:preset|spacing|50","padding":{"top":"0","right":"0","bottom":"0","left":"0"}}},"layout":{"type":"flex","flexWrap":"nowrap","justifyContent":"left"}} -->
<div class="wp-block-group" style="padding-top:0;padding-right:0;padding-bottom:0;padding-left:0"><!-- wp:paragraph {"style":{"typography":{"fontSize":"16px"}}} -->
<p style="font-size:16px"><strong>Browse other categories:</strong></p>
<!-- /wp:paragraph -->

<!-- wp:group {"style":{"elements":{"link":{"color":{"text":"#2f7f33"}}},"spacing":{"blockGap":"var:preset|spacing|40"}},"layout":{"type":"flex","flexWrap":"wrap"}} -->
<div class="wp-block-group has-link-color"><!-- wp:paragraph {"style":{"elements":{"link":{"color":{"text":"#2f7f33"}}},"typography":{"fontSize":"16px"}}} -->
<p class="has-link-color" style="font-size:16px"><a href="#">Sweatshirts</a></p>
<!-- /wp:paragraph -->

<!-- wp:paragraph {"style":{"elements":{"link":{"color":{"text":"#2f7f33"}}},"typography":{"fontSize":"16px"}}} -->
<p class="has-link-color" style="font-size:16px"><a href="#">T-Shirts</a></p>
<!-- /wp:paragraph -->

<!-- wp:paragraph {"style":{"color":{"text":"#2f7f33"},"typography":{"fontSize":"16px"}}} -->
<p class="has-text-color" style="color:#2f7f33;font-size:16px"><a href="#">Joggers</a></p>
<!-- /wp:paragraph --></div>
<!-- /wp:group --></div>
<!-- /wp:group --></div>
<!-- /wp:group --></div>
<!-- /wp:group -->