diff --git a/src/components/container.svelte b/src/components/container.svelte
index 799d6d2..814dda2 100644
--- a/src/components/container.svelte
+++ b/src/components/container.svelte
@@ -6,6 +6,6 @@
     $props();
 </script>
 
-<div class={cn("container mx-auto px-4", className)}>
+<div class={cn("container mx-auto px-6 lg:px-4", className)}>
   {@render children?.()}
 </div>
diff --git a/src/components/grid.svelte b/src/components/grid.svelte
index 953c2da..ad35050 100644
--- a/src/components/grid.svelte
+++ b/src/components/grid.svelte
@@ -13,7 +13,7 @@
 
 <div
   class={cn(
-    "grid grid-cols-1 gap-4 sm:grid-cols-2 md:grid-cols-2 lg:grid-cols-4 xl:grid-cols-5",
+    "grid grid-cols-1 gap-4 sm:grid-cols-2 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-5",
     columns === "4" && "lg:grid-cols-3 xl:grid-cols-4",
     columns === "3" && "lg:grid-cols-2 xl:grid-cols-3",
     columns === "2" && "md:grid-cols-2 lg:grid-cols-2 xl:grid-cols-2",