diff --git a/README.md b/README.md
index 15e1279..4bef073 100644
--- a/README.md
+++ b/README.md
@@ -1,5 +1,5 @@
 <p align="center">
-  <img src="./assets/logo.svg" alt="botnot" width="720">
+  <img src="./assets/banner.svg" alt="botnot" width="720">
 </p>
 
 <p align="center">
diff --git a/assets/banner.svg b/assets/banner.svg
new file mode 100644
index 0000000..64c0ff7
--- /dev/null
+++ b/assets/banner.svg
@@ -0,0 +1,88 @@
+<svg width="1280" height="320" viewBox="0 0 1280 320" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="botnot logo">
+  <defs>
+    <linearGradient id="bg" x1="0" y1="0" x2="1" y2="1">
+      <stop offset="0%" stop-color="#0a0e1a"/>
+      <stop offset="100%" stop-color="#15192e"/>
+    </linearGradient>
+    <linearGradient id="grad" x1="0" y1="0" x2="1" y2="1">
+      <stop offset="0%" stop-color="#22d3ee"/>
+      <stop offset="100%" stop-color="#a78bfa"/>
+    </linearGradient>
+    <linearGradient id="wmLight" x1="0" y1="0" x2="0" y2="1">
+      <stop offset="0%" stop-color="#ffffff"/>
+      <stop offset="100%" stop-color="#cbd5e1"/>
+    </linearGradient>
+    <pattern id="dots" x="0" y="0" width="22" height="22" patternUnits="userSpaceOnUse">
+      <circle cx="2" cy="2" r="1" fill="#ffffff" opacity="0.06"/>
+    </pattern>
+    <filter id="glow" x="-30%" y="-30%" width="160%" height="160%">
+      <feGaussianBlur stdDeviation="8" result="blur"/>
+      <feMerge>
+        <feMergeNode in="blur"/>
+        <feMergeNode in="SourceGraphic"/>
+      </feMerge>
+    </filter>
+  </defs>
+
+  <!-- Background -->
+  <rect width="1280" height="320" rx="28" fill="url(#bg)"/>
+  <rect width="1280" height="320" rx="28" fill="url(#dots)"/>
+
+  <!-- Bot icon -->
+  <g transform="translate(110,55)" filter="url(#glow)">
+    <!-- antenna -->
+    <line x1="100" y1="0" x2="100" y2="32" stroke="url(#grad)" stroke-width="8" stroke-linecap="round"/>
+    <circle cx="100" cy="6" r="10" fill="url(#grad)"/>
+
+    <!-- head -->
+    <rect x="20" y="32" width="160" height="140" rx="30" fill="url(#grad)"/>
+
+    <!-- eyes -->
+    <circle cx="68" cy="92" r="14" fill="#0a0e1a"/>
+    <circle cx="132" cy="92" r="14" fill="#0a0e1a"/>
+    <circle cx="72" cy="88" r="4" fill="#ffffff"/>
+    <circle cx="136" cy="88" r="4" fill="#ffffff"/>
+
+    <!-- mouth: QR-like grid -->
+    <g transform="translate(68,128)" fill="#0a0e1a">
+      <rect x="0" y="0" width="10" height="10" rx="2"/>
+      <rect x="14" y="0" width="10" height="10" rx="2"/>
+      <rect x="28" y="0" width="10" height="10" rx="2"/>
+      <rect x="42" y="0" width="10" height="10" rx="2"/>
+      <rect x="56" y="0" width="10" height="10" rx="2"/>
+    </g>
+
+    <!-- neck -->
+    <rect x="80" y="172" width="40" height="14" rx="3" fill="url(#grad)"/>
+  </g>
+
+  <!-- Wordmark -->
+  <g transform="translate(360,0)">
+    <text x="0" y="170" font-family="'Segoe UI', system-ui, -apple-system, sans-serif" font-size="128" font-weight="800" letter-spacing="-3"><tspan fill="url(#wmLight)">bot</tspan><tspan fill="url(#grad)">not</tspan></text>
+    <text x="6" y="212" font-family="'Segoe UI', system-ui, -apple-system, sans-serif" font-size="22" font-weight="500" fill="#94a3b8">Telegram &amp; Discord auto-order bot &#8212; pelanggan scan QR, produk auto-deliver.</text>
+
+    <!-- feature chips -->
+    <g font-family="'Segoe UI', system-ui, sans-serif" font-size="13" font-weight="600">
+      <g transform="translate(6,240)">
+        <rect width="92" height="28" rx="14" fill="#0a0e1a" stroke="#22d3ee" stroke-width="1.2"/>
+        <text x="46" y="19" text-anchor="middle" fill="#22d3ee">Telegram</text>
+      </g>
+      <g transform="translate(108,240)">
+        <rect width="86" height="28" rx="14" fill="#0a0e1a" stroke="#a78bfa" stroke-width="1.2"/>
+        <text x="43" y="19" text-anchor="middle" fill="#a78bfa">Discord</text>
+      </g>
+      <g transform="translate(204,240)">
+        <rect width="92" height="28" rx="14" fill="#0a0e1a" stroke="#34d399" stroke-width="1.2"/>
+        <text x="46" y="19" text-anchor="middle" fill="#34d399">KlikQRIS</text>
+      </g>
+      <g transform="translate(306,240)">
+        <rect width="106" height="28" rx="14" fill="#0a0e1a" stroke="#fbbf24" stroke-width="1.2"/>
+        <text x="53" y="19" text-anchor="middle" fill="#fbbf24">Auto-deliver</text>
+      </g>
+      <g transform="translate(422,240)">
+        <rect width="98" height="28" rx="14" fill="#0a0e1a" stroke="#f472b6" stroke-width="1.2"/>
+        <text x="49" y="19" text-anchor="middle" fill="#f472b6">Dashboard</text>
+      </g>
+    </g>
+  </g>
+</svg>
diff --git a/assets/logo.svg b/assets/logo.svg
index 34c89b0..64c0ff7 100644
--- a/assets/logo.svg
+++ b/assets/logo.svg
@@ -1,13 +1,17 @@
 <svg width="1280" height="320" viewBox="0 0 1280 320" xmlns="http://www.w3.org/2000/svg" role="img" aria-label="botnot logo">
   <defs>
     <linearGradient id="bg" x1="0" y1="0" x2="1" y2="1">
