1 ere phase complète

public/css/style.css

@@ -43,3 +43,75 @@ nav {
     nav a:hover {
         text-decoration: underline;
     }
+
+    body {
+        font-family: "Inter", sans-serif;
+        background: #f5f6fa;
+        padding: 50px;
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+    }
+
+    h1 {
+        font-weight: 600;
+        margin-bottom: 35px;
+        color: #1d1d1f;
+    }
+
+    .form-clean {
+        background: #58a198;
+        padding: 40px 45px;          /* plus de padding */
+        border-radius: 14px;
+        width: 100%;
+        max-width: 450px;
+        box-shadow: 0 6px 18px rgba(0,0,0,0.06);
+        display: flex;
+        flex-direction: column;
+        gap: 22px;                   /* spacing entre les champs */
+    }
+
+    .field {
+        display: flex;
+        flex-direction: column;
+        gap: 6px;
+    }
+
+    .form-clean label {
+        font-size: 15px;
+        color: #333;
+        font-weight: 500;
+    }
+
+    .form-clean input {
+        padding: 14px 16px;          /* plus de padding dans les inputs */
+        border-radius: 10px;
+        border: 1px solid #dcdce0;
+        background: #fafafa;
+        font-size: 15px;
+        transition: 0.25s;
+    }
+
+    .form-clean input:focus {
+        border-color: #000;
+        background: #fff;
+        box-shadow: 0 0 0 3px rgba(0,0,0,0.07);
+        outline: none;
+    }
+
+    .btn-submit {
+        margin-top: 10px;
+        padding: 14px 20px;
+        border-radius: 10px;
+        border: none;
+        background: #1d1d1f;
+        color: #fff;
+        font-size: 16px;
+        font-weight: 500;
+        cursor: pointer;
+        transition: 0.25s;
+    }
+
+    .btn-submit:hover {
+        background: #000;
+    }