Spaces:

DjayChucko
/

EnablingSales

Running

App Files Files

DjayChucko commited on Sep 30, 2025

Commit

c2c444e

verified ·

1 Parent(s): 6158129

Promote version f41dae3 to main

Browse files

Promoted commit f41dae3383ff9e99896499972b038fc9c12da3fe to main branch

Files changed (3) hide show

index.html +152 -516
scorecard.html +14 -11
value-mapper.html +312 -97

index.html CHANGED Viewed

@@ -1,188 +1,199 @@
 <!DOCTYPE html>
-<html lang="en">
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Sales Qualification Tool</title>
     <link rel="icon" type="image/x-icon" href="/static/favicon.ico">
     <script src="https://cdn.tailwindcss.com"></script>
-    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
-    <link href="https://unpkg.com/aos@2.3.1/dist/aos.css" rel="stylesheet">
-    <script src="https://unpkg.com/aos@2.3.1/dist/aos.js"></script>
     <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
     <script src="https://unpkg.com/feather-icons"></script>
-    <style>
-        .question-screen {
-            min-height: 100vh;
-            transition: all 0.3s ease;
-        }
-        .fade-in {
-            animation: fadeIn 0.5s;
         }
-        @keyframes fadeIn {
-            from { opacity: 0; }
-            to { opacity: 1; }
         }
-        .progress-bar {
-            height: 6px;
-            transition: width 0.5s cubic-bezier(0.4, 0, 0.2, 1);
-            box-shadow: 0 2px 4px rgba(0,0,0,0.1);
         }
-        select {
-            -webkit-appearance: none;
-            -moz-appearance: none;
-            appearance: none;
-            background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
-            background-repeat: no-repeat;
-            background-position: right 0.75rem center;
-            background-size: 1.25rem;
         }
     </style>
 </head>
-<body class="bg-purple-900 dark:bg-purple-900 text-white dark:text-white min-h-screen flex flex-col relative">
-<header class="sticky top-0 z-50 bg-purple-900/90 dark:bg-purple-900/90 backdrop-blur-md shadow-sm">
 <div class="container mx-auto px-4 py-3">
             <div class="flex justify-between items-center">
                 <a href="index.html" class="flex items-center space-x-2">
                     <span class="text-xl font-bold text-white font-heading">McGPT</span>
                 </a>
-                <nav class="hidden md:flex space-x-8">
-                    <a href="index.html" class="nav-link py-2 px-1 text-white hover:text-primary transition-colors">Home</a>
                     <a href="value-mapper.html" class="nav-link py-2 px-1 text-white hover:text-primary transition-colors">Mapper</a>
-                    <a href="scorecard.html" class="nav-link active py-2 px-1 text-white">Scorecard</a>
-                    <a href="strategy.html" class="nav-link py-2 px-1 text-white hover:text-primary transition-colors">About</a>
                 </nav>
-                <div class="flex items-center space-x-2">
-                    <button id="mobileMenuButton" class="md:hidden p-2 rounded-full hover:bg-gray-200 dark:hover:bg-gray-700">
-<div class="flex flex-col space-y-1.5">
-                            <span class="hamburger-line"></span>
-                            <span class="hamburger-line"></span>
-                            <span class="hamburger-line"></span>
-                        </div>
                     </button>
                 </div>
-</div>
             <div id="mobileMenu" class="hidden md:hidden py-4 border-t mt-3">
                 <div class="flex flex-col space-y-3">
-                    <a href="index.html" class="nav-link py-2 px-1 text-white hover:text-primary transition-colors">Home</a>
                     <a href="value-mapper.html" class="nav-link py-2 px-1 text-white hover:text-primary transition-colors">Mapper</a>
-                    <a href="scorecard.html" class="nav-link active py-2 px-1 text-white">Scorecard</a>
-                    <a href="strategy.html" class="nav-link py-2 px-1 text-white hover:text-primary transition-colors">About</a>
                 </div>
-            </div>
         </div>
     </header>
-<div id="app" class="relative overflow-hidden">
-        <!-- Industry Selection Screen -->
-        <div id="industry-screen" class="question-screen flex flex-col p-6 bg-gradient-to-b from-[#8B5CF6] to-[#A78BFA] text-white">
-<div class="flex-1 max-w-2xl mx-auto w-full">
-                <div class="text-center mb-8">
-                    <div class="w-20 h-20 bg-white/20 rounded-full flex items-center justify-center mx-auto mb-4">
-                        <i data-feather="target" class="w-10 h-10"></i>
-                    </div>
-                    <h1 class="text-white font-bold mb-2 text-[#8F1CC2]">Sales Opportunity Qualifier</h1>
-<p class="text-white font-light">Select the customer's industry to begin qualification</p>
-</div>
-                <div class="mb-6">
-                    <label for="industry" class="block text-sm font-medium text-white mb-3">Industry</label>
-<div class="relative">
-<select id="industry" class="w-full p-4 bg-white/20 border-2 border-[#F1EEFC] rounded-xl text-white focus:ring-2 focus:ring-white focus:border-white transition-all">
-<option value="" disabled selected>Select an industry</option>
-                            <option value="FSI">FSI (Financial Services)</option>
-                            <option value="Healthcare">Healthcare</option>
-                            <option value="Public Sector & Education">Public Sector & Education</option>
-                            <option value="Retail and Ecommerce">Retail and Ecommerce</option>
-                            <option value="Tech (SaaS)">Tech (SaaS)</option>
-                            <option value="Cyber">Cyber</option>
-                            <option value="Media and Entertainment">Media and Entertainment</option>
-                            <option value="Manufacturing">Manufacturing</option>
-                            <option value="Energy">Energy</option>
-                            <option value="Logistics">Logistics</option>
-                            <option value="Transport">Transport</option>
-                            <option value="Startups">Startups</option>
-                        </select>
-                        <div class="absolute inset-y-0 right-0 flex items-center pr-3 pointer-events-none">
-                            <i data-feather="chevron-down" class="text-blue-300"></i>
-                        </div>
                     </div>
                 </div>
-                <div id="industry-description" class="bg-[#6A27C0] p-4 rounded-lg mb-4 hidden">
-                    <p class="text-blue-100 text-sm"></p>
-                </div>
-                <button id="start-btn" disabled class="w-full py-4 bg-white text-[#792DD4] font-semibold rounded-xl shadow-lg hover:bg-gray-100 hover:scale-[1.02] transition-all disabled:opacity-50 disabled:cursor-not-allowed disabled:transform-none mb-4 flex items-center justify-center space-x-2">
-                    <span>Start Qualification</span>
-                    <i data-feather="arrow-right" class="w-5 h-5"></i>
-                </button>
             </div>
         </div>
-        <!-- Question Screens (initially hidden) -->
-        <div id="question-screens" class="hidden">
-            <!-- Progress Bar -->
-            <div class="fixed top-0 left-0 right-0 z-10">
-                <div class="h-1.5 bg-white/20">
-                    <div id="progress-bar" class="progress-bar bg-white h-full rounded-r-full" style="width: 0%"></div>
-                </div>
-            </div>
-            <!-- Questions will be dynamically inserted here -->
-        </div>
-        <!-- Results Screen (initially hidden) -->
-        <div id="results-screen" class="question-screen p-6 bg-gray-50 hidden">
-            <div class="flex-1">
-                <div class="text-center mb-8">
-                    <div class="w-24 h-24 bg-blue-100 rounded-full flex items-center justify-center mx-auto mb-4">
-                        <span id="score-percentage" class="text-3xl font-bold text-blue-600">0%</span>
                     </div>
-                    <h2 class="text-2xl font-bold mb-2">Qualification Complete</h2>
-                    <p id="score-message" class="text-gray-600"></p>
-                </div>
-                <div class="mb-8">
-                    <div class="flex items-center mb-4">
-                        <div class="w-8 h-8 bg-[#792DD4] rounded-lg flex items-center justify-center mr-3">
-                            <i data-feather="info" class="text-white w-4 h-4"></i>
-                        </div>
-                        <h3 class="text-xl font-bold">Industry Insights</h3>
                     </div>
-                    <div id="industry-insights" class="bg-white/90 p-5 rounded-xl shadow-md border border-white backdrop-blur-sm text-gray-800"></div>
-                </div>
-                <div class="mb-8">
-                    <div class="flex items-center mb-4">
-                        <div class="w-8 h-8 bg-[#792DD4] rounded-lg flex items-center justify-center mr-3">
-                            <i data-feather="bar-chart-2" class="text-white w-4 h-4"></i>
-                        </div>
-                        <h3 class="text-xl font-bold">Score Breakdown</h3>
                     </div>
-                    <div id="score-breakdown" class="space-y-4"></div>
-                </div>
-                <div class="mb-8">
-                    <div class="flex items-center mb-4">
-                        <div class="w-8 h-8 bg-[#792DD4] rounded-lg flex items-center justify-center mr-3">
-                            <i data-feather="alert-triangle" class="text-white w-4 h-4"></i>
-                        </div>
-                        <h3 class="text-xl font-bold">Warnings & Recommendations</h3>
                     </div>
-                    <div id="warnings" class="space-y-4"></div>
                 </div>
             </div>
-            <div class="space-y-3">
-                <button id="restart-quiz" onclick="location.href='index.html'" class="w-full py-4 bg-[#9B5CEB] text-white font-semibold rounded-xl shadow-md hover:bg-[#8B5CF6] hover:scale-[1.02] transition-all flex items-center justify-center space-x-2">
-<i data-feather="home" class="w-5 h-5"></i>
-                    <span>Return to Home</span>
-                </button>
             </div>
         </div>
