diff --git a/package.json b/package.json
index 3d64ae97..5ae85dcc 100644
--- a/package.json
+++ b/package.json
@@ -3,7 +3,7 @@
 	"version": "0.1.0",
 	"private": true,
 	"scripts": {
-		"dev": "next dev",
+		"dev": "PORT=5005 next dev",
 		"build": "next build",
 		"start": "next start",
 		"lint": "next lint",
diff --git a/src/front/Components/Layouts/LoginHome/classes.module.scss b/src/front/Components/Layouts/LoginHome/classes.module.scss
new file mode 100644
index 00000000..6d2dc12b
--- /dev/null
+++ b/src/front/Components/Layouts/LoginHome/classes.module.scss
@@ -0,0 +1,23 @@
+.root {
+	padding: 64px;
+
+	.content {
+		display: flex;
+		gap: 48px;
+		flex-direction: column;
+		margin-top: 48px;
+
+		.section {
+			display: flex;
+			flex-direction: column;
+			gap: 24px;
+		}
+		.separator {
+			height: 1px;
+			background-color: var(--grey-medium);
+		}
+	}
+	.bottom {
+		margin-top: 48px;
+	}
+}
diff --git a/src/front/Components/Layouts/LoginHome/index.tsx b/src/front/Components/Layouts/LoginHome/index.tsx
new file mode 100644
index 00000000..e39702d2
--- /dev/null
+++ b/src/front/Components/Layouts/LoginHome/index.tsx
@@ -0,0 +1,47 @@
+import Typography, { ITypo, ITypoColor } from "@Front/Components/DesignSystem/Typography";
+import DefaultDoubleSidePage from "@Front/Components/LayoutTemplates/DefaultDoubleSidePage";
+
+import classes from "./classes.module.scss";
+import LandingImage from "../Login/landing-connect.jpeg";
+import Button, { EButtonVariant } from "@Front/Components/DesignSystem/Button";
+import Link from "next/link";
+import Module from "@Front/Config/Module";
+
+export default function LoginHome() {
+	return (
+		<DefaultDoubleSidePage title={"Login"} image={LandingImage}>
+			<div className={classes["root"]}>
+				<Typography typo={ITypo.H1}>
+					<div className={classes["title"]}>Connectez-vous à votre plateforme Lecoffre.io</div>
+				</Typography>
+				<div className={classes["content"]}>
+					<div className={classes["section"]}>
+						<Typography typo={ITypo.P_18} color={ITypoColor.BLACK}>
+							Je suis un notaire
+						</Typography>
+						<Link href={Module.getInstance().get().modules.pages.Login.props.path}>
+							<Button>Se connecter</Button>
+						</Link>
+					</div>
+					<div className={classes["separator"]} />
+					<div className={classes["section"]}>
+						<Typography typo={ITypo.P_18} color={ITypoColor.BLACK}>
+							Je suis un client
+						</Typography>
+						<Link href={Module.getInstance().get().modules.pages.CustomersLogin.props.path}>
+							<Button>Se connecter</Button>
+						</Link>
+					</div>
+				</div>
+				<div className={classes["bottom"]}>
+					<Typography typo={ITypo.P_18}>
+						<div className={classes["forget-password"]}>Vous n'arrivez pas à vous connecter ?</div>
+					</Typography>
+					<Link href="mailto:g.texier@notaires.fr">
+						<Button variant={EButtonVariant.LINE}>Contacter l'administrateur</Button>
+					</Link>
+				</div>
+			</div>
+		</DefaultDoubleSidePage>
+	);
+}
diff --git a/src/middleware.ts b/src/middleware.ts
index 39b4491e..1af4a2af 100644
--- a/src/middleware.ts
+++ b/src/middleware.ts
@@ -6,14 +6,14 @@ import type { NextRequest } from "next/server";
 export async function middleware(request: NextRequest) {
 	// Get the JWT from the cookies
 	const cookies = request.cookies.get("leCoffreAccessToken");
-	if (!cookies) return NextResponse.redirect(new URL("/login", request.url));
+	if (!cookies) return NextResponse.redirect(new URL("/", request.url));
 
 	// Decode it
 	const userDecodedToken = jwt_decode(cookies.value) as IUserJwtPayload;
 	const customerDecodedToken = jwt_decode(cookies.value) as ICustomerJwtPayload;
 
 	// If no JWT provided, redirect to login page
-	if (!userDecodedToken && !customerDecodedToken) return NextResponse.redirect(new URL("/login", request.url));
+	if (!userDecodedToken && !customerDecodedToken) return NextResponse.redirect(new URL("/", request.url));
 
 	// If JWT expired, redirect to login callback page to refresh tokens
 	const now = Math.floor(Date.now() / 1000);
@@ -39,6 +39,5 @@ export const config = {
 		"/offices/:path*",
 		"/roles/:path*",
 		"/users/:path*",
-		"/",
 	],
 };
diff --git a/src/pages/index.tsx b/src/pages/index.tsx
index 40f96abe..790c8a7c 100644
--- a/src/pages/index.tsx
+++ b/src/pages/index.tsx
@@ -1,5 +1,5 @@
-import Login from "@Front/Components/Layouts/Login";
+import LoginHome from "@Front/Components/Layouts/LoginHome";
 
 export default function Route() {
-	return <Login />;
+	return <LoginHome />;
 }