// Body sections of the RangehandIQ homepage. The hero is 3D (paper + // dark band). Sections that follow live on paper, in the same editorial // register: plain language, italic serif used sparingly for the turn, // mono labels for ledger rows, no decoration that doesn't earn its place. // ───────────────────────────────────────────────────────────────────────── // PROBLEM — Why this exists. // "Your CPA tells you last year's story. The decisions that mattered were // made in May." Four observations, then a pilot quote (placeholder). function ProblemSection() { const PROBLEMS = [ { n: '01', head: 'The Cost Blind Spot', body: "Most operators know their total expenses but can\u2019t tell you what it actually costs to raise each calf. Without that number, every management decision is a guess.", }, { n: '02', head: 'The Bank Meeting', body: "Every fall, ranchers walk in with a tax return and a handshake. A professionally documented financial package — balance sheet, cash flow, key ratios — changes the conversation.", }, { n: '03', head: 'The Succession Gap', body: "The average Intermountain West rancher is in their sixties. Water rights, grazing schedules, vendor relationships, permit history — it lives in one person\u2019s head.", }, { n: '04', head: 'The Federal Land Layer', body: "BLM and Forest Service grazing allotments require specific tracking, documentation, and reporting that no general business tool understands. This is not Iowa row crops.", }, ]; return (
{/* Header row — eyebrow + lead statement */}
The problem

Most ranches don’t have a financial advisor. They have a CPA who shows up in March, a banker who calls in October, and{' '} a spreadsheet that doesn’t know a heifer from a steer.

{/* Four observations */}
{/* gutter for label alignment */}
{PROBLEMS.map((p) => (
{p.n}

{p.head}

{p.body}

))}
{/* Pilot rancher pull-quote — placeholder until we have a real one */}
From a pilot
“If it can’t fit on the back of an envelope, it’s too much. RangehandIQ gives you the envelope — with the math already done.”
Box Elder County Rancher
); } // ───────────────────────────────────────────────────────────────────────── // HOMEPAGE V1 — continuous page composition. // Hero (3D) + Problem stacked, no canvas chrome between them, so we can // see how the type, color and rhythm carry from one section to the next. // ───────────────────────────────────────────────────────────────────────── // FEATURES — "Six Problems. One Place." // 3×2 grid on cream paper. Numbered to rhyme with Problem section. // One item carries the section's editorial pull-quote. function FeaturesSection() { const FEATURES = [ { n: '01', head: 'Lender-Ready Export — One Button.', body: 'Balance sheet, cash-flow statement, key ratios. FFSC-aligned. The same package the big operations hand their banker — generated from the books you already keep.', meta: 'Green · Yellow · Red', }, { n: '02', head: 'Spouse & Bookkeeper Access.', body: 'Role-based, multi-user. The person doing data entry doesn’t need to see the loan covenants. The person reading them doesn’t need to enter a single receipt.', meta: 'Roles · Permissions', }, { n: '03', head: 'Cost-Per-Cow Benchmarking.', body: 'Anonymous comparison against your county and your state. Find out where your operation actually stands — without anyone knowing it’s yours.', meta: 'County · State', }, { n: '04', head: 'Next-Gen Track Record.', body: 'FSA eligibility, loan history, three years of clean books — packaged for the day your son or daughter walks into a lender’s office for the first time.', meta: 'FSA · Inheritance', }, { n: '05', head: 'Feed Inventory & Days-to-Grass.', body: 'Hay on hand, days of feed remaining, turnout date math. The numbers you already track in your head — and check three times a week — finally written down.', meta: 'Inventory · Forecasting', pull: '“I count the hay so many times I’ve worn the strings out.”', pullAttrib: 'Active ag lender and rancher', }, { n: '06', head: 'Succession — On Your Terms.', body: 'Water rights, grazing schedules, vendor relationships, permit history. The records your kids will inherit, documented at your pace — not under duress.', meta: 'Documentation · Inheritance', }, ]; return (
{/* Header */}
What it does

Six problems.{' '} One place.

