1

assets/css/custom.css

@@ -0,0 +1,219 @@
+/* General Body Styles */
+body {
+    font-family: 'Inter', sans-serif;
+    background-color: #F9FAFB;
+    color: #111827;
+}
+
+/* Typography */
+h1, h2, h3, h4, h5, h6 {
+    font-family: 'Georgia', serif;
+}
+
+h2 {
+    color: #8B5CF6;
+}
+
+
+
+/* Hero Section */
+.hero {
+    background: linear-gradient(45deg, #8B5CF6, #6366F1, #EF4444);
+    color: white;
+    padding: 100px 0;
+}
+
+.hero h1 {
+    font-size: 3.5rem;
+    font-weight: bold;
+}
+
+.hero p {
+    font-size: 1.25rem;
+}
+
+/* Section Padding */
+.section {
+    padding: 80px 0;
+}
+
+/* Card Styles */
+.card {
+    border: 1px solid #E5E7EB;
+    border-radius: 0.5rem;
+    box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
+}
+
+/* Button Styles */
+.btn-primary {
+    background-color: #8B5CF6;
+    border-color: #8B5CF6;
+    padding: 12px 24px;
+    border-radius: 0.5rem;
+}
+
+.btn-primary:hover {
+    background-color: #7C3AED;
+    border-color: #7C3AED;
+}
+
+.btn-secondary {
+    background-color: #EF4444;
+    border-color: #EF4444;
+    padding: 12px 24px;
+    border-radius: 0.5rem;
+}
+
+.btn-secondary:hover {
+    background-color: #DC2626;
+    border-color: #DC2626;
+}
+
+/* Contact Form */
+.contact-form {
+    background: white;
+    padding: 40px;
+    border-radius: 0.5rem;
+    box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
+}
+
+/* Who We Serve Section */
+.serve-title {
+    color: #9CA3AF;
+    font-size: 1rem;
+    text-transform: uppercase;
+    letter-spacing: 0.05em;
+    margin-bottom: 1.5rem;
+    border-bottom: 1px solid #E5E7EB;
+    padding-bottom: 0.5rem;
+}
+
+.serve-list {
+    list-style: none;
+    padding-left: 0;
+}
+
+.serve-list li {
+    display: flex;
+    align-items: center;
+    font-size: 1.1rem;
+    margin-bottom: 1rem;
+    color: #374151;
+}
+
+.serve-list li i {
+    color: #8B5CF6;
+    font-size: 1.5rem;
+    margin-right: 1rem;
+    width: 24px; /* Align icons */
+    text-align: center;
+}
+
+/* Scrolling Wrapper */
+.scrolling-wrapper {
+    display: flex;
+    flex-wrap: nowrap;
+    overflow-x: auto;
+    -webkit-overflow-scrolling: touch;
+    padding-bottom: 1rem;
+}
+
+.scrolling-item {
+    flex: 0 0 auto;
+    margin-right: 1rem;
+    padding: 1rem;
+    background: white;
+    border-radius: 0.5rem;
+    text-align: center;
+    min-width: 200px;
+}
+
+/* Custom Scrollbar */
+.scrolling-wrapper::-webkit-scrollbar {
+    height: 8px;
+}
+
+.scrolling-wrapper::-webkit-scrollbar-track {
+    background: #f1f1f1;
+    border-radius: 10px;
+}
+
+.scrolling-wrapper::-webkit-scrollbar-thumb {
+    background: #8B5CF6;
+    border-radius: 10px;
+}
+
+.scrolling-wrapper::-webkit-scrollbar-thumb:hover {
+    background: #7C3AED;
+}
+
+/* Logo */
+.logo {
+    height: 60px;
+}
+
+/* Timeline */
+.timeline {
+    position: relative;
+    max-width: 1200px;
+    margin: 0 auto;
+    counter-reset: timeline-counter;
+}
+
+.timeline::after {
+    content: '';
+    position: absolute;
+    width: 6px;
+    background-color: #E5E7EB; /* Lighter line color */
+    top: 0;
+    bottom: 0;
+    left: 50%;
+    margin-left: -3px;
+}
+
+.timeline-item {
+    padding: 10px 40px;
+    position: relative;
+    background-color: inherit;
+    width: 50%;
+    counter-increment: timeline-counter;
+}
+
+.timeline-item.left {
+    left: 0;
+}
+
+.timeline-item.right {
+    left: 50%;
+}
+
+.timeline-item::after {
+    content: counter(timeline-counter);
+    position: absolute;
+    width: 60px;
+    height: 60px;
+    right: -30px;
+    background-color: #8B5CF6;
+    color: white;
+    border: 4px solid #F9FAFB;
+    top: 50%;
+    transform: translateY(-50%);
+    border-radius: 50%;
+    z-index: 1;
+    font-size: 1.8rem;
+    font-weight: bold;
+    text-align: center;
+    line-height: 52px;
+}
+
+.timeline-item.right::after {
+    left: -30px;
+}
+
+.timeline-content {
+    padding: 20px 30px;
+    background-color: white;
+    position: relative;
+    border-radius: 6px;
+    box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
+}

assets/js/main.js

@@ -0,0 +1,98 @@
+// Smooth scrolling for anchor links
+document.querySelectorAll('a[href^="#"]').forEach(anchor => {
+    anchor.addEventListener('click', function (e) {
+        e.preventDefault();
+
+        document.querySelector(this.getAttribute('href')).scrollIntoView({
+            behavior: 'smooth'
+        });
+    });
+});
+
+// 3D Logo
+function init3DLogo() {
+    const canvas = document.getElementById('3d-logo-canvas');
+    if (canvas && typeof THREE !== 'undefined') {
+        let scene, camera, renderer, plane;
+
+        function init() {
+            // Scene
+            scene = new THREE.Scene();
+
+            // Camera
+            camera = new THREE.PerspectiveCamera(75, canvas.clientWidth / canvas.clientHeight, 0.1, 1000);
+            camera.position.z = 5;
+
+            // Renderer
+            renderer = new THREE.WebGLRenderer({ antialias: true, alpha: true, canvas: canvas });
+            renderer.setSize(canvas.clientWidth, canvas.clientHeight);
+
+            // Texture
+            const textureLoader = new THREE.TextureLoader();
+            textureLoader.load('assets/pasted-20251022-215019-f7191fbf.png', 
+                function(texture) {
+                    // Plane
+                    const geometry = new THREE.PlaneGeometry(5, 1.5);
+                    const material = new THREE.MeshStandardMaterial({ map: texture, transparent: true, roughness: 0.4, metalness: 0.2 });
+                    plane = new THREE.Mesh(geometry, material);
+                    scene.add(plane);
+                },
+                undefined, // onProgress callback not needed
+                function(err) {
+                    console.error('An error happened while loading the texture.', err);
+                }
+            );
+
+            // Lights
+            const ambientLight = new THREE.AmbientLight(0xffffff, 0.7);
+            scene.add(ambientLight);
+
+            const pointLight = new THREE.PointLight(0xDB7093, 1.2); // Purple-red light
+            pointLight.position.set(0, 0, 5);
+            scene.add(pointLight);
+
+            // Animation
+            animate();
+        }
+
+        let mouseX = 0, mouseY = 0;
+        let targetX = 0, targetY = 0;
+        const windowHalfX = window.innerWidth / 2;
+        const windowHalfY = window.innerHeight / 2;
+
+        function onDocumentMouseMove(event) {
+            mouseX = (event.clientX - windowHalfX) / 2;
+            mouseY = (event.clientY - windowHalfY) / 2;
+        }
+        document.addEventListener('mousemove', onDocumentMouseMove);
+
+
+        function animate() {
+            requestAnimationFrame(animate);
+            
+            targetX = mouseX * .001;
+            targetY = mouseY * .001;
+
+            if (plane) {
+                plane.rotation.y += .05 * (targetX - plane.rotation.y);
+                plane.rotation.x += .05 * (targetY - plane.rotation.x);
+            }
+
+            renderer.render(scene, camera);
+        }
+
+        function onWindowResize() {
+            if (canvas.clientWidth > 0 && canvas.clientHeight > 0) {
+                camera.aspect = canvas.clientWidth / canvas.clientHeight;
+                camera.updateProjectionMatrix();
+                renderer.setSize(canvas.clientWidth, canvas.clientHeight);
+            }
+        }
+
+        window.addEventListener('resize', onWindowResize, false);
+
+        init();
+    }
+}
+
+window.addEventListener('load', init3DLogo);

automated-evidence-intelligence.php

@@ -0,0 +1,54 @@
+<?php session_start(); ?>
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Automated Evidence Intelligence - Vision AI</title>
+    <meta name="description" content="Learn more about Automated Evidence Intelligence.">
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
+    <link rel="stylesheet" href="assets/css/custom.css?v=<?php echo time(); ?>">
+</head>
+<body>
+
+    <!-- Navbar -->
+    <nav class="navbar navbar-expand-lg navbar-light bg-light sticky-top">
+        <div class="container">
+            <a class="navbar-brand" href="/">
+                <img src="assets/pasted-20251022-215019-f7191fbf.png" alt="Vision AI Logo" class="logo">
+            </a>
+            <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
+                <span class="navbar-toggler-icon"></span>
+            </button>
+            <div class="collapse navbar-collapse" id="navbarNav">
+                <ul class="navbar-nav ms-auto">
+                    <li class="nav-item"><a class="nav-link" href="/">Home</a></li>
+                    <li class="nav-item"><a class="nav-link" href="/#problem">The Problem</a></li>
+                    <li class="nav-item"><a class="nav-link" href="/#solution">The Solution</a></li>
+                    <li class="nav-item"><a class="nav-link" href="/#features">Features</a></li>
+                    <li class="nav-item"><a class="nav-link" href="/#for-whom">For Whom</a></li>
+                    <li class="nav-item"><a class="nav-link" href="/#why-vision-copilot">Why Vision Copilot</a></li>
+                    <li class="nav-item"><a class="nav-link" href="/#contact">Contact</a></li>
+                </ul>
+            </div>
+        </div>
+    </nav>
+
+    <!-- Main Content -->
+    <main class="container section">
+        <h1 class="text-center">Automated Evidence Intelligence</h1>
+        <p class="lead text-center">This is a placeholder page for Automated Evidence Intelligence. Please provide the content you would like to see here.</p>
+    </main>
+
+    <!-- Footer -->
+    <footer class="bg-dark text-white text-center py-4 mt-auto">
+        <div class="container">
+            <p>&copy; <?php echo date('Y'); ?> Vision AI. All Rights Reserved.</p>
+            <p><a href="/privacy.php" class="text-white">Privacy Policy</a></p>
+        </div>
+    </footer>
+
+    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
+    <script src="assets/js/main.js?v=<?php echo time(); ?>"></script>
+</body>
+</html>

contact.php

@@ -0,0 +1,32 @@
+<?php
+session_start();
+
+if ($_SERVER["REQUEST_METHOD"] == "POST") {
+    $name = trim($_POST['name']);
+    $email = trim($_POST['email']);
+    $message = trim($_POST['message']);
+
+    if (empty($name) || empty($email) || empty($message) || !filter_var($email, FILTER_VALIDATE_EMAIL)) {
+        $_SESSION['error'] = "Please fill out all fields with valid information.";
+        header("Location: /#contact");
+        exit();
+    }
+
+    require_once 'mail/MailService.php';
+    $mailResult = MailService::sendContactMessage($name, $email, $message, 'vo.info.contact@gmail.com');
+
+    if (!empty($mailResult['success'])) {
+        $_SESSION['success'] = "Thank you for your message. We will get back to you shortly.";
+    } else {
+        $_SESSION['error'] = "Sorry, there was an error sending your message. Please try again later.";
+        if (!empty($mailResult['error'])) {
+            error_log("MailService Error: " . $mailResult['error']);
+        }
+    }
+
+    header("Location: /#contact");
+    exit();
+} else {
+    header("Location: /");
+    exit();
+}

db/config.php

@@ -1,17 +1,40 @@
 <?php
-// Generated by setup_mariadb_project.sh — edit as needed.
+// Database configuration
 define('DB_HOST', '127.0.0.1');
-define('DB_NAME', 'app_30953');
-define('DB_USER', 'app_30953');
-define('DB_PASS', 'e45f2778-db1f-450c-99c6-29efb4601472');
+define('DB_PORT', '3306');
+define('DB_NAME', 'app');
+define('DB_USER', 'app');
+define('DB_PASSWORD', 'app');
 
 function db() {
-  static $pdo;
-  if (!$pdo) {
-    $pdo = new PDO('mysql:host='.DB_HOST.';dbname='.DB_NAME.';charset=utf8mb4', DB_USER, DB_PASS, [
-      PDO::ATTR_ERRMODE => PDO::ERRMODE_EXCEPTION,
-      PDO::ATTR_DEFAULT_FETCH_MODE => PDO::FETCH_ASSOC,
-    ]);
-  }
-  return $pdo;
+    static $pdo;
+    if ($pdo) {
+        return $pdo;
+    }
+    $dsn = 'mysql:host=' . DB_HOST . ';port=' . DB_PORT . ';dbname=' . DB_NAME . ';charset=utf8mb4';
+    $options = [
+        PDO::ATTR_ERRMODE            => PDO::ERRMODE_EXCEPTION,
+        PDO::ATTR_DEFAULT_FETCH_MODE => PDO::FETCH_ASSOC,
+        PDO::ATTR_EMULATE_PREPARES   => false,
+    ];
+    try {
+        $pdo = new PDO($dsn, DB_USER, DB_PASSWORD, $options);
+        return $pdo;
+    } catch (PDOException $e) {
+        // In a real app, you would log this error and show a generic error page.
+        // For development, it's okay to show the error.
+        throw new PDOException($e->getMessage(), (int)$e->getCode());
+    }
 }
+
+// Run migrations
+try {
+    $pdo = db();
+    $migration_files = glob(__DIR__ . '/migrations/*.sql');
+    foreach ($migration_files as $file) {
+        $sql = file_get_contents($file);
+        $pdo->exec($sql);
+    }
+} catch (PDOException $e) {
+    // Handle migration errors
+}

db/migrations/001_create_contact_submissions.sql

@@ -0,0 +1,7 @@
+CREATE TABLE IF NOT EXISTS contact_submissions (
+    id INT AUTO_INCREMENT PRIMARY KEY,
+    name VARCHAR(255) NOT NULL,
+    email VARCHAR(255) NOT NULL,
+    message TEXT NOT NULL,
+    created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP
+);

features/ai-copilot-qa.php

@@ -0,0 +1,54 @@
+<?php session_start(); ?>
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>AI Copilot Q&A - Vision AI</title>
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
+    <link rel="stylesheet" href="../assets/css/custom.css?v=<?php echo time(); ?>">
+</head>
+<body>
+
+    <!-- Navbar -->
+    <nav class="navbar navbar-expand-lg navbar-light bg-light sticky-top">
+        <div class="container">
+            <a class="navbar-brand" href="/">
+                <img src="../assets/pasted-20251022-215019-f7191fbf.png" alt="Vision AI Logo" class="logo">
+            </a>
+            <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
+                <span class="navbar-toggler-icon"></span>
+            </button>
+            <div class="collapse navbar-collapse" id="navbarNav">
+                <ul class="navbar-nav ms-auto">
+                    <li class="nav-item"><a class="nav-link" href="/">Home</a></li>
+                    <li class="nav-item"><a class="nav-link" href="/#problem">The Problem</a></li>
+                    <li class="nav-item"><a class="nav-link" href="/#solution">The Solution</a></li>
+                    <li class="nav-item"><a class="nav-link" href="/#features">Features</a></li>
+                    <li class="nav-item"><a class="nav-link" href="/#for-whom">For Whom</a></li>
+                    <li class="nav-item"><a class="nav-link" href="/#why-vision-copilot">Why Vision Copilot</a></li>
+                    <li class="nav-item"><a class="nav-link" href="/#contact">Contact</a></li>
+                </ul>
+            </div>
+        </div>
+    </nav>
+
+    <!-- Main Content -->
+    <main class="container section">
+        <h1>AI Copilot Q&A</h1>
+        <p>This is the page for the AI Copilot Q&A feature.</p>
+        <p><a href="/">Back to Home</a></p>
+    </main>
+
+    <!-- Footer -->
+    <footer class="bg-dark text-white text-center py-4">
+        <div class="container">
+            <p>&copy; <?php echo date('Y'); ?> Vision AI. All Rights Reserved.</p>
+            <p><a href="/privacy.php" class="text-white">Privacy Policy</a></p>
+        </div>
+    </footer>
+
+    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
+    <script src="../assets/js/main.js?v=<?php echo time(); ?>"></script>
+</body>
+</html>

features/automatic-gap-detection.php

@@ -0,0 +1,54 @@
+<?php session_start(); ?>
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Automatic Gap Detection - Vision AI</title>
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
+    <link rel="stylesheet" href="../assets/css/custom.css?v=<?php echo time(); ?>">
+</head>
+<body>
+
+    <!-- Navbar -->
+    <nav class="navbar navbar-expand-lg navbar-light bg-light sticky-top">
+        <div class="container">
+            <a class="navbar-brand" href="/">
+                <img src="../assets/pasted-20251022-215019-f7191fbf.png" alt="Vision AI Logo" class="logo">
+            </a>
+            <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
+                <span class="navbar-toggler-icon"></span>
+            </button>
+            <div class="collapse navbar-collapse" id="navbarNav">
+                <ul class="navbar-nav ms-auto">
+                    <li class="nav-item"><a class="nav-link" href="/">Home</a></li>
+                    <li class="nav-item"><a class="nav-link" href="/#problem">The Problem</a></li>
+                    <li class="nav-item"><a class="nav-link" href="/#solution">The Solution</a></li>
+                    <li class="nav-item"><a class="nav-link" href="/#features">Features</a></li>
+                    <li class="nav-item"><a class="nav-link" href="/#for-whom">For Whom</a></li>
+                    <li class="nav-item"><a class="nav-link" href="/#why-vision-copilot">Why Vision Copilot</a></li>
+                    <li class="nav-item"><a class="nav-link" href="/#contact">Contact</a></li>
+                </ul>
+            </div>
+        </div>
+    </nav>
+
+    <!-- Main Content -->
+    <main class="container section">
+        <h1>Automatic Gap Detection</h1>
+        <p>This is the page for the Automatic Gap Detection feature.</p>
+        <p><a href="/">Back to Home</a></p>
+    </main>
+
+    <!-- Footer -->
+    <footer class="bg-dark text-white text-center py-4">
+        <div class="container">
+            <p>&copy; <?php echo date('Y'); ?> Vision AI. All Rights Reserved.</p>
+            <p><a href="/privacy.php" class="text-white">Privacy Policy</a></p>
+        </div>
+    </footer>
+
+    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
+    <script src="../assets/js/main.js?v=<?php echo time(); ?>"></script>
+</body>
+</html>

features/cross-framework-mapping.php

@@ -0,0 +1,54 @@
+<?php session_start(); ?>
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Cross-Framework Mapping - Vision AI</title>
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
+    <link rel="stylesheet" href="../assets/css/custom.css?v=<?php echo time(); ?>">
+</head>
+<body>
+
+    <!-- Navbar -->
+    <nav class="navbar navbar-expand-lg navbar-light bg-light sticky-top">
+        <div class="container">
+            <a class="navbar-brand" href="/">
+                <img src="../assets/pasted-20251022-215019-f7191fbf.png" alt="Vision AI Logo" class="logo">
+            </a>
+            <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
+                <span class="navbar-toggler-icon"></span>
+            </button>
+            <div class="collapse navbar-collapse" id="navbarNav">
+                <ul class="navbar-nav ms-auto">
+                    <li class="nav-item"><a class="nav-link" href="/">Home</a></li>
+                    <li class="nav-item"><a class="nav-link" href="/#problem">The Problem</a></li>
+                    <li class="nav-item"><a class="nav-link" href="/#solution">The Solution</a></li>
+                    <li class="nav-item"><a class="nav-link" href="/#features">Features</a></li>
+                    <li class="nav-item"><a class="nav-link" href="/#for-whom">For Whom</a></li>
+                    <li class="nav-item"><a class="nav-link" href="/#why-vision-copilot">Why Vision Copilot</a></li>
+                    <li class="nav-item"><a class="nav-link" href="/#contact">Contact</a></li>
+                </ul>
+            </div>
+        </div>
+    </nav>
+
+    <!-- Main Content -->
+    <main class="container section">
+        <h1>Cross-Framework Mapping</h1>
+        <p>This is the page for the Cross-Framework Mapping feature.</p>
+        <p><a href="/">Back to Home</a></p>
+    </main>
+
+    <!-- Footer -->
+    <footer class="bg-dark text-white text-center py-4">
+        <div class="container">
+            <p>&copy; <?php echo date('Y'); ?> Vision AI. All Rights Reserved.</p>
+            <p><a href="/privacy.php" class="text-white">Privacy Policy</a></p>
+        </div>
+    </footer>
+
+    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
+    <script src="../assets/js/main.js?v=<?php echo time(); ?>"></script>
+</body>
+</html>

features/integration.php

@@ -0,0 +1,54 @@
+<?php session_start(); ?>
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Integration - Vision AI</title>
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
+    <link rel="stylesheet" href="../assets/css/custom.css?v=<?php echo time(); ?>">
+</head>
+<body>
+
+    <!-- Navbar -->
+    <nav class="navbar navbar-expand-lg navbar-light bg-light sticky-top">
+        <div class="container">
+            <a class="navbar-brand" href="/">
+                <img src="../assets/pasted-20251022-215019-f7191fbf.png" alt="Vision AI Logo" class="logo">
+            </a>
+            <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
+                <span class="navbar-toggler-icon"></span>
+            </button>
+            <div class="collapse navbar-collapse" id="navbarNav">
+                <ul class="navbar-nav ms-auto">
+                    <li class="nav-item"><a class="nav-link" href="/">Home</a></li>
+                    <li class="nav-item"><a class="nav-link" href="/#problem">The Problem</a></li>
+                    <li class="nav-item"><a class="nav-link" href="/#solution">The Solution</a></li>
+                    <li class="nav-item"><a class="nav-link" href="/#features">Features</a></li>
+                    <li class="nav-item"><a class="nav-link" href="/#for-whom">For Whom</a></li>
+                    <li class="nav-item"><a class="nav-link" href="/#why-vision-copilot">Why Vision Copilot</a></li>
+                    <li class="nav-item"><a class="nav-link" href="/#contact">Contact</a></li>
+                </ul>
+            </div>
+        </div>
+    </nav>
+
+    <!-- Main Content -->
+    <main class="container section">
+        <h1>Integration</h1>
+        <p>This is the page for the Integration feature.</p>
+        <p><a href="/">Back to Home</a></p>
+    </main>
+
+    <!-- Footer -->
+    <footer class="bg-dark text-white text-center py-4">
+        <div class="container">
+            <p>&copy; <?php echo date('Y'); ?> Vision AI. All Rights Reserved.</p>
+            <p><a href="/privacy.php" class="text-white">Privacy Policy</a></p>
+        </div>
+    </footer>
+
+    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
+    <script src="../assets/js/main.js?v=<?php echo time(); ?>"></script>
+</body>
+</html>

features/login-and-workspace-overview.php

@@ -0,0 +1,54 @@
+<?php session_start(); ?>
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Log In & Workspace Overview - Vision AI</title>
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
+    <link rel="stylesheet" href="../assets/css/custom.css?v=<?php echo time(); ?>">
+</head>
+<body>
+
+    <!-- Navbar -->
+    <nav class="navbar navbar-expand-lg navbar-light bg-light sticky-top">
+        <div class="container">
+            <a class="navbar-brand" href="/">
+                <img src="../assets/pasted-20251022-215019-f7191fbf.png" alt="Vision AI Logo" class="logo">
+            </a>
+            <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
+                <span class="navbar-toggler-icon"></span>
+            </button>
+            <div class="collapse navbar-collapse" id="navbarNav">
+                <ul class="navbar-nav ms-auto">
+                    <li class="nav-item"><a class="nav-link" href="/">Home</a></li>
+                    <li class="nav-item"><a class="nav-link" href="/#problem">The Problem</a></li>
+                    <li class="nav-item"><a class="nav-link" href="/#solution">The Solution</a></li>
+                    <li class="nav-item"><a class="nav-link" href="/#features">Features</a></li>
+                    <li class="nav-item"><a class="nav-link" href="/#for-whom">For Whom</a></li>
+                    <li class="nav-item"><a class="nav-link" href="/#why-vision-copilot">Why Vision Copilot</a></li>
+                    <li class="nav-item"><a class="nav-link" href="/#contact">Contact</a></li>
+                </ul>
+            </div>
+        </div>
+    </nav>
+
+    <!-- Main Content -->
+    <main class="container section">
+        <h1>Log In & Workspace Overview</h1>
+        <p>This is the page for the Log In & Workspace Overview feature.</p>
+        <p><a href="/">Back to Home</a></p>
+    </main>
+
+    <!-- Footer -->
+    <footer class="bg-dark text-white text-center py-4">
+        <div class="container">
+            <p>&copy; <?php echo date('Y'); ?> Vision AI. All Rights Reserved.</p>
+            <p><a href="/privacy.php" class="text-white">Privacy Policy</a></p>
+        </div>
+    </footer>
+
+    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
+    <script src="../assets/js/main.js?v=<?php echo time(); ?>"></script>
+</body>
+</html>

features/review-and-assign-tasks.php

@@ -0,0 +1,54 @@
+<?php session_start(); ?>
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Review & Assign Tasks - Vision AI</title>
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
+    <link rel="stylesheet" href="../assets/css/custom.css?v=<?php echo time(); ?>">
+</head>
+<body>
+
+    <!-- Navbar -->
+    <nav class="navbar navbar-expand-lg navbar-light bg-light sticky-top">
+        <div class="container">
+            <a class="navbar-brand" href="/">
+                <img src="../assets/pasted-20251022-215019-f7191fbf.png" alt="Vision AI Logo" class="logo">
+            </a>
+            <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
+                <span class="navbar-toggler-icon"></span>
+            </button>
+            <div class="collapse navbar-collapse" id="navbarNav">
+                <ul class="navbar-nav ms-auto">
+                    <li class="nav-item"><a class="nav-link" href="/">Home</a></li>
+                    <li class="nav-item"><a class="nav-link" href="/#problem">The Problem</a></li>
+                    <li class="nav-item"><a class="nav-link" href="/#solution">The Solution</a></li>
+                    <li class="nav-item"><a class="nav-link" href="/#features">Features</a></li>
+                    <li class="nav-item"><a class="nav-link" href="/#for-whom">For Whom</a></li>
+                    <li class="nav-item"><a class="nav-link" href="/#why-vision-copilot">Why Vision Copilot</a></li>
+                    <li class="nav-item"><a class="nav-link" href="/#contact">Contact</a></li>
+                </ul>
+            </div>
+        </div>
+    </nav>
+
+    <!-- Main Content -->
+    <main class="container section">
+        <h1>Review & Assign Tasks</h1>
+        <p>This is the page for the Review & Assign Tasks feature.</p>
+        <p><a href="/">Back to Home</a></p>
+    </main>
+
+    <!-- Footer -->
+    <footer class="bg-dark text-white text-center py-4">
+        <div class="container">
+            <p>&copy; <?php echo date('Y'); ?> Vision AI. All Rights Reserved.</p>
+            <p><a href="/privacy.php" class="text-white">Privacy Policy</a></p>
+        </div>
+    </footer>
+
+    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
+    <script src="../assets/js/main.js?v=<?php echo time(); ?>"></script>
+</body>
+</html>

features/upload-evidence.php

@@ -0,0 +1,54 @@
+<?php session_start(); ?>
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Upload Evidence - Vision AI</title>
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
+    <link rel="stylesheet" href="../assets/css/custom.css?v=<?php echo time(); ?>">
+</head>
+<body>
+
+    <!-- Navbar -->
+    <nav class="navbar navbar-expand-lg navbar-light bg-light sticky-top">
+        <div class="container">
+            <a class="navbar-brand" href="/">
+                <img src="../assets/pasted-20251022-215019-f7191fbf.png" alt="Vision AI Logo" class="logo">
+            </a>
+            <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
+                <span class="navbar-toggler-icon"></span>
+            </button>
+            <div class="collapse navbar-collapse" id="navbarNav">
+                <ul class="navbar-nav ms-auto">
+                    <li class="nav-item"><a class="nav-link" href="/">Home</a></li>
+                    <li class="nav-item"><a class="nav-link" href="/#problem">The Problem</a></li>
+                    <li class="nav-item"><a class="nav-link" href="/#solution">The Solution</a></li>
+                    <li class="nav-item"><a class="nav-link" href="/#features">Features</a></li>
+                    <li class="nav-item"><a class="nav-link" href="/#for-whom">For Whom</a></li>
+                    <li class="nav-item"><a class="nav-link" href="/#why-vision-copilot">Why Vision Copilot</a></li>
+                    <li class="nav-item"><a class="nav-link" href="/#contact">Contact</a></li>
+                </ul>
+            </div>
+        </div>
+    </nav>
+
+    <!-- Main Content -->
+    <main class="container section">
+        <h1>Upload Evidence</h1>
+        <p>This is the page for the Upload Evidence feature.</p>
+        <p><a href="/">Back to Home</a></p>
+    </main>
+
+    <!-- Footer -->
+    <footer class="bg-dark text-white text-center py-4">
+        <div class="container">
+            <p>&copy; <?php echo date('Y'); ?> Vision AI. All Rights Reserved.</p>
+            <p><a href="/privacy.php" class="text-white">Privacy Policy</a></p>
+        </div>
+    </footer>
+
+    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
+    <script src="../assets/js/main.js?v=<?php echo time(); ?>"></script>
+</body>
+</html>

index.php

@@ -1,150 +1,309 @@
-<?php
-declare(strict_types=1);
-@ini_set('display_errors', '1');
-@error_reporting(E_ALL);
-@date_default_timezone_set('UTC');
-
-$phpVersion = PHP_VERSION;
-$now = date('Y-m-d H:i:s');
-?>
-<!doctype html>
+<?php session_start(); ?>
+<!DOCTYPE html>
 <html lang="en">
 <head>
-  <meta charset="utf-8" />
-  <meta name="viewport" content="width=device-width, initial-scale=1" />
-  <title>New Style</title>
-<?php
-// Read project preview data from environment
-$projectDescription = $_SERVER['PROJECT_DESCRIPTION'] ?? '';
-$projectImageUrl = $_SERVER['PROJECT_IMAGE_URL'] ?? '';
-?>
-<?php if ($projectDescription): ?>
-  <!-- Meta description -->
-  <meta name="description" content='<?= htmlspecialchars($projectDescription) ?>' />
-  <!-- Open Graph meta tags -->
-  <meta property="og:description" content="<?= htmlspecialchars($projectDescription) ?>" />
-  <!-- Twitter meta tags -->
-  <meta property="twitter:description" content="<?= htmlspecialchars($projectDescription) ?>" />
-<?php endif; ?>
-<?php if ($projectImageUrl): ?>
-  <!-- Open Graph image -->
-  <meta property="og:image" content="<?= htmlspecialchars($projectImageUrl) ?>" />
-  <!-- Twitter image -->
-  <meta property="twitter:image" content="<?= htmlspecialchars($projectImageUrl) ?>" />
-<?php endif; ?>
-  <link rel="preconnect" href="https://fonts.googleapis.com">
-  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
-  <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;700&display=swap" rel="stylesheet">
-  <style>
-    :root {
-      --bg-color-start: #6a11cb;
-      --bg-color-end: #2575fc;
-      --text-color: #ffffff;
-      --card-bg-color: rgba(255, 255, 255, 0.01);
-      --card-border-color: rgba(255, 255, 255, 0.1);
-    }
-    body {
-      margin: 0;
-      font-family: 'Inter', sans-serif;
-      background: linear-gradient(45deg, var(--bg-color-start), var(--bg-color-end));
-      color: var(--text-color);
-      display: flex;
-      justify-content: center;
-      align-items: center;
-      min-height: 100vh;
-      text-align: center;
-      overflow: hidden;
-      position: relative;
-    }
-    body::before {
-      content: '';
-      position: absolute;
-      top: 0;
-      left: 0;
-      width: 100%;
-      height: 100%;
-      background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="100" height="100" viewBox="0 0 100 100"><path d="M-10 10L110 10M10 -10L10 110" stroke-width="1" stroke="rgba(255,255,255,0.05)"/></svg>');
-      animation: bg-pan 20s linear infinite;
-      z-index: -1;
-    }
-    @keyframes bg-pan {
-      0% { background-position: 0% 0%; }
-      100% { background-position: 100% 100%; }
-    }
-    main {
-      padding: 2rem;
-    }
-    .card {
-      background: var(--card-bg-color);
-      border: 1px solid var(--card-border-color);
-      border-radius: 16px;
-      padding: 2rem;
-      backdrop-filter: blur(20px);
-      -webkit-backdrop-filter: blur(20px);
-      box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.1);
-    }
-    .loader {
-      margin: 1.25rem auto 1.25rem;
-      width: 48px;
-      height: 48px;
-      border: 3px solid rgba(255, 255, 255, 0.25);
-      border-top-color: #fff;
-      border-radius: 50%;
-      animation: spin 1s linear infinite;
-    }
-    @keyframes spin {
-      from { transform: rotate(0deg); }
-      to   { transform: rotate(360deg); }
-    }
-    .hint {
-      opacity: 0.9;
-    }
-    .sr-only {
-      position: absolute;
-      width: 1px; height: 1px;
-      padding: 0; margin: -1px;
-      overflow: hidden;
-      clip: rect(0, 0, 0, 0);
-      white-space: nowrap; border: 0;
-    }
-    h1 {
-      font-size: 3rem;
-      font-weight: 700;
-      margin: 0 0 1rem;
-      letter-spacing: -1px;
-    }
-    p {
-      margin: 0.5rem 0;
-      font-size: 1.1rem;
-    }
-    code {
-      background: rgba(0,0,0,0.2);
-      padding: 2px 6px;
-      border-radius: 4px;
-      font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
-    }
-    footer {
-      position: absolute;
-      bottom: 1rem;
-      font-size: 0.8rem;
-      opacity: 0.7;
-    }
-  </style>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Vision AI - Your Partner in Automated Compliance</title>
+    <meta name="description" content="Vision AI offers a cutting-edge SaaS platform to automate and streamline your compliance processes. Built with Flatlogic Generator.">
+    <meta name="keywords" content="compliance saas, ai compliance, regulatory technology, automated compliance, risk management, policy management, compliance reporting, flatlogic generator">
+    <meta property="og:title" content="Vision AI - Your Partner in Automated Compliance">
+    <meta property="og:description" content="Vision AI offers a cutting-edge SaaS platform to automate and streamline your compliance processes.">
+    <meta property="og:image" content="<?php echo htmlspecialchars($_SERVER['PROJECT_IMAGE_URL'] ?? ''); ?>">
+    <meta name="twitter:card" content="summary_large_image">
+    <meta name="twitter:image" content="<?php echo htmlspecialchars($_SERVER['PROJECT_IMAGE_URL'] ?? ''); ?>">
+
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
+    <link rel="preconnect" href="https://fonts.googleapis.com">
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+    <link href="https://fonts.googleapis.com/css2?family=Georgia&family=Inter:wght@400;700&display=swap" rel="stylesheet">
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css">
+    <link rel="stylesheet" href="assets/css/custom.css?v=<?php echo time(); ?>">
 </head>
 <body>
