CyclingDestination.cc \u2013 Vind jouw fietsbestemming<\/title>\n\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Montserrat:wght@600;700&family=Open+Sans:wght@400;600&display=swap\" rel=\"stylesheet\">\n\n<style>\n :root{\n --cd-bg:#0f0f10; \/* dark page bg *\/\n --cd-surface:#141417;\n --cd-card:#0b0b0c;\n --cd-text:#ffffff; \/* white text on dark *\/\n --cd-muted:#cfd0d4; \/* valid muted *\/\n --cd-yellow:#F2B82F; \/* your yellow *\/\n --cd-yellow-d:#d4a900;\n --cd-border:#26272d;\n --cd-focus:#7cc3ff;\n --cd-max:1200px;\n --cd-r:18px;\n --cd-shadow:0 10px 28px rgba(0,0,0,.45);\n --space-xl:72px;\n --space-lg:44px;\n --space-md:24px;\n}\n\n *{box-sizing:border-box}\n html,body{margin:0;background:var(--cd-bg);color:var(--cd-text);\n font-family:\"Open Sans\",system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;line-height:1.65}\n h1,h2,h3{font-family:\"Montserrat\",system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;margin:0 0 10px;line-height:1.2}\n p{margin:0 0 12px}\n a{color:inherit;text-decoration:none}\n .wrap{max-width:var(--cd-max);margin:0 auto;padding:0 var(--space-md)}\n .section{padding:var(--space-xl) 0;border-top:1px solid var(--cd-border)}\n .spacious{margin-top:var(--space-lg)}\n\n \/* Buttons \u2013 always very visible *\/\n .btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;\n padding:16px 24px;border-radius:16px;font-weight:900;letter-spacing:.2px;border:2px solid #00000020;\n background:var(--cd-yellow);color:#111;cursor:pointer;box-shadow:var(--cd-shadow);\n transition:transform .08s ease, box-shadow .2s ease, background .15s ease, border-color .15s ease}\n .btn:hover{background:var(--cd-yellow-d);transform:translateY(-1px)}\n .btn:active{transform:translateY(0)}\n .btn:focus-visible{outline:3px solid var(--cd-focus);outline-offset:3px}\n .btn-lg{padding:18px 28px;font-size:1.05rem}\n\n \/* HERO *\/\n .hero{position:relative;min-height:72vh;display:grid;place-items:center;overflow:hidden}\n .hero-bg{position:absolute;inset:0;background:\n radial-gradient(60% 60% at 50% 30%, rgba(0,0,0,.25) 0%, rgba(0,0,0,.7) 100%),\n \n url('https:\/\/cyclingdestination.cc\/wp-content\/uploads\/2022\/05\/DSCF5215-scaled.jpg?auto=format&fit=crop&w=1800&q=70') center\/cover no-repeat}\n .hero-panel{position:relative;z-index:1;background:rgba(12,12,14,.6);\n border:1px solid var(--cd-border);backdrop-filter:saturate(1.15) blur(3px);\n border-radius:26px;box-shadow:var(--cd-shadow);padding:40px 28px;text-align:center;width:min(96%,960px)}\n .hero h1{font-size:clamp(30px,5vw,50px);margin-bottom:6px}\n .hero p{color:var(--cd-muted);font-size:clamp(16px,2.4vw,18px);margin-bottom:20px}\n .hero-cta{display:flex;flex-wrap:wrap;gap:16px;justify-content:center}\n\n \/* HOW IT WORKS *\/\n .how{\n background:linear-gradient(180deg, #F2B82F 0%, #f7cf74 100%);\n}\n .how-grid{display:grid;gap:18px}\n @media(min-width:900px){.how-grid{grid-template-columns:repeat(3,1fr)}}\n .how-card{background:var(--cd-surface);border:1px solid var(--cd-border);border-radius:var(--cd-r);padding:22px;box-shadow:var(--cd-shadow)}\n .how-ico{font-size:22px;margin-bottom:6px}\n .how p{color:var(--cd-muted)}\n\n \/* QUIZ *\/\n .quiz{background:#0d0e11}\n .quiz-card{background:var(--cd-surface);border:1px solid var(--cd-border);border-radius:22px;padding:22px;box-shadow:var(--cd-shadow)}\n .progress{height:8px;background:#2b2c31;border-radius:999px;overflow:hidden;margin:4px 0 18px}\n .progress>span{display:block;height:100%;width:0;background:var(--cd-yellow)}\n .qstep[hidden]{display:none}\n .qgrid{display:grid;gap:14px;margin-top:10px}\n @media(min-width:860px){.qgrid{grid-template-columns:repeat(4,1fr)}}\n .opt{display:flex;align-items:center;justify-content:center;text-align:center;padding:16px;border-radius:14px;\n background:#0a0b0d;border:2px solid #3a3b42;color:#fff;font-weight:800;box-shadow:var(--cd-shadow);cursor:pointer}\n .opt:hover{border-color:#6a6b74}\n .opt[aria-pressed=\"true\"]{background:#1a1600;border-color:var(--cd-yellow);box-shadow:0 0 0 4px #f0c40030 inset}\n .quiz-actions{display:flex;gap:12px;justify-content:flex-end;margin-top:16px}\n .quiz-actions .btn[disabled]{opacity:.5;cursor:not-allowed;transform:none;box-shadow:none}\n\n \/* RESULTS & LATEST *\/\n .cards{display:grid;gap:18px}\n @media(min-width:1000px){.cards{grid-template-columns:repeat(3,1fr)}}\n .card{background:var(--cd-card);border:1px solid var(--cd-border);border-radius:18px;overflow:hidden;box-shadow:var(--cd-shadow);display:flex;flex-direction:column}\n .card-img{aspect-ratio:16\/9;background:#1b1c21;background-size:cover;background-position:center}\n .card-body{padding:16px;display:grid;gap:10px}\n .meta{color:var(--cd-text);font-size: 18px}\n<\/style>\n<\/head>\n<body>\n\n\n<header class=\"hero\" role=\"banner\">\n <div class=\"hero-bg\" aria-hidden=\"true\"><\/div>\n <div class=\"hero-panel\">\n <h1>Vind jouw volgende fietsavontuur!<\/h1>\n <p>We matchen je met regio\u2019s, routes en overnachtingen die bij jou passen.<\/p>\n <div class=\"hero-cta\">\n <a class=\"btn btn-lg\" href=\"#quiz\" data-preset=\"road\"> Racefiets<\/a>\n <a class=\"btn btn-lg\" href=\"#quiz\" data-preset=\"gravel\"> Gravelbiker<\/a>\n <a class=\"btn btn-lg\" href=\"#quiz\" data-preset=\"mountainbike\"> Mountainbiker<\/a>\n <\/div>\n <\/div>\n<\/header>\n\n\n<section class=\"section how\" aria-labelledby=\"how-title\">\n <div class=\"wrap\">\n <h2 id=\"how-title\">Hoe het werkt<\/h2>\n <p class=\"meta\">In minder dan een minuut heb je drie bestemmingen die bij jou passen.<\/p>\n <div class=\"spacious how-grid\">\n <div class=\"how-card\"><div class=\"how-ico\"><\/div><h3>Vertel ons wat je zoekt<\/h3><p>Discipline, terrein, vibe, lengte van jouw trip en welk seizoen.<\/p><\/div>\n <div class=\"how-card\"><div class=\"how-ico\">\ufe0f<\/div><h3>Wij matchen jou met jouw bestemming <\/h3><p>Routes, overnachten en to-do\u2019s in 3 kaarten.<\/p><\/div>\n <div class=\"how-card\"><div class=\"how-ico\"><\/div><h3>Jij gaat op avontuur<\/h3><p>Kies je plek, plan je ritten, ga genieten.<\/p><\/div>\n <\/div>\n <\/div>\n<\/section>\n\n\n<section id=\"quiz\" class=\"section quiz\" aria-labelledby=\"quiz-title\">\n <div class=\"wrap\">\n <h2 id=\"quiz-title\"> Start jouw fietsavontuur hier<\/h2>\n <div class=\"spacious quiz-card\">\n <div class=\"progress\"><span id=\"qbar\"><\/span><\/div>\n\n \n <div class=\"qstep\" data-q=\"discipline\">\n <h3>Welke fiets kies je voor jouw volgende avontuur?<\/h3>\n <div class=\"qgrid\" role=\"group\" aria-label=\"Discipline\">\n <button class=\"opt\" data-value=\"road\">Racefiets<\/button>\n <button class=\"opt\" data-value=\"gravel\">Gravelbike<\/button>\n <button class=\"opt\" data-value=\"mountainbike\">Mountainbike<\/button>\n <\/div>\n <\/div>\n\n \n <div class=\"qstep\" data-q=\"terrain\" hidden>\n <h3>Welk type omgeving zoek je?<\/h3>\n <div class=\"qgrid\" role=\"group\" aria-label=\"Terrein\">\n <button class=\"opt\" data-value=\"flat\">Vlak \/ kust<\/button>\n <button class=\"opt\" data-value=\"rolling\">Heuvels<\/button>\n <button class=\"opt\" data-value=\"mountain\">Bergen<\/button>\n <button class=\"opt\" data-value=\"mixed\">Mix<\/button>\n <\/div>\n <\/div>\n\n \n <div class=\"qstep\" data-q=\"vibe\" data-type=\"multi\" data-max=\"2\" hidden>\n <h3>Welke punten vind je belangrijk voor dit avontuur? (max 2)<\/h3>\n <div class=\"qgrid\" role=\"group\" aria-label=\"Vibe\">\n <button class=\"opt\" data-value=\"scenery\">Omgeving<\/button>\n <button class=\"opt\" data-value=\"challenge\">Uitdaging<\/button>\n <button class=\"opt\" data-value=\"culture-food\">Koffiestops en eten<\/button>\n <button class=\"opt\" data-value=\"family\">Bezienswaardigheden<\/button>\n <button class=\"opt\" data-value=\"remote\">Rust & natuur<\/button>\n <\/div>\n <div class=\"quiz-actions\">\n <button class=\"btn\" data-next disabled>Volgende<\/button>\n <\/div>\n <\/div>\n\n \n <div class=\"qstep\" data-q=\"length\" hidden>\n <h3>Hoelang ga je weg?<\/h3>\n <div class=\"qgrid\" role=\"group\" aria-label=\"Duur\">\n <button class=\"opt\" data-value=\"day-ride\">ik ga \u00e9\u00e9n dagje fietsen<\/button>\n <button class=\"opt\" data-value=\"weekend\">Ik ga een (lang)weekend weg<\/button>\n <button class=\"opt\" data-value=\"week-plus\">Ik ga een week of meer weg<\/button>\n <\/div>\n <\/div>\n\n \n <div class=\"qstep\" data-q=\"season\" hidden>\n <h3>Wanneer wil je gaan?<\/h3>\n <div class=\"qgrid\" role=\"group\" aria-label=\"Seizoen\">\n <button class=\"opt\" data-value=\"spring\">Lente<\/button>\n <button class=\"opt\" data-value=\"summer\">Zomer<\/button>\n <button class=\"opt\" data-value=\"autumn\">Herfst<\/button>\n <button class=\"opt\" data-value=\"winter\">Winter \/ wintersun<\/button>\n <\/div>\n <div class=\"quiz-actions\">\n <button class=\"btn\" data-back>Terug<\/button>\n <button class=\"btn btn-lg\" id=\"showMatches\" disabled>Toon mijn 3 opties<\/button>\n <\/div>\n <\/div>\n <\/div>\n\n \n <div id=\"qresults\" class=\"spacious\" style=\"display:none\">\n <div class=\"wrap\" style=\"padding:0\">\n <div id=\"qsummary\" class=\"meta\" style=\"margin-bottom:14px\"><\/div>\n <div class=\"cards\" id=\"qcards\"><\/div>\n <\/div>\n <\/div>\n <\/div>\n<\/section>\n\n\n<section class=\"section\" aria-labelledby=\"latest-title\">\n <div class=\"wrap\">\n <h2 id=\"latest-title\">Meer inspiratie<\/h2>\n <p class=\"meta\">Nieuwe verhalen om je volgende avontuur te plannen.<\/p>\n <div id=\"latestCards\" class=\"spacious cards\"><\/div>\n <\/div>\n<\/section>\n\n<script>\n\/* ---------- HERO preset ---------- *\/\ndocument.querySelectorAll('[data-preset]').forEach(a=>{\n a.addEventListener('click',()=>{\n document.getElementById('quiz').scrollIntoView({behavior:'smooth'});\n setTimeout(()=>{\n const btn=document.querySelector('.qstep[data-q=\"discipline\"] .opt[data-value=\"'+a.dataset.preset+'\"]');\n btn?.click();\n },140);\n });\n});\n\n\/* ---------- QUIZ FLOW ---------- *\/\n(function(){\n const steps=[...document.querySelectorAll('.qstep')];\n const bar=document.getElementById('qbar');\n const answers={discipline:null, terrain:null, vibe:[], length:null, season:null};\n let idx=0;\n\n function show(i){\n idx=i;\n steps.forEach((s,k)=>s.hidden=k!==i);\n bar.style.width=(i\/(steps.length-1))*100+'%';\n if(steps[i].dataset.q==='season'){\n document.getElementById('showMatches').disabled=!answers.season;\n }\n }\n\n \/\/ \u2705 Moved OUTSIDE show() so all handlers can call it\n function resetQuiz(){\n \/\/ Clear stored answers\n answers.discipline = null;\n answers.terrain = null;\n answers.vibe = [];\n answers.length = null;\n answers.season = null;\n\n \/\/ Unselect all chosen options\n document.querySelectorAll('.opt[aria-pressed=\"true\"]').forEach(el => {\n el.setAttribute('aria-pressed','false');\n });\n\n \/\/ Disable final CTA\n const showBtn = document.getElementById('showMatches');\n if (showBtn) showBtn.disabled = true;\n\n \/\/ Hide previous results & clear summary\/cards\n const out = document.getElementById('qresults');\n if (out) out.style.display = 'none';\n const sum = document.getElementById('qsummary');\n const cards = document.getElementById('qcards');\n if (sum) sum.innerHTML = '';\n if (cards) cards.innerHTML = '';\n\n \/\/ Jump to first step\n show(0);\n }\n\n function setSingle(qnode, value){\n qnode.querySelectorAll('.opt').forEach(x=>x.setAttribute('aria-pressed','false'));\n qnode.querySelector(`.opt[data-value=\"${value}\"]`)?.setAttribute('aria-pressed','true');\n answers[qnode.dataset.q]=value;\n setTimeout(()=>show(Math.min(idx+1,steps.length-1)),240);\n }\n\n function setMulti(qnode, value){\n const max=Number(qnode.dataset.max||2);\n const btn=qnode.querySelector(`.opt[data-value=\"${value}\"]`);\n const on=btn.getAttribute('aria-pressed')==='true';\n if(on){ btn.setAttribute('aria-pressed','false'); }\n else{\n const pressed=[...qnode.querySelectorAll('.opt[aria-pressed=\"true\"]')];\n if(pressed.length>=max){ pressed[0].setAttribute('aria-pressed','false'); }\n btn.setAttribute('aria-pressed','true');\n }\n answers[qnode.dataset.q]=[...qnode.querySelectorAll('.opt[aria-pressed=\"true\"]')].map(x=>x.dataset.value);\n const nextBtn=qnode.querySelector('[data-next]');\n if(nextBtn) nextBtn.disabled=answers[qnode.dataset.q].length===0;\n if(answers[qnode.dataset.q].length===max){ setTimeout(()=>show(idx+1),240); }\n }\n\n steps.forEach((qnode,i)=>{\n const type=qnode.dataset.type||'single';\n qnode.addEventListener('click',(e)=>{\n const opt=e.target.closest('.opt'); if(!opt) return;\n type==='single' ? setSingle(qnode,opt.dataset.value) : setMulti(qnode,opt.dataset.value);\n if(qnode.dataset.q==='season'){\n document.getElementById('showMatches').disabled=!answers.season;\n }\n });\n\n \/\/ \u2705 Single, correct Back handler\n qnode.querySelector('[data-back]')?.addEventListener('click', () => {\n if (i === steps.length - 1) {\n resetQuiz();\n document.getElementById('quiz').scrollIntoView({behavior:'smooth'});\n } else {\n show(Math.max(i - 1, 0));\n }\n });\n });\n\n show(0);\n\n \/* ---------- Dynamic Recommendation Engine (WP tags) ---------- *\/\n function answerSlugs(a){\n const base=[a.discipline,a.terrain,a.length,a.season].filter(Boolean);\n return base.concat(a.vibe||[]);\n }\n\n async function getTagIds(slugs){\n const site=window.location.origin;\n const ids=[]; const unique=[...new Set(slugs.filter(Boolean))];\n for(const s of unique){\n try{\n const r=await fetch(`${site}\/wp-json\/wp\/v2\/tags?slug=${encodeURIComponent(s)}&per_page=1`);\n const j=await r.json();\n if(Array.isArray(j)&&j[0]) ids.push(j[0].id);\n }catch(e){}\n }\n return ids;\n }\n\n async function fetchByTags(tagIds,{types=['posts','pages'],limit=12}={}){\n const site=window.location.origin;\n let items=[];\n for(const t of types){\n try{\n const qs=new URLSearchParams({per_page:String(limit),_embed:'1',order:'desc',orderby:'date'});\n if(tagIds.length) qs.set('tags', tagIds.join(','));\n const r=await fetch(`${site}\/wp-json\/wp\/v2\/${t}?${qs.toString()}`);\n if(!r.ok) continue;\n const j=await r.json();\n items=items.concat(j.map(x=>({...x,__type:t})));\n }catch(e){}\n }\n items.sort((a,b)=>new Date(b.date)-new Date(a.date));\n const seen=new Set(), out=[];\n for(const it of items){\n const key=`${it.__type}:${it.id}`;\n if(!seen.has(key)){ out.push(it); seen.add(key);}\n }\n return out;\n }\n\n function renderWpCard(p){\n const img=p._embedded?.['wp:featuredmedia']?.[0]?.source_url||'';\n const title=(p.title?.rendered||'Lees meer');\n const link=p.link;\n const raw=p.excerpt?.rendered||p.content?.rendered||'';\n const excerpt=raw.replace(\/<[^>]+>\/g,'').slice(0,140);\n return `\n <article class=\"card\">\n <a class=\"card-img\" href=\"${link}\" style=\"background-image:url('${img}')\"><\/a>\n <div class=\"card-body\">\n <h3>${title}<\/h3>\n <div class=\"meta\">${excerpt}${excerpt?'\u2026':''}<\/div>\n <div><a class=\"btn\" href=\"${link}\">Lees meer \u2192<\/a><\/div>\n <\/div>\n <\/article>`;\n }\n\n async function getTopThree(answers){\n const slugsFull=answerSlugs(answers);\n const slugsNoSeason=slugsFull.filter(s=>!['spring','summer','autumn','winter'].includes(s));\n const tiers=[\n slugsFull,\n slugsNoSeason,\n [answers.discipline,answers.terrain].filter(Boolean),\n [answers.discipline].filter(Boolean),\n []\n ];\n let picked=[];\n for(const tier of tiers){\n const ids=await getTagIds(tier);\n const items=await fetchByTags(ids,{types:['posts','pages'],limit:12});\n for(const it of items){\n if(picked.length>=3) break;\n const key=`${it.__type}:${it.id}`;\n if(!picked.find(x=>`${x.__type}:${x.id}`===key)) picked.push(it);\n }\n if(picked.length>=3) break;\n }\n return picked.slice(0,3);\n }\n\n document.getElementById('showMatches').addEventListener('click', async ()=>{\n const sum=document.getElementById('qsummary');\n const cards=document.getElementById('qcards');\n const out=document.getElementById('qresults');\n sum.innerHTML=`Profiel: <strong>${answers.discipline||'\u2014'}<\/strong> \u00b7 ${answers.terrain||'\u2014'} \u00b7 ${(answers.vibe||[]).join(' & ')||'\u2014'} \u00b7 ${answers.length||'\u2014'} \u00b7 ${answers.season||'\u2014'}`;\n cards.innerHTML=`<div class=\"meta\">Zoeken naar de beste matches\u2026<\/div>`;\n out.style.display='block';\n const results=await getTopThree(answers);\n cards.innerHTML = results.length ? results.map(renderWpCard).join('') :\n `<article class=\"card\"><div class=\"card-body\"><h3>Geen directe matches<\/h3><div class=\"meta\">Probeer een ruimere selectie (ander seizoen of terrein).<\/div><\/div><\/article>`;\n out.scrollIntoView({behavior:'smooth',block:'start'});\n });\n})();\n\n\/* ---------- Latest posts via REST (optional) ---------- *\/\n(async function(){\n const target=document.getElementById('latestCards');\n if(!target) return;\n const site=window.location.origin;\n try{\n const r=await fetch(`${site}\/wp-json\/wp\/v2\/posts?per_page=3&_embed=1`);\n const posts=await r.json();\n target.innerHTML=posts.map(p=>{\n const img=p._embedded?.['wp:featuredmedia']?.[0]?.source_url||'';\n const title=p.title?.rendered||'Lees meer';\n const link=p.link;\n const excerpt=(p.excerpt?.rendered||'').replace(\/<[^>]+>\/g,'').slice(0,140);\n return `\n <article class=\"card\">\n <a class=\"card-img\" href=\"${link}\" style=\"background-image:url('${img}')\"><\/a>\n <div class=\"card-body\">\n <h3>${title}<\/h3>\n <div class=\"meta\">${excerpt}\u2026<\/div>\n <div><a class=\"btn\" href=\"${link}\">Lees meer \u2192<\/a><\/div>\n <\/div>\n <\/article>`;\n }).join('');\n }catch(_){\n target.innerHTML='<div class=\"meta\">Kon recente artikelen niet laden.<\/div>';\n }\n})();\n<\/script>\n\n\n<\/body>\n<\/html>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>CyclingDestination.cc \u2013 Vind jouw fietsbestemming Vind jouw volgende fietsavontuur! We matchen je met regio\u2019s, routes en overnachtingen die bij jou passen. Racefiets Gravelbiker Mountainbiker Hoe het werkt In minder dan een minuut heb je drie bestemmingen die bij jou passen. Vertel ons wat je zoekt Discipline, terrein, vibe, lengte van jouw trip en welk seizoen. […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"_acf_changed":false,"iawp_total_views":8,"footnotes":""},"categories":[],"tags":[],"class_list":["post-3195","page","type-page","status-publish","hentry"],"acf":[],"featured_image_url":[],"post_author":"Sander","assigned_categories":"","yoast_head":"\n<title>Test landing page - Cycling Destination<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/cyclingdestination.cc\/de\/test-landing-page\/\" \/>\n<meta property=\"og:locale\" content=\"de_DE\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Test landing page - Cycling Destination\" \/>\n<meta property=\"og:description\" content=\"CyclingDestination.cc \u2013 Vind jouw fietsbestemming Vind jouw volgende fietsavontuur! We matchen je met regio\u2019s, routes en overnachtingen die bij jou passen. Racefiets Gravelbiker Mountainbiker Hoe het werkt In minder dan een minuut heb je drie bestemmingen die bij jou passen. Vertel ons wat je zoekt Discipline, terrein, vibe, lengte van jouw trip en welk seizoen. […]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/cyclingdestination.cc\/de\/test-landing-page\/\" \/>\n<meta property=\"og:site_name\" content=\"Cycling Destination\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/cyclingdestination.cc\" \/>\n<meta property=\"article:modified_time\" content=\"2025-08-14T20:31:12+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/cyclingdestination.cc\/wp-content\/uploads\/2022\/10\/ruben_12102022_cycling_destination_etxeondo_32-scaled.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"2048\" \/>\n\t<meta property=\"og:image:height\" content=\"2560\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:site\" content=\"@cyclingdestin\" \/>\n<meta name=\"twitter:label1\" content=\"Gesch\u00e4tzte Lesezeit\" \/>\n\t<meta name=\"twitter:data1\" content=\"2\u00a0Minuten\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/cyclingdestination.cc\\\/test-landing-page\",\"url\":\"https:\\\/\\\/cyclingdestination.cc\\\/test-landing-page\",\"name\":\"Test landing page - Cycling Destination\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/cyclingdestination.cc\\\/#website\"},\"datePublished\":\"2021-11-24T13:54:12+00:00\",\"dateModified\":\"2025-08-14T20:31:12+00:00\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/cyclingdestination.cc\\\/test-landing-page#breadcrumb\"},\"inLanguage\":\"de\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/cyclingdestination.cc\\\/test-landing-page\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/cyclingdestination.cc\\\/test-landing-page#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/cyclingdestination.cc\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Test landing page\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/cyclingdestination.cc\\\/#website\",\"url\":\"https:\\\/\\\/cyclingdestination.cc\\\/\",\"name\":\"Cycling Destination\",\"description\":\"Inspiratie voor jouw volgende fietsavontuur\",\"publisher\":{\"@id\":\"https:\\\/\\\/cyclingdestination.cc\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/cyclingdestination.cc\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"de\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/cyclingdestination.cc\\\/#organization\",\"name\":\"Cycling Destination\",\"url\":\"https:\\\/\\\/cyclingdestination.cc\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"de\",\"@id\":\"https:\\\/\\\/cyclingdestination.cc\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/cyclingdestination.cc\\\/wp-content\\\/uploads\\\/2022\\\/01\\\/cyclingdestination_logo_RGB_zwart_vDEF-1.png\",\"contentUrl\":\"https:\\\/\\\/cyclingdestination.cc\\\/wp-content\\\/uploads\\\/2022\\\/01\\\/cyclingdestination_logo_RGB_zwart_vDEF-1.png\",\"width\":2550,\"height\":814,\"caption\":\"Cycling Destination\"},\"image\":{\"@id\":\"https:\\\/\\\/cyclingdestination.cc\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/www.facebook.com\\\/cyclingdestination.cc\",\"https:\\\/\\\/x.com\\\/cyclingdestin\",\"https:\\\/\\\/www.instagram.com\\\/cyclingdestination.cc\\\/\"]}]}<\/script>\n","yoast_head_json":{"title":"Test Landing Page - Radfahrziel","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/cyclingdestination.cc\/de\/test-landing-page\/","og_locale":"de_DE","og_type":"article","og_title":"Test landing page - Cycling Destination","og_description":"CyclingDestination.cc \u2013 Vind jouw fietsbestemming Vind jouw volgende fietsavontuur! We matchen je met regio\u2019s, routes en overnachtingen die bij jou passen. Racefiets Gravelbiker Mountainbiker Hoe het werkt In minder dan een minuut heb je drie bestemmingen die bij jou passen. Vertel ons wat je zoekt Discipline, terrein, vibe, lengte van jouw trip en welk seizoen. […]","og_url":"https:\/\/cyclingdestination.cc\/de\/test-landing-page\/","og_site_name":"Cycling Destination","article_publisher":"https:\/\/www.facebook.com\/cyclingdestination.cc","article_modified_time":"2025-08-14T20:31:12+00:00","og_image":[{"width":2048,"height":2560,"url":"https:\/\/cyclingdestination.cc\/wp-content\/uploads\/2022\/10\/ruben_12102022_cycling_destination_etxeondo_32-scaled.jpg","type":"image\/jpeg"}],"twitter_card":"summary_large_image","twitter_site":"@cyclingdestin","twitter_misc":{"Gesch\u00e4tzte Lesezeit":"2\u00a0Minuten"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/cyclingdestination.cc\/test-landing-page","url":"https:\/\/cyclingdestination.cc\/test-landing-page","name":"Test Landing Page - Radfahrziel","isPartOf":{"@id":"https:\/\/cyclingdestination.cc\/#website"},"datePublished":"2021-11-24T13:54:12+00:00","dateModified":"2025-08-14T20:31:12+00:00","breadcrumb":{"@id":"https:\/\/cyclingdestination.cc\/test-landing-page#breadcrumb"},"inLanguage":"de","potentialAction":[{"@type":"ReadAction","target":["https:\/\/cyclingdestination.cc\/test-landing-page"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/cyclingdestination.cc\/test-landing-page#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/cyclingdestination.cc\/"},{"@type":"ListItem","position":2,"name":"Test landing page"}]},{"@type":"WebSite","@id":"https:\/\/cyclingdestination.cc\/#website","url":"https:\/\/cyclingdestination.cc\/","name":"Ziel Radfahren","description":"Inspiration f\u00fcr Ihr n\u00e4chstes Fahrradabenteuer","publisher":{"@id":"https:\/\/cyclingdestination.cc\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/cyclingdestination.cc\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"de"},{"@type":"Organization","@id":"https:\/\/cyclingdestination.cc\/#organization","name":"Ziel Radfahren","url":"https:\/\/cyclingdestination.cc\/","logo":{"@type":"ImageObject","inLanguage":"de","@id":"https:\/\/cyclingdestination.cc\/#\/schema\/logo\/image\/","url":"https:\/\/cyclingdestination.cc\/wp-content\/uploads\/2022\/01\/cyclingdestination_logo_RGB_zwart_vDEF-1.png","contentUrl":"https:\/\/cyclingdestination.cc\/wp-content\/uploads\/2022\/01\/cyclingdestination_logo_RGB_zwart_vDEF-1.png","width":2550,"height":814,"caption":"Cycling Destination"},"image":{"@id":"https:\/\/cyclingdestination.cc\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/cyclingdestination.cc","https:\/\/x.com\/cyclingdestin","https:\/\/www.instagram.com\/cyclingdestination.cc\/"]}]}},"_links":{"self":[{"href":"https:\/\/cyclingdestination.cc\/de\/wp-json\/wp\/v2\/pages\/3195","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/cyclingdestination.cc\/de\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/cyclingdestination.cc\/de\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/cyclingdestination.cc\/de\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/cyclingdestination.cc\/de\/wp-json\/wp\/v2\/comments?post=3195"}],"version-history":[{"count":0,"href":"https:\/\/cyclingdestination.cc\/de\/wp-json\/wp\/v2\/pages\/3195\/revisions"}],"wp:attachment":[{"href":"https:\/\/cyclingdestination.cc\/de\/wp-json\/wp\/v2\/media?parent=3195"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/cyclingdestination.cc\/de\/wp-json\/wp\/v2\/categories?post=3195"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/cyclingdestination.cc\/de\/wp-json\/wp\/v2\/tags?post=3195"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