-      <stop offset="0%" stop-color="#0b1020"/>
-      <stop offset="100%" stop-color="#1a1438"/>
+      <stop offset="0%" stop-color="#0a0e1a"/>
+      <stop offset="100%" stop-color="#15192e"/>
     </linearGradient>
     <linearGradient id="grad" x1="0" y1="0" x2="1" y2="1">
       <stop offset="0%" stop-color="#22d3ee"/>
       <stop offset="100%" stop-color="#a78bfa"/>
     </linearGradient>
+    <linearGradient id="wmLight" x1="0" y1="0" x2="0" y2="1">
+      <stop offset="0%" stop-color="#ffffff"/>
+      <stop offset="100%" stop-color="#cbd5e1"/>
+    </linearGradient>
     <pattern id="dots" x="0" y="0" width="22" height="22" patternUnits="userSpaceOnUse">
       <circle cx="2" cy="2" r="1" fill="#ffffff" opacity="0.06"/>
     </pattern>
@@ -34,13 +38,13 @@
     <rect x="20" y="32" width="160" height="140" rx="30" fill="url(#grad)"/>
 
     <!-- eyes -->
-    <circle cx="68" cy="92" r="14" fill="#0b1020"/>
-    <circle cx="132" cy="92" r="14" fill="#0b1020"/>
+    <circle cx="68" cy="92" r="14" fill="#0a0e1a"/>
+    <circle cx="132" cy="92" r="14" fill="#0a0e1a"/>
     <circle cx="72" cy="88" r="4" fill="#ffffff"/>
     <circle cx="136" cy="88" r="4" fill="#ffffff"/>
 
     <!-- mouth: QR-like grid -->
