Heading with description

<?php
/**
 * Title: Heading with description
 * Slug: heading-with-description
 * Block types: core/post-content
 * Categories: featured
 */
?>
<!-- wp:group {"tagName":"section","metadata":{"name":"Heading with description"},"className":"heading-with-description","layout":{"type":"constrained"}} -->
<section class="wp-block-group heading-with-description"><!-- wp:group {"className":"heading-with-description-wrapper","layout":{"type":"constrained"}} -->
<div class="wp-block-group heading-with-description-wrapper"><!-- wp:group {"className":"heading-with-description-content","layout":{"type":"constrained"}} -->
<div class="wp-block-group heading-with-description-content"><!-- wp:heading -->
<h2 class="wp-block-heading">Powering innovation at <strong>200,000+</strong> companies worldwide</h2>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>Track work across the enterprise through an open, collaborative platform. Link issues across Jira and ingest data from other software development tools, so your IT support and operations teams have richer contextual information to rapidly respond to requests, incidents, and changes.</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p><strong>Deliver great service experiences fast - without the complexity of traditional ITSM solutions.Accelerate critical development work, eliminate toil, and deploy changes with ease.</strong></p>
<!-- /wp:paragraph -->

<!-- wp:buttons -->
<div class="wp-block-buttons"><!-- wp:button {"className":"is-style-outline","icon":"arrow-right"} -->
<div class="wp-block-button is-style-outline"><a class="wp-block-button__link wp-element-button">Learn more</a></div>
<!-- /wp:button --></div>
<!-- /wp:buttons --></div>
<!-- /wp:group --></div>
<!-- /wp:group --></section>
<!-- /wp:group -->

.heading-with-description {
  @apply bg-white dark:bg-gray-900;

  .heading-with-description-wrapper {
    @apply py-8 px-4 mx-auto lg:py-16 lg:px-6;

    .heading-with-description-content {
      @apply max-w-screen-lg text-gray-500 sm:text-lg dark:text-gray-400;
      
      .wp-block-heading {
        @apply mb-4 text-4xl tracking-tight font-bold text-gray-900 dark:text-white;

        strong {
          @apply font-extrabold;
        }
      }

      p {
        @apply mb-4 font-light;
        strong {
          @apply font-medium;
        }
      }

      a {
        @apply border-0 p-0;
        @apply inline-flex items-center font-medium text-primary-600 hover:text-primary-800 dark:text-primary-500 dark:hover:text-primary-700;
      }
    }
  }
}