Spaces:
Running
Running
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>NDIS Paperwork Wizard</title> | |
| <script src="https://cdn.tailwindcss.com"></script> | |
| <script src="https://unpkg.com/feather-icons"></script> | |
| <script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script> | |
| <script src="https://cdn.jsdelivr.net/npm/vanta@latest/dist/vanta.globe.min.js"></script> | |
| <style> | |
| @import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap'); | |
| body { | |
| font-family: 'Inter', sans-serif; | |
| } | |
| .hero-gradient { | |
| background: linear-gradient(135deg, #22d3ee 0%, #3b82f6 100%); | |
| } | |
| .feature-card:hover { | |
| transform: translateY(-5px); | |
| box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04); | |
| } | |
| .pricing-card { | |
| transition: all 0.3s ease; | |
| } | |
| .pricing-card:hover { | |
| transform: scale(1.03); | |
| } | |
| .comparison-check { | |
| color: #10b981; | |
| } | |
| </style> | |
| </head> | |
| <body class="bg-gray-50"> | |
| <!-- Hero Section --> | |
| <div id="hero" class="hero-gradient text-white"> | |
| <div class="container mx-auto px-6 py-24 md:py-32"> | |
| <div class="max-w-3xl mx-auto text-center"> | |
| <h1 class="text-4xl md:text-6xl font-bold mb-6">Do the outcome, not the paperwork.</h1> | |
| <p class="text-xl md:text-2xl mb-10 opacity-90">AI that turns your notes into NDIS-compliant documents in two clicks.</p> | |
| <div class="flex justify-center gap-4"> | |
| <button class="bg-white text-blue-600 px-8 py-3 rounded-full font-semibold hover:bg-gray-100 transition duration-300 shadow-lg"> | |
| Book a Demo | |
| </button> | |
| <a href="/how-it-works.html" class="border-2 border-white text-white px-8 py-3 rounded-full font-semibold hover:bg-white hover:text-blue-600 transition duration-300"> | |
| How It Works | |
| </a> | |
| <a href="/workflow.html" class="border-2 border-white text-white px-8 py-3 rounded-full font-semibold hover:bg-white hover:text-blue-600 transition duration-300"> | |
| See Workflow | |
| </a> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Features Section --> | |
| <div class="py-20 bg-white"> | |
| <div class="container mx-auto px-6"> | |
| <h2 class="text-3xl md:text-4xl font-bold text-center mb-16 text-gray-800">Why Choose Our Solution</h2> | |
| <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-8"> | |
| <!-- Feature 1 --> | |
| <div class="feature-card bg-white p-8 rounded-xl shadow-md border border-gray-100 transition duration-300"> | |
| <div class="w-14 h-14 bg-blue-100 rounded-full flex items-center justify-center mb-6"> | |
| <i data-feather="file-text" class="text-blue-600 w-6 h-6"></i> | |
| </div> | |
| <h3 class="text-xl font-semibold mb-3 text-gray-800">Automatic Docs</h3> | |
| <p class="text-gray-600">Generate case notes, agreements, and reports automatically from your notes.</p> | |
| </div> | |
| <!-- Feature 2 --> | |
| <div class="feature-card bg-white p-8 rounded-xl shadow-md border border-gray-100 transition duration-300"> | |
| <div class="w-14 h-14 bg-green-100 rounded-full flex items-center justify-center mb-6"> | |
| <i data-feather="check-circle" class="text-green-600 w-6 h-6"></i> | |
| </div> | |
| <h3 class="text-xl font-semibold mb-3 text-gray-800">Compliance Checks</h3> | |
| <p class="text-gray-600">Flags missing fields with rule references to ensure NDIS compliance.</p> | |
| </div> | |
| <!-- Feature 3 --> | |
| <div class="feature-card bg-white p-8 rounded-xl shadow-md border border-gray-100 transition duration-300"> | |
| <div class="w-14 h-14 bg-purple-100 rounded-full flex items-center justify-center mb-6"> | |
| <i data-feather="clock" class="text-purple-600 w-6 h-6"></i> | |
| </div> | |
| <h3 class="text-xl font-semibold mb-3 text-gray-800">Save 5-10 hrs/week</h3> | |
| <p class="text-gray-600">More time for billable care instead of paperwork.</p> | |
| </div> | |
| <!-- Feature 4 --> | |
| <div class="feature-card bg-white p-8 rounded-xl shadow-md border border-gray-100 transition duration-300"> | |
| <div class="w-14 h-14 bg-yellow-100 rounded-full flex items-center justify-center mb-6"> | |
| <i data-feather="layers" class="text-yellow-600 w-6 h-6"></i> | |
| </div> | |
| <h3 class="text-xl font-semibold mb-3 text-gray-800">Your Templates</h3> | |
| <p class="text-gray-600">Outputs formatted exactly to your provider needs and preferences.</p> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Pricing Section --> | |
| <div class="py-20 bg-gray-50"> | |
| <div class="container mx-auto px-6"> | |
| <h2 class="text-3xl md:text-4xl font-bold text-center mb-4 text-gray-800">Simple, Transparent Pricing</h2> | |
| <p class="text-xl text-center mb-16 text-gray-600 max-w-2xl mx-auto">Pay for what you need with no hidden fees or surprises.</p> | |
| <div class="grid grid-cols-1 md:grid-cols-3 gap-8 max-w-5xl mx-auto"> | |
| <!-- Solo Plan --> | |
| <div class="pricing-card bg-white p-8 rounded-xl shadow-md border border-gray-200"> | |
| <h3 class="text-2xl font-bold mb-4 text-gray-800">Solo / Clinic</h3> | |
| <div class="text-4xl font-bold mb-6 text-blue-600">$299<span class="text-lg font-medium text-gray-500">/month/seat</span></div> | |
| <ul class="space-y-3 mb-8"> | |
| <li class="flex items-center"> | |
| <i data-feather="check" class="text-green-500 mr-2 w-5 h-5"></i> | |
| <span>1-5 users</span> | |
| </li> | |
| <li class="flex items-center"> | |
| <i data-feather="check" class="text-green-500 mr-2 w-5 h-5"></i> | |
| <span>Unlimited documents</span> | |
| </li> | |
| <li class="flex items-center"> | |
| <i data-feather="check" class="text-green-500 mr-2 w-5 h-5"></i> | |
| <span>Basic compliance checks</span> | |
| </li> | |
| </ul> | |
| <button class="w-full bg-blue-600 text-white py-3 rounded-lg font-medium hover:bg-blue-700 transition duration-300"> | |
| Get Started | |
| </button> | |
| </div> | |
| <!-- Agency Plan --> | |
| <div class="pricing-card bg-white p-8 rounded-xl shadow-lg border-2 border-blue-500 relative"> | |
| <div class="absolute top-0 right-0 bg-blue-500 text-white text-xs font-bold px-3 py-1 rounded-bl-lg rounded-tr-lg">POPULAR</div> | |
| <h3 class="text-2xl font-bold mb-4 text-gray-800">Agency</h3> | |
| <div class="text-4xl font-bold mb-6 text-blue-600">$999-$1,999<span class="text-lg font-medium text-gray-500">/month</span></div> | |
| <ul class="space-y-3 mb-8"> | |
| <li class="flex items-center"> | |
| <i data-feather="check" class="text-green-500 mr-2 w-5 h-5"></i> | |
| <span>6-50 users</span> | |
| </li> | |
| <li class="flex items-center"> | |
| <i data-feather="check" class="text-green-500 mr-2 w-5 h-5"></i> | |
| <span>Advanced templates</span> | |
| </li> | |
| <li class="flex items-center"> | |
| <i data-feather="check" class="text-green-500 mr-2 w-5 h-5"></i> | |
| <span>Priority support</span> | |
| </li> | |
| <li class="flex items-center"> | |
| <i data-feather="check" class="text-green-500 mr-2 w-5 h-5"></i> | |
| <span>Team management</span> | |
| </li> | |
| </ul> | |
| <button class="w-full bg-blue-600 text-white py-3 rounded-lg font-medium hover:bg-blue-700 transition duration-300"> | |
| Get Started | |
| </button> | |
| </div> | |
| <!-- Add-On --> | |
| <div class="pricing-card bg-white p-8 rounded-xl shadow-md border border-gray-200"> | |
| <h3 class="text-2xl font-bold mb-4 text-gray-800">Add-On</h3> | |
| <div class="text-4xl font-bold mb-6 text-blue-600">$49<span class="text-lg font-medium text-gray-500">/participant</span></div> | |
| <ul class="space-y-3 mb-8"> | |
| <li class="flex items-center"> | |
| <i data-feather="check" class="text-green-500 mr-2 w-5 h-5"></i> | |
| <span>Longitudinal reports</span> | |
| </li> | |
| <li class="flex items-center"> | |
| <i data-feather="check" class="text-green-500 mr-2 w-5 h-5"></i> | |
| <span>Custom branding</span> | |
| </li> | |
| <li class="flex items-center"> | |
| <i data-feather="check" class="text-green-500 mr-2 w-5 h-5"></i> | |
| <span>Advanced analytics</span> | |
| </li> | |
| </ul> | |
| <button class="w-full bg-gray-200 text-gray-800 py-3 rounded-lg font-medium hover:bg-gray-300 transition duration-300"> | |
| Add to Plan | |
| </button> | |
| </div> | |
| </div> | |
| <div class="mt-16 bg-blue-50 p-6 rounded-xl max-w-3xl mx-auto text-center"> | |
| <p class="text-xl font-medium text-blue-800">"Save $600-$1,200/week in admin hours. $299 is trivial."</p> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Comparison Section --> | |
| <div class="py-20 bg-white"> | |
| <div class="container mx-auto px-6"> | |
| <h2 class="text-3xl md:text-4xl font-bold text-center mb-16 text-gray-800">How We Compare</h2> | |
| <div class="overflow-x-auto"> | |
| <table class="w-full text-left border-collapse"> | |
| <thead> | |
| <tr class="border-b border-gray-200"> | |
| <th class="pb-4 font-semibold text-gray-700">Feature</th> | |
| <th class="pb-4 font-semibold text-gray-700">CareMaster</th> | |
| <th class="pb-4 font-semibold text-gray-700">SafetyCulture</th> | |
| <th class="pb-4 font-semibold text-gray-700">Flowlogic Lite</th> | |
| <th class="pb-4 font-semibold text-gray-700 text-blue-600">NDIS Paperwork Wizard</th> | |
| </tr> | |
| </thead> | |
| <tbody class="divide-y divide-gray-200"> | |
| <tr> | |
| <td class="py-4 font-medium text-gray-700">Document Generation</td> | |
| <td class="py-4">Basic</td> | |
| <td class="py-4">None</td> | |
| <td class="py-4">Limited</td> | |
| <td class="py-4 font-medium text-blue-600">Advanced AI</td> | |
| </tr> | |
| <tr> | |
| <td class="py-4 font-medium text-gray-700">Compliance Checks</td> | |
| <td class="py-4">Yes</td> | |
| <td class="py-4">No</td> | |
| <td class="py-4">Light</td> | |
| <td class="py-4 font-medium text-blue-600">Explainable AI</td> | |
| </tr> | |
| <tr> | |
| <td class="py-4 font-medium text-gray-700">Pricing</td> | |
| <td class="py-4">Per feature</td> | |
| <td class="py-4">Per user</td> | |
| <td class="py-4">Cheap</td> | |
| <td class="py-4 font-medium text-blue-600">Flat rate</td> | |
| </tr> | |
| <tr> | |
| <td class="py-4 font-medium text-gray-700">Mobile Friendly</td> | |
| <td class="py-4">No</td> | |
| <td class="py-4">Yes</td> | |
| <td class="py-4">Partial</td> | |
| <td class="py-4 font-medium text-blue-600">Optimized</td> | |
| </tr> | |
| </tbody> | |
| </table> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Roadmap Section --> | |
| <div class="py-20 bg-gray-50"> | |
| <div class="container mx-auto px-6"> | |
| <h2 class="text-3xl md:text-4xl font-bold text-center mb-16 text-gray-800">What's Coming Next</h2> | |
| <div class="max-w-3xl mx-auto"> | |
| <!-- Timeline Item 1 --> | |
| <div class="flex mb-10"> | |
| <div class="flex flex-col items-center mr-6"> | |
| <div class="w-12 h-12 bg-blue-100 rounded-full flex items-center justify-center"> | |
| <i data-feather="trending-up" class="text-blue-600 w-6 h-6"></i> | |
| </div> | |
| <div class="w-px h-full bg-gray-300 mt-2"></div> | |
| </div> | |
| <div class="pt-1"> | |
| <h3 class="text-xl font-semibold mb-2 text-gray-800">Participant Timelines ($49 add-on)</h3> | |
| <p class="text-gray-600">Track participant progress over time with visual timelines.</p> | |
| </div> | |
| </div> | |
| <!-- Timeline Item 2 --> | |
| <div class="flex mb-10"> | |
| <div class="flex flex-col items-center mr-6"> | |
| <div class="w-12 h-12 bg-purple-100 rounded-full flex items-center justify-center"> | |
| <i data-feather="file" class="text-purple-600 w-6 h-6"></i> | |
| </div> | |
| <div class="w-px h-full bg-gray-300 mt-2"></div> | |
| </div> | |
| <div class="pt-1"> | |
| <h3 class="text-xl font-semibold mb-2 text-gray-800">PDF Export with Provider Letterhead</h3> | |
| <p class="text-gray-600">Professional document exports with your branding.</p> | |
| </div> | |
| </div> | |
| <!-- Timeline Item 3 --> | |
| <div class="flex mb-10"> | |
| <div class="flex flex-col items-center mr-6"> | |
| <div class="w-12 h-12 bg-green-100 rounded-full flex items-center justify-center"> | |
| <i data-feather="link" class="text-green-600 w-6 h-6"></i> | |
| </div> | |
| <div class="w-px h-full bg-gray-300 mt-2"></div> | |
| </div> | |
| <div class="pt-1"> | |
| <h3 class="text-xl font-semibold mb-2 text-gray-800">PRODA Billing Integration</h3> | |
| <p class="text-gray-600">Seamless integration with NDIS PRODA for billing.</p> | |
| </div> | |
| </div> | |
| <!-- Timeline Item 4 --> | |
| <div class="flex"> | |
| <div class="flex flex-col items-center mr-6"> | |
| <div class="w-12 h-12 bg-yellow-100 rounded-full flex items-center justify-center"> | |
| <i data-feather="bar-chart-2" class="text-yellow-600 w-6 h-6"></i> | |
| </div> | |
| </div> | |
| <div class="pt-1"> | |
| <h3 class="text-xl font-semibold mb-2 text-gray-800">Audit Readiness Dashboard</h3> | |
| <p class="text-gray-600">One-click reports to prepare for NDIS audits.</p> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- CTA Section --> | |
| <div class="py-20 bg-blue-600 text-white"> | |
| <div class="container mx-auto px-6 text-center"> | |
| <h2 class="text-3xl md:text-4xl font-bold mb-6">Two clicks to value. No tutorials.</h2> | |
| <p class="text-xl mb-10 max-w-2xl mx-auto opacity-90">We remove the bottleneck you hate most.</p> | |
| <div class="flex flex-col sm:flex-row justify-center gap-4"> | |
| <button class="bg-white text-blue-600 px-8 py-3 rounded-full font-semibold hover:bg-gray-100 transition duration-300 shadow-lg"> | |
| Book a Demo | |
| </button> | |
| <a href="/workflow.html" class="border-2 border-white text-white px-8 py-3 rounded-full font-semibold hover:bg-white hover:text-blue-600 transition duration-300"> | |
| See Interactive Workflow | |
| </a> | |
| </div> | |
| <div class="mt-12"> | |
| <p class="text-lg opacity-90 mb-4">Visit <a href="#" class="underline font-semibold">yourwebsite.com</a> to book a demo</p> | |
| <p class="text-lg opacity-90">📧 <a href="mailto:help@yourdomain.com" class="underline font-semibold">help@yourdomain.com</a></p> | |
| </div> | |
| </div> | |
| </div> | |
| <script> | |
| feather.replace(); | |
| </script> | |
| </body> | |
| </html> | |