diff --git a/src/pages/Home.jsx b/src/pages/Home.jsx
index edc0ff7..6e5a28c 100644
--- a/src/pages/Home.jsx
+++ b/src/pages/Home.jsx
@@ -1,18 +1,13 @@
 import { projects } from "@/data/projects";
-import { FaReact, FaRegStar } from "react-icons/fa";
 import { Link } from "react-router-dom";
 
 function Home({ setCursorVariant }) {
   return (
     <main className="flex min-h-screen flex-col">
       <div className="landing relative mb-24 py-12 sm:py-16 lg:pt-20 xl:pb-0">
-        <div className="relative mx-auto max-w-7xl px-4 sm:px-6 lg:px-8">
-          <div className="relative mx-auto hidden max-w-screen-lg bg-red-300 lg:block">
-            <FaReact className="absolute right-0 text-[9rem] fill-primary -rotate-45 -translate-x-0 translate-y-[-19.5px]" />
-            <FaRegStar className="absolute left-0 text-[7rem] fill-primary translate-x-[200px] translate-y-[-19.5]" />
-          </div>
+        <div className="relative mx-auto max-w-7xl px-4 sm:px-6 lg:px-8 flex flex-col justify-end max-sm:h-[75vh]">
           <div className="mx-auto max-w-3xl text-center">
-            <h1 className="mt-5 text-3xl font-light leading-snug text-foreground sm:text-5xl sm:leading-snug lg:text-6xl lg:leading-snug">
+            <h1 className="mt-5 text-4xl max-sm:text-start leading-snug text-foreground sm:text-5xl sm:leading-snug lg:text-6xl lg:leading-snug">
               Discover Awesome React.js{" "}
               <span
                 onMouseEnter={() => setCursorVariant("bigText")}
@@ -22,7 +17,7 @@ function Home({ setCursorVariant }) {
                 Projects
               </span>
             </h1>
-            <p className="mx-auto mt-5 max-w-md text-base leading-7 text-foreground/80">
+            <p className="max-sm:text-start sm:mx-auto mt-5 max-w-md text-base leading-7 text-foreground/80">
               Explore a curated collection of open-source projects, components,
               React hooks, and more, all in one place.
             </p>
@@ -30,8 +25,8 @@ function Home({ setCursorVariant }) {
         </div>
       </div>
 
-      <div className="sm:px-none mx-auto mt-20 max-w-screen-lg flex flex-1 flex-col px-4">
-        <div className="flex flex-col">
+      <div className="sm:px-none mx-auto max-w-screen-lg flex flex-1 flex-col px-4">
+        <div className="flex flex-col md:w-[1000px]">
           {projects.map((item) => (
             <div
               key={item.id}