fix: correct conditional header content styles

components/MyPages/Blocks/Benefits/NextLevel/index.tsx

@@ -7,6 +7,7 @@ import Button from "@/components/TempDesignSystem/Button"
 import Title from "@/components/Title"
 
 import styles from "./next.module.css"
+
 import { AccountPageComponentProps } from "@/types/components/myPages/myPage/accountPage"
 
 export default async function NextLevelBenefitsBlock({
@@ -19,14 +20,16 @@ export default async function NextLevelBenefitsBlock({
   return (
     <section className={styles.container}>
       <header className={styles.header}>
-        <Title as="h3" level="h2" uppercase className={styles.title}>
-          {title}
-          {link && (
-            <Link className={styles.link} href={link.href}>
-              {link.text}
-            </Link>
-          )}
-        </Title>
+        {title && (
+          <Title as="h3" level="h2" uppercase className={styles.title}>
+            {title}
+          </Title>
+        )}
+        {link && (
+          <Link className={styles.link} href={link.href}>
+            {link.text}
+          </Link>
+        )}
       </header>
       {subtitle && <p className={styles.subtitle}>{subtitle}</p>}
       <div className={styles.cardContainer}>

components/MyPages/Blocks/Benefits/NextLevel/next.module.css

@@ -4,8 +4,18 @@
 }
 
 .header {
-  display: flex;
-  justify-content: space-between;
+  display: grid;
+  grid-template-areas: "title link";
+  grid-template-columns: 1fr max-content;
+}
+
+.title {
+  grid-area: title;
+  font-weight: 600;
+}
+
+.link {
+  grid-area: link;
 }
 
 .cardContainer {