-

frontend/src/pages/Careers.jsx

@@ -1,6 +1,8 @@
 import { useState, useEffect } from 'react';
 import axios from 'axios';
 
+import ImgStep1 from '../assets/images/CaseStudy/CentralizedSmall.png';
+
 import Care from './../assets/icons/values/care.svg';
 import Doing from './../assets/icons/values/doing.svg';
 import Culture from './../assets/icons/values/culture.svg';
@@ -321,9 +323,69 @@ export default function Careers({ forwardedRef }) {
         <Wrapper bg padding={' py-90p'}>
           <PageTitle
             left
-            heading="Selection Process"
-            subheading="Becoming a part of our team"
+            heading="Becoming a part of our team"
+            subheading="Selection Process"
           />
+          <div className="flex flex-col items-center justify-start overflow-auto h-[75vh] pt-72p">
+            {/* Dynamic Image */}
+            <img src={ImgStep1} alt="Img" className="absolute top-1/4 left-1/2 w-2/5" />
+
+            {/* Section 1 */}
+            <div className="flex flex-row items-start justify-center min-h-[54vh]">
+              <div className="w-1/2">
+                <h3>Application 1</h3>
+                <p className="paragraph">
+                  You consider Diligent to be the best fit for your professional growth?
+                  Send us your CV now! All open positions and information on how to apply
+                  are listed on our website. If you require additional details? For any
+                  questions, please contact us at hr@dilig.net.
+                </p>
+              </div>
+              <div className="w-1/2"></div>
+            </div>
+
+            {/* Section 2 */}
+            <div className="flex flex-row items-start justify-center min-h-[54vh]">
+              <div className="w-1/2">
+                <h3>Application 2</h3>
+                <p className="paragraph">
+                  You consider Diligent to be the best fit for your professional growth?
+                  Send us your CV now! All open positions and information on how to apply
+                  are listed on our website. If you require additional details? For any
+                  questions, please contact us at hr@dilig.net.
+                </p>
+              </div>
+              <div className="w-1/2"></div>
+            </div>
+
+            {/* Section 3 */}
+            <div className="flex flex-row items-start justify-center min-h-[54vh]">
+              <div className="w-1/2">
+                <h3>Application 3</h3>
+                <p className="paragraph">
+                  You consider Diligent to be the best fit for your professional growth?
+                  Send us your CV now! All open positions and information on how to apply
+                  are listed on our website. If you require additional details? For any
+                  questions, please contact us at hr@dilig.net.
+                </p>
+              </div>
+              <div className="w-1/2"></div>
+            </div>
+
+            {/* Section 4 */}
+            <div className="flex flex-row items-start justify-center min-h-[54vh]">
+              <div className="w-1/2">
+                <h3>Application 4</h3>
+                <p className="paragraph">
+                  You consider Diligent to be the best fit for your professional growth?
+                  Send us your CV now! All open positions and information on how to apply
+                  are listed on our website. If you require additional details? For any
+                  questions, please contact us at hr@dilig.net.
+                </p>
+              </div>
+              <div className="w-1/2"></div>
+            </div>
+          </div>
         </Wrapper>
 
         {/* Main Heading */}
@@ -397,11 +459,7 @@ export default function Careers({ forwardedRef }) {
 
         {/* Event's Timeline */}
         <Wrapper bg padding={' py-90p'}>
-          <PageTitle
-            left
-            heading="Event's Timeline"
-            subheading="Events"
-          />
+          <PageTitle left heading="Event's Timeline" subheading="Events" />
         </Wrapper>
 
         {/* Action Card */}