# HealthToken Home Page - Content Documentation

## Overview
The home page (`app/page.tsx`) is a React "use client" component serving as the main landing page for HealthToken - an ABHA-ready healthcare identity platform.

---

## 1. SEO & Metadata

### Title
```
HealthToken | ABHA-Ready Health Records, Insurance Guidance & Wellness Tools
```

### Description
```
HealthToken helps doctors, patients, families, and healthcare partners manage digital health identity, clinic intake, wellness records, insurance readiness, and long-term health benefits.
```

### Keywords
- HealthToken
- healthtoken.in
- ABHA ready platform
- ABDM healthcare software
- digital health records India
- health insurance guidance
- clinic intake software
- patient health profile
- wellness checker
- doctor patient platform

### Canonical URL
```
https://healthtoken.in/
```

### Schema (FAQPage JSON-LD)
- What is HealthToken?
- Is HealthToken a government website?
- Does the wellness checker diagnose health conditions?

---

## 2. Brand Colors
| Name | Hex |
|------|-----|
| Navy | #071D33 |
| Teal | #00796B |
| Emerald | #009B86 |
| Gold | #C59B43 |
| Ivory | #F8F6F0 |

---

## 3. Navigation Bar
- Logo (links to `/`)
- Desktop links: How it helps, Insurance, FAQ, Join waitlist button
- Mobile: Not explicitly shown (hidden on mobile)

---

## 4. Hero Section

### Badge/Tag
- Icon: shield
- Text: "ABHA-ready healthcare identity platform"

### Headline
```
Health records, insurance readiness and care benefits in one guided platform.
```

### Subtext
```
HealthToken helps clinics, patients and families organize health identity, basic wellness data, documents, insurance guidance and long-term benefits with privacy-first workflows.
```

### CTAs
1. "Request early access" → #early-access (primary button)
2. "Try wellness checker" → #vital-check (secondary button)

### Product Preview Card (Right side)
Dark card with 4 feature tiles:
1. User icon - Patient profile - Basic health identity
2. Clipboard icon - Clinic intake - Structured onboarding
3. Lock icon - Consent first - Privacy-aware workflows
4. Wallet icon - Benefits layer - Insurance & care support

---

## 5. How It Helps Section

### Eyebrow
```
How it helps
```

### Title
```
Built for every health journey stakeholder
```

### Description
```
The first version can work as a trust-building landing page, lead capture layer, wellness checker and future-ready product foundation.
```

### 3 Stakeholder Cards

1. **Doctors & Clinics**
   - Icon: stethoscope
   - Text: Collect patient interest, intake details, vitals and consent signals before a full EMR or ABDM integration rollout.

2. **Patients & Families**
   - Icon: family
   - Text: Keep important health, insurance and document needs in one guided journey instead of scattered files and messages.

3. **Operations & Partners**
   - Icon: activity
   - Text: Capture qualified leads, identify insurance gaps, map service needs and prepare workflows for admin follow-up.

---

## 6. Picture Cards Section

Three cards with illustrations:

### Card 1: Cleaner doctor visits
- Illustration: Doctor with stethoscope
- Title: Cleaner doctor visits
- Text: Patients arrive with basic health details, concerns and document readiness, helping clinics reduce registration friction.

### Card 2: Family-first health planning
- Illustration: Family icon with file label
- Title: Family-first health planning
- Text: The platform can help families remember health records, renewals, follow-ups and key benefit opportunities over time.

### Card 3: Protection beyond treatment
- Illustration: Umbrella icon with "Protection planning"
- Title: Protection beyond treatment
- Text: Insurance guidance helps users think about medical costs, life risks, dependents and long-term financial stability before a crisis.

---

## 7. Insurance & Stability Section

### Eyebrow
```
Insurance and stability
```

### Title
```
Why health and life insurance matter
```

### Description
```
A health event can affect treatment choices, family savings and business continuity. HealthToken can become a guided bridge between health records, insurance readiness and benefit management.
```

### 4 Feature Cards

1. **Health cost protection**
   - Icon: umbrella
   - Text: Health insurance can reduce the shock of hospitalization and major treatment expenses.