\n\t\t\t\t

\n\t\t\t\t\t\n\n\n\n\nCyclingDestination.cc \u2013 Vind jouw fietsbestemming<\/title>\n\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Montserrat:wght@600;700&family=Open+Sans:wght@400;600&display=swap\" rel=\"stylesheet\">\n\n<style>\n :root{\n --cd-bg:#0f0f10; \/* dark page bg *\/\n --cd-surface:#141417;\n --cd-card:#0b0b0c;\n --cd-text:#ffffff; \/* white text on dark *\/\n --cd-muted:#cfd0d4; \/* valid muted *\/\n --cd-yellow:#F2B82F; \/* your yellow *\/\n --cd-yellow-d:#d4a900;\n --cd-border:#26272d;\n --cd-focus:#7cc3ff;\n --cd-max:1200px;\n --cd-r:18px;\n --cd-shadow:0 10px 28px rgba(0,0,0,.45);\n --space-xl:72px;\n --space-lg:44px;\n --space-md:24px;\n}\n\n *{box-sizing:border-box}\n html,body{margin:0;background:var(--cd-bg);color:var(--cd-text);\n font-family:\"Open Sans\",system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;line-height:1.65}\n h1,h2,h3{font-family:\"Montserrat\",system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;margin:0 0 10px;line-height:1.2}\n p{margin:0 0 12px}\n a{color:inherit;text-decoration:none}\n .wrap{max-width:var(--cd-max);margin:0 auto;padding:0 var(--space-md)}\n .section{padding:var(--space-xl) 0;border-top:1px solid var(--cd-border)}\n .spacious{margin-top:var(--space-lg)}\n\n \/* Buttons \u2013 always very visible *\/\n .btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;\n padding:16px 24px;border-radius:16px;font-weight:900;letter-spacing:.2px;border:2px solid #00000020;\n background:var(--cd-yellow);color:#111;cursor:pointer;box-shadow:var(--cd-shadow);\n transition:transform .08s ease, box-shadow .2s ease, background .15s ease, border-color .15s ease}\n .btn:hover{background:var(--cd-yellow-d);transform:translateY(-1px)}\n .btn:active{transform:translateY(0)}\n .btn:focus-visible{outline:3px solid var(--cd-focus);outline-offset:3px}\n .btn-lg{padding:18px 28px;font-size:1.05rem}\n\n \/* HERO *\/\n .hero{position:relative;min-height:72vh;display:grid;place-items:center;overflow:hidden}\n .hero-bg{position:absolute;inset:0;background:\n radial-gradient(60% 60% at 50% 30%, rgba(0,0,0,.25) 0%, rgba(0,0,0,.7) 100%),\n \n url('https:\/\/cyclingdestination.cc\/wp-content\/uploads\/2022\/05\/DSCF5215-scaled.jpg?auto=format&fit=crop&w=1800&q=70') center\/cover no-repeat}\n .hero-panel{position:relative;z-index:1;background:rgba(12,12,14,.6);\n border:1px solid var(--cd-border);backdrop-filter:saturate(1.15) blur(3px);\n border-radius:26px;box-shadow:var(--cd-shadow);padding:40px 28px;text-align:center;width:min(96%,960px)}\n .hero h1{font-size:clamp(30px,5vw,50px);margin-bottom:6px}\n .hero p{color:var(--cd-muted);font-size:clamp(16px,2.4vw,18px);margin-bottom:20px}\n .hero-cta{display:flex;flex-wrap:wrap;gap:16px;justify-content:center}\n\n \/* HOW IT WORKS *\/\n .how{\n background:linear-gradient(180deg, #F2B82F 0%, #f7cf74 100%);\n}\n .how-grid{display:grid;gap:18px}\n @media(min-width:900px){.how-grid{grid-template-columns:repeat(3,1fr)}}\n .how-card{background:var(--cd-surface);border:1px solid var(--cd-border);border-radius:var(--cd-r);padding:22px;box-shadow:var(--cd-shadow)}\n .how-ico{font-size:22px;margin-bottom:6px}\n .how p{color:var(--cd-muted)}\n\n \/* QUIZ *\/\n .quiz{background:#0d0e11}\n .quiz-card{background:var(--cd-surface);border:1px solid var(--cd-border);border-radius:22px;padding:22px;box-shadow:var(--cd-shadow)}\n .progress{height:8px;background:#2b2c31;border-radius:999px;overflow:hidden;margin:4px 0 18px}\n .progress>span{display:block;height:100%;width:0;background:var(--cd-yellow)}\n .qstep[hidden]{display:none}\n .qgrid{display:grid;gap:14px;margin-top:10px}\n @media(min-width:860px){.qgrid{grid-template-columns:repeat(4,1fr)}}\n .opt{display:flex;align-items:center;justify-content:center;text-align:center;padding:16px;border-radius:14px;\n background:#0a0b0d;border:2px solid #3a3b42;color:#fff;font-weight:800;box-shadow:var(--cd-shadow);cursor:pointer}\n .opt:hover{border-color:#6a6b74}\n .opt[aria-pressed=\"true\"]{background:#1a1600;border-color:var(--cd-yellow);box-shadow:0 0 0 4px #f0c40030 inset}\n .quiz-actions{display:flex;gap:12px;justify-content:flex-end;margin-top:16px}\n .quiz-actions .btn[disabled]{opacity:.5;cursor:not-allowed;transform:none;box-shadow:none}\n\n \/* RESULTS & LATEST *\/\n .cards{display:grid;gap:18px}\n @media(min-width:1000px){.cards{grid-template-columns:repeat(3,1fr)}}\n .card{background:var(--cd-card);border:1px solid var(--cd-border);border-radius:18px;overflow:hidden;box-shadow:var(--cd-shadow);display:flex;flex-direction:column}\n .card-img{aspect-ratio:16\/9;background:#1b1c21;background-size:cover;background-position:center}\n .card-body{padding:16px;display:grid;gap:10px}\n .meta{color:var(--cd-text);font-size: 18px}\n<\/style>\n<\/head>\n<body>\n\n\n<header class=\"hero\" role=\"banner\">\n <div class=\"hero-bg\" aria-hidden=\"true\"><\/div>\n <div class=\"hero-panel\">\n <h1>Vind jouw volgende fietsavontuur!<\/h1>\n <p>We matchen je met regio\u2019s, routes en overnachtingen die bij jou passen.<\/p>\n <div class=\"hero-cta\">\n <a class=\"btn btn-lg\" href=\"#quiz\" data-preset=\"road\"> Racefiets<\/a>\n <a class=\"btn btn-lg\" href=\"#quiz\" data-preset=\"gravel\"> Gravelbiker<\/a>\n <a class=\"btn btn-lg\" href=\"#quiz\" data-preset=\"mountainbike\"> Mountainbiker<\/a>\n <\/div>\n <\/div>\n<\/header>\n\n\n<section class=\"section how\" aria-labelledby=\"how-title\">\n <div class=\"wrap\">\n <h2 id=\"how-title\">Hoe het werkt<\/h2>\n <p class=\"meta\">In minder dan een minuut heb je drie bestemmingen die bij jou passen.<\/p>\n <div class=\"spacious how-grid\">\n <div class=\"how-card\"><div class=\"how-ico\"><\/div><h3>Vertel ons wat je zoekt<\/h3><p>Discipline, terrein, vibe, lengte van jouw trip en welk seizoen.<\/p><\/div>\n <div class=\"how-card\"><div class=\"how-ico\">\ufe0f<\/div><h3>Wij matchen jou met jouw bestemming <\/h3><p>Routes, overnachten en to-do\u2019s in 3 kaarten.<\/p><\/div>\n <div class=\"how-card\"><div class=\"how-ico\"><\/div><h3>Jij gaat op avontuur<\/h3><p>Kies je plek, plan je ritten, ga genieten.<\/p><\/div>\n <\/div>\n <\/div>\n<\/section>\n\n\n<section id=\"quiz\" class=\"section quiz\" aria-labelledby=\"quiz-title\">\n <div class=\"wrap\">\n <h2 id=\"quiz-title\"> Start jouw fietsavontuur hier<\/h2>\n <div class=\"spacious quiz-card\">\n <div class=\"progress\"><span id=\"qbar\"><\/span><\/div>\n\n \n <div class=\"qstep\" data-q=\"discipline\">\n <h3>Welke fiets kies je voor jouw volgende avontuur?<\/h3>\n <div class=\"qgrid\" role=\"group\" aria-label=\"Discipline\">\n <button class=\"opt\" data-value=\"road\">Racefiets<\/button>\n <button class=\"opt\" data-value=\"gravel\">Gravelbike<\/button>\n <button class=\"opt\" data-value=\"mountainbike\">Mountainbike<\/button>\n <\/div>\n <\/div>\n\n \n <div class=\"qstep\" data-q=\"terrain\" hidden>\n <h3>Welk type omgeving zoek je?<\/h3>\n <div class=\"qgrid\" role=\"group\" aria-label=\"Terrein\">\n <button class=\"opt\" data-value=\"flat\">Vlak \/ kust<\/button>\n <button class=\"opt\" data-value=\"rolling\">Heuvels<\/button>\n <button class=\"opt\" data-value=\"mountain\">Bergen<\/button>\n <button class=\"opt\" data-value=\"mixed\">Mix<\/button>\n <\/div>\n <\/div>\n\n \n <div class=\"qstep\" data-q=\"vibe\" data-type=\"multi\" data-max=\"2\" hidden>\n <h3>Welke punten vind je belangrijk voor dit avontuur? (max 2)<\/h3>\n <div class=\"qgrid\" role=\"group\" aria-label=\"Vibe\">\n <button class=\"opt\" data-value=\"scenery\">Omgeving<\/button>\n <button class=\"opt\" data-value=\"challenge\">Uitdaging<\/button>\n <button class=\"opt\" data-value=\"culture-food\">Koffiestops en eten<\/button>\n <button class=\"opt\" data-value=\"family\">Bezienswaardigheden<\/button>\n <button class=\"opt\" data-value=\"remote\">Rust & natuur<\/button>\n <\/div>\n <div class=\"quiz-actions\">\n <button class=\"btn\" data-next disabled>Volgende<\/button>\n <\/div>\n <\/div>\n\n \n <div class=\"qstep\" data-q=\"length\" hidden>\n <h3>Hoelang ga je weg?<\/h3>\n <div class=\"qgrid\" role=\"group\" aria-label=\"Duur\">\n <button class=\"opt\" data-value=\"day-ride\">ik ga \u00e9\u00e9n dagje fietsen<\/button>\n <button class=\"opt\" data-value=\"weekend\">Ik ga een (lang)weekend weg<\/button>\n <button class=\"opt\" data-value=\"week-plus\">Ik ga een week of meer weg<\/button>\n <\/div>\n <\/div>\n\n \n <div class=\"qstep\" data-q=\"season\" hidden>\n <h3>Wanneer wil je gaan?<\/h3>\n <div class=\"qgrid\" role=\"group\" aria-label=\"Seizoen\">\n <button class=\"opt\" data-value=\"spring\">Lente<\/button>\n <button class=\"opt\" data-value=\"summer\">Zomer<\/button>\n <button class=\"opt\" data-value=\"autumn\">Herfst<\/button>\n <button class=\"opt\" data-value=\"winter\">Winter \/ wintersun<\/button>\n <\/div>\n <div class=\"quiz-actions\">\n <button class=\"btn\" data-back>Terug<\/button>\n <button class=\"btn btn-lg\" id=\"showMatches\" disabled>Toon mijn 3 opties<\/button>\n <\/div>\n <\/div>\n <\/div>\n\n \n <div id=\"qresults\" class=\"spacious\" style=\"display:none\">\n <div class=\"wrap\" style=\"padding:0\">\n <div id=\"qsummary\" class=\"meta\" style=\"margin-bottom:14px\"><\/div>\n <div class=\"cards\" id=\"qcards\"><\/div>\n <\/div>\n <\/div>\n <\/div>\n<\/section>\n\n\n<section class=\"section\" aria-labelledby=\"latest-title\">\n <div class=\"wrap\">\n <h2 id=\"latest-title\">Meer inspiratie<\/h2>\n <p class=\"meta\">Nieuwe verhalen om je volgende avontuur te plannen.<\/p>\n <div id=\"latestCards\" class=\"spacious cards\"><\/div>\n <\/div>\n<\/section>\n\n<script>\n\/* ---------- HERO preset ---------- *\/\ndocument.querySelectorAll('[data-preset]').forEach(a=>{\n a.addEventListener('click',()=>{\n document.getElementById('quiz').scrollIntoView({behavior:'smooth'});\n setTimeout(()=>{\n const btn=document.querySelector('.qstep[data-q=\"discipline\"] .opt[data-value=\"'+a.dataset.preset+'\"]');\n btn?.click();\n },140);\n });\n});\n\n\/* ---------- QUIZ FLOW ---------- *\/\n(function(){\n const steps=[...document.querySelectorAll('.qstep')];\n const bar=document.getElementById('qbar');\n const answers={discipline:null, terrain:null, vibe:[], length:null, season:null};\n let idx=0;\n\n function show(i){\n idx=i;\n steps.forEach((s,k)=>s.hidden=k!==i);\n bar.style.width=(i\/(steps.length-1))*100+'%';\n if(steps[i].dataset.q==='season'){\n document.getElementById('showMatches').disabled=!answers.season;\n }\n }\n\n \/\/ \u2705 Moved OUTSIDE show() so all handlers can call it\n function resetQuiz(){\n \/\/ Clear stored answers\n answers.discipline = null;\n answers.terrain = null;\n answers.vibe = [];\n answers.length = null;\n answers.season = null;\n\n \/\/ Unselect all chosen options\n document.querySelectorAll('.opt[aria-pressed=\"true\"]').forEach(el => {\n el.setAttribute('aria-pressed','false');\n });\n\n \/\/ Disable final CTA\n const showBtn = document.getElementById('showMatches');\n if (showBtn) showBtn.disabled = true;\n\n \/\/ Hide previous results & clear summary\/cards\n const out = document.getElementById('qresults');\n if (out) out.style.display = 'none';\n const sum = document.getElementById('qsummary');\n const cards = document.getElementById('qcards');\n if (sum) sum.innerHTML = '';\n if (cards) cards.innerHTML = '';\n\n \/\/ Jump to first step\n show(0);\n }\n\n function setSingle(qnode, value){\n qnode.querySelectorAll('.opt').forEach(x=>x.setAttribute('aria-pressed','false'));\n qnode.querySelector(`.opt[data-value=\"${value}\"]`)?.setAttribute('aria-pressed','true');\n answers[qnode.dataset.q]=value;\n setTimeout(()=>show(Math.min(idx+1,steps.length-1)),240);\n }\n\n function setMulti(qnode, value){\n const max=Number(qnode.dataset.max||2);\n const btn=qnode.querySelector(`.opt[data-value=\"${value}\"]`);\n const on=btn.getAttribute('aria-pressed')==='true';\n if(on){ btn.setAttribute('aria-pressed','false'); }\n else{\n const pressed=[...qnode.querySelectorAll('.opt[aria-pressed=\"true\"]')];\n if(pressed.length>=max){ pressed[0].setAttribute('aria-pressed','false'); }\n btn.setAttribute('aria-pressed','true');\n }\n answers[qnode.dataset.q]=[...qnode.querySelectorAll('.opt[aria-pressed=\"true\"]')].map(x=>x.dataset.value);\n const nextBtn=qnode.querySelector('[data-next]');\n if(nextBtn) nextBtn.disabled=answers[qnode.dataset.q].length===0;\n if(answers[qnode.dataset.q].length===max){ setTimeout(()=>show(idx+1),240); }\n }\n\n steps.forEach((qnode,i)=>{\n const type=qnode.dataset.type||'single';\n qnode.addEventListener('click',(e)=>{\n const opt=e.target.closest('.opt'); if(!opt) return;\n type==='single' ? setSingle(qnode,opt.dataset.value) : setMulti(qnode,opt.dataset.value);\n if(qnode.dataset.q==='season'){\n document.getElementById('showMatches').disabled=!answers.season;\n }\n });\n\n \/\/ \u2705 Single, correct Back handler\n qnode.querySelector('[data-back]')?.addEventListener('click', () => {\n if (i === steps.length - 1) {\n resetQuiz();\n document.getElementById('quiz').scrollIntoView({behavior:'smooth'});\n } else {\n show(Math.max(i - 1, 0));\n }\n });\n });\n\n show(0);\n\n \/* ---------- Dynamic Recommendation Engine (WP tags) ---------- *\/\n function answerSlugs(a){\n const base=[a.discipline,a.terrain,a.length,a.season].filter(Boolean);\n return base.concat(a.vibe||[]);\n }\n\n async function getTagIds(slugs){\n const site=window.location.origin;\n const ids=[]; const unique=[...new Set(slugs.filter(Boolean))];\n for(const s of unique){\n try{\n const r=await fetch(`${site}\/wp-json\/wp\/v2\/tags?slug=${encodeURIComponent(s)}&per_page=1`);\n const j=await r.json();\n if(Array.isArray(j)&&j[0]) ids.push(j[0].id);\n }catch(e){}\n }\n return ids;\n }\n\n async function fetchByTags(tagIds,{types=['posts','pages'],limit=12}={}){\n const site=window.location.origin;\n let items=[];\n for(const t of types){\n try{\n const qs=new URLSearchParams({per_page:String(limit),_embed:'1',order:'desc',orderby:'date'});\n if(tagIds.length) qs.set('tags', tagIds.join(','));\n const r=await fetch(`${site}\/wp-json\/wp\/v2\/${t}?${qs.toString()}`);\n if(!r.ok) continue;\n const j=await r.json();\n items=items.concat(j.map(x=>({...x,__type:t})));\n }catch(e){}\n }\n items.sort((a,b)=>new Date(b.date)-new Date(a.date));\n const seen=new Set(), out=[];\n for(const it of items){\n const key=`${it.__type}:${it.id}`;\n if(!seen.has(key)){ out.push(it); seen.add(key);}\n }\n return out;\n }\n\n function renderWpCard(p){\n const img=p._embedded?.['wp:featuredmedia']?.[0]?.source_url||'';\n const title=(p.title?.rendered||'Lees meer');\n const link=p.link;\n const raw=p.excerpt?.rendered||p.content?.rendered||'';\n const excerpt=raw.replace(\/<[^>]+>\/g,'').slice(0,140);\n return `\n <article class=\"card\">\n <a class=\"card-img\" href=\"${link}\" style=\"background-image:url('${img}')\"><\/a>\n <div class=\"card-body\">\n <h3>${title}<\/h3>\n <div class=\"meta\">${excerpt}${excerpt?'\u2026':''}<\/div>\n <div><a class=\"btn\" href=\"${link}\">Lees meer \u2192<\/a><\/div>\n <\/div>\n <\/article>`;\n }\n\n async function getTopThree(answers){\n const slugsFull=answerSlugs(answers);\n const slugsNoSeason=slugsFull.filter(s=>!['spring','summer','autumn','winter'].includes(s));\n const tiers=[\n slugsFull,\n slugsNoSeason,\n [answers.discipline,answers.terrain].filter(Boolean),\n [answers.discipline].filter(Boolean),\n []\n ];\n let picked=[];\n for(const tier of tiers){\n const ids=await getTagIds(tier);\n const items=await fetchByTags(ids,{types:['posts','pages'],limit:12});\n for(const it of items){\n if(picked.length>=3) break;\n const key=`${it.__type}:${it.id}`;\n if(!picked.find(x=>`${x.__type}:${x.id}`===key)) picked.push(it);\n }\n if(picked.length>=3) break;\n }\n return picked.slice(0,3);\n }\n\n document.getElementById('showMatches').addEventListener('click', async ()=>{\n const sum=document.getElementById('qsummary');\n const cards=document.getElementById('qcards');\n const out=document.getElementById('qresults');\n sum.innerHTML=`Profiel: <strong>${answers.discipline||'\u2014'}<\/strong> \u00b7 ${answers.terrain||'\u2014'} \u00b7 ${(answers.vibe||[]).join(' & ')||'\u2014'} \u00b7 ${answers.length||'\u2014'} \u00b7 ${answers.season||'\u2014'}`;\n cards.innerHTML=`<div class=\"meta\">Zoeken naar de beste matches\u2026<\/div>`;\n out.style.display='block';\n const results=await getTopThree(answers);\n cards.innerHTML = results.length ? results.map(renderWpCard).join('') :\n `<article class=\"card\"><div class=\"card-body\"><h3>Geen directe matches<\/h3><div class=\"meta\">Probeer een ruimere selectie (ander seizoen of terrein).<\/div><\/div><\/article>`;\n out.scrollIntoView({behavior:'smooth',block:'start'});\n });\n})();\n\n\/* ---------- Latest posts via REST (optional) ---------- *\/\n(async function(){\n const target=document.getElementById('latestCards');\n if(!target) return;\n const site=window.location.origin;\n try{\n const r=await fetch(`${site}\/wp-json\/wp\/v2\/posts?per_page=3&_embed=1`);\n const posts=await r.json();\n target.innerHTML=posts.map(p=>{\n const img=p._embedded?.['wp:featuredmedia']?.[0]?.source_url||'';\n const title=p.title?.rendered||'Lees meer';\n const link=p.link;\n const excerpt=(p.excerpt?.rendered||'').replace(\/<[^>]+>\/g,'').slice(0,140);\n return `\n <article class=\"card\">\n <a class=\"card-img\" href=\"${link}\" style=\"background-image:url('${img}')\"><\/a>\n <div class=\"card-body\">\n <h3>${title}<\/h3>\n <div class=\"meta\">${excerpt}\u2026<\/div>\n <div><a class=\"btn\" href=\"${link}\">Lees meer \u2192<\/a><\/div>\n <\/div>\n <\/article>`;\n }).join('');\n }catch(_){\n target.innerHTML='<div class=\"meta\">Kon recente artikelen niet laden.<\/div>';\n }\n})();\n<\/script>\n\n\n<\/body>\n<\/html>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>CyclingDestination.cc \u2013 Vind jouw fietsbestemming Vind jouw volgende fietsavontuur! We matchen je met regio\u2019s, routes en overnachtingen die bij jou passen. Racefiets Gravelbiker Mountainbiker Hoe het werkt In minder dan een minuut heb je drie bestemmingen die bij jou passen. Vertel ons wat je zoekt Discipline, terrein, vibe, lengte van jouw trip en welk seizoen. […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"_acf_changed":false,"iawp_total_views":8,"footnotes":""},"categories":[],"tags":[],"class_list":["post-3195","page","type-page","status-publish","hentry"],"acf":[],"featured_image_url":[],"post_author":"Sander","assigned_categories":"","yoast_head":"\n<title>Test landing page - Cycling Destination<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/cyclingdestination.cc\/de\/test-landing-page\/\" \/>\n<meta property=\"og:locale\" content=\"de_DE\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Test landing page - Cycling Destination\" \/>\n<meta property=\"og:description\" content=\"CyclingDestination.cc \u2013 Vind jouw fietsbestemming Vind jouw volgende fietsavontuur! We matchen je met regio\u2019s, routes en overnachtingen die bij jou passen. Racefiets Gravelbiker Mountainbiker Hoe het werkt In minder dan een minuut heb je drie bestemmingen die bij jou passen. Vertel ons wat je zoekt Discipline, terrein, vibe, lengte van jouw trip en welk seizoen. […]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/cyclingdestination.cc\/de\/test-landing-page\/\" \/>\n<meta property=\"og:site_name\" content=\"Cycling Destination\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/cyclingdestination.cc\" \/>\n<meta property=\"article:modified_time\" content=\"2025-08-14T20:31:12+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/cyclingdestination.cc\/wp-content\/uploads\/2022\/10\/ruben_12102022_cycling_destination_etxeondo_32-scaled.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"2048\" \/>\n\t<meta property=\"og:image:height\" content=\"2560\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:site\" content=\"@cyclingdestin\" \/>\n<meta name=\"twitter:label1\" content=\"Gesch\u00e4tzte Lesezeit\" \/>\n\t<meta name=\"twitter:data1\" content=\"2\u00a0Minuten\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/cyclingdestination.cc\\\/test-landing-page\",\"url\":\"https:\\\/\\\/cyclingdestination.cc\\\/test-landing-page\",\"name\":\"Test landing page - Cycling Destination\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/cyclingdestination.cc\\\/#website\"},\"datePublished\":\"2021-11-24T13:54:12+00:00\",\"dateModified\":\"2025-08-14T20:31:12+00:00\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/cyclingdestination.cc\\\/test-landing-page#breadcrumb\"},\"inLanguage\":\"de\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/cyclingdestination.cc\\\/test-landing-page\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/cyclingdestination.cc\\\/test-landing-page#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/cyclingdestination.cc\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Test landing page\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/cyclingdestination.cc\\\/#website\",\"url\":\"https:\\\/\\\/cyclingdestination.cc\\\/\",\"name\":\"Cycling Destination\",\"description\":\"Inspiratie voor jouw volgende fietsavontuur\",\"publisher\":{\"@id\":\"https:\\\/\\\/cyclingdestination.cc\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/cyclingdestination.cc\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"de\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/cyclingdestination.cc\\\/#organization\",\"name\":\"Cycling Destination\",\"url\":\"https:\\\/\\\/cyclingdestination.cc\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"de\",\"@id\":\"https:\\\/\\\/cyclingdestination.cc\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/cyclingdestination.cc\\\/wp-content\\\/uploads\\\/2022\\\/01\\\/cyclingdestination_logo_RGB_zwart_vDEF-1.png\",\"contentUrl\":\"https:\\\/\\\/cyclingdestination.cc\\\/wp-content\\\/uploads\\\/2022\\\/01\\\/cyclingdestination_logo_RGB_zwart_vDEF-1.png\",\"width\":2550,\"height\":814,\"caption\":\"Cycling Destination\"},\"image\":{\"@id\":\"https:\\\/\\\/cyclingdestination.cc\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/www.facebook.com\\\/cyclingdestination.cc\",\"https:\\\/\\\/x.com\\\/cyclingdestin\",\"https:\\\/\\\/www.instagram.com\\\/cyclingdestination.cc\\\/\"]}]}<\/script>\n","yoast_head_json":{"title":"Test Landing Page - Radfahrziel","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/cyclingdestination.cc\/de\/test-landing-page\/","og_locale":"de_DE","og_type":"article","og_title":"Test landing page - Cycling Destination","og_description":"CyclingDestination.cc \u2013 Vind jouw fietsbestemming Vind jouw volgende fietsavontuur! We matchen je met regio\u2019s, routes en overnachtingen die bij jou passen. Racefiets Gravelbiker Mountainbiker Hoe het werkt In minder dan een minuut heb je drie bestemmingen die bij jou passen. Vertel ons wat je zoekt Discipline, terrein, vibe, lengte van jouw trip en welk seizoen. […]","og_url":"https:\/\/cyclingdestination.cc\/de\/test-landing-page\/","og_site_name":"Cycling Destination","article_publisher":"https:\/\/www.facebook.com\/cyclingdestination.cc","article_modified_time":"2025-08-14T20:31:12+00:00","og_image":[{"width":2048,"height":2560,"url":"https:\/\/cyclingdestination.cc\/wp-content\/uploads\/2022\/10\/ruben_12102022_cycling_destination_etxeondo_32-scaled.jpg","type":"image\/jpeg"}],"twitter_card":"summary_large_image","twitter_site":"@cyclingdestin","twitter_misc":{"Gesch\u00e4tzte Lesezeit":"2\u00a0Minuten"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/cyclingdestination.cc\/test-landing-page","url":"https:\/\/cyclingdestination.cc\/test-landing-page","name":"Test Landing Page - Radfahrziel","isPartOf":{"@id":"https:\/\/cyclingdestination.cc\/#website"},"datePublished":"2021-11-24T13:54:12+00:00","dateModified":"2025-08-14T20:31:12+00:00","breadcrumb":{"@id":"https:\/\/cyclingdestination.cc\/test-landing-page#breadcrumb"},"inLanguage":"de","potentialAction":[{"@type":"ReadAction","target":["https:\/\/cyclingdestination.cc\/test-landing-page"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/cyclingdestination.cc\/test-landing-page#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/cyclingdestination.cc\/"},{"@type":"ListItem","position":2,"name":"Test landing page"}]},{"@type":"WebSite","@id":"https:\/\/cyclingdestination.cc\/#website","url":"https:\/\/cyclingdestination.cc\/","name":"Ziel Radfahren","description":"Inspiration f\u00fcr Ihr n\u00e4chstes Fahrradabenteuer","publisher":{"@id":"https:\/\/cyclingdestination.cc\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/cyclingdestination.cc\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"de"},{"@type":"Organization","@id":"https:\/\/cyclingdestination.cc\/#organization","name":"Ziel Radfahren","url":"https:\/\/cyclingdestination.cc\/","logo":{"@type":"ImageObject","inLanguage":"de","@id":"https:\/\/cyclingdestination.cc\/#\/schema\/logo\/image\/","url":"https:\/\/cyclingdestination.cc\/wp-content\/uploads\/2022\/01\/cyclingdestination_logo_RGB_zwart_vDEF-1.png","contentUrl":"https:\/\/cyclingdestination.cc\/wp-content\/uploads\/2022\/01\/cyclingdestination_logo_RGB_zwart_vDEF-1.png","width":2550,"height":814,"caption":"Cycling Destination"},"image":{"@id":"https:\/\/cyclingdestination.cc\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/cyclingdestination.cc","https:\/\/x.com\/cyclingdestin","https:\/\/www.instagram.com\/cyclingdestination.cc\/"]}]}},"_links":{"self":[{"href":"https:\/\/cyclingdestination.cc\/de\/wp-json\/wp\/v2\/pages\/3195","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/cyclingdestination.cc\/de\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/cyclingdestination.cc\/de\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/cyclingdestination.cc\/de\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/cyclingdestination.cc\/de\/wp-json\/wp\/v2\/comments?post=3195"}],"version-history":[{"count":0,"href":"https:\/\/cyclingdestination.cc\/de\/wp-json\/wp\/v2\/pages\/3195\/revisions"}],"wp:attachment":[{"href":"https:\/\/cyclingdestination.cc\/de\/wp-json\/wp\/v2\/media?parent=3195"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/cyclingdestination.cc\/de\/wp-json\/wp\/v2\/categories?post=3195"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/cyclingdestination.cc\/de\/wp-json\/wp\/v2\/tags?post=3195"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}