diff --git a/website/resources/styles/_marketing.scss b/website/resources/styles/_marketing.scss
index f063f02..40ac635 100644
--- a/website/resources/styles/_marketing.scss
+++ b/website/resources/styles/_marketing.scss
@@ -38,6 +38,27 @@
     background: radial-gradient(circle, rgba($primary, 0.15) 0%, transparent 70%);
     pointer-events: none;
   }
+
+  // Force light text since background is always dark
+  color: #fff;
+
+  .text-medium-emphasis {
+    color: rgba(255, 255, 255, 0.7) !important;
+  }
+
+  .text-disabled {
+    color: rgba(255, 255, 255, 0.4) !important;
+  }
+
+  .text-high-emphasis {
+    color: rgba(255, 255, 255, 0.9) !important;
+  }
+
+  // Outlined buttons need visible borders on dark bg
+  .v-btn--variant-outlined {
+    border-color: rgba(255, 255, 255, 0.5);
+    color: #fff;
+  }
 }
 
 // Glass morphism cards — theme-aware
diff --git a/website/resources/ts/Pages/Marketing/About.vue b/website/resources/ts/Pages/Marketing/About.vue
index c3f2ffa..d1a84ae 100644
--- a/website/resources/ts/Pages/Marketing/About.vue
+++ b/website/resources/ts/Pages/Marketing/About.vue
@@ -44,7 +44,7 @@ const stats = [
     </VContainer>
 
     <!-- Values -->
-    <div class="bg-surface-variant py-16">
+    <div class="section-alt-bg py-16">
       <VContainer>
         <SectionHeader
           label="Our Values"
@@ -97,7 +97,7 @@ const stats = [
     </VContainer>
 
     <!-- Stats -->
-    <div class="bg-surface-variant py-16">
+    <div class="section-alt-bg py-16">
       <VContainer>
         <VRow>
           <VCol v-for="stat in stats" :key="stat.label" cols="6" md="3">