curaflow/index.html

202 lines
9.4 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Curio | WhatsApp-First Clinic Management</title>
<meta name="description" content="Revolutionizing Indian OPDs with WhatsApp-native queue management, AI triage, and digital patient records.">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Outfit:wght@400;500;600;700;800&family=Inter:wght@400;500;600&display=swap" rel="stylesheet">
<link rel="stylesheet" href="globals.css">
<link rel="stylesheet" href="index.css">
<script src="globals.js"></script>
<script src="tenantLoader.js"></script>
</head>
<body class="landing-page">
<nav class="glass-nav">
<div class="container">
<div class="logo">
<span class="logo-icon">C</span>
<span class="logo-text">Curio</span>
</div>
<div class="nav-links">
<a href="#features">Features</a>
<a href="#whatsapp">WhatsApp Flow</a>
<a href="#pricing">Pricing</a>
<a href="register.html" class="btn-primary" style="text-decoration: none;">Get Started</a>
</div>
</div>
</nav>
<header class="hero">
<div class="container hero-grid">
<div class="hero-content">
<div class="badge">Built for Indian Clinics</div>
<h1>Chaotic OPDs are a thing of the <span class="text-gradient">past.</span></h1>
<p>Manage tokens, appointments, and patient records entirely through WhatsApp. Reduce waiting room crowds and automate admin work with AI-powered triage.</p>
<div class="hero-btns">
<a href="register.html" class="btn-primary btn-lg" style="text-decoration: none;">Deploy to My Clinic</a>
<a href="#whatsapp" class="btn-secondary btn-lg" style="text-decoration: none;">Watch Demo</a>
</div>
<div class="hero-stats">
<div class="stat">
<strong>40%</strong>
<span>Wait Time Reduction</span>
</div>
<div class="stat">
<strong>90%</strong>
<span>WhatsApp Adoption</span>
</div>
</div>
</div>
<div class="hero-visual">
<div class="image-wrapper">
<img src="curio_hero_ui.png" alt="Curio Dashboard Mockup">
</div>
</div>
</div>
</header>
<section id="whatsapp" class="whatsapp-demo">
<div class="container">
<div class="section-header">
<h2>The WhatsApp Experience</h2>
<p>No apps to download. Patients book and track tokens from the app they already use.</p>
</div>
<div class="chat-container">
<div class="phone-mockup">
<div class="chat-header">
<div class="status-dot"></div>
<span>Curio Clinic Assistant</span>
</div>
<div class="chat-body" id="chatBody">
<div class="msg bot">Hello! Welcome to Dr. Sharma's Clinic. How can I help you today?</div>
<div class="patient-options">
<button class="btn btn-secondary btn-block" onclick="handleComingSoon('Book Token')">Book Token</button>
<button class="btn btn-secondary btn-block" onclick="handleComingSoon('Check Queue')">Check Queue</button>
<button class="btn btn-secondary btn-block" onclick="handleComingSoon('Download Report')">Download Report</button>
</div>
</div>
</div>
<div class="feature-info">
<div class="info-card">
<h3>Token Booking</h3>
<p>Walk-ins scan a QR code at the reception. WhatsApp automatically assigns a token and provides a live ETA.</p>
</div>
<div class="info-card">
<h3>AI Symptom Triage</h3>
<p>Ask basic questions to categorize patients before they see the doctor, saving valuable consultation time.</p>
</div>
<div class="info-card">
<h3>Live Status Updates</h3>
<p>"You are next in line. Please proceed to Room 4." - No more shouting names in the lobby.</p>
</div>
</div>
</div>
</div>
</section>
<section id="updates" class="daily-updates-section">
<div class="container">
<div class="updates-grid">
<div class="update-card">
<div class="update-icon">🔔</div>
<h4>Status Alerts</h4>
<p>"Dr. Sharma is now seeing Token #WK-3. You are next. Please reach the clinic in 5 minutes."</p>
</div>
<div class="update-card">
<div class="update-icon">🥗</div>
<h4>Daily Health Tips</h4>
<p>"Stay hydrated! Since you visited for pediatric care, here are 3 summer tips for kids."</p>
</div>
<div class="update-card">
<div class="update-icon">📊</div>
<h4>Queue Reports</h4>
<p>"Current Clinic Load: Medium. Average wait time for walk-ins is 25 minutes."</p>
</div>
</div>
</div>
</section>
<section id="features" class="features-grid">
<div class="container">
<div class="grid-layout">
<div class="feature-item">
<div class="icon">📊</div>
<h3>Smart Queueing</h3>
<p>Hybrid system for walk-ins and pre-booked appointments. Auto-reorders based on urgency.</p>
</div>
<div class="feature-item">
<div class="icon">🤖</div>
<h3>AI Report Summaries</h3>
<p>Upload blood reports or X-ray findings. AI summarizes them for the doctor in seconds.</p>
</div>
<div class="feature-item">
<div class="icon">💳</div>
<h3>Instant Billing</h3>
<p>Send Razorpay links directly on WhatsApp. Integrated GST billing for pharmacy & labs.</p>
</div>
<div class="feature-item">
<div class="icon">🏢</div>
<h3>Multi-Tenant Branding</h3>
<p>Enterprise ready. Full white-label support for hospital chains with custom logos, themes, and domains.</p>
</div>
</div>
</div>
</section>
<section id="pricing" class="pricing-section">
<div class="container">
<div class="section-header">
<h2>Simple, Transparent Pricing</h2>
<p>Choose the plan that fits your clinic's volume.</p>
</div>
<div class="pricing-grid">
<div class="pricing-card">
<h3>Basic</h3>
<div class="price">₹1,499<span>/mo</span></div>
<ul class="pricing-features">
<li>Up to 500 tokens/mo</li>
<li>Basic WhatsApp Queue</li>
<li>Digital Prescriptions</li>
<li>Single Doctor Support</li>
</ul>
<a href="register.html" class="btn-secondary" style="display: block; text-decoration: none;">Choose Basic</a>
</div>
<div class="pricing-card featured">
<h3>Pro</h3>
<div class="price">₹3,999<span>/mo</span></div>
<ul class="pricing-features">
<li>Unlimited Tokens</li>
<li>AI Triage & Summaries</li>
<li>Pharmacy & Lab Integration</li>
<li>Multi-Doctor Support</li>
</ul>
<a href="register.html" class="btn-primary" style="display: block; text-decoration: none;">Get Started Pro</a>
</div>
<div class="pricing-card">
<h3>Enterprise</h3>
<div class="price">Custom</div>
<ul class="pricing-features">
<li>Multi-Clinic Chain</li>
<li>Custom AI Training</li>
<li>White-label WhatsApp Bot</li>
<li>Dedicated Account Manager</li>
</ul>
<a href="register.html" class="btn-secondary" style="display: block; text-decoration: none;">Contact Sales</a>
</div>
</div>
</div>
</section>
<footer>
<div class="container">
<p>&copy; 2026 Curio Technologies. Empowering healthcare in Bharat.</p>
</div>
</footer>
<script src="index.js"></script>
</body>
</html>