I am rimport React, { useMemo, useState } from "react"; import { motion } from "framer-motion"; import { Card, CardContent } from "@/components/ui/card"; import { Button } from "@/components/ui/button"; const BLUE = "#0077c8"; const GREEN = "#97d700"; const TEXT = "#111111"; function formatCurrency(value) { return new Intl.NumberFormat("en-US", { style: "currency", currency: "USD", maximumFractionDigits: 0, }).format(Number(value) || 0); } function formatPercent(value) { return `${Number(value || 0).toFixed(1)}%`; } export function calculateROI({ monthlyUnits = 0, avgGross = 0, conversionRate = 0, grossLift = 0, conversionLift = 0, }) { const safeMonthlyUnits = Number(monthlyUnits) || 0; const safeAvgGross = Number(avgGross) || 0; const safeConversionRate = Number(conversionRate) || 0; const safeGrossLift = Number(grossLift) || 0; const safeConversionLift = Number(conversionLift) || 0; const additionalUnits = safeMonthlyUnits * (safeConversionLift / 100); const grossFromHigherValue = safeMonthlyUnits * safeGrossLift; const grossFromMoreUnits = additionalUnits * safeAvgGross; const monthlyLift = grossFromHigherValue + grossFromMoreUnits; const annualLift = monthlyLift * 12; const newConversionRate = safeConversionRate * (1 + safeConversionLift / 100); return { additionalUnits, grossFromHigherValue, grossFromMoreUnits, monthlyLift, annualLift, newConversionRate, }; } function runROITests() { const tests = [ { name: "default assumptions", input: { monthlyUnits: 85, avgGross: 1800, conversionRate: 14, grossLift: 900, conversionLift: 18 }, expected: { additionalUnits: 15.3, grossFromHigherValue: 76500, grossFromMoreUnits: 27540, monthlyLift: 104040, annualLift: 1248480, newConversionRate: 16.52, }, }, { name: "zero assumptions", input: { monthlyUnits: 0, avgGross: 0, conversionRate: 0, grossLift: 0, conversionLift: 0 }, expected: { additionalUnits: 0, grossFromHigherValue: 0, grossFromMoreUnits: 0, monthlyLift: 0, annualLift: 0, newConversionRate: 0, }, }, { name: "string inputs are safely coerced", input: { monthlyUnits: "10", avgGross: "2000", conversionRate: "12", grossLift: "500", conversionLift: "10" }, expected: { additionalUnits: 1, grossFromHigherValue: 5000, grossFromMoreUnits: 2000, monthlyLift: 7000, annualLift: 84000, newConversionRate: 13.2, }, }, ]; tests.forEach(({ name, input, expected }) => { const actual = calculateROI(input); Object.keys(expected).forEach((key) => { const pass = Math.abs(actual[key] - expected[key]) < 0.001; if (!pass) { // eslint-disable-next-line no-console console.error(`ROI test failed: ${name} / ${key}. Expected ${expected[key]}, got ${actual[key]}`); } }); }); } runROITests(); function SvgIcon({ children, className = "h-5 w-5", color = BLUE }) { return ( ); } function CheckCircleIcon({ className = "h-5 w-5", color = GREEN }) { return ( ); } function ArrowRightIcon({ className = "h-4 w-4", color = "currentColor" }) { return ( ); } function ShieldCheckIcon({ className = "h-4 w-4", color = GREEN }) { return ( ); } function TrendingUpIcon({ className = "h-8 w-8", color = BLUE }) { return ( ); } function CarIcon({ className = "h-8 w-8", color = BLUE }) { return ( ); } function CalculatorIcon({ className = "h-4 w-4", color = BLUE }) { return ( ); } function DollarBadgeIcon({ className = "h-8 w-8", color = BLUE }) { return ( ); } export default function TrustedSaleLandingPage() { const [monthlyUnits, setMonthlyUnits] = useState(85); const [avgGross, setAvgGross] = useState(1800); const [conversionRate, setConversionRate] = useState(14); const [grossLift, setGrossLift] = useState(900); const [conversionLift, setConversionLift] = useState(18); const roi = useMemo( () => calculateROI({ monthlyUnits, avgGross, conversionRate, grossLift, conversionLift }), [monthlyUnits, avgGross, conversionRate, grossLift, conversionLift] ); const problemCards = [ { Icon: CarIcon, title: "Value is invisible", text: "Recon, inspection, and quality are rarely merchandised clearly.", }, { Icon: DollarBadgeIcon, title: "Price takes over", text: "Buyers compare against the cheapest similar listing.", }, { Icon: TrendingUpIcon, title: "Gross gets compressed", text: "Your team defends price instead of presenting value.", }, ]; const calculatorFields = [ ["Monthly used units", monthlyUnits, setMonthlyUnits, 10, 300, "units"], ["Current avg front-end gross", avgGross, setAvgGross, 500, 5000, "$"], ["Current lead-to-sale conversion", conversionRate, setConversionRate, 5, 35, "%"], ["Gross lift per Trusted Sale unit", grossLift, setGrossLift, 100, 2500, "$"], ["Conversion lift", conversionLift, setConversionLift, 1, 40, "%"], ]; return (

Trusted Sale™
Trust-led used vehicle retail

Turn inventory into Trusted Retail Vehicles.

Make reconditioning visible, give customers proof, and help your sales team sell value instead of defending price.

Vehicle Trust Badge
Retail Ready
Verified
Fully inspected
$1,842 reconditioned
Value explained upfront

Used Cars = Low Trust

Dealers are investing more into vehicles than ever. But when customers cannot see the work, price becomes everything.

{problemCards.map(({ Icon, title, text }) => (

{title}

{text}

))}

The Trusted Sale Framework

A simple system for making value visible across listings, showroom conversations, and sales follow-up.

{[ "Inspect", "Recondition", "Prove", "Present", "Sell", ].map((step, index) => (
0{index + 1}
{step}
))}
Dealer ROI Calculator

Estimate the upside of visible trust.

Use directional assumptions to model how higher gross and stronger conversion could impact monthly and annual profit.

{calculatorFields.map(([label, value, setter, min, max, suffix]) => ( ))}
Projected Annual Gross Lift
{formatCurrency(roi.annualLift)}

Directional model based on your selected monthly volume, gross lift, and conversion lift assumptions.

Monthly lift
{formatCurrency(roi.monthlyLift)}
Additional monthly units
{roi.additionalUnits.toFixed(1)}
Gross from value lift
{formatCurrency(roi.grossFromHigherValue)}
Modeled conversion rate
{formatPercent(roi.newConversionRate)}

You’re already doing the work.

Now get paid for it.

); } aw html block.
Click edit button to change this html