2. **Life risk planning**
   - Icon: heart
   - Text: Life insurance supports family stability when income continuity is affected by an unexpected event.

3. **Documents in order**
   - Icon: file
   - Text: Keep policy, nominee, renewal, claim and medical documents easier to track.

4. **Benefit discovery**
   - Icon: badge
   - Text: Help users understand eligible benefits, follow-up needs and renewal reminders over the long term.

---

## 8. Public Health Direction Section

### Eyebrow
```
Public health direction
```

### Title
```
Aligned with India's digital-health movement
```

### Description
```
These are public-domain policy directions from official government health initiatives. HealthToken should present them as context, not as affiliation or endorsement.
```

### 4 Government Points

1. **Digital health infrastructure**
   - Source: Ayushman Bharat Digital Mission / National Health Authority
   - Text: ABDM aims to support an integrated digital health infrastructure and enable interoperability across India's healthcare ecosystem.

2. **ABHA and health records**
   - Source: National Health Authority
   - Text: ABHA helps citizens link and access health records digitally through consent-led health information exchange flows.

3. **Financial protection through health cover**
   - Source: Ayushman Bharat PM-JAY
   - Text: AB PM-JAY provides eligible families health cover for secondary and tertiary care hospitalization, helping reduce sudden treatment-related financial stress.

4. **Universal health coverage direction**
   - Source: National Health Policy 2017 / MoHFW
   - Text: India's public health direction emphasizes access to quality healthcare without people facing financial hardship.

### Disclaimer Box
```
HealthToken is an independent platform. ABHA, ABDM, Ayushman Bharat and PM-JAY are Government of India/NHA initiatives. This page uses public-health context for awareness and does not claim official government partnership.
```

---

## 9. Modules Section (Dark background)

### Eyebrow
```
Functionality
```

### Title
```
Useful modules for multiple consumer groups
```

### Description
```
Start small with landing and lead capture, then expand into admin workflows, record readiness and insurance-benefit support.
```

### 9 Feature Modules

1. **Patient intake forms** - Collect contact, demographics, concern type, preferred doctor and follow-up needs.

2. **Vitals awareness tool** - BMI, BP and SpO2 awareness summaries for visitor engagement.

3. **Insurance readiness profile** - Understand existing policies, coverage gaps, dependents and renewal dates.

4. **Document vault roadmap** - Prepare for policy, report, prescription and ID document management.

5. **Clinic lead dashboard** - Admin team can review doctors, patients, partners and integration enquiries.

6. **ABHA/ABDM roadmap** - Future-ready architecture for consent-led digital health record journeys.

7. **Renewal reminders** - Help families avoid missed policy, appointment and follow-up timelines.

8. **Benefits guidance** - Support eligible benefit discovery, claim preparation and service coordination.

9. **Partner onboarding** - Create a path for clinics, advisors, labs and healthcare partners.

---

## 10. Wellness Checker Section (id="vital-check")

### Left Panel Content

**Eyebrow**
```
Guided wellness check
```

**Title**
```
Check what you know. Skip what you don't.
```

**Description**
```
Start with height and weight. If you have a recent BP machine or pulse oximeter reading, add those too. If not, leave them as they are or clear them.
```

**Info Boxes**

1. **Easy inputs** (green box)
   - Title: Easy inputs
   - Text: Height and weight are enough to calculate BMI.

2. **Optional device readings** (amber box)
   - Title: Optional device readings
   - Text: BP needs a blood pressure monitor. SpO2 needs a pulse oximeter. Do not guess these values.

3. **Emergency reminder** (red box)
   - Title: Emergency reminder
   - Text: Chest pain, severe breathlessness, fainting, confusion, blue lips, or very low oxygen readings should be handled urgently by a qualified medical professional.

4. **Daily health tip** (gold/amber box)
   - Icon: heart
   - Title: Daily health tip
   - Text: Start with one small habit today: drink enough water, take a 10-minute walk, sleep on time, or check one pending health document.
   - Note: **PLACEHOLDER** - "later this can rotate daily tips from your admin panel or content database."

### Right Panel - Input Form

**Section Title**
```
Your inputs
```

**Description**
```
Use recent measured values. Leave optional fields blank if unavailable.
```

