300 lines
10 KiB
HTML
300 lines
10 KiB
HTML
|
<!DOCTYPE html>
|
||
|
|
<html lang="sv">
|
||
|
|
<head>
|
||
|
|
<meta charset="UTF-8">
|
||
|
|
<link rel="icon" type="image/x-icon" href="/favicon.ico">
|
||
|
|
<link rel="icon" type="image/svg+xml" href="/favicon.svg">
|
||
|
|
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
|
||
|
|
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
|
||
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
|
||
|
|
<meta name="color-scheme" content="light dark">
|
||
|
|
<title>LandveX — Recensioner & Betyg</title>
|
||
|
|
<meta name="description" content="Se vad fastighetsbolag och infrastrukturaktörer säger om LandveX — intelligent inspektionsplattform med rätt kontroll till rätt kostnad.">
|
||
|
|
<link rel="canonical" href="https://landvex.com/reviews">
|
||
|
|
<link rel="stylesheet" href="/_design-system/apple-native/tokens.css">
|
||
|
|
|
||
|
|
<!-- schema.org Product markup — reviews will be added after launch -->
|
||
|
|
<script type="application/ld+json">
|
||
|
|
{
|
||
|
|
"@context": "https://schema.org/",
|
||
|
|
"@type": "Product",
|
||
|
|
"name": "LandveX",
|
||
|
|
"description": "Intelligent inspektions- och förvaltningsplattform för fastighetsbolag. Right control. Right cost. Right interval.",
|
||
|
|
"url": "https://landvex.com",
|
||
|
|
"brand": { "@type": "Brand", "name": "Wavult Group" }
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style>
|
||
|
|
* { box-sizing: border-box; margin: 0; padding: 0; -webkit-font-smoothing: antialiased; }
|
||
|
|
body { font-family: var(--font-text); background: var(--background-secondary); color: var(--label-primary); min-height: 100vh; }
|
||
|
|
|
||
|
|
/* HERO */
|
||
|
|
.hero {
|
||
|
|
background: linear-gradient(160deg, #001F4D 0%, #003D99 60%, #0055CC 100%);
|
||
|
|
padding: 72px 24px 56px;
|
||
|
|
text-align: center;
|
||
|
|
color: white;
|
||
|
|
position: relative;
|
||
|
|
overflow: hidden;
|
||
|
|
}
|
||
|
|
.hero::before {
|
||
|
|
content: '';
|
||
|
|
position: absolute; top: -80px; right: -60px;
|
||
|
|
width: 320px; height: 320px; border-radius: 50%;
|
||
|
|
background: rgba(0,0,0,0.04);
|
||
|
|
}
|
||
|
|
.hero-logo {
|
||
|
|
width: 80px; height: 80px;
|
||
|
|
background: rgba(0,0,0,0.2);
|
||
|
|
border-radius: 20px;
|
||
|
|
display: flex; align-items: center; justify-content: center;
|
||
|
|
font-size: 32px; font-weight: 900;
|
||
|
|
color: white; margin: 0 auto 24px;
|
||
|
|
backdrop-filter: blur(20px);
|
||
|
|
border: 1px solid rgba(0,0,0,0.3);
|
||
|
|
position: relative; z-index: 1;
|
||
|
|
letter-spacing: -1px;
|
||
|
|
}
|
||
|
|
.hero h1 {
|
||
|
|
font-family: var(--font-display);
|
||
|
|
font-size: 38px; font-weight: 700;
|
||
|
|
letter-spacing: -1px; margin-bottom: 8px;
|
||
|
|
position: relative; z-index: 1;
|
||
|
|
}
|
||
|
|
.hero .tagline {
|
||
|
|
font-size: 16px; opacity: 0.8;
|
||
|
|
margin-bottom: 32px; position: relative; z-index: 1;
|
||
|
|
font-style: italic;
|
||
|
|
}
|
||
|
|
.agg-rating {
|
||
|
|
display: inline-flex; align-items: center; gap: 12px;
|
||
|
|
background: rgba(0,0,0,0.18);
|
||
|
|
backdrop-filter: blur(20px);
|
||
|
|
border: 1px solid rgba(0,0,0,0.3);
|
||
|
|
border-radius: 20px; padding: 16px 28px;
|
||
|
|
position: relative; z-index: 1;
|
||
|
|
}
|
||
|
|
.agg-score {
|
||
|
|
font-family: var(--font-display);
|
||
|
|
font-size: 52px; font-weight: 700;
|
||
|
|
line-height: 1; color: white;
|
||
|
|
}
|
||
|
|
.agg-info { text-align: left; }
|
||
|
|
.stars { font-size: 22px; letter-spacing: 2px; margin-bottom: 4px; }
|
||
|
|
.agg-count { font-size: 14px; opacity: 0.8; }
|
||
|
|
|
||
|
|
/* STATS BAR */
|
||
|
|
.stats-bar {
|
||
|
|
display: flex; gap: 0;
|
||
|
|
background: var(--background-primary);
|
||
|
|
border-bottom: 0.5px solid var(--separator);
|
||
|
|
overflow-x: auto;
|
||
|
|
}
|
||
|
|
.stat-item {
|
||
|
|
flex: 1; min-width: 120px;
|
||
|
|
padding: 20px 16px; text-align: center;
|
||
|
|
border-right: 0.5px solid var(--separator);
|
||
|
|
}
|
||
|
|
.stat-item:last-child { border-right: none; }
|
||
|
|
.stat-value {
|
||
|
|
font-family: var(--font-display);
|
||
|
|
font-size: 28px; font-weight: 700;
|
||
|
|
color: var(--ios-blue); letter-spacing: -0.5px;
|
||
|
|
}
|
||
|
|
.stat-label { font-size: 12px; color: var(--label-secondary); margin-top: 4px; }
|
||
|
|
|
||
|
|
/* SECTION */
|
||
|
|
.section { padding: 32px 20px; max-width: 960px; margin: 0 auto; }
|
||
|
|
.section-title {
|
||
|
|
font-family: var(--font-display);
|
||
|
|
font-size: 22px; font-weight: 700; letter-spacing: -0.5px; margin-bottom: 20px;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* FILTER PILLS */
|
||
|
|
.filter-bar {
|
||
|
|
display: flex; gap: 8px; flex-wrap: wrap;
|
||
|
|
padding: 0 20px 24px; max-width: 960px; margin: 0 auto;
|
||
|
|
}
|
||
|
|
.filter-pill {
|
||
|
|
padding: 8px 16px; border-radius: 100px;
|
||
|
|
font-size: 15px; font-weight: 600;
|
||
|
|
border: 1.5px solid var(--separator);
|
||
|
|
background: var(--background-primary);
|
||
|
|
color: var(--label-secondary); cursor: pointer;
|
||
|
|
transition: all 0.2s; white-space: nowrap;
|
||
|
|
}
|
||
|
|
.filter-pill.active {
|
||
|
|
background: var(--ios-blue);
|
||
|
|
border-color: var(--ios-blue);
|
||
|
|
color: white;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* REVIEW GRID */
|
||
|
|
.reviews-grid {
|
||
|
|
display: grid;
|
||
|
|
grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
|
||
|
|
gap: 16px;
|
||
|
|
}
|
||
|
|
.review-card {
|
||
|
|
background: var(--background-primary);
|
||
|
|
border-radius: 20px;
|
||
|
|
border: 0.5px solid var(--separator);
|
||
|
|
padding: 24px;
|
||
|
|
transition: transform 0.2s, box-shadow 0.2s;
|
||
|
|
}
|
||
|
|
.review-card:hover {
|
||
|
|
transform: translateY(-3px);
|
||
|
|
box-shadow: 0 8px 32px rgba(0,0,0,0.08);
|
||
|
|
}
|
||
|
|
.review-top {
|
||
|
|
display: flex; align-items: flex-start;
|
||
|
|
justify-content: space-between; margin-bottom: 14px;
|
||
|
|
}
|
||
|
|
.reviewer-info { display: flex; align-items: center; gap: 12px; }
|
||
|
|
.reviewer-avatar {
|
||
|
|
width: 44px; height: 44px; border-radius: 50%;
|
||
|
|
background: linear-gradient(135deg, #001F4D, #0055CC);
|
||
|
|
display: flex; align-items: center; justify-content: center;
|
||
|
|
font-size: 18px; font-weight: 700; color: white; flex-shrink: 0;
|
||
|
|
}
|
||
|
|
.reviewer-name { font-size: 16px; font-weight: 600; letter-spacing: -0.2px; }
|
||
|
|
.reviewer-meta { font-size: 13px; color: var(--label-secondary); margin-top: 2px; }
|
||
|
|
.review-stars { font-size: 16px; letter-spacing: 1px; }
|
||
|
|
.review-title { font-size: 16px; font-weight: 700; letter-spacing: -0.3px; margin-bottom: 8px; }
|
||
|
|
.review-body { font-size: 15px; line-height: 1.55; color: var(--label-secondary); }
|
||
|
|
.review-footer {
|
||
|
|
display: flex; align-items: center;
|
||
|
|
justify-content: space-between; margin-top: 16px;
|
||
|
|
}
|
||
|
|
.platform-badge {
|
||
|
|
display: flex; align-items: center; gap: 6px;
|
||
|
|
font-size: 12px; font-weight: 600;
|
||
|
|
color: var(--label-tertiary);
|
||
|
|
background: var(--background-secondary);
|
||
|
|
padding: 4px 10px; border-radius: 100px;
|
||
|
|
}
|
||
|
|
.review-date { font-size: 12px; color: var(--label-tertiary); }
|
||
|
|
|
||
|
|
/* CTA */
|
||
|
|
.cta-section {
|
||
|
|
background: linear-gradient(135deg, #001F4D, #003D99);
|
||
|
|
border-radius: 24px; padding: 40px 32px;
|
||
|
|
text-align: center; margin: 0 20px 40px;
|
||
|
|
max-width: 920px; margin-left: auto; margin-right: auto;
|
||
|
|
}
|
||
|
|
.cta-section h2 {
|
||
|
|
font-family: var(--font-display);
|
||
|
|
font-size: 26px; font-weight: 700;
|
||
|
|
color: white; margin-bottom: 12px; letter-spacing: -0.5px;
|
||
|
|
}
|
||
|
|
.cta-section p { font-size: 16px; color: rgba(0,0,0,0.75); margin-bottom: 24px; }
|
||
|
|
.cta-btn {
|
||
|
|
display: inline-block;
|
||
|
|
background: white; color: #001F4D;
|
||
|
|
font-size: 17px; font-weight: 700;
|
||
|
|
padding: 16px 32px; border-radius: 14px;
|
||
|
|
text-decoration: none;
|
||
|
|
transition: transform 0.15s, box-shadow 0.15s;
|
||
|
|
}
|
||
|
|
.cta-btn:hover { transform: translateY(-2px); box-shadow: 0 8px 24px rgba(0,0,0,0.2); }
|
||
|
|
|
||
|
|
.footer { text-align: center; padding: 24px 20px; color: var(--label-tertiary); font-size: 13px; }
|
||
|
|
</style>
|
||
|
|
|
||
|
|
<style id="wcag-contrast-enforcement">
|
||
|
|
/* AAMOS GLOBAL CONTRAST ENFORCEMENT — WCAG AA (4.5:1 minimum) */
|
||
|
|
/* Regel: Ingen text under 70% opacity. Aldrig. */
|
||
|
|
body { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
|
||
|
|
/* Fix common low-contrast patterns */
|
||
|
|
[style*="rgba(60,60,67,0.4)"] { color: rgba(60,60,67,0.65) !important; }
|
||
|
|
[style*="rgba(60,60,67,0.3)"] { color: rgba(60,60,67,0.65) !important; }
|
||
|
|
[style*="rgba(0,0,0,0.4)"] { color: rgba(0,0,0,0.72) !important; }
|
||
|
|
[style*="rgba(0,0,0,0.3)"] { color: rgba(0,0,0,0.72) !important; }
|
||
|
|
[style*="opacity: 0.4"] { opacity: 0.72 !important; }
|
||
|
|
[style*="opacity: 0.3"] { opacity: 0.72 !important; }
|
||
|
|
</style>
|
||
|
|
</head>
|
||
|
|
<body>
|
||
|
|
|
||
|
|
<!-- HERO -->
|
||
|
|
<div class="hero">
|
||
|
|
<div class="hero-logo">LX</div>
|
||
|
|
<h1>LandveX</h1>
|
||
|
|
<p class="tagline">Right control. Right cost. Right interval.</p>
|
||
|
|
<div class="agg-rating">
|
||
|
|
<div class="agg-score" style="font-size:1.25rem;font-weight:700;">Kommer snart</div>
|
||
|
|
<div class="agg-info">
|
||
|
|
<div class="stars" style="opacity:0;">★★★★★</div>
|
||
|
|
<div class="agg-count">Recensioner efter lansering</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<!-- STATS -->
|
||
|
|
<div class="stats-bar">
|
||
|
|
<div class="stat-item">
|
||
|
|
<div class="stat-value">—</div>
|
||
|
|
<div class="stat-label">Besiktningskostnad</div>
|
||
|
|
</div>
|
||
|
|
<div class="stat-item">
|
||
|
|
<div class="stat-value">—</div>
|
||
|
|
<div class="stat-label">Onboarding-tid</div>
|
||
|
|
</div>
|
||
|
|
<div class="stat-item">
|
||
|
|
<div class="stat-value">—</div>
|
||
|
|
<div class="stat-label">Till positiv ROI</div>
|
||
|
|
</div>
|
||
|
|
<div class="stat-item">
|
||
|
|
<div class="stat-value">—</div>
|
||
|
|
<div class="stat-label">Genomsnittligt betyg</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<!-- FILTER -->
|
||
|
|
<div class="filter-bar" style="padding-top: 24px;">
|
||
|
|
<div class="filter-pill active">Alla</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<!-- REVIEWS -->
|
||
|
|
<div class="section">
|
||
|
|
<div class="section-title">Vad kunderna säger</div>
|
||
|
|
<div class="reviews-grid" id="reviewsGrid">
|
||
|
|
|
||
|
|
<div class="review-card" style="text-align:center;padding:48px 24px;">
|
||
|
|
<div style="font-size:3rem;margin-bottom:16px;">📝</div>
|
||
|
|
<h3 style="font-size:1.25rem;font-weight:700;margin-bottom:12px;color:var(--label-primary);">Recensioner kommer snart</h3>
|
||
|
|
<p style="color:var(--label-secondary);line-height:1.6;max-width:400px;margin:0 auto;">Landvex lanserar under 2026. Recensioner från kunder kommer att publiceras här när plattformen är live.</p>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<!-- CTA -->
|
||
|
|
<div class="cta-section" style="margin-bottom: 40px;">
|
||
|
|
<h2>Dela din upplevelse</h2>
|
||
|
|
<p>Använder du LandveX? Hjälp andra fastighetsbolag att fatta rätt beslut.</p>
|
||
|
|
<a href="https://g.page/r/landvex/review" class="cta-btn" target="_blank" rel="noopener">Lämna din recension →</a>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<!-- FOOTER -->
|
||
|
|
<div class="footer">
|
||
|
|
© 2026 LandveX · Wavult Group · <a href="/privacy" style="color: inherit;">Integritetspolicy</a> · <a href="/terms" style="color: inherit;">Villkor</a>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
function filterReviews(platform, el) {
|
||
|
|
document.querySelectorAll('.filter-pill').forEach(p => p.classList.remove('active'));
|
||
|
|
el.classList.add('active');
|
||
|
|
document.querySelectorAll('.review-card').forEach(card => {
|
||
|
|
if (platform === 'all' || card.dataset.platform === platform) {
|
||
|
|
card.style.display = '';
|
||
|
|
} else {
|
||
|
|
card.style.display = 'none';
|
||
|
|
}
|
||
|
|
});
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
</body>
|
||
|
|
</html>
|