diff --git a/app/[locale]/layout.tsx b/app/[locale]/layout.tsx
index f6d6908..94623e5 100644
--- a/app/[locale]/layout.tsx
+++ b/app/[locale]/layout.tsx
@@ -24,7 +24,7 @@ export default function RootLayout({
 	children: React.ReactNode;
 }>) {
 	return (
-		<html lang="fr" className={`${playfairDisplay.variable} ${inter.variable} bg-brand-beige m-[11px] antialiased`}>
+		<html lang="fr" className={`${playfairDisplay.variable} ${inter.variable} bg-brand-beige m-2.75 overflow-auto antialiased`}>
 			<body className="min-h-screen flex flex-col bg-brand-beige text-brand-brown">
 				<Header />
 				{children}
diff --git a/app/[locale]/page.tsx b/app/[locale]/page.tsx
index ee29d9d..3dd7179 100644
--- a/app/[locale]/page.tsx
+++ b/app/[locale]/page.tsx
@@ -1,7 +1,9 @@
+import HeroSection from "@/components/sections/HeroSection";
+
 export default function Home() {
-  return (
-    <main className="min-h-screen bg-brand-beige text-brand-black flex items-center justify-center">
-      <h1 className="font-serif text-6xl">Hello World</h1>
-    </main>
-  );
+	return (
+		<main className=" bg-brand-beige text-brand-black flex items-center justify-center">
+			<HeroSection />
+		</main>
+	);
 }
\ No newline at end of file
diff --git a/components/layout/Header.tsx b/components/layout/Header.tsx
index 429890a..38e1b8e 100644
--- a/components/layout/Header.tsx
+++ b/components/layout/Header.tsx
@@ -1,6 +1,6 @@
 export default function Header() {
   return (
-    <header className="bg-brand-brown text-brand-beige w-full py-6 px-10 flex justify-between items-center rounded-[10px]">
+    <header className="bg-brand-brown text-brand-beige py-6 px-10 flex justify-between items-center rounded-[10px] fixed left-2.75 right-2.75 z-50">
         <div className="font-serif text-2xl font-light">M. Guilbert</div>
         <nav>
             <ul className="flex gap-8 font-sans text-base font-light">
diff --git a/components/sections/HeroSection.tsx b/components/sections/HeroSection.tsx
new file mode 100644
index 0000000..12db75c
--- /dev/null
+++ b/components/sections/HeroSection.tsx
@@ -0,0 +1,26 @@
+import { FiChevronsDown } from "react-icons/fi";
+
+export default function HeroSection() {
+	return (
+		<section className="w-full h-[calc(100vh-(2*11px))] rounded-[10px] bg-brand-brown text-brand-beige flex flex-col items-center justify-center relative">
+            {/* Title + image container */}
+            <div className="flex flex-row justify-between items-center w-2/3 gap-2.5">
+                {/* Rotating texts */}
+                <div className="flex flex-col">
+                    <p className="text-2xl font-sans">Ensemble nous allons...</p>
+                    <h1 className="text-[64px] font-serif">Construire une solution qui répond à votre problème.</h1>
+                </div>
+
+                {/* Image */}
+                <img className="rounded-[10px]" src="/images/pofile.png" alt="Image of me" />
+            </div>
+
+            {/* Call to scroll */}
+            <div className="flex flex-row justify-center items-center gap-2.5 absolute bottom-6">
+                <FiChevronsDown />
+                <p className="text-base font-sans">Voir mes travaux</p>
+                <FiChevronsDown />
+            </div>
+		</section>
+	);
+}
diff --git a/package-lock.json b/package-lock.json
index 66223fe..cac0fd1 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -10,7 +10,8 @@
       "dependencies": {
         "next": "16.2.3",
         "react": "19.2.4",
-        "react-dom": "19.2.4"
+        "react-dom": "19.2.4",
+        "react-icons": "^5.6.0"
       },
       "devDependencies": {
         "@tailwindcss/postcss": "^4",
@@ -5429,6 +5430,15 @@
         "react": "^19.2.4"
       }
     },
+    "node_modules/react-icons": {
+      "version": "5.6.0",
+      "resolved": "https://registry.npmjs.org/react-icons/-/react-icons-5.6.0.tgz",
+      "integrity": "sha512-RH93p5ki6LfOiIt0UtDyNg/cee+HLVR6cHHtW3wALfo+eOHTp8RnU2kRkI6E+H19zMIs03DyxUG/GfZMOGvmiA==",
+      "license": "MIT",
+      "peerDependencies": {
+        "react": "*"
+      }
+    },
     "node_modules/react-is": {
       "version": "16.13.1",
       "resolved": "https://registry.npmjs.org/react-is/-/react-is-16.13.1.tgz",
diff --git a/package.json b/package.json
index 23b2232..21bd4f1 100644
--- a/package.json
+++ b/package.json
@@ -11,7 +11,8 @@
   "dependencies": {
     "next": "16.2.3",
     "react": "19.2.4",
-    "react-dom": "19.2.4"
+    "react-dom": "19.2.4",
+    "react-icons": "^5.6.0"
   },
   "devDependencies": {
     "@tailwindcss/postcss": "^4",
diff --git a/public/images/pofile.png b/public/images/pofile.png
new file mode 100644
index 0000000..bd2396b
Binary files /dev/null and b/public/images/pofile.png differ
