/* global React, PROGRAMS, PrimaryButton, GhostButton, Eyebrow, Card */ /* Home-page sections: Hero, StatsStrip, ProductGrid, Pillars, Process, Charity, Testimonials, FinalCTA */ const { useState: useStateHome, useEffect: useEffectHome, useRef: useRefHome } = React; // ---------- JOURNEY HERO (scroll-cross-fade through 4 photos) ---------- const JOURNEY_FRAMES = [ { src: "assets/journey-1-forsale.png", eyebrow: "Step one", headline: "This is the part we work for.", sub: "Long before the application, long before the rate lock — there's a sidewalk, a sign, and a feeling. We're here to get you from this moment to the front door.", objectPosition: "25% center", // pan left so the pregnant wife is visible alongside the husband }, { src: "assets/journey-2-docs.png", eyebrow: "Step two", headline: "From the kitchen table.", sub: "Snap a photo of your W-2. Upload your bank statements. The whole application — from your couch, in minutes. No printer, no fax, no driving anywhere.", }, { src: "assets/journey-3-closing.png", eyebrow: "Step three", headline: "The last signature.", sub: "Months of work come down to a single afternoon at a wooden table. We're with you for every page, every question, every signature.", }, { src: "assets/journey-4-nursery.png", eyebrow: "Step four", headline: "This is what a mortgage is for.", sub: "Not the rate. Not the paperwork. The room at the end of the hall, ready and waiting. We helped you get here.", }, ]; function JourneyHero() { const sectionRef = useRefHome(null); const [progress, setProgress] = useStateHome(0); // 0..1 across the entire scrollytelling section useEffectHome(() => { let raf = 0; const tick = () => { const el = sectionRef.current; if (!el) { raf = requestAnimationFrame(tick); return; } const rect = el.getBoundingClientRect(); const total = el.offsetHeight - window.innerHeight; // distance scrolled past top of section, clamped 0..1 const scrolled = Math.max(0, Math.min(total, -rect.top)); const p = total > 0 ? scrolled / total : 0; setProgress(p); raf = requestAnimationFrame(tick); }; raf = requestAnimationFrame(tick); return () => cancelAnimationFrame(raf); }, []); // Preload images so cross-fades don't pop useEffectHome(() => { JOURNEY_FRAMES.forEach(f => { const img = new Image(); img.src = f.src; }); }, []); // For 4 frames, each owns 1/(N) of the timeline. const N = JOURNEY_FRAMES.length; // continuous scroll position across frames: 0..N-1 const t = progress * (N - 1); // opacity of frame i, with cross-fade overlap const frameOpacity = (i) => { const d = Math.abs(t - i); // hard 1 within ±0.18; cross-fade between if (d >= 0.85) return 0; if (d <= 0.15) return 1; // linear cross-fade return 1 - (d - 0.15) / (0.85 - 0.15); }; // text opacity: peak in the middle of each frame's window const textOpacity = (i) => { const d = Math.abs(t - i); if (d >= 0.55) return 0; if (d <= 0.10) return 1; return 1 - (d - 0.10) / (0.55 - 0.10); }; // text y-translate (subtle parallax) const textTranslate = (i) => { const d = t - i; // signed return d * 40; // -40..+40 range as it slides past }; // Image scale — slow ken-burns within each frame's active window const frameScale = (i) => { const d = t - i; return 1 + Math.max(-0.05, Math.min(0.05, d * 0.08)); }; return (
{/* Stacked images */} {JOURNEY_FRAMES.map((f, i) => (
{/* Gradient scrim for text legibility */}
))} {/* Top bar overlay — thin progress + step counter */}
{String(Math.min(N, Math.round(t) + 1)).padStart(2,"0")} / {String(N).padStart(2,"0")}
The Haven journey
{/* Stacked text — one per frame, fading in/out */}
{JOURNEY_FRAMES.map((f, i) => (
0.5 ? "auto" : "none", maxWidth: 720, }}>
{f.eyebrow}

{f.headline}

{f.sub}

))}
{/* Final-frame CTA — appears with the last frame */}
0.5 ? "auto" : "none", display: "flex", gap: 12, }}> Start a 15-minute call See programs
{/* Scroll affordance — first frame only */}
Scroll
); } // ---------- HERO ---------- function LiveQuoteCard({ coralIntensity = "balanced" }) { const coralBg = coralIntensity === "loud" ? "rgba(255,122,89,0.18)" : coralIntensity === "muted" ? "rgba(255,122,89,0.06)" : "rgba(255,122,89,0.10)"; return (
Pre-qualification preview
Live shop
Self-employed · 740 FICO · $875,000 purchase
{[ ["Matched program", "Bank Statement"], ["Docs required", "24 mo deposits"], ["Est. LTV", "85%"], ["Seasoning", "None"], ["Lenders shopped", "40+"], ].map(([k, v]) => (
{k} {v}
))}
Likely eligible No soft pull at this stage
); } function PhoneMock({ title, lines, tilt = -6, accent = "#ff7a59" }) { return (
Haven · match
{title}
{lines.map(([k,v],i) => (
{k} {v}
))}
View program
); } function Hero({ variant = "split", coralIntensity = "balanced", typeTone = "light" }) { if (variant === "dark-phones") { return (

Borrow Smarter, Not Harder.

Experience the future of non-QM lending. Manage payments, match programs, and track approvals — all from one broker.

Start a 15-minute call See the nine programs
); } const heavy = typeTone === "heavy"; const heroWeight = heavy ? 400 : 300; const pillFill = coralIntensity === "loud" ? "rgba(255,122,89,0.14)" : coralIntensity === "muted" ? "rgba(255,122,89,0.04)" : "rgba(255,122,89,0.08)"; if (variant === "light") { return (
Atlanta · Licensed in GA · FL · TX

Better options, better service, better experience.

A boutique Atlanta brokerage. We shop 40+ wholesale lenders in real time and recommend the one that actually fits your file.

Start a 15-minute call See the nine programs
); } if (variant === "photo") { return (
{/* placeholder for photography */}
Atlanta · NMLS #2431561

Loans for borrowers who don't fit a box.

Self-employed. Asset-rich. Rebuilding. Over the conforming limit. We shop 40+ wholesale lenders and recommend the one that actually fits.

Start a 15-minute call See the nine programs
); } // default: "split" return (
Atlanta · Licensed in GA · FL · TX

Loans for borrowers who don't fit a box.

Self-employed. Asset-rich. Rebuilding. Over the conforming limit. We shop 40+ wholesale lenders in real time and recommend the one that actually fits.

Start a 15-minute call See the nine programs
Veteran loan officers. No learners on your file.
); } // ---------- STATS ---------- function StatsStrip() { const stats = [ ["40+", "Wholesale lenders shopped"], ["9", "Loan programs"], ["15", "Minutes to first call"], ["100%", "Closings include a charity donation"], ]; return (
{stats.map(([n, label], i) => (
{n}
{label}
))}
); } // ---------- PRODUCT GRID ---------- function ProductCard({ program }) { return ( e.currentTarget.style.boxShadow = "rgba(31,45,61,0.22) 0 30px 45px -30px, rgba(0,0,0,0.08) 0 18px 36px -18px"} onMouseLeave={(e) => e.currentTarget.style.boxShadow = "rgba(31,45,61,0.06) 0 2px 4px"}>
{program.tag}
{program.headline}
Docs
{program.docs}
Max LTV
{program.ltv}
 ); } function ProductGrid() { return (
Nine programs

A program for most borrowers banks skip.

Compare all nine
{PROGRAMS.map(p => )}
); } // ---------- PROCESS ---------- function ProcessSteps() { const steps = [ ["01", "15-min call", "Talk to a veteran broker. No soft pull at this stage."], ["02", "Program match", "We shop 40+ lenders and bring back one honest recommendation."], ["03", "Docs + underwriting", "Transparent cost sheet up front. No surprises at closing."], ["04", "Close + charity", "Pick a nonprofit. We donate in your name at the table."], ]; return (
How it works

