Spaces:

DjayChucko
/

EnablingSales

Running

App Files Files

DjayChucko commited on Oct 4, 2025

Commit

8118a07

verified ·

1 Parent(s): 4c4a506

Manual changes saved

Browse files

Files changed (1) hide show

academy.html +52 -98

academy.html CHANGED Viewed

@@ -3,41 +3,28 @@
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <meta name="description" content="McGPT Sales Academy">
-    <title>McGPT | Academy</title>
-    <link rel="icon" type="image/x-icon" href="https://huggingface.co/spaces/DjayChucko/EnablingSales/resolve/main/images/Scaleway-Logomark-White.png">
     <script src="https://cdn.tailwindcss.com"></script>
-    <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap" rel="stylesheet">
     <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',
-                }
-            }
-        }
       }
     </script>
     <style>
         body { font-family: 'Poppins', sans-serif; }
-        .nav-link.active {
-            font-weight: 600;
-            border-bottom: 2px solid #8b5cf6;
-        }
-        .card-hover {
-            @apply transition-all duration-300 hover:scale-105 hover:shadow-xl;
-        }
-        .hamburger-line {
-            @apply w-6 h-0.5 bg-white transition-all duration-300;
-        }
     </style>
 </head>
-<body class="bg-[#3D1862] min-h-screen flex flex-col relative" style="background-image: radial-gradient(circle at 25% 25%, rgba(39, 8, 71, 0.6) 0%, rgba(39, 8, 71, 0) 50%), radial-gradient(circle at 75% 75%, rgba(59, 15, 110, 0.6) 0%, rgba(59, 15, 110, 0) 50%);">
 <header class="sticky top-0 z-50 bg-purple-800/80 backdrop-blur-md shadow-sm">
     <div class="container mx-auto px-4 py-3">
@@ -50,91 +37,54 @@
                 <a href="index.html" class="nav-link py-2 px-1 text-white hover:text-purple-300 transition-colors">Home</a>
                 <a href="value-mapper.html" class="nav-link py-2 px-1 text-white hover:text-purple-300 transition-colors">Mapper</a>
                 <a href="scorecard.html" class="nav-link py-2 px-1 text-white hover:text-purple-300 transition-colors">Scorecard</a>
-                <a href="strategy.html" class="nav-link py-2 px-1 text-white hover:text-purple-300 transition-colors">Method</a>
-                <a href="academy.html" class="nav-link active py-2 px-1 text-white">Academy</a>
             </nav>
             <div class="flex items-center space-x-4">
                 <button id="themeToggle" class="p-2 rounded-full text-white">
                     <i data-feather="moon"></i>
                 </button>
-                <button id="mobileMenuButton" class="md:hidden flex flex-col space-y-1.5 p-2 z-50 bg-[#9B5CEB] rounded-lg">
                     <span class="hamburger-line"></span>
                     <span class="hamburger-line"></span>
                     <span class="hamburger-line"></span>
                 </button>
             </div>
         </div>
     </div>
 </header>
-<div id="mobileMenu" class="hidden fixed inset-0 z-40 bg-purple-900">
-    <div class="flex flex-col items-center justify-center h-full space-y-8">
-        <a href="index.html" class="nav-link text-2xl text-white">Home</a>
-        <a href="value-mapper.html" class="nav-link text-2xl text-white">Mapper</a>
-        <a href="scorecard.html" class="nav-link text-2xl text-white">Scorecard</a>
-        <a href="strategy.html" class="nav-link text-2xl text-white">Method</a>
-        <a href="academy.html" class="nav-link text-2xl text-white">Academy</a>
-    </div>
-</div>
 <main class="flex-grow">
