small updates and refined chat page

company_site/public/templates/base.html

@@ -24,12 +24,17 @@
 
   <!-- Navigation Bar -->
   <nav>
-    <a href="{% url 'public_index' %}" class="brand-logo">AI ML Operations</a>
+    <a href="{% url 'public_index' %}" class="brand-logo">
+      AI ML<span class="text-cyber-cyan"> OPERATIONS</span>
+
+    </a>
     <button class="mobile-menu-btn" aria-label="Menu">☰</button>
     <ul class="nav-links">
-      <li><a href="{% url 'public_index' %}">Home</a></li>
+      <li><a href="{% url 'public_index' %}"
+          class="{% if request.resolver_match.url_name == 'public_index' %}active{% endif %}">Home</a></li>
       <li class="dropdown">
-        <a href="#">Services</a>
+        <a href="#"
+          class="{% if request.resolver_match.url_name in 'ai_education,ai_sensor,bot,chat,computers,file_hosting,ml_model,web_design' %}active{% endif %}">Services</a>
         <ul class="dropdown-content">
           <li><a href="{% url 'ai_education' %}">Education</a></li>
           <li><a href="{% url 'ai_sensor' %}">Sensors</a></li>
@@ -41,7 +46,8 @@
           <li><a href="{% url 'web_design' %}">Web Design</a></li>
         </ul>
       </li>
-      <li><a href="{% url 'contact' %}">Contact</a></li>
+      <li><a href="{% url 'contact' %}"
+          class="{% if request.resolver_match.url_name == 'contact' %}active{% endif %}">Contact</a></li>
     </ul>
   </nav>
 

company_site/public/templates/public/chat.html

@@ -3,43 +3,46 @@
 
 {% block content %}
 
-<!-- Hero Section -->
-<div class="hero-section" style="height: 40vh; min-height: 300px;">
-  <div class="hero-content">
-    <h1 class="hero-title">Chat</h1>
-    <p class="hero-subtitle">Your Private, Secure, and Powerful LLM Solution</p>
-  </div>
-</div>
-
-<!-- Product Description Section -->
-<div class="section">
-  <div class="container">
-    <h2 class="section-title">What is Chat?</h2>
-    <p style="text-align: center; max-width: 800px; margin: 0 auto; color: var(--text-muted); font-size: 1.1rem;">
-      Chat is a closed-source Large Language Model (LLM) designed specifically for small and medium businesses. Hosted
-      locally, Chat ensures that all your data remains private and secure. With Chat, your data is never sold or
-      accessed by third parties—ever. You retain full control over your accounts and data. Chat also includes advanced
-      file analysis capabilities, making it a versatile tool for your business needs.
+<!-- Product Hero Section -->
+<div class="product-hero">
+  <div class="product-hero-content">
+    <h1 class="product-hero-title">Your Private, Secure AI Workspace</h1>
+    <p class="product-hero-subtitle">
+      Experience the power of a locally hosted Large Language Model.
+      Keep your data safe, analyze files securely, and never worry about third-party access.
     </p>
+    <div style="display: flex; gap: 1rem; flex-wrap: wrap;">
+      <a href="https://chat.aimloperations.com" class="btn">Launch Chat</a>
+      <a href="#features" class="btn"
+        style="background: transparent; border: 1px solid var(--text-muted); color: var(--text-color);">Learn More</a>
+    </div>
+  </div>
+  <div class="hero-image-container">
+    <img src="{% static 'public/img/chat_dashboard.png' %}" alt="Chat Dashboard Interface" class="hero-image">
   </div>
 </div>
 
 <!-- Features Section -->
-<div class="section" style="background: var(--surface-color);">
+<div id="features" class="section" style="background: var(--surface-color);">
   <div class="container">
-    <h2 class="section-title">Key Features</h2>
+    <h2 class="section-title">Why Choose Chat?</h2>
     <div class="card-grid">