{/* 3 × 2 grid */}
{/* gutter */}
{FEATURES.map((f) => (
{f.n}{f.meta}

{f.head}

{f.body}

{f.pull && (
{f.pull}
{f.pullAttrib}
)}
))}
); } // ───────────────────────────────────────────────────────────────────────── // PERSONAS — "Six Real People. One Tool." // Stacked rows on paperSoft. Each row: [number + archetype | description]. // Note: "Senior Operator" replaces the live site's "Patriarch." function PersonasSection() { const PERSONAS = [ { n: '01', role: 'The Senior Operator', meta: '60s+ · Owner', body: 'Three generations in. The operation lives in his head and his red book — every gate, every grazing rotation, every handshake. He doesn’t need a new system. He needs his knowledge written down before he hands the reins over.', }, { n: '02', role: 'The Next-Gen Operator', meta: '30s–40s · Heir apparent', body: 'Son or daughter coming home. Wants the records to back up the handshake — three years of clean books before the first solo meeting with the lender. Tech-fluent, but not interested in tools that talk down to his father.', }, { n: '03a', role: 'The Spouse & Bookkeeper', meta: 'Senior household · Does the data entry', body: 'Often the only person who knows where every receipt actually went. Runs the books at the kitchen table after dinner. Needs the math — and a clean role boundary that means she doesn’t have to read the loan covenants she didn’t sign.', }, { n: '03b', role: 'The Next-Gen Spouse', meta: 'Mid-30s · Initiates the decision', body: 'Watching her siblings-in-law build documented equity while her family’s operation lives in a pocket notebook. Has the laptop, the bandwidth, and the patience her husband doesn’t. She finds the tool, sets it up, runs the first lender export — and presents it to him as already working. The first person to read the package when it lands.', }, { n: '04', role: 'The Ag Lender', meta: 'Banker · Annual review', body: 'Reads the package in October. Doesn’t have time to translate handwritten receipts into a balance sheet. A FFSC-aligned export from the operation he\u2019s lending to changes the conversation from "trust me" to "here are the numbers."', }, { n: '05', role: 'The Red Book Operator', meta: 'Pocket notebook · 30+ yr', body: 'Keeps everything in a pocket notebook because that\u2019s what works. Isn\u2019t going to start over and isn\u2019t going to learn QuickBooks. Will accept a tool that respects the way he already works — and produces what the bank, the CPA, and his daughter all need.', }, ]; return (
Who it’s for

Six real people.{' '} One tool.

{/* gutter */}
{PERSONAS.map((p) => (
{p.n}

{p.role}

{p.meta}

{p.body}

))}
); } // ───────────────────────────────────────────────────────────────────────── // COUNTRY BAND — Geographic positioning interstitial. // Wide horizon photo with editorial pull-line + state list. function CountryBand() { const STATES = [ ['UT', 'Utah'], ['ID', 'Idaho'], ['WY', 'Wyoming'], ['MT', 'Montana'], ['NV', 'Nevada'], ['CO', 'Colorado'], ]; return (
Our country

This is Intermountain West ranching —{' '} not Iowa row crops. {' '} The tools should know the difference.

{STATES.map(([abbr, name]) => (
{abbr}
{name}
))}
); } // ───────────────────────────────────────────────────────────────────────── // EARLY ACCESS — Form section. Two-column: editorial left, form right. // Form name is the key Netlify uses to bucket submissions in the dashboard. // Notification recipient (sales_support@rangehandiq.com) is configured in the // Netlify UI under Forms → early-access → Form notifications. There is also // a hidden static
in index.html so Netlify's // build-time crawler can register the form before React renders the real one. const EARLY_ACCESS_FORM_NAME = 'early-access'; function EarlyAccessForm({ inputBase, labelBase }) { const [status, setStatus] = React.useState('idle'); // idle | submitting | success | error const [errorMsg, setErrorMsg] = React.useState(''); const encode = (data) => Object.keys(data) .map((k) => encodeURIComponent(k) + '=' + encodeURIComponent(data[k] ?? '')) .join('&'); const onSubmit = (e) => { e.preventDefault(); if (status === 'submitting') return; const form = e.currentTarget; const fd = new FormData(form); // Honeypot — silent no-op if filled (a bot did it). if (fd.get('bot-field')) { setStatus('success'); return; } const payload = { 'form-name': EARLY_ACCESS_FORM_NAME }; fd.forEach((v, k) => { payload[k] = v; }); setStatus('submitting'); fetch('/', { method: 'POST', headers: { 'Content-Type': 'application/x-www-form-urlencoded' }, body: encode(payload), }) .then((r) => { if (!r.ok) throw new Error('Submission failed (' + r.status + ')'); setStatus('success'); }) .catch((err) => { setErrorMsg(err.message || 'Something went wrong.'); setStatus('error'); }); }; if (status === 'success') { return (
Received

Thank you. We’ll be in touch{' '} within 24–48 hours.

A note from Matt will land in the inbox you provided. No automated drip, no sales sequence — just a real reply.

); } return ( {/* Required by Netlify when posted via fetch (matches the static form in index.html). */} {/* Honeypot — `hidden` attribute keeps the input in the DOM (so HTML-parsing bots see + fill it) but renders display:none for real users. */}