-    <section class="py-16 sm:py-24">
-        <div class="container mx-auto px-4">
-            <div class="text-center mb-16">
-                <h1 class="text-4xl md:text-5xl font-bold mb-6 leading-tight text-white">
-                    <span class="bg-gradient-to-r from-primary to-secondary bg-clip-text text-transparent">Sales Academy</span>
-                </h1>
-                <p class="text-xl mb-8 text-purple-200 max-w-3xl mx-auto">
-                    Continuous learning and development to sharpen your skills and stay ahead of the competition
-                </p>
-            </div>
-            <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8">
-                <div class="bg-white/10 rounded-xl p-8 backdrop-blur-sm border border-white/10 card-hover">
-                    <div class="w-14 h-14 bg-purple-500/20 rounded-lg flex items-center justify-center mb-6">
-                        <i data-feather="book-open" class="text-purple-300"></i>
-                    </div>
-                    <h3 class="text-xl font-bold mb-3 text-white">Core Curriculum</h3>
-                    <p class="text-purple-200">Master the fundamentals of value-centric selling with our foundational courses</p>
-                    <a href="https://scaleway.360learning.com" class="mt-4 inline-block text-purple-300 hover:text-white transition-colors">View Courses →</a>
-                </div>
-                <div class="bg-white/10 rounded-xl p-8 backdrop-blur-sm border border-white/10 card-hover">
-                    <div class="w-14 h-14 bg-purple-500/20 rounded-lg flex items-center justify-center mb-6">
-                        <i data-feather="bar-chart-2" class="text-purple-300"></i>
-                    </div>
-                    <h3 class="text-xl font-bold mb-3 text-white">Advanced Tactics</h3>
-                    <p class="text-purple-200">Elevate your game with advanced negotiation and deal strategy techniques</p>
-                    <a href="https://scaleway.360learning.com" class="mt-4 inline-block text-purple-300 hover:text-white transition-colors">View Courses →</a>
-                </div>
-                <div class="bg-white/10 rounded-xl p-8 backdrop-blur-sm border border-white/10 card-hover">
-                    <div class="w-14 h-14 bg-purple-500/20 rounded-lg flex items-center justify-center mb-6">
-                        <i data-feather="award" class="text-purple-300"></i>
-                    </div>
-                    <h3 class="text-xl font-bold mb-3 text-white">Certification Paths</h3>
-                    <p class="text-purple-200">Get certified in our methodology and showcase your expertise</p>
-                    <a href="https://scaleway.360learning.com" class="mt-4 inline-block text-purple-300 hover:text-white transition-colors">View Paths →</a>
-                </div>
             </div>
-            <div class="mt-16 bg-white/10 rounded-xl p-8 backdrop-blur-sm border border-white/10">
-                <div class="grid md:grid-cols-2 gap-8 items-center">
-                    <div>
-                        <h2 class="text-3xl font-bold mb-4 text-white">Featured Course</h2>
-                        <h3 class="text-2xl font-bold mb-2 text-purple-300">MEDDICC Mastery</h3>
-                        <p class="text-purple-200 mb-6">Learn how to effectively implement the MEDDICC qualification framework in your deals</p>
-                        <a href="https://scaleway.360learning.com" class="bg-[#9B5CEB] hover:bg-purple-500 text-white px-6 py-2 rounded-lg font-semibold transition-colors shadow-lg inline-block">
-                            Enroll Now
-                        </a>
-                    </div>
-                    <div class="hidden md:block">
-                        <img src="https://huggingface.co/spaces/DjayChucko/EnablingSales/resolve/main/images/MediaEntertainment-Illustration-transparent.png" alt="Course Illustration" class="w-full h-auto rounded-lg">
-                    </div>
-                </div>
             </div>
         </div>
-    </section>
 </main>
 <footer class="bg-purple-800/80 backdrop-blur-sm border-t border-purple-700/50">
@@ -148,24 +98,28 @@
 <script>
     feather.replace();
-    // Mobile Menu Toggle
     const mobileMenuButton = document.getElementById('mobileMenuButton');
     const mobileMenu = document.getElementById('mobileMenu');
     mobileMenuButton.addEventListener('click', () => {
         mobileMenu.classList.toggle('hidden');
         mobileMenuButton.classList.toggle('open');
-        document.body.classList.toggle('overflow-hidden');
     });
-    // Active Nav Link
-    const currentPage = window.location.pathname.split('/').pop() || 'index.html';
-    document.querySelectorAll('.nav-link').forEach(link => {
-        const linkHref = link.getAttribute('href');
-        if (linkHref === currentPage) {
-            link.classList.add('active');
-        } else {
-            link.classList.remove('active');
         }
     });
 </script>

 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta name="description" content="McGPT - Our Sales Methodology">
+    <title>Our Method | McGPT</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=Poppins:wght@400;500;600;700;800&display=swap" rel="stylesheet">
     <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',
       }
     </script>
     <style>
         body { font-family: 'Poppins', sans-serif; }
