Update styles.css

styles.css

@@ -1,3 +1,9 @@
+/* Ensure body doesn't overflow */
+body {
+    max-width: 100%;
+    overflow-x: hidden;
+}
+
 /* Background colors */
 .bg-light-gray {
     background-color: #f3f4f6; /* Tailwind bg-gray-100 */
@@ -93,13 +99,26 @@
 .w-full {
     width: 100%; /* Tailwind w-full */
 }
-.max-w-md {
-    max-width: 28rem; /* Tailwind max-w-md */
+.max-w-4xl {
+    width: 100%; /* Ensure it uses full available width */
+    max-width: 64rem; /* Updated to Tailwind max-w-4xl for wider desktop layout */
+    min-width: 48rem; /* Ensure it doesn't shrink too much */
 }
 .block {
     display: block; /* Tailwind block */
 }
 
+/* Responsive adjustments */
+@media (max-width: 768px) {
+    .max-w-4xl {
+        max-width: 100%;
+        min-width: 0;
+    }
+    .p-6 {
+        padding: 1rem;
+    }
+}
+
 /* Borders and Shadows */
 .rounded {
     border-radius: 0.375rem; /* Tailwind rounded */