Bernt
6de2455917
- Added GLOBAL_MARKETS_TITLE to all translation files - Updated footer with 12 markets (4 active + 8 upcoming) - Translated market section to: zh-cn, zh-tw, ja, ko, th, vi, id, ms, hi - Built and deployed to production - CloudFront invalidation: I3RTMXVFDJXWLG3SYX208OP1CC
552 lines
16 KiB
HTML
552 lines
16 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="sv">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>VIMS - Visual Infrastructure Monitoring System | Landvex</title>
|
|
<meta name="description" content="AI-driven visual monitoring for critical infrastructure. Detect anomalies, prevent fraud, ensure safety.">
|
|
<style>
|
|
* {
|
|
margin: 0;
|
|
padding: 0;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
body {
|
|
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
|
|
line-height: 1.6;
|
|
color: #1a1a1a;
|
|
background: #fff;
|
|
}
|
|
|
|
.container {
|
|
max-width: 1200px;
|
|
margin: 0 auto;
|
|
padding: 0 24px;
|
|
}
|
|
|
|
/* Header */
|
|
header {
|
|
background: #000;
|
|
color: #fff;
|
|
padding: 16px 0;
|
|
position: fixed;
|
|
width: 100%;
|
|
top: 0;
|
|
z-index: 100;
|
|
}
|
|
|
|
header .container {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
}
|
|
|
|
.logo {
|
|
font-size: 24px;
|
|
font-weight: 700;
|
|
letter-spacing: -0.5px;
|
|
}
|
|
|
|
.logo span {
|
|
color: #00d4aa;
|
|
}
|
|
|
|
nav a {
|
|
color: #fff;
|
|
text-decoration: none;
|
|
margin-left: 32px;
|
|
font-size: 14px;
|
|
opacity: 0.8;
|
|
transition: opacity 0.2s;
|
|
}
|
|
|
|
nav a:hover {
|
|
opacity: 1;
|
|
}
|
|
|
|
/* Hero */
|
|
.hero {
|
|
background: linear-gradient(135deg, #000 0%, #1a1a2e 100%);
|
|
color: #fff;
|
|
padding: 160px 0 100px;
|
|
margin-top: 56px;
|
|
}
|
|
|
|
.hero h1 {
|
|
font-size: 56px;
|
|
font-weight: 800;
|
|
line-height: 1.1;
|
|
margin-bottom: 24px;
|
|
letter-spacing: -1px;
|
|
}
|
|
|
|
.hero h1 span {
|
|
color: #00d4aa;
|
|
}
|
|
|
|
.hero p {
|
|
font-size: 20px;
|
|
opacity: 0.8;
|
|
max-width: 600px;
|
|
margin-bottom: 40px;
|
|
}
|
|
|
|
.cta-button {
|
|
display: inline-block;
|
|
background: #00d4aa;
|
|
color: #000;
|
|
padding: 16px 32px;
|
|
border-radius: 8px;
|
|
text-decoration: none;
|
|
font-weight: 600;
|
|
font-size: 16px;
|
|
transition: transform 0.2s, box-shadow 0.2s;
|
|
}
|
|
|
|
.cta-button:hover {
|
|
transform: translateY(-2px);
|
|
box-shadow: 0 8px 24px rgba(0, 212, 170, 0.3);
|
|
}
|
|
|
|
/* Features */
|
|
.features {
|
|
padding: 100px 0;
|
|
background: #f8f9fa;
|
|
}
|
|
|
|
.features h2 {
|
|
font-size: 40px;
|
|
font-weight: 700;
|
|
text-align: center;
|
|
margin-bottom: 64px;
|
|
}
|
|
|
|
.feature-grid {
|
|
display: grid;
|
|
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
|
|
gap: 32px;
|
|
}
|
|
|
|
.feature-card {
|
|
background: #fff;
|
|
padding: 40px;
|
|
border-radius: 16px;
|
|
box-shadow: 0 2px 8px rgba(0,0,0,0.04);
|
|
transition: transform 0.2s, box-shadow 0.2s;
|
|
}
|
|
|
|
.feature-card:hover {
|
|
transform: translateY(-4px);
|
|
box-shadow: 0 12px 32px rgba(0,0,0,0.08);
|
|
}
|
|
|
|
.feature-icon {
|
|
width: 48px;
|
|
height: 48px;
|
|
background: #00d4aa;
|
|
border-radius: 12px;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
margin-bottom: 24px;
|
|
font-size: 24px;
|
|
}
|
|
|
|
.feature-card h3 {
|
|
font-size: 20px;
|
|
font-weight: 600;
|
|
margin-bottom: 12px;
|
|
}
|
|
|
|
.feature-card p {
|
|
color: #666;
|
|
font-size: 15px;
|
|
line-height: 1.6;
|
|
}
|
|
|
|
/* How it works */
|
|
.how-it-works {
|
|
padding: 100px 0;
|
|
}
|
|
|
|
.how-it-works h2 {
|
|
font-size: 40px;
|
|
font-weight: 700;
|
|
text-align: center;
|
|
margin-bottom: 64px;
|
|
}
|
|
|
|
.steps {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
gap: 32px;
|
|
flex-wrap: wrap;
|
|
}
|
|
|
|
.step {
|
|
flex: 1;
|
|
min-width: 200px;
|
|
text-align: center;
|
|
}
|
|
|
|
.step-number {
|
|
width: 64px;
|
|
height: 64px;
|
|
background: #000;
|
|
color: #00d4aa;
|
|
border-radius: 50%;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
font-size: 24px;
|
|
font-weight: 700;
|
|
margin: 0 auto 24px;
|
|
}
|
|
|
|
.step h3 {
|
|
font-size: 20px;
|
|
font-weight: 600;
|
|
margin-bottom: 12px;
|
|
}
|
|
|
|
.step p {
|
|
color: #666;
|
|
font-size: 15px;
|
|
}
|
|
|
|
/* Risk Levels */
|
|
.risk-levels {
|
|
padding: 100px 0;
|
|
background: #f8f9fa;
|
|
}
|
|
|
|
.risk-levels h2 {
|
|
font-size: 40px;
|
|
font-weight: 700;
|
|
text-align: center;
|
|
margin-bottom: 64px;
|
|
}
|
|
|
|
.risk-grid {
|
|
display: grid;
|
|
grid-template-columns: repeat(4, 1fr);
|
|
gap: 24px;
|
|
}
|
|
|
|
.risk-card {
|
|
padding: 32px;
|
|
border-radius: 16px;
|
|
text-align: center;
|
|
}
|
|
|
|
.risk-card.green {
|
|
background: #dcfce7;
|
|
border: 2px solid #22c55e;
|
|
}
|
|
|
|
.risk-card.yellow {
|
|
background: #fef9c3;
|
|
border: 2px solid #eab308;
|
|
}
|
|
|
|
.risk-card.orange {
|
|
background: #ffedd5;
|
|
border: 2px solid #f97316;
|
|
}
|
|
|
|
.risk-card.red {
|
|
background: #fee2e2;
|
|
border: 2px solid #ef4444;
|
|
}
|
|
|
|
.risk-indicator {
|
|
width: 24px;
|
|
height: 24px;
|
|
border-radius: 50%;
|
|
margin: 0 auto 16px;
|
|
}
|
|
|
|
.risk-card.green .risk-indicator {
|
|
background: #22c55e;
|
|
}
|
|
|
|
.risk-card.yellow .risk-indicator {
|
|
background: #eab308;
|
|
}
|
|
|
|
.risk-card.orange .risk-indicator {
|
|
background: #f97316;
|
|
}
|
|
|
|
.risk-card.red .risk-indicator {
|
|
background: #ef4444;
|
|
}
|
|
|
|
.risk-card h3 {
|
|
font-size: 24px;
|
|
font-weight: 700;
|
|
margin-bottom: 8px;
|
|
}
|
|
|
|
.risk-card p {
|
|
font-size: 14px;
|
|
color: #666;
|
|
}
|
|
|
|
/* Use Cases */
|
|
.use-cases {
|
|
padding: 100px 0;
|
|
}
|
|
|
|
.use-cases h2 {
|
|
font-size: 40px;
|
|
font-weight: 700;
|
|
text-align: center;
|
|
margin-bottom: 64px;
|
|
}
|
|
|
|
.use-case-grid {
|
|
display: grid;
|
|
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
|
|
gap: 32px;
|
|
}
|
|
|
|
.use-case-card {
|
|
padding: 32px;
|
|
border: 1px solid #e5e7eb;
|
|
border-radius: 16px;
|
|
transition: border-color 0.2s;
|
|
}
|
|
|
|
.use-case-card:hover {
|
|
border-color: #00d4aa;
|
|
}
|
|
|
|
.use-case-card h3 {
|
|
font-size: 18px;
|
|
font-weight: 600;
|
|
margin-bottom: 8px;
|
|
}
|
|
|
|
.use-case-card p {
|
|
color: #666;
|
|
font-size: 14px;
|
|
}
|
|
|
|
/* CTA Section */
|
|
.cta-section {
|
|
padding: 100px 0;
|
|
background: #000;
|
|
color: #fff;
|
|
text-align: center;
|
|
}
|
|
|
|
.cta-section h2 {
|
|
font-size: 40px;
|
|
font-weight: 700;
|
|
margin-bottom: 24px;
|
|
}
|
|
|
|
.cta-section p {
|
|
font-size: 18px;
|
|
opacity: 0.8;
|
|
max-width: 600px;
|
|
margin: 0 auto 40px;
|
|
}
|
|
|
|
/* Footer */
|
|
footer {
|
|
background: #111;
|
|
color: #fff;
|
|
padding: 48px 0;
|
|
text-align: center;
|
|
}
|
|
|
|
footer p {
|
|
opacity: 0.6;
|
|
font-size: 14px;
|
|
}
|
|
|
|
/* Responsive */
|
|
@media (max-width: 768px) {
|
|
.hero h1 {
|
|
font-size: 36px;
|
|
}
|
|
|
|
.risk-grid {
|
|
grid-template-columns: 1fr;
|
|
}
|
|
|
|
.steps {
|
|
flex-direction: column;
|
|
}
|
|
|
|
nav {
|
|
display: none;
|
|
}
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<header>
|
|
<div class="container">
|
|
<div class="logo">Land<span>vex</span></div>
|
|
<nav>
|
|
<a href="/">Hem</a>
|
|
<a href="/infrastructure-monitoring">VIMS</a>
|
|
<a href="/contact">Kontakt</a>
|
|
</nav>
|
|
</div>
|
|
</header>
|
|
|
|
<section class="hero">
|
|
<div class="container">
|
|
<h1>Visuell övervakning av <span>kritisk infrastruktur</span></h1>
|
|
<p>AI-driven avvikelsedetektion för bankomater, laddstationer, parkeringsautomater och mer. Upptäck manipulation innan den blir ett brott.</p>
|
|
<a href="#contact" class="cta-button">Boka demo</a>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="features">
|
|
<div class="container">
|
|
<h2>Hur VIMS fungerar</h2>
|
|
<div class="feature-grid">
|
|
<div class="feature-card">
|
|
<div class="feature-icon">📸</div>
|
|
<h3>Kontinuerlig insamling</h3>
|
|
<p>quiXzoom Zoomers fotograferar objekten regelbundet från samma vinklar. Varje insamling kvalitetskontrolleras av AI.</p>
|
|
</div>
|
|
<div class="feature-card">
|
|
<div class="feature-icon">🔍</div>
|
|
<h3>Objektdetektion</h3>
|
|
<p>AI identifierar komponenter som kortläsare, PIN-pad, display och NFC-läsare med hög precision.</p>
|
|
</div>
|
|
<div class="feature-card">
|
|
<div class="feature-icon">⚡</div>
|
|
<h3>Förändringsanalys</h3>
|
|
<p>Systemet jämför med tidigare verifierade bilder och upptäcker avvikelser — extra enheter, modifierade komponenter, blockeringar.</p>
|
|
</div>
|
|
<div class="feature-card">
|
|
<div class="feature-icon">🚨</div>
|
|
<h3>Riskklassificering</h3>
|
|
<p>Grön, gul, orange eller röd klassificering baserat på avvikelsens art. Omedelbara larm vid hög risk.</p>
|
|
</div>
|
|
<div class="feature-card">
|
|
<div class="feature-icon">📊</div>
|
|
<h3>Realtidsdashboard</h3>
|
|
<p>Översikt över alla objekt, aktiva larm, inspektionsfrekvens och efterlevnad. Klicka dig ner till enskilda observationer.</p>
|
|
</div>
|
|
<div class="feature-card">
|
|
<div class="feature-icon">🔒</div>
|
|
<h3>Avskräckning</h3>
|
|
<p>Kontinuerlig övervakning gör objekten mindre attraktiva för angripare. Risk-belöningskalkylen förskjuts.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="how-it-works">
|
|
<div class="container">
|
|
<h2>Processen</h2>
|
|
<div class="steps">
|
|
<div class="step">
|
|
<div class="step-number">1</div>
|
|
<h3>Identifiera</h3>
|
|
<p>Varje objekt får unikt ID, GPS-position och referensbilder från godkända vinklar.</p>
|
|
</div>
|
|
<div class="step">
|
|
<div class="step-number">2</div>
|
|
<h3>Insamla</h3>
|
|
<p>Zoomers fotograferar regelbundet. AI kontrollerar bildkvalitet och vinkel.</p>
|
|
</div>
|
|
<div class="step">
|
|
<div class="step-number">3</div>
|
|
<h3>Analysera</h3>
|
|
<p>AI detekterar komponenter och jämför med baseline. Avvikelser flaggas.</p>
|
|
</div>
|
|
<div class="step">
|
|
<div class="step-number">4</div>
|
|
<h3>Åtgärda</h3>
|
|
<p>Larm skickas vid hög risk. Före- och efterbilder bifogas. Ärende skapas.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="risk-levels">
|
|
<div class="container">
|
|
<h2>Riskklassificering</h2>
|
|
<div class="risk-grid">
|
|
<div class="risk-card green">
|
|
<div class="risk-indicator"></div>
|
|
<h3>Grön</h3>
|
|
<p>Inga förändringar. Fortsätt övervakning.</p>
|
|
</div>
|
|
<div class="risk-card yellow">
|
|
<div class="risk-indicator"></div>
|
|
<h3>Gul</h3>
|
|
<p>Mindre förändring. Kräver ny bild.</p>
|
|
</div>
|
|
<div class="risk-card orange">
|
|
<div class="risk-indicator"></div>
|
|
<h3>Orange</h3>
|
|
<p>Misstänkt avvikelse. Mänsklig granskning.</p>
|
|
</div>
|
|
<div class="risk-card red">
|
|
<div class="risk-indicator"></div>
|
|
<h3>Röd</h3>
|
|
<p>Hög risk. Omedelbart larm.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="use-cases">
|
|
<div class="container">
|
|
<h2>Användningsområden</h2>
|
|
<div class="use-case-grid">
|
|
<div class="use-case-card">
|
|
<h3>🏧 Bankomater</h3>
|
|
<p>Upptäck skimmers, overlays och manipulerade komponenter innan kunder drabbas.</p>
|
|
</div>
|
|
<div class="use-case-card">
|
|
<h3>⚡ Laddstationer</h3>
|
|
<p>Övervaka kabelskador, connector-tillstånd och betalterminaler.</p>
|
|
</div>
|
|
<div class="use-case-card">
|
|
<h3>🅿️ Parkeringsautomater</h3>
|
|
<p>Detektera blockeringar, manipulation och skador.</p>
|
|
</div>
|
|
<div class="use-case-card">
|
|
<h3>❤️ Hjärtstartare</h3>
|
|
<p>Säkerställ tillgänglighet och funktion. Upptäck skador eller stöld.</p>
|
|
</div>
|
|
<div class="use-case-card">
|
|
<h3>🚦 Trafiksignaler</h3>
|
|
<p>Övervaka skador, graffiti och funktionsfel.</p>
|
|
</div>
|
|
<div class="use-case-card">
|
|
<h3>🔌 Elskåp</h3>
|
|
<p>Upptäck obehörig åtkomst, skador och läckage.</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="cta-section" id="contact">
|
|
<div class="container">
|
|
<h2>Skydda din infrastruktur</h2>
|
|
<p>Kontinuerlig visuell övervakning med AI. Från 50 USD per objekt och månad.</p>
|
|
<a href="mailto:vims@landvex.com" class="cta-button">Kontakta oss</a>
|
|
</div>
|
|
</section>
|
|
|
|
<footer>
|
|
<div class="container">
|
|
<p>© 2026 Landvex AB. Alla rättigheter förbehållna.</p>
|
|
</div>
|
|
</footer>
|
|
</body>
|
|
</html>
|