case study changes

frontend/package.json

 {
   "name": "frontend",
-  "version": "3.0.7",
+  "version": "3.0.8",
   "private": true,
   "dependencies": {
     "@faceless-ui/slider": "^1.1.14",

frontend/src/pages/CaseStudyPage.jsx

             <section
               id="heading"
               className={
-                'flex flex-col items-center relative justify-center m-auto py-16 md:py-32'
+                'flex flex-col items-center relative justify-center m-auto py-16 md:py-32 overflow-hidden'
               }
             >
               <div className="absolute top-0 left-[-50%] lg:left-0 right-[-50%] lg:right-0 bottom-0">
               )}
             </Wrapper>
 
-            {/* About the Client Section */}
 
-            <section id="client" className="flex flex-col items-center justify-center">
-              <div className="my-8 flex flex-col md:flex-row justify-center items-start w-full max-w-custom m-auto px-8 xl:px-0">
-                {data[0].attributes.AboutClient && (
-                  <div className="w-full md:w-1/2">
-                    <h3 className="h3-heading text-teal-600">
-                      {data[0].attributes.AboutClient.title}
-                    </h3>
-                    {data[0].attributes.AboutClient.paragraph &&
-                      data[0].attributes.AboutClient.paragraph.length > 0 &&
-                      data[0].attributes.AboutClient.paragraph.map((item, index) => (
-                        <p key={index} className="paragraph mt-4">
-                          {item.ParagraphElement}
-                        </p>
-                      ))}
-                  </div>
-                )}
-                <div className="w-full md:w-1/2 grid grid-cols-2 md:grid-cols-3 gap-16 mt-8 md:mt-0">
-                  <div className="hidden md:inline-block"></div>
-                  {data[0].attributes.Country && (
-                    <div className="float-left md:float-right text-left md:text-right">
-                      <h4 className="text-teal-600 font-semibold">
-                        {data[0].attributes.Country.title}
-                      </h4>
-                      <p className="mt-4">{data[0].attributes.Country.info}</p>
-                    </div>
-                  )}
-                  {data[0].attributes.Industry && (
-                    <div className="float-left md:float-right text-left md:text-right">
-                      <h4 className="text-teal-600 font-semibold">
-                        {data[0].attributes.Industry.title}
-                      </h4>
-                      <p className="mt-4">{data[0].attributes.Industry.info}</p>
-                    </div>
-                  )}
-                </div>
-              </div>
-            </section>
 
             {/* Domain Section */}
             {data[0].attributes.Domain && (
               <section
                 id="domain"
-                className="flex flex-col items-center justify-center mt-16"
+                className="flex flex-col items-center justify-center"
               >
-                <div className="my-8 flex flex-col justify-center items-center w-full max-w-custom m-auto px-8 xl:px-0">
+                <div className="my-4 flex flex-col justify-center items-center w-full max-w-custom m-auto px-8 xl:px-0">
                   <div className="w-full">
                     <h3 className="h3-heading">{data[0].attributes.Domain.title}</h3>
                     {data[0].attributes.Domain.paragraph &&
             {/* Challanges, Solution Section */}
             <section
               id="challanges_solution"
-              className="flex flex-col items-center justify-center mt-16"
+              className="flex flex-col items-center justify-center mt-8"
             >
-              <div className="my-8 flex flex-col md:flex-row justify-center items-center w-full max-w-custom m-auto px-8 xl:px-0">
+              <div className="my-4 flex flex-col md:flex-row justify-center items-center w-full max-w-custom m-auto px-8 xl:px-0">
                 <div className="w-full md:w-1/2 md:pr-16">
                   {data[0].attributes.Challanges && (
                     <div>
             {data[0].attributes.Results && (
               <section
                 id="results"
-                className="flex flex-col items-center justify-center mt-16"
+                className="flex flex-col items-center justify-center"
               >
                 <div className="my-8 flex flex-col justify-center items-center w-full max-w-custom m-auto px-8 xl:px-0">
                   <div className="w-full">
               </section>
             )}
 
+            
+
             {/* Technologies Section */}
             {data[0].attributes.Techonologies && (
               <section id="technologies" className="flex flex-col justify-center mt-16">
-                <div className="my-8 flex flex-col w-full max-w-custom m-auto px-8 xl:px-0">
+                <div className="my-4 flex flex-col w-full max-w-custom m-auto px-8 xl:px-0">
                   <div className="w-full">
                     <h3 className="h3-heading">
                       {data[0].attributes.Techonologies.title}
               </section>
             )}
 
+                        {/* About the Client Section */}
+
+                        <section id="client" className="flex flex-col items-center justify-center mt-4">
+              <div className="my-8 flex flex-col md:flex-row justify-center items-start w-full max-w-custom m-auto px-8 xl:px-0">
+                {data[0].attributes.AboutClient && (
+                  <div className="w-full md:w-1/2">
+                    <h3 className="h3-heading text-teal-600">
+                      {data[0].attributes.AboutClient.title}
+                    </h3>
+                    {data[0].attributes.AboutClient.paragraph &&
+                      data[0].attributes.AboutClient.paragraph.length > 0 &&
+                      data[0].attributes.AboutClient.paragraph.map((item, index) => (
+                        <p key={index} className="paragraph mt-4">
+                          {item.ParagraphElement}
+                        </p>
+                      ))}
+                  </div>
+                )}
+                <div className="w-full md:w-1/2 grid grid-cols-2 md:grid-cols-3 gap-16 mt-8 md:mt-0">
+                  <div className="hidden md:inline-block"></div>
+                  {data[0].attributes.Country && (
+                    <div className="float-left md:float-right text-left md:text-right">
+                      <h4 className="text-teal-600 font-semibold">
+                        {data[0].attributes.Country.title}
+                      </h4>
+                      <p className="mt-4">{data[0].attributes.Country.info}</p>
+                    </div>
+                  )}
+                  {data[0].attributes.Industry && (
+                    <div className="float-left md:float-right text-left md:text-right">
+                      <h4 className="text-teal-600 font-semibold">
+                        {data[0].attributes.Industry.title}
+                      </h4>
+                      <p className="mt-4">{data[0].attributes.Industry.info}</p>
+                    </div>
+                  )}
+                </div>
+              </div>
+            </section>
+
             {/* CTA Section */}
             {data[0].attributes.WorkTogether && (
               <section