Update

Assets/style.css

@@ -45,7 +45,7 @@ main {
 }
 
 .recette-du-jour img {
-  width: 100%;
+  width: 30%;
   border-radius: 5px;
 }
 
@@ -63,7 +63,7 @@ main {
 }
 
 .autres-recettes img {
-  width: 100%;
+  width: 50%;
   border-radius: 5px;
 }
 

Assets/style.css~

@@ -0,0 +1,93 @@
+/* --- RESET SIMPLE --- */
+body {
+  margin: 0;
+  font-family: Arial, sans-serif;
+  background: #f8f8f8;
+  color: #333;
+}
+
+/* --- HEADER --- */
+header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  background: #ffcc66;
+  padding: 10px 20px;
+}
+
+
+header .menu a {
+  text-decoration: none;
+  color: #333;
+  font-weight: bold;
+}
+
+header .burger {
+  font-size: 1.5em;
+  cursor: pointer;
+}
+
+/* --- SECTION PRINCIPALE --- */
+main {
+  padding: 20px;
+}
+
+.content {
+  display: flex;
+  gap: 20px;
+}
+
+.recette-du-jour {
+  flex: 2;
+  background: white;
+  padding: 10px;
+  border-radius: 8px;
+}
+
+.recette-du-jour img {
+  width: 100%;
+  border-radius: 5px;
+}
+
+.autres-recettes {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  gap: 15px;
+}
+
+.autres-recettes .mini-recette {
+  background: white;
+  padding: 10px;
+  border-radius: 8px;
+}
+
+.autres-recettes img {
+  width: 100%;
+  border-radius: 5px;
+}
+
+/* --- RESPONSIVE --- */
+@media (max-width: 768px) {
+  .content {
+    flex-direction: column;
+  }
+  .autres-recettes {
+    flex-direction: row;
+    flex-wrap: wrap;
+    gap: 10px;
+  }
+  .autres-recettes .mini-recette {
+    flex: 1 1 45%;
+  }
+}
+
+@media (max-width: 480px) {
+  header {
+    flex-direction: column;
+    align-items: flex-start;
+  }
+  .burger {
+    align-self: flex-end;
+  }
+}