Lead Qualification Form for Existing Landing Pages

You are improving an existing product surface for this audience: Founders, marketers, growth teams, and designers improving lead capture on existing product or service pages.
Do not redesign the whole product. Add or refine only the form, survey, widget, or intake flow described here, and preserve the current brand, layout system, components, typography, color tokens, spacing scale, icon style, and content voice unless a change is required for usability or accessibility.

Goal:
Improve an existing lead form on a landing page, pricing page, webinar page, demo page, or gated resource so it captures qualified leads without asking for unnecessary information upfront.

Existing context to inspect first:
- Identify the current primary task, where the user has just come from, and what they still need to do after this form or feedback moment.
- Reuse existing form controls, buttons, field validation patterns, banners, sheets, dialogs, toasts, loading indicators, and analytics/event naming where available.
- Keep the visual treatment subordinate to the task. The enhancement should feel native to the current app or site, not like a pasted-in third-party widget.

Layout and content hierarchy:
- Place the form at an existing high-intent point such as after product proof, pricing interest, resource value, or demo CTA, not as a disconnected popup.
- Start with essential fields only: work email, name if needed, company or team size if it changes routing, and one primary goal or use-case selector.
- Use optional progressive fields after submit or in a second lightweight step for timeline, role, budget range, or integration needs.
- Pair the form with concise reassurance: what happens next, expected response time, privacy note, and why each non-obvious field is asked.

Interaction behavior and states:
- Support autofill and saved values without hiding labels or making users guess field formats.
- Validate inline after the user leaves a field or submits; do not block typing with aggressive validation.
- After the first submit, show a success state with calendar/resource/next-step options before asking for optional enrichment.
- Track form starts, field-level errors, abandon, submit, source, and qualified routing outcome.
- Include these states with explicit UI copy and behavior: empty, partially complete, field validating, invalid email, submitting, success, optional enrichment, already submitted, network retry.

Mobile and responsive behavior:
- Use a single-column mobile layout with input types and autocomplete values that match expected data.
- Keep the CTA sticky only if it does not cover fields, helper text, consent copy, or error messages.
- Move supporting proof above or below the form based on the existing page hierarchy; do not sandwich the mobile form between competing CTAs.

Accessibility requirements:
- Use programmatically associated labels, visible required/optional status, and clear examples for fields with specific formats.
- Validation errors must appear in text next to fields and in a summary for multi-field forms.
- Inputs must support keyboard, screen reader, zoom, and mobile autofill behavior.
- Consent and privacy links must be reachable and understandable before submission.

Implementation constraints:
- Use the existing CRM, marketing automation, or analytics event names when known; otherwise define neutral event names for start, submit, abandon, and qualified lead.
- Separate required qualification fields from nice-to-have sales context and justify every required field.
- Include hidden campaign/source fields only when already available in the page context.
- Avoid dark patterns such as prechecked consent, disguised newsletter opt-ins, or making phone number required for low-intent offers.

Quality checklist before finalizing:
- Every required field has a clear qualification purpose.
- The form preserves the existing page offer and brand system.
- The success state explains the next step instead of ending with a vague thank you.
- Analytics distinguish form views, starts, validation issues, and successful submissions.
- Mobile completion can happen without horizontal scrolling or hidden labels.

Output format:
- Return the proposed UI as an implementation-ready brief or code update appropriate to the existing project.
- Include component structure, field labels, validation copy, success/error copy, analytics events, responsive behavior, and handoff notes.
- Do not use placeholder text, fake image boxes, a new design system, a new framework requirement, or broad phrases like "make it modern".