-  <main>
-    <div class="card">
-      <h1>Analyzing your requirements and generating your website…</h1>
-      <div class="loader" role="status" aria-live="polite" aria-label="Applying initial changes">
-        <span class="sr-only">Loading…</span>
-      </div>
-      <p class="hint"><?= ($_SERVER['HTTP_HOST'] ?? '') === 'appwizzy.com' ? 'AppWizzy' : 'Flatlogic' ?> AI is collecting your requirements and applying the first changes.</p>
-      <p class="hint">This page will update automatically as the plan is implemented.</p>
-      <p>Runtime: PHP <code><?= htmlspecialchars($phpVersion) ?></code> — UTC <code><?= htmlspecialchars($now) ?></code></p>
-    </div>
-  </main>
-  <footer>
-    Page updated: <?= htmlspecialchars($now) ?> (UTC)
-  </footer>
+
+    <!-- Navbar -->
+    <nav class="navbar navbar-expand-lg navbar-light bg-light sticky-top">
+        <div class="container">
+            <a class="navbar-brand" href="/">
+                <canvas id="3d-logo-canvas" style="width: 150px; height: 50px;"></canvas>
+            </a>
+            <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
+                <span class="navbar-toggler-icon"></span>
+            </button>
+            <div class="collapse navbar-collapse" id="navbarNav">
+                <ul class="navbar-nav ms-auto">
+                    <li class="nav-item"><a class="nav-link" href="/">Home</a></li>
+                    <li class="nav-item"><a class="nav-link" href="/#problem">The Problem</a></li>
+                    <li class="nav-item"><a class="nav-link" href="/#solution">The Solution</a></li>
+                    <li class="nav-item"><a class="nav-link" href="/#features">Features</a></li>
+                    <li class="nav-item"><a class="nav-link" href="/#for-whom">For Whom</a></li>
+                    <li class="nav-item"><a class="nav-link" href="/#why-vision-copilot">Why Vision Copilot</a></li>
+                    <li class="nav-item"><a class="nav-link" href="#contact">Contact</a></li>
+                </ul>
+            </div>
+        </div>
+    </nav>
+
+    <!-- Hero Section -->
+    <header class="hero text-center">
+        <div class="container">
+            <h1>See the Unseen. Simplify Compliance. Strengthen Trust.</h1>
+            <p class="lead my-4">Vision Copilot is the intelligent compliance platform for the new regulatory era — turning complex frameworks like NIS2, DORA, and ISO 27001 into one intuitive, automated workflow. Where others chase checklists, Vision helps you see what’s missing and prove what’s secure.</p>
+            <a href="#contact" class="btn btn-light btn-lg">→ Get Early Access</a>
+            <a href="#contact" class="btn btn-secondary btn-lg mx-2">Request a Demo</a>
+            <a href="#contact" class="btn btn-secondary btn-lg">Join the Pilot Program</a>
+        </div>
+    </header>
+
+    
+
+    <!-- The Problem Section -->
+    <section id="problem" class="section">
+        <div class="container text-center">
+            <p class="lead">Regulation is expanding faster than teams can adapt. Security leaders face endless audits, fragmented data, and manual reporting — while threats grow more dynamic. Compliance today isn’t just about meeting obligations; it’s about maintaining visibility and resilience under constant pressure.</p>
+        </div>
+    </section>
+
+    <!-- Solution Section -->
+    <section id="solution" class="section">
+        <div class="container">
+            <h2 class="text-center mb-5">Our Solution</h2>
+            <div class="row justify-content-center">
+                <div class="col-lg-8 text-center">
+                    <h3 class="mb-4">Get more from your data, quickly and easily</h3>
+                    <p class="lead">Boost efficiency and productivity. Drive maximum value from your business process and their output by building robots and leveraging AI to automate workflows and repetitive manual tasks. Empower your team to focus their energy on impactful strategic initiatives.</p>
+                </div>
+            </div>
+            <div class="row justify-content-center mt-5">
+                <div class="col-lg-8 text-center">
+                    <h3 class="mb-4">Reduce error-related risk</h3>
+                    <p class="lead">Minimize the likelihood of mistakes with sophisticated transparency and access tools. Enable accurate, secure work with read-only data access and repeatable processes.</p>
+                </div>
+            </div>
+            <div class="row justify-content-center mt-5">
+                <div class="col-lg-8 text-center">
+                    <h3 class="mb-4">Achieve 100% certainty</h3>
+                    <p class="lead">Provide the board and audit committee with 100% assurance. Integrate continuous controls monitoring and entire population testing for unparalleled results.</p>
+                </div>
+            </div>
+            <div class="row justify-content-center mt-5">
+                <div class="col-lg-8 text-center">
+                    <h3 class="mb-4">Eliminate siloed workflows</h3>
+                    <p class="lead">Contribute to stronger overall governance by uniting IT, risk, compliance, finance and audit under a single umbrella of clarity and shared responsibility.</p>
+                </div>
+            </div>
+            <div class="row justify-content-center mt-5">
+                <div class="col-lg-12 text-center">
+                    <h3 class="mb-5">How it works</h3>
+                    <div class="timeline">
+                        <div class="timeline-item left">
+                            <div class="timeline-content">
+                                <a href="features/upload-evidence.php" style="text-decoration: none; color: inherit;"><h5>Upload Evidence</h5></a>
+                                <p class="text-start">Click Upload Evidence → Choose File. Vision Copilot automatically uploads, analyzes, and tags the evidence, making it machine-readable.</p>
+                                <p class="text-start">🔍 <strong>Purpose:</strong> Replace tedious evidence collection with instant, machine-readable proof.</p>
+                            </div>
+                        </div>
+                        <div class="timeline-item right">
+                            <div class="timeline-content">
+                                <a href="features/login-and-workspace-overview.php" style="text-decoration: none; color: inherit;"><h5>Log In & Workspace Overview</h5></a>
+                                <p class="text-start">The user signs in securely via Single Sign-On (SSO) (Azure AD / Okta). Lands on the Organization Dashboard with a clear compliance score, open gaps, and quick actions.</p>
+                                <p class="text-start">🎯 <strong>Purpose:</strong> Give instant clarity — what’s secure, what’s risky, what needs action.</p>
+                            </div>
+                        </div>
+                        <div class="timeline-item left">
+                            <div class="timeline-content">
+                                <a href="features/integration.php" style="text-decoration: none; color: inherit;"><h5>Integration</h5></a>
+                                <p class="text-start">Integration of all your related tools such as Asset management, risk management Jira , Vulnerability management tool.</p>
+                            </div>
+                        </div>
+                        <div class="timeline-item right">
+                            <div class="timeline-content">
+                                <a href="features/automatic-gap-detection.php" style="text-decoration: none; color: inherit;"><h5>Automatic Gap Detection</h5></a>
+                                <p class="text-start">The Gap Engine compares evidence to baseline rules, automatically generates findings, and maps them to relevant frameworks (NIS2, DORA, ISO 27001).</p>
+                                <p class="text-start">⚡ <strong>Purpose:</strong> Let the system find what’s missing before the auditor does.</p>
+                            </div>
+                        </div>
+                        <div class="timeline-item left">
+                            <div class="timeline-content">
+                                <a href="features/cross-framework-mapping.php" style="text-decoration: none; color: inherit;"><h5>Cross-Framework Mapping</h5></a>
+                                <p class="text-start">Open the Control Explorer to see how controls overlap across multiple frameworks. Evidence uploaded once gives you compliance credit everywhere.</p>
+                                <p class="text-start">♻️ <strong>Purpose:</strong> One control = multiple compliances. Stop duplicating effort.</p>
+                            </div>
+                        </div>
+                        <div class="timeline-item right">
+                            <div class="timeline-content">
+                                <a href="features/review-and-assign-tasks.php" style="text-decoration: none; color: inherit;"><h5>Review & Assign Tasks</h5></a>
+                                <p class="text-start">Navigate to the Tasks View to see all gaps with linked evidence, regulation references, and suggested remediation. Assign owners and set due dates to turn findings into trackable workflows.</p>
+                                <p class="text-start">🧩 <strong>Purpose:</strong> Turn findings into workflows — trackable, accountable, visible.</p>
+                            </div>
+                        </div>
+                        <div class="timeline-item left">
+                            <div class="timeline-content">
+                                <a href="features/ai-copilot-qa.php" style="text-decoration: none; color: inherit;"><h5>AI Copilot Q&A</h5></a>
+                                <p class="text-start">Open Ask Copilot to get instant answers to your compliance questions, with responses trained on real regulation text.</p>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <!-- Feature Grid Section -->
+    <section id="features" class="section bg-white">
+        <div class="container">
+            <h2 class="text-center mb-5">Features</h2>
+            <div class="row">
+                <div class="col-md-6 col-lg-4 mb-4">
+                    <div class="card h-100">
+                        <div class="card-body">
+                            <a href="automated-evidence-intelligence.php" target="_blank" style="text-decoration: none; color: inherit;">
+                                <h5 class="card-title">Automated Evidence Intelligence</h5>
+                            </a>
+                            <p class="card-text">OCR/NLP analyses screenshots, configs, and policies to extract key compliance data.</p>
+                            <p class="card-text"><small class="text-muted">No more manual verification — your evidence speaks for itself.</small></p>
+                        </div>
+                    </div>
+                </div>
+                <div class="col-md-6 col-lg-4 mb-4">
+                    <div class="card h-100">
+                        <div class="card-body">
+                            <h5 class="card-title">Dynamic Gap Engine</h5>
+                            <p class="card-text">Detects missing or weak controls, assesses severity, assigns owners.</p>
+                            <p class="card-text"><small class="text-muted">Instant visibility into what’s secure, what’s risky, and who’s accountable.</small></p>
+                        </div>
+                    </div>
+                </div>
+                <div class="col-md-6 col-lg-4 mb-4">
+                    <div class="card h-100">
+                        <div class="card-body">
+                            <h5 class="card-title">Multi-Framework Mapping</h5>
+                            <p class="card-text">Aligns controls across NIS2, DORA, ISO 27001, and custom frameworks.</p>
+                            <p class="card-text"><small class="text-muted">One action, multiple compliances — efficiency at scale.</small></p>
+                        </div>
+                    </div>
+                </div>
+                <div class="col-md-6 col-lg-4 mb-4">
+                    <div class="card h-100">
+                        <div class="card-body">
+                            <h5 class="card-title">AI Copilot Assistant</h5>
+                            <p class="card-text">Conversational Q&A trained on real regulation text with citations.</p>
+                            <p class="card-text"><small class="text-muted">Always-on compliance expert in your pocket.</small></p>
+                        </div>
+                    </div>
+                </div>
+                <div class="col-md-6 col-lg-4 mb-4">
+                    <div class="card h-100">
+                        <div class="card-body">
+                            <h5 class="card-title">Unified Dashboards & Reports</h5>
+                            <p class="card-text">Real-time compliance scoring, risk posture, and exportable reports.</p>
+                            <p class="card-text"><small class="text-muted">Turn audits into automated storytelling.</small></p>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    
+
+    
+
+    <!-- For Whom Section -->
+    <section id="for-whom" class="section">
+        <div class="container">
+            <h2 class="text-center mb-5">Built for Modern Security Teams</h2>
+            <div class="row">
+                <div class="col-md-6 col-lg-3 mb-4">
+                    <h5>CISOs & Compliance Leads</h5>
+                    <p>Instant, evidence-driven audit readiness.</p>
+                </div>
+                <div class="col-md-6 col-lg-3 mb-4">
+                    <h5>IT & SOC Managers</h5>
+                    <p>Clear task ownership and control validation.</p>
+                </div>
+                <div class="col-md-6 col-lg-3 mb-4">
+                    <h5>Auditors & Consultants</h5>
+                    <p>Centralized documentation and report automation.</p>
+                </div>
+                <div class="col-md-6 col-lg-3 mb-4">
+                    <h5>Regulated Enterprises</h5>
+                    <p>Banking, Retail, Energy, and more — built to meet EU standards.</p>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <!-- Why Vision Copilot Section -->
+    <section id="why-vision-copilot" class="section bg-white">
+        <div class="container text-center">
+            <h2>From Oversight to Foresight</h2>
+            <p class="lead">Most compliance tools look backward — Vision looks forward. It integrates risk, asset, and control data to predict gaps before they become findings. Securely hosted in the EU, Vision Copilot gives you confidence, clarity, and control in one intelligent workspace.</p>
+        </div>
+    </section>
+
+    <!-- CTA / Conversion Area Section -->
+    <section id="cta" class="section text-center">
+        <div class="container">
+            <h2>Ready to See the Unseeable?</h2>
+            <p class="lead">Join our pilot program and experience compliance without the complexity.</p>
+            <a href="#contact" class="btn btn-light btn-lg">→ Book a Demo</a>
+            <a href="#contact" class="btn btn-secondary btn-lg mx-2">Get Early Access</a>
+            <p class="mt-3">Small steps toward big clarity.</p>
+        </div>
+    </section>
+
+    <section id="tagline" class="section text-center">
+        <div class="container">
+            <p class="lead">Vision Copilot — Everything starts with people. Empowered by insight. Secured by intelligence.</p>
+        </div>
+    </section>
+
+    <!-- Contact Section -->
+    <section id="contact" class="section bg-white">
+        <div class="container">
+            <div class="row justify-content-center">
+                <div class="col-lg-8">
+                    <h2 class="text-center mb-5">Get in Touch</h2>
+                    <div class="contact-form">
+                        <?php if (isset($_SESSION['success'])): ?>
+                            <div class="alert alert-success"><?php echo $_SESSION['success']; unset($_SESSION['success']); ?></div>
+                        <?php endif; ?>
+                        <?php if (isset($_SESSION['error'])): ?>
+                            <div class="alert alert-danger"><?php echo $_SESSION['error']; unset($_SESSION['error']); ?></div>
+                        <?php endif; ?>
+                        <form action="contact.php" method="POST">
+                            <div class="mb-3">
+                                <label for="name" class="form-label">Name</label>
+                                <input type="text" class="form-control" id="name" name="name" required>
+                            </div>
+                            <div class="mb-3">
+                                <label for="email" class="form-label">Email address</label>
+                                <input type="email" class="form-control" id="email" name="email" required>
+                            </div>
+                            <div class="mb-3">
+                                <label for="message" class="form-label">Message</label>
+                                <textarea class="form-control" id="message" name="message" rows="5" required></textarea>
+                            </div>
+                            <button type="submit" class="btn btn-primary w-100">Send Message</button>
+                        </form>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <!-- Footer -->
+    <footer class="bg-dark text-white text-center py-4">
+        <div class="container">
+            <p>&copy; <?php echo date('Y'); ?> Vision AI. All Rights Reserved.</p>
+            <p><a href="/privacy.php" class="text-white">Privacy Policy</a></p>
+        </div>
+    </footer>
+
+    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/132/three.min.js"></script>
+    <script src="assets/js/main.js?v=<?php echo time(); ?>"></script>
 </body>
