#hwa-mead-quiz, #hwa-mead-quiz * { box-sizing: border-box !important; } #hwa-mead-quiz { –hwa-gold: #b8860b; –hwa-dark: #29231d; –hwa-light: #f8f5ef; –hwa-border: #ddd6ca; –hwa-green: #566b3b; max-width: 900px !important; margin: 30px auto !important; color: var(–hwa-dark) !important; font-family: inherit !important; } #hwa-mead-quiz .hwa-progress-wrap { margin-bottom: 30px !important; } #hwa-mead-quiz .hwa-progress-text { text-align: center !important; font-size: 14px !important; margin-bottom: 8px !important; } #hwa-mead-quiz .hwa-progress { width: 100% !important; height: 8px !important; background: #e8e2d8 !important; border-radius: 10px !important; overflow: hidden !important; } #hwa-mead-quiz #hwa-progress-bar { width: 16.666% !important; height: 100% !important; background: var(–hwa-gold) !important; transition: width .3s ease !important; } #hwa-mead-quiz .hwa-question { display: none !important; } #hwa-mead-quiz .hwa-question.active { display: block !important; } #hwa-mead-quiz .hwa-question h3 { font-size: 26px !important; line-height: 1.3 !important; margin: 0 0 24px !important; text-align: center !important; } #hwa-mead-quiz .hwa-options { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 14px !important; width: 100% !important; } #hwa-mead-quiz .hwa-option { width: 100% !important; margin: 0 !important; padding: 0 !important; } #hwa-mead-quiz .hwa-option input { position: absolute !important; left: -9999px !important; width: 1px !important; height: 1px !important; opacity: 0 !important; pointer-events: none !important; } #hwa-mead-quiz .hwa-option label { display: flex !important; align-items: center !important; justify-content: center !important; width: 100% !important; min-height: 70px !important; margin: 0 !important; padding: 16px 18px !important; border: 2px solid var(–hwa-border) !important; border-radius: 8px !important; background: #fff !important; color: var(–hwa-dark) !important; text-align: center !important; font-size: 16px !important; line-height: 1.35 !important; cursor: pointer !important; transition: all .2s ease !important; } #hwa-mead-quiz .hwa-option label:hover { border-color: var(–hwa-gold) !important; background: var(–hwa-light) !important; } #hwa-mead-quiz .hwa-option input:checked + label { border-color: var(–hwa-gold) !important; background: #f5edda !important; box-shadow: 0 0 0 2px rgba(184,134,11,.12) !important; font-weight: 600 !important; } #hwa-mead-quiz .hwa-buttons { display: flex !important; justify-content: space-between !important; align-items: center !important; gap: 15px !important; margin-top: 30px !important; } #hwa-mead-quiz .hwa-buttons button { appearance: none !important; -webkit-appearance: none !important; border: 0 !important; border-radius: 6px !important; padding: 13px 25px !important; margin: 0 !important; font-size: 16px !important; line-height: 1.2 !important; cursor: pointer !important; background: var(–hwa-gold) !important; color: #fff !important; min-width: 120px !important; } #hwa-mead-quiz .hwa-buttons button:hover { opacity: .88 !important; } #hwa-mead-quiz #hwa-back { background: #777 !important; visibility: hidden; } #hwa-mead-quiz #hwa-error { display: none !important; margin-top: 15px !important; padding: 12px !important; border-radius: 6px !important; background: #f8e8e5 !important; color: #9b3026 !important; text-align: center !important; font-size: 14px !important; } #hwa-mead-quiz #hwa-error.visible { display: block !important; } #hwa-mead-quiz #hwa-results { display: none !important; text-align: center !important; } #hwa-mead-quiz #hwa-results.active { display: block !important; } #hwa-mead-quiz .hwa-result-intro { font-size: 17px !important; margin-bottom: 25px !important; } #hwa-mead-quiz .hwa-result-card { max-width: 600px !important; margin: 0 auto 35px !important; padding: 25px !important; border: 1px solid var(–hwa-border) !important; border-radius: 10px !important; background: #fff !important; } #hwa-mead-quiz .hwa-result-image-link { display: block !important; } #hwa-mead-quiz #hwa-result-image { display: block !important; width: 100% !important; max-width: 350px !important; height: auto !important; max-height: 450px !important; object-fit: contain !important; margin: 0 auto 20px !important; } #hwa-mead-quiz #hwa-result-name { font-size: 28px !important; line-height: 1.3 !important; margin: 0 0 15px !important; } #hwa-mead-quiz #hwa-result-description { font-size: 16px !important; line-height: 1.6 !important; margin-bottom: 25px !important; } #hwa-mead-quiz .hwa-view-button { display: inline-block !important; background: var(–hwa-gold) !important; color: #fff !important; text-decoration: none !important; padding: 13px 25px !important; border-radius: 6px !important; font-size: 16px !important; } #hwa-mead-quiz .hwa-view-button:hover { color: #fff !important; opacity: .88 !important; } #hwa-mead-quiz .hwa-alternatives-title { font-size: 24px !important; margin: 35px 0 20px !important; } #hwa-mead-quiz #hwa-alternatives { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 20px !important; } #hwa-mead-quiz .hwa-alternative { border: 1px solid var(–hwa-border) !important; border-radius: 8px !important; padding: 15px !important; background: #fff !important; } #hwa-mead-quiz .hwa-alternative-image { display: block !important; width: 100% !important; height: 250px !important; object-fit: contain !important; margin: 0 auto 15px !important; } #hwa-mead-quiz .hwa-alternative-name { font-size: 18px !important; font-weight: 600 !important; margin-bottom: 8px !important; } #hwa-mead-quiz .hwa-alternative-name a { color: var(–hwa-dark) !important; text-decoration: none !important; } #hwa-mead-quiz .hwa-alternative-description { font-size: 14px !important; line-height: 1.5 !important; } #hwa-mead-quiz #hwa-reset { margin-top: 30px !important; appearance: none !important; -webkit-appearance: none !important; border: 0 !important; border-radius: 6px !important; padding: 13px 25px !important; background: #777 !important; color: #fff !important; font-size: 16px !important; cursor: pointer !important; } @media (max-width: 600px) { #hwa-mead-quiz .hwa-options { grid-template-columns: 1fr !important; gap: 12px !important; } #hwa-mead-quiz .hwa-question h3 { font-size: 22px !important; } #hwa-mead-quiz .hwa-option label { min-height: 62px !important; padding: 14px !important; font-size: 15px !important; } #hwa-mead-quiz .hwa-buttons { margin-top: 25px !important; } #hwa-mead-quiz .hwa-buttons button { min-width: 105px !important; padding: 12px 18px !important; } #hwa-mead-quiz #hwa-alternatives { grid-template-columns: 1fr !important; } #hwa-mead-quiz .hwa-alternative-image { height: 220px !important; } } (function() { “use strict”; /* ========================================================= PRODUCTS ========================================================= */ const products = [ { id: “traditional”, name: “Traditional Mead”, url: “https://www.honeywinesaustralia.com.au/product/hunter-valley-mead/”, image: “https://www.honeywinesaustralia.com.au/wp-content/uploads/2020/12/Hunter-Valley-Plain-Mead.jpg”, description: “A classic honey-forward mead that lets the natural character of Australian honey shine through.”, scores: { classic: 10, fruity: 1, rich: 3, fresh: 4, adventurous: 2, nostalgic: 5, sweet: 4, medium: 8, dry: 8, honey: 10, familiar: 9, introduction: 10 } }, { id: “vanilla”, name: “Vanilla Bean Mead”, url: “https://www.honeywinesaustralia.com.au/product/vanilla-mead-750ml/”, image: “https://www.honeywinesaustralia.com.au/wp-content/uploads/2021/12/Vanilla-Mead.jpg”, description: “Smooth, sweet and aromatic, with real vanilla bean adding a rich dessert-like character to the honey wine.”, scores: { classic: 5, fruity: 1, rich: 9, fresh: 2, adventurous: 4, nostalgic: 8, sweet: 9, medium: 7, vanilla: 10, honey: 7, familiar: 8, different: 7, richmatch: 10 } }, { id: “health”, name: “Health Potion”, url: “https://www.honeywinesaustralia.com.au/product/limited-edition-health-potion-mead/”, image: “https://www.honeywinesaustralia.com.au/wp-content/uploads/2024/06/updated-health-potion-animation.webp”, description: “A bright combination of coconut and lime, giving this mead a tropical, refreshing character.”, scores: { fruity: 7, fresh: 10, adventurous: 6, citrus: 10, coconut: 10, sweet: 7, medium: 7, cider: 6, cocktails: 8, refreshing: 10, different: 7 } }, { id: “mana”, name: “Mana Potion”, url: “https://www.honeywinesaustralia.com.au/product/limited-edition-mana-potion-mead/”, image: “https://www.honeywinesaustralia.com.au/wp-content/uploads/2024/01/45ratiomanapotionvideo-ezgif.com-video-to-webp-converter.webp”, description: “A juicy mixed-fruit mead packed with fruity flavour and a fun, colourful character.”, scores: { fruity: 10, fresh: 7, adventurous: 5, nostalgic: 5, fruit: 10, sweet: 9, medium: 7, wine: 8, cider: 8, introduction: 5, fruitymatch: 10, fun: 8 } }, { id: “regen”, name: “Regen Potion”, url: “https://www.honeywinesaustralia.com.au/product/regen-potion-mead-mk-ii-chilli-and-cherry/”, image: “https://www.honeywinesaustralia.com.au/wp-content/uploads/2025/07/Chilli-and-Cherry-Mead.jpg”, description: “Cherry and chilli combine for a sweet, fruity mead with a warming spicy kick.”, scores: { fruity: 8, adventurous: 10, rich: 4, cherry: 10, spice: 10, sweet: 7, medium: 7, cocktails: 7, beer: 5, unusual: 10, strange: 9, fun: 6 } }, { id: “animals”, name: “Speak To Animals Potion”, url: “https://www.honeywinesaustralia.com.au/product/mead-cherry-and-coconut-slice/”, image: “https://www.honeywinesaustralia.com.au/wp-content/uploads/2023/02/Speak-to-animals-potion-1.png”, description: “A fun combination of cherry and coconut with a sweet, dessert-like character.”, scores: { fruity: 9, rich: 6, adventurous: 6, cherry: 10, coconut: 10, sweet: 9, medium: 7, cider: 8, cocktails: 8, familiar: 6, fun: 10 } }, { id: “mind-reading”, name: “Potion of Mind Reading”, url: “https://www.honeywinesaustralia.com.au/product/turkish-delight-mead/”, image: “https://www.honeywinesaustralia.com.au/wp-content/uploads/2020/05/Turkish-Delight-Mead-1.jpg”, description: “A distinctive Turkish delight-inspired mead with floral, sweet and exotic flavours.”, scores: { rich: 8, adventurous: 10, nostalgic: 7, turkish: 10, sweet: 9, medium: 6, cocktails: 8, unusual: 10, strange: 8, different: 9 } }, { id: “invisibility”, name: “Potion of Invisibility”, url: “https://www.honeywinesaustralia.com.au/product/potion-of-invisibility-caramel-mead/”, image: “https://www.honeywinesaustralia.com.au/wp-content/uploads/2021/12/20250401_163157.jpg”, description: “A rich caramel mead with a sweet, smooth and familiar dessert character.”, scores: { rich: 10, nostalgic: 9, sweet: 10, vanilla: 8, familiar: 10, wine: 7, coffee: 5, richmatch: 10, fun: 7 } }, { id: “stamina”, name: “Stamina Potion”, url: “https://www.honeywinesaustralia.com.au/product/stamina-potion-mead-mk-ii-choc-truffle/”, image: “https://www.honeywinesaustralia.com.au/wp-content/uploads/2025/09/Untitledvideo-MadewithClipchamp-ezgif.com-video-to-webp-converter.webp”, description: “A decadent chocolate truffle mead designed for anyone who loves rich dessert flavours.”, scores: { rich: 10, nostalgic: 8, chocolate: 10, sweet: 10, medium: 7, coffee: 7, familiar: 7, dessert: 10, richmatch: 10 } }, { id: “haste”, name: “Haste Potion”, url: “https://www.honeywinesaustralia.com.au/product/limited-edition-haste-potion-mead/”, image: “https://www.honeywinesaustralia.com.au/wp-content/uploads/2024/06/Haste-Potion.jpg”, description: “Coffee and strawberry come together in a sweet, unusual mead with both rich and fruity notes.”, scores: { fruity: 7, rich: 8, adventurous: 8, nostalgic: 6, coffee: 10, sweet: 9, medium: 7, cocktails: 8, dessert: 9, unusual: 8, different: 9 } }, { id: “ginger-chocolate”, name: “Ginger and Chocolate”, url: “https://www.honeywinesaustralia.com.au/product/limited-edition-regen-potion-mead/”, image: “https://www.honeywinesaustralia.com.au/wp-content/uploads/2024/05/Regen-MK-1-Mead.png”, description: “A rich chocolate mead with warming ginger spice, combining dessert flavours with something a little different.”, scores: { rich: 10, adventurous: 8, chocolate: 10, spice: 7, sweet: 9, medium: 7, beer: 5, coffee: 6, dessert: 10, unusual: 8, different: 9 } }, { id: “peach”, name: “Peach Ice Tea Mead”, url: “https://www.honeywinesaustralia.com.au/product/peach-ice-tea-mead-500ml/”, image: “https://www.honeywinesaustralia.com.au/wp-content/uploads/2025/11/Peach-Ice-Tea-Mead.png”, description: “A very sweet peach iced tea-inspired mead with a fruity and refreshing character.”, scores: { fruity: 10, fresh: 9, nostalgic: 8, sweet: 10, fruit: 9, cider: 9, cocktails: 8, refreshing: 10, fun: 8 } }, { id: “cola”, name: “Cola Mead”, url: “https://www.honeywinesaustralia.com.au/product/cola-mead-500ml/”, image: “https://www.honeywinesaustralia.com.au/wp-content/uploads/2025/11/Cola-Mead.png”, description: “A fun and nostalgic mead inspired by the flavour of Pepsi Max, perfect for anyone looking for something completely different.”, scores: { adventurous: 9, nostalgic: 10, fresh: 7, sweet: 7, medium: 6, soft: 10, cocktails: 7, unusual: 10, strange: 10, fun: 10 } } ]; /* ========================================================= ANSWER WEIGHTS ========================================================= */ const answerWeights = { q1: { classic: { classic: 10, honey: 10, familiar: 8 }, fruity: { fruity: 10, fruit: 10, cherry: 7 }, rich: { rich: 10, dessert: 10, chocolate: 7, coffee: 6, vanilla: 6 }, fresh: { fresh: 10, refreshing: 10, citrus: 8 }, adventurous: { adventurous: 10, unusual: 10, strange: 8, spice: 6, turkish: 6 }, nostalgic: { nostalgic: 10, familiar: 8, fun: 8 } }, q2: { “very-sweet”: { sweet: 10 }, sweet: { sweet: 8 }, medium: { medium: 10 }, “not-too-sweet”: { dry: 10, medium: 7 }, surprise: { adventurous: 5, unusual: 5 } }, q3: { fruit: { fruit: 10, fruity: 10 }, cherry: { cherry: 10 }, coconut: { coconut: 10 }, chocolate: { chocolate: 10, rich: 8, dessert: 8 }, coffee: { coffee: 10, rich: 7, dessert: 6 }, vanilla: { vanilla: 10, rich: 8 }, citrus: { citrus: 10, fresh: 8, coconut: 5 }, spice: { spice: 10, adventurous: 8 }, turkish: { turkish: 10, adventurous: 8, sweet: 7 }, honey: { honey: 10, classic: 10 } }, q4: { wine: { wine: 10, sweet: 6 }, cider: { cider: 10, fruity: 6, fresh: 6 }, cocktails: { cocktails: 10, adventurous: 5, fruity: 5 }, beer: { beer: 10, adventurous: 4 }, coffee: { coffee: 10, dessert: 7, rich: 7 }, “soft-drinks”: { soft: 10, nostalgic: 7, fun: 7 }, anything: { adventurous: 10, unusual: 8 } }, q5: { familiar: { familiar: 10, classic: 7 }, different: { different: 10, adventurous: 6 }, unusual: { unusual: 10, adventurous: 9 }, strange: { strange: 10, unusual: 10, adventurous: 10 } }, q6: { introduction: { introduction: 10, classic: 8, honey: 8 }, fruity: { fruitymatch: 10, fruity: 8, fruit: 8 }, rich: { richmatch: 10, rich: 9, dessert: 9 }, refreshing: { refreshing: 10, fresh: 9 }, unusual: { unusual: 10, adventurous: 9 }, fun: { fun: 10, nostalgic: 9 } } }; /* ========================================================= RESULT DESCRIPTIONS ========================================================= */ const resultDescriptions = { traditional: “You’re looking for the classic mead experience. Traditional Mead is honey-forward, smooth and a great introduction to what mead is all about.”, vanilla: “You like things smooth, sweet and indulgent. Vanilla Bean Mead combines honey with real vanilla bean for a rich dessert-style mead.”, health: “Fresh, tropical and a little different — the combination of coconut and lime makes Health Potion a refreshing choice.”, mana: “You’re drawn towards juicy, fruity flavours. Mana Potion is packed with mixed-fruit character and plenty of sweetness.”, regen: “You like your drinks with a bit of excitement. Regen Potion combines sweet cherry with a warming chilli kick.”, animals: “Cherry and coconut sounds right up your alley. Speak To Animals Potion is fruity, sweet and wonderfully dessert-like.”, “mind-reading”: “You’re not afraid of something distinctive. Potion of Mind Reading combines sweet honey wine with the floral, exotic character of Turkish delight.”, invisibility: “You have a sweet tooth and like familiar flavours. Potion of Invisibility brings caramel richness to a smooth honey wine.”, stamina: “Dessert in a glass is probably your style. Stamina Potion combines mead with rich chocolate truffle flavours.”, haste: “You like unusual flavour combinations. Haste Potion combines coffee and strawberry for something rich, fruity and very different.”, “ginger-chocolate”: “You like rich flavours but also want something unexpected. Ginger and Chocolate combines decadent chocolate with warming ginger.”, peach: “Sweet, fruity and refreshing is your combination. Peach Ice Tea Mead is inspired by the flavour of a very sweet peach iced tea.”, cola: “You clearly don’t mind thinking outside the bottle. Cola Mead is fun, nostalgic and inspired by the flavour of Pepsi Max.” }; /* ========================================================= QUIZ STATE ========================================================= */ let currentQuestion = 1; const answers = { q1: null, q2: null, q3: null, q4: null, q5: null, q6: null }; const quizQuestions = document.getElementById(“hwa-quiz-questions”); const questions = document.querySelectorAll(“#hwa-mead-quiz .hwa-question”); const currentQuestionText = document.getElementById(“hwa-current-question”); const progressBar = document.getElementById(“hwa-progress-bar”); const backButton = document.getElementById(“hwa-back”); const nextButton = document.getElementById(“hwa-next”); const errorMessage = document.getElementById(“hwa-error”); const results = document.getElementById(“hwa-results”); const resetButton = document.getElementById(“hwa-reset”); /* ========================================================= IMPORTANT: RECORD THE ANSWER IMMEDIATELY WHEN CLICKED. This avoids Flatsome/WordPress interference with checking :checked when the Next button is pressed. ========================================================= */ const allInputs = document.querySelectorAll( “#hwa-mead-quiz input[type=’radio’]” ); allInputs.forEach(function(input) { input.addEventListener(“change”, function() { const questionName = input.name; answers[questionName] = input.value; errorMessage.classList.remove(“visible”); }); }); /* ========================================================= SHOW QUESTION ========================================================= */ function showQuestion(number) { questions.forEach(function(question) { question.classList.remove(“active”); }); const target = document.querySelector( ‘#hwa-mead-quiz .hwa-question[data-question=”‘ + number + ‘”]’ ); if (target) { target.classList.add(“active”); } currentQuestion = number; currentQuestionText.textContent = number; progressBar.style.width = ((number / 6) * 100) + “%”; if (number === 1) { backButton.style.visibility = “hidden”; } else { backButton.style.visibility = “visible”; } if (number === 6) { nextButton.textContent = “See My Mead →”; } else { nextButton.textContent = “Next →”; } errorMessage.classList.remove(“visible”); } /* ========================================================= NEXT BUTTON ========================================================= */ nextButton.addEventListener(“click”, function() { const questionName = “q” + currentQuestion; const answer = answers[questionName]; if (!answer) { errorMessage.classList.add(“visible”); return; } errorMessage.classList.remove(“visible”); if (currentQuestion 1) { showQuestion(currentQuestion – 1); } }); /* ========================================================= CALCULATE RESULTS ========================================================= */ function calculateResults() { const rankedProducts = products.map(function(product) { let score = 0; Object.keys(answers).forEach(function(question) { const selectedAnswer = answers[question]; if (!selectedAnswer) { return; } const weights = answerWeights[question] && answerWeights[question][selectedAnswer]; if (!weights) { return; } Object.keys(weights).forEach(function(attribute) { const answerWeight = weights[attribute]; const productScore = product.scores[attribute] || 0; score += answerWeight * productScore; }); }); return { product: product, score: score }; }); rankedProducts.sort(function(a, b) { return b.score – a.score; }); const winner = rankedProducts[0].product; const alternatives = rankedProducts .slice(1) .filter(function(item) { return item.score > 0; }) .slice(0, 2) .map(function(item) { return item.product; }); displayResults( winner, alternatives ); } /* ========================================================= DISPLAY RESULTS ========================================================= */ function displayResults( winner, alternatives ) { quizQuestions.style.display = “none”; document.querySelector( “#hwa-mead-quiz .hwa-progress-wrap” ).style.display = “none”; results.classList.add(“active”); const resultImage = document.getElementById( “hwa-result-image” ); const resultImageLink = document.getElementById( “hwa-result-image-link” ); const resultName = document.getElementById( “hwa-result-name” ); const resultDescription = document.getElementById( “hwa-result-description” ); const resultLink = document.getElementById( “hwa-result-link” ); resultImage.src = winner.image; resultImage.alt = winner.name; resultImageLink.href = winner.url; resultName.textContent = winner.name; resultDescription.textContent = resultDescriptions[winner.id] || winner.description; resultLink.href = winner.url; const alternativesContainer = document.getElementById( “hwa-alternatives” ); alternativesContainer.innerHTML = “”; alternatives.forEach(function(product) { const card = document.createElement(“div”); card.className = “hwa-alternative”; card.innerHTML = ‘‘ + ‘‘ + ‘‘ + ‘‘ + ‘‘; alternativesContainer.appendChild( card ); }); setTimeout(function() { results.scrollIntoView({ behavior: “smooth”, block: “start” }); }, 100); } /* ========================================================= RESET QUIZ ========================================================= */ resetButton.addEventListener(“click”, function() { Object.keys(answers).forEach(function(key) { answers[key] = null; }); allInputs.forEach(function(input) { input.checked = false; }); results.classList.remove(“active”); quizQuestions.style.display = “block”; document.querySelector( “#hwa-mead-quiz .hwa-progress-wrap” ).style.display = “block”; showQuestion(1); setTimeout(function() { document .getElementById(“hwa-mead-quiz”) .scrollIntoView({ behavior: “smooth”, block: “start” }); }, 100); }); /* ========================================================= START QUIZ ========================================================= */ showQuestion(1); })();