This commit is contained in:
Flatlogic Bot 2025-10-22 22:02:50 +00:00
parent 11a44f8841
commit bbfb8cc347
5 changed files with 217 additions and 70 deletions

View File

@ -11,16 +11,14 @@ h1, h2, h3, h4, h5, h6 {
} }
h2 { h2 {
color: #D6BCFA; color: #8B5CF6;
} }
.section.bg-light-lilac {
background-color: #F5F1FD;
}
/* Hero Section */ /* Hero Section */
.hero { .hero {
background: linear-gradient(45deg, #D6BCFA, #FDBA74); background: linear-gradient(45deg, #8B5CF6, #6366F1, #EF4444);
color: white; color: white;
padding: 100px 0; padding: 100px 0;
} }
@ -41,34 +39,34 @@ h2 {
/* Card Styles */ /* Card Styles */
.card { .card {
border: none; border: 1px solid #E5E7EB;
border-radius: 0.5rem; 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); box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
} }
/* Button Styles */ /* Button Styles */
.btn-primary { .btn-primary {
background-color: #D6BCFA; background-color: #8B5CF6;
border-color: #D6BCFA; border-color: #8B5CF6;
padding: 12px 24px; padding: 12px 24px;
border-radius: 0.5rem; border-radius: 0.5rem;
} }
.btn-primary:hover { .btn-primary:hover {
background-color: #C0A0F8; background-color: #7C3AED;
border-color: #C0A0F8; border-color: #7C3AED;
} }
.btn-secondary { .btn-secondary {
background-color: #FDBA74; background-color: #EF4444;
border-color: #FDBA74; border-color: #EF4444;
padding: 12px 24px; padding: 12px 24px;
border-radius: 0.5rem; border-radius: 0.5rem;
} }
.btn-secondary:hover { .btn-secondary:hover {
background-color: #F9A84F; background-color: #DC2626;
border-color: #F9A84F; border-color: #DC2626;
} }
/* Contact Form */ /* Contact Form */
@ -78,3 +76,79 @@ h2 {
border-radius: 0.5rem; 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); 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;
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 46 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.4 MiB

157
index.php
View File

@ -17,6 +17,7 @@
<link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <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 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(); ?>"> <link rel="stylesheet" href="assets/css/custom.css?v=<?php echo time(); ?>">
</head> </head>
<body> <body>
@ -24,29 +25,21 @@
<!-- Navbar --> <!-- Navbar -->
<nav class="navbar navbar-expand-lg navbar-light bg-light sticky-top"> <nav class="navbar navbar-expand-lg navbar-light bg-light sticky-top">
<div class="container"> <div class="container">
<a class="navbar-brand" href="/">Vision AI</a> <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"> <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> <span class="navbar-toggler-icon"></span>
</button> </button>
<div class="collapse navbar-collapse" id="navbarNav"> <div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav ms-auto"> <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="/">Home</a></li>
<li class="nav-item"><a class="nav-link" href="/#about">About</a></li> <li class="nav-item"><a class="nav-link" href="/#problem">The Problem</a></li>
<li class="nav-item dropdown"> <li class="nav-item"><a class="nav-link" href="/#solution">The Solution</a></li>
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownWhoWeServe" role="button" data-bs-toggle="dropdown" aria-expanded="false"> <li class="nav-item"><a class="nav-link" href="/#features">Features</a></li>
Who We Serve <li class="nav-item"><a class="nav-link" href="/#for-whom">For Whom</a></li>
</a> <li class="nav-item"><a class="nav-link" href="/#why-vision-copilot">Why Vision Copilot</a></li>
<ul class="dropdown-menu" aria-labelledby="navbarDropdownWhoWeServe"> <li class="nav-item"><a class="nav-link" href="#contact">Contact</a></li>
<li><a class="dropdown-item" href="#">Banks</a></li>
<li><a class="dropdown-item" href="#">Financial services</a></li>
<li><a class="dropdown-item" href="#">Fintech</a></li>
<li><a class="dropdown-item" href="#">Insurance</a></li>
<li><a class="dropdown-item" href="#">Energy</a></li>
<li><a class="dropdown-item" href="#">Retail</a></li>
</ul>
</li>
<li class="nav-item"><a class="nav-link" href="/solution.php">Solution</a></li>
<li class="nav-item"><a class="nav-link" href="/#contact">Contact</a></li>
</ul> </ul>
</div> </div>
</div> </div>
@ -55,40 +48,76 @@
<!-- Hero Section --> <!-- Hero Section -->
<header class="hero text-center"> <header class="hero text-center">
<div class="container"> <div class="container">
<h1>Automate Your Compliance. Unleash Your Growth.</h1> <h1>See the Unseen. Simplify Compliance. Strengthen Trust.</h1>
<p class="lead my-4">The intelligent platform that simplifies compliance, so you can focus on what matters.</p> <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 whats missing and prove whats secure.</p>
<a href="#contact" class="btn btn-light btn-lg">Request a Demo</a> <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> </div>
</header> </header>
<!-- About Section --> <!-- The Problem Section -->
<section id="about" class="section bg-light-lilac"> <section id="problem" class="section">
<div class="container text-center"> <div class="container text-center">
<h2>About Vision AI</h2> <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 isnt just about meeting obligations; its about maintaining visibility and resilience under constant pressure.</p>
<p class="lead">Vision AI provides a regulatory compliance and risk management solution that applies purpose-built machine learning models to automatically monitor the regulatory environment for relevant changes and maps them to your internal policies, procedures and controls. It ensures you track, react and report on impactful regulations and requirements on a timely basis.</p>
</div> </div>
</section> </section>
<!-- Who We Serve Section --> <!-- The Vision Solution Section -->
<section id="who-we-serve" class="section bg-white"> <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. Its not another dashboard its an intelligent layer that thinks with you.</p>
</div>
</section>
<!-- Feature Grid Section -->
<section id="features" class="section bg-white">
<div class="container"> <div class="container">
<h2 class="text-center mb-5">Who We Serve</h2> <h2 class="text-center mb-5">Features</h2>
<div class="row g-4"> <div class="row">
<div class="col-md-6"> <div class="col-md-6 col-lg-4 mb-4">
<div class="card"> <div class="card h-100">
<img src="https://picsum.photos/seed/p1/800/600" class="card-img-top" alt="Dashboard showing compliance metrics.">
<div class="card-body"> <div class="card-body">
<h5 class="card-title">Intuitive Dashboards</h5> <h5 class="card-title">Automated Evidence Intelligence</h5>
<p class="card-text">Visualize your compliance posture at a glance with our clean and informative dashboards.</p> <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>
</div> </div>
<div class="col-md-6"> <div class="col-md-6 col-lg-4 mb-4">
<div class="card"> <div class="card h-100">
<img src="https://picsum.photos/seed/p2/800/600" class="card-img-top" alt="Automated reporting feature.">
<div class="card-body"> <div class="card-body">
<h5 class="card-title">Automated Reporting</h5> <h5 class="card-title">Dynamic Gap Engine</h5>
<p class="card-text">Generate comprehensive compliance reports automatically, saving you time and effort.</p> <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 whats secure, whats risky, and whos 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> </div>
@ -98,6 +127,58 @@
<!-- 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 --> <!-- Contact Section -->
<section id="contact" class="section bg-white"> <section id="contact" class="section bg-white">
<div class="container"> <div class="container">

View File

@ -24,28 +24,20 @@
<!-- Navbar --> <!-- Navbar -->
<nav class="navbar navbar-expand-lg navbar-light bg-light sticky-top"> <nav class="navbar navbar-expand-lg navbar-light bg-light sticky-top">
<div class="container"> <div class="container">
<a class="navbar-brand" href="/">Vision AI</a> <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"> <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> <span class="navbar-toggler-icon"></span>
</button> </button>
<div class="collapse navbar-collapse" id="navbarNav"> <div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav ms-auto"> <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="/">Home</a></li>
<li class="nav-item"><a class="nav-link" href="/#about">About</a></li> <li class="nav-item"><a class="nav-link" href="/#problem">The Problem</a></li>
<li class="nav-item dropdown"> <li class="nav-item"><a class="nav-link" href="/#solution">The Solution</a></li>
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdownWhoWeServe" role="button" data-bs-toggle="dropdown" aria-expanded="false"> <li class="nav-item"><a class="nav-link" href="/#features">Features</a></li>
Who We Serve <li class="nav-item"><a class="nav-link" href="/#for-whom">For Whom</a></li>
</a> <li class="nav-item"><a class="nav-link" href="/#why-vision-copilot">Why Vision Copilot</a></li>
<ul class="dropdown-menu" aria-labelledby="navbarDropdownWhoWeServe">
<li><a class="dropdown-item" href="/#who-we-serve">Banks</a></li>
<li><a class="dropdown-item" href="/#who-we-serve">Financial services</a></li>
<li><a class="dropdown-item" href="/#who-we-serve">Fintech</a></li>
<li><a class="dropdown-item" href="/#who-we-serve">Insurance</a></li>
<li><a class="dropdown-item" href="/#who-we-serve">Energy</a></li>
<li><a class="dropdown-item" href="/#who-we-serve">Retail</a></li>
</ul>
</li>
<li class="nav-item"><a class="nav-link" href="/solution.php">Solution</a></li>
<li class="nav-item"><a class="nav-link" href="/#contact">Contact</a></li> <li class="nav-item"><a class="nav-link" href="/#contact">Contact</a></li>
</ul> </ul>
</div> </div>
@ -53,7 +45,7 @@
</nav> </nav>
<!-- Solution Section --> <!-- Solution Section -->
<section id="solution" class="section bg-light-lilac"> <section id="solution" class="section">
<div class="container"> <div class="container">
<h2 class="text-center mb-5">Our Solution</h2> <h2 class="text-center mb-5">Our Solution</h2>
<div class="row justify-content-center"> <div class="row justify-content-center">