style: add line to titles

src/components/sections/about/about.module.css

@@ -1,6 +1,11 @@
 .about {
   padding: 80px 0;
 
+  & .titleWrapper {
+    display: flex;
+    align-items: center;
+    column-gap: 15px;
+
     & .title {
       margin-bottom: 12px;
       font-family: var(--font-display);
@@ -8,6 +13,14 @@
       font-weight: 600;
     }
 
+    & .line {
+      height: 1px;
+      flex-grow: 1;
+      background: linear-gradient(90deg, var(--color-neutral-300), transparent);
+      transform: translateY(-0.188rem);
+    }
+  }
+
   & .desc {
     color: var(--color-foreground-subtle);
     line-height: 1.7;

src/components/sections/about/about.tsx

@@ -19,7 +19,10 @@ export function About() {
   return (
     <div className={styles.about}>
       <Container>
+        <div className={styles.titleWrapper}>
           <h2 className={styles.title}>What is Moodist?</h2>
+          <div className={styles.line} />
+        </div>
         <p className={styles.desc}>
           Moodist is your gateway to a world of serenity and focus. It&apos;s a
           free online ambient sound generator offering <span>{count}</span>{' '}

src/components/sections/why/why.module.css

@@ -1,6 +1,11 @@
 .why {
   padding-bottom: 80px;
 
+  & .titleWrapper {
+    display: flex;
+    align-items: center;
+    column-gap: 15px;
+
     & .title {
       margin-bottom: 12px;
       font-family: var(--font-display);
@@ -8,6 +13,14 @@
       font-weight: 600;
     }
 
+    & .line {
+      height: 1px;
+      flex-grow: 1;
+      background: linear-gradient(90deg, var(--color-neutral-300), transparent);
+      transform: translateY(-0.188rem);
+    }
+  }
+
   & .reasons {
     display: grid;
     margin-top: 24px;

src/components/sections/why/why.tsx

@@ -30,7 +30,10 @@ export function Why() {
   return (
     <div className={styles.why}>
       <Container>
+        <div className={styles.titleWrapper}>
           <h2 className={styles.title}>Why use Moodist?</h2>
+          <div className={styles.line} />
+        </div>
 
         <div className={styles.reasons}>
           {reasons.map(reason => (