feat(boc): Complete Business Operations Center v1.0

- Go backend API with full CRUD for all modules (CRM, Sales, Finance, HR, Legal, Marketing, Support, Purchase, Inventory, Projects, Automation, Analytics)
- Rust analytics service with parallel report generation
- C runtime with POSIX shared memory IPC
- PostgreSQL schema with 30+ tables, full migrations
- Redis cache, sessions, pub/sub
- Kafka event streaming with Zookeeper
- WebSocket hub for real-time updates
- Automation engine with cron jobs, workflows, event triggers
- JWT authentication, multi-tenant from start
- Docker Compose with all services
- Nginx reverse proxy with rate limiting
- Integration tests passing
- Feature gap analysis against Fortnox/Odoo/Visma

Refs: BOC-001
This commit is contained in:
Bernt
2026-07-12 12:41:35 +00:00
parent 4789a7fb48
commit 58ca4e68db
26666 changed files with 575891 additions and 2074516 deletions
@@ -0,0 +1,478 @@
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>quiXzoom — Photographiez. Soyez payé. | Devenez Zoomer</title>
<meta name="description" content="Devenez Zoomer : prenez des missions photo près de chez vous et gagnez de l'argent. Inscription gratuite. Lancement le 1er août 2026.">
<meta name="robots" content="index, follow">
<meta name="theme-color" content="#0a0a0a">
<meta name="author" content="quiXzoom AB">
<link rel="canonical" href="https://quixzoom.fr/">
<link rel="alternate" hreflang="fr" href="https://quixzoom.fr/">
<link rel="alternate" hreflang="en" href="https://www.quixzoom.com/">
<link rel="alternate" hreflang="de" href="https://quixzoom.de/">
<link rel="alternate" hreflang="en-gb" href="https://quixzoom.co.uk/">
<link rel="alternate" hreflang="x-default" href="https://www.quixzoom.com/">
<meta property="og:type" content="website">
<meta property="og:site_name" content="quiXzoom">
<meta property="og:title" content="quiXzoom — Photographiez. Soyez payé. | Devenez Zoomer">
<meta property="og:description" content="Devenez Zoomer : prenez des missions photo près de chez vous et gagnez de l'argent. Inscription gratuite. Lancement le 1er août 2026.">
<meta property="og:url" content="https://quixzoom.fr/">
<meta property="og:locale" content="fr_FR">
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:site" content="@quixzoom">
<style>
:root{--qx-black:#0a0a0a;--qx-white:#FFFFFF;--qx-blue:#0066FF;--qx-blue-light:#E8F0FF;--qx-blue-dark:#0052CC;--qx-green:#00C853;--qx-gray:#F5F5F7;--qx-gray-dark:#86868b;--qx-border:#D2D2D7;--qx-text:#1d1d1f;--qx-footer:#1a1a1a;--qx-radius:12px;--qx-radius-lg:20px;--qx-shadow:0 2px 20px rgba(0,0,0,.08);--qx-shadow-lg:0 8px 40px rgba(0,0,0,.14);--font:-apple-system,BlinkMacSystemFont,'SF Pro Display','Helvetica Neue',Arial,sans-serif}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:var(--font);background:var(--qx-white);color:var(--qx-text);line-height:1.6;font-size:16px;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
img{max-width:100%;height:auto;display:block}
.container{max-width:1100px;margin:0 auto;padding:0 24px}
#nav{position:sticky;top:0;z-index:200;background:rgba(10,10,10,.90);backdrop-filter:saturate(180%) blur(24px);-webkit-backdrop-filter:saturate(180%) blur(24px);border-bottom:1px solid rgba(255,255,255,.07)}
.nav-inner{display:flex;align-items:center;justify-content:space-between;height:58px;max-width:1100px;margin:0 auto;padding:0 24px;gap:16px}
.nav-logo{font-size:1.3rem;font-weight:800;color:var(--qx-white);letter-spacing:-.03em;flex-shrink:0}
.nav-logo .x{color:var(--qx-blue)}
.nav-links{display:flex;align-items:center;gap:4px;list-style:none}
.nav-links a{color:rgba(255,255,255,.78);font-size:.875rem;font-weight:500;padding:6px 10px;border-radius:8px;transition:color .15s,background .15s;white-space:nowrap}
.nav-links a:hover{color:var(--qx-white);background:rgba(255,255,255,.08)}
.nav-right{display:flex;align-items:center;gap:10px;flex-shrink:0}
.nav-cta{background:var(--qx-blue);color:var(--qx-white);padding:8px 20px;border-radius:20px;font-size:.875rem;font-weight:700;transition:opacity .15s,transform .15s;white-space:nowrap}
.nav-cta:hover{opacity:.88;transform:translateY(-1px)}
#nav-toggle{display:none}
.hamburger{display:none;flex-direction:column;gap:5px;cursor:pointer;padding:8px;border-radius:8px;background:rgba(255,255,255,.08);border:none;flex-shrink:0}
.hamburger span{display:block;width:20px;height:2px;background:rgba(255,255,255,.85);border-radius:2px;transition:transform .25s,opacity .25s}
#nav-toggle:checked ~ .nav-inner .hamburger span:nth-child(1){transform:translateY(7px) rotate(45deg)}
#nav-toggle:checked ~ .nav-inner .hamburger span:nth-child(2){opacity:0}
#nav-toggle:checked ~ .nav-inner .hamburger span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.mobile-menu{display:none;flex-direction:column;padding:12px 20px 20px;border-top:1px solid rgba(255,255,255,.07);gap:4px}
#nav-toggle:checked ~ .mobile-menu{display:flex}
.mobile-menu a{color:rgba(255,255,255,.85);font-size:1rem;font-weight:500;padding:10px 14px;border-radius:10px;transition:background .15s}
.mobile-menu a:hover{background:rgba(255,255,255,.08)}
.mobile-menu .m-cta{background:var(--qx-blue);color:var(--qx-white);font-weight:700;text-align:center;margin-top:8px;border-radius:20px}
#hero{background:var(--qx-black);color:var(--qx-white);padding:96px 24px 80px;text-align:center;position:relative;overflow:hidden}
#hero::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 80% 60% at 50% 0%,rgba(0,102,255,.18) 0%,transparent 70%);pointer-events:none}
.hero-badge{display:inline-flex;align-items:center;gap:8px;background:rgba(0,102,255,.15);color:#6699FF;border:1px solid rgba(0,102,255,.3);border-radius:24px;padding:7px 18px;font-size:.8125rem;font-weight:700;letter-spacing:.02em;margin-bottom:28px}
h1{font-size:clamp(2.25rem,5.5vw,4rem);font-weight:900;line-height:1.05;letter-spacing:-.04em;margin-bottom:24px}
h1 em{font-style:normal;color:var(--qx-blue)}
.hero-sub{font-size:clamp(1rem,2vw,1.25rem);color:rgba(255,255,255,.65);max-width:620px;margin:0 auto 36px;line-height:1.65}
.hero-ctas{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-bottom:20px}
.btn-primary{background:var(--qx-blue);color:var(--qx-white);padding:15px 36px;border-radius:28px;font-size:1.0625rem;font-weight:700;transition:transform .15s,opacity .15s,box-shadow .15s;display:inline-block;box-shadow:0 4px 24px rgba(0,102,255,.35)}
.btn-primary:hover{transform:translateY(-2px);opacity:.92;box-shadow:0 8px 32px rgba(0,102,255,.45)}
.btn-secondary{background:rgba(255,255,255,.08);color:var(--qx-white);padding:15px 36px;border-radius:28px;font-size:1.0625rem;font-weight:600;border:1px solid rgba(255,255,255,.18);transition:background .15s,transform .15s;display:inline-block}
.btn-secondary:hover{background:rgba(255,255,255,.15);transform:translateY(-2px)}
.trust-strip{display:flex;align-items:center;justify-content:center;gap:16px;flex-wrap:wrap;margin-top:16px;color:rgba(255,255,255,.5);font-size:.8125rem;font-weight:500}
.trust-strip span{display:flex;align-items:center;gap:6px}
.trust-strip span::before{content:'✓';color:var(--qx-green);font-weight:700}
#stats{background:var(--qx-blue);color:var(--qx-white);padding:48px 24px}
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;max-width:960px;margin:0 auto;text-align:center}
.stat-value{font-size:clamp(1.75rem,3.5vw,2.75rem);font-weight:900;letter-spacing:-.03em;line-height:1}
.stat-label{font-size:.875rem;font-weight:500;opacity:.82;margin-top:6px}
section{padding:88px 24px}
.section-label{font-size:.75rem;font-weight:800;color:var(--qx-blue);text-transform:uppercase;letter-spacing:.1em;margin-bottom:10px}
.section-title{font-size:clamp(1.875rem,3.5vw,2.75rem);font-weight:900;letter-spacing:-.03em;line-height:1.1;margin-bottom:14px}
.section-sub{color:var(--qx-gray-dark);font-size:1.0625rem;max-width:600px;margin-bottom:52px;line-height:1.65}
.section-link{display:inline-flex;align-items:center;gap:6px;color:var(--qx-blue);font-size:.9375rem;font-weight:600;margin-top:32px;border-bottom:1.5px solid rgba(0,102,255,.25);padding-bottom:2px;transition:border-color .15s,gap .15s}
.section-link:hover{border-color:var(--qx-blue);gap:10px}
#how-it-works{background:var(--qx-white)}
.steps-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:28px}
.step-card{background:var(--qx-gray);border-radius:var(--qx-radius-lg);padding:36px 32px;position:relative;overflow:hidden;transition:transform .2s,box-shadow .2s;display:block;color:inherit}
.step-card:hover{transform:translateY(-4px);box-shadow:var(--qx-shadow-lg)}
.step-num{font-size:5rem;font-weight:900;color:var(--qx-blue);opacity:.1;position:absolute;top:12px;right:20px;line-height:1;pointer-events:none}
.step-icon{font-size:2.25rem;margin-bottom:18px}
.step-title{font-size:1.1875rem;font-weight:800;margin-bottom:10px;color:var(--qx-black)}
.step-desc{color:var(--qx-gray-dark);font-size:.9375rem;line-height:1.65;margin-bottom:16px}
.step-link{display:inline-flex;align-items:center;gap:5px;color:var(--qx-blue);font-size:.875rem;font-weight:700;transition:gap .15s}
.step-link:hover{gap:9px}
#missions{background:var(--qx-gray)}
.missions-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px}
.mission-card{background:var(--qx-white);border:1.5px solid var(--qx-border);border-radius:var(--qx-radius-lg);overflow:hidden;transition:transform .2s,box-shadow .2s,border-color .2s;cursor:pointer}
.mission-card:hover,.mission-card:focus-within{transform:translateY(-4px);box-shadow:var(--qx-shadow-lg);border-color:rgba(0,102,255,.3)}
.mission-header{padding:28px 28px 0}
.mission-icon{font-size:2rem;margin-bottom:12px}
.mission-title{font-size:1.125rem;font-weight:800;color:var(--qx-black);margin-bottom:6px}
.mission-pay{display:inline-block;background:var(--qx-blue-light);color:var(--qx-blue);font-size:.8125rem;font-weight:700;padding:4px 12px;border-radius:20px;margin-bottom:14px}
.mission-body{padding:0 28px 24px;color:var(--qx-gray-dark);font-size:.9375rem;line-height:1.6}
.mission-detail{background:var(--qx-blue-light);border-top:1px solid rgba(0,102,255,.1);padding:0;max-height:0;overflow:hidden;transition:max-height .35s ease,padding .35s ease}
.mission-card:focus-within .mission-detail,.mission-card:hover .mission-detail{max-height:200px;padding:16px 28px}
.mission-detail p{font-size:.875rem;color:var(--qx-blue-dark);line-height:1.6;margin-bottom:10px}
.mission-cta-link{display:inline-flex;align-items:center;gap:5px;color:var(--qx-blue);font-size:.875rem;font-weight:700;transition:gap .15s}
.mission-cta-link:hover{gap:9px}
#earnings{background:var(--qx-white)}
.earnings-intro{color:var(--qx-gray-dark);font-size:1.0625rem;max-width:600px;margin-bottom:44px;line-height:1.65}
.pricing-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px;margin-bottom:40px}
.pricing-card{border:2px solid var(--qx-border);border-radius:var(--qx-radius-lg);padding:36px 32px;position:relative;transition:transform .2s,box-shadow .2s;background:var(--qx-white)}
.pricing-card:hover{transform:translateY(-4px);box-shadow:var(--qx-shadow-lg)}
.pricing-card.featured{border-color:var(--qx-blue);box-shadow:0 4px 32px rgba(0,102,255,.15)}
.pricing-level{font-size:.8125rem;font-weight:700;color:var(--qx-gray-dark);text-transform:uppercase;letter-spacing:.08em;margin-bottom:8px}
.pricing-amount{font-size:clamp(1.75rem,3vw,2.5rem);font-weight:900;color:var(--qx-black);letter-spacing:-.03em;line-height:1;margin-bottom:6px}
.pricing-freq{color:var(--qx-gray-dark);font-size:.9375rem;margin-bottom:18px}
.pricing-desc{color:var(--qx-gray-dark);font-size:.9375rem;line-height:1.6;padding-top:18px;border-top:1px solid var(--qx-border)}
.payment-details{margin-top:36px}
.payment-details summary{cursor:pointer;font-size:1rem;font-weight:700;color:var(--qx-black);padding:18px 24px;background:var(--qx-gray);border-radius:var(--qx-radius);list-style:none;display:flex;align-items:center;justify-content:space-between;transition:background .15s}
.payment-details summary:hover{background:#eaeaec}
.payment-details summary::after{content:'';font-size:1.25rem;color:var(--qx-blue);transition:transform .25s}
.payment-details[open] summary::after{content:''}
.payment-details-body{padding:24px;background:var(--qx-gray);border-radius:0 0 var(--qx-radius) var(--qx-radius);margin-top:-4px}
.payment-details-body ul{list-style:none;display:flex;flex-direction:column;gap:12px}
.payment-details-body li{display:flex;gap:10px;color:var(--qx-gray-dark);font-size:.9375rem;line-height:1.5}
.payment-details-body li::before{content:'';color:var(--qx-blue);font-weight:700;flex-shrink:0}
.payment-details-body a{color:var(--qx-blue);font-weight:600;border-bottom:1px solid rgba(0,102,255,.2);transition:border-color .15s}
.payment-details-body a:hover{border-color:var(--qx-blue)}
#faq{background:var(--qx-gray)}
.faq-list{max-width:740px;display:flex;flex-direction:column;gap:10px}
.faq-list details{background:var(--qx-white);border-radius:var(--qx-radius);border:1px solid var(--qx-border);overflow:hidden;transition:box-shadow .2s}
.faq-list details[open]{box-shadow:var(--qx-shadow)}
.faq-list summary{cursor:pointer;padding:20px 24px;font-size:1rem;font-weight:700;color:var(--qx-black);list-style:none;display:flex;align-items:center;justify-content:space-between;gap:16px;transition:background .15s}
.faq-list summary:hover{background:#fafafa}
.faq-list summary::after{content:'+';font-size:1.375rem;font-weight:400;color:var(--qx-blue);flex-shrink:0;line-height:1;transition:transform .25s}
.faq-list details[open] summary::after{content:''}
.faq-list summary::-webkit-details-marker{display:none}
.faq-answer-body{padding:0 24px 20px;color:var(--qx-gray-dark);font-size:.9375rem;line-height:1.7}
.faq-answer-body a{color:var(--qx-blue);font-weight:600;border-bottom:1px solid rgba(0,102,255,.2);transition:border-color .15s}
.faq-answer-body a:hover{border-color:var(--qx-blue)}
.faq-contact{margin-top:28px;color:var(--qx-gray-dark);font-size:.9375rem}
.faq-contact a{color:var(--qx-blue);font-weight:600;border-bottom:1px solid rgba(0,102,255,.2)}
#app-cta{background:var(--qx-black);color:var(--qx-white);text-align:center;position:relative;overflow:hidden}
#app-cta::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 70% 50% at 50% 100%,rgba(0,102,255,.2),transparent 70%);pointer-events:none}
#app-cta .section-title{color:var(--qx-white);margin-bottom:14px}
.app-sub{font-size:1.125rem;color:rgba(255,255,255,.65);margin-bottom:40px;line-height:1.6}
.app-buttons{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;margin-bottom:24px}
.app-btn{display:flex;align-items:center;gap:12px;background:rgba(255,255,255,.08);border:1.5px solid rgba(255,255,255,.18);color:var(--qx-white);padding:14px 28px;border-radius:16px;font-size:1rem;font-weight:700;transition:background .15s,transform .15s,border-color .15s}
.app-btn:hover{background:rgba(255,255,255,.16);transform:translateY(-2px);border-color:rgba(255,255,255,.3)}
.app-btn-icon{font-size:1.75rem;line-height:1}
.app-btn-text{text-align:left;line-height:1.3}
.app-btn-text small{display:block;font-size:.75rem;font-weight:400;opacity:.7}
.app-trust{display:flex;align-items:center;justify-content:center;gap:20px;flex-wrap:wrap;color:rgba(255,255,255,.45);font-size:.8125rem;font-weight:500}
footer{background:var(--qx-footer);color:rgba(255,255,255,.6);padding:60px 24px 32px}
.footer-inner{max-width:1100px;margin:0 auto}
.footer-cols{display:grid;grid-template-columns:1.5fr repeat(3,1fr);gap:40px;margin-bottom:48px}
.footer-brand .brand-logo{font-size:1.4rem;font-weight:900;color:var(--qx-white);letter-spacing:-.03em;margin-bottom:8px}
.footer-brand .brand-logo .x{color:var(--qx-blue)}
.footer-brand .tagline{font-size:.875rem;color:rgba(255,255,255,.4);margin-bottom:20px;line-height:1.5}
.footer-lang{display:flex;flex-wrap:wrap;gap:6px}
.footer-lang a{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.1);color:rgba(255,255,255,.7);padding:5px 10px;border-radius:7px;font-size:.8125rem;font-weight:600;transition:background .15s,color .15s,border-color .15s}
.footer-lang a:hover{background:rgba(0,102,255,.25);color:var(--qx-white);border-color:rgba(0,102,255,.35)}
.footer-lang a.active{color:var(--qx-blue);border-color:rgba(0,102,255,.3);background:rgba(0,102,255,.12)}
.footer-col h4{font-size:.8125rem;font-weight:800;color:var(--qx-white);text-transform:uppercase;letter-spacing:.07em;margin-bottom:14px}
.footer-col ul{list-style:none;display:flex;flex-direction:column;gap:8px}
.footer-col a{font-size:.875rem;color:rgba(255,255,255,.5);transition:color .15s}
.footer-col a:hover{color:rgba(255,255,255,.9)}
.footer-bottom{border-top:1px solid rgba(255,255,255,.07);padding-top:24px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px}
.footer-copy{font-size:.8125rem;color:rgba(255,255,255,.3)}
.footer-aamos{font-size:.8125rem}
.footer-aamos a{color:rgba(255,255,255,.4);border-bottom:1px solid rgba(255,255,255,.15);padding-bottom:1px;transition:color .15s,border-color .15s}
.footer-aamos a:hover{color:rgba(255,255,255,.8);border-color:rgba(255,255,255,.4)}
@media(max-width:900px){.footer-cols{grid-template-columns:1fr 1fr;gap:28px}.footer-brand{grid-column:1/-1}.stats-grid{grid-template-columns:repeat(2,1fr)}.nav-links{display:none}.hamburger{display:flex}}
@media(max-width:600px){section{padding:64px 16px}.stats-grid{grid-template-columns:1fr 1fr;gap:24px}.footer-cols{grid-template-columns:1fr 1fr}.footer-brand{grid-column:1/-1}#hero{padding:72px 16px 64px}.app-buttons{flex-direction:column;align-items:center}.footer-bottom{flex-direction:column;text-align:center}}
@media(max-width:400px){.stats-grid{grid-template-columns:1fr}.footer-cols{grid-template-columns:1fr}}
html,body{overflow-x:hidden;-webkit-text-size-adjust:100%}
img,svg,video{max-width:100%}
@media(hover:none),(pointer:coarse){.mission-detail{max-height:none!important;padding:16px 28px!important}}
@media(max-width:480px){.nav-inner{padding:0 14px}#hero{padding:56px 14px 48px}h1{font-size:clamp(1.9rem,8vw,2.6rem)!important;line-height:1.08}.hero-sub{font-size:.95rem}.hero-badge{font-size:.75rem;padding:5px 12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:90vw}.btn-primary,.btn-secondary{padding:13px 24px;font-size:.95rem;width:100%;text-align:center}.hero-ctas{flex-direction:column;gap:10px}.trust-strip{gap:10px;font-size:.75rem;flex-direction:column;gap:6px;align-items:flex-start;padding:0 4px}#stats{padding:32px 14px}.stats-grid{grid-template-columns:1fr 1fr!important;gap:16px}.stat-value{font-size:1.75rem!important}section{padding:48px 14px}.section-title{font-size:clamp(1.5rem,6vw,2rem)!important}.section-sub{font-size:.95rem;margin-bottom:32px}.steps-grid{grid-template-columns:1fr!important;gap:16px}.missions-grid{grid-template-columns:1fr!important;gap:14px}.pricing-grid{grid-template-columns:1fr!important;gap:16px}.faq-list summary{padding:16px 18px;font-size:.95rem}.faq-answer-body{padding:0 18px 16px;font-size:.875rem}footer{padding:40px 14px 24px}.footer-cols{grid-template-columns:1fr 1fr!important;gap:24px}.footer-lang a{font-size:.75rem;padding:4px 8px}.container{padding-left:14px;padding-right:14px;box-sizing:border-box;width:100%}}
@media(max-width:360px){h1{font-size:1.75rem!important}.footer-cols{grid-template-columns:1fr!important}}
/* AI Images */
.hero-image-wrap{position:relative;width:100%;max-width:960px;margin:40px auto 0;border-radius:20px;overflow:hidden;box-shadow:0 20px 60px rgba(0,0,102,.4)}
.hero-image-wrap img{width:100%;height:auto;display:block}
.app-bg-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.18;pointer-events:none;z-index:0}
#app-cta{position:relative;overflow:hidden}
#app-cta .container{position:relative;z-index:1}
@media(max-width:480px){.hero-image-wrap{border-radius:12px;margin-top:28px}}
</style>
</head>
<body>
<input type="checkbox" id="nav-toggle" aria-hidden="true" style="display:none">
<nav id="nav" aria-label="Navigation principale">
<div class="nav-inner">
<a class="nav-logo" href="https://quixzoom.fr/">quiX<span class="x">zoom</span></a>
<ul class="nav-links" role="list">
<li><a href="#how-it-works">Comment ça marche</a></li>
<li><a href="#missions">Missions</a></li>
<li><a href="#earnings">Revenus</a></li>
<li><a href="#faq">FAQ</a></li>
</ul>
<div class="nav-right">
<a class="nav-cta" href="https://app.quixzoom.com/auth">Devenir Zoomer →</a>
<label class="hamburger" for="nav-toggle" aria-label="Menu" role="button">
<span></span><span></span><span></span>
</label>
</div>
</div>
<nav class="mobile-menu" aria-label="Menu mobile">
<a href="#how-it-works">Comment ça marche</a>
<a href="#missions">Missions</a>
<a href="#earnings">Revenus</a>
<a href="#faq">FAQ</a>
<a class="m-cta" href="https://app.quixzoom.com/auth">Devenir Zoomer →</a>
</nav>
</nav>
<main>
<section id="hero" aria-labelledby="hero-h1">
<div class="container">
<div class="hero-badge">🇫🇷 France · Lancement 2026</div>
<h1 id="hero-h1">Photographiez.<br><em>Soyez payé.</em></h1>
<p class="hero-sub">quiXzoom vous rémunère pour photographier des infrastructures près de chez vous. Vos horaires. Payé par mission approuvée.</p>
<div class="hero-ctas">
<a class="btn-primary" href="https://app.quixzoom.com/auth">Devenir Zoomer →</a>
<a class="btn-secondary" href="#how-it-works">Comment ça marche ↓</a>
</div>
<div class="trust-strip">
<span>Inscription gratuite</span>
<span>Priorité aux premiers Zoomers</span>
<span>Payé par mission approuvée</span>
</div>
<div class="hero-image-wrap"><img src="https://www.quixzoom.com/images/hero_infrastructure.jpg" alt="Zoomer photographing infrastructure" width="960" height="540" loading="eager" decoding="async"></div>
</div>
</section>
<section id="stats" aria-label="Stats">
<div class="container">
<div class="stats-grid">
<div><div class="stat-value">~30 min</div><div class="stat-label">durée moyenne d'une mission</div></div>
<div><div class="stat-value">20+</div><div class="stat-label">pays au lancement</div></div>
<div><div class="stat-value">1er août</div><div class="stat-label">soft launch mondial 2026</div></div>
<div><div class="stat-value">100%</div><div class="stat-label">payé après validation</div></div>
</div>
</div>
</section>
<section id="how-it-works" aria-labelledby="how-h2">
<div class="container">
<p class="section-label">Comment ça marche</p>
<h2 id="how-h2" class="section-title">De l'app au paiement en trois étapes</h2>
<p class="section-sub">Aucune formation requise, aucun équipement spécial — juste votre smartphone et un peu de temps.</p>
<div class="steps-grid">
<a class="step-card" href="https://app.quixzoom.com/auth">
<div class="step-num" aria-hidden="true">1</div>
<div class="step-icon"><span style="font-size:2.25rem">📱</span></div>
<h3 class="step-title">Inscription gratuite</h3>
<p class="step-desc">Inscrivez-vous en 5 minutes. Vérifiez votre identité avec une pièce d'identité et un selfie. Disponible dans tous les pays.</p>
<span class="step-link">Commencer →</span>
</a>
<a class="step-card" href="#missions">
<div class="step-num" aria-hidden="true">2</div>
<div class="step-icon"><span style="font-size:2.25rem">🗺️</span></div>
<h3 class="step-title">Choisissez une mission</h3>
<p class="step-desc">Parcourez les missions disponibles près de chez vous. Filtrez par type, durée et rémunération.</p>
<span class="step-link">Voir les types de missions →</span>
</a>
<a class="step-card" href="#earnings">
<div class="step-num" aria-hidden="true">3</div>
<div class="step-icon"><span style="font-size:2.25rem">💶</span></div>
<h3 class="step-title">Photographiez et soyez payé</h3>
<p class="step-desc">Naviguez jusqu'au lieu, photographiez selon les specs, envoyez. Le paiement est déclenché dès l'approbation.</p>
<span class="step-link">Voir les revenus →</span>
</a>
</div>
</div>
</section>
<section id="missions" aria-labelledby="missions-h2">
<div class="container">
<p class="section-label">Missions</p>
<h2 id="missions-h2" class="section-title">Quels types de missions existent ?</h2>
<p class="section-sub">Six catégories. Toutes avec une rémunération transparente. Choisissez ce qui vous convient.</p>
<div class="missions-grid">
<article class="mission-card" tabindex="0">
<div class="mission-header">
<div class="mission-icon">🏗️</div>
<h3 class="mission-title">Inspection d'infrastructure</h3>
<span class="mission-pay">Payé par mission</span>
</div>
<div class="mission-body">Ponts, routes, canalisations, fondations. Les communes et agences gouvernementales paient pour des contrôles visuels réguliers.</div>
<div class="mission-detail"><p>Clients : communes, agences gouvernementales, exploitants d'infrastructure.</p><a class="mission-cta-link" href="https://app.quixzoom.com/auth">Rejoindre →</a></div>
</article>
<article class="mission-card" tabindex="0">
<div class="mission-header">
<div class="mission-icon">🏢</div>
<h3 class="mission-title">Visite immobilière</h3>
<span class="mission-pay">Payé par mission</span>
</div>
<div class="mission-body">Façades, toits, entrées, parkings. Les sociétés immobilières documentent en continu pour les assurances et la maintenance.</div>
<div class="mission-detail"><p>Clients : sociétés immobilières, bailleurs sociaux.</p><a class="mission-cta-link" href="https://app.quixzoom.com/auth">Rejoindre →</a></div>
</article>
<article class="mission-card" tabindex="0">
<div class="mission-header">
<div class="mission-icon">🌿</div>
<h3 class="mission-title">Nature et littoral</h3>
<span class="mission-pay">Payé par mission</span>
</div>
<div class="mission-body">Côtes, plages, voies navigables. Agences maritimes, organismes environnementaux, recherche. Parfait si vous êtes déjà dehors.</div>
<div class="mission-detail"><p>Clients : autorités maritimes, organismes environnementaux, instituts de recherche.</p><a class="mission-cta-link" href="https://app.quixzoom.com/auth">Rejoindre →</a></div>
</article>
<article class="mission-card" tabindex="0">
<div class="mission-header">
<div class="mission-icon"></div>
<h3 class="mission-title">Documentation des sinistres</h3>
<span class="mission-pay">Payé par mission</span>
</div>
<div class="mission-body">Dommages causés par les tempêtes, inondations, vandalismes. Compagnies d'assurance. Les missions les plus rapides sont les mieux payées.</div>
<div class="mission-detail"><p>Clients : grandes compagnies et assureurs locaux. Déclenché automatiquement par les événements météorologiques.</p><a class="mission-cta-link" href="https://app.quixzoom.com/auth">Rejoindre →</a></div>
</article>
<article class="mission-card" tabindex="0">
<div class="mission-header">
<div class="mission-icon">📍</div>
<h3 class="mission-title">Géo-vérification</h3>
<span class="mission-pay">Payé par mission</span>
</div>
<div class="mission-body">Confirmer qu'un bien existe et correspond à ce qui est attendu. E-commerce, banques, agences immobilières. Simple et rapide.</div>
<div class="mission-detail"><p>Clients : e-commerce, finance, logistique. Missions courtes — généralement 10 à 15 minutes.</p><a class="mission-cta-link" href="https://app.quixzoom.com/auth">Rejoindre →</a></div>
</article>
<article class="mission-card" tabindex="0">
<div class="mission-header">
<div class="mission-icon">🏙️</div>
<h3 class="mission-title">Environnement urbain</h3>
<span class="mission-pay">Payé par mission</span>
</div>
<div class="mission-body">État des rues, signalisation, accessibilité. Communes, enseignes commerciales, urbanisme. Parfait dans votre quartier.</div>
<div class="mission-detail"><p>Clients : communes, chaînes de distribution, urbanistes.</p><a class="mission-cta-link" href="https://app.quixzoom.com/auth">Rejoindre →</a></div>
</article>
</div>
<a class="section-link" href="https://app.quixzoom.com/auth">Rejoindre →</a>
</div>
</section>
<section id="earnings" aria-labelledby="earnings-h2">
<div class="container">
<p class="section-label">Revenus</p>
<h2 id="earnings-h2" class="section-title">Combien gagnez-vous ?</h2>
<p class="earnings-intro">Chaque mission approuvée vous rapporte un paiement direct. Plus vous complétez de missions, plus vous gagnez.</p>
<div class="pricing-grid">
<div class="pricing-card">
<div class="pricing-level">Temps partiel</div>
<div class="pricing-amount">Revenu complémentaire</div>
<div class="pricing-freq">24 missions par semaine</div>
<div class="pricing-desc">Idéal en complément des études ou d'un emploi à temps partiel. Horaires flexibles, aucun engagement.</div>
</div>
<div class="pricing-card featured">
<div class="pricing-level">Actif</div>
<div class="pricing-amount">Revenu régulier</div>
<div class="pricing-freq">812 missions par semaine</div>
<div class="pricing-desc">Source de revenus principale pour de nombreux Zoomers. Améliorez rapidement votre note — accédez aux missions premium.</div>
</div>
<div class="pricing-card">
<div class="pricing-level">Pro</div>
<div class="pricing-amount">Revenu maximum</div>
<div class="pricing-freq">15+ missions par semaine</div>
<div class="pricing-desc">Les Zoomers expérimentés avec une haute note bénéficient d'un accès prioritaire aux missions premium et aux bonus.</div>
</div>
</div>
<details class="payment-details">
<summary>Paiement &amp; impôts — comment ça fonctionne ?</summary>
<div class="payment-details-body">
<ul>
<li>Payé via Stripe Connect après chaque mission approuvée</li>
<li>Aucuns frais cachés. Le montant affiché dans l'app est celui que vous recevez.</li>
<li>Vous êtes responsable de votre propre déclaration fiscale conformément aux règles en vigueur dans votre pays.</li>
<li><a href="#faq">Questions fréquentes →</a></li>
</ul>
</div>
</details>
<div style="margin-top:36px">
<a class="btn-primary" href="https://app.quixzoom.com/auth">Devenir Zoomer →</a>
</div>
</div>
</section>
<section id="faq" aria-labelledby="faq-h2">
<div class="container">
<p class="section-label">FAQ</p>
<h2 id="faq-h2" class="section-title">Questions fréquentes</h2>
<div class="faq-list">
<details>
<summary>Ai-je besoin d'un appareil photo professionnel ?</summary>
<div class="faq-answer-body">Non. Votre smartphone suffit. Nous acceptons les photos d'iPhone 12+ et de smartphones Android avec 12 MP+. Aucun équipement spécial n'est requis.</div>
</details>
<details>
<summary>Comment et quand suis-je payé ?</summary>
<div class="faq-answer-body">Le paiement est traité après chaque mission approuvée via Stripe Connect, directement sur votre compte bancaire. Vous devez vérifier votre identité une seule fois — passeport, carte d'identité nationale ou permis de conduire. Cela prend environ 2 minutes. Fonctionne depuis tous les pays.</div>
</details>
<details>
<summary>Quelles missions sont disponibles dans ma région ?</summary>
<div class="faq-answer-body">Inscrivez-vous pour voir les missions actives sur votre carte. Nous lançons mondialement le 1er août 2026. Enregistrez-vous maintenant et choisissez votre région.</div>
</details>
<details>
<summary>Ces revenus sont-ils imposables ?</summary>
<div class="faq-answer-body">Oui. Les revenus de quiXzoom sont imposables. Vous êtes responsable de votre propre déclaration fiscale conformément aux règles applicables dans votre pays.</div>
</details>
<details>
<summary>Comment fonctionne la vérification d'identité ?</summary>
<div class="faq-answer-body">Une photo d'un document d'identité (passeport, carte nationale d'identité ou permis de conduire) et un selfie. L'IA compare immédiatement votre visage au document. Requis une seule fois. Fonctionne depuis tous les pays.</div>
</details>
</div>
<p class="faq-contact">Vous avez encore des questions ? Écrivez-nous à <a href="mailto:hello@quixzoom.com">hello@quixzoom.com</a></p>
</div>
</section>
<section id="app-cta" aria-labelledby="cta-h2">
<div class="container" style="padding-top:88px;padding-bottom:88px">
<h2 id="cta-h2" class="section-title">Prêt à commencer ?</h2>
<p class="app-sub">Rejoignez la première vague de Zoomers. Inscription gratuite. Sans engagement.</p>
<div class="app-buttons">
<a class="app-btn" href="https://app.quixzoom.com/auth">
<span class="app-btn-icon">🚀</span>
<span class="app-btn-text"><small>Inscrivez-vous sur</small>app.quixzoom.com</span>
</a>
</div>
<div class="app-trust">
<span>Inscription gratuite</span>
<span>Priorité aux premiers Zoomers</span>
<span>Payé par mission approuvée</span>
</div>
</div>
</section>
</main>
<footer>
<div class="footer-inner">
<div class="footer-cols">
<div class="footer-brand">
<div class="brand-logo">quiX<span class="x">zoom</span></div>
<p class="tagline">Photographiez. Soyez payé.</p>
<div class="footer-lang">
<a href="https://quixzoom.fr/" hreflang="fr" class="active">🇫🇷 FR</a>
<a href="https://www.quixzoom.com/" hreflang="en">🌍 EN</a>
<a href="https://quixzoom.de/" hreflang="de">🇩🇪 DE</a>
<a href="https://quixzoom.co.uk/" hreflang="en-gb">🇬🇧 UK</a>
<a href="https://quixzoom.eu/" hreflang="en-eu">🇪🇺 EU</a>
</div>
</div>
<div class="footer-col">
<h4>Zoomers</h4>
<ul>
<li><a href="#how-it-works">Comment ça marche</a></li>
<li><a href="#missions">Types de missions</a></li>
<li><a href="#earnings">Revenus</a></li>
<li><a href="https://app.quixzoom.com/auth">Inscription gratuite</a></li>
</ul>
</div>
<div class="footer-col">
<h4>Légal</h4>
<ul>
<li><a href="https://quixzoom.com/privacy">Politique de confidentialité</a></li>
<li><a href="https://quixzoom.com/terms">Conditions d'utilisation</a></li>
</ul>
</div>
<div class="footer-col">
<h4>Contact</h4>
<ul>
<li><a href="mailto:enterprise@quixzoom.com">Enterprise</a></li>
<li><a href="mailto:hello@quixzoom.com">hello@quixzoom.com</a></li>
</ul>
</div>
</div>
<div class="footer-bottom">
<p class="footer-copy">© 2026 quiXzoom AB. Tous droits réservés.</p>
<p class="footer-aamos">Fait partie de <a href="https://landvex.com">LandveX</a> &nbsp;·&nbsp; <a href="mailto:hello@quixzoom.com">hello@quixzoom.com</a></p>
</div>
</div>
</footer>
</body>
</html>
@@ -0,0 +1,551 @@
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>quiXzoom — Photographiez. Soyez payé. | Devenez Zoomer</title>
<meta name="description" content="Devenez Zoomer : prenez des missions photo près de chez vous et gagnez de l'argent. Inscription gratuite. Lancement le 1er août 2026.">
<meta name="robots" content="index, follow">
<meta name="theme-color" content="#0a0a0a">
<meta name="author" content="quiXzoom AB">
<link rel="canonical" href="https://quixzoom.fr/">
<link rel="alternate" hreflang="fr" href="https://quixzoom.fr/">
<link rel="alternate" hreflang="en" href="https://www.quixzoom.com/">
<link rel="alternate" hreflang="de" href="https://quixzoom.de/">
<link rel="alternate" hreflang="en-gb" href="https://quixzoom.co.uk/">
<link rel="alternate" hreflang="x-default" href="https://www.quixzoom.com/">
<meta property="og:type" content="website">
<meta property="og:site_name" content="quiXzoom">
<meta property="og:title" content="quiXzoom — Photographiez. Soyez payé. | Devenez Zoomer">
<meta property="og:description" content="Devenez Zoomer : prenez des missions photo près de chez vous et gagnez de l'argent. Inscription gratuite. Lancement le 1er août 2026.">
<meta property="og:url" content="https://quixzoom.fr/">
<meta property="og:locale" content="fr_FR">
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:site" content="@quixzoom">
<style>
:root{--qx-black:#0a0a0a;--qx-white:#FFFFFF;--qx-blue:#0066FF;--qx-blue-light:#E8F0FF;--qx-blue-dark:#0052CC;--qx-green:#00C853;--qx-gray:#F5F5F7;--qx-gray-dark:#86868b;--qx-border:#D2D2D7;--qx-text:#1d1d1f;--qx-footer:#1a1a1a;--qx-radius:12px;--qx-radius-lg:20px;--qx-shadow:0 2px 20px rgba(0,0,0,.08);--qx-shadow-lg:0 8px 40px rgba(0,0,0,.14);--font:-apple-system,BlinkMacSystemFont,'SF Pro Display','Helvetica Neue',Arial,sans-serif}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:var(--font);background:var(--qx-white);color:var(--qx-text);line-height:1.6;font-size:16px;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
img{max-width:100%;height:auto;display:block}
.container{max-width:1100px;margin:0 auto;padding:0 24px}
#nav{position:sticky;top:0;z-index:200;background:rgba(10,10,10,.90);backdrop-filter:saturate(180%) blur(24px);-webkit-backdrop-filter:saturate(180%) blur(24px);border-bottom:1px solid rgba(255,255,255,.07)}
.nav-inner{display:flex;align-items:center;justify-content:space-between;height:58px;max-width:1100px;margin:0 auto;padding:0 24px;gap:16px}
.nav-logo{font-size:1.3rem;font-weight:800;color:var(--qx-white);letter-spacing:-.03em;flex-shrink:0}
.nav-logo .x{color:var(--qx-blue)}
.nav-links{display:flex;align-items:center;gap:4px;list-style:none}
.nav-links a{color:rgba(255,255,255,.78);font-size:.875rem;font-weight:500;padding:6px 10px;border-radius:8px;transition:color .15s,background .15s;white-space:nowrap}
.nav-links a:hover{color:var(--qx-white);background:rgba(255,255,255,.08)}
.nav-right{display:flex;align-items:center;gap:10px;flex-shrink:0}
.nav-cta{background:var(--qx-blue);color:var(--qx-white);padding:8px 20px;border-radius:20px;font-size:.875rem;font-weight:700;transition:opacity .15s,transform .15s;white-space:nowrap}
.nav-cta:hover{opacity:.88;transform:translateY(-1px)}
#nav-toggle{display:none}
.hamburger{display:none;flex-direction:column;gap:5px;cursor:pointer;padding:8px;border-radius:8px;background:rgba(255,255,255,.08);border:none;flex-shrink:0}
.hamburger span{display:block;width:20px;height:2px;background:rgba(255,255,255,.85);border-radius:2px;transition:transform .25s,opacity .25s}
#nav-toggle:checked ~ .nav-inner .hamburger span:nth-child(1){transform:translateY(7px) rotate(45deg)}
#nav-toggle:checked ~ .nav-inner .hamburger span:nth-child(2){opacity:0}
#nav-toggle:checked ~ .nav-inner .hamburger span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.mobile-menu{display:none;flex-direction:column;padding:12px 20px 20px;border-top:1px solid rgba(255,255,255,.07);gap:4px}
#nav-toggle:checked ~ .mobile-menu{display:flex}
.mobile-menu a{color:rgba(255,255,255,.85);font-size:1rem;font-weight:500;padding:10px 14px;border-radius:10px;transition:background .15s}
.mobile-menu a:hover{background:rgba(255,255,255,.08)}
.mobile-menu .m-cta{background:var(--qx-blue);color:var(--qx-white);font-weight:700;text-align:center;margin-top:8px;border-radius:20px}
#hero{background:var(--qx-black);color:var(--qx-white);padding:96px 24px 80px;text-align:center;position:relative;overflow:hidden}
#hero::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 80% 60% at 50% 0%,rgba(0,102,255,.18) 0%,transparent 70%);pointer-events:none}
.hero-badge{display:inline-flex;align-items:center;gap:8px;background:rgba(0,102,255,.15);color:#6699FF;border:1px solid rgba(0,102,255,.3);border-radius:24px;padding:7px 18px;font-size:.8125rem;font-weight:700;letter-spacing:.02em;margin-bottom:28px}
h1{font-size:clamp(2.25rem,5.5vw,4rem);font-weight:900;line-height:1.05;letter-spacing:-.04em;margin-bottom:24px}
h1 em{font-style:normal;color:var(--qx-blue)}
.hero-sub{font-size:clamp(1rem,2vw,1.25rem);color:rgba(255,255,255,.65);max-width:620px;margin:0 auto 36px;line-height:1.65}
.hero-ctas{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-bottom:20px}
.btn-primary{background:var(--qx-blue);color:var(--qx-white);padding:15px 36px;border-radius:28px;font-size:1.0625rem;font-weight:700;transition:transform .15s,opacity .15s,box-shadow .15s;display:inline-block;box-shadow:0 4px 24px rgba(0,102,255,.35)}
.btn-primary:hover{transform:translateY(-2px);opacity:.92;box-shadow:0 8px 32px rgba(0,102,255,.45)}
.btn-secondary{background:rgba(255,255,255,.08);color:var(--qx-white);padding:15px 36px;border-radius:28px;font-size:1.0625rem;font-weight:600;border:1px solid rgba(255,255,255,.18);transition:background .15s,transform .15s;display:inline-block}
.btn-secondary:hover{background:rgba(255,255,255,.15);transform:translateY(-2px)}
.trust-strip{display:flex;align-items:center;justify-content:center;gap:16px;flex-wrap:wrap;margin-top:16px;color:rgba(255,255,255,.5);font-size:.8125rem;font-weight:500}
.trust-strip span{display:flex;align-items:center;gap:6px}
.trust-strip span::before{content:'✓';color:var(--qx-green);font-weight:700}
#stats{background:var(--qx-blue);color:var(--qx-white);padding:48px 24px}
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;max-width:960px;margin:0 auto;text-align:center}
.stat-value{font-size:clamp(1.75rem,3.5vw,2.75rem);font-weight:900;letter-spacing:-.03em;line-height:1}
.stat-label{font-size:.875rem;font-weight:500;opacity:.82;margin-top:6px}
section{padding:88px 24px}
.section-label{font-size:.75rem;font-weight:800;color:var(--qx-blue);text-transform:uppercase;letter-spacing:.1em;margin-bottom:10px}
.section-title{font-size:clamp(1.875rem,3.5vw,2.75rem);font-weight:900;letter-spacing:-.03em;line-height:1.1;margin-bottom:14px}
.section-sub{color:var(--qx-gray-dark);font-size:1.0625rem;max-width:600px;margin-bottom:52px;line-height:1.65}
.section-link{display:inline-flex;align-items:center;gap:6px;color:var(--qx-blue);font-size:.9375rem;font-weight:600;margin-top:32px;border-bottom:1.5px solid rgba(0,102,255,.25);padding-bottom:2px;transition:border-color .15s,gap .15s}
.section-link:hover{border-color:var(--qx-blue);gap:10px}
#how-it-works{background:var(--qx-white)}
.steps-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:28px}
.step-card{background:var(--qx-gray);border-radius:var(--qx-radius-lg);padding:36px 32px;position:relative;overflow:hidden;transition:transform .2s,box-shadow .2s;display:block;color:inherit}
.step-card:hover{transform:translateY(-4px);box-shadow:var(--qx-shadow-lg)}
.step-num{font-size:5rem;font-weight:900;color:var(--qx-blue);opacity:.1;position:absolute;top:12px;right:20px;line-height:1;pointer-events:none}
.step-icon{font-size:2.25rem;margin-bottom:18px}
.step-title{font-size:1.1875rem;font-weight:800;margin-bottom:10px;color:var(--qx-black)}
.step-desc{color:var(--qx-gray-dark);font-size:.9375rem;line-height:1.65;margin-bottom:16px}
.step-link{display:inline-flex;align-items:center;gap:5px;color:var(--qx-blue);font-size:.875rem;font-weight:700;transition:gap .15s}
.step-link:hover{gap:9px}
#missions{background:var(--qx-gray)}
.missions-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px}
.mission-card{background:var(--qx-white);border:1.5px solid var(--qx-border);border-radius:var(--qx-radius-lg);overflow:hidden;transition:transform .2s,box-shadow .2s,border-color .2s;cursor:pointer}
.mission-card:hover,.mission-card:focus-within{transform:translateY(-4px);box-shadow:var(--qx-shadow-lg);border-color:rgba(0,102,255,.3)}
.mission-header{padding:28px 28px 0}
.mission-icon{font-size:2rem;margin-bottom:12px}
.mission-title{font-size:1.125rem;font-weight:800;color:var(--qx-black);margin-bottom:6px}
.mission-pay{display:inline-block;background:var(--qx-blue-light);color:var(--qx-blue);font-size:.8125rem;font-weight:700;padding:4px 12px;border-radius:20px;margin-bottom:14px}
.mission-body{padding:0 28px 24px;color:var(--qx-gray-dark);font-size:.9375rem;line-height:1.6}
.mission-detail{background:var(--qx-blue-light);border-top:1px solid rgba(0,102,255,.1);padding:0;max-height:0;overflow:hidden;transition:max-height .35s ease,padding .35s ease}
.mission-card:focus-within .mission-detail,.mission-card:hover .mission-detail{max-height:200px;padding:16px 28px}
.mission-detail p{font-size:.875rem;color:var(--qx-blue-dark);line-height:1.6;margin-bottom:10px}
.mission-cta-link{display:inline-flex;align-items:center;gap:5px;color:var(--qx-blue);font-size:.875rem;font-weight:700;transition:gap .15s}
.mission-cta-link:hover{gap:9px}
#earnings{background:var(--qx-white)}
.earnings-intro{color:var(--qx-gray-dark);font-size:1.0625rem;max-width:600px;margin-bottom:44px;line-height:1.65}
.pricing-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px;margin-bottom:40px}
.pricing-card{border:2px solid var(--qx-border);border-radius:var(--qx-radius-lg);padding:36px 32px;position:relative;transition:transform .2s,box-shadow .2s;background:var(--qx-white)}
.pricing-card:hover{transform:translateY(-4px);box-shadow:var(--qx-shadow-lg)}
.pricing-card.featured{border-color:var(--qx-blue);box-shadow:0 4px 32px rgba(0,102,255,.15)}
.pricing-level{font-size:.8125rem;font-weight:700;color:var(--qx-gray-dark);text-transform:uppercase;letter-spacing:.08em;margin-bottom:8px}
.pricing-amount{font-size:clamp(1.75rem,3vw,2.5rem);font-weight:900;color:var(--qx-black);letter-spacing:-.03em;line-height:1;margin-bottom:6px}
.pricing-freq{color:var(--qx-gray-dark);font-size:.9375rem;margin-bottom:18px}
.pricing-desc{color:var(--qx-gray-dark);font-size:.9375rem;line-height:1.6;padding-top:18px;border-top:1px solid var(--qx-border)}
.payment-details{margin-top:36px}
.payment-details summary{cursor:pointer;font-size:1rem;font-weight:700;color:var(--qx-black);padding:18px 24px;background:var(--qx-gray);border-radius:var(--qx-radius);list-style:none;display:flex;align-items:center;justify-content:space-between;transition:background .15s}
.payment-details summary:hover{background:#eaeaec}
.payment-details summary::after{content:'';font-size:1.25rem;color:var(--qx-blue);transition:transform .25s}
.payment-details[open] summary::after{content:''}
.payment-details-body{padding:24px;background:var(--qx-gray);border-radius:0 0 var(--qx-radius) var(--qx-radius);margin-top:-4px}
.payment-details-body ul{list-style:none;display:flex;flex-direction:column;gap:12px}
.payment-details-body li{display:flex;gap:10px;color:var(--qx-gray-dark);font-size:.9375rem;line-height:1.5}
.payment-details-body li::before{content:'';color:var(--qx-blue);font-weight:700;flex-shrink:0}
.payment-details-body a{color:var(--qx-blue);font-weight:600;border-bottom:1px solid rgba(0,102,255,.2);transition:border-color .15s}
.payment-details-body a:hover{border-color:var(--qx-blue)}
#faq{background:var(--qx-gray)}
.faq-list{max-width:740px;display:flex;flex-direction:column;gap:10px}
.faq-list details{background:var(--qx-white);border-radius:var(--qx-radius);border:1px solid var(--qx-border);overflow:hidden;transition:box-shadow .2s}
.faq-list details[open]{box-shadow:var(--qx-shadow)}
.faq-list summary{cursor:pointer;padding:20px 24px;font-size:1rem;font-weight:700;color:var(--qx-black);list-style:none;display:flex;align-items:center;justify-content:space-between;gap:16px;transition:background .15s}
.faq-list summary:hover{background:#fafafa}
.faq-list summary::after{content:'+';font-size:1.375rem;font-weight:400;color:var(--qx-blue);flex-shrink:0;line-height:1;transition:transform .25s}
.faq-list details[open] summary::after{content:''}
.faq-list summary::-webkit-details-marker{display:none}
.faq-answer-body{padding:0 24px 20px;color:var(--qx-gray-dark);font-size:.9375rem;line-height:1.7}
.faq-answer-body a{color:var(--qx-blue);font-weight:600;border-bottom:1px solid rgba(0,102,255,.2);transition:border-color .15s}
.faq-answer-body a:hover{border-color:var(--qx-blue)}
.faq-contact{margin-top:28px;color:var(--qx-gray-dark);font-size:.9375rem}
.faq-contact a{color:var(--qx-blue);font-weight:600;border-bottom:1px solid rgba(0,102,255,.2)}
#app-cta{background:var(--qx-black);color:var(--qx-white);text-align:center;position:relative;overflow:hidden}
#app-cta::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 70% 50% at 50% 100%,rgba(0,102,255,.2),transparent 70%);pointer-events:none}
#app-cta .section-title{color:var(--qx-white);margin-bottom:14px}
.app-sub{font-size:1.125rem;color:rgba(255,255,255,.65);margin-bottom:40px;line-height:1.6}
.app-buttons{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;margin-bottom:24px}
.app-btn{display:flex;align-items:center;gap:12px;background:rgba(255,255,255,.08);border:1.5px solid rgba(255,255,255,.18);color:var(--qx-white);padding:14px 28px;border-radius:16px;font-size:1rem;font-weight:700;transition:background .15s,transform .15s,border-color .15s}
.app-btn:hover{background:rgba(255,255,255,.16);transform:translateY(-2px);border-color:rgba(255,255,255,.3)}
.app-btn-icon{font-size:1.75rem;line-height:1}
.app-btn-text{text-align:left;line-height:1.3}
.app-btn-text small{display:block;font-size:.75rem;font-weight:400;opacity:.7}
.app-trust{display:flex;align-items:center;justify-content:center;gap:20px;flex-wrap:wrap;color:rgba(255,255,255,.45);font-size:.8125rem;font-weight:500}
footer{background:var(--qx-footer);color:rgba(255,255,255,.6);padding:60px 24px 32px}
.footer-inner{max-width:1100px;margin:0 auto}
.footer-cols{display:grid;grid-template-columns:1.5fr repeat(3,1fr);gap:40px;margin-bottom:48px}
.footer-brand .brand-logo{font-size:1.4rem;font-weight:900;color:var(--qx-white);letter-spacing:-.03em;margin-bottom:8px}
.footer-brand .brand-logo .x{color:var(--qx-blue)}
.footer-brand .tagline{font-size:.875rem;color:rgba(255,255,255,.4);margin-bottom:20px;line-height:1.5}
.footer-lang{display:flex;flex-wrap:wrap;gap:6px}
.footer-lang a{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.1);color:rgba(255,255,255,.7);padding:5px 10px;border-radius:7px;font-size:.8125rem;font-weight:600;transition:background .15s,color .15s,border-color .15s}
.footer-lang a:hover{background:rgba(0,102,255,.25);color:var(--qx-white);border-color:rgba(0,102,255,.35)}
.footer-lang a.active{color:var(--qx-blue);border-color:rgba(0,102,255,.3);background:rgba(0,102,255,.12)}
.footer-col h4{font-size:.8125rem;font-weight:800;color:var(--qx-white);text-transform:uppercase;letter-spacing:.07em;margin-bottom:14px}
.footer-col ul{list-style:none;display:flex;flex-direction:column;gap:8px}
.footer-col a{font-size:.875rem;color:rgba(255,255,255,.5);transition:color .15s}
.footer-col a:hover{color:rgba(255,255,255,.9)}
.footer-bottom{border-top:1px solid rgba(255,255,255,.07);padding-top:24px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px}
.footer-copy{font-size:.8125rem;color:rgba(255,255,255,.3)}
.footer-aamos{font-size:.8125rem}
.footer-aamos a{color:rgba(255,255,255,.4);border-bottom:1px solid rgba(255,255,255,.15);padding-bottom:1px;transition:color .15s,border-color .15s}
.footer-aamos a:hover{color:rgba(255,255,255,.8);border-color:rgba(255,255,255,.4)}
@media(max-width:900px){.footer-cols{grid-template-columns:1fr 1fr;gap:28px}.footer-brand{grid-column:1/-1}.stats-grid{grid-template-columns:repeat(2,1fr)}.nav-links{display:none}.hamburger{display:flex}}
@media(max-width:600px){section{padding:64px 16px}.stats-grid{grid-template-columns:1fr 1fr;gap:24px}.footer-cols{grid-template-columns:1fr 1fr}.footer-brand{grid-column:1/-1}#hero{padding:72px 16px 64px}.app-buttons{flex-direction:column;align-items:center}.footer-bottom{flex-direction:column;text-align:center}}
@media(max-width:400px){.stats-grid{grid-template-columns:1fr}.footer-cols{grid-template-columns:1fr}}
html,body{overflow-x:hidden;-webkit-text-size-adjust:100%}
img,svg,video{max-width:100%}
@media(hover:none),(pointer:coarse){.mission-detail{max-height:none!important;padding:16px 28px!important}}
@media(max-width:480px){.nav-inner{padding:0 14px}#hero{padding:56px 14px 48px}h1{font-size:clamp(1.9rem,8vw,2.6rem)!important;line-height:1.08}.hero-sub{font-size:.95rem}.hero-badge{font-size:.75rem;padding:5px 12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:90vw}.btn-primary,.btn-secondary{padding:13px 24px;font-size:.95rem;width:100%;text-align:center}.hero-ctas{flex-direction:column;gap:10px}.trust-strip{gap:10px;font-size:.75rem;flex-direction:column;gap:6px;align-items:flex-start;padding:0 4px}#stats{padding:32px 14px}.stats-grid{grid-template-columns:1fr 1fr!important;gap:16px}.stat-value{font-size:1.75rem!important}section{padding:48px 14px}.section-title{font-size:clamp(1.5rem,6vw,2rem)!important}.section-sub{font-size:.95rem;margin-bottom:32px}.steps-grid{grid-template-columns:1fr!important;gap:16px}.missions-grid{grid-template-columns:1fr!important;gap:14px}.pricing-grid{grid-template-columns:1fr!important;gap:16px}.faq-list summary{padding:16px 18px;font-size:.95rem}.faq-answer-body{padding:0 18px 16px;font-size:.875rem}footer{padding:40px 14px 24px}.footer-cols{grid-template-columns:1fr 1fr!important;gap:24px}.footer-lang a{font-size:.75rem;padding:4px 8px}.container{padding-left:14px;padding-right:14px;box-sizing:border-box;width:100%}}
@media(max-width:360px){h1{font-size:1.75rem!important}.footer-cols{grid-template-columns:1fr!important}}
/* AI Images */
.hero-image-wrap{position:relative;width:100%;max-width:960px;margin:40px auto 0;border-radius:20px;overflow:hidden;box-shadow:0 20px 60px rgba(0,0,102,.4)}
.hero-image-wrap img{width:100%;height:auto;display:block}
.app-bg-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.18;pointer-events:none;z-index:0}
#app-cta{position:relative;overflow:hidden}
#app-cta .container{position:relative;z-index:1}
@media(max-width:480px){.hero-image-wrap{border-radius:12px;margin-top:28px}}
</style>
</head>
<body>
<input type="checkbox" id="nav-toggle" aria-hidden="true" style="display:none">
<nav id="nav" aria-label="Navigation principale">
<div class="nav-inner">
<a class="nav-logo" href="https://quixzoom.fr/">quiX<span class="x">zoom</span></a>
<ul class="nav-links" role="list">
<li><a href="#how-it-works">Comment ça marche</a></li>
<li><a href="#missions">Missions</a></li>
<li><a href="#earnings">Revenus</a></li>
<li><a href="#faq">FAQ</a></li>
</ul>
<div class="nav-right">
<a class="nav-cta" href="https://app.quixzoom.com/auth">Devenir Zoomer →</a>
<label class="hamburger" for="nav-toggle" aria-label="Menu" role="button">
<span></span><span></span><span></span>
</label>
</div>
</div>
<nav class="mobile-menu" aria-label="Menu mobile">
<a href="#how-it-works">Comment ça marche</a>
<a href="#missions">Missions</a>
<a href="#earnings">Revenus</a>
<a href="#faq">FAQ</a>
<a class="m-cta" href="https://app.quixzoom.com/auth">Devenir Zoomer →</a>
</nav>
</nav>
<main>
<section id="hero" aria-labelledby="hero-h1">
<div class="container">
<div class="hero-badge">🇫🇷 France · Lancement 2026</div>
<h1 id="hero-h1">Photographiez.<br><em>Soyez payé.</em></h1>
<p class="hero-sub">quiXzoom vous rémunère pour photographier des infrastructures près de chez vous. Vos horaires. Payé par mission approuvée.</p>
<div class="hero-ctas" id="waitlist-block">
<form id="waitlist-form" onsubmit="submitWaitlist(event)" style="width:100%;max-width:560px;margin:0 auto;">
<div style="display:flex;gap:12px;flex-wrap:wrap;justify-content:center;">
<input
type="email"
id="waitlist-email"
placeholder="Votre adresse e-mail"
required
autocomplete="email"
style="flex:1;min-width:220px;padding:16px 24px;font-size:1rem;border:2.5px solid #FFFFFF;border-radius:32px;background:#FFFFFF;color:#1d1d1f;outline:none;font-family:inherit;"
/>
<button
type="submit"
id="waitlist-btn"
style="background:#0066FF;color:#FFFFFF;border:none;border-radius:32px;padding:16px 36px;font-size:1.0625rem;font-weight:800;cursor:pointer;white-space:nowrap;font-family:inherit;"
>Rejoindre la liste →</button>
</div>
<div id="waitlist-success" style="display:none;margin-top:16px;color:#00C853;font-size:1rem;font-weight:600;">✓ Vous êtes sur la liste !</div>
<div id="waitlist-error" style="display:none;margin-top:16px;color:#FF453A;font-size:.9rem;">Something went wrong. Please try again.</div>
</form>
</div>
<div class="trust-strip">
<span>Inscription gratuite</span>
<span>Priorité aux premiers Zoomers</span>
<span>Payé par mission approuvée</span>
</div>
<div class="hero-image-wrap"><img src="https://www.quixzoom.com/images/hero_infrastructure.jpg" alt="Zoomer photographing infrastructure" width="960" height="540" loading="eager" decoding="async"></div>
</div>
</section>
<section id="stats" aria-label="Stats">
<div class="container">
<div class="stats-grid">
<div><div class="stat-value">~30 min</div><div class="stat-label">durée moyenne d'une mission</div></div>
<div><div class="stat-value">20+</div><div class="stat-label">pays au lancement</div></div>
<div><div class="stat-value">1er août</div><div class="stat-label">soft launch mondial 2026</div></div>
<div><div class="stat-value">100%</div><div class="stat-label">payé après validation</div></div>
</div>
</div>
</section>
<section id="how-it-works" aria-labelledby="how-h2">
<div class="container">
<p class="section-label">Comment ça marche</p>
<h2 id="how-h2" class="section-title">De l'app au paiement en trois étapes</h2>
<p class="section-sub">Aucune formation requise, aucun équipement spécial — juste votre smartphone et un peu de temps.</p>
<div class="steps-grid">
<a class="step-card" href="https://app.quixzoom.com/auth">
<div class="step-num" aria-hidden="true">1</div>
<div class="step-icon"><span style="font-size:2.25rem">📱</span></div>
<h3 class="step-title">Inscription gratuite</h3>
<p class="step-desc">Inscrivez-vous en 5 minutes. Vérifiez votre identité avec une pièce d'identité et un selfie. Disponible dans tous les pays.</p>
<span class="step-link">Commencer →</span>
</a>
<a class="step-card" href="#missions">
<div class="step-num" aria-hidden="true">2</div>
<div class="step-icon"><span style="font-size:2.25rem">🗺️</span></div>
<h3 class="step-title">Choisissez une mission</h3>
<p class="step-desc">Parcourez les missions disponibles près de chez vous. Filtrez par type, durée et rémunération.</p>
<span class="step-link">Voir les types de missions →</span>
</a>
<a class="step-card" href="#earnings">
<div class="step-num" aria-hidden="true">3</div>
<div class="step-icon"><span style="font-size:2.25rem">💶</span></div>
<h3 class="step-title">Photographiez et soyez payé</h3>
<p class="step-desc">Naviguez jusqu'au lieu, photographiez selon les specs, envoyez. Le paiement est déclenché dès l'approbation.</p>
<span class="step-link">Voir les revenus →</span>
</a>
</div>
</div>
</section>
<section id="missions" aria-labelledby="missions-h2">
<div class="container">
<p class="section-label">Missions</p>
<h2 id="missions-h2" class="section-title">Quels types de missions existent ?</h2>
<p class="section-sub">Six catégories. Toutes avec une rémunération transparente. Choisissez ce qui vous convient.</p>
<div class="missions-grid">
<article class="mission-card" tabindex="0">
<div class="mission-header">
<div class="mission-icon">🏗️</div>
<h3 class="mission-title">Inspection d'infrastructure</h3>
<span class="mission-pay">Payé par mission</span>
</div>
<div class="mission-body">Ponts, routes, canalisations, fondations. Les communes et agences gouvernementales paient pour des contrôles visuels réguliers.</div>
<div class="mission-detail"><p>Clients : communes, agences gouvernementales, exploitants d'infrastructure.</p><a class="mission-cta-link" href="https://app.quixzoom.com/auth">Rejoindre →</a></div>
</article>
<article class="mission-card" tabindex="0">
<div class="mission-header">
<div class="mission-icon">🏢</div>
<h3 class="mission-title">Visite immobilière</h3>
<span class="mission-pay">Payé par mission</span>
</div>
<div class="mission-body">Façades, toits, entrées, parkings. Les sociétés immobilières documentent en continu pour les assurances et la maintenance.</div>
<div class="mission-detail"><p>Clients : sociétés immobilières, bailleurs sociaux.</p><a class="mission-cta-link" href="https://app.quixzoom.com/auth">Rejoindre →</a></div>
</article>
<article class="mission-card" tabindex="0">
<div class="mission-header">
<div class="mission-icon">🌿</div>
<h3 class="mission-title">Nature et littoral</h3>
<span class="mission-pay">Payé par mission</span>
</div>
<div class="mission-body">Côtes, plages, voies navigables. Agences maritimes, organismes environnementaux, recherche. Parfait si vous êtes déjà dehors.</div>
<div class="mission-detail"><p>Clients : autorités maritimes, organismes environnementaux, instituts de recherche.</p><a class="mission-cta-link" href="https://app.quixzoom.com/auth">Rejoindre →</a></div>
</article>
<article class="mission-card" tabindex="0">
<div class="mission-header">
<div class="mission-icon"></div>
<h3 class="mission-title">Documentation des sinistres</h3>
<span class="mission-pay">Payé par mission</span>
</div>
<div class="mission-body">Dommages causés par les tempêtes, inondations, vandalismes. Compagnies d'assurance. Les missions les plus rapides sont les mieux payées.</div>
<div class="mission-detail"><p>Clients : grandes compagnies et assureurs locaux. Déclenché automatiquement par les événements météorologiques.</p><a class="mission-cta-link" href="https://app.quixzoom.com/auth">Rejoindre →</a></div>
</article>
<article class="mission-card" tabindex="0">
<div class="mission-header">
<div class="mission-icon">📍</div>
<h3 class="mission-title">Géo-vérification</h3>
<span class="mission-pay">Payé par mission</span>
</div>
<div class="mission-body">Confirmer qu'un bien existe et correspond à ce qui est attendu. E-commerce, banques, agences immobilières. Simple et rapide.</div>
<div class="mission-detail"><p>Clients : e-commerce, finance, logistique. Missions courtes — généralement 10 à 15 minutes.</p><a class="mission-cta-link" href="https://app.quixzoom.com/auth">Rejoindre →</a></div>
</article>
<article class="mission-card" tabindex="0">
<div class="mission-header">
<div class="mission-icon">🏙️</div>
<h3 class="mission-title">Environnement urbain</h3>
<span class="mission-pay">Payé par mission</span>
</div>
<div class="mission-body">État des rues, signalisation, accessibilité. Communes, enseignes commerciales, urbanisme. Parfait dans votre quartier.</div>
<div class="mission-detail"><p>Clients : communes, chaînes de distribution, urbanistes.</p><a class="mission-cta-link" href="https://app.quixzoom.com/auth">Rejoindre →</a></div>
</article>
</div>
<a class="section-link" href="https://app.quixzoom.com/auth">Rejoindre →</a>
</div>
</section>
<section id="earnings" aria-labelledby="earnings-h2">
<div class="container">
<p class="section-label">Revenus</p>
<h2 id="earnings-h2" class="section-title">Combien gagnez-vous ?</h2>
<p class="earnings-intro">Chaque mission approuvée vous rapporte un paiement direct. Plus vous complétez de missions, plus vous gagnez.</p>
<div class="pricing-grid">
<div class="pricing-card">
<div class="pricing-level">Temps partiel</div>
<div class="pricing-amount">Revenu complémentaire</div>
<div class="pricing-freq">24 missions par semaine</div>
<div class="pricing-desc">Idéal en complément des études ou d'un emploi à temps partiel. Horaires flexibles, aucun engagement.</div>
</div>
<div class="pricing-card featured">
<div class="pricing-level">Actif</div>
<div class="pricing-amount">Revenu régulier</div>
<div class="pricing-freq">812 missions par semaine</div>
<div class="pricing-desc">Source de revenus principale pour de nombreux Zoomers. Améliorez rapidement votre note — accédez aux missions premium.</div>
</div>
<div class="pricing-card">
<div class="pricing-level">Pro</div>
<div class="pricing-amount">Revenu maximum</div>
<div class="pricing-freq">15+ missions par semaine</div>
<div class="pricing-desc">Les Zoomers expérimentés avec une haute note bénéficient d'un accès prioritaire aux missions premium et aux bonus.</div>
</div>
</div>
<details class="payment-details">
<summary>Paiement &amp; impôts — comment ça fonctionne ?</summary>
<div class="payment-details-body">
<ul>
<li>Payé via Stripe Connect après chaque mission approuvée</li>
<li>Aucuns frais cachés. Le montant affiché dans l'app est celui que vous recevez.</li>
<li>Vous êtes responsable de votre propre déclaration fiscale conformément aux règles en vigueur dans votre pays.</li>
<li><a href="#faq">Questions fréquentes →</a></li>
</ul>
</div>
</details>
<div style="margin-top:36px">
<a class="btn-primary" href="https://app.quixzoom.com/auth">Devenir Zoomer →</a>
</div>
</div>
</section>
<section id="faq" aria-labelledby="faq-h2">
<div class="container">
<p class="section-label">FAQ</p>
<h2 id="faq-h2" class="section-title">Questions fréquentes</h2>
<div class="faq-list">
<details>
<summary>Ai-je besoin d'un appareil photo professionnel ?</summary>
<div class="faq-answer-body">Non. Votre smartphone suffit. Nous acceptons les photos d'iPhone 12+ et de smartphones Android avec 12 MP+. Aucun équipement spécial n'est requis.</div>
</details>
<details>
<summary>Comment et quand suis-je payé ?</summary>
<div class="faq-answer-body">Le paiement est traité après chaque mission approuvée via Stripe Connect, directement sur votre compte bancaire. Vous devez vérifier votre identité une seule fois — passeport, carte d'identité nationale ou permis de conduire. Cela prend environ 2 minutes. Fonctionne depuis tous les pays.</div>
</details>
<details>
<summary>Quelles missions sont disponibles dans ma région ?</summary>
<div class="faq-answer-body">Inscrivez-vous pour voir les missions actives sur votre carte. Nous lançons mondialement le 1er août 2026. Enregistrez-vous maintenant et choisissez votre région.</div>
</details>
<details>
<summary>Ces revenus sont-ils imposables ?</summary>
<div class="faq-answer-body">Oui. Les revenus de quiXzoom sont imposables. Vous êtes responsable de votre propre déclaration fiscale conformément aux règles applicables dans votre pays.</div>
</details>
<details>
<summary>Comment fonctionne la vérification d'identité ?</summary>
<div class="faq-answer-body">Une photo d'un document d'identité (passeport, carte nationale d'identité ou permis de conduire) et un selfie. L'IA compare immédiatement votre visage au document. Requis une seule fois. Fonctionne depuis tous les pays.</div>
</details>
</div>
<p class="faq-contact">Vous avez encore des questions ? Écrivez-nous à <a href="mailto:hello@quixzoom.com">hello@quixzoom.com</a></p>
</div>
</section>
<section id="app-cta" aria-labelledby="cta-h2">
<div class="container" style="padding-top:88px;padding-bottom:88px">
<h2 id="cta-h2" class="section-title">Prêt à commencer ?</h2>
<p class="app-sub">Rejoignez la première vague de Zoomers. Inscription gratuite. Sans engagement.</p>
<div class="app-buttons">
<form id="waitlist-form-bottom" onsubmit="submitWaitlist(event,'bottom')" style="width:100%;max-width:520px;margin:0 auto;">
<div style="display:flex;gap:12px;flex-wrap:wrap;justify-content:center;">
<input
type="email"
id="waitlist-email-bottom"
placeholder="Votre adresse e-mail"
required
autocomplete="email"
style="flex:1;min-width:200px;padding:16px 24px;font-size:1rem;border:2.5px solid rgba(255,255,255,0.6);border-radius:32px;background:rgba(255,255,255,0.12);color:#FFFFFF;outline:none;font-family:inherit;"
/>
<button
type="submit"
id="waitlist-btn-bottom"
style="background:#0066FF;color:#FFFFFF;border:none;border-radius:32px;padding:16px 36px;font-size:1.0625rem;font-weight:800;cursor:pointer;white-space:nowrap;font-family:inherit;"
>Rejoindre la liste →</button>
</div>
<div id="waitlist-success-bottom" style="display:none;margin-top:16px;color:#00C853;font-size:1rem;font-weight:600;">✓ Vous êtes sur la liste !</div>
</form>
</div>
<div class="app-trust">
<span>Inscription gratuite</span>
<span>Priorité aux premiers Zoomers</span>
<span>Payé par mission approuvée</span>
</div>
</div>
</section>
</main>
<footer>
<div class="footer-inner">
<div class="footer-cols">
<div class="footer-brand">
<div class="brand-logo">quiX<span class="x">zoom</span></div>
<p class="tagline">Photographiez. Soyez payé.</p>
<div class="footer-lang">
<a href="https://quixzoom.fr/" hreflang="fr" class="active">🇫🇷 FR</a>
<a href="https://www.quixzoom.com/" hreflang="en">🌍 EN</a>
<a href="https://quixzoom.de/" hreflang="de">🇩🇪 DE</a>
<a href="https://quixzoom.co.uk/" hreflang="en-gb">🇬🇧 UK</a>
<a href="https://quixzoom.eu/" hreflang="en-eu">🇪🇺 EU</a>
</div>
</div>
<div class="footer-col">
<h4>Zoomers</h4>
<ul>
<li><a href="#how-it-works">Comment ça marche</a></li>
<li><a href="#missions">Types de missions</a></li>
<li><a href="#earnings">Revenus</a></li>
<li><a href="https://app.quixzoom.com/auth">Inscription gratuite</a></li>
</ul>
</div>
<div class="footer-col">
<h4>Légal</h4>
<ul>
<li><a href="https://quixzoom.com/privacy">Politique de confidentialité</a></li>
<li><a href="https://quixzoom.com/terms">Conditions d'utilisation</a></li>
</ul>
</div>
<div class="footer-col">
<h4>Contact</h4>
<ul>
<li><a href="mailto:enterprise@quixzoom.com">Enterprise</a></li>
<li><a href="mailto:hello@quixzoom.com">hello@quixzoom.com</a></li>
</ul>
</div>
</div>
<div class="footer-bottom">
<p class="footer-copy">© 2026 quiXzoom AB. Tous droits réservés.</p>
<p class="footer-aamos">Fait partie de <a href="https://landvex.com">LandveX</a> &nbsp;·&nbsp; <a href="mailto:hello@quixzoom.com">hello@quixzoom.com</a></p>
</div>
</div>
</footer>
<script>
async function submitWaitlist(e, variant) {
e.preventDefault();
const sfx = variant === 'bottom' ? '-bottom' : '';
const btn = document.getElementById('waitlist-btn' + sfx);
const input = document.getElementById('waitlist-email' + sfx);
const successEl = document.getElementById('waitlist-success' + sfx);
const errorEl = document.getElementById('waitlist-error' + sfx);
const email = input.value.trim();
if (!email) return;
btn.disabled = true;
btn.textContent = '⏳';
if (errorEl) errorEl.style.display = 'none';
try {
const res = await fetch('https://api.quixzoom.com/api/qz/waitlist', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({
email,
country: (navigator.language || 'en').split('-')[1] || '',
lang: (navigator.language || 'en').split('-')[0],
source: window.location.hostname
})
});
const data = await res.json();
if (res.ok && data.ok) {
input.style.display = 'none';
btn.style.display = 'none';
successEl.style.display = 'block';
} else {
throw new Error(data.error || 'error');
}
} catch(err) {
btn.disabled = false;
btn.textContent = 'Join the waitlist →';
if (errorEl) errorEl.style.display = 'block';
}
}
</script>
</body>
</html>
@@ -0,0 +1,2218 @@
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="color-scheme" content="light">
<title>quiXzoom — Capturez le monde. Soyez payé. | Devenir Zoomer</title>
<meta name="description" content="quiXzoom vous paie pour photographier les infrastructures, la nature et les environnements urbains près de chez vous. Gratuit. Lancement 1er août 2026.">
<meta name="keywords" content="zoomer, earn money photos, photo missions, field data collection, crowdsourcing, side income, infrastructure photography">
<link rel="canonical" href="https://www.quixzoom.com/">
<link rel="icon" type="image/svg+xml" href="https://www.quixzoom.com/favicon.svg">
<link rel="icon" type="image/x-icon" href="https://www.quixzoom.com/favicon.ico">
<!-- hreflang -->
<link rel="alternate" hreflang="sv" href="https://www.quixzoom.com/markets/se/">
<link rel="alternate" hreflang="de" href="https://www.quixzoom.com/markets/">
<link rel="alternate" hreflang="fr" href="https://quixzoom.fr/">
<link rel="alternate" hreflang="nl" href="https://www.quixzoom.com/markets/nl/">
<link rel="alternate" hreflang="en-gb" href="https://www.quixzoom.com/markets/en/">
<link rel="alternate" hreflang="it" href="https://www.quixzoom.com/markets/">
<link rel="alternate" hreflang="es" href="https://www.quixzoom.com/markets/">
<link rel="alternate" hreflang="fi" href="https://www.quixzoom.com/markets/">
<link rel="alternate" hreflang="da" href="https://www.quixzoom.com/markets/">
<link rel="alternate" hreflang="en-eu" href="https://quixzoom.eu/">
<link rel="alternate" hreflang="x-default" href="https://www.quixzoom.com/">
<!-- Open Graph -->
<meta property="og:type" content="website">
<meta property="og:title" content="quiXzoom — Capturez le monde. Soyez payé.">
<meta property="og:description" content="quiXzoom is a platform for crowdsourced field data collection. Photograph infrastructure and urban environments near you. Paid per approved mission.">
<meta property="og:url" content="https://quixzoom.fr/">
<meta property="og:image" content="https://www.quixzoom.com/images/hero_infrastructure.jpg">
<!-- Twitter -->
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:site" content="@quixzoom">
<!-- Theme -->
<meta name="theme-color" content="#0a0a0a">
<!-- Preconnect -->
<link rel="preconnect" href="https://api.quixzoom.com">
<!-- Schema.org JSON-LD -->
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@graph": [
{
"@type": "Organization",
"@id": "https://www.quixzoom.com/#organization",
"name": "quiXzoom",
"url": "https://www.quixzoom.com/",
"logo": "https://www.quixzoom.com/images/logo.png",
"email": "www.quixzoom.com/support",
"sameAs": [
"https://twitter.com/quixzoom"
],
"description": "quiXzoom is a crowdsourced field data collection platform that pays Zoomers to photograph infrastructure, real estate, coastlines and urban environments."
},
{
"@type": "SoftwareApplication",
"@id": "https://www.quixzoom.com/#app",
"name": "quiXzoom",
"applicationCategory": "LifestyleApplication",
"operatingSystem": "iOS, Android",
"offers": {
"@type": "Offer",
"price": "0",
"priceCurrency": "USD"
},
"description": "Earn money photographing infrastructure, nature and urban environments near you.",
"publisher": {
"@id": "https://www.quixzoom.com/#organization"
}
},
{
"@type": "FAQPage",
"@id": "https://www.quixzoom.com/#faq",
"mainEntity": [
{
"@type": "Question",
"name": "Do I need a professional camera?",
"acceptedAnswer": {
"@type": "Answer",
"text": "No. iPhone 12 or later, or any Android with a 12MP or better camera, is all you need."
}
},
{
"@type": "Question",
"name": "How and when do I get paid?",
"acceptedAnswer": {
"@type": "Answer",
"text": "You're paid via Stripe Connect after each approved mission. A one-time identity verification is required to receive payouts."
}
},
{
"@type": "Question",
"name": "What missions are available in my area?",
"acceptedAnswer": {
"@type": "Answer",
"text": "Sign up for the waitlist to be notified. You'll be able to browse live missions on the map from August 1, 2026."
}
},
{
"@type": "Question",
"name": "Is this taxable income?",
"acceptedAnswer": {
"@type": "Answer",
"text": "Yes. Mission earnings are income and must be reported according to your country's tax regulations. quiXzoom does not withhold taxes."
}
},
{
"@type": "Question",
"name": "How quickly is my photo approved?",
"acceptedAnswer": {
"@type": "Answer",
"text": "Most missions are reviewed within a few hours. If a submission is not approved, you will always see the reason and can supplement or appeal within 48 hours."
}
},
{
"@type": "Question",
"name": "Can I work part-time?",
"acceptedAnswer": {
"@type": "Answer",
"text": "Absolutely. There are no minimum hours, no fixed schedule, and no commitment. Work when you want, as much as you want."
}
}
]
}
]
}
</script>
<style>
/* ===================================================
DESIGN TOKENS
=================================================== */
:root {
--bg-dark: #0a0a0a;
--bg-white: #FFFFFF;
--bg-off: #F7F7F5;
--blue: #0066FF;
--blue-dark: #0052CC;
--green: #00C853;
--text-dark: #0a0a0a;
--text-body: #3a3a3a;
--text-muted: #6B6B6B;
--white: #FFFFFF;
--radius-pill: 32px;
--radius-card: 16px;
--shadow-card: 0 4px 24px rgba(0,0,0,0.07);
--shadow-hover: 0 12px 40px rgba(0,0,0,0.12);
--transition: 0.22s cubic-bezier(0.25,0.46,0.45,0.94);
}
/* ===================================================
RESET & BASE
=================================================== */
*, *::before, *::after {
box-sizing: border-box;
margin: 0;
padding: 0;
}
html {
scroll-behavior: smooth;
-webkit-text-size-adjust: 100%;
font-size: 16px;
}
body {
font-family: -apple-system, BlinkMacSystemFont, 'Inter', 'Helvetica Neue', Arial, sans-serif;
font-size: 1rem;
line-height: 1.65;
color: var(--text-body);
background: var(--bg-white);
overflow-x: hidden;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
img { max-width: 100%; height: auto; }
a { color: inherit; text-decoration: none; }
ul { list-style: none; }
button { cursor: pointer; font-family: inherit; }
/* ===================================================
TYPOGRAPHY
=================================================== */
h1 {
font-size: clamp(2.75rem, 6vw, 5rem);
font-weight: 900;
letter-spacing: -0.05em;
line-height: 1.0;
}
h2 {
font-size: clamp(2rem, 3.5vw, 3rem);
font-weight: 800;
letter-spacing: -0.04em;
line-height: 1.1;
}
h3 {
font-size: 1.25rem;
font-weight: 700;
letter-spacing: -0.02em;
line-height: 1.3;
}
/* ===================================================
BUTTONS
=================================================== */
.btn-primary {
display: inline-flex;
align-items: center;
justify-content: center;
background: var(--blue);
color: var(--white);
border: none;
border-radius: var(--radius-pill);
padding: 18px 48px;
font-size: 1.125rem;
font-weight: 800;
line-height: 1;
cursor: pointer;
transition: background var(--transition), transform var(--transition), box-shadow var(--transition);
white-space: nowrap;
text-decoration: none;
}
.btn-primary:hover, .btn-primary:focus-visible {
background: var(--blue-dark);
transform: translateY(-1px);
box-shadow: 0 8px 24px rgba(0,102,255,0.35);
outline: none;
}
.btn-primary:active {
transform: translateY(0);
}
.btn-primary:disabled {
opacity: 0.7;
cursor: not-allowed;
transform: none;
}
.btn-ghost {
display: inline-flex;
align-items: center;
justify-content: center;
background: transparent;
color: var(--white);
border: 2px solid rgba(255,255,255,0.5);
border-radius: var(--radius-pill);
padding: 16px 46px;
font-size: 1rem;
font-weight: 700;
line-height: 1;
cursor: pointer;
transition: border-color var(--transition), background var(--transition), transform var(--transition);
white-space: nowrap;
text-decoration: none;
}
.btn-ghost:hover, .btn-ghost:focus-visible {
border-color: rgba(255,255,255,0.85);
background: rgba(255,255,255,0.07);
transform: translateY(-1px);
outline: none;
}
.btn-nav {
display: inline-flex;
align-items: center;
justify-content: center;
background: var(--blue);
color: var(--white);
border: none;
border-radius: 24px;
padding: 10px 24px;
font-size: 0.9375rem;
font-weight: 700;
line-height: 1;
cursor: pointer;
transition: background var(--transition), transform var(--transition);
text-decoration: none;
white-space: nowrap;
}
.btn-nav:hover, .btn-nav:focus-visible {
background: var(--blue-dark);
transform: translateY(-1px);
outline: none;
}
/* ===================================================
LAYOUT HELPERS
=================================================== */
.container {
width: 100%;
max-width: 1160px;
margin: 0 auto;
padding: 0 24px;
}
.section-pad {
padding: 96px 0;
}
.section-pad-sm {
padding: 72px 0;
}
/* ===================================================
NAV
=================================================== */
#nav-toggle {
display: none;
}
nav {
position: sticky;
top: 0;
z-index: 1000;
background: var(--bg-dark);
border-bottom: 1px solid rgba(255,255,255,0.06);
padding: 0;
}
.nav-inner {
display: flex;
align-items: center;
justify-content: space-between;
height: 68px;
gap: 32px;
}
.nav-logo {
font-size: 1.375rem;
font-weight: 900;
color: var(--white);
letter-spacing: -0.04em;
text-decoration: none;
flex-shrink: 0;
}
.nav-logo .x {
color: var(--blue);
}
.nav-links {
display: flex;
align-items: center;
gap: 32px;
flex: 1;
justify-content: center;
}
.nav-links a {
color: rgba(255,255,255,0.75);
font-size: 0.9375rem;
font-weight: 500;
text-decoration: none;
transition: color var(--transition);
white-space: nowrap;
}
.nav-links a:hover {
color: var(--white);
}
.nav-cta {
flex-shrink: 0;
}
.nav-hamburger-label {
display: none;
flex-direction: column;
justify-content: center;
align-items: center;
width: 40px;
height: 40px;
cursor: pointer;
gap: 5px;
flex-shrink: 0;
}
.nav-hamburger-label span {
display: block;
width: 24px;
height: 2px;
background: var(--white);
border-radius: 2px;
transition: transform var(--transition), opacity var(--transition);
}
/* Mobile nav */
.nav-mobile-overlay {
display: none;
}
@media (max-width: 768px) {
.nav-links {
display: none;
position: fixed;
top: 68px;
left: 0;
right: 0;
background: var(--bg-dark);
flex-direction: column;
align-items: flex-start;
gap: 0;
padding: 16px 0 24px;
border-bottom: 1px solid rgba(255,255,255,0.08);
z-index: 999;
}
.nav-links a {
display: block;
padding: 14px 24px;
width: 100%;
font-size: 1rem;
}
.nav-cta {
display: none;
}
.nav-hamburger-label {
display: flex;
}
#nav-toggle:checked ~ nav .nav-links {
display: flex;
}
#nav-toggle:checked ~ nav .nav-hamburger-label span:nth-child(1) {
transform: translateY(7px) rotate(45deg);
}
#nav-toggle:checked ~ nav .nav-hamburger-label span:nth-child(2) {
opacity: 0;
}
#nav-toggle:checked ~ nav .nav-hamburger-label span:nth-child(3) {
transform: translateY(-7px) rotate(-45deg);
}
}
/* ===================================================
HERO
=================================================== */
#hero {
background: var(--bg-dark);
min-height: calc(100vh - 68px);
display: flex;
align-items: center;
padding: 80px 0 96px;
}
.hero-inner {
max-width: 860px;
}
.hero-badge {
display: inline-flex;
align-items: center;
gap: 8px;
background: rgba(255,255,255,0.07);
border: 1px solid rgba(255,255,255,0.12);
border-radius: 100px;
padding: 8px 18px;
font-size: 0.875rem;
font-weight: 600;
color: rgba(255,255,255,0.88);
margin-bottom: 36px;
letter-spacing: 0.01em;
}
.hero-h1 {
color: var(--white);
margin-bottom: 28px;
}
.hero-h1 em {
font-style: normal;
color: var(--blue);
}
.hero-sub {
font-size: clamp(1.0625rem, 2vw, 1.25rem);
color: rgba(255,255,255,0.82);
max-width: 640px;
line-height: 1.6;
margin-bottom: 44px;
}
/* Waitlist form */
.wl-row {
display: flex;
align-items: center;
gap: 12px;
flex-wrap: nowrap;
margin-bottom: 20px;
}
.wl-input {
flex: 1;
min-width: 280px;
background: var(--white);
color: var(--text-dark);
border: 2.5px solid var(--white);
border-radius: var(--radius-pill);
padding: 18px 28px;
font-size: 1.0625rem;
font-family: inherit;
outline: none;
transition: border-color var(--transition), box-shadow var(--transition);
}
.wl-input::placeholder {
color: rgba(10,10,10,0.45);
}
.wl-input:focus {
border-color: var(--blue);
box-shadow: 0 0 0 3px rgba(0,102,255,0.18);
}
.wl-submit {
background: var(--blue);
color: var(--white);
border: none;
border-radius: var(--radius-pill);
padding: 18px 36px;
font-size: 1rem;
font-weight: 800;
font-family: inherit;
cursor: pointer;
transition: background var(--transition), transform var(--transition), box-shadow var(--transition);
white-space: nowrap;
flex-shrink: 0;
}
.wl-submit:hover, .wl-submit:focus-visible {
background: var(--blue-dark);
transform: translateY(-1px);
box-shadow: 0 8px 24px rgba(0,102,255,0.35);
outline: none;
}
.wl-submit:disabled {
opacity: 0.7;
cursor: not-allowed;
transform: none;
}
.wl-trust {
display: flex;
align-items: center;
gap: 20px;
flex-wrap: wrap;
margin-bottom: 28px;
}
.wl-trust span {
font-size: 0.875rem;
color: rgba(255,255,255,0.7);
font-weight: 500;
}
.wl-trust .check {
color: var(--green);
font-weight: 700;
}
.wl-counter {
font-size: 0.9375rem;
color: rgba(255,255,255,0.6);
}
.wl-counter strong {
color: var(--white);
font-weight: 700;
}
.wl-ok {
display: flex;
align-items: center;
gap: 12px;
padding: 18px 28px;
background: rgba(0,200,83,0.12);
border: 1.5px solid rgba(0,200,83,0.4);
border-radius: var(--radius-pill);
color: var(--green);
font-weight: 700;
font-size: 1rem;
margin-bottom: 20px;
}
.wl-ok svg {
flex-shrink: 0;
}
.wl-err {
color: #FF4444;
font-size: 0.9rem;
font-weight: 600;
margin-bottom: 12px;
padding: 0 4px;
}
/* Bottom form on dark */
#hero-bottom .wl-trust span {
color: rgba(255,255,255,0.7);
}
@media (max-width: 600px) {
.wl-row {
flex-direction: column;
align-items: stretch;
}
.wl-input {
min-width: 0;
width: 100%;
}
.wl-submit {
width: 100%;
padding: 18px 28px;
}
}
/* ===================================================
STATS BAND
=================================================== */
#stats {
background: var(--blue);
padding: 56px 0;
}
.stats-grid {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 0;
}
.stat-item {
text-align: center;
padding: 20px 16px;
position: relative;
}
.stat-item:not(:last-child)::after {
content: '';
position: absolute;
right: 0;
top: 20%;
height: 60%;
width: 1px;
background: rgba(255,255,255,0.25);
}
.stat-value {
font-size: clamp(2rem, 4vw, 3rem);
font-weight: 900;
color: var(--white);
letter-spacing: -0.04em;
line-height: 1;
display: block;
margin-bottom: 8px;
}
.stat-label {
font-size: 0.9rem;
color: rgba(255,255,255,0.82);
font-weight: 500;
letter-spacing: 0.01em;
}
@media (max-width: 600px) {
.stats-grid {
grid-template-columns: repeat(2, 1fr);
gap: 1px;
background: rgba(255,255,255,0.15);
}
.stat-item {
background: var(--blue);
}
.stat-item::after {
display: none;
}
}
/* ===================================================
HOW IT WORKS
=================================================== */
#how {
background: var(--bg-white);
}
.section-overline { font-size: 0.75rem; font-weight: 700; color: var(--blue); text-transform: uppercase; letter-spacing: 0.1em; margin-bottom: 10px; }
.section-header {
text-align: center;
margin-bottom: 64px;
}
.section-header h2 {
color: var(--text-dark);
margin-bottom: 16px;
}
.section-header p {
font-size: 1.125rem;
color: var(--text-muted);
max-width: 580px;
margin: 0 auto;
}
.steps-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 28px;
}
.step-card {
background: var(--bg-off);
border-radius: var(--radius-card);
padding: 40px 36px;
position: relative;
}
.step-number {
display: inline-flex;
align-items: center;
justify-content: center;
width: 48px;
height: 48px;
background: var(--blue);
color: var(--white);
border-radius: 50%;
font-size: 1.25rem;
font-weight: 900;
margin-bottom: 24px;
letter-spacing: -0.03em;
}
.step-card h3 {
color: var(--text-dark);
margin-bottom: 12px;
font-size: 1.25rem;
}
.step-card p {
color: var(--text-muted);
font-size: 0.9625rem;
line-height: 1.6;
}
@media (max-width: 768px) {
.steps-grid {
grid-template-columns: 1fr;
gap: 20px;
}
.step-card {
padding: 32px 28px;
}
}
/* ===================================================
MISSION TYPES
=================================================== */
#missions {
background: var(--bg-off);
}
.missions-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 24px;
}
.mission-card {
background: var(--bg-white);
border: 1.5px solid #E8E8E8;
border-radius: var(--radius-card);
padding: 32px 28px;
transition: transform var(--transition), box-shadow var(--transition);
cursor: default;
}
.mission-card:hover {
transform: translateY(-4px);
box-shadow: var(--shadow-hover);
}
.mission-icon {
width: 52px;
height: 52px;
display: flex;
align-items: center;
justify-content: center;
background: var(--bg-off);
border-radius: 12px;
margin-bottom: 20px;
color: var(--blue);
}
.mission-icon svg {
width: 28px;
height: 28px;
}
.mission-card h3 {
color: var(--text-dark);
margin-bottom: 10px;
font-size: 1.125rem;
}
.mission-card p {
color: var(--text-muted);
font-size: 0.9rem;
line-height: 1.55;
margin-bottom: 18px;
}
.mission-chip {
display: inline-block;
background: rgba(0,102,255,0.08);
color: var(--blue);
border-radius: 100px;
padding: 5px 14px;
font-size: 0.8125rem;
font-weight: 700;
letter-spacing: 0.01em;
}
@media (max-width: 900px) {
.missions-grid {
grid-template-columns: repeat(2, 1fr);
}
}
@media (max-width: 560px) {
.missions-grid {
grid-template-columns: 1fr;
}
}
/* ===================================================
EARNINGS
=================================================== */
#earnings {
background: var(--bg-white);
}
.earnings-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 24px;
margin-bottom: 48px;
}
.tier-card {
background: var(--bg-off);
border: 2px solid #E8E8E8;
border-radius: var(--radius-card);
padding: 36px 28px;
text-align: center;
position: relative;
transition: transform var(--transition), box-shadow var(--transition);
}
.tier-card:hover {
transform: translateY(-4px);
box-shadow: var(--shadow-hover);
}
.tier-card.featured {
background: var(--bg-dark);
border-color: var(--blue);
transform: scale(1.03);
}
.tier-card.featured:hover {
transform: scale(1.03) translateY(-4px);
}
.tier-badge { display: none; }
.tier-card h3 {
font-size: 1.5rem;
font-weight: 900;
margin-bottom: 4px;
}
.tier-card.featured h3 {
color: var(--white);
}
.tier-missions {
font-size: 0.9rem;
color: var(--text-muted);
margin-bottom: 20px;
font-weight: 500;
}
.tier-card.featured .tier-missions {
color: rgba(255,255,255,0.65);
}
.tier-features {
text-align: left;
}
.tier-features li {
display: flex;
align-items: flex-start;
gap: 10px;
font-size: 0.9375rem;
color: var(--text-body);
padding: 6px 0;
}
.tier-card.featured .tier-features li {
color: rgba(255,255,255,0.85);
}
.tier-features li::before {
content: '';
display: block;
width: 18px;
height: 18px;
min-width: 18px;
background: var(--green);
border-radius: 50%;
margin-top: 2px;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='8' viewBox='0 0 10 8' fill='none'%3E%3Cpath d='M1 4l2.5 2.5L9 1' stroke='white' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
background-repeat: no-repeat;
background-position: center;
}
/* Payment accordion */
.payment-accordion {
border: 1.5px solid #E8E8E8;
border-radius: var(--radius-card);
overflow: hidden;
}
.payment-accordion summary {
display: flex;
align-items: center;
justify-content: space-between;
padding: 22px 28px;
font-size: 1rem;
font-weight: 700;
color: var(--text-dark);
cursor: pointer;
list-style: none;
user-select: none;
transition: background var(--transition);
}
.payment-accordion summary::-webkit-details-marker { display: none; }
.payment-accordion summary:hover {
background: var(--bg-off);
}
.payment-accordion summary::after {
content: '';
display: block;
width: 20px;
height: 20px;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236B6B6B' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
background-size: contain;
background-repeat: no-repeat;
transition: transform var(--transition);
flex-shrink: 0;
}
.payment-accordion[open] summary::after {
transform: rotate(180deg);
}
.payment-accordion-body {
padding: 0 28px 24px;
background: var(--bg-off);
}
.payment-accordion-body ul {
list-style: none;
}
.payment-accordion-body li {
display: flex;
align-items: flex-start;
gap: 12px;
padding: 10px 0;
font-size: 0.9625rem;
color: var(--text-body);
border-bottom: 1px solid #E8E8E8;
}
.payment-accordion-body li:last-child {
border-bottom: none;
}
.payment-accordion-body li .dot {
display: block;
width: 8px;
height: 8px;
min-width: 8px;
background: var(--blue);
border-radius: 50%;
margin-top: 7px;
}
@media (max-width: 768px) {
.earnings-grid {
grid-template-columns: 1fr;
gap: 20px;
}
.tier-card.featured {
transform: none;
}
.tier-card.featured:hover {
transform: translateY(-4px);
}
}
/* ===================================================
FOR BUSINESSES
=================================================== */
#businesses {
background: #001836;
}
.businesses-header {
text-align: center;
margin-bottom: 64px;
}
.businesses-header h2 {
color: var(--white);
margin-bottom: 16px;
}
.businesses-header p {
font-size: 1.125rem;
color: rgba(255,255,255,0.72);
max-width: 600px;
margin: 0 auto;
}
.biz-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 24px;
margin-bottom: 56px;
}
.biz-card {
background: rgba(255,255,255,0.05);
border: 1px solid rgba(255,255,255,0.1);
border-radius: var(--radius-card);
padding: 36px 28px;
transition: background var(--transition), border-color var(--transition);
}
.biz-card:hover {
background: rgba(255,255,255,0.08);
border-color: rgba(255,255,255,0.18);
}
.biz-icon {
width: 52px;
height: 52px;
display: flex;
align-items: center;
justify-content: center;
background: rgba(0,102,255,0.18);
border-radius: 12px;
margin-bottom: 20px;
color: var(--blue);
}
.biz-icon svg {
width: 26px;
height: 26px;
}
.biz-card h3 {
color: var(--white);
margin-bottom: 12px;
font-size: 1.125rem;
}
.biz-card p {
color: rgba(255,255,255,0.72);
font-size: 0.9625rem;
line-height: 1.6;
}
.biz-cta {
text-align: center;
}
@media (max-width: 768px) {
.biz-grid {
grid-template-columns: 1fr;
gap: 16px;
}
}
/* ===================================================
FAQ
=================================================== */
#faq {
background: var(--bg-white);
}
.faq-list {
max-width: 760px;
margin: 0 auto;
}
.faq-item {
border: 1.5px solid #E8E8E8;
border-radius: 12px;
margin-bottom: 12px;
overflow: hidden;
}
.faq-item summary {
display: flex;
align-items: center;
justify-content: space-between;
padding: 22px 28px;
font-size: 1rem;
font-weight: 700;
color: var(--text-dark);
cursor: pointer;
list-style: none;
user-select: none;
gap: 16px;
transition: background var(--transition);
}
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary:hover {
background: var(--bg-off);
}
.faq-item summary::after {
content: '';
display: block;
width: 22px;
height: 22px;
min-width: 22px;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230066FF' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
background-size: contain;
background-repeat: no-repeat;
transition: transform var(--transition);
flex-shrink: 0;
}
.faq-item[open] summary::after {
transform: rotate(180deg);
}
.faq-item[open] summary {
background: var(--bg-off);
border-bottom: 1px solid #E8E8E8;
}
.faq-answer {
padding: 20px 28px 24px;
font-size: 0.9625rem;
color: var(--text-body);
line-height: 1.7;
}
/* ===================================================
FINAL CTA
=================================================== */
#cta-bottom {
background: var(--bg-dark);
}
#cta-bottom .section-header h2 {
color: var(--white);
}
#cta-bottom .section-header p {
color: rgba(255,255,255,0.72);
}
/* ===================================================
FOOTER
=================================================== */
footer {
background: var(--bg-dark);
border-top: 1px solid rgba(255,255,255,0.07);
padding: 64px 0 40px;
}
.footer-inner {
display: grid;
grid-template-columns: 2fr 1fr 1fr 1fr;
gap: 48px;
margin-bottom: 56px;
}
.footer-brand .nav-logo {
display: block;
margin-bottom: 14px;
font-size: 1.5rem;
}
.footer-tagline {
color: rgba(255,255,255,0.55);
font-size: 0.9rem;
line-height: 1.55;
margin-bottom: 20px;
}
.footer-col h4 {
color: var(--white);
font-size: 0.875rem;
font-weight: 800;
letter-spacing: 0.06em;
text-transform: uppercase;
margin-bottom: 18px;
}
.footer-col ul li {
margin-bottom: 10px;
}
.footer-col ul li a {
color: rgba(255,255,255,0.55);
font-size: 0.9rem;
text-decoration: none;
transition: color var(--transition);
}
.footer-col ul li a:hover {
color: var(--white);
}
.footer-bottom {
display: flex;
align-items: center;
justify-content: space-between;
gap: 24px;
flex-wrap: wrap;
padding-top: 32px;
border-top: 1px solid rgba(255,255,255,0.07);
}
.footer-copyright {
color: rgba(255,255,255,0.4);
font-size: 0.875rem;
}
.footer-copyright a {
color: rgba(255,255,255,0.55);
text-decoration: underline;
text-decoration-color: rgba(255,255,255,0.2);
}
.footer-copyright a:hover {
color: var(--white);
}
.lang-switcher {
display: flex;
align-items: center;
gap: 4px;
flex-wrap: wrap;
}
.lang-switcher span {
color: rgba(255,255,255,0.35);
font-size: 0.8125rem;
margin-right: 4px;
}
.lang-link {
color: rgba(255,255,255,0.5);
font-size: 0.8125rem;
font-weight: 600;
padding: 4px 8px;
border-radius: 6px;
text-decoration: none;
transition: color var(--transition), background var(--transition);
}
.lang-link:hover {
color: var(--white);
background: rgba(255,255,255,0.07);
}
.lang-link.active {
color: var(--white);
background: rgba(0,102,255,0.25);
}
@media (max-width: 900px) {
.footer-inner {
grid-template-columns: 1fr 1fr;
gap: 36px;
}
.footer-brand {
grid-column: 1 / -1;
}
}
@media (max-width: 560px) {
.footer-inner {
grid-template-columns: 1fr;
gap: 28px;
}
.footer-brand {
grid-column: auto;
}
.footer-bottom {
flex-direction: column;
align-items: flex-start;
gap: 16px;
}
}
/* ===================================================
SKIP LINK (accessibility)
=================================================== */
.skip-link {
position: absolute;
top: -100px;
left: 16px;
background: var(--blue);
color: var(--white);
padding: 10px 20px;
border-radius: 0 0 8px 8px;
font-weight: 700;
font-size: 0.9rem;
z-index: 9999;
transition: top 0.2s;
}
.skip-link:focus {
top: 0;
}
/* ===================================================
FOCUS VISIBLE (accessibility)
=================================================== */
:focus-visible {
outline: 3px solid var(--blue);
outline-offset: 3px;
}
a:focus-visible {
outline: 3px solid var(--blue);
outline-offset: 3px;
border-radius: 3px;
}
/* ── Audience split ─────────────────────────────────── */
.audience-split {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 10px;
max-width: 580px;
margin: 28px auto 0;
}
.audience-card {
display: flex;
align-items: flex-start;
gap: 12px;
padding: 16px 18px;
border-radius: 12px;
text-decoration: none;
transition: transform 0.18s, background 0.18s;
}
.audience-card:hover { transform: translateY(-2px); }
.audience-zoomer {
background: rgba(0,102,255,0.12);
border: 1px solid rgba(0,102,255,0.35);
}
.audience-zoomer:hover { background: rgba(0,102,255,0.22); }
.audience-org {
background: rgba(255,255,255,0.05);
border: 1px solid rgba(255,255,255,0.15);
}
.audience-org:hover { background: rgba(255,255,255,0.1); }
.audience-icon { flex-shrink: 0; width: 28px; height: 28px; color: rgba(255,255,255,0.75); margin-top: 1px; }
.audience-icon svg { width: 100%; height: 100%; }
.audience-text { display: flex; flex-direction: column; gap: 3px; }
.audience-label { font-size: 0.8125rem; font-weight: 700; color: #FFFFFF; letter-spacing: -0.01em; }
.audience-desc { font-size: 0.6875rem; color: rgba(255,255,255,0.5); line-height: 1.4; }
@media (max-width: 480px) { .audience-split { grid-template-columns: 1fr; } }
/* ── Personas ────────────────────────────────────────── */
.personas-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 20px;
margin-top: 48px;
}
.persona-card {
background: var(--bg-white);
border-radius: var(--radius-card);
padding: 28px 24px;
border: 1px solid #EBEBEB;
display: flex;
flex-direction: column;
gap: 14px;
}
.persona-avatar {
width: 44px; height: 44px;
border-radius: 50%;
background: var(--blue);
color: #fff;
font-size: 0.8125rem;
font-weight: 700;
display: flex;
align-items: center;
justify-content: center;
letter-spacing: 0.04em;
flex-shrink: 0;
}
.persona-role {
font-size: 0.75rem;
font-weight: 700;
color: var(--blue);
text-transform: uppercase;
letter-spacing: 0.08em;
margin-bottom: 4px;
}
.persona-text {
font-size: 0.9375rem;
color: var(--text-body);
line-height: 1.65;
}
@media (max-width: 768px) { .personas-grid { grid-template-columns: 1fr; gap: 14px; } }
</style>
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "JobPosting",
"title": "Zoomer — Field Data Collector",
"description": "Photograph infrastructure, roads, coastlines and urban environments near you using your smartphone. Paid per approved mission via Stripe Connect. No minimum hours. No fixed schedule. No professional equipment required.",
"identifier": {"@type": "PropertyValue", "name": "quiXzoom", "value": "zoomer-field-collector"},
"datePosted": "2026-06-01",
"validThrough": "2026-12-31T23:59:59Z",
"employmentType": "CONTRACTOR",
"workHours": "Flexible — no minimum",
"jobLocationType": "TELECOMMUTE",
"hiringOrganization": {
"@type": "Organization",
"name": "quiXzoom",
"sameAs": "https://www.quixzoom.com",
"logo": "https://www.quixzoom.com/images/logo.png"
},
"applicantLocationRequirements": [
{"@type": "Country", "name": "Sweden"},
{"@type": "Country", "name": "Germany"},
{"@type": "Country", "name": "France"},
{"@type": "Country", "name": "Netherlands"},
{"@type": "Country", "name": "United Kingdom"},
{"@type": "Country", "name": "Finland"},
{"@type": "Country", "name": "Denmark"},
{"@type": "Country", "name": "Spain"},
{"@type": "Country", "name": "Italy"}
],
"baseSalary": {
"@type": "MonetaryAmount",
"currency": "EUR",
"value": {
"@type": "QuantitativeValue",
"minValue": 5,
"maxValue": 80,
"unitText": "MISSION"
}
},
"qualifications": "Smartphone (iPhone 12+ or Android with 12MP+ camera). Valid government-issued ID for one-time identity verification.",
"skills": "Mobile photography, navigation",
"responsibilities": "Photograph specified locations according to mission requirements using a smartphone. Submit via the quiXzoom platform.",
"applicationContact": {
"@type": "ContactPoint",
"url": "https://www.quixzoom.com"
}
}
</script>
</head>
<body>
<!-- Skip link -->
<a href="#main-content" class="skip-link">Skip to main content</a>
<!-- Nav toggle (CSS-only hamburger) -->
<input type="checkbox" id="nav-toggle" aria-label="Toggle navigation" hidden>
<!-- NAV -->
<nav aria-label="Main navigation">
<div class="container">
<div class="nav-inner">
<a href="#" class="nav-logo" aria-label="quiXzoom home">qui<span class="x">X</span>zoom</a>
<ul class="nav-links" role="list">
<li><a href="#how">How it works</a></li>
<li><a href="#missions">Mission types</a></li>
<li><a href="#earnings">Compensation</a></li>
<li><a href="#businesses">Organisations</a></li>
<li><a href="/for-organisations/">For clients</a></li>
</ul>
<div class="nav-cta">
<a href="#waitlist-form-top" class="btn-nav">Register interest</a>
</div>
<label class="nav-hamburger-label" for="nav-toggle" aria-label="Open menu">
<span></span>
<span></span>
<span></span>
</label>
</div>
</div>
</nav>
<main id="main-content">
<!-- ===================================================
HERO
=================================================== -->
<section id="hero" aria-label="Hero">
<div class="container">
<div class="hero-inner">
<div class="hero-badge" role="note">
Global rollout · August 2026
</div>
<h1 class="hero-h1">
Capturez<br>
world.<br>
<em>Earn per mission.</em>
</h1>
<p class="hero-sub">
quiXzoom is a platform for field data collection. Photograph infrastructure, roads, coastlines and urban environments near you. Payment is issued per approved mission, directly to your bank account.
</p>
<!-- Waitlist form — hero -->
<form
id="waitlist-form-top"
onsubmit="submitWaitlist(event,'top')"
novalidate
aria-label="Join the waitlist"
>
<div class="wl-row">
<input
type="email"
id="wl-email"
name="email"
class="wl-input"
placeholder="Votre adresse e-mail"
required
autocomplete="email"
aria-label="Email address"
aria-required="true"
>
<button type="submit" id="wl-btn" class="wl-submit">
Register interest →
</button>
</div>
<div id="wl-ok" class="wl-ok" hidden role="alert" aria-live="polite">
<svg width="22" height="22" viewBox="0 0 22 22" fill="none" aria-hidden="true">
<circle cx="11" cy="11" r="11" fill="#00C853"/>
<path d="M6 11l3.5 3.5L16 7.5" stroke="#fff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
You're on the list! We'll be in touch before launch.
</div>
<p id="wl-err" class="wl-err" hidden role="alert" aria-live="polite">
Une erreur est survenue. Veuillez réessayer.
</p>
</form>
<div class="wl-trust" aria-label="Trust indicators">
<p class="trust-strip">No signup fee. Payment via Stripe Connect. Identity verification required once.</p>
<!-- Who is this for -->
<div class="audience-split" role="navigation" aria-label="Choose your path">
<a href="#waitlist-form-top" class="audience-card audience-zoomer" aria-label="I want to earn money as a Zoomer">
<div class="audience-icon" aria-hidden="true">
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><path d="M20 21v-2a4 4 0 00-4-4H8a4 4 0 00-4 4v2"/><circle cx="12" cy="7" r="4"/></svg>
</div>
<div class="audience-text">
<span class="audience-label">I want to earn</span>
<span class="audience-desc">Take photo missions near me. Paid per approval.</span>
</div>
</a>
<a href="/for-organisations/" class="audience-card audience-org" aria-label="My organisation needs field data">
<div class="audience-icon" aria-hidden="true">
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"><rect x="2" y="7" width="20" height="14" rx="2"/><path d="M16 7V5a2 2 0 00-2-2h-4a2 2 0 00-2 2v2"/><line x1="12" y1="12" x2="12" y2="16"/><line x1="10" y1="14" x2="14" y2="14"/></svg>
</div>
<div class="audience-text">
<span class="audience-label">We need field data</span>
<span class="audience-desc">Commission visual documentation at scale.</span>
</div>
</a>
</div>
</div>
<p class="wl-counter">
<strong><span id="wl-count"></span></strong> Zoomers déjà inscrits
</p>
</div>
</div>
</section>
<!-- ===================================================
STATS BAND
=================================================== -->
<section id="stats" aria-label="Key statistics">
<div class="container">
<div class="stats-grid" role="list">
<div class="stat-item" role="listitem">
<span class="stat-value">~30 min</span>
<span class="stat-label">Temps moyen par mission</span>
</div>
<div class="stat-item" role="listitem">
<span class="stat-value">20+</span>
<span class="stat-label">Pays au lancement</span>
</div>
<div class="stat-item" role="listitem">
<span class="stat-value">August 2026</span>
<span class="stat-label">Launch market: Sweden</span>
</div>
<div class="stat-item" role="listitem">
<span class="stat-value">100%</span>
<span class="stat-label">Payé à approbation</span>
</div>
</div>
</div>
</section>
<!-- ===================================================
HOW IT WORKS
=================================================== -->
<section id="how" class="section-pad" aria-labelledby="how-h2">
<div class="container">
<div class="section-header">
<h2 id="how-h2">How it works</h2>
</div>
<div class="steps-grid">
<article class="step-card" aria-label="Step 1: Join the waitlist">
<div class="step-number" aria-hidden="true">1</div>
<h3>Register</h3>
<p>Submit your email. You will be notified before the platform opens in your region.</p>
</article>
<article class="step-card" aria-label="Step 2: Pick a mission">
<div class="step-number" aria-hidden="true">2</div>
<h3>Select a mission</h3>
<p>Browse active missions on the map. Each mission specifies location, required shots, and payment amount. No negotiation required.</p>
</article>
<article class="step-card" aria-label="Step 3: Get paid">
<div class="step-number" aria-hidden="true">3</div>
<h3>Receive payment</h3>
<p>Submit documentation. Upon approval, payment is transferred directly to your registered bank account via Stripe Connect.</p>
</article>
</div>
</div>
</section>
<!-- ===================================================
PERSONAS — Who becomes a Zoomer?
=================================================== -->
<section id="personas" class="section-pad" style="background:var(--bg-off)" aria-labelledby="personas-h2">
<div class="container">
<div class="section-header">
<p class="section-overline">Who does this</p>
<h2 id="personas-h2">Anyone with a smartphone and time in their area.</h2>
<p>Zoomers are not professionals. They are people who happen to be near the location.</p>
</div>
<div class="personas-grid">
<article class="persona-card">
<div class="persona-avatar" aria-hidden="true">ML</div>
<div>
<p class="persona-role">Student · 22</p>
<p class="persona-text">Three to four missions per week between lectures. No fixed schedule. The income supplements student loans without affecting studies or availability.</p>
</div>
</article>
<article class="persona-card">
<div class="persona-avatar" aria-hidden="true">DP</div>
<div>
<p class="persona-role">Delivery driver · 34</p>
<p class="persona-text">Adds missions along existing daily routes. No additional travel required. The missions are already on the way — the camera is the only extra step.</p>
</div>
</article>
<article class="persona-card">
<div class="persona-avatar" aria-hidden="true">EH</div>
<div>
<p class="persona-role">Retired · 61</p>
<p class="persona-text">Daily walks through the neighbourhood, now with a defined purpose and a payment at the end of each walk. No training, no equipment, no commitment.</p>
</div>
</article>
</div>
</div>
</section>
<!-- ===================================================
MISSION TYPES
=================================================== -->
<section id="missions" class="section-pad" aria-labelledby="missions-h2">
<div class="container">
<div class="section-header">
<h2 id="missions-h2">Mission categories</h2>
<p>Each mission specifies scope, required documentation and payment. Clients include municipalities, government agencies, property owners and insurance companies.</p>
</div>
<div class="missions-grid">
<!-- Infrastructure -->
<article class="mission-card" aria-label="Mission type: Infrastructure">
<div class="mission-icon" aria-hidden="true">
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
<path d="M3 21h18"/>
<path d="M3 18l4-7 4 3 4-5 4 9"/>
<path d="M7 11V7"/>
<path d="M17 9v-2"/>
</svg>
</div>
<h3>Infrastructure</h3>
<p>Bridges, roads, utility lines, foundations. Systematic documentation for public and private operators.</p>
<span class="mission-chip">Municipalities &amp; government</span>
</article>
<!-- Real estate -->
<article class="mission-card" aria-label="Mission type: Real estate">
<div class="mission-icon" aria-hidden="true">
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
<path d="M3 21V9l9-7 9 7v12"/>
<path d="M9 21v-6h6v6"/>
<path d="M9 9h.01"/>
<path d="M15 9h.01"/>
</svg>
</div>
<h3>Real estate</h3>
<p>Facades, roofs, entrances, parking lots. Visual inspection and documentation for property portfolios.</p>
<span class="mission-chip">Property &amp; insurance</span>
</article>
<!-- Coastlines & nature -->
<article class="mission-card" aria-label="Mission type: Coastlines and nature">
<div class="mission-icon" aria-hidden="true">
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
<path d="M3 17c2-1 4-2 6 0s4 1 6 0 4-1 6 0"/>
<path d="M3 13c2-1 4-2 6 0s4 1 6 0 4-1 6 0"/>
<path d="M12 3v6"/>
<path d="M9 6l3-3 3 3"/>
</svg>
</div>
<h3>Coastlines &amp; nature</h3>
<p>Coasts, beaches, waterways, natural environments. Monitoring and change detection at scale.</p>
<span class="mission-chip">Maritime &amp; environmental</span>
</article>
<!-- Incident & damage -->
<article class="mission-card" aria-label="Mission type: Incident and damage">
<div class="mission-icon" aria-hidden="true">
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
<path d="M10.29 3.86L1.82 18a2 2 0 001.71 3h16.94a2 2 0 001.71-3L13.71 3.86a2 2 0 00-3.42 0z"/>
<path d="M12 9v4"/>
<path d="M12 17h.01"/>
</svg>
</div>
<h3>Incident &amp; damage</h3>
<p>Storm damage, flooding, vandalism. Fast-turnaround documentation for time-sensitive insurance claims.</p>
<span class="mission-chip">Insurance — fastest pay</span>
</article>
<!-- Verification -->
<article class="mission-card" aria-label="Mission type: Verification">
<div class="mission-icon" aria-hidden="true">
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
<path d="M9 12l2 2 4-4"/>
<path d="M21 12c0 4.97-4.03 9-9 9s-9-4.03-9-9 4.03-9 9-9c1.51 0 2.93.37 4.17 1.03"/>
<path d="M17 3l2 2-2 2"/>
<path d="M19 5h-4"/>
</svg>
</div>
<h3>Verification</h3>
<p>Confirm assets exist and look as expected. Addresses, storefronts, delivery locations and registered entities.</p>
<span class="mission-chip">E-commerce, banks &amp; agencies</span>
</article>
<!-- Urban & streets -->
<article class="mission-card" aria-label="Mission type: Urban and streets">
<div class="mission-icon" aria-hidden="true">
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
<rect x="2" y="7" width="7" height="14" rx="1"/>
<rect x="9" y="3" width="7" height="18" rx="1"/>
<rect x="16" y="9" width="7" height="12" rx="1"/>
<path d="M2 21h20"/>
</svg>
</div>
<h3>Urban &amp; streets</h3>
<p>Street conditions, signage, accessibility, retail presence. Intelligence for city planners and retail chains.</p>
<span class="mission-chip">Municipalities &amp; retail</span>
</article>
</div>
</div>
</section>
<!-- ===================================================
EARNINGS
=================================================== -->
<section id="earnings" class="section-pad" aria-labelledby="earnings-h2">
<div class="container">
<div class="section-header">
<h2 id="earnings-h2">Compensation structure</h2>
<p>Payment is issued per approved mission. There is no hourly rate, no schedule and no minimum commitment.</p>
</div>
<div class="earnings-grid">
<article class="tier-card" aria-label="Part-time tier">
<h3>Supplementary</h3>
<p class="tier-missions">24 missions per week</p>
<ul class="tier-features" role="list">
<li>Supplementary income alongside existing commitments</li>
<li>No minimum hours or availability required</li>
<li>Access to all standard mission categories</li>
</ul>
</article>
<article class="tier-card featured" aria-label="Active tier — most popular">
<h3>Active</h3>
<p class="tier-missions">812 missions per week</p>
<ul class="tier-features" role="list">
<li>Consistent volume with predictable payment cadence</li>
<li>Builds platform rating, unlocking higher-value assignments</li>
<li>Priority access to restricted mission types</li>
</ul>
</article>
<article class="tier-card" aria-label="Pro tier">
<h3>Professional</h3>
<p class="tier-missions">15+ missions per week</p>
<ul class="tier-features" role="list">
<li>Maximum assignment volume and compensation</li>
<li>First access to premium and restricted assignments</li>
<li>Performance-based compensation adjustments</li>
</ul>
</article>
</div>
<!-- Payment accordion -->
<details class="payment-accordion" aria-label="Payment and tax information">
<summary>Payment and taxation</summary>
<div class="payment-accordion-body">
<ul role="list">
<li>
<span class="dot" aria-hidden="true"></span>
Payment is processed via Stripe Connect upon mission approval. Funds are transferred directly to your registered bank account.
</li>
<li>
<span class="dot" aria-hidden="true"></span>
quiXzoom does not charge a commission or platform fee to Zoomers. The amount stated in the mission specification is the amount paid.
</li>
<li>
<span class="dot" aria-hidden="true"></span>
Income from quiXzoom is subject to taxation under applicable local law. quiXzoom does not withhold taxes on behalf of Zoomers. You are responsible for your own tax reporting and compliance.
</li>
</ul>
</div>
</details>
</div>
</section>
<!-- ===================================================
FOR BUSINESSES
=================================================== -->
<section id="businesses" class="section-pad" aria-labelledby="biz-h2">
<div class="container">
<div class="businesses-header">
<h2 id="biz-h2">For organisations</h2>
<p>quiXzoom provides organisations with on-demand access to a verified network of field data collectors. Scope is defined by the client. Execution is distributed.</p>
</div>
<div class="biz-grid">
<article class="biz-card" aria-label="Feature: Global coverage">
<div class="biz-icon" aria-hidden="true">
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
<circle cx="12" cy="12" r="10"/>
<path d="M2 12h20"/>
<path d="M12 2a15.3 15.3 0 014 10 15.3 15.3 0 01-4 10 15.3 15.3 0 01-4-10 15.3 15.3 0 014-10z"/>
</svg>
</div>
<h3>Geographic reach</h3>
<p>Operational across 20+ countries at launch. No local staffing or coordination infrastructure required on the client side.</p>
</article>
<article class="biz-card" aria-label="Feature: Verified data">
<div class="biz-icon" aria-hidden="true">
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
<path d="M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z"/>
<path d="M9 12l2 2 4-4"/>
</svg>
</div>
<h3>Quality assurance</h3>
<p>Every submission undergoes automated review for completeness, technical quality and specification compliance before delivery.</p>
</article>
<article class="biz-card" aria-label="Feature: Real-time deployment">
<div class="biz-icon" aria-hidden="true">
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
<path d="M13 2L3 14h9l-1 8 10-12h-9l1-8z"/>
</svg>
</div>
<h3>Rapid deployment</h3>
<p>Mission campaigns can be configured and deployed within hours. Define geographic scope, documentation requirements and compensation — the network activates automatically.</p>
</article>
</div>
<div class="biz-cta">
<a href="mailto:www.quixzoom.com/support" class="btn-ghost" aria-label="Send enterprise inquiry to www.quixzoom.com/support">
Enquire about organisational access →
</a>
</div>
</div>
</section>
<!-- ===================================================
FAQ
=================================================== -->
<section id="faq" class="section-pad" aria-labelledby="faq-h2">
<div class="container">
<div class="section-header">
<h2 id="faq-h2">Frequently asked questions</h2>
</div>
<div class="faq-list" role="list">
<details class="faq-item" role="listitem">
<summary>Do I need a professional camera?</summary>
<div class="faq-answer">
No. iPhone 12 or later, or any Android smartphone with a 12 MP or better camera, is all you need. Most of our Zoomers use the phone they already own.
</div>
</details>
<details class="faq-item" role="listitem">
<summary>How and when do I get paid?</summary>
<div class="faq-answer">
You're paid via Stripe Connect directly after each mission is approved. A one-time identity verification is required to receive payouts. There are no delays and no invoicing — it's automatic.
</div>
</details>
<details class="faq-item" role="listitem">
<summary>What missions are available in my area?</summary>
<div class="faq-answer">
Sign up for the waitlist to be notified when we launch. You'll be able to browse live missions on an interactive map from August 1, 2026. Mission density varies by region and grows over time.
</div>
</details>
<details class="faq-item" role="listitem">
<summary>Is this taxable income?</summary>
<div class="faq-answer">
Yes. Mission earnings are income and must be reported according to your country's tax regulations. quiXzoom does not withhold taxes on your behalf. We recommend keeping track of your earnings from day one.
</div>
</details>
<details class="faq-item" role="listitem">
<summary>How quickly is my photo approved?</summary>
<div class="faq-answer">
Most submissions are reviewed within a few hours using our AI system. If a submission isn't approved, you'll always see the specific reason. You can supplement or appeal within 48 hours of the decision.
</div>
</details>
<details class="faq-item" role="listitem">
<summary>Can I work part-time?</summary>
<div class="faq-answer">
Absolutely. There are no minimum hours, no fixed schedule and no commitment. Work when you want, as much as you want. Many Zoomers do one or two missions on their lunch break.
</div>
</details>
</div>
</div>
</section>
<!-- ===================================================
FINAL CTA
=================================================== -->
<section id="cta-bottom" class="section-pad" aria-labelledby="cta-h2">
<div class="container">
<div class="section-header">
<h2 id="cta-h2">Prêt à commencer ?</h2>
<p>Registration is open. No platform fee. No minimum commitment required.</p>
</div>
<!-- Waitlist form — bottom -->
<div id="hero-bottom" style="max-width:680px;margin:0 auto;">
<form
id="waitlist-form-bottom"
onsubmit="submitWaitlist(event,'bottom')"
novalidate
aria-label="Join the waitlist"
>
<div class="wl-row">
<input
type="email"
id="wl-email-bottom"
name="email"
class="wl-input"
placeholder="Votre adresse e-mail"
required
autocomplete="email"
aria-label="Email address"
aria-required="true"
>
<button type="submit" id="wl-btn-bottom" class="wl-submit">
Register interest →
</button>
</div>
<div id="wl-ok-bottom" class="wl-ok" hidden role="alert" aria-live="polite">
<svg width="22" height="22" viewBox="0 0 22 22" fill="none" aria-hidden="true">
<circle cx="11" cy="11" r="11" fill="#00C853"/>
<path d="M6 11l3.5 3.5L16 7.5" stroke="#fff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
You're on the list! We'll be in touch before launch.
</div>
<p id="wl-err-bottom" class="wl-err" hidden role="alert" aria-live="polite">
Something went wrong. Please try again.
</p>
</form>
<div class="wl-trust" aria-label="Trust indicators">
<span class="trust-strip">No signup fee. Payment via Stripe Connect. Available in 20+ countries.</span>
</div>
</div>
</div>
</section>
</main>
<!-- ===================================================
FOOTER
=================================================== -->
<footer aria-label="Site footer">
<div class="container">
<div class="footer-inner">
<div class="footer-brand">
<a href="#" class="nav-logo" aria-label="quiXzoom home">qui<span class="x">X</span>zoom</a>
<p class="footer-tagline">Crowdsourced field data collection.<br>Launching August 2026.</p>
</div>
<div class="footer-col">
<h4>For Zoomers</h4>
<ul role="list">
<li><a href="#how">How it works</a></li>
<li><a href="#missions">Mission types</a></li>
<li><a href="#earnings">Compensation</a></li>
<li><a href="#faq">FAQ</a></li>
<li><a href="#waitlist-form-top">Register interest</a></li>
</ul>
</div>
<div class="footer-col">
<h4>For Businesses</h4>
<ul role="list">
<li><a href="#businesses">Overview</a></li>
<li><a href="mailto:www.quixzoom.com/support">Enterprise inquiry</a></li>
<li><a href="mailto:www.quixzoom.com/support">Contact sales</a></li>
</ul>
</div>
<div class="footer-col">
<h4>Legal</h4>
<ul role="list">
<li><a href="/privacy">Privacy policy</a></li>
<li><a href="/terms">Terms of service</a></li>
<li><a href="/cookies">Cookie policy</a></li>
<li><a href="/mentions-legales">Mentions légales</a></li>
</ul>
</div>
</div>
<div class="footer-bottom">
<p class="footer-copyright">
&copy; 2026 quiXzoom &middot; <a href="https://www.quixzoom.com/support">Support</a>
</p>
<nav class="lang-switcher" aria-label="Language selector">
<span>🌍</span>
<a href="https://quixzoom.fr/" class="lang-link active" hreflang="en" lang="en" aria-current="page">EN</a>
<a href="https://www.quixzoom.com/markets/se/" class="lang-link" hreflang="sv" lang="sv">SV</a>
<a href="https://www.quixzoom.com/markets/" class="lang-link" hreflang="de" lang="de">DE</a>
<a href="https://quixzoom.fr/" class="lang-link" hreflang="fr" lang="fr">FR</a>
<a href="https://www.quixzoom.com/markets/nl/" class="lang-link" hreflang="nl" lang="nl">NL</a>
<a href="https://www.quixzoom.com/markets/en/" class="lang-link" hreflang="en-gb" lang="en-GB">UK</a>
<a href="https://www.quixzoom.com/markets/" class="lang-link" hreflang="it" lang="it">IT</a>
<a href="https://www.quixzoom.com/markets/" class="lang-link" hreflang="es" lang="es">ES</a>
<a href="https://www.quixzoom.com/markets/" class="lang-link" hreflang="fi" lang="fi">FI</a>
<a href="https://www.quixzoom.com/markets/" class="lang-link" hreflang="da" lang="da">DK</a>
</nav>
</div>
</div>
</footer>
<!-- ===================================================
JAVASCRIPT
=================================================== -->
<script>
'use strict';
// Waitlist submit handler
async function submitWaitlist(e, variant) {
e.preventDefault();
var sfx = variant === 'bottom' ? '-bottom' : '';
var btn = document.getElementById('wl-btn' + sfx);
var inp = document.getElementById('wl-email' + sfx);
var ok = document.getElementById('wl-ok' + sfx);
var err = document.getElementById('wl-err' + sfx);
if (!inp.value.trim() || !inp.value.includes('@')) {
inp.focus();
return;
}
btn.disabled = true;
btn.textContent = '…';
err.hidden = true;
try {
var r = await fetch('https://api.quixzoom.com/api/qz/waitlist', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({
email: inp.value.trim(),
country: (navigator.language || 'en').split('-')[1] || '',
lang: (navigator.language || 'en').split('-')[0],
source: location.hostname
})
});
if (!r.ok) throw new Error('server_error');
inp.closest('.wl-row').style.display = 'none';
ok.hidden = false;
updateCounter();
} catch (ex) {
btn.disabled = false;
btn.textContent = 'Join the waitlist →';
err.hidden = false;
}
}
// Update waitlist counter
function updateCounter() {
fetch('https://api.quixzoom.com/api/qz/waitlist/count')
.then(function(r) { return r.json(); })
.then(function(d) {
var el = document.getElementById('wl-count');
if (el && d && typeof d.count !== 'undefined') {
el.textContent = Number(d.count).toLocaleString();
}
})
.catch(function() {});
}
// Close mobile nav on link click
document.querySelectorAll('.nav-links a').forEach(function(link) {
link.addEventListener('click', function() {
var toggle = document.getElementById('nav-toggle');
if (toggle) toggle.checked = false;
});
});
// Load counter on DOM ready
document.addEventListener('DOMContentLoaded', updateCounter);
</script>
</body>
</html>
@@ -0,0 +1,128 @@
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Mentions légales quiXzoom</title>
<style>
:root { --bg: #F2F2F7; --surface: #fff; --label: #000; --label2: #3C3C43; --label3: rgba(60,60,67,.65); --accent: #0066FF; --sep: rgba(60,60,67,.2); --font: -apple-system,sans-serif; --r: 16px; }
@media (prefers-color-scheme: dark) {
:root { --bg: #1C1C1E; --surface: #2C2C2E; --label: #fff; --label2: #EBEBF5; --label3: rgba(235,235,245,.6); --sep: rgba(235,235,245,.15); }
}
* { box-sizing: border-box; margin: 0; padding: 0; -webkit-font-smoothing: antialiased; }
body { font-family: var(--font); background: var(--bg); color: var(--label); padding: 20px; max-width: 680px; margin: 0 auto; }
header { padding: 32px 0 24px; text-align: center; }
.logo { font-size: 28px; font-weight: 700; color: var(--accent); }
h1 { font-size: 22px; font-weight: 700; margin-top: 6px; }
header p { font-size: 13px; color: var(--label3); margin-top: 4px; }
.card { background: var(--surface); border-radius: var(--r); padding: 20px; margin-bottom: 12px; }
.card-title { font-size: 17px; font-weight: 600; margin-bottom: 12px; }
.row { display: flex; gap: 12px; padding: 12px 0; border-bottom: .5px solid var(--sep); align-items: flex-start; }
.row:last-child { border-bottom: none; }
.row-icon { width: 36px; height: 36px; border-radius: 8px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; background: rgba(0,102,255,.1); }
.row-label { font-size: 15px; font-weight: 600; }
.row-sub { font-size: 13px; color: var(--label3); margin-top: 2px; line-height: 1.5; }
p, li { font-size: 15px; line-height: 1.6; color: var(--label2); }
a { color: var(--accent); }
footer { text-align: center; padding: 24px 0 8px; font-size: 13px; color: var(--label3); }
.back { display: inline-flex; align-items: center; gap: 6px; color: var(--accent); font-size: .875rem; font-weight: 600; margin-bottom: 8px; text-decoration: none; }
</style>
</head>
<body>
<header>
<a class="back" href="/">
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round"><polyline points="15 18 9 12 15 6"/></svg>
quiXzoom
</a>
<div class="logo">qui<span>X</span>zoom</div>
<h1>Mentions légales</h1>
<p>Article 6 de la loi n° 2004-575 du 21 juin 2004 pour la confiance dans l'économie numérique</p>
</header>
<div class="card">
<div class="card-title">Éditeur du site</div>
<div class="row">
<div class="row-icon">
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="#0066ff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="3" width="18" height="18" rx="2"/><path d="M3 9h18M9 21V9M15 21V9"/></svg>
</div>
<div>
<div class="row-label">Landvex AB</div>
<div class="row-sub">
Société enregistrée en Suède<br>
Numéro d'organisation : 559141-7042<br>
Tyresö, Suède
</div>
</div>
</div>
</div>
<div class="card">
<div class="card-title">Directeur de la publication</div>
<div class="row">
<div class="row-icon">
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="#0066ff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2"/><circle cx="12" cy="7" r="4"/></svg>
</div>
<div>
<div class="row-label">Erik Svensson</div>
<div class="row-sub">Directeur général, Landvex AB</div>
</div>
</div>
</div>
<div class="card">
<div class="card-title">Contact</div>
<div class="row">
<div class="row-icon">
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="#0066ff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"/><polyline points="22,6 12,13 2,6"/></svg>
</div>
<div>
<div class="row-label">E-mail</div>
<div class="row-sub"><a href="mailto:contact@quixzoom.com">contact@quixzoom.com</a></div>
</div>
</div>
</div>
<div class="card">
<div class="card-title">Hébergement</div>
<div class="row">
<div class="row-icon">
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="#0066ff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="2" y="2" width="20" height="8" rx="2"/><rect x="2" y="14" width="20" height="8" rx="2"/><line x1="6" y1="6" x2="6.01" y2="6"/><line x1="6" y1="18" x2="6.01" y2="18"/></svg>
</div>
<div>
<div class="row-label">Amazon Web Services (AWS)</div>
<div class="row-sub">Région eu-north-1 — Stockholm, Suède</div>
</div>
</div>
</div>
<div class="card">
<div class="card-title">Propriété intellectuelle</div>
<p>quiXzoom est une marque de Landvex AB. Tout le contenu de ce site (textes, images, logos, graphismes) est protégé par le droit d'auteur. Toute reproduction ou représentation, totale ou partielle, sans autorisation expresse est interdite.</p>
</div>
<div class="card">
<div class="card-title">Données personnelles</div>
<div class="row">
<div class="row-icon">
<svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="#0066ff" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z"/></svg>
</div>
<div>
<div class="row-label">Politique de confidentialité</div>
<div class="row-sub">Pour en savoir plus sur le traitement de vos données personnelles, veuillez consulter notre <a href="/privacy">Politique de confidentialité</a>.</div>
</div>
</div>
</div>
<div class="card">
<div class="card-title">Règlement des litiges en ligne</div>
<p>La Commission européenne met à disposition une plateforme de règlement en ligne des litiges (RLL) accessible à l'adresse : <a href="https://ec.europa.eu/consumers/odr">ec.europa.eu/consumers/odr</a></p>
<p style="margin-top:8px">Notre adresse e-mail : <a href="mailto:contact@quixzoom.com">contact@quixzoom.com</a></p>
</div>
<footer>
<p>© 2026 Landvex AB · <a href="/privacy">Confidentialité</a> · <a href="/terms">Conditions générales</a> · <a href="/mentions-legales">Mentions légales</a></p>
</footer>
</body>
</html>
@@ -0,0 +1,5 @@
User-agent: *
Allow: /
Disallow: /api/
Sitemap: https://www.quixzoom.fr/sitemap.xml
@@ -0,0 +1,9 @@
<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9">
<url>
<loc>https://www.quixzoom.fr/</loc>
<changefreq>weekly</changefreq>
<priority>0.8</priority>
<lastmod>2026-06-16</lastmod>
</url>
</urlset>