diff --git a/index.html b/index.html
index 3d1c008..cc9e98b 100644
--- a/index.html
+++ b/index.html
@@ -1106,137 +1106,259 @@
             }
         }
 
-                    /* ── Chat Bar (inline below header) ────────────────── */
-            .chat-bar {
-                display: flex;
-                flex-direction: column;
-                align-items: flex-start;
-                margin-top: 60px;
-                padding: 0 24px;
-                max-width: var(--max-width);
-                margin-left: auto;
-                margin-right: auto;
-            }
-            .chat-bar-panel {
-                width: 340px;
-                max-width: 100%;
-                height: 300px;
-                background: var(--bg-card);
-                border: 1px solid var(--accent);
-                border-radius: 18px;
-                box-shadow: 0 24px 80px rgba(0,0,0,0.5);
-                overflow: hidden;
-                display: none;
-                flex-direction: column;
-                margin-bottom: 8px;
-            }
-            .chat-bar-panel.open {
-                display: flex;
-            }
-            .chat-bar-input {
-                display: flex;
-                align-items: center;
-                width: 340px;
-                max-width: 100%;
-                height: 36px;
-                background: var(--bg-inner);
-                border: 1px solid var(--border);
-                border-radius: 999px;
-                overflow: hidden;
-                flex-shrink: 0;
-                transition: border-color 0.25s, box-shadow 0.25s;
-            }
-            .chat-bar-input:focus-within {
-                border-color: var(--accent);
-                box-shadow: 0 0 0 2px rgba(79, 142, 247, 0.15);
-            }
-            .chat-bar-toggle,
-            .chat-bar-send {
-                background: none;
+                    /* ── Chat Widget (glowing floating button + glass panel) ── */
+            .chat-fab {
+                position: fixed;
+                bottom: 28px;
+                right: 28px;
+                z-index: 9999;
+                width: 60px;
+                height: 60px;
+                border-radius: 50%;
+                background: linear-gradient(135deg, #4f8ef7, #6c5ce7);
                 border: none;
                 cursor: pointer;
-                height: 100%;
-                color: var(--accent);
-                padding: 0 10px;
-                font-size: 0.85rem;
+                box-shadow: 0 4px 24px rgba(79, 142, 247, 0.45), 0 0 0 0 rgba(79, 142, 247, 0.4);
                 display: flex;
                 align-items: center;
                 justify-content: center;
+                font-size: 26px;
+                color: #fff;
+                transition: transform 0.3s cubic-bezier(.34,1.56,.64,1), box-shadow 0.3s;
+                animation: fabPulse 2.5s ease-in-out infinite;
             }
-            .chat-bar-toggle {
-                border-right: 1px solid var(--border);
-                font-size: 0.8rem;
-                padding: 0 8px;
+            @keyframes fabPulse {
+                0%, 100% { box-shadow: 0 4px 24px rgba(79, 142, 247, 0.45), 0 0 0 0 rgba(79, 142, 247, 0.4); }
+                50% { box-shadow: 0 4px 32px rgba(79, 142, 247, 0.6), 0 0 0 12px rgba(79, 142, 247, 0); }
             }
-            .chat-bar-send {
-                border-left: 1px solid var(--border);
+            .chat-fab:hover {
+                transform: scale(1.12) rotate(-8deg);
+                box-shadow: 0 6px 36px rgba(79, 142, 247, 0.55);
+                animation: none;
             }
-            .chat-bar-field {
-                flex: 1;
-                min-width: 0;
-                padding: 0 10px;
-                border: none;
-                outline: none;
-                background: transparent;
-                font: inherit;
-                color: var(--text);
-                font-size: 0.78rem;
-            }
-            .chat-bar-field::placeholder { color: var(--text-muted); }
-            .chat-msg {
-                max-width: 85%;
-                padding: 8px 12px;
-                border-radius: 12px;
-                line-height: 1.4;
-                word-wrap: break-word;
-                font-size: 12.5px;
-            }
-            .chat-msg-bot {
-                align-self: flex-start;
-                background: var(--bg-inner);
-                border-bottom-left-radius: 4px;
-            }
-            .chat-msg-user {
-                align-self: flex-end;
-                background: var(--accent-dim);
-                border-bottom-right-radius: 4px;
-            }
-            .chat-msg-thinking {
-                align-self: flex-start;
-                background: var(--bg-inner);
-                border-bottom-left-radius: 4px;
+            .chat-fab:active { transform: scale(0.92); }
+            .chat-fab.open {
+                transform: scale(0.88);
                 opacity: 0.6;
+                animation: none;
             }
-            .chat-panel-header {
+            .chat-widget {
+                position: fixed;
+                bottom: 100px;
+                right: 28px;
+                z-index: 9998;
+                width: 380px;
+                max-width: calc(100vw - 56px);
+                height: 520px;
+                max-height: calc(100vh - 160px);
+                background: rgba(26, 29, 39, 0.92);
+                backdrop-filter: blur(20px);
+                -webkit-backdrop-filter: blur(20px);
+                border: 1px solid rgba(79, 142, 247, 0.25);
+                border-radius: 22px;
+                box-shadow: 0 24px 80px rgba(0,0,0,0.6), 0 0 40px rgba(79, 142, 247, 0.08);
+                overflow: hidden;
+                display: flex;
+                flex-direction: column;
+                opacity: 0;
+                visibility: hidden;
+                transform: translateY(16px) scale(0.94);
+                transform-origin: bottom right;
+                transition: opacity 0.3s cubic-bezier(.22,1,.36,1), transform 0.35s cubic-bezier(.22,1,.36,1), visibility 0.3s;
+            }
+            .chat-widget.open {
+                opacity: 1;
+                visibility: visible;
+                transform: translateY(0) scale(1);
+            }
+            .chat-widget::before {
+                content: '';
+                position: absolute;
+                inset: 0;
+                border-radius: 22px;
+                padding: 1px;
+                background: linear-gradient(135deg, rgba(79, 142, 247, 0.35), rgba(108, 92, 231, 0.15), rgba(79, 142, 247, 0.35));
+                -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
+                -webkit-mask-composite: xor;
+                mask-composite: exclude;
+                pointer-events: none;
+            }
+            .chat-header {
                 display: flex;
                 align-items: center;
-                justify-content: space-between;
-                padding: 12px 16px;
-                border-bottom: 1px solid var(--border);
-                font-weight: 600;
-                font-size: 13px;
-                color: var(--text);
+                gap: 12px;
+                padding: 18px 20px 14px;
+                background: linear-gradient(135deg, rgba(79, 142, 247, 0.08), rgba(108, 92, 231, 0.04));
+                border-bottom: 1px solid rgba(79, 142, 247, 0.12);
             }
-            .chat-panel-close {
+            .chat-header-avatar {
+                width: 36px;
+                height: 36px;
+                border-radius: 50%;
+                background: linear-gradient(135deg, var(--accent-dim), #2a1f5e);
+                border: 2px solid var(--accent);
+                display: flex;
+                align-items: center;
+                justify-content: center;
+                font-size: 18px;
+                flex-shrink: 0;
+                position: relative;
+            }
+            .chat-header-avatar::after {
+                content: '';
+                position: absolute;
+                bottom: -1px;
+                right: -1px;
+                width: 10px;
+                height: 10px;
+                border-radius: 50%;
+                background: var(--success);
+                border: 2px solid var(--bg-card);
+            }
+            .chat-header-info { flex: 1; min-width: 0; }
+            .chat-header-name {
+                font-weight: 700;
+                font-size: 14px;
+                color: var(--text);
+                letter-spacing: -0.01em;
+            }
+            .chat-header-status {
+                font-size: 11px;
+                color: var(--success);
+                display: flex;
+                align-items: center;
+                gap: 5px;
+            }
+            .chat-header-status::before {
+                content: '';
+                width: 5px;
+                height: 5px;
+                border-radius: 50%;
+                background: var(--success);
+                display: inline-block;
+                animation: statusPulse 2s ease-in-out infinite;
+            }
+            @keyframes statusPulse {
+                0%, 100% { opacity: 1; }
+                50% { opacity: 0.4; }
+            }
+            .chat-header-close {
                 background: none;
                 border: none;
                 color: var(--text-muted);
                 cursor: pointer;
-                font-size: 14px;
-                padding: 2px 6px;
+                font-size: 18px;
+                padding: 6px;
                 line-height: 1;
+                border-radius: 8px;
+                transition: color 0.15s, background 0.15s;
             }
-            .chat-panel-close:hover { color: var(--text); }
-            .chat-history {
+            .chat-header-close:hover { color: var(--text); background: rgba(255,255,255,0.06); }
+            .chat-msgs {
                 flex: 1;
                 overflow-y: auto;
-                padding: 12px 16px;
+                padding: 16px 18px;
                 display: flex;
                 flex-direction: column;
-                gap: 8px;
+                gap: 10px;
+                scroll-behavior: smooth;
             }
-            @media (max-width: 700px) {
-                .chat-bar { display: none; }
+            .chat-msgs::-webkit-scrollbar { width: 4px; }
+            .chat-msgs::-webkit-scrollbar-track { background: transparent; }
+            .chat-msgs::-webkit-scrollbar-thumb { background: var(--border); border-radius: 4px; }
+            .chat-input-row {
+                display: flex;
+                align-items: center;
+                gap: 8px;
+                padding: 12px 16px 16px;
+                border-top: 1px solid rgba(79, 142, 247, 0.08);
+                background: rgba(15, 17, 23, 0.5);
+            }
+            .chat-input-box {
+                flex: 1;
+                min-width: 0;
+                padding: 10px 16px;
+                border: 1px solid var(--border);
+                border-radius: 22px;
+                outline: none;
+                background: rgba(18, 21, 31, 0.8);
+                color: var(--text);
+                font-size: 13px;
+                transition: border-color 0.2s, box-shadow 0.2s;
+            }
+            .chat-input-box:focus {
+                border-color: var(--accent);
+                box-shadow: 0 0 0 2px rgba(79, 142, 247, 0.1);
+            }
+            .chat-input-box::placeholder { color: var(--text-muted); }
+            .chat-send-btn {
+                width: 38px;
+                height: 38px;
+                border-radius: 50%;
+                background: linear-gradient(135deg, var(--accent), #6c5ce7);
+                border: none;
+                cursor: pointer;
+                color: #fff;
+                font-size: 16px;
+                display: flex;
+                align-items: center;
+                justify-content: center;
+                flex-shrink: 0;
+                transition: opacity 0.15s, transform 0.2s cubic-bezier(.34,1.56,.64,1), box-shadow 0.2s;
+                box-shadow: 0 2px 12px rgba(79, 142, 247, 0.3);
+            }
+            .chat-send-btn:hover { opacity: 0.9; transform: scale(1.08); box-shadow: 0 4px 16px rgba(79, 142, 247, 0.4); }
+            .chat-send-btn:active { transform: scale(0.88); }
+            .chat-send-btn:disabled { opacity: 0.35; cursor: not-allowed; transform: none; box-shadow: none; }
+            .chat-msg {
+                max-width: 80%;
+                padding: 10px 14px;
+                border-radius: 16px;
+                line-height: 1.5;
+                word-wrap: break-word;
+                font-size: 13px;
+                animation: msgSlide 0.25s cubic-bezier(.22,1,.36,1);
+            }
+            @keyframes msgSlide {
+                from { opacity: 0; transform: translateY(8px) scale(0.97); }
+                to { opacity: 1; transform: translateY(0) scale(1); }
+            }
+            .chat-msg-bot {
+                align-self: flex-start;
+                background: rgba(26, 29, 39, 0.8);
+                border: 1px solid rgba(79, 142, 247, 0.1);
+                border-bottom-left-radius: 4px;
+            }
+            .chat-msg-user {
+                align-self: flex-end;
+                background: linear-gradient(135deg, var(--accent), #5a7de0);
+                color: #fff;
+                border-bottom-right-radius: 4px;
+            }
+            .chat-msg-thinking {
+                align-self: flex-start;
+                background: rgba(26, 29, 39, 0.6);
+                border: 1px solid rgba(79, 142, 247, 0.08);
+                border-bottom-left-radius: 4px;
+                opacity: 0.5;
+            }
+            @media (max-width: 500px) {
+                .chat-widget {
+                    right: 12px;
+                    bottom: 84px;
+                    width: calc(100vw - 24px);
+                    max-height: calc(100vh - 120px);
+                }
+                .chat-fab {
+                    right: 16px;
+                    bottom: 20px;
+                    width: 52px;
+                    height: 52px;
+                    font-size: 22px;
+                }
+            }
+            @media (max-width: 350px) {
+                .chat-widget { display: none; }
             }
 
         /* ══════════════════════════════════════════════════════════
@@ -1348,20 +1470,24 @@
     </header>
 
     <!-- ═══════════════════════════════════════════════════════════════
-         CHAT BAR (inline — panel above input, pushes it down)
+         CHAT WIDGET (floating bottom-right)
          ═══════════════════════════════════════════════════════════════ -->
-    <div class="chat-bar">
-        <div class="chat-bar-panel" id="chat-panel" aria-hidden="true">
-            <div class="chat-panel-header">
-                <span class="chat-panel-title">💬 Sales Agent</span>
-                <button class="chat-panel-close" id="chat-panel-close" onclick="chatClose()">✕</button>
+    <button class="chat-fab" id="chat-fab" onclick="chatToggle()" aria-label="Chat with Sales Agent">
+        <svg width="28" height="28" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"/></svg>
+    </button>
+    <div class="chat-widget" id="chat-widget" aria-hidden="true">
+        <div class="chat-header">
+            <div class="chat-header-avatar">⚡</div>
+            <div class="chat-header-info">
+                <div class="chat-header-name">Sales Agent</div>
+                <div class="chat-header-status">Online</div>
             </div>
-            <div class="chat-history" id="chat-msgs"></div>
+            <button class="chat-header-close" onclick="chatClose()" aria-label="Close chat">✕</button>
         </div>
-        <div class="chat-bar-input">
-            <button class="chat-bar-toggle" id="chat-toggle" onclick="chatToggle()" aria-label="Toggle chat">💬</button>
-            <input type="text" class="chat-bar-field" id="chat-input" placeholder="Ask your sales agent" onkeydown="chatKey(event)" />
-            <button class="chat-bar-send" id="chat-send-btn" onclick="chatSend()">➤</button>
+        <div class="chat-msgs" id="chat-msgs"></div>
+        <div class="chat-input-row">
+            <input type="text" class="chat-input-box" id="chat-input" placeholder="Ask your sales agent..." onkeydown="chatKey(event)" />
+            <button class="chat-send-btn" id="chat-send-btn" onclick="chatSend()">➤</button>
         </div>
     </div>
 
@@ -2226,14 +2352,15 @@
 
         function chatToggle() {
             chatOpen = !chatOpen;
-            document.getElementById('chat-panel').classList.toggle('open', chatOpen);
-            document.getElementById('chat-panel').setAttribute('aria-hidden', !chatOpen);
+            document.getElementById('chat-widget').classList.toggle('open', chatOpen);
+            document.getElementById('chat-fab').classList.toggle('open', chatOpen);
+            document.getElementById('chat-widget').setAttribute('aria-hidden', !chatOpen);
             if (chatOpen) {
                 if (!chatId) {
                     chatId = String(Math.floor(100000 + Math.random() * 900000));
                     chatAppendMsg('bot', "Hi! I'm your Sales Agent. Ask me about plans, setup, pricing, integrations, or anything about your AI agent.");
                 }
-                setTimeout(() => document.getElementById('chat-input').focus(), 100);
+                setTimeout(() => document.getElementById('chat-input').focus(), 300);
             }
         }
 
@@ -2244,8 +2371,8 @@
         function chatOpenSilent() {
             if (!chatOpen) {
                 chatOpen = true;
-                document.getElementById('chat-panel').classList.add('open');
-                document.getElementById('chat-panel').setAttribute('aria-hidden', 'false');
+                document.getElementById('chat-widget').classList.add('open');
+                document.getElementById('chat-widget').setAttribute('aria-hidden', 'false');
             }
         }