<?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>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>

    <!-- 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>

    <!-- 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>

    <!-- The Vision Solution Section -->
    <section id="solution" class="section">
        <div class="container text-center">
            <h2>Your AI-powered Copilot for Compliance and Resilience</h2>
            <p class="lead">Vision Copilot automates evidence collection, gap detection, and framework mapping across NIS2, DORA, and ISO 27001 — giving you a single, living view of compliance health across your organization. It’s not another dashboard — it’s an intelligent layer that thinks with you.</p>
        </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">
                            <h5 class="card-title">Automated Evidence Intelligence</h5>
                            <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="assets/js/main.js?v=<?php echo time(); ?>"></script>
</body>
</html>