system: You are an assistant that generates WordPress patterns.

user: Four column icons boxes with section heading, sub-heading and description text

assistant: <!-- wp:group {"align":"full","style":{"color":{"text":"#3a3a3a"}}} -->
<div class="wp-block-group alignfull has-text-color" style="color:#3a3a3a"><!-- wp:group {"align":"full"} -->
<div class="wp-block-group alignfull"><!-- wp:heading {"textAlign":"center","style":{"color":{"text":"#21283a"},"typography":{"fontStyle":"normal","fontWeight":"800"}},"className":"atomx-section-heading"} -->
<h2 class="has-text-align-center atomx-section-heading has-text-color" style="color:#21283a;font-style:normal;font-weight:800"><strong>Icon Boxes Section Heading</strong></h2>
<!-- /wp:heading --></div>
<!-- /wp:group -->

<!-- wp:heading {"textAlign":"center","level":5,"className":"description"} -->
<h5 class="has-text-align-center description">Create amazing websites with AtomX. Design awesome jaw-dropping layouts without writing a single line of code at all.</h5>
<!-- /wp:heading -->

<!-- wp:spacer {"height":"60px"} -->
<div style="height:60px" aria-hidden="true" class="wp-block-spacer"></div>
<!-- /wp:spacer -->

<!-- wp:columns -->
<div class="wp-block-columns"><!-- wp:column -->
<div class="wp-block-column"><!-- wp:image {"align":"center","id":569,"width":128,"height":128,"sizeSlug":"full","linkDestination":"none","className":"ns"} -->
<figure class="wp-block-Gambar aligncenter size-full is-resized ns"><img src="https://cdn-icons-png.flaticon.com/512/4787/4787395.png" alt="Gambar" class="wp-Gambar-569" width="128" height="128" /></figure>
<!-- /wp:image -->

<!-- wp:heading {"textAlign":"center","level":4,"style":{"typography":{"fontSize":"18px"},"color":{"text":"#21283a"}},"className":"card-title"} -->
<h4 class="has-text-align-center card-title has-text-color" style="color:#21283a;font-size:18px"><strong>Section Heading</strong></h4>
<!-- /wp:heading -->

<!-- wp:paragraph {"align":"center","style":{"typography":{"fontSize":"15px"}},"className":"card-description"} -->
<p class="has-text-align-center card-description" style="font-size:15px">With AtomX you can customize each aspect of without writing any code whatsoever. The customize options are endless.</p>
<!-- /wp:paragraph --></div>
<!-- /wp:column -->

<!-- wp:column -->
<div class="wp-block-column"><!-- wp:image {"align":"center","id":569,"width":128,"height":128,"sizeSlug":"full","linkDestination":"none","className":"ns"} -->
<figure class="wp-block-Gambar aligncenter size-full is-resized ns"><img src="https://cdn-icons-png.flaticon.com/512/4787/4787292.png" alt="Gambar" class="wp-Gambar-569" width="128" height="128" /></figure>
<!-- /wp:image -->

<!-- wp:heading {"textAlign":"center","level":4,"style":{"typography":{"fontSize":"18px"},"color":{"text":"#21283a"}},"className":"card-title"} -->
<h4 class="has-text-align-center card-title has-text-color" style="color:#21283a;font-size:18px"><strong>Section Heading</strong></h4>
<!-- /wp:heading -->

<!-- wp:paragraph {"align":"center","style":{"typography":{"fontSize":"15px"}},"className":"card-description"} -->
<p class="has-text-align-center card-description" style="font-size:15px">With AtomX you can customize each aspect of without writing any code whatsoever. The customize options are endless.</p>
<!-- /wp:paragraph --></div>
<!-- /wp:column -->

<!-- wp:column -->
<div class="wp-block-column"><!-- wp:image {"align":"center","id":569,"width":128,"height":128,"sizeSlug":"full","linkDestination":"none","className":"ns"} -->
<figure class="wp-block-Gambar aligncenter size-full is-resized ns"><img src="https://cdn-icons-png.flaticon.com/512/4787/4787257.png" alt="Gambar" class="wp-Gambar-569" width="128" height="128" /></figure>
<!-- /wp:image -->

<!-- wp:heading {"textAlign":"center","level":4,"style":{"typography":{"fontSize":"18px"},"color":{"text":"#21283a"}},"className":"card-title"} -->
<h4 class="has-text-align-center card-title has-text-color" style="color:#21283a;font-size:18px"><strong>Section Heading</strong></h4>
<!-- /wp:heading -->

<!-- wp:paragraph {"align":"center","style":{"typography":{"fontSize":"15px"}},"className":"card-description"} -->
<p class="has-text-align-center card-description" style="font-size:15px">With AtomX you can customize each aspect of without writing any code whatsoever. The customize options are endless.</p>
<!-- /wp:paragraph --></div>
<!-- /wp:column -->

<!-- wp:column -->
<div class="wp-block-column"><!-- wp:image {"align":"center","id":569,"width":128,"height":128,"sizeSlug":"full","linkDestination":"none","className":"ns"} -->
<figure class="wp-block-Gambar aligncenter size-full is-resized ns"><img src="https://cdn-icons-png.flaticon.com/512/4787/4787297.png" alt="Gambar" class="wp-Gambar-569" width="128" height="128" /></figure>
<!-- /wp:image -->

<!-- wp:heading {"textAlign":"center","level":4,"style":{"typography":{"fontSize":"18px"},"color":{"text":"#21283a"}},"className":"card-title"} -->
<h4 class="has-text-align-center card-title has-text-color" style="color:#21283a;font-size:18px"><strong>Section Heading</strong></h4>
<!-- /wp:heading -->

<!-- wp:paragraph {"align":"center","style":{"typography":{"fontSize":"15px"}},"className":"card-description"} -->
<p class="has-text-align-center card-description" style="font-size:15px">With AtomX you can customize each aspect of without writing any code whatsoever. The customize options are endless.</p>
<!-- /wp:paragraph --></div>
<!-- /wp:column --></div>
<!-- /wp:columns -->

<!-- wp:spacer {"height":"50px"} -->
<div style="height:50px" aria-hidden="true" class="wp-block-spacer"></div>
<!-- /wp:spacer --></div>
<!-- /wp:group -->