**Button**
```
I don't have BP / SpO2
```
Action: Clears sys, dia, spo2 state

**Input Fields**

| Field | Type | Default | Helper Text |
|-------|------|---------|-------------|
| Height (cm) | number | 170 | Example: 170 cm. You can check this from a previous medical record, gym record, or measuring tape. |
| Weight (kg) | number | 70 | Example: 70 kg. Use a recent weighing scale reading. |
| Systolic BP / upper number from BP machine | number | 120 | This is the first or top number on a BP monitor. Example: 120 in 120/80. |
| Diastolic BP / lower number from BP machine | number | 80 | This is the second or bottom number on a BP monitor. Example: 80 in 120/80. |
| SpO2 % / oxygen level optional | number | 97 | This comes from a pulse oximeter finger device. Most people will not know this without a device. |

**Results Section**

3 result cards showing:
1. BMI card with value, label, and classification
2. BP card with label and note
3. SpO2 card with label and note

**Source Info Box**
Shows data sources for BMI, BP, SpO2 readings

**BP Device Resources**
Links to external BP validation resources:
1. ValidateBP - https://www.validatebp.org/
2. STRIDE BP - https://www.stridebp.org/bp-monitors/
3. Connected BP monitors - https://omronhealthcare.com/
4. Health Connect - https://play.google.com/store/apps/details?id=com.google.android.apps.healthdata

**Disclaimer**
```
This tool is for awareness only. It does not diagnose, prescribe, or replace medical advice. Results should be interpreted with symptoms, age, medical history, pregnancy status, medication, and clinician guidance.
```

---

## 11. Wellness Checker Calculation Functions

### calculateBMI(heightCm, weightKg)
- Converts height from cm to meters
- Calculates: weight / (height in meters)^2
- Returns rounded to 1 decimal place
- Returns 0 if invalid inputs

### classifyBMI(bmi)
| BMI Value | Label | Tone |
|-----------|-------|------|
| <= 0 or empty | Enter height and weight | neutral |
| < 18.5 | Underweight range | warn |
| 18.5 - 24.9 | Healthy weight range | good |
| 25 - 29.9 | Overweight range | warn |
| >= 30 | Obesity range | alert |

### classifyBP(sys, dia)
| Systolic | Diastolic | Label | Note | Tone |
|----------|-----------|-------|------|------|
| Empty | Empty | Enter BP reading | Use a recent reading from a reliable BP monitor. | neutral |
| > 180 | > 120 | Very high reading | Recheck after a minute. Seek urgent medical help if symptoms are present. | alert |
| >= 140 | any OR >= 90 | High BP range | Discuss repeated readings with a qualified clinician. | alert |
| 130-139 | 80-89 | Stage 1 high BP range | Track readings and speak to a clinician if repeated. | warn |
| 120-129 | < 80 | Elevated BP range | Lifestyle review and regular monitoring may help. | warn |
| < 120 | < 80 | Normal BP range | Keep tracking periodically. | good |

### classifySpO2(value)
| SpO2 Value | Label | Note | Tone |
|------------|-------|------|------|
| Empty/0 | Optional | Enter SpO2 if measured using a pulse oximeter. | neutral |
| <= 92 | Low oxygen reading | Consider urgent medical advice, especially with breathlessness. | alert |
| <= 94 | Needs attention | Recheck and speak to a clinician if it persists or symptoms appear. | warn |
| > 94 | Generally reassuring | Interpret along with symptoms and medical history. | good |

---

## 12. FAQ Section

### Eyebrow
```
FAQ
```

### Title
```
Important questions before launch
```

### FAQ Items

1. **Q:** Is HealthToken a doctor consultation platform?
   **A:** The first version is positioned as a health identity, intake, wellness-awareness and insurance-readiness platform. Doctor consultation or EMR modules can be added later.

2. **Q:** Will HealthToken create ABHA or access government health records?
   **A:** That should be added only after official ABDM sandbox and production onboarding. The current landing page can collect interest and explain the roadmap.

3. **Q:** Can patients store insurance details?
   **A:** Yes, the product roadmap can include policy details, nominee information, renewal dates, claim documents and benefit reminders.

