2026-07-08 10:27:21 +00:00
<!DOCTYPE html>
< html lang = "{{LANG}}" >
< head >
< meta charset = "UTF-8" >
< meta name = "viewport" content = "width=device-width, initial-scale=1.0" >
< title > {{TITLE}}< / title >
< meta name = "description" content = "{{META_DESC}}" >
< link rel = "canonical" href = "https://quixzoom.asia/{{LANG_CODE}}/" >
<!-- hreflang tags -->
< link rel = "alternate" hreflang = "zh-CN" href = "https://quixzoom.asia/zh-cn/" >
< link rel = "alternate" hreflang = "zh-TW" href = "https://quixzoom.asia/zh-tw/" >
< link rel = "alternate" hreflang = "ja" href = "https://quixzoom.asia/ja/" >
< link rel = "alternate" hreflang = "ko" href = "https://quixzoom.asia/ko/" >
< link rel = "alternate" hreflang = "th" href = "https://quixzoom.asia/th/" >
< link rel = "alternate" hreflang = "vi" href = "https://quixzoom.asia/vi/" >
< link rel = "alternate" hreflang = "id" href = "https://quixzoom.asia/id/" >
< link rel = "alternate" hreflang = "ms" href = "https://quixzoom.asia/ms/" >
< link rel = "alternate" hreflang = "hi" href = "https://quixzoom.asia/hi/" >
< link rel = "alternate" hreflang = "en" href = "https://www.quixzoom.com/" >
< link rel = "icon" type = "image/svg+xml" href = "/favicon.svg" >
< style >
: root {
--bg : #FFFFFF ;
--bg-off : #F7F7F5 ;
--text : #1a1a1a ;
--text-body : #3a3a3a ;
--text-muted : #6B6B6B ;
--blue : #0066FF ;
--blue-dark : #0052CC ;
--blue-pale : rgba ( 0 , 102 , 255 , .07 ) ;
--green : #00C853 ;
--radius : 16 px ;
--radius-lg : 24 px ;
--shadow : 0 16 px 48 px rgba ( 0 , 0 , 0 , .14 ) ;
}
* , * :: before , * :: after { box-sizing : border-box ; margin : 0 ; padding : 0 ; }
html { scroll-behavior : smooth ; }
2026-07-14 15:27:33 +00:00
body { background : #ffffff ; color : #1a1a1a ;
2026-07-08 10:27:21 +00:00
font-family : - apple-system , BlinkMacSystemFont , 'Segoe UI' , sans-serif ;
font-size : 1 rem ; line-height : 1.65 ; color : var ( - - text - body ) ;
background : var ( - - bg ) ; -webkit- font-smoothing : antialiased ;
}
. container { width : 100 % ; max-width : 1160 px ; margin : 0 auto ; padding : 0 24 px ; }
h1 { font-size : clamp ( 2.75 rem , 6 vw , 5 rem ) ; font-weight : 900 ; letter-spacing : -.05 em ; line-height : 1 ; color : var ( - - text ) ; }
h2 { font-size : clamp ( 2 rem , 3.5 vw , 3 rem ) ; font-weight : 800 ; letter-spacing : -.04 em ; line-height : 1.1 ; color : var ( - - text ) ; }
h3 { font-size : 1.375 rem ; font-weight : 700 ; letter-spacing : -.02 em ; line-height : 1.3 ; color : var ( - - text ) ; }
/* Nav */
nav { position : sticky ; top : 0 ; z-index : 300 ; background : var ( - - bg - off ) ; border-bottom : 1 px solid rgba ( 58 , 58 , 58 , .06 ) ; }
. nav-inner { display : flex ; align-items : center ; justify-content : space-between ; height : 68 px ; gap : 32 px ; }
. nav-logo { font-size : 1.375 rem ; font-weight : 900 ; color : var ( - - text ) ; letter-spacing : -.04 em ; text-decoration : none ; }
. nav-logo . x { color : var ( - - blue ) ; }
. nav-links { display : flex ; align-items : center ; gap : 32 px ; flex : 1 ; justify-content : center ; }
. nav-links a { color : rgba ( 58 , 58 , 58 , .75 ) ; font-size : 1 rem ; font-weight : 500 ; transition : color .15 s ; text-decoration : none ; }
. nav-links a : hover { color : var ( - - text ) ; }
. btn-nav { background : var ( - - blue ) ; color : #fff ; border : none ; border-radius : var ( - - radius - lg ) ; padding : 10 px 24 px ; font-size : 1 rem ; font-weight : 700 ; transition : background .15 s ; white-space : nowrap ; cursor : pointer ; }
. btn-nav : hover { background : var ( - - blue - dark ) ; }
/* Hero */
# hero { background : var ( - - bg - off ) ; min-height : calc ( 100 vh - 68 px ) ; display : flex ; align-items : center ; padding : 80 px 0 96 px ; }
. hero-layout { display : grid ; grid-template-columns : 1 fr 420 px ; gap : 64 px ; align-items : center ; }
. hero-inner { max-width : 560 px ; }
. hero-badge { display : inline-flex ; align-items : center ; gap : 8 px ; background : rgba ( 58 , 58 , 58 , .07 ) ; border : 1 px solid rgba ( 58 , 58 , 58 , .12 ) ; border-radius : 100 px ; padding : 8 px 18 px ; font-size : .875 rem ; font-weight : 600 ; color : rgba ( 58 , 58 , 58 , .88 ) ; margin-bottom : 36 px ; }
. hero-h1 { color : var ( - - text ) ; margin-bottom : 28 px ; }
. hero-h1 em { font-style : normal ; color : var ( - - blue ) ; }
. hero-sub { font-size : clamp ( 1.0625 rem , 2 vw , 1.25 rem ) ; color : rgba ( 58 , 58 , 58 , .82 ) ; max-width : 640 px ; line-height : 1.6 ; margin-bottom : 44 px ; }
. wl-row { display : flex ; align-items : center ; gap : 12 px ; flex-wrap : wrap ; margin-bottom : 20 px ; }
. wl-input { flex : 1 ; min-width : 280 px ; background : #fff ; color : var ( - - text ) ; border : 2.5 px solid #fff ; border-radius : var ( - - radius - lg ) ; padding : 18 px 28 px ; font-size : 1 rem ; outline : none ; transition : border-color .15 s , box-shadow .15 s ; }
. wl-input : focus { border-color : var ( - - blue ) ; box-shadow : 0 0 0 3 px rgba ( 0 , 102 , 255 , .18 ) ; }
. wl-submit { background : var ( - - blue ) ; color : #fff ; border : none ; border-radius : var ( - - radius - lg ) ; padding : 18 px 36 px ; font-size : 1 rem ; font-weight : 800 ; cursor : pointer ; transition : background .15 s ; white-space : nowrap ; }
. wl-submit : hover { background : var ( - - blue - dark ) ; }
. wl-trust { font-size : .875 rem ; color : rgba ( 58 , 58 , 58 , .65 ) ; margin-bottom : 20 px ; }
. hero-stats-pill { display : flex ; gap : 24 px ; margin-top : 32 px ; flex-wrap : wrap ; }
. hstat { text-align : left ; }
. hstat-num { font-size : 1.5 rem ; font-weight : 900 ; color : var ( - - text ) ; letter-spacing : -.04 em ; line-height : 1 ; }
. hstat-lbl { font-size : .75 rem ; color : rgba ( 58 , 58 , 58 , .75 ) ; margin-top : 2 px ; }
/* Stats */
# stats { background : var ( - - blue ) ; padding : 56 px 0 ; }
. stats-grid { display : grid ; grid-template-columns : repeat ( 4 , 1 fr ) ; gap : 0 ; }
. stat-item { text-align : center ; padding : 20 px 16 px ; position : relative ; }
. stat-item : not ( : last-child ) :: after { content : '' ; position : absolute ; right : 0 ; top : 20 % ; height : 60 % ; width : 1 px ; background : rgba ( 255 , 255 , 255 , .25 ) ; }
. stat-value { font-size : clamp ( 2 rem , 4 vw , 3 rem ) ; font-weight : 900 ; color : #fff ; letter-spacing : -.04 em ; line-height : 1 ; display : block ; margin-bottom : 8 px ; }
. stat-label { font-size : .9 rem ; color : rgba ( 255 , 255 , 255 , .82 ) ; font-weight : 500 ; }
/* Sections */
. section-pad { padding : 96 px 0 ; }
. section-header { text-align : center ; margin-bottom : 64 px ; }
. section-header h2 { color : var ( - - text ) ; margin-bottom : 16 px ; }
. section-header p { font-size : 1.125 rem ; color : var ( - - text - muted ) ; max-width : 580 px ; margin : 0 auto ; }
/* How it works */
. steps-grid { display : grid ; grid-template-columns : repeat ( 3 , 1 fr ) ; gap : 28 px ; }
. step-card { background : var ( - - bg - off ) ; border-radius : var ( - - radius ) ; padding : 40 px 36 px ; }
. step-number { display : inline-flex ; align-items : center ; justify-content : center ; width : 48 px ; height : 48 px ; background : var ( - - blue ) ; color : #fff ; border-radius : 50 % ; font-size : 1.375 rem ; font-weight : 900 ; margin-bottom : 24 px ; }
. step-card h3 { color : var ( - - text ) ; margin-bottom : 12 px ; }
. step-card p { color : var ( - - text - muted ) ; font-size : .9625 rem ; line-height : 1.6 ; }
/* Missions */
. missions-grid { display : grid ; grid-template-columns : repeat ( 3 , 1 fr ) ; gap : 24 px ; }
. mission-card { background : var ( - - bg ) ; border : 1.5 px solid #E8E8E8 ; border-radius : var ( - - radius ) ; padding : 32 px 28 px ; }
. mission-card : hover { border-color : rgba ( 0 , 102 , 255 , .25 ) ; }
. mission-icon { width : 52 px ; height : 52 px ; display : flex ; align-items : center ; justify-content : center ; background : var ( - - bg - off ) ; border-radius : 14 px ; margin-bottom : 20 px ; color : var ( - - blue ) ; }
. mission-card h3 { color : var ( - - text ) ; margin-bottom : 10 px ; font-size : 1.125 rem ; }
. mission-card p { color : var ( - - text - muted ) ; font-size : .9 rem ; line-height : 1.55 ; margin-bottom : 18 px ; }
. mission-chip { display : inline-block ; background : var ( - - blue - pale ) ; color : var ( - - blue ) ; border-radius : 100 px ; padding : 5 px 14 px ; font-size : .875 rem ; font-weight : 700 ; }
/* Earnings */
. earnings-grid { display : grid ; grid-template-columns : repeat ( 3 , 1 fr ) ; gap : 24 px ; margin-bottom : 48 px ; }
. tier-card { background : var ( - - bg - off ) ; border : 2 px solid #E8E8E8 ; border-radius : var ( - - radius ) ; padding : 36 px 28 px ; text-align : center ; }
. tier-card . featured { background : var ( - - bg - off ) ; border-color : var ( - - blue ) ; transform : scale ( 1.03 ) ; }
. tier-card h3 { font-size : 1.5 rem ; font-weight : 900 ; margin-bottom : 4 px ; }
. tier-missions { font-size : .9 rem ; color : var ( - - text - muted ) ; margin-bottom : 20 px ; font-weight : 500 ; }
. tier-features { text-align : left ; list-style : none ; }
. tier-features li { display : flex ; align-items : flex-start ; gap : 10 px ; font-size : 1 rem ; color : var ( - - text - body ) ; padding : 6 px 0 ; }
. tier-features li :: before { content : '✓' ; display : block ; width : 18 px ; height : 18 px ; min-width : 18 px ; background : var ( - - green ) ; color : #fff ; border-radius : 50 % ; text-align : center ; line-height : 18 px ; font-size : .75 rem ; margin-top : 2 px ; }
/* Landvex Authorization */
# landvex { background : var ( - - bg - off ) ; }
. auth-grid { display : grid ; grid-template-columns : 1 fr 1 fr ; gap : 48 px ; align-items : center ; }
. auth-visual { background : linear-gradient ( 135 deg , var ( - - blue ) 0 % , var ( - - blue - dark ) 100 % ) ; border-radius : var ( - - radius ) ; padding : 48 px ; color : #fff ; }
. auth-visual h3 { color : #fff ; margin-bottom : 16 px ; }
. auth-visual p { color : rgba ( 255 , 255 , 255 , .85 ) ; line-height : 1.6 ; margin-bottom : 24 px ; }
. auth-benefits { list-style : none ; }
. auth-benefits li { display : flex ; align-items : center ; gap : 12 px ; padding : 10 px 0 ; color : rgba ( 255 , 255 , 255 , .9 ) ; }
. auth-benefits li :: before { content : '★' ; color : #FFD700 ; }
. auth-steps { display : flex ; flex-direction : column ; gap : 20 px ; }
. auth-step { display : flex ; gap : 16 px ; align-items : flex-start ; }
. auth-step-num { width : 36 px ; height : 36 px ; border-radius : 50 % ; background : var ( - - blue ) ; color : #fff ; display : flex ; align-items : center ; justify-content : center ; font-weight : 800 ; flex-shrink : 0 ; }
. auth-step h4 { font-size : 1 rem ; font-weight : 700 ; color : var ( - - text ) ; margin-bottom : 4 px ; }
. auth-step p { font-size : .875 rem ; color : var ( - - text - muted ) ; line-height : 1.5 ; }
/* FAQ */
. faq-list { max-width : 760 px ; margin : 0 auto ; }
. faq-item { border : 1.5 px solid #E8E8E8 ; border-radius : 14 px ; margin-bottom : 12 px ; overflow : hidden ; }
. faq-item summary { cursor : pointer ; display : flex ; align-items : center ; justify-content : space-between ; padding : 22 px 28 px ; font-size : 1 rem ; font-weight : 700 ; color : var ( - - text ) ; list-style : none ; gap : 16 px ; }
. faq-item summary :: -webkit-details-marker { display : none ; }
. faq-item summary :: after { content : '+' ; font-size : 1.5 rem ; color : var ( - - blue ) ; transition : transform .15 s ; }
. faq-item [ open ] summary :: after { content : '− ; }
. faq-answer { padding : 0 28 px 24 px ; font-size : .9625 rem ; color : var ( - - text - body ) ; line-height : 1.7 ; }
/* Footer */
footer { background : var ( - - bg - off ) ; border-top : 1 px solid rgba ( 58 , 58 , 58 , .07 ) ; padding : 64 px 0 40 px ; }
. footer-inner { display : grid ; grid-template-columns : 2 fr 1 fr 1 fr 1 fr ; gap : 48 px ; margin-bottom : 56 px ; }
. footer-brand . nav-logo { display : block ; margin-bottom : 14 px ; font-size : 1.5 rem ; }
. footer-tagline { color : rgba ( 58 , 58 , 58 , .75 ) ; font-size : .9 rem ; line-height : 1.55 ; margin-bottom : 20 px ; }
. footer-col h4 { color : var ( - - text ) ; font-size : .875 rem ; font-weight : 800 ; letter-spacing : .06 em ; text-transform : uppercase ; margin-bottom : 18 px ; }
. footer-col ul { list-style : none ; }
. footer-col ul li { margin-bottom : 10 px ; }
. footer-col ul li a { color : rgba ( 58 , 58 , 58 , .75 ) ; font-size : .9 rem ; text-decoration : none ; transition : color .15 s ; }
. footer-col ul li a : hover { color : var ( - - text ) ; }
. footer-bottom { display : flex ; align-items : center ; justify-content : space-between ; gap : 24 px ; flex-wrap : wrap ; padding-top : 32 px ; border-top : 1 px solid rgba ( 58 , 58 , 58 , .07 ) ; }
. footer-copyright { color : rgba ( 58 , 58 , 58 , .6 ) ; font-size : .875 rem ; }
. lang-switcher { display : flex ; align-items : center ; gap : 4 px ; flex-wrap : wrap ; }
. lang-switcher a { color : rgba ( 58 , 58 , 58 , .75 ) ; font-size : .875 rem ; font-weight : 600 ; padding : 4 px 8 px ; border-radius : 8 px ; text-decoration : none ; transition : color .15 s , background .15 s ; }
. lang-switcher a : hover { color : var ( - - text ) ; background : rgba ( 58 , 58 , 58 , .07 ) ; }
. lang-switcher a . active { color : var ( - - text ) ; background : rgba ( 0 , 102 , 255 , .25 ) ; }
/* Responsive */
@ media ( max-width : 960px ) {
. hero-layout { grid-template-columns : 1 fr ; gap : 40 px ; }
. auth-grid { grid-template-columns : 1 fr ; }
. footer-inner { grid-template-columns : 1 fr 1 fr ; }
}
@ media ( max-width : 768px ) {
. steps-grid , . missions-grid , . earnings-grid { grid-template-columns : 1 fr ; }
. stats-grid { grid-template-columns : repeat ( 2 , 1 fr ) ; }
. nav-links { display : none ; }
. footer-inner { grid-template-columns : 1 fr ; }
. footer-bottom { flex-direction : column ; align-items : flex-start ; }
}
@ media ( max-width : 600px ) {
. wl-row { flex-direction : column ; align-items : stretch ; }
. wl-input { min-width : 0 ; }
. hero-stats-pill { flex-wrap : wrap ; gap : 16 px 24 px ; }
}
< / style >
2026-07-14 09:58:53 +00:00
< script type = "module" src = "https://auth.quixzoom.com/site-auth-snippet.js" > < / script >
2026-07-08 10:27:21 +00:00
< / head >
< body >
< a href = "#main-content" style = "position:absolute;top:-100px;left:16px;background:var(--blue);color:#fff;padding:10px 20px;border-radius:0 0 8px 8px;font-weight:700;font-size:.9rem;z-index:9999;" onfocus = "this.style.top='0'" onblur = "this.style.top='-100px'" > Skip to main content< / a >
< nav >
< div class = "container" >
< div class = "nav-inner" >
< a href = "/" class = "nav-logo" > qui< span class = "x" > X< / span > zoom< / a >
< div class = "nav-links" >
< a href = "#how" > {{NAV_HOW}}< / a >
< a href = "#missions" > {{NAV_MISSIONS}}< / a >
< a href = "#earnings" > {{NAV_EARNINGS}}< / a >
< a href = "#landvex" > {{NAV_LANDVEX}}< / a >
< a href = "#faq" > {{NAV_FAQ}}< / a >
< / div >
< div style = "display:flex;align-items:center;gap:10px;flex-shrink:0" >
< button class = "btn-nav" onclick = "document.getElementById('wl-email').focus();document.getElementById('wl-email').scrollIntoView({behavior:'smooth'})" > {{CTA_START}}< / button >
< / div >
< / div >
< / div >
< / nav >
< main id = "main-content" >
<!-- HERO -->
< section id = "hero" >
< div class = "container" >
< div class = "hero-layout" >
< div class = "hero-inner" >
< div class = "hero-badge" > {{HERO_BADGE}}< / div >
< h1 class = "hero-h1" > {{HERO_H1}}< br > < em > {{HERO_H1_EMPH}}< / em > < / h1 >
< p class = "hero-sub" > {{HERO_SUB}}< / p >
< form onsubmit = "event.preventDefault();" novalidate >
< div class = "wl-row" >
< input type = "email" id = "wl-email" class = "wl-input" placeholder = "{{EMAIL_PLACEHOLDER}}" required autocomplete = "email" >
< button type = "submit" class = "wl-submit" > {{CTA_START}} →< / button >
< / div >
< / form >
< p class = "wl-trust" > {{TRUST_LINE}}< / p >
< div class = "hero-stats-pill" >
< div class = "hstat" >
< div class = "hstat-num" > {{STAT1_NUM}}< / div >
< div class = "hstat-lbl" > {{STAT1_LBL}}< / div >
< / div >
< div class = "hstat" >
< div class = "hstat-num" > {{STAT2_NUM}}< / div >
< div class = "hstat-lbl" > {{STAT2_LBL}}< / div >
< / div >
< div class = "hstat" >
< div class = "hstat-num" > {{STAT3_NUM}}< / div >
< div class = "hstat-lbl" > {{STAT3_LBL}}< / div >
< / div >
< / div >
< / div >
< div class = "hero-visual" style = "display:flex;justify-content:center;align-items:center;" >
< div style = "width:240px;height:480px;background:var(--bg-off);border-radius:36px;border:2px solid rgba(58,58,58,.12);box-shadow:0 40px 80px rgba(0,0,0,.6);position:relative;overflow:hidden;" >
< div style = "position:absolute;top:0;left:50%;transform:translateX(-50%);width:80px;height:24px;background:var(--bg-off);border-radius:0 0 16px 16px;z-index:10;" > < / div >
< div style = "position:absolute;inset:0;background:linear-gradient(160deg,#1a2535 0%,#1e3a2f 40%,#162030 100%);border-radius:34px;overflow:hidden;display:flex;flex-direction:column;" >
< div style = "height:40px;background:#f5f5f5;display:flex;align-items:flex-end;justify-content:space-between;padding:0 16px 6px;" >
< span style = "color:rgba(58,58,58,.9);font-size:.65rem;font-weight:700;" > 09:41< / span >
< / div >
< div style = "flex:1;position:relative;overflow:hidden;" >
< div style = "position:absolute;bottom:0;left:0;right:0;background:#fff;border-radius:20px 20px 0 0;padding:16px;box-shadow:0 -4px 24px rgba(0,0,0,.3);" >
< div style = "font-size:.7rem;font-weight:800;color:var(--text);margin-bottom:2px;" > {{PHONE_MISSION}}< / div >
< div style = "font-size:.6rem;color:#3d3d3d;margin-bottom:8px;" > {{PHONE_ADDR}}< / div >
< div style = "display:flex;justify-content:space-between;align-items:center;" >
< div >
< div style = "font-size:.85rem;font-weight:900;color:#0066FF;" > {{PHONE_REWARD}}< / div >
< div style = "font-size:.58rem;color:#4a4a4a;margin-top:4px;" > {{PHONE_META}}< / div >
< / div >
< button style = "background:#0066FF;color:#fff;border:none;border-radius:12px;padding:6px 12px;font-size:.6rem;font-weight:700;" > Claim →< / button >
< / div >
< / div >
< / div >
< / div >
< / div >
< / div >
< / div >
< / div >
< / section >
<!-- STATS -->
< section id = "stats" >
< div class = "container" >
< div class = "stats-grid" >
< div class = "stat-item" >
< span class = "stat-value" > {{STATS_1_VAL}}< / span >
< span class = "stat-label" > {{STATS_1_LBL}}< / span >
< / div >
< div class = "stat-item" >
< span class = "stat-value" > {{STATS_2_VAL}}< / span >
< span class = "stat-label" > {{STATS_2_LBL}}< / span >
< / div >
< div class = "stat-item" >
< span class = "stat-value" > {{STATS_3_VAL}}< / span >
< span class = "stat-label" > {{STATS_3_LBL}}< / span >
< / div >
< div class = "stat-item" >
< span class = "stat-value" > {{STATS_4_VAL}}< / span >
< span class = "stat-label" > {{STATS_4_LBL}}< / span >
< / div >
< / div >
< / div >
< / section >
<!-- HOW IT WORKS -->
< section id = "how" class = "section-pad" >
< div class = "container" >
< div class = "section-header" >
< h2 > {{HOW_TITLE}}< / h2 >
< p > {{HOW_SUB}}< / p >
< / div >
< div class = "steps-grid" >
< div class = "step-card" >
< div class = "step-number" > 1< / div >
< h3 > {{STEP1_TITLE}}< / h3 >
< p > {{STEP1_DESC}}< / p >
< / div >
< div class = "step-card" >
< div class = "step-number" > 2< / div >
< h3 > {{STEP2_TITLE}}< / h3 >
< p > {{STEP2_DESC}}< / p >
< / div >
< div class = "step-card" >
< div class = "step-number" > 3< / div >
< h3 > {{STEP3_TITLE}}< / h3 >
< p > {{STEP3_DESC}}< / p >
< / div >
< / div >
< / div >
< / section >
<!-- MISSIONS -->
< section id = "missions" class = "section-pad" style = "background:var(--bg-off);" >
< div class = "container" >
< div class = "section-header" >
< h2 > {{MISSIONS_TITLE}}< / h2 >
< p > {{MISSIONS_SUB}}< / p >
< / div >
< div class = "missions-grid" >
< div class = "mission-card" >
< div class = "mission-icon" > 📷< / div >
< h3 > {{M1_TITLE}}< / h3 >
< p > {{M1_DESC}}< / p >
< span class = "mission-chip" > {{M1_CHIP}}< / span >
< / div >
< div class = "mission-card" >
< div class = "mission-icon" > 🏢< / div >
< h3 > {{M2_TITLE}}< / h3 >
< p > {{M2_DESC}}< / p >
< span class = "mission-chip" > {{M2_CHIP}}< / span >
< / div >
< div class = "mission-card" >
< div class = "mission-icon" > 🛣️< / div >
< h3 > {{M3_TITLE}}< / h3 >
< p > {{M3_DESC}}< / p >
< span class = "mission-chip" > {{M3_CHIP}}< / span >
< / div >
< / div >
< / div >
< / section >
<!-- EARNINGS -->
< section id = "earnings" class = "section-pad" >
< div class = "container" >
< div class = "section-header" >
< h2 > {{EARNINGS_TITLE}}< / h2 >
< p > {{EARNINGS_SUB}}< / p >
< / div >
< div class = "earnings-grid" >
< div class = "tier-card" >
< h3 > {{TIER1_NAME}}< / h3 >
< div class = "tier-missions" > {{TIER1_MISSIONS}}< / div >
< ul class = "tier-features" >
< li > {{TIER1_F1}}< / li >
< li > {{TIER1_F2}}< / li >
< li > {{TIER1_F3}}< / li >
< / ul >
< / div >
< div class = "tier-card featured" >
< h3 > {{TIER2_NAME}}< / h3 >
< div class = "tier-missions" > {{TIER2_MISSIONS}}< / div >
< ul class = "tier-features" >
< li > {{TIER2_F1}}< / li >
< li > {{TIER2_F2}}< / li >
< li > {{TIER2_F3}}< / li >
< / ul >
< / div >
< div class = "tier-card" >
< h3 > {{TIER3_NAME}}< / h3 >
< div class = "tier-missions" > {{TIER3_MISSIONS}}< / div >
< ul class = "tier-features" >
< li > {{TIER3_F1}}< / li >
< li > {{TIER3_F2}}< / li >
< li > {{TIER3_F3}}< / li >
< / ul >
< / div >
< / div >
< / div >
< / section >
<!-- LANDVEX AUTHORIZATION -->
< section id = "landvex" class = "section-pad" >
< div class = "container" >
< div class = "section-header" >
< h2 > {{AUTH_TITLE}}< / h2 >
< p > {{AUTH_SUB}}< / p >
< / div >
< div class = "auth-grid" >
< div class = "auth-visual" >
< h3 > {{AUTH_VISUAL_TITLE}}< / h3 >
< p > {{AUTH_VISUAL_DESC}}< / p >
< ul class = "auth-benefits" >
< li > {{AUTH_B1}}< / li >
< li > {{AUTH_B2}}< / li >
< li > {{AUTH_B3}}< / li >
< li > {{AUTH_B4}}< / li >
< / ul >
< / div >
< div class = "auth-steps" >
< div class = "auth-step" >
< div class = "auth-step-num" > 1< / div >
< div >
< h4 > {{AUTH_S1_TITLE}}< / h4 >
< p > {{AUTH_S1_DESC}}< / p >
< / div >
< / div >
< div class = "auth-step" >
< div class = "auth-step-num" > 2< / div >
< div >
< h4 > {{AUTH_S2_TITLE}}< / h4 >
< p > {{AUTH_S2_DESC}}< / p >
< / div >
< / div >
< div class = "auth-step" >
< div class = "auth-step-num" > 3< / div >
< div >
< h4 > {{AUTH_S3_TITLE}}< / h4 >
< p > {{AUTH_S3_DESC}}< / p >
< / div >
< / div >
< div class = "auth-step" >
< div class = "auth-step-num" > 4< / div >
< div >
< h4 > {{AUTH_S4_TITLE}}< / h4 >
< p > {{AUTH_S4_DESC}}< / p >
< / div >
< / div >
< div style = "margin-top:8px;" >
< a href = "https://www.quixzoom.com/authorization" class = "btn-nav" style = "display:inline-block;text-decoration:none;" > {{AUTH_CTA}}< / a >
< / div >
< / div >
< / div >
< / div >
< / section >
<!-- FAQ -->
< section id = "faq" class = "section-pad" style = "background:var(--bg);" >
< div class = "container" >
< div class = "section-header" >
< h2 > {{FAQ_TITLE}}< / h2 >
< p > {{FAQ_SUB}}< / p >
< / div >
< div class = "faq-list" >
< details class = "faq-item" >
< summary > {{FAQ_Q1}}< / summary >
< div class = "faq-answer" > {{FAQ_A1}}< / div >
< / details >
< details class = "faq-item" >
< summary > {{FAQ_Q2}}< / summary >
< div class = "faq-answer" > {{FAQ_A2}}< / div >
< / details >
< details class = "faq-item" >
< summary > {{FAQ_Q3}}< / summary >
< div class = "faq-answer" > {{FAQ_A3}}< / div >
< / details >
< details class = "faq-item" >
< summary > {{FAQ_Q4}}< / summary >
< div class = "faq-answer" > {{FAQ_A4}}< / div >
< / details >
< details class = "faq-item" >
< summary > {{FAQ_Q5}}< / summary >
< div class = "faq-answer" > {{FAQ_A5}}< / div >
< / details >
< / div >
< / div >
< / section >
< / main >
<!-- FOOTER -->
< footer >
< div class = "container" >
< div class = "footer-inner" >
< div class = "footer-brand" >
< a href = "/" class = "nav-logo" > qui< span class = "x" > X< / span > zoom< / a >
< p class = "footer-tagline" > {{FOOTER_TAGLINE}}< / p >
< / div >
< div class = "footer-col" >
< h4 > {{FOOTER_COL1_TITLE}}< / h4 >
< ul >
< li > < a href = "#how" > {{FOOTER_COL1_L1}}< / a > < / li >
< li > < a href = "#missions" > {{FOOTER_COL1_L2}}< / a > < / li >
< li > < a href = "#earnings" > {{FOOTER_COL1_L3}}< / a > < / li >
< li > < a href = "#landvex" > {{FOOTER_COL1_L4}}< / a > < / li >
< / ul >
< / div >
< div class = "footer-col" >
< h4 > {{FOOTER_COL2_TITLE}}< / h4 >
< ul >
< li > < a href = "https://www.quixzoom.com/for-organisations" > {{FOOTER_COL2_L1}}< / a > < / li >
< li > < a href = "https://www.quixzoom.com/pricing" > {{FOOTER_COL2_L2}}< / a > < / li >
< li > < a href = "https://www.quixzoom.com/developer" > {{FOOTER_COL2_L3}}< / a > < / li >
< / ul >
< / div >
< div class = "footer-col" >
< h4 > {{FOOTER_COL3_TITLE}}< / h4 >
< ul >
< li > < a href = "https://www.quixzoom.com/support" > {{FOOTER_COL3_L1}}< / a > < / li >
< li > < a href = "https://www.quixzoom.com/privacy" > {{FOOTER_COL3_L2}}< / a > < / li >
< li > < a href = "https://www.quixzoom.com/terms" > {{FOOTER_COL3_L3}}< / a > < / li >
< / ul >
< / div >
< / div >
< div class = "footer-bottom" >
< div class = "footer-copyright" > {{COPYRIGHT}}< / div >
< div class = "lang-switcher" >
< span style = "color:rgba(58,58,58,.75);font-size:.875rem;margin-right:4px;" > {{LANG_LABEL}}< / span >
< a href = "/zh-cn/" > 中文< / a >
< a href = "/zh-tw/" > 繁中< / a >
< a href = "/ja/" > 日本語< / a >
< a href = "/ko/" > 한국어< / a >
< a href = "/th/" > ไทย< / a >
< a href = "/vi/" > Tiếng Việt< / a >
< a href = "/id/" > Bahasa< / a >
< a href = "/ms/" > Melayu< / a >
< a href = "/hi/" > हिन्दी< / a >
< a href = "/en/" > EN< / a >
< / div >
< / div >
< / div >
< / footer >
2026-07-14 09:58:53 +00:00
<!-- quiXzoom Mina Sidor - Universal Header Component -->
<!-- Injicera detta i <head> på alla quiXzoom - sajter -->
< style >
. qz-auth-bar {
position : fixed ;
top : 0 ;
left : 0 ;
right : 0 ;
height : 48 px ;
background : #0A0A0A ;
border-bottom : 1 px solid rgba ( 255 , 255 , 255 , 0.1 ) ;
display : flex ;
align-items : center ;
justify-content : space-between ;
padding : 0 20 px ;
z-index : 9999 ;
font-family : - apple-system , BlinkMacSystemFont , 'SF Pro Display' , 'Segoe UI' , Roboto , sans-serif ;
}
. qz-auth-bar . qz-logo {
font-size : 18 px ;
font-weight : 700 ;
color : #fff ;
text-decoration : none ;
letter-spacing : -0.5 px ;
}
. qz-auth-bar . qz-logo span {
color : #007AFF ;
}
. qz-auth-bar . qz-nav {
display : flex ;
gap : 8 px ;
align-items : center ;
}
. qz-auth-bar . qz-btn {
padding : 8 px 16 px ;
border-radius : 8 px ;
font-size : 14 px ;
font-weight : 500 ;
cursor : pointer ;
transition : all 0.2 s ;
border : none ;
text-decoration : none ;
}
. qz-auth-bar . qz-btn-primary {
background : #007AFF ;
color : white ;
}
. qz-auth-bar . qz-btn-primary : hover {
background : #0056CC ;
}
. qz-auth-bar . qz-btn-ghost {
background : transparent ;
color : rgba ( 255 , 255 , 255 , 0.8 ) ;
}
. qz-auth-bar . qz-btn-ghost : hover {
background : rgba ( 255 , 255 , 255 , 0.1 ) ;
color : white ;
}
. qz-auth-bar . qz-user {
display : flex ;
align-items : center ;
gap : 8 px ;
color : white ;
font-size : 14 px ;
}
. qz-auth-bar . qz-avatar {
width : 32 px ;
height : 32 px ;
border-radius : 50 % ;
background : #007AFF ;
display : flex ;
align-items : center ;
justify-content : center ;
font-weight : 600 ;
font-size : 14 px ;
}
. qz-auth-bar . qz-dropdown {
position : relative ;
}
. qz-auth-bar . qz-dropdown-menu {
position : absolute ;
top : 40 px ;
right : 0 ;
background : #1C1C1E ;
border : 1 px solid rgba ( 255 , 255 , 255 , 0.1 ) ;
border-radius : 12 px ;
padding : 8 px ;
min-width : 200 px ;
display : none ;
box-shadow : 0 8 px 32 px rgba ( 0 , 0 , 0 , 0.4 ) ;
}
. qz-auth-bar . qz-dropdown-menu . active {
display : block ;
}
. qz-auth-bar . qz-dropdown-item {
padding : 10 px 12 px ;
border-radius : 8 px ;
color : white ;
text-decoration : none ;
display : flex ;
align-items : center ;
gap : 10 px ;
font-size : 14 px ;
transition : background 0.2 s ;
}
. qz-auth-bar . qz-dropdown-item : hover {
background : rgba ( 255 , 255 , 255 , 0.1 ) ;
}
. qz-auth-bar . qz-dropdown-divider {
height : 1 px ;
background : rgba ( 255 , 255 , 255 , 0.1 ) ;
margin : 8 px 0 ;
}
. qz-auth-bar . qz-balance {
background : rgba ( 0 , 122 , 255 , 0.15 ) ;
color : #007AFF ;
padding : 4 px 10 px ;
border-radius : 6 px ;
font-size : 13 px ;
font-weight : 600 ;
}
@ media ( max-width : 640px ) {
. qz-auth-bar . qz-nav . qz-btn-ghost : not ( . qz-user ) {
display : none ;
}
}
< / style >
< div id = "qz-auth-bar" class = "qz-auth-bar" >
< a href = "https://quixzoom.com" class = "qz-logo" > qui< span > X< / span > zoom< / a >
< div class = "qz-nav" >
< div id = "qz-auth-guest" >
< a href = "https://app.quixzoom.com/login" class = "qz-btn qz-btn-ghost" > Logga in< / a >
< a href = "https://app.quixzoom.com/register" class = "qz-btn qz-btn-primary" > Bli Zoomer< / a >
< / div >
< div id = "qz-auth-user" style = "display:none;" >
< span class = "qz-balance" id = "qz-balance" > $0.00< / span >
< div class = "qz-dropdown" >
< button class = "qz-btn qz-btn-ghost qz-user" onclick = "qzToggleDropdown()" >
< div class = "qz-avatar" id = "qz-avatar" > E< / div >
< span id = "qz-user-name" > Erik< / span >
< svg width = "12" height = "12" viewBox = "0 0 12 12" fill = "none" > < path d = "M2.5 4.5L6 8L9.5 4.5" stroke = "currentColor" stroke-width = "1.5" stroke-linecap = "round" stroke-linejoin = "round" / > < / svg >
< / button >
< div class = "qz-dropdown-menu" id = "qz-dropdown-menu" >
< a href = "https://app.quixzoom.com/dashboard" class = "qz-dropdown-item" >
< svg width = "16" height = "16" viewBox = "0 0 24 24" fill = "none" stroke = "currentColor" stroke-width = "2" > < rect x = "3" y = "3" width = "7" height = "7" rx = "1" / > < rect x = "14" y = "3" width = "7" height = "7" rx = "1" / > < rect x = "14" y = "14" width = "7" height = "7" rx = "1" / > < rect x = "3" y = "14" width = "7" height = "7" rx = "1" / > < / svg >
Dashboard
< / a >
< a href = "https://app.quixzoom.com/wallet" class = "qz-dropdown-item" >
< svg width = "16" height = "16" viewBox = "0 0 24 24" fill = "none" stroke = "currentColor" stroke-width = "2" > < path d = "M21 12V7H5a2 2 0 0 1 0-4h14v4" / > < path d = "M3 5v14a2 2 0 0 0 2 2h16v-5" / > < path d = "M18 12a2 2 0 0 0 0 4h4v-4h-4z" / > < / svg >
Plånbok
< / a >
< a href = "https://app.quixzoom.com/missions" class = "qz-dropdown-item" >
< svg width = "16" height = "16" viewBox = "0 0 24 24" fill = "none" stroke = "currentColor" stroke-width = "2" > < path d = "M12 2L2 7l10 5 10-5-10-5z" / > < path d = "M2 17l10 5 10-5" / > < path d = "M2 12l10 5 10-5" / > < / svg >
Mina uppdrag
< / a >
< div class = "qz-dropdown-divider" > < / div >
< a href = "https://app.quixzoom.com/settings" class = "qz-dropdown-item" >
< svg width = "16" height = "16" viewBox = "0 0 24 24" fill = "none" stroke = "currentColor" stroke-width = "2" > < circle cx = "12" cy = "12" r = "3" / > < path d = "M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1 0 2.83 2 2 0 0 1-2.83 0l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-2 2 2 2 0 0 1-2-2v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83 0 2 2 0 0 1 0-2.83l.06-.06A1.65 1.65 0 0 0 4.67 15a1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1-2-2 2 2 0 0 1 2-2h.09A1.65 1.65 0 0 0 4.67 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 0-2.83 2 2 0 0 1 2.83 0l.06.06A1.65 1.65 0 0 0 9 4.67a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 2-2 2 2 0 0 1 2 2v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 0 2 2 0 0 1 0 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 2 2 2 2 0 0 1-2 2h-.09a1.65 1.65 0 0 0-1.51 1z" / > < / svg >
Inställningar
< / a >
< a href = "#" onclick = "qzLogout(); return false;" class = "qz-dropdown-item" >
< svg width = "16" height = "16" viewBox = "0 0 24 24" fill = "none" stroke = "currentColor" stroke-width = "2" > < path d = "M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4" / > < polyline points = "16 17 21 12 16 7" / > < line x1 = "21" y1 = "12" x2 = "9" y2 = "12" / > < / svg >
Logga ut
< / a >
< / div >
< / div >
< / div >
< / div >
< / div >
< script >
( function ( ) {
const SSO _BASE = 'https://auth.quixzoom.com' ;
const APP _BASE = 'https://app.quixzoom.com' ;
// Check auth status
async function qzCheckAuth ( ) {
try {
const res = await fetch ( SSO _BASE + '/auth/check' , {
credentials : 'include' ,
} ) ;
if ( res . ok ) {
const data = await res . json ( ) ;
if ( data . authenticated ) {
document . getElementById ( 'qz-auth-guest' ) . style . display = 'none' ;
document . getElementById ( 'qz-auth-user' ) . style . display = 'flex' ;
document . getElementById ( 'qz-user-name' ) . textContent = data . user . name || data . user . email ;
document . getElementById ( 'qz-avatar' ) . textContent = ( data . user . name || data . user . email ) [ 0 ] . toUpperCase ( ) ;
if ( data . user . balance !== undefined ) {
document . getElementById ( 'qz-balance' ) . textContent = '$' + data . user . balance . toFixed ( 2 ) ;
}
}
}
} catch ( e ) {
// Silent fail - show guest state
}
}
// Toggle dropdown
window . qzToggleDropdown = function ( ) {
document . getElementById ( 'qz-dropdown-menu' ) . classList . toggle ( 'active' ) ;
} ;
// Close dropdown on outside click
document . addEventListener ( 'click' , function ( e ) {
if ( ! e . target . closest ( '.qz-dropdown' ) ) {
document . getElementById ( 'qz-dropdown-menu' ) . classList . remove ( 'active' ) ;
}
} ) ;
// Logout
window . qzLogout = async function ( ) {
try {
await fetch ( SSO _BASE + '/auth/logout' , {
method : 'POST' ,
credentials : 'include' ,
} ) ;
} catch ( e ) { }
document . cookie = 'qz_access_token=; expires=Thu, 01 Jan 1970 00:00:00 UTC; domain=.quixzoom.com; path=/;' ;
document . cookie = 'qz_refresh_token=; expires=Thu, 01 Jan 1970 00:00:00 UTC; domain=.quixzoom.com; path=/;' ;
window . location . reload ( ) ;
} ;
// Init
qzCheckAuth ( ) ;
} ) ( ) ;
< / script >
2026-07-08 10:27:21 +00:00
< / body >
< / html >
