.ai-demo {
 max-width: 900px;
 margin: 120px auto;
 padding: 0 20px;
 color: #fff;
}

.ai-demo h1 {
 font-size: 48px;
 margin-bottom: 12px;
}

.ai-subtitle {
 opacity: .7;
 margin-bottom: 40px;
}

.chat-container {
 border: 1px solid rgba(255,255,255,.1);
 border-radius: 20px;
 padding: 24px;
 backdrop-filter: blur(10px);
}

#messages {
 min-height: 300px;
 max-height: 400px;
 overflow-y: auto;
 margin-bottom: 20px;
}

#messages p {
 margin-bottom: 12px;
 font-size: 15px;
}

.chat-input {
 display: flex;
 gap: 12px;
}

.chat-input input {
 flex: 1;
 background: transparent;
 border: 1px solid rgba(255,255,255,.2);
 padding: 12px 16px;
 color: #fff;
 border-radius: 30px;
 outline: none;
}

.chat-input button {
 background: transparent;
 border: none;
 color: #fff;
 cursor: pointer;
 font-size: 16px;
 transition: opacity .2s;
}

.chat-input button:hover {
 opacity: .7;
}