-    </div>
     <script>
         // Mobile Menu Toggle
         const mobileMenuButton = document.getElementById('mobileMenuButton');
@@ -204,8 +215,7 @@
         // Set initial theme - always dark by default
         html.classList.add('dark');
         localStorage.theme = 'dark';
-        // Set active nav link
         const currentPage = window.location.pathname.split('/').pop() || 'index.html';
         document.querySelectorAll('.nav-link').forEach(link => {
             const linkHref = link.getAttribute('href');
@@ -219,380 +229,6 @@
         // Feather Icons
         feather.replace();
-        document.addEventListener('DOMContentLoaded', function() {
-feather.replace();
-            AOS.init();
-            // Question data
-            const questions = [
-                {
-                    section: "IDENTIFIED PAIN",
-                    question: "Is our deal attached to addressing customers top business pain?",
-                    answers: [
-                        { text: "Economic Buyer Agrees Pain/Project A Top Business Priority", score: 9 },
-                        { text: "Identified Pain: Specific Business Project/Need Agreed", score: 7 },
-                        { text: "Needs/Pain Partially Defined (Scope / Personas Missing)", score: 4 },
-                        { text: "Needs/Pain Unqualified (Project / Personas Unknown)", score: 1 },
-                        { text: "No Project Identified Yet; Evaluating Technologies Only", score: -3 }
-                    ]
-                },
-                {
-                    section: "CHAMPIONS",
-                    question: "Are we engaged directly with the right personas or stakeholders?",
-                    answers: [
-                        { text: "Champions & Economic Buyer Are Fully Engaged", score: 9 },
-                        { text: "Champion Incentivised & Accessing Economic Buyer", score: 6 },
-                        { text: "Established Relationship With A Qualified Champion", score: 4 },
-                        { text: "Project-Level Contacts Only, Searching For Champions", score: 0 },
-                        { text: "No Champions / Key Stakeholders Identified Yet", score: -3 }
-                    ]
-                },
-                {
-                    section: "GO LIVE PLAN",
-                    question: "Has a Go Live Proposal been accepted by all key decision makers?",
-                    answers: [
-                        { text: "Key Stakeholders Agree; Awaiting Signature", score: 9 },
-                        { text: "Economic Buyer Agrees & Has Validated Plan", score: 8 },
-                        { text: "Champion/Partner Collaborating To Complete Plan", score: 4 },
-                        { text: "Discussing Project & Timescales; Plan Incomplete", score: 0 },
-                        { text: "Too Early For Go Live Proposal", score: -3 }
-                    ]
-                },
-                {
-                    section: "METRICS & MOTIVES",
-                    question: "Have METRICS or a QBC been agreed by the ECONOMIC BUYER?",
-                    answers: [
-                        { text: "All Key Stakeholders & Buyers Agree Metrics / QBC", score: 9 },
-                        { text: "Champion Says Economic Buyer Agrees Metrics / QBC", score: 7 },
-                        { text: "We/Our Partner & Champion All Agree Metrics / QBC", score: 4 },
-                        { text: "Only We/Our Partner Understand Metrics / QBC", score: 0 },
-                        { text: "Metrics / Motives Not Yet Identified", score: -3 }
-                    ]
-                },
-                {
-                    section: "DECISION CRITERIA",
-                    question: "Do we have clearly defined and agreed DECISION CRITERIA?",
-                    answers: [
-                        { text: "Our Decision Criteria Preferred By Economic Buyer", score: 9 },
-                        { text: "Economic Buyer Agrees We Meet Requirements", score: 8 },
-                        { text: "Criteria Co-Authored & Agreed with Champion", score: 6 },
-                        { text: "Customer Sharing Specific Criteria For Demo/POC", score: 4 },
-                        { text: "Customer Using Own Criteria; Unclear If We Meet It", score: 0 },
-                        { text: "Buying Criteria Unknown/Incomplete", score: -3 }
-                    ]
-                },
-                {
-                    section: "DECISION PROCESS",
-                    question: "Why now?",
-                    answers: [
-                        { text: "Critical reason for this month or specific date", score: 9 },
-                        { text: "Financial or Strategic Impact to Champion / Business if delayed", score: 7 },
-                        { text: "No Compelling Reason, But Timeline Agreed", score: 4 },
-                        { text: "Engaged But No Compelling Reason Provided", score: 2 },
-                        { text: "Salesperson's timeline", score: -3 }
-                    ]
-                },
-                {
-                    section: "COMPETITION",
-                    question: "Does customer prefer us to COMPETITION?",
-                    answers: [
-                        { text: "Economic Buyer / Partner Agrees We Are Preferred Supplier", score: 9 },
-                        { text: "Economic Buyer Agrees Our Differentiators Address Pain", score: 7 },
-                        { text: "Champion/Partner Prefers Our Differentiators; Traps Set", score: 5 },
-                        { text: "Competition Identified, Differentiation Agreed As Of Interest", score: 3 },
-                        { text: "Competition Identified, But Not Confirmed As Preferred", score: 0 },
-                        { text: "Not Asked About Competition Yet", score: -3 }
-                    ]
-                },
-                {
-                    section: "BLOCKERS?",
-                    question: "Have we identified ALL potential blockers?",
-                    answers: [
-                        { text: "All stakeholders agree on plan to address all blockers", score: 9 },
-                        { text: "Economic Buyer agrees to help address identified blockers", score: 7 },
-                        { text: "Blockers Identified & Discussing With Champion / Partner", score: 4 },
-                        { text: "We suspect blockers; haven't asked customer directly", score: 0 },
-                        { text: "No blockers identified yet", score: -3 }
-                    ]
-                },
-                {
-                    section: "ECONOMIC BUYER",
-                    question: "Has budget availability been confirmed?",
-                    answers: [
-                        { text: "Economic Buyer Says Budget Signed Off & Secured", score: 9 },
-                        { text: "Economic Buyer Says Significant Budget assigned", score: 7 },
-                        { text: "Champion/Partner Says Budget Exists; Amount Unknown", score: 4 },
-                        { text: "Champion/Partner Confirms Budget Assigned Soon", score: 2 },
-                        { text: "Champion/Partner Still Trying To Secure Budget", score: 0 },
-                        { text: "Budget Source Not Yet Known", score: -3 }
-                    ]
-                },
-                {
-                    section: "PAPER PROCESS",
-                    question: "Where are with with pricing & contractual terms?",
-                    answers: [
-                        { text: "Pricing/Contract & Terms Agreed and Approved", score: 9 },
-                        { text: "Contract/Terms Agreed; Legal Departments Engaged", score: 7 },
-                        { text: "Quantified Business Case Agreed, Security/Privacy Teams Engaged", score: 5 },
-                        { text: "Negotiating; Building Business Case But Gaps Remain", score: 4 },
-                        { text: "Customer/Partner has requested proposal", score: 2 },
-                        { text: "Pricing / contract not discussed yet", score: -5 }
-                    ]
-                }
-            ];
-            // Industry insights
-            const industryInsights = {
-                "FSI": "Financial Services buyers prioritize regulatory compliance, data security, and ultra-low latency for real-time transactions and fraud detection.",
-                "Healthcare": "Healthcare organizations focus on HIPAA/GDPR compliance, interoperability with EHR/EMR systems, and AI-driven patient data privacy.",
-                "Public Sector & Education": "Public Sector & Education buyers value cost efficiency, scalability for public demand, and strict adherence to government/educational data policies.",
-                "Retail and Ecommerce": "Retail and Ecommerce companies need seamless omnichannel integration, AI-powered personalization, and real-time inventory/analytics.",
-                "Tech (SaaS)": "Tech (SaaS) companies look for developer-friendly APIs, scalability for user growth, and AI/ML tools for product innovation.",
-                "Cyber": "Cyber security teams require advanced threat detection, zero-trust architecture, and AI-driven automation for rapid incident response.",
-                "Media and Entertainment": "Media and Entertainment firms need high-performance content delivery, AI for recommendation engines, and scalable storage for large media files.",
-                "Manufacturing": "Manufacturing companies value predictive maintenance, IoT integration, and AI for supply chain optimization and defect detection.",
-                "Energy": "Energy sector focuses on AI for predictive analytics in asset management, compliance with energy regulations, and operational resilience.",
-                "Logistics": "Logistics companies prioritize real-time tracking, AI for route optimization, and integration with global supply chain platforms.",
-                "Transport": "Transportation firms need AI for fleet management, real-time analytics for safety/compliance, and scalable IoT integration.",
-                "Startups": "Startups typically look for pay-as-you-go pricing, rapid deployment, and AI tools that accelerate MVP development and scaling."
-            };
-            // DOM elements
-            const industryScreen = document.getElementById('industry-screen');
-            const industrySelect = document.getElementById('industry');
-            const industryDescription = document.getElementById('industry-description');
-            const startBtn = document.getElementById('start-btn');
-            const questionScreens = document.getElementById('question-screens');
-            const progressBar = document.getElementById('progress-bar');
-            const resultsScreen = document.getElementById('results-screen');
-            const scorePercentage = document.getElementById('score-percentage');
-            const scoreMessage = document.getElementById('score-message');
-            const industryInsightsDiv = document.getElementById('industry-insights');
-            const scoreBreakdown = document.getElementById('score-breakdown');
-            const warningsDiv = document.getElementById('warnings');
-            const emailReportBtn = document.getElementById('email-report');
-            const restartQuizBtn = document.getElementById('restart-quiz');
-            // App state
-            let currentQuestion = 0;
-            let selectedIndustry = '';
-            let answers = [];
-            let totalScore = 0;
-            const maxPossibleScore = questions.length * 9;
-            // Event listeners
-            industrySelect.addEventListener('change', function() {
-                selectedIndustry = this.value;
-                const description = industryInsights[selectedIndustry];
-                if (description) {
-                    industryDescription.querySelector('p').textContent = description;
-                    industryDescription.classList.remove('hidden');
-                    startBtn.disabled = false;
-                } else {
-                    industryDescription.classList.add('hidden');
-                    startBtn.disabled = true;
-                }
-            });
-            startBtn.addEventListener('click', function() {
-                industryScreen.classList.add('hidden');
-                questionScreens.classList.remove('hidden');
-                renderQuestion(currentQuestion);
-            });
-            emailReportBtn.addEventListener('click', function() {
-                this.innerHTML = '<i data-feather="check" class="mr-2"></i> Report Sent!';
-                feather.replace();
-                setTimeout(() => {
-                    this.innerHTML = '<i data-feather="mail" class="mr-2"></i> Email Report';
-                    feather.replace();
-                }, 2000);
-            });
-            function resetQuiz() {
-                currentQuestion = 0;
-                selectedIndustry = '';
-                answers = [];
-                totalScore = 0;
-                industryScreen.classList.remove('hidden');
-                questionScreens.classList.add('hidden');
-                resultsScreen.classList.add('hidden');
-                industrySelect.value = '';
-                industryDescription.classList.add('hidden');
-                startBtn.disabled = true;
-            }
-            restartQuizBtn.addEventListener('click', resetQuiz);
-// Render question
-            function renderQuestion(index) {
-                if (index >= questions.length) {
-                    showResults();
-                    return;
-                }
-                const question = questions[index];
-                const progress = ((index) / questions.length) * 100;
-                progressBar.style.width = `${progress}%`;
-                // Create question screen
-                const questionScreen = document.createElement('div');
-                questionScreen.className = `question-screen flex flex-col p-6 bg-white/90 backdrop-blur-sm fade-in`;
-                questionScreen.id = `question-${index}`;
-                questionScreen.innerHTML = `
-                    <div class="flex-1">
-                        <div class="mb-4">
-                            <span class="text-sm font-medium text-blue-600">${question.section}</span>
-                            <h2 class="text-xl font-bold mt-1 mb-2">${question.question}</h2>
-                        </div>
-                        <div class="mb-4">
-                            <label for="answer-${index}" class="block text-sm font-medium text-gray-700 mb-2">Select answer</label>
-                            <div class="relative">
-                                <select id="answer-${index}" class="w-full p-3 bg-white/90 border border-gray-300 rounded-lg focus:ring-2 focus:ring-[#9B5CEB] focus:border-[#9B5CEB]">
-                                    <option value="" disabled selected>Select an answer</option>
-                                    ${question.answers.map(a => `<option value="${a.score}">${a.text}</option>`).join('')}
-                                </select>
-                                <div class="absolute inset-y-0 right-0 flex items-center pr-3 pointer-events-none">
-                                    <i data-feather="chevron-down"></i>
-                                </div>
-                            </div>
-                        </div>
-<button id="next-btn-${index}" disabled class="w-full py-3 bg-[#9B5CEB] text-white font-semibold rounded-lg shadow-md hover:bg-[#8B5CF6] transition disabled:opacity-50 disabled:cursor-not-allowed mb-4">
-${index === questions.length - 1 ? 'Finish' : 'Next'}
-                        </button>
-                    </div>
-                `;
-                // Clear previous question and add new one
-                questionScreens.innerHTML = '';
-                questionScreens.appendChild(questionScreen);
-                feather.replace();
-                // Set up event listeners for new question
-                const answerSelect = document.getElementById(`answer-${index}`);
-                const nextBtn = document.getElementById(`next-btn-${index}`);
-                answerSelect.addEventListener('change', function() {
-                    nextBtn.disabled = !this.value;
-                });
-                nextBtn.addEventListener('click', function() {
-                    const score = parseInt(answerSelect.value);
-                    answers.push({
-                        question: question.question,
-                        answer: answerSelect.options[answerSelect.selectedIndex].text,
-                        score: score,
-                        section: question.section
-                    });
-                    totalScore += score;
-                    currentQuestion++;
-                    renderQuestion(currentQuestion);
-                });
-            }
-            // Show results
-            function showResults() {
-                questionScreens.classList.add('hidden');
-                resultsScreen.classList.remove('hidden');
-                // Calculate percentage (normalize to 0-100 scale)
-                const normalizedScore = Math.max(0, totalScore + (questions.length * 3)); // Adjust for negative scores
-                const percentage = Math.round((normalizedScore / (maxPossibleScore + (questions.length * 3))) * 100);
-                scorePercentage.textContent = `${percentage}%`;
-                // Set score message
-                if (percentage >= 80) {
-                    scoreMessage.textContent = "High probability of winning! This opportunity is well-qualified.";
-                } else if (percentage >= 60) {
-                    scoreMessage.textContent = "Good chance of winning. Focus on improving weaker areas.";
-                } else if (percentage >= 40) {
-                    scoreMessage.textContent = "Moderate chance. Significant improvements needed in several areas.";
-                } else {
-                    scoreMessage.textContent = "Low probability. Consider whether to continue pursuing this opportunity.";
-                }
-                // Set industry insights
-                industryInsightsDiv.textContent = industryInsights[selectedIndustry];
-                // Create score breakdown
-                scoreBreakdown.innerHTML = '';
-                answers.forEach((answer, index) => {
-                    const sectionScore = document.createElement('div');
-                    sectionScore.className = 'bg-white p-4 rounded-lg shadow-sm border border-gray-200';
-                    const scoreRatio = answer.score / 9;
-                    let scoreColor;
-                    if (scoreRatio >= 0.8) scoreColor = 'text-green-600';
-                    else if (scoreRatio >= 0.5) scoreColor = 'text-yellow-600';
-                    else scoreColor = 'text-red-600';
-                    sectionScore.innerHTML = `
-                        <div class="flex justify-between items-start mb-2">
-                            <h4 class="font-medium">${answer.section}</h4>
-                            <span class="font-bold ${scoreColor}">${answer.score}/9</span>
-                        </div>
-                        <p class="text-sm text-gray-600 mb-2">${answer.answer}</p>
-                    `;
-                    scoreBreakdown.appendChild(sectionScore);
-                });
-                // Create warnings
-                warningsDiv.innerHTML = '';
-                const lowScores = answers.filter(a => a.score < 5);
-                // Add more industry-specific recommendations as needed
-                if (lowScores.length === 0) {
-                    warningsDiv.innerHTML = `
-                        <div class="bg-green-50 p-4 rounded-lg border border-green-200 text-green-800">
-                            <p>No critical weaknesses identified. All areas scored well.</p>
-                        </div>
-                    `;
-                } else {
-                    lowScores.forEach(score => {
-                        const warning = document.createElement('div');
-                        warning.className = 'bg-red-50 p-4 rounded-lg border border-red-200 text-red-800';
-                        let advice = '';
-                        if (score.section === "IDENTIFIED PAIN") {
-                            advice = "Work with the customer to better define their business pain and how your solution addresses it.";
-                        } else if (score.section === "CHAMPIONS") {
-                            advice = "Identify and engage with champions who can influence the economic buyer.";
-                        } else if (score.section === "GO LIVE PLAN") {
-                            advice = "Develop a clear implementation plan with agreed timelines and milestones.";
-                        } else if (score.section === "METRICS & MOTIVES") {
-                            advice = "Establish clear metrics for success that are agreed by all stakeholders.";
-                        } else if (score.section === "DECISION CRITERIA") {
-                            advice = "Ensure your solution meets the customer's decision criteria or work to influence those criteria.";
-                        } else if (score.section === "DECISION PROCESS") {
-                            advice = "Identify and document the compelling reason for the customer to act now.";
-                        } else if (score.section === "COMPETITION") {
-                            advice = "Differentiate your solution and establish why you're the preferred choice.";
-                        } else if (score.section === "BLOCKERS?") {
-                            advice = "Identify and address any potential blockers to the deal progressing.";
-                        } else if (score.section === "ECONOMIC BUYER") {
-                            advice = "Confirm budget availability and secure commitment from the economic buyer.";
-                        } else if (score.section === "PAPER PROCESS") {
-                            advice = "Advance discussions on pricing and contractual terms to avoid last-minute hurdles.";
-                        }
-                        warning.innerHTML = `
-                            <h4 class="font-semibold mb-1">${score.section}</h4>
-                            <p class="text-sm mb-2">${score.question}</p>
-                            <p class="text-sm font-medium">Recommendation: ${advice}</p>
-                        `;
-                        warningsDiv.appendChild(warning);
-                    });
-                }
-            }
-        });
-    </script>
     </script>
 </body>
-</html>

 <!DOCTYPE html>
+<html lang="en" class="scroll-smooth">
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta name="description" content="ValueVortex Navigator - Your strategic sales companion">
+    <title> Pod Value Mapper | Home</title>
     <link rel="icon" type="image/x-icon" href="/static/favicon.ico">
     <script src="https://cdn.tailwindcss.com"></script>
     <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
     <script src="https://unpkg.com/feather-icons"></script>
+    <script>
+        tailwind.config = {
+            darkMode: 'class',
+            theme: {
+                extend: {
+                    colors: {
+                        primary: '#6366f1',
+                        secondary: '#8b5cf6',
+                        dark: '#1e293b'
+                    }
+                }
+            }
         }
+    </script>
+    <style>
+        .nav-link.active {
+            @apply text-primary font-medium border-b-2 border-primary;
         }
+        .card-hover {
+            @apply transition-all duration-300 hover:scale-105 hover:shadow-xl;
         }
+        .hamburger-line {
+            @apply w-6 h-0.5 bg-current transition-all duration-300;
         }
     </style>
 </head>
+<body class="bg-purple-900 dark:bg-purple-900 text-white dark:text-white min-h-screen flex flex-col relative" style="background-image: radial-gradient(circle at 25% 25%, rgba(59, 7, 100, 0.4) 0%, rgba(59, 7, 100, 0) 50%), radial-gradient(circle at 75% 75%, rgba(76, 29, 149, 0.4) 0%, rgba(76, 29, 149, 0) 50%);">
+<header class="sticky top-0 z-50 bg-purple-800/80 dark:bg-purple-800/80 backdrop-blur-md shadow-sm">
 <div class="container mx-auto px-4 py-3">
             <div class="flex justify-between items-center">
                 <a href="index.html" class="flex items-center space-x-2">
                     <span class="text-xl font-bold text-white font-heading">McGPT</span>
                 </a>
+<nav class="hidden md:flex space-x-8">
+                    <a href="index.html" class="nav-link active py-2 px-1 text-white">Home</a>
                     <a href="value-mapper.html" class="nav-link py-2 px-1 text-white hover:text-primary transition-colors">Mapper</a>
+                    <a href="scorecard.html" class="nav-link py-2 px-1 text-white hover:text-primary transition-colors">Scorecard</a>
+<a href="strategy.html" class="nav-link py-2 px-1 text-white hover:text-primary transition-colors">About</a>
                 </nav>
+<div class="flex items-center space-x-4">
+                    <button id="themeToggle" class="p-2 rounded-full hover:bg-gray-200 dark:hover:bg-gray-700">
+                        <i data-feather="moon" class="hidden dark:block"></i>
+                        <i data-feather="sun" class="block dark:hidden"></i>
+                    </button>
+                    <button id="mobileMenuButton" class="md:hidden flex flex-col space-y-1.5 p-2">
+                        <span class="hamburger-line"></span>
+                        <span class="hamburger-line"></span>
+                        <span class="hamburger-line"></span>
                     </button>
                 </div>
+            </div>
             <div id="mobileMenu" class="hidden md:hidden py-4 border-t mt-3">
                 <div class="flex flex-col space-y-3">
+                    <a href="index.html" class="nav-link active py-2 px-1 text-white">Home</a>
                     <a href="value-mapper.html" class="nav-link py-2 px-1 text-white hover:text-primary transition-colors">Mapper</a>
+                    <a href="scorecard.html" class="nav-link py-2 px-1 text-white hover:text-primary transition-colors">Scorecard</a>
+<a href="strategy.html" class="nav-link py-2 px-1 text-white hover:text-primary transition-colors">About</a>
                 </div>
+</div>
         </div>
     </header>
+    <section class="flex-grow bg-purple-800 backdrop-blur-sm">
+<div class="container mx-auto px-4 py-16 md:py-24">
+            <div class="flex flex-col md:flex-row items-center">
+                <div class="md:w-1/2 mb-12 md:mb-0">
+                    <h1 class="text-4xl md:text-5xl font-bold mb-6 leading-tight text-white">
+Raise <span class="bg-gradient-to-r from-primary to-secondary bg-clip-text text-transparent">your</span> game
+                    </h1>
+<p class="text-xl mb-8 text-white dark:text-white font-light">
+McGPT is here to assist you with strategic tools to qualify and quantify better, onboard more effectively, and implement winning sales strategies.
+                    </p>
+                    <div class="flex space-x-4">
+                        <a href="value-mapper.html" class="bg-[#9B5CEB] hover:bg-[#8B5CF6] text-white px-6 py-3 rounded-lg font-medium transition-colors shadow-lg">
+Start Mapping
+                        </a>
                     </div>
                 </div>
+                <div class="md:w-1/2"></div>
             </div>
         </div>
+    </section>
+    <section id="features" class="py-16 bg-purple-800 backdrop-blur-sm">
+<div class="container mx-auto px-4">
+            <h2 class="text-3xl font-bold text-center mb-12">Our Strategic Toolkit</h2>
+            <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-8">
+                <a href="value-mapper.html" class="bg-white dark:bg-gray-700 rounded-xl p-6 shadow-md card-hover">
+                    <div class="w-12 h-12 rounded-lg bg-primary/10 flex items-center justify-center mb-4">
+                        <i data-feather="map" class="text-primary"></i>
                     </div>
+                    <h3 class="text-xl font-semibold mb-2">Value Mapper</h3>
+                    <p class="text-gray-600 dark:text-gray-300">Qualify leads effectively by mapping their values to your solutions.</p>
+                </a>
+                <a href="about.html" class="bg-white dark:bg-gray-700 rounded-xl p-6 shadow-md card-hover">
+                    <div class="w-12 h-12 rounded-lg bg-secondary/10 flex items-center justify-center mb-4">
+                        <i data-feather="users" class="text-secondary"></i>
                     </div>
+                    <h3 class="text-xl font-semibold mb-2">Onboarding</h3>
+                    <p class="text-gray-600 dark:text-gray-300">Streamline your team's onboarding with our comprehensive resources.</p>
+                </a>
+                <a href="strategy.html" class="bg-white dark:bg-gray-700 rounded-xl p-6 shadow-md card-hover">
+                    <div class="w-12 h-12 rounded-lg bg-primary/10 flex items-center justify-center mb-4">
+                        <i data-feather="trending-up" class="text-primary"></i>
                     </div>
+                    <h3 class="text-xl font-semibold mb-2">Sales Strategy</h3>
+                    <p class="text-gray-600 dark:text-gray-300">Implement our proven value-centric sales methodology.</p>
+                </a>
+                <div class="bg-white dark:bg-gray-700 rounded-xl p-6 shadow-md card-hover">
+                    <div class="w-12 h-12 rounded-lg bg-secondary/10 flex items-center justify-center mb-4">
+                        <i data-feather="bar-chart-2" class="text-secondary"></i>
                     </div>
+                    <h3 class="text-xl font-semibold mb-2">Performance Analytics</h3>
+                    <p class="text-gray-600 dark:text-gray-300">Track and optimize your sales performance with real-time insights.</p>
                 </div>
             </div>
+        </div>
+    </section>
+    <section class="py-16 bg-gradient-to-r from-primary/90 to-secondary/90 backdrop-blur-sm bg-opacity-90">
+<div class="container mx-auto px-4 text-center">
+            <h2 class="text-3xl font-bold text-white mb-6">Ready to Transform Your Sales Approach?</h2>
+            <p class="text-white/90 mb-8 max-w-2xl mx-auto">
+                Join hundreds of sales professionals who have revolutionized their pipeline with ValueVortex Navigator.
+            </p>
+            <div class="flex justify-center">
+                <a href="about.html" class="bg-[#9B5CEB] hover:bg-[#8B5CF6] text-white px-8 py-3 rounded-lg font-medium transition-colors">
+Learn More
+                </a>
+            </div>
+</div>
+    </section>
+    <footer class="bg-purple-800 backdrop-blur-sm border-t border-gray-700">
+<div class="container mx-auto px-4 py-8">
+            <div class="flex flex-col md:flex-row justify-between items-center">
+                <div class="mb-6 md:mb-0">
+                    <a href="index.html" class="flex items-center space-x-2">
+<span class="text-lg font-bold text-white font-heading">McGPT</span>
+</a>
+                    <p class="text-gray-600 dark:text-gray-300 mt-2 text-sm">
+                    Navigating your sales success with AI since 2023
+</p>
+                </div>
+                <div class="grid grid-cols-2 md:grid-cols-3 gap-8">
+                    <div>
+                        <h3 class="text-sm font-semibold text-gray-500 dark:text-gray-400 uppercase tracking-wider mb-4">Resources</h3>
+                        <ul class="space-y-2">
+                            <li><a href="about.html" class="text-gray-600 dark:text-gray-300 hover:text-primary transition-colors">Onboarding</a></li>
+                            <li><a href="strategy.html" class="text-gray-600 dark:text-gray-300 hover:text-primary transition-colors">Strategy</a></li>
+                            <li><a href="#" class="text-gray-600 dark:text-gray-300 hover:text-primary transition-colors">Blog</a></li>
+                        </ul>
+                    </div>
+                    <div>
+                        <h3 class="text-sm font-semibold text-gray-500 dark:text-gray-400 uppercase tracking-wider mb-4">Company</h3>
+                        <ul class="space-y-2">
+                            <li><a href="#" class="text-gray-600 dark:text-gray-300 hover:text-primary transition-colors">About</a></li>
+                            <li><a href="#" class="text-gray-600 dark:text-gray-300 hover:text-primary transition-colors">Careers</a></li>
+                            <li><a href="#" class="text-gray-600 dark:text-gray-300 hover:text-primary transition-colors">Contact</a></li>
+                        </ul>
+                    </div>
+                    <div class="col-span-2 md:col-span-1">
+                        <h3 class="text-sm font-semibold text-gray-500 dark:text-gray-400 uppercase tracking-wider mb-4">Connect</h3>
+                        <div class="flex space-x-4">
+                            <a href="#" class="text-gray-600 dark:text-gray-300 hover:text-primary transition-colors">
+                                <i data-feather="twitter"></i>
+                            </a>
+                            <a href="#" class="text-gray-600 dark:text-gray-300 hover:text-primary transition-colors">
+                                <i data-feather="linkedin"></i>
+                            </a>
+                            <a href="#" class="text-gray-600 dark:text-gray-300 hover:text-primary transition-colors">
+                                <i data-feather="github"></i>
+                            </a>
+                        </div>
+                    </div>
+                </div>
             </div>
+            <div class="mt-8 pt-8 border-t border-gray-200 dark:border-gray-700 text-center text-sm text-gray-500 dark:text-gray-400">
+                <p>&copy; 2023 McGPT Navigator. All rights reserved.</p>
+</div>
         </div>
+    </footer>
     <script>
         // Mobile Menu Toggle
         const mobileMenuButton = document.getElementById('mobileMenuButton');
         // Set initial theme - always dark by default
         html.classList.add('dark');
         localStorage.theme = 'dark';
+// Set active nav link
         const currentPage = window.location.pathname.split('/').pop() || 'index.html';
         document.querySelectorAll('.nav-link').forEach(link => {
             const linkHref = link.getAttribute('href');
         // Feather Icons
         feather.replace();
     </script>
 </body>
+</html

scorecard.html CHANGED Viewed

@@ -52,16 +52,19 @@
                     <a href="scorecard.html" class="nav-link active py-2 px-1 text-white">Scorecard</a>
                     <a href="strategy.html" class="nav-link py-2 px-1 text-white hover:text-primary transition-colors">About</a>
                 </nav>
-                <div class="flex items-center space-x-2">
-                    <button id="mobileMenuButton" class="md:hidden p-2 rounded-full hover:bg-gray-200 dark:hover:bg-gray-700">
-<div class="flex flex-col space-y-1.5">
-                            <span class="hamburger-line"></span>
-                            <span class="hamburger-line"></span>
-                            <span class="hamburger-line"></span>
-                        </div>
                     </button>
                 </div>
-</div>
             <div id="mobileMenu" class="hidden md:hidden py-4 border-t mt-3">
                 <div class="flex flex-col space-y-3">
@@ -81,14 +84,14 @@
                     <div class="w-20 h-20 bg-white/20 rounded-full flex items-center justify-center mx-auto mb-4">
                         <i data-feather="target" class="w-10 h-10"></i>
                     </div>
-                    <h1 class="text-white font-bold mb-2 text-[#8F1CC2]">Sales Opportunity Qualifier</h1>
 <p class="text-white font-light">Select the customer's industry to begin qualification</p>
 </div>
                 <div class="mb-6">
-                    <label for="industry" class="block text-sm font-medium text-white mb-3">Industry</label>
 <div class="relative">
-<select id="industry" class="w-full p-4 bg-white/20 border-2 border-[#F1EEFC] rounded-xl text-white focus:ring-2 focus:ring-white focus:border-white transition-all">
 <option value="" disabled selected>Select an industry</option>
                             <option value="FSI">FSI (Financial Services)</option>
                             <option value="Healthcare">Healthcare</option>

                     <a href="scorecard.html" class="nav-link active py-2 px-1 text-white">Scorecard</a>
                     <a href="strategy.html" class="nav-link py-2 px-1 text-white hover:text-primary transition-colors">About</a>
                 </nav>
+                <div class="flex items-center space-x-4">
+                    <button id="themeToggle" class="p-2 rounded-full hover:bg-gray-200 dark:hover:bg-gray-700">
+                        <i data-feather="moon" class="hidden dark:block"></i>
+                        <i data-feather="sun" class="block dark:hidden"></i>
+                    </button>
+                    <button id="mobileMenuButton" class="md:hidden flex flex-col space-y-1.5 p-2">
+                        <span class="hamburger-line"></span>
+                        <span class="hamburger-line"></span>
+                        <span class="hamburger-line"></span>
                     </button>
                 </div>
+            </div>
             <div id="mobileMenu" class="hidden md:hidden py-4 border-t mt-3">
                 <div class="flex flex-col space-y-3">
                     <div class="w-20 h-20 bg-white/20 rounded-full flex items-center justify-center mx-auto mb-4">
                         <i data-feather="target" class="w-10 h-10"></i>
                     </div>
+                    <h1 class="text-3xl font-bold mb-2 text-[#8F1CC2]">Sales Opportunity Qualifier</h1>
 <p class="text-white font-light">Select the customer's industry to begin qualification</p>
 </div>
                 <div class="mb-6">
+                    <label for="industry" class="block text-sm font-medium text-[#792DD4] mb-3">Industry</label>
 <div class="relative">
+<select id="industry" class="w-full p-4 bg-white/20 border-2 border-[#F1EEFC] rounded-xl text-[#521094] focus:ring-2 focus:ring-white focus:border-white transition-all">
 <option value="" disabled selected>Select an industry</option>
                             <option value="FSI">FSI (Financial Services)</option>
                             <option value="Healthcare">Healthcare</option>

value-mapper.html CHANGED Viewed

@@ -3,14 +3,16 @@
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <meta name="description" content="McGPT - Wheres the value? - Your strategic sales companion">
-    <title> always be connecting | Home</title>
     <link rel="icon" type="image/x-icon" href="/static/favicon.ico">
     <script src="https://cdn.tailwindcss.com"></script>
     <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
     <script src="https://unpkg.com/feather-icons"></script>
     <script>
-        tailwind.config = {
             darkMode: 'class',
             theme: {
                 extend: {
@@ -48,16 +50,19 @@
                     <a href="scorecard.html" class="nav-link py-2 px-1 text-white hover:text-primary transition-colors">Scorecard</a>
 <a href="strategy.html" class="nav-link py-2 px-1 text-white hover:text-primary transition-colors">About</a>
                 </nav>
-                <div class="flex items-center space-x-2">
-                    <button id="mobileMenuButton" class="md:hidden p-2 rounded-full hover:bg-gray-200 dark:hover:bg-gray-700">
-<div class="flex flex-col space-y-1.5">
-                            <span class="hamburger-line"></span>
-                            <span class="hamburger-line"></span>
-                            <span class="hamburger-line"></span>
-                        </div>
                     </button>
                 </div>
-</div>
             <div id="mobileMenu" class="hidden md:hidden py-4 border-t mt-3">
                 <div class="flex flex-col space-y-3">
@@ -66,82 +71,98 @@
                     <a href="scorecard.html" class="nav-link py-2 px-1 text-white hover:text-primary transition-colors">Scorecard</a>
 <a href="strategy.html" class="nav-link py-2 px-1 text-white hover:text-primary transition-colors">About</a>
                 </div>
-</div>
         </div>
     </header>
-    <section class="flex-grow bg-purple-800 backdrop-blur-sm">
 <div class="container mx-auto px-4 py-16 md:py-24">
-            <div class="flex flex-col md:flex-row items-center">
-                <div class="md:w-1/2 mb-12 md:mb-0">
-                    <h1 class="text-4xl md:text-5xl font-bold mb-6 leading-tight text-white">
-Raise <span class="bg-gradient-to-r from-primary to-secondary bg-clip-text text-transparent">your</span> game
                     </h1>
-<p class="text-xl mb-8 text-white dark:text-white font-light">
-McGPT is here to assist you with strategic tools to qualify and quantify better, onboard more effectively, and implement winning sales strategies.
                     </p>
-                    <div class="flex space-x-4">
-                        <a href="value-mapper.html" class="bg-[#9B5CEB] hover:bg-[#8B5CF6] text-white px-6 py-3 rounded-lg font-medium transition-colors shadow-lg">
-Start Mapping
-                        </a>
-                    </div>
-                </div>
-                <div class="md:w-1/2"></div>
             </div>
-        </div>
-    </section>
-    <section id="features" class="py-16 bg-purple-800 backdrop-blur-sm">
-<div class="container mx-auto px-4">
-            <h2 class="text-3xl font-bold text-center mb-12">Our Strategic Toolkit</h2>
-            <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-8">
-                <a href="value-mapper.html" class="bg-white dark:bg-gray-700 rounded-xl p-6 shadow-md card-hover">
-                    <div class="w-12 h-12 rounded-lg bg-primary/10 flex items-center justify-center mb-4">
-                        <i data-feather="map" class="text-primary"></i>
-                    </div>
-                    <h3 class="text-xl font-semibold mb-2">Value Mapper</h3>
-                    <p class="text-gray-600 dark:text-gray-300">Qualify leads effectively by mapping their values to your solutions.</p>
-                </a>
-                <a href="about.html" class="bg-white dark:bg-gray-700 rounded-xl p-6 shadow-md card-hover">
-                    <div class="w-12 h-12 rounded-lg bg-secondary/10 flex items-center justify-center mb-4">
-                        <i data-feather="users" class="text-secondary"></i>
-                    </div>
-                    <h3 class="text-xl font-semibold mb-2">Onboarding</h3>
-                    <p class="text-gray-600 dark:text-gray-300">Streamline your team's onboarding with our comprehensive resources.</p>
-                </a>
-                <a href="strategy.html" class="bg-white dark:bg-gray-700 rounded-xl p-6 shadow-md card-hover">
-                    <div class="w-12 h-12 rounded-lg bg-primary/10 flex items-center justify-center mb-4">
-                        <i data-feather="trending-up" class="text-primary"></i>
                     </div>
-                    <h3 class="text-xl font-semibold mb-2">Sales Strategy</h3>
-                    <p class="text-gray-600 dark:text-gray-300">Implement our proven value-centric sales methodology.</p>
-                </a>
-                <div class="bg-white dark:bg-gray-700 rounded-xl p-6 shadow-md card-hover">
-                    <div class="w-12 h-12 rounded-lg bg-secondary/10 flex items-center justify-center mb-4">
-                        <i data-feather="bar-chart-2" class="text-secondary"></i>
                     </div>
-                    <h3 class="text-xl font-semibold mb-2">Performance Analytics</h3>
-                    <p class="text-gray-600 dark:text-gray-300">Track and optimize your sales performance with real-time insights.</p>
-                </div>
             </div>
         </div>
-    </section>
-    <section class="py-16 bg-gradient-to-r from-primary/90 to-secondary/90 backdrop-blur-sm bg-opacity-90">
-<div class="container mx-auto px-4 text-center">
-            <h2 class="text-3xl font-bold text-white mb-6">Ready to Transform Your Sales Approach?</h2>
-            <p class="text-white/90 mb-8 max-w-2xl mx-auto">
-                Join hundreds of sales professionals who have revolutionized their pipeline with ValueVortex Navigator.
-            </p>
-            <div class="flex justify-center">
-                <a href="about.html" class="bg-[#9B5CEB] hover:bg-[#8B5CF6] text-white px-8 py-3 rounded-lg font-medium transition-colors">
-Learn More
-                </a>
-            </div>
-</div>
-    </section>
-    <footer class="bg-purple-800 backdrop-blur-sm border-t border-gray-700">
 <div class="container mx-auto px-4 py-8">
             <div class="flex flex-col md:flex-row justify-between items-center">
                 <div class="mb-6 md:mb-0">
@@ -151,24 +172,6 @@ Learn More
                     <p class="text-gray-600 dark:text-gray-300 mt-2 text-sm">
                     Navigating your sales success with AI since 2023
 </p>
-                </div>
-                <div class="grid grid-cols-2 md:grid-cols-3 gap-8">
-                    <div>
-                        <h3 class="text-sm font-semibold text-gray-500 dark:text-gray-400 uppercase tracking-wider mb-4">Resources</h3>
-                        <ul class="space-y-2">
-                            <li><a href="about.html" class="text-gray-600 dark:text-gray-300 hover:text-primary transition-colors">Onboarding</a></li>
-                            <li><a href="strategy.html" class="text-gray-600 dark:text-gray-300 hover:text-primary transition-colors">Strategy</a></li>
-                            <li><a href="#" class="text-gray-600 dark:text-gray-300 hover:text-primary transition-colors">Blog</a></li>
-                        </ul>
-                    </div>
-                    <div>
-                        <h3 class="text-sm font-semibold text-gray-500 dark:text-gray-400 uppercase tracking-wider mb-4">Company</h3>
-                        <ul class="space-y-2">
-                            <li><a href="#" class="text-gray-600 dark:text-gray-300 hover:text-primary transition-colors">About</a></li>
-                            <li><a href="#" class="text-gray-600 dark:text-gray-300 hover:text-primary transition-colors">Careers</a></li>
-                            <li><a href="#" class="text-gray-600 dark:text-gray-300 hover:text-primary transition-colors">Contact</a></li>
-                        </ul>
-                    </div>
                     <div class="col-span-2 md:col-span-1">
                         <h3 class="text-sm font-semibold text-gray-500 dark:text-gray-400 uppercase tracking-wider mb-4">Connect</h3>
                         <div class="flex space-x-4">
@@ -190,7 +193,6 @@ Learn More
 </div>
         </div>
     </footer>
     <script>
         // Mobile Menu Toggle
         const mobileMenuButton = document.getElementById('mobileMenuButton');
@@ -226,6 +228,219 @@ Learn More
         // Feather Icons
         feather.replace();
     </script>
 </body>
-</html

 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta name="description" content="ValueVortex Navigator - Your strategic sales companion">
+    <title> Pod Value Mapper | Home</title>
     <link rel="icon" type="image/x-icon" href="/static/favicon.ico">
     <script src="https://cdn.tailwindcss.com"></script>
     <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
     <script src="https://unpkg.com/feather-icons"></script>
+    <!-- Add jsPDF library for PDF generation -->
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/2.5.1/jspdf.umd.min.js"></script>
     <script>
+tailwind.config = {
             darkMode: 'class',
             theme: {
                 extend: {
                     <a href="scorecard.html" class="nav-link py-2 px-1 text-white hover:text-primary transition-colors">Scorecard</a>
 <a href="strategy.html" class="nav-link py-2 px-1 text-white hover:text-primary transition-colors">About</a>
                 </nav>
+<div class="flex items-center space-x-4">
+                    <button id="themeToggle" class="p-2 rounded-full hover:bg-gray-200 dark:hover:bg-gray-700">
+                        <i data-feather="moon" class="hidden dark:block"></i>
+                        <i data-feather="sun" class="block dark:hidden"></i>
+                    </button>
+                    <button id="mobileMenuButton" class="md:hidden flex flex-col space-y-1.5 p-2">
+                        <span class="hamburger-line"></span>
+                        <span class="hamburger-line"></span>
+                        <span class="hamburger-line"></span>
                     </button>
                 </div>
+            </div>
             <div id="mobileMenu" class="hidden md:hidden py-4 border-t mt-3">
                 <div class="flex flex-col space-y-3">
                     <a href="scorecard.html" class="nav-link py-2 px-1 text-white hover:text-primary transition-colors">Scorecard</a>
 <a href="strategy.html" class="nav-link py-2 px-1 text-white hover:text-primary transition-colors">About</a>
                 </div>
+            </div>
         </div>
     </header>
+    <main class="flex-grow bg-gradient-to-b from-[#8B5CF6] to-[#A78BFA] backdrop-blur-sm">
 <div class="container mx-auto px-4 py-16 md:py-24">
+<div class="mb-10 p-6 bg-gradient-to-tr from-indigo-200 to-purple-200 rounded-xl shadow-xl no-print hover:shadow-2xl transition-shadow duration-300 backdrop-blur-sm hovered-element">
+                    <label for="industry-selector" class="block text-2xl font-bold text-gray-800 mb-4">
+Select Your Industry Sector:
+                    </label>
+                    <div class="relative">
+<select id="industry-selector" onchange="updateContent()" class="block w-full py-4 px-6 pr-12 border-2 border-white rounded-xl text-xl font-semibold text-[#521094] bg-white/90 focus:ring-4 focus:ring-secondary focus:border-secondary transition duration-200 shadow-lg">
+<option value="placeholder" disabled="" selected="" class="text-gray-600">
+--- Choose an Industry to Map Value ---
+                        </option>
+                        <option value="Financial Services and Insurance">Financial Services and Insurance</option>
+                        <option value="Healthcare and Biotechnology">Healthcare and Biotechnology</option>
+                        <option value="E-commerce and Retail">E-commerce and Retail</option>
+                        <option value="Media and Entertainment">Media and Entertainment</option>
+                        <option value="Gaming">Gaming</option>
+                        <option value="Education and Research">Education and Research</option>
+                        <option value="Government and Public Sector">Government and Public Sector</option>
+                        <option value="Cyber">Cyber</option>
+                        <option value="Manufacturing">Manufacturing</option>
+                        <option value="Energy">Energy</option>
+                        <option value="Logistics">Logistics</option>
+                        <option value="Transport">Transport</option>
+                        <option value="Technology/SaaS">Technology/SaaS</option>
+                        <option value="Startup">Startup</option>
+                    </select>
+                </div>
+            </div>
+            <div class="text-center mb-10 bg-[#F1EEFC] p-8 rounded-2xl shadow-2xl border-t-4 border-primary hover:border-secondary transition-all duration-300 backdrop-blur-sm">
+                    <h1 class="text-4xl sm:text-5xl font-heading font-extrabold text-gray-800 mb-3 leading-tight">
+Pod Value Mapper
                     </h1>
+                    <p class="text-xl text-[#792DD4] font-light">
+Your essential tool for qualification and value articulation.
                     </p>
+<div class="my-4 h-0.5 w-1/4 mx-auto bg-black"></div>
+                <p class="text-lg text-gray-600 mb-4">
+Identify pain points and frame conversations around Scaleway's key values:
+                </p>
+                <div class="grid grid-cols-1 md:grid-cols-3 gap-4 max-w-2xl mx-auto">
+                    <div class="bg-white/80 p-3 rounded-lg border-l-2 border-primary">
+                        <p class="font-medium text-[#792DD4]">European Data Sovereignty</p>
+</div>
+                    <div class="bg-white/80 p-3 rounded-lg border-l-2 border-indigo-400">
+                        <p class="font-medium text-[#792DD4]">Cost-Effective GPU/AI Power</p>
+</div>
+                    <div class="bg-white/80 p-3 rounded-lg border-l-2 border-secondary">
+                        <p class="font-medium text-[#792DD4]">Developer-Friendly Ecosystem</p>
+</div>
+</div>
             </div>
+<div id="initial-message" class="text-center p-12 rounded-xl bg-gray-800/80 text-gray-300 border-2 border-dashed border-gray-600 hover:border-primary transition-colors duration-300 backdrop-blur-sm">
+                <p class="text-xl font-medium">Please select an industry from the dropdown above to reveal targeted value mapping, discovery questions, and permission-based openers.</p>
+            </div>
+<div id="dynamic-area" class="hidden space-y-8 backdrop-blur-sm">
+                <h2 id="industry-title" class="text-3xl font-heading font-bold text-secondary text-center pt-4">
+                    <span class="bg-gradient-to-r from-primary to-secondary bg-clip-text text-transparent"></span>
+                </h2>
+                <div class="bg-gray-800/90 p-8 rounded-xl shadow-lg border-l-4 border-secondary backdrop-blur-sm">
+                    <h3 class="text-2xl font-heading font-bold mb-6 text-white">Value Proposition & Product Focus</h3>
+                    <div id="value-drivers" class="space-y-4 text-gray-200 text-lg">
+</div>
+                </div>
+                <div class="grid grid-cols-1 lg:grid-cols-2 gap-6">
+                    <div class="bg-gray-800/90 p-6 rounded-xl shadow-lg border-l-4 border-indigo-400 backdrop-blur-sm hover:border-secondary transition-all duration-300">
+                        <h3 class="text-xl font-heading font-bold mb-4 text-white">Discovery Question 1</h3>
+                        <p id="dq1" class="text-gray-200 italic mb-6 text-lg"></p>
+                        <h4 class="font-bold text-md uppercase text-gray-300 mb-2">Permission-Based Opener 1</h4>
+                        <p id="pbo1" class="text-white font-medium text-lg"></p>
                     </div>
+                    <div class="bg-gray-800/90 p-6 rounded-xl shadow-lg border-l-4 border-secondary backdrop-blur-sm hover:border-primary transition-all duration-300">
+                        <h3 class="text-xl font-heading font-bold mb-4 text-white">Discovery Question 2</h3>
+                        <p id="dq2" class="text-gray-200 italic mb-6 text-lg"></p>
+                        <h4 class="font-bold text-md uppercase text-gray-300 mb-2">Permission-Based Opener 2</h4>
+                        <p id="pbo2" class="text-white font-medium text-lg"></p>
                     </div>
+</div>
+                <div class="text-center pt-4 no-print">
+                    <button onclick="exportToPDF()" class="px-8 py-3 bg-gradient-to-r from-[#9B5CEB] to-[#8B5CF6] text-white font-semibold rounded-xl shadow-lg hover:from-[#8B5CF6] hover:to-[#7B4BEB] transition-all duration-300 transform hover:scale-105">
+Export to PDF
+                    </button>
+</div>
             </div>
         </div>
+    </main>
+    <footer class="bg-purple-800/80 dark:bg-purple-800/80 backdrop-blur-sm border-t border-gray-700">
 <div class="container mx-auto px-4 py-8">
             <div class="flex flex-col md:flex-row justify-between items-center">
                 <div class="mb-6 md:mb-0">
                     <p class="text-gray-600 dark:text-gray-300 mt-2 text-sm">
                     Navigating your sales success with AI since 2023
 </p>
                     <div class="col-span-2 md:col-span-1">
                         <h3 class="text-sm font-semibold text-gray-500 dark:text-gray-400 uppercase tracking-wider mb-4">Connect</h3>
                         <div class="flex space-x-4">
 </div>
         </div>
     </footer>
     <script>
         // Mobile Menu Toggle
         const mobileMenuButton = document.getElementById('mobileMenuButton');
         // Feather Icons
         feather.replace();
+        // JavaScript for Dynamic Content Loading and PDF
+const INDUSTRY_DATA = {
+"Financial Services and Insurance": {
+                valueDrivers: "Value Drivers: Data Sovereignty, Security, Compliance (GDPR, PCI-DSS), Low-Latency. Product Focus: Private Cloud, Bare Metal.",
+                dq1: "How are you currently addressing the rising costs and complexity of maintaining GDPR and PCI-DSS compliance across your cloud infrastructure?",
+                pbo1: "Can I share how we help with data sovereignty using our EU-based infrastructure?",
+dq2: "To what extent are your current cloud/infrastructure choices impacting your ability to meet strict regulatory requirements like GDPR or PCI-DSS, especially around data sovereignty and low-latency access?",
+                pbo2: "Can we quickly discuss how our Private Cloud meets GDPR/PCI-DSS needs?"
+},
+            "Healthcare and Biotechnology": {
+                valueDrivers: "Value Drivers: Secure & Compliant Infrastructure (HDS), AI/ML for Research, HPC. Product Focus: Object Storage, GPU Instances, AI Tools.",
+                dq1: "What infrastructure challenges are currently slowing down your R&D teams when running large-scale AI models on sensitive patient data?",
+                pbo1: "Can I show you how our tools simplify deployment?",
+dq2: "When scaling your AI/ML research or HPC workloads, what are the biggest challenges you face today in ensuring both HDS compliance and getting performant access to massive data sets?",
+                pbo2: "Can I share how our GPU instances accelerate research securely?"
+},
+            "E-commerce and Retail": {
+                valueDrivers: "Value Drivers: Scalability, Performance (Peak Loads), Edge Computing, Real-time Analytics. Product Focus: Load Balancers, Edge Computing, Managed Kubernetes (Kapsule).",
+                dq1: "How quickly and cost-effectively can you scale your infrastructure to handle Black Friday-level traffic spikes without over-provisioning for the rest of the year?",
+                pbo1: "Can I show you our transparent pricing vs US hyperscalers?",
+dq2: "How is your current infrastructure handling unexpected peak loads and the demands of real-time analytics, particularly as you expand your footprint into Edge Computing environments?",
+                pbo2: "Can I show you how we handle traffic spikes with Load Balancers?"
+},
+            "Media and Entertainment": {
+                valueDrivers: "Value Drivers: Massive Object Storage, High-Bandwidth, Cost-Effective GPU Rendering, Open-Source Tools. Product Focus: Object Storage, Dedicated Servers, CDN.",
+                dq1: "Are you facing constraints or unexpected costs when archiving massive volumes of high-resolution content or delivering media globally at high quality?",
+                pbo1: "Can we discuss avoiding vendor lock-in with our open ecosystem?",
+dq2: "When you look at your overall rendering and distribution pipeline, where are you seeing the biggest bottlenecks in terms of high-bandwidth data transfer and cost-effective GPU access for large rendering jobs?",
+                pbo2: "Can I show you how we cut rendering costs with our storage?"
+},
+            "Gaming": {
+                valueDrivers: "Value Drivers: Low-Latency, High-Availability, Cost-Effective GPU Instances, Developer-Centric Tools. Product Focus: Load Balancers, Bare Metal, GPU Instances.",
+                dq1: "What are the key technical barriers your players are reporting around in-game latency or server downtime that directly impact retention rates?",
+                pbo1: "Most of our customers appreciate a seamless, developer-centric experience and easy-to-use console. Are you open to a quick overview of how our tools simplify deployment and management?",
+                dq2: "For your performance-critical applications, what is the key trade-off you are currently making between achieving low-latency/high-availability and maintaining a cost-effective environment for your GPU-intensive workloads?",
+                pbo2: "Can I share how our Bare Metal balances cost and performance?"
+},
+            "Education and Research": {
+                valueDrivers: "Value Drivers: Cost-Effective HPC/GPU, Secure & Scalable, Open-Source for Collaboration. Product Focus: GPU Instances, Kubernetes, IAM.",
+                dq1: "If budget weren't a constraint, what scientific or research challenges would your team tackle if they had access to significantly more computational (GPU) power?",
+                pbo1: "Many companies are concerned about long-term vendor lock-in and rising egress costs. Would it be helpful to discuss how our open-source ecosystem helps customers avoid those challenges?",
+                dq2: "Regarding your HPC and GPU projects, how effectively is your current Kubernetes environment balancing the need for cost-effective scaling with the security and access control required for collaborative work?",
+                pbo2: "Can I explain our GPU instances for secure HPC environments?"
+},
+            "Government and Public Sector": {
+                valueDrivers: "Value Drivers: Strict Data Sovereignty (European Cloud), SecNumCloud Readiness, Compliance. Product Focus: Private Cloud, Dedicated Servers.",
+                dq1: "In your digital transformation roadmap, what are the primary risks or hurdles associated with relying on non-European cloud providers for sensitive citizen data?",
+                pbo1: "When we speak with European leaders, data sovereignty is often a top priority. Do you mind if I share how Scaleway addresses those requirements with our certified, local infrastructure?",
+                dq2: "How challenging is it for your organization to maintain strict European data sovereignty and pursue certifications like SecNumCloud while trying to manage your core infrastructure needs?",
+                pbo2: "Can I show you our SecNumCloud-ready Private Cloud?"
+},
+            "Cyber": {
+                valueDrivers: "Value Drivers: Data Sovereignty as Defense, Private Networking, AI/ML for Threat Detection, Transparent Billing. Product Focus: Private Network (VPC), Bare Metal, AI Tools.",
+                dq1: "How is your team utilizing (or planning to utilize) AI and European-local data processing to enhance your real-time threat detection and response capabilities?",
+                pbo1: "I often hear that predictable billing and cost efficiency are key concerns when scaling. May I share a few ways Scaleway ensures complete cost transparency compared to US hyperscalers?",
+                dq2: "What is the current level of confidence in your existing private networking setup regarding its ability to leverage AI/ML for threat detection while firmly upholding your data sovereignty principles?",
+                pbo2: "Can I share how Bare Metal + VPC enhances security?"
+},
+            "Manufacturing": {
+                valueDrivers: "Value Drivers: Edge Computing (IoT Data), AI/ML for Predictive Maintenance, Open-Source Integration. Product Focus: Edge Computing, AI Tools, Object Storage.",
+                dq1: "What percentage of unscheduled downtime could be saved if you could process IoT sensor data at the edge for instant, localized predictive maintenance?",
+                pbo1: "Many companies are concerned about long-term vendor lock-in and rising egress costs. Would it be helpful to discuss how our open-source ecosystem helps customers avoid those challenges?",
+                dq2: "When deploying AI/ML for predictive maintenance using IoT data at the edge, what is the biggest technical roadblock you encounter regarding data storage, processing, or open-source integration?",
+                pbo2: "Can I show you our Edge solutions for predictive maintenance?"
+},
+            "Energy": {
+                valueDrivers: "Value Drivers: Sustainability, AI/ML for Grid Optimization, Data Sovereignty. Product Focus: AI Tools, Managed Databases.",
+                dq1: "Given the move toward renewables, what is the biggest infrastructure challenge you face when trying to predict supply and demand volatility for grid optimization?",
+                pbo1: "When we speak with European leaders, data sovereignty is often a top priority. Do you mind if I share how Scaleway addresses those requirements with our certified, local infrastructure?",
+                dq2: "As you pursue sustainability goals, how successful has your team been in deploying AI/ML tools for initiatives like grid optimization while also adhering to strict data sovereignty mandates?",
+                pbo2: "Can I share how our AI tools optimize energy grids?"
+},
+            "Logistics": {
+                valueDrivers: "Value Drivers: Edge Computing (Real-time Tracking), AI/ML for Optimization, Transparent Billing. Product Focus: Edge Computing, Managed Databases, AI Tools.",
+                dq1: "If you could achieve a 5% improvement in route efficiency through real-time AI analysis, how quickly would that translate into measurable fuel and labor cost savings?",
+                pbo1: "I often hear that predictable billing and cost efficiency are key concerns when scaling. May I share a few ways Scaleway ensures complete cost transparency compared to US hyperscalers?",
+                dq2: "In your real-time tracking and Edge Computing projects, how are you ensuring both fast, reliable data processing and clear, transparent billing when leveraging AI/ML for optimization?",
+                pbo2: "Can I show our Edge + AI solution with clear pricing?"
+},
+            "Transport": {
+                valueDrivers: "Value Drivers: Low-Latency, HPC for Simulation, Developer-Centric Tools. Product Focus: Edge Computing, GPU Instances, HPC.",
+                dq1: "How satisfied are your engineering teams with the current cost and turnaround time of running large-scale simulations for new vehicle development or autonomous systems?",
+                pbo1: "Most of our customers appreciate a seamless, developer-centric experience and easy-to-use console. Are you open to a quick overview of how our tools simplify deployment and management?",
+                dq2: "For your high-stakes HPC simulations, where are you currently seeing the most significant constraints on achieving optimal low-latency performance and providing your developers with the best tools?",
+                pbo2: "Can I share our GPU instances for low-latency simulation?"
+},
+            "Technology/SaaS": {
+                valueDrivers: "Value Drivers: Developer-Centric Tools, Cost-Effectiveness for Scale-ups, Open-Source Agility, Transparent Billing. Product Focus: Kubernetes (Kapsule), Managed Databases, GPU Instances.",
+                dq1: "What is the highest friction point your development teams experience when trying to deploy, scale, or manage your core application across different environments?",
+                pbo1: "Many companies are concerned about long-term vendor lock-in and rising egress costs. Would it be helpful to discuss how our open-source ecosystem helps customers avoid those challenges?",
+                dq2: "As a scale-up, how are you balancing the need for rapid open-source agility and developer-centric tools with the challenge of maintaining long-term cost-effectiveness and transparent billing across your infrastructure?",
+                pbo2: "Can I show you our cost-effective Kubernetes for scale-ups?"
+},
+            // NEW CATEGORY ADDED: Startup
+            "Startup": {
+                valueDrivers: "Value Drivers: Cost-Effectiveness, Developer-Centric Tools, Agility/Time-to-Market, Open-Source Ecosystem. Product Focus: Managed Kubernetes (Kapsule), Managed Databases, Free Tier, GPU Instances (for early AI development).",
+                dq1: "As you scale rapidly, what are your biggest concerns regarding unpredictable cloud costs, especially related to data egress and vendor lock-in?",
+                pbo1: "I often hear that predictable billing and cost efficiency are key concerns when scaling. May I share a few ways Scaleway ensures complete cost transparency compared to US hyperscalers?",
+                dq2: "What friction points are your developers currently facing when deploying new features, and how important is using open-source tools to maintain agility?",
+                pbo2: "Can we discuss avoiding lock-in with our open ecosystem?"
+}
+        };
+        function updateContent() {
+            const selector = document.getElementById('industry-selector');
+            const industry = selector.value;
+            // Check if the default placeholder is selected
+            if (!industry || industry === 'placeholder') {
+                document.getElementById('dynamic-area').classList.add('hidden');
+                document.getElementById('initial-message').classList.remove('hidden');
+                return;
+            }
+            const data = INDUSTRY_DATA[industry];
+            // Update the dynamic content elements
+            document.getElementById('industry-title').textContent = industry;
+            // 1. Value Drivers & Product Focus
+            const valueDriversElement = document.getElementById('value-drivers');
+            if (data.valueDrivers) {
+                valueDriversElement.innerHTML = data.valueDrivers.replace(/Value Drivers: (.*?)\. Product Focus: (.*?)\./s, (match, drivers, focus) => {
+                    return `<p class="font-semibold text-lg mb-2 text-primary">Value Drivers:</p><p class="text-gray-300 mb-4">${drivers}</p>
+                            <p class="font-semibold text-lg mb-2 text-primary">Product Focus:</p><p class="text-gray-300">${focus}</p>`;
+                });
+            } else {
+                valueDriversElement.innerHTML = '';
+            }
+            // 2. Discovery Questions & Openers
+            document.getElementById('dq1').textContent = data.dq1;
+            document.getElementById('pbo1').textContent = data.pbo1;
+            document.getElementById('dq2').textContent = data.dq2;
+            document.getElementById('pbo2').textContent = data.pbo2;
+            // Toggle visibility
+            document.getElementById('initial-message').classList.add('hidden');
+            document.getElementById('dynamic-area').classList.remove('hidden');
+        }
+        // Function to export data as PDF
+        function exportToPDF() {
+            const industry = document.getElementById('industry-selector').value;
+            const valueDrivers = document.getElementById('value-drivers').textContent;
+            const dq1 = document.getElementById('dq1').textContent;
+            const pbo1 = document.getElementById('pbo1').textContent;
+            const dq2 = document.getElementById('dq2').textContent;
+            const pbo2 = document.getElementById('pbo2').textContent;
+            // Create PDF document
+            const { jsPDF } = window.jspdf;
+            const doc = new jsPDF();
+            // Add title
+            doc.setFontSize(20);
+            doc.setTextColor(85, 33, 148); // #552194
+            doc.text(`Pod Value Mapper - ${industry}`, 105, 20, { align: 'center' });
+            // Add subtitle
+            doc.setFontSize(14);
+            doc.setTextColor(121, 45, 212); // #792DD4
+            doc.text('Your essential tool for qualification and value articulation', 105, 30, { align: 'center' });
+            // Add value drivers section
+            doc.setFontSize(16);
+            doc.setTextColor(85, 33, 148);
+            doc.text('Value Proposition & Product Focus', 15, 45);
+            doc.setFontSize(12);
+            doc.setTextColor(0, 0, 0);
+            const valueLines = doc.splitTextToSize(valueDrivers, 180);
+            doc.text(valueLines, 15, 55);
+            // Add discovery questions
+            doc.setFontSize(16);
+            doc.setTextColor(85, 33, 148);
+            doc.text('Discovery Questions & Openers', 15, 110);
+            // Question 1
+            doc.setFontSize(14);
+            doc.text('Discovery Question 1:', 15, 120);
+            doc.setFont('italic');
+            doc.setFontSize(12);
+            doc.text(dq1, 15, 130);
+            doc.setFont('normal');
+            doc.text('Permission-Based Opener 1:', 15, 140);
+            doc.setFont('bold');
+            doc.text(pbo1, 15, 150);
+            // Question 2
+            doc.setFont('normal');
+            doc.text('Discovery Question 2:', 15, 165);
+            doc.setFont('italic');
+            doc.text(dq2, 15, 175);
+            doc.setFont('normal');
+            doc.text('Permission-Based Opener 2:', 15, 185);
+            doc.setFont('bold');
+            doc.text(pbo2, 15, 195);
+            // Footer
+            doc.setFontSize(10);
+            doc.setTextColor(100, 100, 100);
+            doc.text('Generated by McGPT - Navigating your sales success with AI', 105, 285, { align: 'center' });
+            // Save the PDF
+            doc.save(`McGPT_ValueMapper_${industry.replace(/\s+/g, '_')}.pdf`);
+        }
+// Initialize to ensure the hidden/shown states are correct on load
+        window.onload = updateContent;
     </script>
 </body>
+</html>