// Afford-X · ALM agent — unique brand mark, state machine, floating chat. const { useState, useRef, useEffect, useCallback, createContext, useContext } = React; /* ============================================================ The ALM mark — an Afford-X spark. A 4-point star rotated to read as the brand "X", with a green gradient core and an orbiting micro-spark (red accent nod to the Afford-X "X"). Distinct from any third-party logo. ============================================================ */ const STAR = 'M12 1.6C12.7 6.9 17.1 11.3 22.4 12C17.1 12.7 12.7 17.1 12 22.4C11.3 17.1 6.9 12.7 1.6 12C6.9 11.3 11.3 6.9 12 1.6Z'; function AlmMark({ size = 26, state = 'idle', tone = 'green', id = 'm' }) { const gid = `almg-${id}`; const core = tone === 'white' ? '#fff' : `url(#${gid})`; const sat = tone === 'white' ? 'rgba(255,255,255,0.9)' : 'var(--afx-red-bright)'; return ( ); } /* ============================================================ Agent state machine (shared via context) phase: idle | engaged | listening | thinking | answering ============================================================ */ const GREETING = "Hi — I'm ALM, the Affordability Language Model behind Afford-X. Ask me anything about exclusion filters, segments, or how we make intent better."; const SUGGESTIONS = [ 'What is the Exclusion Filter?', 'How does ALM score affordability?', 'Which industries do you serve?', ]; const SYS_PROMPT = `You are ALM, the Affordability Language Model — the AI agent that powers Afford-X, a martech platform. Afford-X scores audiences on real purchasing power (not just intent) and offers a first-in-market one-click exclusion filter that removes window-shoppers before a campaign launches. Key facts you can draw on: nearly 1 billion U.S. MAIDs and HEMs across 100+ data segments (income, credit, purchase behavior, intent); a Dollar Scoring Framework; GDPR/CCPA/LGPD compliant, consented/pseudonymized signals; verticals served include auto, luxury, financial services and e-commerce; tagline "We Make Intent Better." Voice: confident, modern, benefit-led B2B. Speak to the visitor as "you", refer to Afford-X as "we". Keep replies under 70 words, no emoji, no markdown headers. Be concrete and helpful.`; const AgentCtx = createContext(null); const useAgent = () => useContext(AgentCtx); const sleep = (ms) => new Promise((r) => setTimeout(r, ms)); function AgentProvider({ children }) { const [open, setOpen] = useState(false); const [phase, setPhase] = useState('idle'); const [messages, setMessages] = useState([{ role: 'assistant', content: GREETING }]); const [draft, setDraft] = useState(''); const busyRef = useRef(false); const openWidget = useCallback(() => { setOpen(true); setPhase((p) => (p === 'idle' ? 'engaged' : p)); }, []); const closeWidget = useCallback(() => { setOpen(false); if (!busyRef.current) setPhase('idle'); }, []); // listening reacts to visitor typing const onDraft = useCallback((v) => { setDraft(v); if (busyRef.current) return; setPhase(v.trim() ? 'listening' : 'engaged'); }, []); const ask = useCallback(async (qRaw) => { const q = (qRaw == null ? draft : qRaw).trim(); if (!q || busyRef.current) return; busyRef.current = true; setDraft(''); setMessages((m) => [...m, { role: 'user', content: q }]); setPhase('thinking'); // build short conversation context const history = messages.filter((m) => m.role === 'user' || m.role === 'assistant').slice(-6) .map((m) => `${m.role === 'user' ? 'Visitor' : 'ALM'}: ${m.content}`).join('\n'); const prompt = `${SYS_PROMPT}\n\n${history ? 'Conversation so far:\n' + history + '\n\n' : ''}Visitor: ${q}\nALM:`; let reply = ''; try { if (window.claude && window.claude.complete) { reply = await window.claude.complete(prompt); } else { throw new Error('no-api'); } } catch (e) { reply = "We narrow your intent audience down to people with real purchasing power — our one-click Exclusion Filter removes window-shoppers before launch, so every ad dollar works harder. (Live answers activate when this page is shared.)"; await sleep(900); } reply = (reply || '').trim(); // stream the reply word-by-word for the "answering" state setPhase('answering'); setMessages((m) => [...m, { role: 'assistant', content: '' }]); const parts = reply.split(/(\s+)/); let acc = ''; for (const w of parts) { acc += w; setMessages((m) => { const c = m.slice(); c[c.length - 1] = { role: 'assistant', content: acc }; return c; }); await sleep(24); } busyRef.current = false; setPhase(open ? 'engaged' : 'idle'); }, [draft, messages, open]); const value = { open, phase, messages, draft, openWidget, closeWidget, onDraft, ask, busy: () => busyRef.current }; return {children}; } /* ============================================================ Header indicator — "Ask ALM" pill that reflects live state ============================================================ */ const LABELS = { idle: 'Ask ALM', engaged: 'ALM is here', listening: 'Listening…', thinking: 'Thinking…', answering: 'Answering…', }; const DOT_COLOR = { idle: 'var(--afx-gray-400)', engaged: 'var(--afx-green-500)', listening: 'var(--afx-green-500)', thinking: 'var(--afx-yellow)', answering: 'var(--afx-green-500)', }; function HeaderAgent() { const { phase, open, openWidget, closeWidget } = useAgent(); const active = phase !== 'idle'; return ( ); } /* ============================================================ Floating widget — bottom-right bubble + chat panel ============================================================ */ function Bubble() { const { open, phase, openWidget } = useAgent(); if (open) return null; const busy = phase === 'thinking' || phase === 'answering'; return ( ); } function SubLine({ phase }) { if (phase === 'thinking') return ( Thinking ); if (phase === 'answering') return Answering…; if (phase === 'listening') return Listening…; return Online · replies in seconds; } function Panel() { const { open, phase, messages, draft, closeWidget, onDraft, ask, busy } = useAgent(); const scrollRef = useRef(null); const inputRef = useRef(null); useEffect(() => { if (scrollRef.current) scrollRef.current.scrollTop = scrollRef.current.scrollHeight; }, [messages, phase, open]); useEffect(() => { if (open && inputRef.current) inputRef.current.focus(); }, [open]); if (!open) return null; const isBusy = busy(); return (
{/* header */}
ALM
{/* messages */}
{messages.map((m, i) => (
{m.content || '\u200b'}
))} {phase === 'thinking' && (
)} {messages.length <= 1 && (
{SUGGESTIONS.map((s) => ( ))}
)}
{/* input */}
{ e.preventDefault(); ask(); }} style={{ display: 'flex', alignItems: 'center', gap: 8, padding: 12, borderTop: '1px solid var(--afx-gray-200)', background: '#fff' }}> onDraft(e.target.value)} placeholder={isBusy ? 'ALM is responding…' : 'Ask about Afford-X…'} disabled={isBusy} style={{ flex: 1, height: 42, padding: '0 14px', borderRadius: 999, fontSize: 14, fontFamily: 'var(--font-body)', border: '1.5px solid var(--afx-gray-200)', outline: 'none', color: 'var(--afx-ink)', background: 'var(--afx-gray-50)', }} onFocus={(e) => (e.target.style.borderColor = 'var(--afx-green-500)')} onBlur={(e) => (e.target.style.borderColor = 'var(--afx-gray-200)')} />
); } function AgentWidget() { return <>; } Object.assign(window, { AgentProvider, useAgent, HeaderAgent, AgentWidget, AlmMark }); // Afford-X · shared site chrome for blog pages (header + footer). const { Button } = window.AffordXDesignSystem_998110; const { HeaderAgent } = window; const CHROME_A = 'assets/'; // resolve assets via the inliner's __resources when bundled offline, else fall back to the file path const CHROME_RES = (id, path) => (window.__resources && window.__resources[id]) || path; const SITE_NAV = [ { label: 'Product Highlights', href: '/' }, { label: 'How Afford-X Works', href: '/' }, { label: 'Blog', href: '/blog' }, { label: 'Pricing', href: '/pricing' }, ]; function SiteHeader({ current }) { return (
Afford-X
); } function SiteFooter() { return (
Afford-X
{['Product Highlights', 'How Afford-X Works', 'Terms & Conditions', 'Privacy Policy'].map((l) => {l})}
Find us on LinkedIn
); } function CtaBand() { return (

Affordability Makes Intent Better

Your efficiency accelerator — because real buyers drive real results.

); } // shared category tones + avatar const CAT_TONE = { Perspective: 'neutral', Product: 'green', 'Data Science': 'slate', Industry: 'yellow', Privacy: 'red' }; function Avatar({ name, size = 38 }) { const initials = name.split(' ').map((p) => p[0]).slice(0, 2).join(''); return ( {initials} ); } Object.assign(window, { SiteHeader, SiteFooter, CtaBand, CAT_TONE, Avatar }); // Afford-X · blog article (content) page. const { Badge, Button } = window.AffordXDesignSystem_998110; const { AgentProvider, AgentWidget, SiteHeader, SiteFooter, CtaBand, CAT_TONE, Avatar, useAgent } = window; const POSTS = window.AFX_POSTS; const POST = POSTS.find((p) => p.slug === 'intent-isnt-enough'); const BLOG = '/blog'; function ArticleHero() { return (
← Back to the Journal
{POST.cat}