4. **Q:** Can doctors use it before full ABDM integration?
   **A:** Yes. Clinics can use the early version for enquiries, patient intake, vitals capture and follow-up coordination while deeper integrations are built.

5. **Q:** Is the wellness checker enough for medical advice?
   **A:** No. It is only an awareness tool based on self-entered values. It should always direct users to qualified medical professionals for diagnosis, treatment and emergency symptoms.

6. **Q:** How will HealthToken help long-term stability?
   **A:** By keeping health records, insurance readiness, renewal reminders, benefit guidance and family health planning organized in one journey.

---

## 13. Early Access / Contact Section (id="early-access")

### Left Panel Content

**Eyebrow**
```
Early access
```

**Title**
```
Start collecting doctor, patient and insurance-interest leads now.
```

**Description**
```
This page can validate HealthToken while ABHA/ABDM integration, admin dashboards, document vault, insurance-benefit workflows and clinic onboarding modules are being built.
```

### Right Panel - Form Fields

| Field | Type | Placeholder |
|-------|------|-------------|
| Full name | input | Full name |
| Mobile number | input | Mobile number |
| Email address | input | Email address |
| User type | select | (default option shown) |
| Message | textarea | Tell us what you need |

**Select Options:**
1. I am a doctor / clinic owner
2. I am a patient / family member
3. I need health or life insurance guidance
4. I am a healthcare partner
5. I want ABDM/ABHA integration help

**Submit Button**
```
Request early access
```

---

## 14. Footer

### Logo
- Links to `/`
- Uses `/brand/healthtoken-logo-light.svg`

### Navigation Links
- How it helps → #how-it-helps
- Insurance → #insurance
- Wellness checker → #vital-check
- FAQ → #faq
- Contact → #early-access

### Copyright
```
© {current year} HealthToken. All rights reserved.
```

### Disclaimer
```
HealthToken is an independent platform. ABHA, ABDM, Ayushman Bharat and PM-JAY are Government of India/NHA initiatives.
```

---

## 15. UI Components

### Icons Used
- arrow, shield, activity, clipboard, lock, user, wallet, stethoscope, badge, heart, family, hospital, umbrella, file, phone

### Component Patterns
- `SectionHeader` - Reusable section title component with eyebrow, title, text
- `PictureCard` - Card with gradient background, illustration, title, description
- `IllustrationDoctor`, `IllustrationFamily`, `IllustrationInsurance` - Inline SVG illustrations
- `FAQItem` - Expandable FAQ component
- `FadeIn` - Animation wrapper
- `Field` - Reusable input field with label and helper text
- `LogoMark` - SVG logo component
- `toneClass` - Maps tone to CSS classes for result cards

### Animations
- `fadeInUp` keyframe animation for FadeIn component

### Back to Top Button
- Appears after scrolling 400px
- Fixed position bottom-right
- Smooth scroll to top on click

---

## 16. Placeholder Elements

1. **Daily Health Tip** - Currently hardcoded, should rotate from admin panel/database
2. **Form submission** - `onSubmit={(e) => e.preventDefault()}` - needs backend integration
3. **Admin dashboards** - Mentioned in roadmap but not implemented
4. **Document vault** - Mentioned in roadmap but not implemented
5. **ABHA/ABDM integration** - Roadmap item, not implemented yet

---

## 17. External Links

| Link | URL | Purpose |
|------|-----|---------|
| ValidateBP | https://www.validatebp.org/ | BP device validation |
| STRIDE BP | https://www.stridebp.org/bp-monitors/ | BP monitor list |
| Connected BP monitors | https://omronhealthcare.com/ | OMRON Connect devices |
| Health Connect | https://play.google.com/store/apps/details?id=com.google.android.apps.healthdata | Android health data |

---

## 18. Test Functions

`runHealthTokenLogicTests()` - Unit tests for:
- BMI classifications (normal, overweight, invalid)
- BP classifications (normal, elevated, high, invalid)
- SpO2 classifications (optional, warning, good)
- BMI calculation accuracy

---

## 19. File Locations

- Main page: `app/page.tsx`
- Layout: `app/layout.tsx`
- Global styles: `app/globals.css`
- Backup: `app/page.backup.tsx`
- Favicon: `app/favicon.ico`