Build a modern, responsive web application for a health-tech SaaS called "Aftercall". Aftercall is an AI voice agent that automatically calls patients after hospital discharge, runs structured clinical check-ins, and flags anyone who needs to be reseen.
Use React, Tailwind CSS, React Router, and Lucide React for icons. If you support shadcn/ui, please use it for the components. The design should feel professional, trustworthy, and clean (use a color palette of slate/gray for neutrals, blue for primary actions, emerald for positive status, and red for alerts).
The application needs 4 main pages connected via routing:
1. Landing Page (/)
- Navigation Bar: Logo (PhoneCall icon) + "Aftercall" text. Links to "Clinical Dashboard" and a primary button for "Try the AI Demo".
- Hero Section:
- A small "Now Live" badge with a pulsing dot.
- Headline: "Zero-effort clinical follow-ups that save lives." (Highlight "save lives" in blue).
- Subheadline explaining the product: "An AI voice agent that automatically calls patients after discharge, runs structured clinical check-ins, and instantly flags anyone who needs to be reseen."
- Two CTA buttons: "Experience the AI Call" (Primary) and "View Clinical Dashboard" (Secondary).
- Features Grid (3 columns):
- Tailored Sequences (Activity icon): Day 1, 3, and 7 follow-ups tailored to the procedure.
- Instant Escalation (ShieldAlert icon in red): Red flags trigger immediate human callbacks.
- Seamless EHR Sync (CheckCircle2 icon in green): Calls sync automatically to hospital software.
- How it Works (4 steps in a horizontal row): 1. Discharge, 2. AI Calls, 3. Assessment, 4. Action.
- Footer: Simple copyright and branding.
2. Clinical Dashboard (/app)
- Header: Page title "Patient Follow-ups" with a search bar and filter button.
- Summary Stat Cards (3 columns):
- "Needs Attention" (Red, e.g., 2 patients)
- "Normal Check-ins" (Green, e.g., 24 patients)
- "Calls Today" (Blue, e.g., 12 calls)
- Make these cards clickable to filter the table below.
- Patient Data Table:
- Columns: Patient (Name, ID, Age), Procedure & Discharge Date, Status Badge, Last Call, Actions.
- Status Badges: "Needs Attention" (Red with alert icon), "Normal" (Green with check icon), "Pending" (Gray with clock icon).
- If a patient "Needs Attention", show a brief red text reason below their badge (e.g., "Pain score 8/10, swelling reported").
- Action column: "View Details" button linking to the Patient Detail page.
- Generate mock data for 5-6 patients (e.g., Eleanor Rigby, James Holden, Walter White).
3. Patient Detail View (/patient/:id)
- Top Nav: Back button to return to the dashboard.
- Patient Profile Card:
- Name, ID, Age, Procedure (e.g., "Total Knee Replacement"), Discharge Date, Phone Number.
- If their status is "Needs Attention", show a prominent red alert badge next to their name.
- Action buttons: "View EHR" and "Call Patient".
- Follow-up History Timeline:
- A list of past AI calls presented as cards.
- Call 1 (Flagged): Day 3 Check-in. Show a red header. Include an "AI Summary" box explaining that the patient reported high pain and swelling. Below the summary, show a chat-bubble style transcript between the "AI" and the "Patient" demonstrating the escalation.
- Call 2 (Normal): Day 1 Check-in. Show a green header. Include a summary stating recovery is on track, and a short transcript.
4. AI Voice Demo Interface (/demo)
- Concept: A page simulating an active phone call with the AI agent.
- UI Layout: Dark mode aesthetic (slate-900) to feel like a phone call screen.