{POST.title}

Most campaigns still target the people most likely to be interested. The ones that win target the people most likely to buy.

{POST.author}
{POST.role} · {POST.date} · {POST.read}
); } function StatCallout() { const stats = [['~1B', 'U.S. MAIDs & HEMs scored'], ['100+', 'behavioral & financial segments'], ['1 click', 'to exclude window-shoppers']]; return (
{stats.map(([n, l]) => (
{n}
{l}
))}
); } function PullQuote({ children }) { return (

{children}

); } function AskAlmInline() { const agent = useAgent(); return (
Curious how this applies to your campaign?
Ask ALM — it can size the affordability lift for your audience.
); } function ArticleBody() { return (

For a decade, intent has been the gold standard of audience targeting. Someone searches for a mid-size SUV, reads three reviews, and lands in an in-market segment. The logic feels airtight: interest predicts action. But anyone who has watched a high-intent campaign underdeliver knows the uncomfortable truth — interest and ability are not the same thing.

A shopper can want a $58,000 vehicle and have no realistic path to financing it. Multiply that across an audience and a meaningful slice of every "high-intent" buy is spent reaching people who were never going to convert. Intent platforms can't see this, because the signal they're built on stops at curiosity.

The window-shopper problem

Window-shoppers don't look any different from buyers in an intent model. They click, they compare, they linger — they generate exactly the behavioral signals intent targeting rewards. The result is an audience that looks strong on paper and dilutes the moment budget meets reality.

  • Impressions are spent on people who can browse but not buy.
  • Conversion rates sag, so CPA climbs even when intent looks healthy.
  • Optimization algorithms chase the wrong signal and reinforce it.
"Intent tells you who is looking. Affordability tells you who can act. The gap between the two is where ad budgets quietly leak."

Adding the missing layer

The fix isn't to throw out intent — it's to add the layer intent was always missing. The Affordability Language Model (ALM) scores each user on real purchasing power by combining privacy-compliant financial signals with behavioral and purchase-history data through our Dollar Scoring Framework.

From there, the first-in-market Exclusion Filter does the obvious thing intent platforms can't: it removes the people who can't realistically convert before the campaign launches. One click narrows an intent audience down to the share with genuine ability to buy.

What changes when you target ability

When affordability sits alongside intent, the same media budget reaches a denser, more convertible audience. Sharper targeting raises efficiency, segments get simpler, and optimization finally chases a signal that maps to revenue instead of curiosity.

Intent isn't wrong. It's just incomplete. Pair it with affordability and you stop paying to reach people who were only ever browsing — and start spending where real buyers are.

); } function AuthorBio() { return (
{POST.author}
{POST.role}, Afford-X

Maya leads product at Afford-X, where she's focused on turning affordability signals into one-click decisions for advertisers.

); } function Related() { const items = POSTS.filter((p) => p.slug !== POST.slug).slice(0, 3); return (

Keep reading

{items.map((p) => (
{p.cat}

{p.title}

{p.date} · {p.read}
 ))}
); } function ArticlePage() { return (
); } Object.assign(window, { ArticlePage }); // auto-render document.body.innerHTML = '
'; ReactDOM.createRoot(document.getElementById('afx-root')).render();