2025-09-01 18:16:11 +05:30
import React from "react" ;
import { Navigation } from "../components/Navigation" ;
import { Footer } from "../components/Footer" ;
import { Button } from "../components/ui/button" ;
import { Badge } from "../components/ui/badge" ;
import { Card , CardContent } from "../components/ui/card" ;
import { ArrowRight , Calendar , Users , Smartphone , Shield , Check , Star , TrendingUp , Heart , Bell , MapPin , User , Clock , Target , Zap , Database , Globe , Lock , Activity , AlertCircle } from "lucide-react" ;
2025-09-23 20:13:31 +05:30
import { useNavigate } from "react-router-dom" ;
2025-09-01 18:16:11 +05:30
// import simplitendImage from "figma:asset/b921f42de70695ee319496c3c3eee9a961c5297b.png";
const simplitendImage = "https://via.placeholder.com/600x600.png?text=SimpliTend+App+Image" ;
export const SimpliTendProject = ( ) = > {
2025-09-23 20:13:31 +05:30
const navigate = useNavigate ( ) ;
2025-09-01 18:16:11 +05:30
return (
< div className = "dark min-h-screen bg-background" >
2025-09-23 20:13:31 +05:30
{ /* <Navigation /> */ }
2025-09-01 18:16:11 +05:30
{ /* Hero Section */ }
< section className = "pt-24 pb-16 bg-background relative overflow-hidden" >
< div className = "absolute inset-0 bg-gradient-to-br from-[#E5195E]/5 via-transparent to-transparent" / >
< div className = "container mx-auto px-6 lg:px-8 relative" >
< div className = "grid lg:grid-cols-2 gap-12 items-center" >
< div >
< div className = "flex items-center gap-2 mb-6" >
< Badge className = "bg-[#E5195E]/10 text-[#E5195E] border border-[#E5195E]/20 font-manrope" >
< Heart className = "w-4 h-4 mr-2" / >
Healthcare Technology Case Study
< / Badge >
< / div >
< h1 className = "text-4xl md:text-5xl lg:text-6xl font-bold mb-6 text-white font-manrope" >
SimpliTend App
< / h1 >
< p className = "text-xl text-muted-foreground mb-8 font-manrope" >
Independence Plus Peace of Mind : Caregiver – Patient Connected Mobile Platform for Enhanced Safety and Communication
< / p >
{ /* Tech Stack */ }
< div className = "flex flex-wrap gap-2 mb-8" >
{ [ "React Native" , "Node.js" , "MongoDB" , "AWS Cloud" ] . map ( ( tech ) = > (
< Badge key = { tech } variant = "outline" className = "border-white/20 text-white font-manrope" >
{ tech }
< / Badge >
) ) }
< / div >
{ /* Key Metrics */ }
< div className = "grid grid-cols-2 md:grid-cols-4 gap-4 mb-8" >
< div className = "text-center p-3 bg-card/30 rounded-lg border border-white/10" >
< Calendar className = "w-5 h-5 text-[#E5195E] mx-auto mb-2" / >
< div className = "text-lg font-bold text-white font-manrope" > 10 months < / div >
< div className = "text-xs text-muted-foreground font-manrope" > Duration < / div >
< / div >
< div className = "text-center p-3 bg-card/30 rounded-lg border border-white/10" >
< Users className = "w-5 h-5 text-[#E5195E] mx-auto mb-2" / >
< div className = "text-lg font-bold text-white font-manrope" > 9 experts < / div >
< div className = "text-xs text-muted-foreground font-manrope" > Team Size < / div >
< / div >
< div className = "text-center p-3 bg-card/30 rounded-lg border border-white/10" >
< Smartphone className = "w-5 h-5 text-[#E5195E] mx-auto mb-2" / >
< div className = "text-lg font-bold text-white font-manrope" > iOS & Android < / div >
< div className = "text-xs text-muted-foreground font-manrope" > Platforms < / div >
< / div >
< div className = "text-center p-3 bg-card/30 rounded-lg border border-white/10" >
< Heart className = "w-5 h-5 text-[#E5195E] mx-auto mb-2" / >
< div className = "text-lg font-bold text-white font-manrope" > Healthcare < / div >
< div className = "text-xs text-muted-foreground font-manrope" > Industry < / div >
< / div >
< / div >
{ /* Key Achievements */ }
< div className = "space-y-3 mb-8" >
< h3 className = "text-lg font-semibold text-white mb-4 font-manrope" > Key Achievements : < / h3 >
{ [
"3-tier SKU system for different demographics (Junior, Adult, Senior)" ,
"Persistent, tamper-proof patient app experience" ,
"Fully secure caregiver– patient synchronization" ,
"Comprehensive geofence and alert system"
] . map ( ( achievement , index ) = > (
< div key = { index } className = "flex items-center gap-3" >
< Check className = "w-5 h-5 text-[#E5195E] flex-shrink-0" / >
< span className = "text-muted-foreground font-manrope" > { achievement } < / span >
< / div >
) ) }
< / div >
{ /* CTA Buttons */ }
< div className = "flex flex-col sm:flex-row gap-4" >
< Button
size = "lg"
className = "bg-[#E5195E] hover:bg-[#E5195E]/90 text-white font-manrope"
2025-09-23 20:13:31 +05:30
onClick = { ( ) = > navigate ( '/start-a-project' ) }
2025-09-01 18:16:11 +05:30
>
Build Your Healthcare App
< ArrowRight className = "w-5 h-5 ml-2" / >
< / Button >
< Button
size = "lg"
variant = "outline"
className = "border-white/20 text-white hover:bg-white/10 font-manrope"
2025-09-23 20:13:31 +05:30
onClick = { ( ) = > navigate ( '/case-studies' ) }
2025-09-01 18:16:11 +05:30
>
View More Cases
< / Button >
< / div >
< / div >
< div className = "relative" >
< div className = "aspect-square bg-gradient-to-br from-[#E5195E]/20 to-transparent rounded-2xl p-8 border border-white/10" >
< img
src = { simplitendImage }
alt = "SimpliTend App"
className = "w-full h-full object-cover rounded-lg"
/ >
< / div >
< / div >
< / div >
< / div >
< / section >
{ /* Executive Summary */ }
< section className = "py-16 bg-card/30" >
< div className = "container mx-auto px-6 lg:px-8" >
< div className = "max-w-4xl mx-auto" >
< h2 className = "text-3xl font-bold text-white mb-6 font-manrope" > Executive Summary < / h2 >
< p className = "text-lg text-muted-foreground leading-relaxed font-manrope mb-6" >
The < strong > SimpliTend App < / strong > bridges the gap between caregivers and individuals needing assistance by delivering a simplified , secure mobile environment for patients and a connected , monitoring tool for caregivers . Designed for safety and ease - of - use , it addresses challenges such as spam blocking , navigation assistance , medication reminders , and emergency contact alerts .
< / p >
< p className = "text-lg text-muted-foreground leading-relaxed font-manrope" >
With a dual - application system — one for patients and one for caregivers — SimpliTend ensures safety , independence , and real - time communication for older adults , individuals with early - stage dementia , and their support networks .
< / p >
< / div >
< / div >
< / section >
{ /* Project Overview */ }
< section className = "py-16 bg-background" >
< div className = "container mx-auto px-6 lg:px-8" >
< div className = "max-w-6xl mx-auto" >
< h2 className = "text-3xl font-bold text-white mb-12 text-center font-manrope" > Project Overview < / h2 >
< div className = "grid md:grid-cols-3 gap-8" >
< Card className = "bg-card/50 border-white/10" >
< CardContent className = "p-6" >
< Target className = "w-8 h-8 text-[#E5195E] mb-4" / >
< h3 className = "text-xl font-semibold text-white mb-3 font-manrope" > Background & Context < / h3 >
< p className = "text-muted-foreground font-manrope" >
Millions of older adults and individuals with cognitive impairments face barriers to using smartphones safely , while caregivers struggle to stay updated on their wellbeing . SimpliTend addresses these challenges with a dual - application system ensuring safety , independence , and real - time communication .
< / p >
< / CardContent >
< / Card >
< Card className = "bg-card/50 border-white/10" >
< CardContent className = "p-6" >
< Users className = "w-8 h-8 text-[#E5195E] mb-4" / >
< h3 className = "text-xl font-semibold text-white mb-3 font-manrope" > Target Audience < / h3 >
< p className = "text-muted-foreground font-manrope" >
Older adults with early signs of dementia , adults with autism , caregivers ( family members , professionals , volunteers ) , and secondary markets including working parents wanting child safety and families of independent but aging parents .
< / p >
< / CardContent >
< / Card >
< Card className = "bg-card/50 border-white/10" >
< CardContent className = "p-6" >
< TrendingUp className = "w-8 h-8 text-[#E5195E] mb-4" / >
< h3 className = "text-xl font-semibold text-white mb-3 font-manrope" > Business Objectives < / h3 >
< p className = "text-muted-foreground font-manrope" >
Provide simplified UI / UX for patients to minimize errors and confusion , enable caregivers to monitor activities and receive real - time alerts , offer tiered subscription plans for different use cases , and ensure secure data handling with role - based access .
< / p >
< / CardContent >
< / Card >
< / div >
< / div >
< / div >
< / section >
{ /* Project Scope */ }
< section className = "py-16 bg-card/30" >
< div className = "container mx-auto px-6 lg:px-8" >
< div className = "max-w-6xl mx-auto" >
< h2 className = "text-3xl font-bold text-white mb-12 text-center font-manrope" > Project Scope < / h2 >
< div className = "grid md:grid-cols-2 gap-12" >
< div >
< h3 className = "text-xl font-semibold text-white mb-6 font-manrope" > Patient App Features < / h3 >
< div className = "space-y-4" >
{ [
"Simplified home screen (Call, Text, Voicemail, Photos, Direction to Home, Help, Apps)" ,
"Spam blocking for calls, SMS, and browser links" ,
"Medication and appointment reminders" ,
"Geofencing with travel-based temporary zones" ,
"Emergency contact (ICE) calling"
] . map ( ( feature , index ) = > (
< div key = { index } className = "flex items-start gap-3 p-3 bg-background/50 rounded-lg border border-white/10" >
< Check className = "w-5 h-5 text-[#E5195E] flex-shrink-0 mt-0.5" / >
< span className = "text-muted-foreground font-manrope" > { feature } < / span >
< / div >
) ) }
< / div >
< / div >
< div >
< h3 className = "text-xl font-semibold text-white mb-6 font-manrope" > Caregiver App Features < / h3 >
< div className = "space-y-4" >
{ [
"Real-time notifications for key events (medication, geofence breach, emergency calls)" ,
"Status view for location, device health, unread messages" ,
"Multi-patient support" ,
"Secure login and data sync"
] . map ( ( feature , index ) = > (
< div key = { index } className = "flex items-start gap-3 p-3 bg-background/50 rounded-lg border border-white/10" >
< Check className = "w-5 h-5 text-[#E5195E] flex-shrink-0 mt-0.5" / >
< span className = "text-muted-foreground font-manrope" > { feature } < / span >
< / div >
) ) }
< / div >
< / div >
< / div >
< / div >
< / div >
< / section >
{ /* Challenges & Solution Architecture */ }
< section className = "py-16 bg-background" >
< div className = "container mx-auto px-6 lg:px-8" >
< div className = "max-w-6xl mx-auto" >
< h2 className = "text-3xl font-bold text-white mb-12 text-center font-manrope" > Challenges & Solution Architecture < / h2 >
< div className = "grid md:grid-cols-2 gap-12 mb-16" >
< div >
< h3 className = "text-xl font-semibold text-white mb-6 font-manrope" > Technical Challenges < / h3 >
< div className = "space-y-4" >
{ [
"Designing a persistent app that cannot be unintentionally closed or uninstalled by patients" ,
"Synchronizing multi-patient data securely across devices" ,
"Maintaining usability for low-vision and low-tech users"
] . map ( ( challenge , index ) = > (
< div key = { index } className = "flex items-start gap-3" >
< AlertCircle className = "w-5 h-5 text-[#E5195E] flex-shrink-0 mt-0.5" / >
< span className = "text-muted-foreground font-manrope" > { challenge } < / span >
< / div >
) ) }
< / div >
< / div >
< div >
< h3 className = "text-xl font-semibold text-white mb-6 font-manrope" > Project Management Challenges < / h3 >
< div className = "space-y-4" >
{ [
"Coordinating feedback from diverse caregiver groups" ,
"Adapting feature sets for different SKU models (Junior, Adult, Senior)" ,
"Extensive testing across multiple Android and iOS devices for accessibility"
] . map ( ( challenge , index ) = > (
< div key = { index } className = "flex items-start gap-3" >
< AlertCircle className = "w-5 h-5 text-[#E5195E] flex-shrink-0 mt-0.5" / >
< span className = "text-muted-foreground font-manrope" > { challenge } < / span >
< / div >
) ) }
< / div >
< / div >
< / div >
< div className = "bg-card/50 p-8 rounded-xl border border-white/10" >
< h3 className = "text-xl font-semibold text-white mb-6 font-manrope" > Technical Architecture < / h3 >
< div className = "grid md:grid-cols-2 gap-8" >
< div >
< h4 className = "text-lg font-semibold text-white mb-4 font-manrope" > Technology Stack < / h4 >
< div className = "space-y-3" >
{ [
{ label : "Frontend" , value : "React Native" } ,
{ label : "Backend" , value : "Node.js + Express" } ,
{ label : "Database" , value : "MongoDB (secure cloud + local storage)" } ,
{ label : "Hosting" , value : "AWS" } ,
{ label : "Authentication" , value : "JWT with caregiver– patient pairing PIN" }
] . map ( ( item , index ) = > (
< div key = { index } className = "flex justify-between items-center p-3 bg-background/50 rounded-lg border border-white/10" >
< span className = "text-muted-foreground font-manrope" > { item . label } : < / span >
< span className = "text-white font-medium font-manrope" > { item . value } < / span >
< / div >
) ) }
< / div >
< / div >
< div >
< h4 className = "text-lg font-semibold text-white mb-4 font-manrope" > Architecture Highlights < / h4 >
< div className = "space-y-3" >
{ [
"Dual-app design (separate patient & caregiver apps) for tailored functionality" ,
"Event-driven alerting system with geofence triggers" ,
"Local-first configuration to prevent operational downtime" ,
"Strong accessibility compliance (large fonts, high contrast, labeled icons)"
] . map ( ( highlight , index ) = > (
< div key = { index } className = "flex items-center gap-3" >
< Check className = "w-5 h-5 text-[#E5195E] flex-shrink-0" / >
< span className = "text-muted-foreground text-sm font-manrope" > { highlight } < / span >
< / div >
) ) }
< / div >
< / div >
< / div >
< / div >
< / div >
< / div >
< / section >
{ /* Development Process */ }
< section className = "py-16 bg-card/30" >
< div className = "container mx-auto px-6 lg:px-8" >
< div className = "max-w-6xl mx-auto" >
< h2 className = "text-3xl font-bold text-white mb-12 text-center font-manrope" > Development Process & Methodology < / h2 >
< div className = "mb-12" >
< div className = "text-center mb-8" >
< p className = "text-lg text-muted-foreground font-manrope" >
< strong > Agile < / strong > with 2 - week sprints , early user testing with target caregiver – patient pairs , iterative refinement based on live scenario trials
< / p >
< / div >
< div className = "grid md:grid-cols-2 lg:grid-cols-3 gap-6" >
{ [
{
phase : "Discovery & Planning" ,
duration : "3 weeks" ,
description : "Market research, caregiver interviews, feature prioritization"
} ,
{
phase : "Design & Prototyping" ,
duration : "4 weeks" ,
description : "Accessibility-first UI, caregiver dashboard mockups"
} ,
{
phase : "Core Development" ,
duration : "8 weeks" ,
description : "Patient simplified UI, caregiver alert system, pairing workflow"
} ,
{
phase : "Feature Expansion" ,
duration : "6 weeks" ,
description : "Geofence, medication reminders, ICE integration"
} ,
{
phase : "Testing & Optimization" ,
duration : "4 weeks" ,
description : "Accessibility compliance, multi-device validation"
} ,
{
phase : "Deployment & Training" ,
duration : "3 weeks" ,
description : "App store launch, caregiver onboarding"
}
] . map ( ( item , index ) = > (
< Card key = { index } className = "bg-background/50 border-white/10" >
< CardContent className = "p-6" >
< div className = "flex items-center justify-between mb-3" >
< div className = "w-8 h-8 bg-[#E5195E] rounded-full flex items-center justify-center text-white font-bold text-sm font-manrope" >
{ index + 1 }
< / div >
< Badge variant = "outline" className = "border-[#E5195E]/30 text-[#E5195E] font-manrope" >
{ item . duration }
< / Badge >
< / div >
< h3 className = "text-lg font-semibold text-white mb-2 font-manrope" > { item . phase } < / h3 >
< p className = "text-sm text-muted-foreground font-manrope" > { item . description } < / p >
< / CardContent >
< / Card >
) ) }
< / div >
< / div >
< / div >
< / div >
< / section >
{ /* Key Features */ }
< section className = "py-16 bg-background" >
< div className = "container mx-auto px-6 lg:px-8" >
< div className = "max-w-6xl mx-auto" >
< h2 className = "text-3xl font-bold text-white mb-12 text-center font-manrope" > Key Features & Functionality < / h2 >
< div className = "grid md:grid-cols-2 lg:grid-cols-3 gap-6 mb-12" >
{ [
{
icon : User ,
title : "Tiered SKUs" ,
description : "SimpliTend Junior for child safety tracking, Adult for mild support needs, and Senior for full support suite with ICE and advanced restrictions."
} ,
{
icon : Bell ,
title : "Alerts & Notifications" ,
description : "Geofence exit/entry, medication reminders & refills, low battery warnings, and emergency contact activations."
} ,
{
icon : Shield ,
title : "Secure Caregiver Access" ,
description : "Multi-patient dashboard, role-based permissions, and PIN verification pairing for enhanced security."
} ,
{
icon : MapPin ,
title : "Geofencing System" ,
description : "Dynamic temporary address handling with smart zone management for enhanced safety monitoring."
} ,
{
icon : Lock ,
title : "Persistent App Operation" ,
description : "Tamper-proof patient app with OS-level resilience measures to prevent accidental closure or uninstallation."
} ,
{
icon : Activity ,
title : "Health Monitoring" ,
description : "Medication tracking, appointment reminders, and comprehensive health status monitoring for caregivers."
}
] . map ( ( feature , index ) = > (
< Card key = { index } className = "bg-card/50 border-white/10 hover:border-[#E5195E]/30 transition-all duration-300" >
< CardContent className = "p-6 text-center" >
< feature.icon className = "w-8 h-8 text-[#E5195E] mx-auto mb-4" / >
< h3 className = "text-lg font-semibold text-white mb-3 font-manrope" > { feature . title } < / h3 >
< p className = "text-muted-foreground text-sm font-manrope" > { feature . description } < / p >
< / CardContent >
< / Card >
) ) }
< / div >
< / div >
< / div >
< / section >
{ /* Results & Impact */ }
< section className = "py-16 bg-card/30" >
< div className = "container mx-auto px-6 lg:px-8" >
< div className = "max-w-6xl mx-auto" >
< h2 className = "text-3xl font-bold text-white mb-12 text-center font-manrope" > Results & Impact < / h2 >
< div className = "grid md:grid-cols-2 lg:grid-cols-4 gap-6 mb-12" >
{ [
{ label : "SKU Versions" , value : "3" , icon : User } ,
{ label : "App Operation" , value : "100%" , icon : Shield } ,
{ label : "Spam Reduction" , value : "80%" , icon : Lock } ,
{ label : "Caregiver Awareness" , value : "Real-time" , icon : Bell }
] . map ( ( metric , index ) = > (
< Card key = { index } className = "bg-background/50 border-white/10 text-center" >
< CardContent className = "p-6" >
< metric.icon className = "w-8 h-8 text-[#E5195E] mx-auto mb-3" / >
< div className = "text-2xl font-bold text-white mb-1 font-manrope" > { metric . value } < / div >
< div className = "text-muted-foreground text-sm font-manrope" > { metric . label } < / div >
< / CardContent >
< / Card >
) ) }
< / div >
< div className = "grid md:grid-cols-2 gap-8" >
< div >
< h3 className = "text-xl font-semibold text-white mb-4 font-manrope" > Technical Achievements < / h3 >
< ul className = "space-y-3" >
{ [
"Built a geofence system with dynamic temporary address handling" ,
"Designed an uncloseable patient app with OS-level resilience measures" ,
"Implemented secure caregiver– patient linking with unique PINs per pairing"
] . map ( ( achievement , index ) = > (
< li key = { index } className = "flex items-center gap-3" >
< Check className = "w-5 h-5 text-[#E5195E] flex-shrink-0" / >
< span className = "text-muted-foreground font-manrope" > { achievement } < / span >
< / li >
) ) }
< / ul >
< / div >
< div >
< h3 className = "text-xl font-semibold text-white mb-4 font-manrope" > Business Value < / h3 >
< ul className = "space-y-3" >
{ [
"3 SKU versions launched for different audiences" ,
"100% persistent app operation in testing environments" ,
"80% reduction in spam/scam contact for patient devices" ,
"Real-time caregiver awareness of patient safety and activities"
] . map ( ( value , index ) = > (
< li key = { index } className = "flex items-center gap-3" >
< Check className = "w-5 h-5 text-[#E5195E] flex-shrink-0" / >
< span className = "text-muted-foreground font-manrope" > { value } < / span >
< / li >
) ) }
< / ul >
< / div >
< / div >
< / div >
< / div >
< / section >
{ /* Lessons Learned */ }
< section className = "py-16 bg-background" >
< div className = "container mx-auto px-6 lg:px-8" >
< div className = "max-w-4xl mx-auto" >
< h2 className = "text-3xl font-bold text-white mb-12 text-center font-manrope" > Lessons Learned & Best Practices < / h2 >
< div className = "grid md:grid-cols-2 gap-8" >
< Card className = "bg-card/50 border-white/10" >
< CardContent className = "p-6" >
< h3 className = "text-lg font-semibold text-white mb-4 font-manrope" > What Worked Well < / h3 >
< ul className = "space-y-2" >
{ [
"Accessibility-first design improved adoption by low-tech users" ,
"Separate patient and caregiver apps simplified user experiences"
] . map ( ( item , index ) = > (
< li key = { index } className = "flex items-center gap-3" >
< Check className = "w-4 h-4 text-[#E5195E] flex-shrink-0" / >
< span className = "text-muted-foreground font-manrope" > { item } < / span >
< / li >
) ) }
< / ul >
< / CardContent >
< / Card >
< Card className = "bg-card/50 border-white/10" >
< CardContent className = "p-6" >
< h3 className = "text-lg font-semibold text-white mb-4 font-manrope" > Key Learnings < / h3 >
< ul className = "space-y-2" >
{ [
"SKU flexibility enables broader market reach" ,
"Real-world caregiver trials are essential for feature prioritization"
] . map ( ( item , index ) = > (
< li key = { index } className = "flex items-center gap-3" >
< TrendingUp className = "w-4 h-4 text-[#E5195E] flex-shrink-0" / >
< span className = "text-muted-foreground font-manrope" > { item } < / span >
< / li >
) ) }
< / ul >
< / CardContent >
< / Card >
< / div >
< / div >
< / div >
< / section >
{ /* Client Testimonial */ }
< section className = "py-16 bg-card/30" >
< div className = "container mx-auto px-6 lg:px-8" >
< div className = "max-w-4xl mx-auto text-center" >
< div className = "flex justify-center mb-6" >
{ [ . . . Array ( 5 ) ] . map ( ( _ , i ) = > (
< Star key = { i } className = "w-6 h-6 text-[#E5195E] fill-current" / >
) ) }
< / div >
< blockquote className = "text-xl md:text-2xl text-white mb-6 font-manrope italic" >
"SimpliTend gives my mother the independence she wants while ensuring I know she's safe. The interface is so simple that she uses it without frustration, and I get notified immediately if something is wrong."
< / blockquote >
< div className = "text-muted-foreground font-manrope" >
< div className = "font-semibold text-white" > Family Caregiver < / div >
< div > Beta User < / div >
< / div >
< / div >
< / div >
< / section >
{ /* Future Roadmap */ }
< section className = "py-16 bg-background" >
< div className = "container mx-auto px-6 lg:px-8" >
< div className = "max-w-4xl mx-auto" >
< h2 className = "text-3xl font-bold text-white mb-8 text-center font-manrope" > Future Roadmap < / h2 >
< div className = "grid md:grid-cols-2 gap-8" >
< Card className = "bg-card/50 border-white/10" >
< CardContent className = "p-6" >
< h3 className = "text-lg font-semibold text-white mb-4 font-manrope" > Phase 2 ( 6 Months ) < / h3 >
< ul className = "space-y-2" >
{ [
"Premium caregiver features (history reports, analytics)" ,
"Integration with wearable health devices"
] . map ( ( feature , index ) = > (
< li key = { index } className = "flex items-center gap-3" >
< Clock className = "w-4 h-4 text-[#E5195E] flex-shrink-0" / >
< span className = "text-muted-foreground font-manrope" > { feature } < / span >
< / li >
) ) }
< / ul >
< / CardContent >
< / Card >
< Card className = "bg-card/50 border-white/10" >
< CardContent className = "p-6" >
< h3 className = "text-lg font-semibold text-white mb-4 font-manrope" > Phase 3 ( 12 Months ) < / h3 >
< ul className = "space-y-2" >
{ [
"AI-driven predictive alerts" ,
"Voice assistant integration"
] . map ( ( vision , index ) = > (
< li key = { index } className = "flex items-center gap-3" >
< Target className = "w-4 h-4 text-[#E5195E] flex-shrink-0" / >
< span className = "text-muted-foreground font-manrope" > { vision } < / span >
< / li >
) ) }
< / ul >
< / CardContent >
< / Card >
< / div >
< / div >
< / div >
< / section >
{ /* CTA Section */ }
< section className = "py-16 bg-gradient-to-r from-[#E5195E]/10 via-background to-[#E5195E]/10" >
< div className = "container mx-auto px-6 lg:px-8" >
< div className = "max-w-4xl mx-auto text-center" >
< h2 className = "text-3xl md:text-4xl font-bold text-white mb-6 font-manrope" >
Ready to Build Your Healthcare Solution ?
< / h2 >
< p className = "text-lg text-muted-foreground mb-8 font-manrope" >
Create innovative healthcare applications that bridge the gap between patients and caregivers with secure , accessible technology .
< / p >
< div className = "flex flex-col sm:flex-row gap-4 justify-center" >
< Button
size = "lg"
className = "bg-[#E5195E] hover:bg-[#E5195E]/90 text-white px-8 py-3 font-manrope"
2025-09-23 20:13:31 +05:30
onClick = { ( ) = > navigate ( '/start-a-project' ) }
2025-09-01 18:16:11 +05:30
>
Start Your Project
< ArrowRight className = "w-5 h-5 ml-2" / >
< / Button >
< Button
size = "lg"
variant = "outline"
className = "border-white/20 text-white hover:bg-white/10 px-8 py-3 font-manrope"
2025-09-23 20:13:31 +05:30
onClick = { ( ) = > navigate ( '/case-studies' ) }
2025-09-01 18:16:11 +05:30
>
View More Cases
< / Button >
< / div >
< / div >
< / div >
< / section >
2025-09-23 20:13:31 +05:30
{ /* <Footer /> */ }
2025-09-01 18:16:11 +05:30
< / div >
) ;
} ;