-      <div class="card" style="text-align: center;">
-        <h5 class="card-title">Local Hosting</h5>
-        <p class="card-text">All data is stored and processed locally, ensuring maximum privacy and security.</p>
+      <div class="card">
+        <h5 class="card-title">🔒 Total Privacy</h5>
+        <p class="card-text">
+          Hosted locally on your infrastructure. Your data never leaves your control and is never sold to third parties.
+        </p>
       </div>
-      <div class="card" style="text-align: center;">
-        <h5 class="card-title">No Third-Party Access</h5>
-        <p class="card-text">Your data is never sold or accessed by third parties for any reason.</p>
+      <div class="card">
+        <h5 class="card-title">📄 Smart File Analysis</h5>
+        <p class="card-text">
+          Upload documents and get instant insights. Perfect for analyzing reports, codebases, and legal documents.
+        </p>
       </div>
-      <div class="card" style="text-align: center;">
-        <h5 class="card-title">File Analysis</h5>
-        <p class="card-text">Analyze files directly within the platform for seamless integration into your workflows.
+      <div class="card">
+        <h5 class="card-title">⚡ High Performance</h5>
+        <p class="card-text">
+          Optimized for speed and efficiency, giving you the power of modern LLMs without the latency of cloud APIs.
         </p>
       </div>
     </div>
@@ -49,21 +52,17 @@
 <!-- Pricing Section -->
 <div class="section">
   <div class="container">
-    <h2 class="section-title">Pricing</h2>
-
-    <div style="display: grid; grid-template-columns: 1fr 1fr; gap: 4rem; align-items: center;">
-      <div>
-        <img src="{% static 'public/img/chat_screenshot.png' %}"
-          style="width: 100%; border-radius: 12px; box-shadow: 0 10px 30px rgba(0,0,0,0.5);">
-      </div>
-      <div class="card" style="text-align: center; padding: 3rem;">
-        <h4 style="font-size: 3rem; color: var(--primary-color); margin-bottom: 0.5rem;">$10</h4>
-        <p style="color: var(--text-muted); margin-bottom: 2rem;">per user per month</p>
-        <p style="margin-bottom: 2rem;">Start with a free trial to experience the power of Chat.</p>
-        <a class="btn" href="https://chat.aimloperations.com">Inquire Now</a>
+    <div class="card"
+      style="max-width: 800px; margin: 0 auto; text-align: center; padding: 4rem 2rem; border: 1px solid var(--primary-color);">
+      <h2 style="font-size: 2.5rem; margin-bottom: 1rem; color: white;">Simple, Transparent Pricing</h2>
+      <div style="font-size: 4rem; font-weight: 800; color: var(--primary-color); margin-bottom: 1rem;">
+        $10 <span style="font-size: 1.5rem; color: var(--text-muted); font-weight: 400;">/ user / month</span>
       </div>
+      <p style="color: var(--text-muted); margin-bottom: 2.5rem; font-size: 1.1rem;">
+        Get full access to all features, including unlimited chats and file analysis.
+      </p>
+      <a class="btn" href="https://chat.aimloperations.com">Start Your Free Trial</a>
     </div>
-
   </div>
 </div>
 

company_site/public/templates/public/contact.html

@@ -13,7 +13,7 @@
 <!-- Contact Content -->
 <div class="section">
   <div class="container">
-    <div style="display: grid; grid-template-columns: 2fr 1fr; gap: 4rem;">
+    <div class="contact-grid">
 
       <!-- Form Column -->
       <div>
@@ -32,7 +32,7 @@
           <h4 class="card-title" style="margin-bottom: 2rem;">Send Us a Message</h4>
           <form action="{% url 'contact' %}" method="POST">
             {% csrf_token %}
-            <div style="display: grid; grid-template-columns: 1fr 1fr; gap: 1rem;">
+            <div class="form-row">
               <div class="form-group">
                 <input type="text" class="form-control" name="name" placeholder="Your Name">
               </div>