diff --git a/website/src/components/HomepageFeatures/styles.module.css b/website/src/components/HomepageFeatures/styles.module.css
index e9ca367..1bd51bf 100644
--- a/website/src/components/HomepageFeatures/styles.module.css
+++ b/website/src/components/HomepageFeatures/styles.module.css
@@ -2,7 +2,19 @@
   padding: 4.5rem 0;
   width: 100%;
   background-color: var(--ifm-background-color);
+  background-image:
+    linear-gradient(to right, rgba(38, 59, 170, 0.035) 1px, transparent 1px),
+    linear-gradient(to bottom, rgba(38, 59, 170, 0.035) 1px, transparent 1px);
+  background-size: 40px 40px;
+  background-position: center top;
   border-top: 1px solid var(--border-subtle);
+  position: relative;
+}
+
+[data-theme='dark'] .featuresSection {
+  background-image:
+    linear-gradient(to right, rgba(255, 255, 255, 0.02) 1px, transparent 1px),
+    linear-gradient(to bottom, rgba(255, 255, 255, 0.02) 1px, transparent 1px);
 }
 
 .sectionHeader {
diff --git a/website/src/pages/index.module.css b/website/src/pages/index.module.css
index 98e9ce6..a0a2bd7 100644
--- a/website/src/pages/index.module.css
+++ b/website/src/pages/index.module.css
@@ -1,7 +1,28 @@
 .heroBanner {
-  padding: 4.5rem 0 3.5rem;
+  padding: 5rem 0 4rem;
   background-color: var(--hero-bg);
+  background-image:
+    linear-gradient(to right, rgba(38, 59, 170, 0.05) 1px, transparent 1px),
+    linear-gradient(to bottom, rgba(38, 59, 170, 0.05) 1px, transparent 1px);
+  background-size: 40px 40px;
+  background-position: center top;
   border-bottom: 1px solid var(--border-subtle);
+  position: relative;
+  overflow: hidden;
+}
+
+.heroBanner::before {
+  content: '';
+  position: absolute;
+  inset: 0;
+  background: radial-gradient(circle at 50% 35%, transparent 25%, var(--hero-bg) 85%);
+  pointer-events: none;
+}
+
+[data-theme='dark'] .heroBanner {
+  background-image:
+    linear-gradient(to right, rgba(255, 255, 255, 0.035) 1px, transparent 1px),
+    linear-gradient(to bottom, rgba(255, 255, 255, 0.035) 1px, transparent 1px);
 }
 
 .heroContent {
@@ -9,6 +30,8 @@
   flex-direction: column;
   align-items: center;
   text-align: center;
+  position: relative;
+  z-index: 1;
 }
 
 .versionBadge {