Currently, when clicking on one of the buttons, games or art, the other column hides correctly, but the visible column stays in its original half, leaving empty space beside it. i want that the column that is visable, fills the section width

style.css

@@ -1,8 +1,29 @@
+
 body {
 	padding: 2rem;
 	font-family: -apple-system, BlinkMacSystemFont, "Arial", sans-serif;
 }
 
+/* Projects section styles */
+#works .grid {
+    display: grid;
+    grid-template-columns: 1fr;
+    gap: 2rem;
+}
+
+#works .grid.full-width {
+    grid-template-columns: 1fr;
+}
+
+@media (min-width: 768px) {
+    #works .grid {
+        grid-template-columns: repeat(2, 1fr);
+    }
+    
+    #works .grid.full-width {
+        grid-template-columns: 1fr;
+    }
+}
 h1 {
 	font-size: 16px;
 	margin-top: 0;