style: replaced {' '} with   to prevent line breaks

src/components/About.tsx

@@ -18,7 +18,7 @@ export const About = () => {
             <div className="pb-6">
               <h2 className="text-3xl md:text-4xl font-bold">
                 <span className="bg-gradient-to-b from-primary/60 to-primary text-transparent bg-clip-text">
-                  About{" "}
+                  About&nbsp;
                 </span>
                 Company
               </h2>

src/components/Cta.tsx

@@ -11,8 +11,8 @@ export const Cta = () => {
           <h2 className="text-3xl md:text-4xl font-bold ">
             All Your
             <span className="bg-gradient-to-b from-primary/60 to-primary text-transparent bg-clip-text">
-              {" "}
-              Ideas & Concepts{" "}
+              &nbsp;
+              Ideas & Concepts&nbsp;
             </span>
             In One Interface
           </h2>

src/components/FAQ.tsx

@@ -51,7 +51,7 @@ export const FAQ = () => {
       className="container py-24 sm:py-32"
     >
       <h2 className="text-3xl md:text-4xl font-bold mb-4">
-        Frequently Asked{" "}
+        Frequently Asked&nbsp;
         <span className="bg-gradient-to-b from-primary/60 to-primary text-transparent bg-clip-text">
           Questions
         </span>
@@ -77,7 +77,7 @@ export const FAQ = () => {
       </Accordion>
 
       <h3 className="font-medium mt-4">
-        Still have questions?{" "}
+        Still have questions?&nbsp;
         <a
           rel="noreferrer noopener"
           href="#"

src/components/Features.tsx

@@ -56,7 +56,7 @@ export const Features = () => {
       className="container py-24 sm:py-32 space-y-8"
     >
       <h2 className="text-3xl lg:text-4xl font-bold md:text-center">
-        Many{" "}
+        Many&nbsp;
         <span className="bg-gradient-to-b from-primary/60 to-primary text-transparent bg-clip-text">
           Great Features
         </span>

src/components/Footer.tsx

@@ -152,7 +152,7 @@ export const Footer = () => {
 
       <section className="container pb-14 text-center">
         <h3>
-          &copy; 2024 Landing page made by{" "}
+          &copy; 2024 Landing page made by&nbsp;
           <a
             rel="noreferrer noopener"
             target="_blank"

src/components/Hero.tsx

@@ -11,14 +11,14 @@ export const Hero = () => {
           <h1 className="inline">
             <span className="inline bg-gradient-to-r from-[#F596D3]  to-[#D247BF] text-transparent bg-clip-text">
               Shadcn
-            </span>{" "}
+            </span>&nbsp;
             landing page
-          </h1>{" "}
-          for{" "}
+          </h1>&nbsp;
+          for&nbsp;
           <h2 className="inline">
             <span className="inline bg-gradient-to-r from-[#61DAFB] via-[#1fc0f1] to-[#03a3d7] text-transparent bg-clip-text">
               React
-            </span>{" "}
+            </span>&nbsp;
             developers
           </h2>
         </main>

src/components/HeroCards.tsx

@@ -144,7 +144,7 @@ export const HeroCards = () => {
                   key={benefit}
                   className="flex"
                 >
-                  <Check className="text-green-500" />{" "}
+                  <Check className="text-green-500" />&nbsp;
                   <h3 className="ml-2">{benefit}</h3>
                 </span>
               )

src/components/HowItWorks.tsx

@@ -41,9 +41,9 @@ export const HowItWorks = () => {
       className="container text-center py-24 sm:py-32"
     >
       <h2 className="text-3xl md:text-4xl font-bold ">
-        How It{" "}
+        How It&nbsp;
         <span className="bg-gradient-to-b from-primary/60 to-primary text-transparent bg-clip-text">
-          Works{" "}
+          Works&nbsp;
         </span>
         Step-by-Step Guide
       </h2>

src/components/Newsletter.tsx

@@ -13,7 +13,7 @@ export const Newsletter = () => {
 
       <div className="container py-24 sm:py-32">
         <h3 className="text-center text-4xl md:text-5xl font-bold">
-          Join Our Daily{" "}
+          Join Our Daily&nbsp;
           <span className="bg-gradient-to-b from-primary/60 to-primary text-transparent bg-clip-text">
             Newsletter
           </span>

src/components/Pricing.tsx

@@ -81,8 +81,8 @@ export const Pricing = () => {
       <h2 className="text-3xl md:text-4xl font-bold text-center">
         Get
         <span className="bg-gradient-to-b from-primary/60 to-primary text-transparent bg-clip-text">
-          {" "}
-          Unlimited{" "}
+          &nbsp;
+          Unlimited&nbsp;
         </span>
         Access
       </h2>
@@ -133,7 +133,7 @@ export const Pricing = () => {
                     key={benefit}
                     className="flex"
                   >
-                    <Check className="text-green-500" />{" "}
+                    <Check className="text-green-500" />&nbsp;
                     <h3 className="ml-2">{benefit}</h3>
                   </span>
                 ))}

src/components/Services.tsx

@@ -36,7 +36,7 @@ export const Services = () => {
         <div>
           <h2 className="text-3xl md:text-4xl font-bold">
             <span className="bg-gradient-to-b from-primary/60 to-primary text-transparent bg-clip-text">
-              Client-Centric{" "}
+              Client-Centric&nbsp;
             </span>
             Services
           </h2>

src/components/Team.tsx

@@ -114,7 +114,7 @@ export const Team = () => {
     >
       <h2 className="text-3xl md:text-4xl font-bold">
         <span className="bg-gradient-to-b from-primary/60 to-primary text-transparent bg-clip-text">
-          Our Dedicated{" "}
+          Our Dedicated&nbsp;
         </span>
         Crew
       </h2>

src/components/Testimonials.tsx

@@ -68,8 +68,8 @@ export const Testimonials = () => {
       <h2 className="text-3xl md:text-4xl font-bold">
         Discover Why
         <span className="bg-gradient-to-b from-primary/60 to-primary text-transparent bg-clip-text">
-          {" "}
-          People Love{" "}
+          &nbsp;
+          People Love&nbsp;
         </span>
         This Landing Page
       </h2>

src/components/ui/navigation-menu.tsx

@@ -53,7 +53,7 @@ const NavigationMenuTrigger = React.forwardRef<
     className={cn(navigationMenuTriggerStyle(), "group", className)}
     {...props}
   >
-    {children}{" "}
+    {children}&nbsp;
     <ChevronDown
       className="relative top-[1px] ml-1 h-3 w-3 transition duration-200 group-data-[state=open]:rotate-180"
       aria-hidden="true"