feat: launch public product website

This commit is contained in:
2026-08-20 20:13:35 -04:00
parent d3c30859b2
commit 81109f36ea
41 changed files with 4378 additions and 386 deletions
+226
View File
@@ -0,0 +1,226 @@
import type { Metadata } from "next";
import {
ArrowRight,
Check,
ClipboardCheck,
Mail,
MessageSquareText,
RotateCcw,
Smartphone,
Users,
} from "lucide-react";
import Link from "next/link";
import { SectionLabel } from "~/components/section-label";
import { Badge } from "~/components/ui/badge";
import { Button } from "~/components/ui/button";
import { productRelease } from "~/content/product";
import { BETA_INVITE_MAILTO } from "~/lib/beta";
export const metadata: Metadata = {
title: "Request beta access",
description:
"Learn who the Medscribe internal beta is for, what participants should expect, and how to request access without submitting health information.",
};
const expectations = [
{
icon: ClipboardCheck,
title: "Review is part of testing",
body: "Check generated summaries, extracted medication fields, and the Know Me view before relying on them.",
},
{
icon: MessageSquareText,
title: "Direct feedback",
body: "Report confusing language, incorrect extraction, notification behavior, and sharing friction.",
},
{
icon: RotateCcw,
title: "Possible resets",
body: "This is an internal beta. Builds, local data, and setup may need to be reset as the product changes.",
},
] as const;
const testFocus = [
"Whether the record still feels current after several weeks",
"Medication-label edge cases and correction flow",
"Reminder permissions, timing, travel, and daylight-saving behavior",
"Caregiver pairing, encrypted export, and import comprehension",
"Whether the Know Me handoff is readable and appropriately cautious",
"Physical-device model performance and battery or thermal behavior",
] as const;
export default function BetaPage() {
return (
<>
<section className="px-4 pt-16 pb-18 sm:px-6 sm:pt-22">
<div className="mx-auto grid max-w-6xl gap-12 lg:grid-cols-[1fr_0.8fr] lg:items-center">
<div>
<div className="flex flex-wrap gap-2">
<Badge variant="success">{productRelease.stage}</Badge>
<Badge variant="outline">{productRelease.platforms}</Badge>
</div>
<h1 className="text-foreground mt-6 max-w-3xl font-serif text-5xl leading-[1.02] font-semibold tracking-[-0.03em] sm:text-6xl">
Test the care context, not just the demo.
</h1>
<p className="text-muted-foreground mt-6 max-w-2xl text-lg leading-relaxed sm:text-xl">
We are looking for people managing repeated visits or several
medications, especially family caregiver pairs willing to review
the record over time and tell us where it fails.
</p>
</div>
<div className="border-border-soft bg-surface rounded-[2rem] border p-7 shadow-[0_24px_70px_rgba(15,23,42,0.08)] sm:p-9">
<div className="bg-primary-light text-primary flex size-12 items-center justify-center rounded-xl">
<Mail className="size-6" aria-hidden="true" />
</div>
<h2 className="text-foreground mt-5 font-serif text-3xl font-semibold">
Request access by email
</h2>
<p className="text-muted-foreground mt-4 text-sm leading-relaxed">
The draft asks only for your platform, whether you are testing as
a patient, caregiver, or both, and whether you can test with
another person.
</p>
<Button asChild size="lg" className="mt-7 w-full sm:w-auto">
<a href={BETA_INVITE_MAILTO}>
Draft beta request
<ArrowRight className="size-4" aria-hidden="true" />
</a>
</Button>
<p className="bg-surface-soft text-muted-foreground mt-5 rounded-xl p-4 text-xs leading-relaxed">
Do not send diagnoses, medication names, visit notes, transcripts,
or other health details. Email is not a medical-support or
emergency channel.
</p>
</div>
</div>
</section>
<section className="border-border-soft border-y bg-[#f4f0e8]/75 px-4 py-20 sm:px-6 lg:py-24 dark:bg-[#151b25]">
<div className="mx-auto max-w-6xl">
<SectionLabel>A good fit</SectionLabel>
<h2 className="text-foreground mt-4 max-w-3xl font-serif text-4xl font-semibold tracking-tight sm:text-5xl">
The beta needs real maintenance and handoff situations.
</h2>
<div className="mt-10 grid gap-4 md:grid-cols-3">
{[
{
icon: Smartphone,
title: "Several moving pieces",
body: "You regularly coordinate visits, medication reminders, or follow-ups.",
},
{
icon: Users,
title: "A caregiver relationship",
body: "You can test a deliberate handoff with a trusted family caregiver.",
},
{
icon: Check,
title: "Comfort reviewing",
body: "You understand generated information can be wrong and will check it.",
},
].map((item) => {
const Icon = item.icon;
return (
<article
key={item.title}
className="border-border-soft bg-surface rounded-2xl border p-6"
>
<Icon className="text-primary size-6" aria-hidden="true" />
<h3 className="text-foreground mt-5 font-serif text-2xl font-semibold">
{item.title}
</h3>
<p className="text-muted-foreground mt-3 text-sm leading-relaxed">
{item.body}
</p>
</article>
);
})}
</div>
</div>
</section>
<section className="px-4 py-20 sm:px-6 lg:py-28">
<div className="mx-auto max-w-6xl">
<div className="grid gap-12 lg:grid-cols-[0.8fr_1.2fr]">
<div>
<SectionLabel>What to expect</SectionLabel>
<h2 className="text-foreground mt-4 font-serif text-4xl font-semibold tracking-tight">
This is collaborative product testing.
</h2>
<p className="text-muted-foreground mt-5 leading-relaxed">
Availability is controlled and continuity is not guaranteed.
Medscribe is not emergency care, diagnosis, dosing guidance, or
a replacement for your care team.
</p>
</div>
<div className="grid gap-4 sm:grid-cols-3">
{expectations.map((item) => {
const Icon = item.icon;
return (
<article
key={item.title}
className="border-border-soft bg-surface rounded-2xl border p-5"
>
<Icon className="text-primary size-5" aria-hidden="true" />
<h3 className="text-foreground mt-4 font-serif text-xl font-semibold">
{item.title}
</h3>
<p className="text-muted-foreground mt-3 text-sm leading-relaxed">
{item.body}
</p>
</article>
);
})}
</div>
</div>
<div className="mt-16 rounded-[2rem] bg-[#0f4f4b] p-7 text-white sm:p-10">
<div className="grid gap-10 lg:grid-cols-[0.7fr_1.3fr]">
<div>
<p className="text-xs font-bold tracking-[0.14em] text-teal-100 uppercase">
Current test focus
</p>
<h2 className="mt-4 font-serif text-3xl font-semibold">
The questions we are trying to answer
</h2>
</div>
<ul className="grid gap-3 sm:grid-cols-2">
{testFocus.map((item) => (
<li
key={item}
className="flex gap-3 rounded-xl border border-white/15 bg-white/8 p-4 text-sm leading-relaxed text-teal-50/85"
>
<Check
className="mt-0.5 size-4 shrink-0 text-teal-100"
aria-hidden="true"
/>
{item}
</li>
))}
</ul>
</div>
</div>
<div className="border-border-soft mt-12 flex flex-col items-start justify-between gap-5 border-t pt-10 sm:flex-row sm:items-center">
<div>
<h2 className="text-foreground font-serif text-2xl font-semibold">
Want the technical boundaries first?
</h2>
<p className="text-muted-foreground mt-2 text-sm">
See what stays local, how sharing works, and the current
evidence.
</p>
</div>
<Button asChild variant="outline">
<Link href="/privacy">Read privacy & evidence</Link>
</Button>
</div>
</div>
</section>
</>
);
}
@@ -0,0 +1,32 @@
import type { Metadata } from "next";
import { NorthwellPrintSummary } from "~/components/northwell-print-summary";
import { PrintButton } from "~/components/print-button";
import { SectionLabel } from "~/components/section-label";
export const metadata: Metadata = {
title: "Northwell executive summary",
robots: { index: false, follow: false, nocache: true },
};
export default function NorthwellBriefPage() {
return (
<>
<NorthwellPrintSummary />
<div className="print-hidden mx-auto max-w-2xl px-4 py-16 text-center sm:px-6 lg:py-24">
<SectionLabel>Executive summary · Northwell Health</SectionLabel>
<h1 className="text-foreground mt-4 font-serif text-4xl font-semibold tracking-tight sm:text-5xl">
The health-system executive summary
</h1>
<p className="text-muted-foreground mx-auto mt-5 max-w-xl leading-relaxed">
This private, search-excluded route preserves the existing three-page
print document. Use Print PDF (or Cmd+P, then Save as PDF) to export
it.
</p>
<div className="mt-8 flex justify-center">
<PrintButton size="lg" />
</div>
</div>
</>
);
}
+32
View File
@@ -0,0 +1,32 @@
import type { Metadata } from "next";
import { CvsPrintSummary } from "~/components/cvs-print-summary";
import { PrintButton } from "~/components/print-button";
import { SectionLabel } from "~/components/section-label";
export const metadata: Metadata = {
title: "CVS executive summary",
robots: { index: false, follow: false, nocache: true },
};
export default function CvsSummaryPage() {
return (
<>
<CvsPrintSummary />
<div className="print-hidden mx-auto max-w-2xl px-4 py-16 text-center sm:px-6 lg:py-24">
<SectionLabel>Executive summary · CVS Health</SectionLabel>
<h1 className="text-foreground mt-4 font-serif text-4xl font-semibold tracking-tight sm:text-5xl">
The pharmacy executive summary
</h1>
<p className="text-muted-foreground mx-auto mt-5 max-w-xl leading-relaxed">
This page is formatted as a two-page print document: the medication
record that moves adherence, keeps refills, and lowers cost of care.
Use Print PDF (or Cmd+P, then Save as PDF) to export it.
</p>
<div className="mt-8 flex justify-center">
<PrintButton size="lg" />
</div>
</div>
</>
);
}
@@ -21,6 +21,7 @@ export const metadata: Metadata = {
title: "Executive Summary",
description:
"One-page executive summary for Medscribe, a private medical context app for families managing complex care.",
robots: { index: false, follow: false, nocache: true },
};
const TAGLINE =
+268
View File
@@ -0,0 +1,268 @@
import type { Metadata } from "next";
import {
ArrowRight,
Camera,
Check,
FileText,
Keyboard,
Mic,
ShieldAlert,
} from "lucide-react";
import Link from "next/link";
import { PhoneMockup } from "~/components/phone-mockup";
import { SectionLabel } from "~/components/section-label";
import { Badge } from "~/components/ui/badge";
import { Button } from "~/components/ui/button";
import { productClaims } from "~/content/product";
export const metadata: Metadata = {
title: "How it works",
description:
"See how Medscribe turns visits and medication routines into one local record a person can review and carry.",
};
const inputs = [
{
icon: Keyboard,
title: "Type or paste",
body: "Start from notes you already have and keep the source close to the result.",
},
{
icon: Camera,
title: "Import a screenshot",
body: "Bring in a portal summary or prescription label, then correct extracted fields.",
},
{
icon: FileText,
title: "Attach a document",
body: "Use a photo or document as the input to a local review workflow.",
},
{
icon: Mic,
title: "Record with consent",
body: "Optional visit audio requires consent and is transcribed on the device.",
},
] as const;
const boundaries = [
"It does not diagnose or recommend treatment.",
"It does not calculate, shift, or supply medication timing.",
"It does not replace a pharmacist, prescribing team, or emergency service.",
"It does not automatically synchronize a household in the background.",
] as const;
export default function HowItWorksPage() {
return (
<>
<section className="px-4 pt-16 pb-18 sm:px-6 sm:pt-22">
<div className="mx-auto max-w-6xl">
<Badge variant="success">Current beta workflow</Badge>
<h1 className="text-foreground mt-6 max-w-4xl font-serif text-5xl leading-[1.02] font-semibold tracking-[-0.03em] sm:text-6xl">
One record, built through everyday use.
</h1>
<p className="text-muted-foreground mt-6 max-w-2xl text-lg leading-relaxed sm:text-xl">
Medscribe is useful at a handoff only if ordinary moments keep the
picture current. Every generated result has a person in the review
loop.
</p>
</div>
</section>
<section className="border-border-soft bg-surface/75 border-y px-4 py-18 sm:px-6 lg:py-22">
<div className="mx-auto max-w-6xl">
<SectionLabel>Start where the information is</SectionLabel>
<h2 className="text-foreground mt-4 max-w-3xl font-serif text-4xl font-semibold tracking-tight sm:text-5xl">
Four ways in. One review checkpoint.
</h2>
<div className="mt-10 grid gap-4 sm:grid-cols-2 lg:grid-cols-4">
{inputs.map((item, index) => {
const Icon = item.icon;
return (
<article
key={item.title}
className="border-border-soft bg-canvas rounded-2xl border p-6"
>
<div className="flex items-center justify-between">
<span className="bg-primary-light text-primary flex size-11 items-center justify-center rounded-xl">
<Icon className="size-5" aria-hidden="true" />
</span>
<span className="text-muted-foreground text-xs font-bold">
0{index + 1}
</span>
</div>
<h3 className="text-foreground mt-5 font-serif text-2xl font-semibold">
{item.title}
</h3>
<p className="text-muted-foreground mt-3 text-sm leading-relaxed">
{item.body}
</p>
</article>
);
})}
</div>
<div className="border-primary/20 bg-primary-light/45 mt-6 flex gap-3 rounded-2xl border p-5">
<Check
className="text-primary mt-0.5 size-5 shrink-0"
aria-hidden="true"
/>
<p className="text-foreground text-sm leading-relaxed">
The person reviews summaries and extracted medication fields.
Medscribe does not silently turn model output into an
authoritative medical record.
</p>
</div>
</div>
</section>
<section className="px-4 py-20 sm:px-6 lg:py-28">
<div className="mx-auto max-w-6xl space-y-24">
<div className="grid gap-12 lg:grid-cols-2 lg:items-center">
<div>
<SectionLabel>Review what changed</SectionLabel>
<h2 className="text-foreground mt-4 font-serif text-4xl font-semibold tracking-tight sm:text-5xl">
A summary is a draft, not a verdict.
</h2>
<p className="text-muted-foreground mt-5 leading-relaxed">
Supported transcription and summarization run locally. The visit
remains available beside the summary so a person can check
follow-ups and wording.
</p>
<p className="border-border-soft bg-surface text-muted-foreground mt-5 rounded-2xl border p-5 text-sm leading-relaxed">
<strong className="text-foreground">What comes next:</strong> a
structured review inbox for accepting, correcting, or dismissing
changes inferred from a visit.
</p>
</div>
<div className="bg-primary-light/45 justify-self-center rounded-[2.5rem] p-7">
<PhoneMockup
src="/screenshots/appointment-summary.png"
alt="Synthetic Medscribe beta visit summary"
width={235}
/>
<p className="text-muted-foreground mt-4 text-center text-xs">
Synthetic demo data · beta interface
</p>
</div>
</div>
<div className="grid gap-12 lg:grid-cols-2 lg:items-center">
<div className="justify-self-center rounded-[2.5rem] bg-[#f4f0e8] p-7 lg:order-1 dark:bg-[#151b25]">
<PhoneMockup
src="/screenshots/medication-detail.png"
alt="Synthetic Medscribe beta medication detail"
width={235}
/>
<p className="text-muted-foreground mt-4 text-center text-xs">
Synthetic demo data · beta interface
</p>
</div>
<div className="lg:order-2">
<SectionLabel>Maintain the medication picture</SectionLabel>
<h2 className="text-foreground mt-4 font-serif text-4xl font-semibold tracking-tight sm:text-5xl">
Facts and schedules carry their boundary with them.
</h2>
<p className="text-muted-foreground mt-5 leading-relaxed">
{productClaims.medicationFacts.publicCopy} Schedules can record
whether they are fixed-time or as-needed, the times supplied by
the person&apos;s source, confirmation, and timezone.
</p>
<p className="text-muted-foreground mt-5 text-sm leading-relaxed">
Medscribe records timing supplied by a label, pharmacist, or
prescribing team. It does not calculate or shift medication
times.
</p>
</div>
</div>
<div className="grid gap-12 lg:grid-cols-2 lg:items-center">
<div>
<SectionLabel>Prepare the handoff</SectionLabel>
<h2 className="text-foreground mt-4 font-serif text-4xl font-semibold tracking-tight sm:text-5xl">
Know Me is the view. Sharing is a separate choice.
</h2>
<p className="text-muted-foreground mt-5 leading-relaxed">
Open the local Know Me screen when someone needs a concise
picture. For a caregiver, pair devices, compare a safety number,
review the record, and manually export an encrypted snapshot.
</p>
<p className="text-muted-foreground mt-5 text-sm leading-relaxed">
The current import path does not yet require the sender to be in
the recipient&apos;s active trust list, so recipients must
verify the sender out of band. Revocation prevents a future
local export; it cannot invalidate already-exported ciphertext
or erase a copy the recipient imported.
</p>
</div>
<div className="bg-primary-light/45 justify-self-center rounded-[2.5rem] p-7">
<PhoneMockup
src="/screenshots/emergency-record.png"
alt="Synthetic Medscribe beta Know Me handoff"
width={235}
/>
<p className="text-muted-foreground mt-4 text-center text-xs">
Synthetic demo data · beta interface
</p>
</div>
</div>
</div>
</section>
<section className="border-border-soft border-t bg-[#f4f0e8]/75 px-4 py-20 sm:px-6 dark:bg-[#151b25]">
<div className="mx-auto grid max-w-6xl gap-12 lg:grid-cols-2">
<div>
<div className="bg-primary-light text-primary flex size-12 items-center justify-center rounded-xl">
<ShieldAlert className="size-6" aria-hidden="true" />
</div>
<h2 className="text-foreground mt-5 font-serif text-4xl font-semibold tracking-tight">
What Medscribe does not do
</h2>
<p className="text-muted-foreground mt-4 leading-relaxed">
A useful boundary is part of the product, not fine print after it.
</p>
</div>
<ul className="space-y-3">
{boundaries.map((item) => (
<li
key={item}
className="border-border-soft bg-surface text-foreground flex gap-3 rounded-2xl border p-4 text-sm leading-relaxed"
>
<Check
className="text-primary mt-0.5 size-5 shrink-0"
aria-hidden="true"
/>
{item}
</li>
))}
</ul>
</div>
</section>
<section className="px-4 py-20 sm:px-6">
<div className="mx-auto flex max-w-6xl flex-col items-start justify-between gap-7 rounded-[2rem] bg-[#0f4f4b] px-7 py-10 text-white sm:px-10 md:flex-row md:items-center">
<div>
<h2 className="font-serif text-3xl font-semibold">
See the trust boundary task by task.
</h2>
<p className="mt-2 text-sm leading-relaxed text-teal-50/75">
Read what stays local, what can use a network, and what remains
unfinished.
</p>
</div>
<Button
asChild
size="lg"
variant="outline"
className="border-white/20 bg-white text-[#0f4f4b] hover:bg-teal-50"
>
<Link href="/privacy">
Privacy & evidence
<ArrowRight className="size-4" aria-hidden="true" />
</Link>
</Button>
</div>
</section>
</>
);
}
+1
View File
@@ -14,6 +14,7 @@ export const metadata: Metadata = {
title: "Solution Landscape",
description:
"How the medical-context space is divided today, and the combined job no existing product owns.",
robots: { index: false, follow: false, nocache: true },
};
const INTRO =
+7 -1
View File
@@ -7,9 +7,15 @@ export default function MarketingLayout({
}: Readonly<{ children: React.ReactNode }>) {
return (
<>
<a
href="#main-content"
className="print-hidden bg-primary-button fixed top-2 left-2 z-[100] -translate-y-20 rounded-lg px-4 py-2 text-sm font-semibold text-white transition-transform focus:translate-y-0"
>
Skip to content
</a>
<ScreenBackground />
<SiteHeader />
<main>{children}</main>
<main id="main-content">{children}</main>
<SiteFooter />
</>
);
+489 -196
View File
@@ -1,229 +1,522 @@
import { HeartPulse, Layers, ShieldCheck, Users } from "lucide-react";
import { PhoneMockup } from "~/components/phone-mockup";
import { SectionLabel } from "~/components/section-label";
import { BETA_INVITE_MAILTO } from "~/lib/beta";
import { Badge } from "~/components/ui/badge";
import { Button } from "~/components/ui/button";
import type { Metadata } from "next";
import {
Card,
CardDescription,
CardHeader,
CardTitle,
} from "~/components/ui/card";
ArrowRight,
Check,
ContactRound,
KeyRound,
LockKeyhole,
ScanLine,
ShieldCheck,
Smartphone,
} from "lucide-react";
import Link from "next/link";
const fit = [
import { ProductDevice } from "~/components/product-device";
import { Button } from "~/components/ui/button";
import { productClaims, productRelease } from "~/content/product";
import { BETA_INVITE_MAILTO } from "~/lib/beta";
export const metadata: Metadata = {
title: "Carry the context when care gets complicated",
description:
"Medscribe is a private, patient-controlled beta that helps keep visits, medications, and critical context together on your device.",
};
const visitMoments = [
{
icon: Layers,
title: "Complements Epic, doesn't compete",
body: "Different job. Epic is the record of care inside Northwell. Medscribe is the patient-owned layer beside it, holding what Epic can't reach: the non-Epic care, the between-visit context, the emergency handoff. With the patient's consent, that context flows back into the workflows Northwell already runs, raising the value of the Epic investment rather than competing for it.",
number: "01",
eyebrow: "Visits stay findable",
title: "The visit has a place to land.",
body: "Keep the recording, transcript, and reviewed summary together instead of reconstructing the appointment from memory.",
image: "/screenshots/pitch/visits-natural.webp",
alt: "Medscribe Visits screen in a natural titanium iPhone product bezel",
},
{
icon: Users,
title: "Keeps patients active in their own care",
body: "Reminders and refills the app sets for them, dose tracking, and, between visits, questions routed back to their own care team rather than out to a search engine. Low-friction by design, because a tool the patient actually uses is what turns into adherence, engagement, and in-network follow-through, the things Northwell is measured on.",
number: "02",
eyebrow: "Words stay checkable",
title: "Go back to what was actually said.",
body: "Search the local transcript and compare it with the generated summary before anything becomes part of the record you rely on.",
image: "/screenshots/pitch/transcript-black.webp",
alt: "Medscribe visit transcript in a black titanium iPhone product bezel",
},
{
icon: HeartPulse,
title: "Patient-centered where it counts",
body: "The emergency handoff, the family caregiver covering a shift, the newly-diagnosed patient who half-remembers the plan. Fewer blank handoffs, safer medication moments, patients who stay engaged instead of going dark.",
number: "03",
eyebrow: "The next step stays visible",
title: "Review the useful part. Keep the uncertainty.",
body: "Medications, follow-ups, diagnoses, and instructions are prepared on-device. Suggestions remain suggestions until a person checks them.",
image: "/screenshots/pitch/summary-natural.webp",
alt: "Medscribe appointment summary in a natural titanium iPhone product bezel",
},
] as const;
const proofStats = [
{
value: productRelease.drugFacts.toLocaleString("en-US"),
label: "bundled medication records",
},
{
value: productRelease.rxNormTerms.toLocaleString("en-US"),
label: "RxNorm terms for matching",
},
{
value: productRelease.interactionPairs.toLocaleString("en-US"),
label: "known interaction pairs",
},
] as const;
const privacyPrinciples = [
{
icon: Smartphone,
title: "Your working record stays local",
body: productClaims.localRecord.publicCopy,
},
{
icon: LockKeyhole,
title: "AI runs on the device",
body: productClaims.localAi.publicCopy,
},
{
icon: ShieldCheck,
title: "Private by architecture",
body: "The sensitive work (summarizing visits, answering medication questions, building the record) runs entirely on the device, not the cloud. No health data sent to a server for AI processing, no new inbox to breach, no BAA to negotiate.",
title: "Facts do not come from model memory",
body: productClaims.medicationFacts.publicCopy,
},
];
] as const;
const betaFit = [
"Managing several medications or repeated visits",
"Coordinating care with a family caregiver",
"Willing to review generated information and report errors",
] as const;
export default function HomePage() {
return (
<div className="mx-auto max-w-5xl px-4 py-10 sm:px-6 lg:py-14">
{/* Phone floats right on sm+; prose sections wrap around it like a newspaper column */}
<div className="animate-fade-in-up-delay-1 mx-auto mb-8 flex justify-center sm:float-right sm:mx-0 sm:mb-4 sm:ml-8 lg:ml-10">
<PhoneMockup
src="/screenshots/home.png"
alt="Medscribe home screen"
width={200}
priority
/>
</div>
<div className="space-y-10 lg:space-y-12">
{/* Origin */}
<section className="animate-fade-in-up space-y-5">
<SectionLabel>Executive summary · Northwell Health</SectionLabel>
<h1 className="text-foreground font-serif text-4xl leading-[1.05] font-semibold tracking-tight sm:text-5xl lg:text-6xl">
Be known when care gets complicated
<>
<section className="relative isolate min-h-[calc(100svh-4rem)] overflow-hidden px-4 pt-14 sm:px-6 sm:pt-20 lg:pt-24">
<div className="bg-primary-light/55 absolute top-0 left-1/2 -z-10 h-[38rem] w-[68rem] max-w-[120vw] -translate-x-1/2 rounded-full blur-3xl" />
<div className="mx-auto max-w-7xl text-center">
<div className="animate-fade-in-up flex items-center justify-center gap-3">
<span className="bg-success-light text-success rounded-full px-3 py-1.5 text-xs font-bold tracking-[0.12em] uppercase">
{productRelease.stage}
</span>
<span className="text-muted-foreground text-xs font-semibold tracking-[0.12em] uppercase">
{productRelease.platforms}
</span>
</div>
<h1 className="animate-fade-in-up-delay-1 text-foreground mx-auto mt-7 max-w-6xl font-serif text-[clamp(3.6rem,9vw,8.5rem)] leading-[0.86] font-semibold tracking-[-0.055em]">
Carry the context.
</h1>
<div className="text-muted-foreground space-y-4 text-base leading-relaxed sm:text-lg">
<p>
A grandfather with three adult children, each living twenty to
fifty minutes away. None able to be at every appointment. No
shared, current view of his medications, his visits, or what had
changed.
</p>
<p>
Then came the emergency. A fall. A hospital that did not
understand his condition. Some of his medications were
time-critical. They were administered incorrectly, his decline was
misread, the wrong path was taken, and he passed six weeks later.
The clinicians were not negligent. The system was blind to who he
was, and no trustworthy picture of him existed to hand over.
</p>
<p className="text-foreground font-medium">
Medscribe is the private, patient-owned record built for that gap:
the whole picture, held by the patient, ready to hand over the
moment the chart in front of you doesn&apos;t have it.
</p>
</div>
<div className="flex flex-wrap gap-2">
<Badge variant="success">On-device · no cloud AI</Badge>
<Badge variant="outline">Emergency-ready</Badge>
<Badge variant="outline">Complements Epic</Badge>
<Badge variant="outline">iOS · Android beta</Badge>
</div>
</section>
{/* What it is */}
<section className="animate-fade-in-up space-y-3">
<SectionLabel>What it is</SectionLabel>
<h2 className="font-serif text-3xl font-semibold tracking-tight sm:text-4xl">
A medical record the patient owns and carries
</h2>
<p className="text-muted-foreground leading-relaxed">
Current medications, allergies, baseline, visit summaries, and an
emergency &ldquo;know-me&rdquo; record, kept current through
everyday use, and ready to hand to a caregiver, a new doctor, or an
ER in seconds. Everything runs on the device. Nothing is uploaded.
<p className="animate-fade-in-up-delay-2 text-muted-foreground mx-auto mt-7 max-w-2xl text-lg leading-relaxed sm:text-xl lg:text-2xl">
Visits, medications, and the critical details between themkept
together on the device you carry.
</p>
<div className="border-primary/30 space-y-2 border-l-2 pl-4">
<p className="text-foreground text-sm font-medium">
How the record stays current (live in beta today)
</p>
<ul className="text-muted-foreground space-y-1.5 text-sm leading-relaxed">
<li>
<span className="text-foreground">Visit summaries: </span>type
or paste notes, import MyChart and portal after-visit summaries
from a screenshot, or attach photos and documents; optional
consent-gated audio recording for patients who want it. Any path
feeds the same on-device summary.
</li>
<li>
<span className="text-foreground">Medication management: </span>
pill-bottle label recognition, reminders, and on-device Q&amp;A
grounded in FDA drug facts
</li>
<li>
<span className="text-foreground">Emergency handoff: </span>a
know-me card and encrypted caregiver sharing, patient-controlled
</li>
</ul>
<p className="text-muted-foreground text-sm leading-relaxed">
Structured MyChart / FHIR export import is on the roadmap:
import-and-own, not write-back.
</p>
<div className="animate-fade-in-up-delay-3 mt-8 flex flex-col items-center justify-center gap-3 sm:flex-row">
<Button asChild size="lg">
<Link href="/beta">
Request beta access
<ArrowRight className="size-4" aria-hidden="true" />
</Link>
</Button>
<Button asChild size="lg" variant="outline">
<Link href="/how-it-works">See how it works</Link>
</Button>
</div>
</section>
</div>
{/* The gap Epic's own tools can't close */}
<section className="animate-fade-in-up space-y-3">
<SectionLabel>Where the picture breaks</SectionLabel>
<h2 className="font-serif text-3xl font-semibold tracking-tight sm:text-4xl">
Epic knows what Epic sees
</h2>
<p className="text-muted-foreground leading-relaxed">
MyChart is excellent inside the Epic walls. It puts the chart on the
patient&apos;s phone, links their Epic portals through MyChart
Central, and lets them share with a caregiver or a provider. What no
institutional record can be is the whole picture: the urgent care,
the community specialist, the facility that isn&apos;t on Epic; the
changes between visits; the context a patient keeps themselves. Epic
aggregates Epic. And when it matters most, at an out-of-network ER,
or when the patient can&apos;t generate a share code, the record
that&apos;s actually there is the one they already carry.
<div className="relative mx-auto mt-12 h-[36rem] max-w-5xl sm:h-[46rem] lg:mt-8 lg:h-[54rem]">
<div className="absolute top-24 left-1/2 w-[17rem] -translate-x-[86%] -rotate-6 sm:top-28 sm:w-[22rem] lg:top-32 lg:w-[26rem]">
<ProductDevice
src="/screenshots/pitch/summary-natural.webp"
alt="Medscribe visit summary in a natural titanium iPhone product bezel"
sizes="(min-width: 1024px) 416px, (min-width: 640px) 352px, 272px"
priority
/>
</div>
<div className="absolute top-0 left-1/2 z-10 w-[18rem] -translate-x-[14%] rotate-5 sm:w-[23rem] lg:w-[28rem]">
<ProductDevice
src="/screenshots/pitch/home-black.webp"
alt="Medscribe home screen in a black titanium iPhone product bezel"
sizes="(min-width: 1024px) 448px, (min-width: 640px) 368px, 288px"
priority
/>
</div>
<p className="text-muted-foreground absolute inset-x-0 bottom-5 text-center text-xs font-medium tracking-wide sm:bottom-10">
Synthetic demo data · beta interface
</p>
</section>
</div>
</section>
{/* What makes it different */}
<section className="animate-fade-in-up space-y-3">
<SectionLabel>What makes it different</SectionLabel>
<h2 className="font-serif text-3xl font-semibold tracking-tight sm:text-4xl">
No one else owns the whole job
</h2>
<p className="text-muted-foreground leading-relaxed">
Existing Electronic Health Record (EHR) systems owns the
institutional view, and every institutional tool stops at its own
walls. Around them, the market is full of single-purpose apps: visit
notetakers, medication trackers, record vaults, emergency-ID cards.
Each owns one slice. None holds a private, patient-owned record that
spans every system, Epic and non-Epic alike, stays current through
daily use, and is ready to hand over in a crisis, all on the
patient&apos;s own device. Medscribe is that combination, beside
Epic, not instead of it.
<section className="pitch-lazy border-border-soft bg-surface/80 flex min-h-[78svh] items-center border-y px-4 py-24 sm:px-6 lg:py-32">
<div className="mx-auto max-w-6xl text-center">
<p className="text-primary text-xs font-bold tracking-[0.2em] uppercase">
The missing picture
</p>
</section>
<h2 className="text-foreground mx-auto mt-7 max-w-5xl font-serif text-[clamp(2.8rem,7vw,6.5rem)] leading-[0.98] font-semibold tracking-[-0.045em]">
Care happens in fragments. Your context shouldn&apos;t.
</h2>
<p className="text-muted-foreground mx-auto mt-8 max-w-2xl text-lg leading-relaxed sm:text-xl">
One instruction lives in a portal. A medication label sits in a
cabinet. The latest change lives in someone&apos;s memory. Medscribe
is the patient-held thread between those moments.
</p>
</div>
</section>
{/* Why it fits Northwell: clear float so the card grid spans full width */}
<section className="animate-fade-in-up clear-both space-y-6">
<div className="space-y-2">
<SectionLabel>Why it fits Northwell</SectionLabel>
<h2 className="font-serif text-3xl font-semibold tracking-tight sm:text-4xl">
Built to strengthen the Epic investment, not compete with it
<section className="pitch-lazy px-4 py-24 sm:px-6 lg:py-36">
<div className="mx-auto grid max-w-7xl gap-16 lg:grid-cols-[0.78fr_1.22fr] lg:gap-24">
<div className="lg:sticky lg:top-28 lg:h-fit">
<p className="text-primary text-xs font-bold tracking-[0.2em] uppercase">
After the visit
</p>
<h2 className="text-foreground mt-6 max-w-xl font-serif text-5xl leading-[0.98] font-semibold tracking-[-0.04em] sm:text-6xl">
Turn what happened into something you can check.
</h2>
<p className="text-muted-foreground mt-7 max-w-lg text-lg leading-relaxed">
Bring in typed notes, a portal screenshot, a document, or an
optional consent-gated recording. The work happens locally. You
decide what is useful.
</p>
<div className="border-primary/25 bg-primary-light/35 mt-8 max-w-lg rounded-2xl border p-5">
<p className="text-foreground text-sm leading-relaxed">
<strong className="font-semibold">The safety loop:</strong>{" "}
review generated information before acting. Medscribe does not
diagnose, prescribe, or replace clinical verification.
</p>
</div>
</div>
<div className="grid gap-4 md:grid-cols-2">
{fit.map((item) => {
const Icon = item.icon;
<ol className="space-y-8 sm:space-y-12">
{visitMoments.map((moment) => (
<li
key={moment.number}
className="border-border-soft bg-surface relative overflow-hidden rounded-[2.5rem] border px-5 pt-8 shadow-[0_30px_90px_rgba(15,23,42,0.08)] sm:px-10 sm:pt-10 dark:shadow-[0_30px_90px_rgba(0,0,0,0.25)]"
>
<div className="relative z-10 max-w-xl">
<div className="flex items-center gap-3">
<span className="bg-primary-light text-primary flex size-9 items-center justify-center rounded-full text-xs font-bold">
{moment.number}
</span>
<p className="text-primary text-xs font-bold tracking-[0.16em] uppercase">
{moment.eyebrow}
</p>
</div>
<h3 className="text-foreground mt-5 font-serif text-3xl font-semibold tracking-[-0.025em] sm:text-4xl">
{moment.title}
</h3>
<p className="text-muted-foreground mt-4 max-w-lg leading-relaxed">
{moment.body}
</p>
</div>
<div className="bg-primary-light/45 absolute -right-36 bottom-14 -z-0 size-96 rounded-full blur-3xl" />
<div className="relative mx-auto mt-10 w-[min(72vw,21rem)] translate-y-14">
<ProductDevice
src={moment.image}
alt={moment.alt}
sizes="(min-width: 1024px) 336px, (min-width: 640px) 320px, 72vw"
/>
</div>
</li>
))}
</ol>
</div>
</section>
<section className="pitch-lazy relative isolate overflow-hidden bg-[#082f2c] px-4 py-24 text-white sm:px-6 lg:py-36">
<div className="absolute inset-0 -z-10 bg-[radial-gradient(circle_at_78%_18%,rgba(45,212,191,0.25),transparent_32%),radial-gradient(circle_at_16%_80%,rgba(20,184,166,0.15),transparent_28%)]" />
<div className="mx-auto max-w-7xl">
<div className="mx-auto max-w-4xl text-center">
<p className="text-xs font-bold tracking-[0.2em] text-teal-200 uppercase">
Between visits
</p>
<h2 className="mt-6 font-serif text-[clamp(3rem,7vw,6.7rem)] leading-[0.94] font-semibold tracking-[-0.045em]">
Keep the medication picture from going stale.
</h2>
<p className="mx-auto mt-8 max-w-2xl text-lg leading-relaxed text-teal-50/75 sm:text-xl">
The list, the label, the schedule, and the latest confirmation
belong in the same viewnot scattered across paper and memory.
</p>
</div>
<div className="mt-16 grid gap-14 lg:grid-cols-2 lg:items-center lg:gap-6">
<div className="relative mx-auto h-[42rem] w-full max-w-2xl sm:h-[50rem] lg:h-[56rem]">
<div className="absolute top-20 left-[4%] w-[17rem] -rotate-6 sm:w-[21rem] lg:w-[23rem]">
<ProductDevice
src="/screenshots/pitch/medication-detail-natural.webp"
alt="Medscribe medication detail in a natural titanium iPhone product bezel"
sizes="(min-width: 1024px) 368px, (min-width: 640px) 336px, 272px"
/>
</div>
<div className="absolute top-0 right-[2%] z-10 w-[18rem] rotate-5 sm:w-[22rem] lg:w-[24rem]">
<ProductDevice
src="/screenshots/pitch/medications-black.webp"
alt="Medscribe medication list in a black titanium iPhone product bezel"
sizes="(min-width: 1024px) 384px, (min-width: 640px) 352px, 288px"
/>
</div>
</div>
<div className="grid gap-px overflow-hidden rounded-[2rem] border border-white/12 bg-white/12">
{[
{
title: "Show where a schedule came from",
body: "Schedules can carry their source, confirmation, timezone, and freshness state.",
},
{
title: "Keep facts deterministic",
body: productClaims.medicationFacts.publicCopy,
},
{
title: "Make uncertainty visible",
body: "Missing or stale details stay visible so the person or clinician can verify them.",
},
].map((item) => (
<article
key={item.title}
className="bg-[#0b3b37]/90 p-7 sm:p-9"
>
<Check className="size-5 text-teal-200" aria-hidden="true" />
<h3 className="mt-5 font-serif text-2xl font-semibold sm:text-3xl">
{item.title}
</h3>
<p className="mt-3 leading-relaxed text-teal-50/70">
{item.body}
</p>
</article>
))}
</div>
</div>
</div>
</section>
<section className="pitch-lazy bg-[#f0ece4] px-4 py-24 sm:px-6 lg:py-36 dark:bg-[#111827]">
<div className="mx-auto grid max-w-7xl items-center gap-14 lg:grid-cols-[1fr_0.9fr] lg:gap-24">
<div className="order-2 lg:order-1">
<p className="text-primary text-xs font-bold tracking-[0.2em] uppercase">
Ask from the record
</p>
<h2 className="text-foreground mt-6 max-w-2xl font-serif text-[clamp(3.25rem,6vw,6.5rem)] leading-[0.94] font-semibold tracking-[-0.045em]">
Better questions begin with your context.
</h2>
<p className="text-muted-foreground mt-8 max-w-xl text-lg leading-relaxed sm:text-xl">
Ask about a visit or medication without uploading the record to a
remote model. Answers are grounded in local history and bundled
facts, with the boundary kept in view.
</p>
<p className="border-primary/35 text-muted-foreground mt-7 max-w-xl border-l-2 pl-5 text-sm leading-relaxed">
Informational only. Medication changes still belong with a
clinician or pharmacist.
</p>
</div>
<div className="order-1 mx-auto w-[min(78vw,27rem)] lg:order-2">
<ProductDevice
src="/screenshots/pitch/ask-black.webp"
alt="Medscribe Ask response grounded in local health context, shown in a black titanium iPhone product bezel"
sizes="(min-width: 1024px) 432px, (min-width: 640px) 384px, 78vw"
/>
</div>
</div>
</section>
<section className="pitch-lazy overflow-hidden px-4 py-24 sm:px-6 lg:py-36">
<div className="mx-auto max-w-7xl">
<div className="grid items-center gap-16 lg:grid-cols-[0.92fr_1.08fr] lg:gap-24">
<div className="relative mx-auto w-[min(80vw,28rem)]">
<div className="bg-primary-light/70 absolute inset-[12%_-12%_8%] -z-10 rounded-[4rem] blur-2xl" />
<ProductDevice
src="/screenshots/pitch/know-me-natural.webp"
alt="Medscribe Know Me handoff record in a natural titanium iPhone product bezel"
sizes="(min-width: 1024px) 448px, (min-width: 640px) 400px, 80vw"
/>
</div>
<div>
<p className="text-primary text-xs font-bold tracking-[0.2em] uppercase">
At the handoff
</p>
<h2 className="text-foreground mt-6 max-w-2xl font-serif text-[clamp(3.2rem,6vw,6.2rem)] leading-[0.95] font-semibold tracking-[-0.045em]">
Bring the picture when the chart is incomplete.
</h2>
<p className="text-muted-foreground mt-8 max-w-xl text-lg leading-relaxed sm:text-xl">
Know Me gathers selected medications, allergies, conditions,
baseline, and contacts into one readable snapshot. Freshness
signals show what may need another look.
</p>
<div className="mt-9 grid gap-4 sm:grid-cols-2">
<div className="border-border-soft bg-surface rounded-2xl border p-5">
<ScanLine
className="text-primary size-6"
aria-hidden="true"
/>
<p className="text-foreground mt-4 font-semibold">
Quick handoff
</p>
<p className="text-muted-foreground mt-2 text-sm leading-relaxed">
Show or share a selected, readable snapshot.
</p>
</div>
<div className="border-border-soft bg-surface rounded-2xl border p-5">
<ContactRound
className="text-primary size-6"
aria-hidden="true"
/>
<p className="text-foreground mt-4 font-semibold">
Caregiver copy
</p>
<p className="text-muted-foreground mt-2 text-sm leading-relaxed">
Manually export an encrypted copy for a paired recipient.
</p>
</div>
</div>
</div>
</div>
<div className="mt-24 overflow-hidden rounded-[2.5rem] bg-[#0f4f4b] p-7 text-white sm:p-10 lg:p-14">
<div className="grid gap-12 lg:grid-cols-[0.85fr_1.15fr] lg:items-center">
<div>
<KeyRound className="size-7 text-teal-200" aria-hidden="true" />
<h3 className="mt-5 font-serif text-4xl leading-tight font-semibold sm:text-5xl">
Share a snapshot. Not an invisible feed.
</h3>
<p className="mt-5 max-w-xl leading-relaxed text-teal-50/75">
Pair by QR code, compare a safety number, and choose when to
export. The caregiver imports a local copy on their device.
</p>
</div>
<ol className="grid gap-3 sm:grid-cols-3">
{[
["1", "You review", "Choose the record to send"],
["2", "Encrypted copy", "Protected for the recipient key"],
["3", "They import", "A local, readable snapshot"],
].map(([number, title, body]) => (
<li
key={number}
className="rounded-2xl border border-white/15 bg-white/8 p-5"
>
<span className="flex size-8 items-center justify-center rounded-full bg-white/12 text-xs font-bold">
{number}
</span>
<p className="mt-8 font-serif text-xl font-semibold">
{title}
</p>
<p className="mt-2 text-sm leading-relaxed text-teal-50/65">
{body}
</p>
</li>
))}
</ol>
</div>
<p className="mt-8 border-t border-white/12 pt-6 text-xs leading-relaxed text-teal-50/60">
Manual todaynot live sync or a household cloud account.
Import-side sender trust enforcement is still being hardened;
revocation cannot recall a copy already exported.
</p>
</div>
</div>
</section>
<section className="pitch-lazy relative isolate overflow-hidden bg-[#070d15] px-4 py-24 text-white sm:px-6 lg:py-36">
<div className="absolute inset-0 -z-10 bg-[radial-gradient(circle_at_50%_0%,rgba(45,212,191,0.13),transparent_36%)]" />
<div className="mx-auto max-w-7xl">
<div className="mx-auto max-w-4xl text-center">
<p className="text-xs font-bold tracking-[0.2em] text-teal-300 uppercase">
A precise privacy boundary
</p>
<h2 className="mt-6 font-serif text-[clamp(3.2rem,7vw,7rem)] leading-[0.92] font-semibold tracking-[-0.05em]">
Local changes what you have to trust.
</h2>
<p className="mx-auto mt-8 max-w-2xl text-lg leading-relaxed text-slate-300 sm:text-xl">
The working record and supported AI tasks stay on the device.
Medication facts come from bundled references, not a model trying
to remember medicine.
</p>
</div>
<dl className="mt-20 grid border-y border-white/12 md:grid-cols-3 md:divide-x md:divide-white/12">
{proofStats.map((stat) => (
<div
key={stat.label}
className="border-b border-white/12 px-5 py-10 text-center last:border-b-0 md:border-b-0 lg:py-14"
>
<dt className="text-sm text-slate-400">{stat.label}</dt>
<dd className="mt-3 font-serif text-5xl font-semibold tracking-[-0.04em] text-teal-200 sm:text-6xl lg:text-7xl">
{stat.value}
</dd>
</div>
))}
</dl>
<div className="mt-16 grid gap-4 md:grid-cols-3">
{privacyPrinciples.map((principle) => {
const Icon = principle.icon;
return (
<Card key={item.title} className="card-hover">
<CardHeader>
<div className="bg-primary-light flex size-10 items-center justify-center rounded-[10px]">
<Icon className="text-primary size-5" />
</div>
<CardTitle className="text-lg">{item.title}</CardTitle>
<CardDescription>{item.body}</CardDescription>
</CardHeader>
</Card>
<article
key={principle.title}
className="rounded-[1.75rem] border border-white/12 bg-white/[0.045] p-7"
>
<Icon className="size-6 text-teal-200" aria-hidden="true" />
<h3 className="mt-8 font-serif text-2xl font-semibold">
{principle.title}
</h3>
<p className="mt-4 text-sm leading-relaxed text-slate-400">
{principle.body}
</p>
</article>
);
})}
</div>
</section>
{/* Who's behind it + the ask */}
<section className="animate-fade-in-up">
<Card className="border-primary-button/20 bg-primary-button overflow-hidden text-white">
<CardHeader className="gap-4">
<div className="space-y-3">
<CardTitle className="text-white">
Who&apos;s behind it
</CardTitle>
<CardDescription className="leading-relaxed text-white/80">
Sean O&apos;Connor, a Bucknell computer science and engineering
graduate, built Medscribe after watching his own family try to
hold this together for his grandfather, when the record
scattered exactly at the moment it mattered most. It is live in
beta on iOS and Android today.
</CardDescription>
<CardDescription className="leading-relaxed text-white/80">
The ask is a short conversation about whether a patient-owned
record that spans the systems Epic can&apos;t reach, and feeds
that context back into Northwell&apos;s Epic, is worth
exploring together.
</CardDescription>
</div>
<Button
asChild
size="lg"
variant="outline"
className="text-primary-button w-fit border-white/30 bg-white hover:bg-white/90"
<div className="mt-10 text-center">
<Button asChild variant="secondary">
<Link href="/privacy">
Read privacy & evidence
<ArrowRight className="size-4" aria-hidden="true" />
</Link>
</Button>
</div>
</div>
</section>
<section className="pitch-lazy flex min-h-[82svh] items-center px-4 py-24 sm:px-6 lg:py-32">
<div className="mx-auto w-full max-w-6xl overflow-hidden rounded-[3rem] border border-teal-900/10 bg-[linear-gradient(145deg,#ccfbf1_0%,#f0fdfa_44%,#ffffff_100%)] px-6 py-16 text-center shadow-[0_35px_110px_rgba(15,118,110,0.15)] sm:px-10 lg:px-20 lg:py-24 dark:border-teal-300/10 dark:bg-[linear-gradient(145deg,#134e4a_0%,#0f2930_48%,#111827_100%)]">
<p className="text-primary text-xs font-bold tracking-[0.2em] uppercase">
The right beta participant
</p>
<h2 className="text-foreground mx-auto mt-6 max-w-4xl font-serif text-[clamp(3.2rem,7vw,7rem)] leading-[0.92] font-semibold tracking-[-0.05em]">
Help build the record people can actually carry.
</h2>
<p className="text-muted-foreground mx-auto mt-8 max-w-2xl text-lg leading-relaxed sm:text-xl">
This is an internal beta. Expect close feedback, manual review,
rough edges, and possible resetsnot guaranteed continuity.
</p>
<ul className="mx-auto mt-9 grid max-w-4xl gap-3 text-left md:grid-cols-3">
{betaFit.map((item) => (
<li
key={item}
className="border-primary/15 bg-surface/65 text-foreground flex items-start gap-3 rounded-2xl border p-4 text-sm leading-relaxed"
>
<a href={BETA_INVITE_MAILTO}>Start the conversation</a>
</Button>
</CardHeader>
</Card>
</section>
</div>
</div>
<span className="bg-primary-light mt-0.5 flex size-5 shrink-0 items-center justify-center rounded-full">
<Check className="text-primary size-3" aria-hidden="true" />
</span>
{item}
</li>
))}
</ul>
<div className="mt-10 flex flex-col items-center justify-center gap-3 sm:flex-row">
<Button asChild size="lg">
<a href={BETA_INVITE_MAILTO}>
Draft beta request
<ArrowRight className="size-4" aria-hidden="true" />
</a>
</Button>
<Button asChild size="lg" variant="outline">
<Link href="/beta">What to expect</Link>
</Button>
</div>
<p className="text-muted-foreground mx-auto mt-6 max-w-xl text-xs leading-relaxed">
Start with your platform and whether you are testing as a patient,
caregiver, or both. Please do not email health details.
</p>
</div>
</section>
</>
);
}
+388
View File
@@ -0,0 +1,388 @@
import type { Metadata } from "next";
import {
AlertTriangle,
ArrowRight,
Check,
Database,
FileCheck2,
KeyRound,
LockKeyhole,
Wifi,
} from "lucide-react";
import Link from "next/link";
import { SectionLabel } from "~/components/section-label";
import { Badge } from "~/components/ui/badge";
import { Button } from "~/components/ui/button";
import { productClaims, productRelease } from "~/content/product";
export const metadata: Metadata = {
title: "Privacy & evidence",
description:
"A task-by-task view of Medscribe's local architecture, network behavior, caregiver sharing, evidence, and beta limitations.",
};
const dataMap = [
{
task: "Visit transcription",
location: "Device",
network: "No cloud inference",
control: "Recording requires consent",
},
{
task: "Summary generation",
location: "Device",
network: "No cloud inference",
control: "The person reviews output",
},
{
task: "Medication-label OCR",
location: "Device",
network: "No cloud inference",
control: "Extracted fields remain editable",
},
{
task: "Drug facts and known pairs",
location: "Bundled on device",
network: "No runtime fact lookup",
control: "Sources and coverage are disclosed",
},
{
task: "Model installation or update",
location: "Downloaded to device",
network: "Network may be required",
control: "Approved URLs and file integrity checks",
},
{
task: "Caregiver sharing",
location: "Encrypted device-to-device snapshot",
network: "The person chooses ciphertext transport",
control: "Verify out of band; import trust enforcement is incomplete",
},
{
task: "Primary record storage",
location: "Local app database",
network: "No Medscribe cloud account",
control: "The unlocked device remains a trust boundary",
},
{
task: "Website analytics",
location: "Marketing site only",
network: "Optional Umami script when configured",
control: "Disabled when no website ID is configured",
},
] as const;
const protects = [
"Runtime disclosure of visits or medications to a cloud AI provider",
"A Medscribe account database becoming the default copy of the record",
"A readable caregiver export being sent to someone who was not paired",
] as const;
const doesNotProtect = [
"Information viewed on an unlocked or compromised phone",
"A snapshot that a verified recipient already imported",
"Someone intentionally copying or sharing visible information",
"Every possible drug interaction or model failure",
] as const;
export default function PrivacyPage() {
return (
<>
<section className="px-4 pt-16 pb-18 sm:px-6 sm:pt-22">
<div className="mx-auto max-w-6xl">
<div className="flex flex-wrap items-center gap-2">
<Badge variant="success">
Last verified {productRelease.verifiedOn}
</Badge>
<Badge variant="outline">Internal beta</Badge>
</div>
<h1 className="text-foreground mt-6 max-w-4xl font-serif text-5xl leading-[1.02] font-semibold tracking-[-0.03em] sm:text-6xl">
Privacy should be specific enough to challenge.
</h1>
<p className="text-muted-foreground mt-6 max-w-3xl text-lg leading-relaxed sm:text-xl">
Local is not a magic word. Here is where each task happens, when a
network can be involved, what the design protects, and what it does
not.
</p>
</div>
</section>
<section className="border-border-soft bg-surface/80 border-y px-4 py-18 sm:px-6 lg:py-22">
<div className="mx-auto max-w-6xl">
<SectionLabel>Data map</SectionLabel>
<h2 className="text-foreground mt-4 font-serif text-4xl font-semibold tracking-tight sm:text-5xl">
Task by task, not everything absolutes.
</h2>
<div className="border-border-soft bg-canvas mt-10 overflow-x-auto rounded-2xl border shadow-[0_18px_55px_rgba(15,23,42,0.06)]">
<table className="w-full min-w-[780px] border-collapse text-left text-sm">
<caption className="sr-only">
Medscribe tasks, processing location, network behavior, and user
control
</caption>
<thead>
<tr className="border-border-soft bg-surface-soft border-b">
{[
"Task",
"Where it happens",
"Network behavior",
"User control",
].map((heading) => (
<th
key={heading}
scope="col"
className="text-muted-foreground px-5 py-4 text-xs font-bold tracking-[0.1em] uppercase"
>
{heading}
</th>
))}
</tr>
</thead>
<tbody>
{dataMap.map((row) => (
<tr
key={row.task}
className="border-border-soft/80 border-b last:border-0"
>
<th
scope="row"
className="text-foreground px-5 py-4 font-semibold"
>
{row.task}
</th>
<td className="text-muted-foreground px-5 py-4">
{row.location}
</td>
<td className="text-muted-foreground px-5 py-4">
{row.network}
</td>
<td className="text-muted-foreground px-5 py-4">
{row.control}
</td>
</tr>
))}
</tbody>
</table>
</div>
</div>
</section>
<section className="px-4 py-20 sm:px-6 lg:py-28">
<div className="mx-auto max-w-6xl">
<div className="grid gap-6 lg:grid-cols-3">
{[
{
icon: LockKeyhole,
title: "Supported AI work stays local",
body: productClaims.localAi.publicCopy,
},
{
icon: Database,
title: "The primary record stays local",
body: `${productClaims.localRecord.publicCopy} The beta relies on the device and operating system's protections; it does not claim a separately encrypted app database.`,
},
{
icon: Wifi,
title: "Downloads are the network exception",
body: "Installing or updating a model can require a network. Approved model files are checked against an expected SHA-256 digest before use.",
},
].map((item) => {
const Icon = item.icon;
return (
<article
key={item.title}
className="border-border-soft bg-surface rounded-2xl border p-6"
>
<span className="bg-primary-light text-primary flex size-11 items-center justify-center rounded-xl">
<Icon className="size-5" aria-hidden="true" />
</span>
<h3 className="text-foreground mt-5 font-serif text-2xl font-semibold">
{item.title}
</h3>
<p className="text-muted-foreground mt-3 text-sm leading-relaxed">
{item.body}
</p>
</article>
);
})}
</div>
</div>
</section>
<section className="border-border-soft border-y bg-[#f4f0e8]/75 px-4 py-20 sm:px-6 lg:py-24 dark:bg-[#151b25]">
<div className="mx-auto max-w-6xl">
<div className="grid gap-12 lg:grid-cols-2">
<div>
<div className="bg-primary-light text-primary flex size-12 items-center justify-center rounded-xl">
<KeyRound className="size-6" aria-hidden="true" />
</div>
<SectionLabel className="mt-6">Caregiver sharing</SectionLabel>
<h2 className="text-foreground mt-4 font-serif text-4xl font-semibold tracking-tight">
Verify a person, then export deliberately.
</h2>
<p className="text-muted-foreground mt-5 leading-relaxed">
New snapshots use authenticated encryption targeted to the
recipient key. Ciphertext integrity and wrong-recipient
rejection are tested. The current import path does not yet
require the sender to be in the recipient&apos;s active trust
list, and recipient-key metadata is not authenticated and
checked on import. Verify the sender out of band. The beta does
not claim the Signal protocol or live synchronization.
</p>
</div>
<div className="border-border-soft bg-surface rounded-2xl border p-6 sm:p-8">
<p className="text-foreground font-semibold">
The practical rule
</p>
<ol className="mt-5 space-y-4">
{[
"Compare the safety number with the intended caregiver.",
"Review the snapshot before every material export.",
"Re-export after important changes; it is not automatic.",
"Treat revocation as a block on future local exports; it cannot invalidate already-exported ciphertext.",
].map((item, index) => (
<li
key={item}
className="text-muted-foreground flex gap-3 text-sm leading-relaxed"
>
<span className="bg-primary-light text-primary flex size-6 shrink-0 items-center justify-center rounded-full text-xs font-bold">
{index + 1}
</span>
{item}
</li>
))}
</ol>
</div>
</div>
</div>
</section>
<section className="px-4 py-20 sm:px-6 lg:py-28">
<div className="mx-auto max-w-6xl">
<SectionLabel>Evidence, not superlatives</SectionLabel>
<div className="mt-4 grid gap-10 lg:grid-cols-[0.85fr_1.15fr] lg:items-end">
<div>
<h2 className="text-foreground font-serif text-4xl font-semibold tracking-tight sm:text-5xl">
What the current release can actually point to.
</h2>
</div>
<p className="text-muted-foreground leading-relaxed">
Medication language is based on named public reference datasets,
but condensed wording is not FDA-reviewed. Coverage counts
describe the bundle; they do not prove clinical completeness.
</p>
</div>
<dl className="mt-12 grid gap-4 sm:grid-cols-2 lg:grid-cols-4">
{[
[
productRelease.drugFacts.toLocaleString(),
"Condensed drug records",
],
[
productRelease.rxNormTerms.toLocaleString(),
"RxNorm search terms",
],
[
productRelease.interactionPairs.toLocaleString(),
"Known high-priority pairs",
],
[
productRelease.flaggedForReview.toLocaleString(),
"Records flagged for review",
],
].map(([value, label]) => (
<div
key={label}
className="border-border-soft bg-surface rounded-2xl border p-6"
>
<dt className="text-muted-foreground text-sm leading-relaxed">
{label}
</dt>
<dd className="text-foreground mt-2 font-serif text-4xl font-semibold">
{value}
</dd>
</div>
))}
</dl>
<div className="border-border-soft bg-surface-soft mt-6 flex gap-3 rounded-2xl border p-5">
<FileCheck2
className="text-primary mt-0.5 size-5 shrink-0"
aria-hidden="true"
/>
<p className="text-muted-foreground text-sm leading-relaxed">
Source families include openFDA label data, RxNorm terminology,
MED-RT and DailyMed class inputs, plus a bounded high-priority
interaction list. Release dates and full methodology should be
published with each wider release.
</p>
</div>
</div>
</section>
<section className="border-border-soft bg-surface/75 border-t px-4 py-20 sm:px-6">
<div className="mx-auto grid max-w-6xl gap-8 lg:grid-cols-2">
<div className="border-success/25 bg-success-light/45 rounded-2xl border p-6 sm:p-8">
<div className="flex items-center gap-3">
<Check className="text-success size-6" aria-hidden="true" />
<h2 className="text-foreground font-serif text-2xl font-semibold">
Designed to protect against
</h2>
</div>
<ul className="text-muted-foreground mt-5 space-y-3 text-sm leading-relaxed">
{protects.map((item) => (
<li key={item} className="border-success/30 border-l-2 pl-4">
{item}
</li>
))}
</ul>
</div>
<div className="rounded-2xl border border-amber-500/25 bg-amber-50 p-6 text-slate-900 sm:p-8 dark:bg-amber-950/30 dark:text-slate-100">
<div className="flex items-center gap-3">
<AlertTriangle
className="size-6 text-amber-700 dark:text-amber-300"
aria-hidden="true"
/>
<h2 className="font-serif text-2xl font-semibold">
It does not eliminate
</h2>
</div>
<ul className="mt-5 space-y-3 text-sm leading-relaxed text-slate-600 dark:text-slate-300">
{doesNotProtect.map((item) => (
<li key={item} className="border-l-2 border-amber-500/35 pl-4">
{item}
</li>
))}
</ul>
</div>
</div>
<div className="mx-auto mt-10 flex max-w-6xl flex-col items-start justify-between gap-5 rounded-2xl bg-[#0f4f4b] p-7 text-white sm:flex-row sm:items-center sm:p-9">
<div>
<h2 className="font-serif text-3xl font-semibold">
Help test the boundary.
</h2>
<p className="mt-2 text-sm text-teal-50/75">
The internal beta is focused on correctness, comprehension, and
caregiver handoffs.
</p>
</div>
<Button
asChild
size="lg"
variant="outline"
className="border-white/20 bg-white text-[#0f4f4b] hover:bg-teal-50"
>
<Link href="/beta">
Beta expectations
<ArrowRight className="size-4" aria-hidden="true" />
</Link>
</Button>
</div>
</section>
</>
);
}
+33
View File
@@ -0,0 +1,33 @@
import type { Metadata } from "next";
import { PrintButton } from "~/components/print-button";
import { SectionLabel } from "~/components/section-label";
import { WalgreensPrintSummary } from "~/components/walgreens-print-summary";
export const metadata: Metadata = {
title: "Walgreens executive summary",
robots: { index: false, follow: false, nocache: true },
};
export default function WalgreensSummaryPage() {
return (
<>
<WalgreensPrintSummary />
<div className="print-hidden mx-auto max-w-2xl px-4 py-16 text-center sm:px-6 lg:py-24">
<SectionLabel>Executive summary · Walgreens</SectionLabel>
<h1 className="text-foreground mt-4 font-serif text-4xl font-semibold tracking-tight sm:text-5xl">
The pharmacy executive summary
</h1>
<p className="text-muted-foreground mx-auto mt-5 max-w-xl leading-relaxed">
This page is formatted as a two-page print document: what Medscribe
can do, and how every capability pays off twice, for the patient and
for Walgreens. Use Print PDF (or Cmd+P, then Save as PDF) to export
it.
</p>
<div className="mt-8 flex justify-center">
<PrintButton size="lg" />
</div>
</div>
</>
);
}