commit 639c520f1758ba4c3a13f654cffea77bc6d54689
Author: root <root@hub.scroll.pub> Date: 2024-12-27 04:09:45 +0000 Subject: Initial commit diff --git a/body.html b/body.html new file mode 100644 index 0000000..bc64548 --- /dev/null +++ b/body.html @@ -0,0 +1,137 @@ +<header> + <nav> + <div class="logo">Kahuna</div> + <div class="nav-links"> + <a href="#features">Features</a> + <a href="#benefits">Benefits</a> + <a href="#pricing">Pricing</a> + <button class="cta-button">Get Started</button> + </div> + <button class="mobile-menu" aria-label="Toggle Menu"> + <span></span><span></span><span></span> + </button> + </nav> +</header> + +<main> + <section class="hero"> + <div class="hero-content"> + <h1>Transform Your Sales With AI-Powered Intelligence</h1> + <p>Record, analyze, and optimize every sales interaction with Kahuna's intelligent platform</p> + <button class="cta-button">Start Free Trial</button> + </div> + <div class="hero-image" aria-hidden="true"> + <div class="abstract-shape"></div> + </div> + </section> + + <section id="features" class="features"> + <h2>Key Features</h2> + <div class="feature-grid"> + <div class="feature-card"> + <div class="icon recording"></div> + <h3>Smart Recording</h3> + <p>Automatically capture and transcribe every sales conversation</p> + </div> + <div class="feature-card"> + <div class="icon analytics"></div> + <h3>Performance Analytics</h3> + <p>Get instant feedback and actionable insights</p> + </div> + <div class="feature-card"> + <div class="icon automation"></div> + <h3>AI Follow-up</h3> + <p>Automate lead nurturing and close more deals</p> + </div> + <div class="feature-card"> + <div class="icon dashboard"></div> + <h3>Smart Dashboard</h3> + <p>Track performance and revenue in real-time</p> + </div> + </div> + </section> + + <section id="benefits" class="benefits"> + <h2>Why Choose Kahuna</h2> + <div class="benefits-container"> + <div class="benefit"> + <h3>30% More Closes</h3> + <p>AI-powered follow-up increases conversion rates</p> + </div> + <div class="benefit"> + <h3>Save 5 Hours/Week</h3> + <p>Automated documentation and follow-up</p> + </div> + <div class="benefit"> + <h3>100% Coverage</h3> + <p>Never miss another sales opportunity</p> + </div> + </div> + </section> + + <section id="pricing" class="pricing"> + <h2>Simple Pricing</h2> + <div class="pricing-grid"> + <div class="pricing-card"> + <h3>Starter</h3> + <div class="price">$49<span>/month</span></div> + <ul> + <li>Up to 3 users</li> + <li>50 recordings/month</li> + <li>Basic analytics</li> + <li>Email support</li> + </ul> + <button class="secondary-button">Choose Plan</button> + </div> + <div class="pricing-card featured"> + <h3>Professional</h3> + <div class="price">$99<span>/month</span></div> + <ul> + <li>Up to 10 users</li> + <li>200 recordings/month</li> + <li>Advanced analytics</li> + <li>Priority support</li> + </ul> + <button class="cta-button">Choose Plan</button> + </div> + <div class="pricing-card"> + <h3>Enterprise</h3> + <div class="price">Custom</div> + <ul> + <li>Unlimited users</li> + <li>Unlimited recordings</li> + <li>Custom integration</li> + <li>24/7 support</li> + </ul> + <button class="secondary-button">Contact Sales</button> + </div> + </div> + </section> +</main> + +<footer> + <div class="footer-content"> + <div class="footer-section"> + <h4>Product</h4> + <a href="#features">Features</a> + <a href="#pricing">Pricing</a> + <a href="#">Security</a> + </div> + <div class="footer-section"> + <h4>Company</h4> + <a href="#">About</a> + <a href="#">Blog</a> + <a href="#">Careers</a> + </div> + <div class="footer-section"> + <h4>Resources</h4> + <a href="#">Documentation</a> + <a href="#">Support</a> + <a href="#">API</a> + </div> + <div class="footer-section"> + <h4>Contact</h4> + <a href="mailto:hello@kahuna.scroll.pub">hello@kahuna.scroll.pub</a> + </div> + </div> +</footer> diff --git a/index.scroll b/index.scroll new file mode 100644 index 0000000..7aceb18 --- /dev/null +++ b/index.scroll @@ -0,0 +1,8 @@ +buildHtml +baseUrl https://kahuna.scroll.pub +metaTags +editButton /edit.html +title Kahuna - AI-Powered Sales Performance & Follow-up System +style.css +body.html +script.js diff --git a/readme.scroll b/readme.scroll new file mode 100644 index 0000000..5b638e2 --- /dev/null +++ b/readme.scroll @@ -0,0 +1,2 @@ +# kahuna.scroll.pub +Website generated by Claude from prompt: I want a website for my SAAS called Kahuna. Kahuna is an AI-powered performance tool that revolutionizes sales by recording meetings, transcribing conversations, and transforming them into actionable data. During a sales interaction, Kahuna captures every detail, including customer objections, interests, and next steps, and generates a dynamic report with performance feedback for the salesperson. This data is seamlessly integrated into Kahuna’s follow-up system, which uses conversational AI to engage unclosed leads, schedule follow-ups, or close deals directly by sending payment links and finalizing details. Sales teams can access an intuitive dashboard to track unsold revenue, monitor active follow-ups, and identify areas for improvement. By combining meeting insights with intelligent follow-up, Kahuna enhances sales team performance and ensures every opportunity is maximized. \ No newline at end of file diff --git a/script.js b/script.js new file mode 100644 index 0000000..efbaed2 --- /dev/null +++ b/script.js @@ -0,0 +1,52 @@ +document.addEventListener('DOMContentLoaded', function() { + // Mobile menu functionality + const mobileMenu = document.querySelector('.mobile-menu'); + const navLinks = document.querySelector('.nav-links'); + + mobileMenu.addEventListener('click', function() { + navLinks.style.display = navLinks.style.display === 'flex' ? 'none' : 'flex'; + this.classList.toggle('active'); + }); + + // Smooth scroll for navigation links + document.querySelectorAll('a[href^="#"]').forEach(anchor => { + anchor.addEventListener('click', function (e) { + e.preventDefault(); + document.querySelector(this.getAttribute('href')).scrollIntoView({ + behavior: 'smooth' + }); + }); + }); + + // Intersection Observer for fade-in animations + const observerOptions = { + threshold: 0.1, + rootMargin: '0px 0px -50px 0px' + }; + + const observer = new IntersectionObserver((entries) => { + entries.forEach(entry => { + if (entry.isIntersecting) { + entry.target.classList.add('visible'); + observer.unobserve(entry.target); + } + }); + }, observerOptions); + + // Observe all sections + document.querySelectorAll('section').forEach(section => { + section.classList.add('fade-in'); + observer.observe(section); + }); + + // Add hover effect to feature cards + document.querySelectorAll('.feature-card').forEach(card => { + card.addEventListener('mouseenter', function() { + this.style.transform = 'translateY(-10px)'; + }); + + card.addEventListener('mouseleave', function() { + this.style.transform = 'translateY(0)'; + }); + }); +}); diff --git a/style.css b/style.css new file mode 100644 index 0000000..b1fd05f --- /dev/null +++ b/style.css @@ -0,0 +1,292 @@ +:root { + --primary: #2563eb; + --primary-dark: #1d4ed8; + --secondary: #64748b; + --accent: #7c3aed; + --background: #ffffff; + --text: #1e293b; + --gray-light: #f1f5f9; + --gray-medium: #94a3b8; + --max-width: 1200px; + --radius: 12px; + --transition: all 0.3s ease; +} + +* { + margin: 0; + padding: 0; + box-sizing: border-box; +} + +html { + scroll-behavior: smooth; +} + +body { + font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; + color: var(--text); + line-height: 1.6; +} + +/* Navigation */ +header { + position: fixed; + width: 100%; + background: rgba(255, 255, 255, 0.95); + backdrop-filter: blur(10px); + z-index: 1000; + box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); +} + +nav { + max-width: var(--max-width); + margin: 0 auto; + padding: 1rem 2rem; + display: flex; + justify-content: space-between; + align-items: center; +} + +.logo { + font-size: 1.5rem; + font-weight: 700; + color: var(--primary); +} + +.nav-links { + display: flex; + gap: 2rem; + align-items: center; +} + +.nav-links a { + text-decoration: none; + color: var(--text); + font-weight: 500; + transition: var(--transition); +} + +.nav-links a:hover { + color: var(--primary); +} + +/* Buttons */ +.cta-button { + background: var(--primary); + color: white; + border: none; + padding: 0.75rem 1.5rem; + border-radius: var(--radius); + font-weight: 600; + cursor: pointer; + transition: var(--transition); +} + +.cta-button:hover { + background: var(--primary-dark); + transform: translateY(-2px); +} + +.secondary-button { + background: var(--gray-light); + color: var(--text); + border: none; + padding: 0.75rem 1.5rem; + border-radius: var(--radius); + font-weight: 600; + cursor: pointer; + transition: var(--transition); +} + +.secondary-button:hover { + background: var(--gray-medium); + color: white; +} + +/* Hero Section */ +.hero { + min-height: 100vh; + display: flex; + align-items: center; + padding: 6rem 2rem 4rem; + background: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 100%); +} + +.hero-content { + max-width: 600px; +} + +.hero h1 { + font-size: 3.5rem; + line-height: 1.2; + margin-bottom: 1.5rem; + background: linear-gradient(to right, var(--primary), var(--accent)); + -webkit-background-clip: text; + color: transparent; +} + +.hero p { + font-size: 1.25rem; + color: var(--secondary); + margin-bottom: 2rem; +} + +/* Features Section */ +.features { + padding: 6rem 2rem; + max-width: var(--max-width); + margin: 0 auto; +} + +.features h2 { + text-align: center; + margin-bottom: 3rem; + font-size: 2.5rem; +} + +.feature-grid { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); + gap: 2rem; +} + +.feature-card { + background: white; + padding: 2rem; + border-radius: var(--radius); + box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1); + transition: var(--transition); +} + +.feature-card:hover { + transform: translateY(-5px); +} + +/* Benefits Section */ +.benefits { + background: var(--gray-light); + padding: 6rem 2rem; +} + +.benefits h2 { + text-align: center; + margin-bottom: 3rem; + font-size: 2.5rem; +} + +.benefits-container { + max-width: var(--max-width); + margin: 0 auto; + display: grid; + grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); + gap: 2rem; +} + +/* Pricing Section */ +.pricing { + padding: 6rem 2rem; + max-width: var(--max-width); + margin: 0 auto; +} + +.pricing h2 { + text-align: center; + margin-bottom: 3rem; + font-size: 2.5rem; +} + +.pricing-grid { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); + gap: 2rem; +} + +.pricing-card { + background: white; + padding: 2rem; + border-radius: var(--radius); + box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1); + text-align: center; +} + +.pricing-card.featured { + border: 2px solid var(--primary); + transform: scale(1.05); +} + +.price { + font-size: 3rem; + font-weight: 700; + margin: 1.5rem 0; +} + +.price span { + font-size: 1rem; + color: var(--secondary); +} + +/* Footer */ +footer { + background: var(--text); + color: white; + padding: 4rem 2rem; +} + +.footer-content { + max-width: var(--max-width); + margin: 0 auto; + display: grid; + grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); + gap: 2rem; +} + +.footer-section h4 { + margin-bottom: 1rem; +} + +.footer-section a { + display: block; + color: var(--gray-medium); + text-decoration: none; + margin-bottom: 0.5rem; + transition: var(--transition); +} + +.footer-section a:hover { + color: white; +} + +/* Mobile Responsiveness */ +.mobile-menu { + display: none; +} + +@media (max-width: 768px) { + .nav-links { + display: none; + } + + .mobile-menu { + display: flex; + flex-direction: column; + gap: 6px; + background: none; + border: none; + cursor: pointer; + } + + .mobile-menu span { + width: 25px; + height: 2px; + background: var(--text); + transition: var(--transition); + } + + .hero h1 { + font-size: 2.5rem; + } + + .pricing-card.featured { + transform: none; + } +}