-    <g transform="translate(68,128)" fill="#0b1020">
+    <g transform="translate(68,128)" fill="#0a0e1a">
       <rect x="0" y="0" width="10" height="10" rx="2"/>
       <rect x="14" y="0" width="10" height="10" rx="2"/>
       <rect x="28" y="0" width="10" height="10" rx="2"/>
@@ -54,26 +58,30 @@
 
   <!-- Wordmark -->
   <g transform="translate(360,0)">
-    <text x="0" y="170" font-family="'Segoe UI', system-ui, -apple-system, sans-serif" font-size="128" font-weight="800" fill="url(#grad)" letter-spacing="-3">botnot</text>
-    <text x="6" y="212" font-family="'Segoe UI', system-ui, -apple-system, sans-serif" font-size="22" font-weight="500" fill="#cbd5e1">Auto-order Telegram &amp; Discord bot — powered by KlikQRIS</text>
+    <text x="0" y="170" font-family="'Segoe UI', system-ui, -apple-system, sans-serif" font-size="128" font-weight="800" letter-spacing="-3"><tspan fill="url(#wmLight)">bot</tspan><tspan fill="url(#grad)">not</tspan></text>
+    <text x="6" y="212" font-family="'Segoe UI', system-ui, -apple-system, sans-serif" font-size="22" font-weight="500" fill="#94a3b8">Telegram &amp; Discord auto-order bot &#8212; pelanggan scan QR, produk auto-deliver.</text>
 
-    <!-- tech chips -->
+    <!-- feature chips -->
     <g font-family="'Segoe UI', system-ui, sans-serif" font-size="13" font-weight="600">
       <g transform="translate(6,240)">
-        <rect width="100" height="28" rx="14" fill="#0f172a" stroke="#22d3ee" stroke-width="1.2"/>
-        <text x="50" y="19" text-anchor="middle" fill="#22d3ee">TypeScript</text>
+        <rect width="92" height="28" rx="14" fill="#0a0e1a" stroke="#22d3ee" stroke-width="1.2"/>
+        <text x="46" y="19" text-anchor="middle" fill="#22d3ee">Telegram</text>
+      </g>
+      <g transform="translate(108,240)">
+        <rect width="86" height="28" rx="14" fill="#0a0e1a" stroke="#a78bfa" stroke-width="1.2"/>
+        <text x="43" y="19" text-anchor="middle" fill="#a78bfa">Discord</text>
       </g>
-      <g transform="translate(116,240)">
-        <rect width="86" height="28" rx="14" fill="#0f172a" stroke="#a78bfa" stroke-width="1.2"/>
-        <text x="43" y="19" text-anchor="middle" fill="#a78bfa">Prisma</text>
+      <g transform="translate(204,240)">
+        <rect width="92" height="28" rx="14" fill="#0a0e1a" stroke="#34d399" stroke-width="1.2"/>
+        <text x="46" y="19" text-anchor="middle" fill="#34d399">KlikQRIS</text>
       </g>
-      <g transform="translate(212,240)">
-        <rect width="76" height="28" rx="14" fill="#0f172a" stroke="#facc15" stroke-width="1.2"/>
-        <text x="38" y="19" text-anchor="middle" fill="#facc15">QRIS</text>
+      <g transform="translate(306,240)">
+        <rect width="106" height="28" rx="14" fill="#0a0e1a" stroke="#fbbf24" stroke-width="1.2"/>
+        <text x="53" y="19" text-anchor="middle" fill="#fbbf24">Auto-deliver</text>
       </g>
-      <g transform="translate(298,240)">
-        <rect width="86" height="28" rx="14" fill="#0f172a" stroke="#34d399" stroke-width="1.2"/>
-        <text x="43" y="19" text-anchor="middle" fill="#34d399">Fastify</text>
+      <g transform="translate(422,240)">
+        <rect width="98" height="28" rx="14" fill="#0a0e1a" stroke="#f472b6" stroke-width="1.2"/>
+        <text x="49" y="19" text-anchor="middle" fill="#f472b6">Dashboard</text>
       </g>
     </g>
   </g>