import React, { useMemo, useState } from "react";
import { Check, ArrowRight, Shield, Building2, Phone, Mail, Clock, FileText, DollarSign, Users, LineChart, Sparkles } from "lucide-react";
// shadcn/ui primitives
import { Card, CardContent } from "@/components/ui/card";
import { Button } from "@/components/ui/button";
import { Input } from "@/components/ui/input";
import { Textarea } from "@/components/ui/textarea";
export default function MedicalRevenueRecoveryLanding() {
const [avgClaim, setAvgClaim] = useState(40000);
const [numClaims, setNumClaims] = useState(10);
const [winRate, setWinRate] = useState(0.6);
const [sharePct, setSharePct] = useState(0.1); // your referral share
const recovered = useMemo(() => avgClaim * numClaims * winRate, [avgClaim, numClaims, winRate]);
const referral = useMemo(() => recovered * sharePct, [recovered, sharePct]);
return (
<div className="min-h-screen bg-gray-50 text-gray-900">
{/* Nav */}
<header className="sticky top-0 z-30 backdrop-blur bg-white/70 border-b">
<div className="mx-auto max-w-7xl px-4 py-3 flex items-center justify-between">
<div className="flex items-center gap-2">
<div className="h-9 w-9 rounded-xl bg-black flex items-center justify-center text-white text-xs font-bold">MRR</div>
<div className="font-semibold tracking-tight">Medical Revenue Recovery</div>
</div>
<div className="hidden md:flex items-center gap-6 text-sm">
<a href="#how" className="hover:opacity-70">How it works</a>
<a href="#who" className="hover:opacity-70">Who we help</a>
<a href="#proof" className="hover:opacity-70">Results</a>
<a href="#faq" className="hover:opacity-70">FAQ</a>
</div>
<div className="flex items-center gap-2">
<a href="#contact"><Button size="sm" className="rounded-2xl">Request consult</Button></a>
</div>
</div>
</header>
{/* Hero */}
<section className="relative overflow-hidden">
<div className="absolute -top-24 -right-24 h-80 w-80 rounded-full bg-gradient-to-tr from-gray-200 to-white blur-3xl" />
<div className="mx-auto max-w-7xl px-4 py-16 md:py-24 grid md:grid-cols-2 gap-10 items-center">
<div>
<div className="inline-flex items-center gap-2 rounded-full border px-3 py-1 text-xs font-medium bg-white shadow-sm">
<Sparkles className="h-3.5 w-3.5" /> No-Surprises-Act Arbitration • Out-of-Network Underpayments
</div>
<h1 className="mt-4 text-4xl md:text-5xl font-extrabold leading-tight tracking-tight">Recover underpaid <span className="bg-gradient-to-r from-black to-gray-500 bg-clip-text text-transparent">out‑of‑network</span> revenue without adding staff</h1>
<p className="mt-4 text-gray-700 text-lg">We manage end‑to‑end claims disputes and NSA arbitrations with a data‑driven legal team so your surgeons and finance staff stay focused on patients.</p>
<div className="mt-6 flex flex-wrap items-center gap-3">
<a href="#contact"><Button className="rounded-2xl">Free 15‑min evaluation <ArrowRight className="ml-2 h-4 w-4" /></Button></a>
<a href="#calculator" className="text-sm font-medium hover:opacity-70">Estimate your recovery →</a>
</div>
<div className="mt-6 grid grid-cols-2 gap-4 text-sm text-gray-700">
<div className="flex items-center gap-2"><Shield className="h-4 w-4"/> HIPAA‑compliant workflow</div>
<div className="flex items-center gap-2"><Clock className="h-4 w-4"/> Fast triage and filing</div>
<div className="flex items-center gap-2"><LineChart className="h-4 w-4"/> Transparent reporting</div>
<div className="flex items-center gap-2"><Users className="h-4 w-4"/> Dedicated dispute team</div>
</div>
</div>
<div>
<Card className="rounded-2xl shadow-lg">
<CardContent className="p-6">
<h3 className="text-lg font-semibold">Quick recovery estimator</h3>
<p className="text-sm text-gray-600">Simple projection. Not financial advice.</p>
<div id="calculator" className="mt-4 grid grid-cols-2 gap-4">
<div>
<label className="text-xs font-medium">Average claim underpayment ($)</label>
<Input type="number" value={avgClaim} onChange={(e)=>setAvgClaim(Number(e.target.value)||0)} className="mt-1" />
</div>
<div>
<label className="text-xs font-medium">Number of disputed claims</label>
<Input type="number" value={numClaims} onChange={(e)=>setNumClaims(Number(e.target.value)||0)} className="mt-1" />
</div>
<div>
<label className="text-xs font-medium">Expected success rate</label>
<Input type="number" step="0.05" min={0} max={1} value={winRate} onChange={(e)=>setWinRate(Math.min(1, Math.max(0, Number(e.target.value)||0)))} className="mt-1" />
<p className="text-[11px] text-gray-500 mt-1">Enter 0–1 (e.g., 0.6)</p>
</div>
<div>
<label className="text-xs font-medium">Your referral share</label>
<Input type="number" step="0.01" min={0} max={1} value={sharePct} onChange={(e)=>setSharePct(Math.min(1, Math.max(0, Number(e.target.value)||0)))} className="mt-1" />
<p className="text-[11px] text-gray-500 mt-1">Enter 0–1 (e.g., 0.1)</p>
</div>
</div>
<div className="mt-4 rounded-xl bg-gray-100 p-4">
<div className="text-sm text-gray-700">Projected recovered revenue:</div>
<div className="text-2xl font-bold tracking-tight">${recovered.toLocaleString()}</div>
<div className="mt-2 text-sm text-gray-700">Your projected referral share:</div>
<div className="text-xl font-semibold">${referral.toLocaleString()}</div>
</div>
<a href="#contact"><Button className="mt-4 w-full rounded-2xl">Discuss eligibility</Button></a>
</CardContent>
</Card>
</div>
</div>
</section>
{/* Logos / social proof placeholder */}
<section id="proof" className="py-10">
<div className="mx-auto max-w-7xl px-4">
<div className="rounded-2xl border bg-white p-6 shadow-sm">
<p className="text-center text-sm text-gray-600">Trusted by physician groups and medical associations. Case studies available under NDA.</p>
<div className="mt-4 grid grid-cols-2 md:grid-cols-4 gap-4 text-sm">
<div className="flex items-center gap-2 justify-center py-2"><Building2 className="h-4 w-4"/>Neurosurgery groups</div>
<div className="flex items-center gap-2 justify-center py-2"><Building2 className="h-4 w-4"/>Cardio‑thoracic surgery</div>
<div className="flex items-center gap-2 justify-center py-2"><Building2 className="h-4 w-4"/>Hospital systems</div>
<div className="flex items-center gap-2 justify-center py-2"><Building2 className="h-4 w-4"/>ASC networks</div>
</div>
</div>
</div>
</section>
{/* How it works */}
<section id="how" className="py-14 bg-white">
<div className="mx-auto max-w-7xl px-4">
<h2 className="text-2xl md:text-3xl font-bold tracking-tight">How it works</h2>
<div className="mt-6 grid md:grid-cols-3 gap-6">
{[
{icon: FileText, title: "Identify & intake", text: "Securely ingest EOBs, remit data, and denial rationales. Rapid claim triage within days."},
{icon: Shield, title: "Build the case", text: "Clinical + contractual argumentation, benchmark data, and expert negotiation prep."},
{icon: DollarSign, title: "Arbitrate & collect", text: "File NSA IDR when applicable, track outcomes, reconcile payments, and report ROI."},
].map((s, i)=> (
<Card key={i} className="rounded-2xl" >
<CardContent className="p-6">
<div className="h-10 w-10 rounded-xl bg-gray-100 flex items-center justify-center">
<s.icon className="h-5 w-5" />
</div>
<h3 className="mt-4 font-semibold">{s.title}</h3>
<p className="text-sm text-gray-600 mt-2">{s.text}</p>
<ul className="mt-3 space-y-1 text-sm text-gray-700">
<li className="flex items-center gap-2"><Check className="h-4 w-4"/> HIPAA‑compliant portal</li>
<li className="flex items-center gap-2"><Check className="h-4 w-4"/> Dedicated dispute team</li>
<li className="flex items-center gap-2"><Check className="h-4 w-4"/> Outcome‑based alignment</li>
</ul>
</CardContent>
</Card>
))}
</div>
</div>
</section>
{/* Who we help */}
<section id="who" className="py-14">
<div className="mx-auto max-w-7xl px-4">
<h2 className="text-2xl md:text-3xl font-bold tracking-tight">Who we help</h2>
<div className="mt-6 grid md:grid-cols-2 gap-6">
<Card className="rounded-2xl">
<CardContent className="p-6">
<h3 className="font-semibold">Surgeon groups & private practices</h3>
<p className="text-sm text-gray-600 mt-2">Neurosurgery, cardio‑thoracic, orthopedics, plastics, and more.</p>
<ul className="mt-3 space-y-1 text-sm text-gray-700">
<li className="flex items-center gap-2"><Check className="h-4 w-4"/> OON underpayments and denials</li>
<li className="flex items-center gap-2"><Check className="h-4 w-4"/> NSA arbitration eligibility screening</li>
<li className="flex items-center gap-2"><Check className="h-4 w-4"/> Minimal staff lift</li>
</ul>
</CardContent>
</Card>
<Card className="rounded-2xl">
<CardContent className="p-6">
<h3 className="font-semibold">Hospitals, ASCs, and associations</h3>
<p className="text-sm text-gray-600 mt-2">Portfolio‑level programs with transparent dashboards and monthly ROI reports.</p>
<ul className="mt-3 space-y-1 text-sm text-gray-700">
<li className="flex items-center gap-2"><Check className="h-4 w-4"/> Multi‑entity onboarding</li>
<li className="flex items-center gap-2"><Check className="h-4 w-4"/> Data & contract review</li>
<li className="flex items-center gap-2"><Check className="h-4 w-4"/> Executive briefings</li>
</ul>
</CardContent>
</Card>
</div>
</div>
</section>
{/* CTA strip */}
<section className="py-10 bg-black text-white">
<div className="mx-auto max-w-7xl px-4 flex flex-col md:flex-row items-center justify-between gap-4">
<h3 className="text-xl font-semibold tracking-tight">Ready to see what you left on the table?</h3>
<a href="#contact"><Button variant="secondary" className="rounded-2xl">Start a claim review</Button></a>
</div>
</section>
{/* FAQ */}
<section id="faq" className="py-14 bg-white">
<div className="mx-auto max-w-7xl px-4">
<h2 className="text-2xl md:text-3xl font-bold tracking-tight">Frequently asked</h2>
<div className="mt-6 grid md:grid-cols-2 gap-6 text-sm text-gray-700">
<Card className="rounded-2xl"><CardContent className="p-6">
<h4 className="font-semibold">What data do you need?</h4>
<p className="mt-2">EOBs, remit files, denial codes, claim files, and payer correspondence. We provide a secure upload link.</p>
</CardContent></Card>
<Card className="rounded-2xl"><CardContent className="p-6">
<h4 className="font-semibold">How do fees work?</h4>
<p className="mt-2">Aligned to outcomes. No new FTEs. Association programs may use custom terms.</p>
</CardContent></Card>
<Card className="rounded-2xl"><CardContent className="p-6">
<h4 className="font-semibold">Is this legal advice?</h4>
<p className="mt-2">No. Operations are handled by a qualified dispute and legal team. This site is informational only.</p>
</CardContent></Card>
<Card className="rounded-2xl"><CardContent className="p-6">
<h4 className="font-semibold">How fast are results?</h4>
<p className="mt-2">Varies by payer and venue. Many disputes move to resolution within a few months after complete intake.</p>
</CardContent></Card>
</div>
</div>
</section>
{/* Contact */}
<section id="contact" className="py-16">
<div className="mx-auto max-w-4xl px-4">
<Card className="rounded-2xl">
<CardContent className="p-6 md:p-8">
<h2 className="text-2xl md:text-3xl font-bold tracking-tight">Request a confidential consult</h2>
<p className="mt-2 text-sm text-gray-600">No obligation. NDA available.</p>
<form className="mt-6 grid md:grid-cols-2 gap-4">
<div className="md:col-span-1">
<label className="text-xs font-medium">Full name</label>
<Input placeholder="Dr. Jane Smith" className="mt-1" />
</div>
<div className="md:col-span-1">
<label className="text-xs font-medium">Organization</label>
<Input placeholder="ABC Neurosurgery" className="mt-1" />
</div>
<div className="md:col-span-1">
<label className="text-xs font-medium">Email</label>
<Input type="email" placeholder="name@hospital.org" className="mt-1" />
</div>
<div className="md:col-span-1">
<label className="text-xs font-medium">Phone</label>
<Input type="tel" placeholder="(212) 555‑0123" className="mt-1" />
</div>
<div className="md:col-span-2">
<label className="text-xs font-medium">Message</label>
<Textarea placeholder="Tell us about your OON or NSA issues…" className="mt-1 min-h-[120px]" />
</div>
<div className="md:col-span-2 flex items-center justify-between">
<div className="text-xs text-gray-500 flex items-center gap-3">
<span className="flex items-center gap-1"><Phone className="h-3.5 w-3.5"/> (212) 799‑1411</span>
<span className="flex items-center gap-1"><Mail className="h-3.5 w-3.5"/> info@precisionaestheticsmd.com</span>
</div>
<Button type="button" className="rounded-2xl">Send securely</Button>
</div>
</form>
</CardContent>
</Card>
<p className="text-[11px] text-gray-500 mt-4">Disclaimer: This page is informational. It does not constitute legal advice. Outcomes vary by payer, venue, documentation quality, and other factors.</p>
</div>
</section>
{/* Footer */}
<footer className="py-10 border-t bg-white">
<div className="mx-auto max-w-7xl px-4 text-sm text-gray-600 flex flex-col md:flex-row items-center justify-between gap-3">
<div>© {new Date().getFullYear()} Medical Revenue Recovery. All rights reserved.</div>
<div className="flex items-center gap-4">
<a href="#faq" className="hover:opacity-70">Compliance</a>
<a href="#contact" className="hover:opacity-70">Contact</a>
</div>
</div>
</footer>
</div>
);
}