+        .hamburger-line { width: 20px; height: 2px; background-color: white; display: block; transition: all 0.3s; }
+        .open .hamburger-line:nth-child(1) { transform: translateY(5px) rotate(45deg); }
+        .open .hamburger-line:nth-child(2) { opacity: 0; }
+        .open .hamburger-line:nth-child(3) { transform: translateY(-5px) rotate(-45deg); }
+        .nav-link.active { font-weight: 600; border-bottom: 2px solid #8b5cf6; }
     </style>
 </head>
+<body class="bg-[#3D1862] text-white min-h-screen flex flex-col" style="background-image: radial-gradient(circle at 25% 25%, rgba(39, 8, 71, 0.6) 0%, rgba(39, 8, 71, 0) 50%), radial-gradient(circle at 75% 75%, rgba(59, 15, 110, 0.6) 0%, rgba(59, 15, 110, 0) 50%);">
 <header class="sticky top-0 z-50 bg-purple-800/80 backdrop-blur-md shadow-sm">
     <div class="container mx-auto px-4 py-3">
                 <a href="index.html" class="nav-link py-2 px-1 text-white hover:text-purple-300 transition-colors">Home</a>
                 <a href="value-mapper.html" class="nav-link py-2 px-1 text-white hover:text-purple-300 transition-colors">Mapper</a>
                 <a href="scorecard.html" class="nav-link py-2 px-1 text-white hover:text-purple-300 transition-colors">Scorecard</a>
+                <a href="strategy.html" class="nav-link active py-2 px-1 text-white">Method</a>
             </nav>
             <div class="flex items-center space-x-4">
                 <button id="themeToggle" class="p-2 rounded-full text-white">
                     <i data-feather="moon"></i>
                 </button>
+                <button id="mobileMenuButton" class="md:hidden flex flex-col space-y-1.5 p-2 bg-[#9B5CEB] rounded-lg">
                     <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 border-gray-200 dark:border-gray-700 mt-3">
+            <div class="flex flex-col space-y-3">
+                <a href="index.html" class="py-2 px-1 text-white">Home</a>
+                <a href="value-mapper.html" class="py-2 px-1 text-white">Mapper</a>
+                <a href="scorecard.html" class="py-2 px-1 text-white">Scorecard</a>
+                <a href="strategy.html" class="py-2 px-1 text-white font-semibold">Method</a>
+            </div>
+        </div>
     </div>
 </header>
 <main class="flex-grow">
+    <div class="container mx-auto px-4 py-16">
+        <div class="text-center mb-12">
+            <h1 class="text-4xl font-extrabold text-white">Our Value-Centric Strategy</h1>
+            <p class="mt-4 text-lg text-purple-200">A structured approach to modern B2B sales.</p>
+        </div>
+        <div id="content-container" class="max-w-4xl mx-auto space-y-8">
+            <div class="content-block bg-white/10 backdrop-blur-md border border-white/10 p-8 rounded-xl shadow-lg">
+                <h2 class="text-2xl font-bold text-purple-300 mb-4">Phase 1: Discovery & Qualification</h2>
+                <p class="text-purple-100">This initial phase is about deep listening and understanding. We use tools like the Value Mapper to connect a prospect's challenges to our core strengths. The goal is not to sell, but to diagnose. By the end of this phase, we should have a clear understanding of the customer's pain and the potential metrics for success.</p>
+            </div>
+            <div class="content-block bg-white/10 backdrop-blur-md border border-white/10 p-8 rounded-xl shadow-lg">
+                <h2 class="text-2xl font-bold text-purple-300 mb-4">Phase 2: Building the Business Case</h2>
+                <p class="text-purple-100">Once a legitimate pain is identified, we transition to quantifying the value of our solution. This involves co-creating a business case with our champion, aligning our technical solution to measurable business outcomes. The MEDDICC Scorecard becomes critical here to track our alignment with the key people and processes involved in the decision.</p>
             </div>
+            <div class="content-block bg-white/10 backdrop-blur-md border border-white/10 p-8 rounded-xl shadow-lg">
+                <h2 class="text-2xl font-bold text-purple-300 mb-4">Phase 3: Evaluation & Justification</h2>
+                <p class="text-purple-100">In this phase, we prove our claims through a PoC or detailed evaluation. Success is not just technical validation, but demonstrating the agreed-upon business value. We focus on differentiating against the competition and mitigating any perceived risks or blockers, ensuring our champion is equipped to justify the investment to the Economic Buyer.</p>
             </div>
         </div>
+    </div>
 </main>
 <footer class="bg-purple-800/80 backdrop-blur-sm border-t border-purple-700/50">
 <script>
     feather.replace();
+    // --- Mobile Menu Toggle ---
     const mobileMenuButton = document.getElementById('mobileMenuButton');
     const mobileMenu = document.getElementById('mobileMenu');
     mobileMenuButton.addEventListener('click', () => {
         mobileMenu.classList.toggle('hidden');
         mobileMenuButton.classList.toggle('open');
     });
+    // --- Randomize Content on Refresh ---
+    document.addEventListener('DOMContentLoaded', () => {
+        const container = document.getElementById('content-container');
+        const blocks = Array.from(container.querySelectorAll('.content-block'));
+        // Fisher-Yates Shuffle Algorithm
+        for (let i = blocks.length - 1; i > 0; i--) {
+            const j = Math.floor(Math.random() * (i + 1));
+            [blocks[i], blocks[j]] = [blocks[j], blocks[i]];
         }
+        // Clear container and append shuffled blocks
+        container.innerHTML = '';
+        blocks.forEach(block => container.appendChild(block));
     });
 </script>