fix: apply gitmem.ai brand colors and add banner to docs

Replace emerald/teal theme with correct brand palette:
- Primary accent: #ed1e25 (red) instead of hsl(158) emerald
- Dark mode gradient uses red tint
- Memory loop, install block, CTA buttons all updated

Add banner.svg from README to docs landing page hero section.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

Author: 2 people

apps/docs/app/global.css

@@ -2,29 +2,48 @@
 @import "fumadocs-ui/css/neutral.css";
 @import "fumadocs-ui/css/preset.css";
 
-/* GitMem brand: emerald/teal accent */
+/* GitMem brand: red #ed1e25 accent, dark grays */
 @theme {
-  --color-fd-primary: hsl(158, 64%, 32%);
+  --color-fd-primary: hsl(358, 84%, 42%);
   --color-fd-primary-foreground: hsl(0, 0%, 98%);
-  --color-fd-ring: hsl(158, 64%, 42%);
+  --color-fd-ring: hsl(358, 84%, 48%);
 }
 
 .dark {
-  --color-fd-primary: hsl(158, 64%, 62%);
-  --color-fd-primary-foreground: hsl(0, 0%, 9%);
-  --color-fd-ring: hsl(158, 64%, 62%);
+  --color-fd-primary: hsl(358, 84%, 55%);
+  --color-fd-primary-foreground: hsl(0, 0%, 98%);
+  --color-fd-ring: hsl(358, 84%, 55%);
 }
 
-/* Subtle gradient in dark mode like ocean preset */
+/* Subtle gradient in dark mode */
 .dark body {
   background-image: linear-gradient(
-    rgba(16, 185, 129, 0.08),
+    rgba(237, 30, 37, 0.06),
     transparent 20rem,
     transparent
   );
   background-repeat: no-repeat;
 }
 
+/* Banner image on docs landing */
+.gitmem-banner {
+  margin: 0 auto 1.5rem;
+  max-width: 48rem;
+  border-radius: 0.75rem;
+  overflow: hidden;
+  border: 1px solid hsl(0, 0%, 85%);
+}
+
+.dark .gitmem-banner {
+  border-color: hsl(0, 0%, 20%);
+}
+
+.gitmem-banner img {
+  width: 100%;
+  height: auto;
+  display: block;
+}
+
 /* Hero section styles for docs landing */
 .gitmem-hero {
   text-align: center;
@@ -65,21 +84,21 @@
 }
 
 .gitmem-hero .hero-cta a.primary {
-  background: hsl(158, 64%, 32%);
+  background: hsl(358, 84%, 42%);
   color: white;
 }
 
 .gitmem-hero .hero-cta a.primary:hover {
-  background: hsl(158, 64%, 28%);
+  background: hsl(358, 84%, 36%);
 }
 
 .dark .gitmem-hero .hero-cta a.primary {
-  background: hsl(158, 64%, 52%);
-  color: hsl(0, 0%, 9%);
+  background: hsl(358, 84%, 52%);
+  color: white;
 }
 
 .dark .gitmem-hero .hero-cta a.primary:hover {
-  background: hsl(158, 64%, 58%);
+  background: hsl(358, 84%, 58%);
 }
 
 .gitmem-hero .hero-cta a.secondary {
@@ -114,13 +133,13 @@
 .memory-loop .step {
   padding: 0.375rem 0.75rem;
   border-radius: 0.375rem;
-  background: hsl(158, 64%, 92%);
-  color: hsl(158, 64%, 22%);
+  background: hsl(358, 84%, 95%);
+  color: hsl(358, 84%, 32%);
 }
 
 .dark .memory-loop .step {
-  background: hsla(158, 64%, 30%, 0.3);
-  color: hsl(158, 64%, 72%);
+  background: hsla(358, 84%, 30%, 0.25);
+  color: hsl(358, 84%, 72%);
 }
 
 .memory-loop .arrow {
@@ -133,11 +152,11 @@
   margin: 1.5rem 0;
   padding: 1.5rem;
   border-radius: 0.75rem;
-  border: 1px solid hsl(158, 64%, 80%);
-  background: hsl(158, 64%, 97%);
+  border: 1px solid hsl(358, 84%, 85%);
+  background: hsl(358, 84%, 98%);
 }
 
 .dark .install-block {
-  border-color: hsla(158, 64%, 40%, 0.3);
-  background: hsla(158, 64%, 15%, 0.15);
+  border-color: hsla(358, 84%, 40%, 0.3);
+  background: hsla(358, 84%, 15%, 0.15);
 }

apps/docs/content/docs/index.mdx

@@ -7,6 +7,10 @@ import { Cards, Card } from 'fumadocs-ui/components/card'
 import { Callout } from 'fumadocs-ui/components/callout'
 import { Steps, Step } from 'fumadocs-ui/components/steps'
 
+<div className="gitmem-banner">
+  <img src="/banner.svg" alt="GitMem — Institutional memory for AI coding agents" />
+</div>
+
 <div className="gitmem-hero">
 
 # GitMem