fixed minor issues

app/page.tsx

@@ -55,17 +55,19 @@ export default function Home() {
           <h2 className="capitalize">total tender amount you missed today</h2>
           <ApexChart />
         </div>
-        <div className="mr-8 -z-10">
+        <div className="mr-8 -z-20">
           <Image
-            className="-z-10"
+            className="-z-10 "
             src="/mobile.svg"
             width={300}
             height={820}
+            loading="lazy"
             alt="phone"
           />
         </div>
       </section>
-      <div className="text-left flex flex-col gap-6 bg-gradient-to-b from-[#011132] to-[#012B80] text-white rounded-[56px] p-6 md:p-14 -mt-16 z-10 md:ml-28">
+      <section className="text-left flex flex-col gap-6 bg-gradient-to-b from-[#011132] to-[#012B80] text-white rounded-[56px] relative p-6 md:p-14 -mt-16 z-20 md:ml-28">
+        <hgroup>
         <h1 className="capitalize font-extrabold text-5xl ">
           democratizing the world of tenders
         </h1>
@@ -74,13 +76,15 @@ export default function Home() {
           field so you can win the public and private contracts you deserve.
           Compete on your true strengths.
         </p>
+        </hgroup>
         <div className="flex justify-end">
           <button className="bg-(--primary) rounded-4xl py-4 px-6">
             Get early access
           </button>
         </div>
-      </div>
+      </section>
       <article className="mt-40">
+        <hgroup>
         <h4 className="capitalize font-bold text-4xl">
           your in-house tender department, powered by
           <span className="uppercase">ai</span>
@@ -89,16 +93,20 @@ export default function Home() {
           Opplens is the end-to-end solution that gives you the power to compete
           and win.
         </small>
+        </hgroup>
       </article>
       <section className="flex flex-col gap-4 md:flex-row">
         {centerFrames.map((frame, index) => (
-          <CenterFrame
-            key={frame.description}
-            src={frame.src}
-            title={frame.title}
-            description={frame.description}
-            alt={frame.alt}
-          />
+          <article key={frame.description} className="bg-[#F7FAFF] border border-(--primary)/30 rounded-3xl my-4 py-10 px-6">
+            <Image
+              src={frame.src}
+              alt={frame.alt}
+              width={36}
+              height={36}
+            />
+            <h3 className="text-2xl font-bold">{frame.title}</h3>
+            <p className="text-gray-600">{frame.description}</p>
+          </article>
         ))}
       </section>
       <section className="mt-36 bg-[#F7FAFF] px-4 py-6 rounded-4xl flex flex-col gap-9 md:p-16">
@@ -111,8 +119,8 @@ export default function Home() {
             an uphill battle.
           </p>
         </div>
-        <div className="flex flex-col gap-4 md:flex-row md:justify-between">
-          <div className="flex flex-col gap-4 md:w-80">
+        <ul className="flex flex-col gap-4 md:flex-row md:justify-between">
+          <li className="flex flex-col gap-4 md:w-80">
             <div className="p-4">
               <Image
                 src={"/clock.svg"}
@@ -126,8 +134,8 @@ export default function Home() {
               Lacking the time, dedicated staff, and expertise to constantly
               monitor the market and prepare high-quality bids.
             </p>
-          </div>
-          <div className="flex flex-col gap-4 md:w-80">
+          </li>
+          <li className="flex flex-col gap-4 md:w-80">
             <div className="p-4">
               <Image
                 src={"/clipboard.svg"}
@@ -141,8 +149,8 @@ export default function Home() {
               Navigating complex requirements and processes designed for large
               corporations with dedicated tender departments.
             </p>
-          </div>
-          <div className="flex flex-col gap-4 md:w-80">
+          </li>
+          <li className="flex flex-col gap-4 md:w-80">
             <div className="p-4">
               <Image
                 src={"/arrow-up.svg"}
@@ -156,14 +164,14 @@ export default function Home() {
               Did you know 68% of SMEs in Sweden rarely or never win public
               tenders? It's time to change that.
             </p>
-          </div>
-        </div>
+          </li>
+        </ul>
       </section>
       <section className="flex flex-col mt-36 gap-10 w-3/4 m-auto">
         <div>
           <h2 className="font-bold text-4xl">The Opplens Advantage</h2>
         </div>
-        <div className="flex flex-col gap-10 md:flex-row">
+        <section className="flex flex-col gap-10 md:flex-row">
           <div className="flex flex-col gap-7 md:flex-row bg-[#FFF7EB] p-10 rounded-3xl md:pb-20">
             <Image
               src={"people.svg"}
@@ -196,7 +204,7 @@ export default function Home() {
               </p>
             </div>
           </div>
-        </div>
+        </section>
       </section>
     </>
   );