Update introduction font size

src/components/hy-introduction/hy-introduction.scss

@@ -221,30 +221,30 @@
   }
 
   &__description {
-    @include font-size(16px, 24px);
-    @include font-weight($semibold);
-
+    @include font-size(15px, 22px);
+    @include font-weight($regular);
     color: var(--grayscale-black);
     font-family: var(--main-font-family);
-    letter-spacing: -0.1px;
     margin-bottom: 28px;
+    margin-top: 0;
 
     @include breakpoint($narrow) {
-      @include font-size(18px, 28px);
+      @include font-size(16px, 24px);
     }
     @include breakpoint($wide) {
-      @include font-size(18px, 28px);
       margin-bottom: 32px;
     }
     @include breakpoint($extrawide) {
       margin-bottom: 32px;
     }
     @include breakpoint($xlarge) {
+      @include font-size(17px, 26px);
       margin-bottom: 40px;
     }
 
     &__large {
       @include breakpoint($extrawide) {
+        @include font-size(17px, 26px);
         margin-bottom: 40px;
       }
     }

src/components/hy-introduction/hy-introduction.tsx

@@ -66,7 +66,7 @@ export class HyIntroduction {
                 >
                   {this.textTitle}
                 </hy-heading>
-                <div class={classDescription}>{this.textDescription}</div>
+                <p class={classDescription}>{this.textDescription}</p>
                 {this.url && (
                   <div class="hy-introduction__link__container">
                     <a class="hy-introduction__link" href={this.url} aria-label={this.scLabel} target={target}>