-</html>
+</html>

privacy.php

@@ -0,0 +1,18 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Privacy Policy - Compliance AI</title>
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
+    <script src="assets/js/main.js?v=<?php echo time(); ?>"></script>
+</head>
+<body>
+    <div class="container py-5">
+        <h1>Privacy Policy</h1>
+        <p>This is a placeholder for your privacy policy.</p>
+        <p>Information on how you collect, use, and disclose user data will go here.</p>
+        <a href="/">Back to Home</a>
+    </div>
+</body>
+</html>

solution.php

@@ -0,0 +1,153 @@
+<?php session_start(); ?>
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Our Solution - Vision AI</title>
+    <meta name="description" content="Learn about the Vision AI RegTech solution for the financial services industry.">
+    <meta name="keywords" content="regtech, regulatory technology, financial services, compliance, risk management">
+    <meta property="og:title" content="Our Solution - Vision AI">
+    <meta property="og:description" content="Learn about the Vision AI RegTech solution for the financial services industry.">
+    <meta property="og:image" content="<?php echo htmlspecialchars($_SERVER['PROJECT_IMAGE_URL'] ?? ''); ?>">
+    <meta name="twitter:card" content="summary_large_image">
+    <meta name="twitter:image" content="<?php echo htmlspecialchars($_SERVER['PROJECT_IMAGE_URL'] ?? ''); ?>">
+
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
+    <link rel="preconnect" href="https://fonts.googleapis.com">
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+    <link href="https://fonts.googleapis.com/css2?family=Georgia&family=Inter:wght@400;700&display=swap" rel="stylesheet">
+    <link rel="stylesheet" href="assets/css/custom.css?v=<?php echo time(); ?>">
+</head>
+<body>
+
+    <!-- Navbar -->
+    <nav class="navbar navbar-expand-lg navbar-light bg-light sticky-top">
+        <div class="container">
+            <a class="navbar-brand" href="/">
+                <img src="assets/pasted-20251022-215019-f7191fbf.png" alt="Vision AI Logo" class="logo">
+            </a>
+            <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
+                <span class="navbar-toggler-icon"></span>
+            </button>
+            <div class="collapse navbar-collapse" id="navbarNav">
+                <ul class="navbar-nav ms-auto">
+                    <li class="nav-item"><a class="nav-link" href="/">Home</a></li>
+                    <li class="nav-item"><a class="nav-link" href="/#problem">The Problem</a></li>
+                    <li class="nav-item"><a class="nav-link" href="/#solution">The Solution</a></li>
+                    <li class="nav-item"><a class="nav-link" href="/#features">Features</a></li>
+                    <li class="nav-item"><a class="nav-link" href="/#for-whom">For Whom</a></li>
+                    <li class="nav-item"><a class="nav-link" href="/#why-vision-copilot">Why Vision Copilot</a></li>
+                    <li class="nav-item"><a class="nav-link" href="/#contact">Contact</a></li>
+                </ul>
+            </div>
+        </div>
+    </nav>
+
+    <!-- Solution Section -->
+    <section id="solution" class="section">
+        <div class="container">
+            <h2 class="text-center mb-5">Our Solution</h2>
+            <div class="row justify-content-center">
+                <div class="col-lg-8 text-center">
+                    <h3 class="mb-4">Get more from your data, quickly and easily</h3>
+                    <p class="lead">Boost efficiency and productivity. Drive maximum value from your business process and their output by building robots and leveraging AI to automate workflows and repetitive manual tasks. Empower your team to focus their energy on impactful strategic initiatives.</p>
+                </div>
+            </div>
+            <div class="row justify-content-center mt-5">
+                <div class="col-lg-8 text-center">
+                    <h3 class="mb-4">Reduce error-related risk</h3>
+                    <p class="lead">Minimize the likelihood of mistakes with sophisticated transparency and access tools. Enable accurate, secure work with read-only data access and repeatable processes.</p>
+                </div>
+            </div>
+            <div class="row justify-content-center mt-5">
+                <div class="col-lg-8 text-center">
+                    <h3 class="mb-4">Achieve 100% certainty</h3>
+                    <p class="lead">Provide the board and audit committee with 100% assurance. Integrate continuous controls monitoring and entire population testing for unparalleled results.</p>
+                </div>
+            </div>
+            <div class="row justify-content-center mt-5">
+                <div class="col-lg-8 text-center">
+                    <h3 class="mb-4">Eliminate siloed workflows</h3>
+                    <p class="lead">Contribute to stronger overall governance by uniting IT, risk, compliance, finance and audit under a single umbrella of clarity and shared responsibility.</p>
+                </div>
+            </div>
+            <div class="row justify-content-center mt-5">
+                <div class="col-lg-8 text-center">
+                    <h3 class="mb-4">How it works</h3>
+                    <ol class="lead text-start">
+                        <li>Integration of all your related tools such as Asset management, risk management Jira , Vulnerability management tool</li>
+                        <li><strong>Log In & Workspace Overview:</strong> The user signs in securely via Single Sign-On (SSO) (Azure AD / Okta). Lands on the Organization Dashboard:
+                            <ul>
+                                <li>Compliance Score: 72%</li>
+                                <li>Open Gaps: 18</li>
+                                <li>Frameworks: NIS2 • DORA • ISO 27001</li>
+                                <li>Quick actions: “Upload Evidence”, “Add Control”, “View Reports”</li>
+                            </ul>
+                            <p>🎯 <strong>Purpose:</strong> Give instant clarity — what’s secure, what’s risky, what needs action.</p>
+                        </li>
+                        <li><strong>Upload Evidence:</strong> Click Upload Evidence → Choose File (screenshot, PDF, policy, config file). Vision Copilot automatically:
+                            <ul>
+                                <li>Uploads the file to secure storage (S3/Blob).</li>
+                                <li>Runs OCR/NLP to extract key data (e.g., retention=12d, MFA=off).</li>
+                                <li>Tags evidence by domain (e.g., Logging, IAM, Vendor Risk).</li>
+                                <li>Stores metadata: uploader, timestamp, hash (for audit integrity).</li>
+                            </ul>
+                            <p>🔍 <strong>Purpose:</strong> Replace tedious evidence collection with instant, machine-readable proof.</p>
+                        </li>
+                        <li><strong>Automatic Gap Detection:</strong> The Gap Engine compares extracted evidence data to baseline rules:
+                            <ul>
+                                <li>Rule: “SIEM retention ≥ 180 days”</li>
+                                <li>Finding: “Retention = 12 days” → Generates Gap #LOG-017, severity High, owner Infra.</li>
+                            </ul>
+                            The system maps the finding to:
+                            <ul>
+                                <li>NIS2 Article 21</li>
+                                <li>DORA Annex II (ICT Logging)</li>
+                                <li>ISO 27001 A.12.4 (Logging & Monitoring)</li>
+                            </ul>
+                            <p>A task is created automatically with due date & owner.</p>
+                            <p>⚡ <strong>Purpose:</strong> Let the system find what’s missing before the auditor does.</p>
+                        </li>
+                        <li><strong>Review & Assign Tasks:</strong> Navigate to Tasks View → filters by domain, owner, severity. Each gap includes:
+                            <ul>
+                                <li>Linked evidence</li>
+                                <li>Regulation references</li>
+                                <li>Suggested remediation (“Increase retention policy to 180d”)</li>
+                            </ul>
+                            Managers can:
+                            <ul>
+                                <li>Assign owner</li>
+                                <li>Set due date</li>
+                                <li>Add comments or attach new evidence</li>
+                            </ul>
+                            <p>🧩 <strong>Purpose:</strong> Turn findings into workflows — trackable, accountable, visible.</p>
+                        </li>
+                        <li><strong>Cross-Framework Mapping:</strong> Open Control Explorer → pick any control (e.g., “Access Reviews”). See how it overlaps:
+                            <ul>
+                                <li>ISO 27001 A.9.2.5</li>
+                                <li>NIS2 Annex I, Sec. 2</li>
+                                <li>DORA Article 11</li>
+                            </ul>
+                            <p>Evidence uploaded once → compliance credit across all frameworks.</p>
+                            <p>♻️ <strong>Purpose:</strong> One control = multiple compliances. Stop duplicating effort.</p>
+                        </li>
+                        <li><strong>AI Copilot Q&A:</strong> Open Ask Copilot</li>
+                    </ol>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <!-- Footer -->
+    <footer class="bg-dark text-white text-center py-4">
+        <div class="container">
+            <p>&copy; <?php echo date('Y'); ?> Vision AI. All Rights Reserved.</p>
+            <p><a href="/privacy.php" class="text-white">Privacy Policy</a></p>
+        </div>
+    </footer>
+
+    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
+    <script src="assets/js/main.js?v=<?php echo time(); ?>"></script>
+</body>
+</html>