Four steps. No learners on your file.

Full process
{steps.map(([num, title, body]) => (
{num}
{title}
{body}
))}
); } // ---------- PILLARS ---------- function Pillars() { const pillars = [ ["Broker, not bank", "We shop 40+ wholesale lenders. A retail bank sells one product — we pick the best one for you."], ["Non-QM specialists", "Most of our book is borrowers banks skipped. Bank Statement, Asset, DSCR, Foreign National — we do these every week."], ["Transparent pricing", "You see a cost sheet on day one. No last-minute fee creep, no rate-lock games."], ["Veterans on your file", "Loan officers with 10+ years of book. No trainees, no call-center queue."], ]; return (
Why Haven

A boutique shop, built the way you wish banks were.

{pillars.map(([title, body]) => (
{title}
{body}
))}
); } // ---------- CHARITY BAND ---------- function CharityBand() { const [picked, setPicked] = useStateHome(null); const charities = [ { id: "rally", name: "Rally Foundation", sub: "Pediatric cancer research · Atlanta" }, { id: "buddies", name: "Best Buddies", sub: "Friendships, jobs, leadership for IDD" }, { id: "wounded", name: "Wounded Warrior Project", sub: "Post-9/11 injured service members" }, { id: "ozzie", name: "Ozzie Albies Foundation", sub: "Atlanta youth & education" }, ]; return (
Charity at closing

Small ritual, real money, Atlanta-rooted.

At every closing, the borrower picks one of four nonprofits. Haven donates in their name, at no cost to you.

More about the program
{charities.map(c => ( ))}
{picked && (
Selected — we'll donate in your name at closing.
)}
); } // ---------- TESTIMONIALS ---------- function Testimonials() { const quotes = [ { q: "Four banks had already told me no. Haven matched me to an Asset Qualifier in a week. The loan officer knew the program cold.", who: "Marcus A.", meta: "Buckhead · Asset Qualifier · closed Feb 2026", }, { q: "Self-employed for nine years and every retail lender tried to shoehorn me into a conventional. Haven put me on a Bank Statement, closed in 28 days.", who: "Priya R.", meta: "Decatur · Bank Statement · closed Jan 2026", }, { q: "I needed a DSCR on a two-unit with Airbnb income. They accepted AirDNA, vested in my LLC, and didn't flinch.", who: "Jordan T.", meta: "East Atlanta · Investor Cash Flow · closed Dec 2025", }, ]; return (
From borrowers

Three closings, three programs you'll rarely see at a bank.

{quotes.map((q, i) => (
“{q.q}”
{q.who}
{q.meta}
))}
); } // ---------- FINAL CTA ---------- function FinalCTA() { return (
Fifteen minutes
Tell us what you're trying to do. We'll tell you if we can help.
No soft pull at this stage. No script. A veteran broker, on a real call.
Start the call Browse programs
); } Object.assign(window, { Hero, StatsStrip, ProductGrid, ProductCard, ProcessSteps, Pillars, CharityBand, Testimonials, FinalCTA, });