Skip to content

Marketing design system

Organisms

Navigation, forms, heroes, grids and conversion sections.

Complete forms

Preview mode: try validation and success states. These forms do not send leads, email, SMS, or analytics events.

Audit form

We’ll respond within 24 hours. No spam.

Message frequency varies. Message and data rates may apply. Reply STOP to opt out or HELP for help. See our Privacy Policy and SMS Terms.

Contact form

Message frequency varies. Message and data rates may apply. Reply STOP to opt out or HELP for help. See our Privacy Policy and SMS Terms.

Organism

Section layout

Shared layout foundation for marketing sections

White and warm surfaces; responsive spacing and reveal

Source: ui/section.tsx

Organism

Audit form

Homepage and About conversion

Validation, consent, safe preview success

Source: marketing/audit-form.tsx

Organism

Contact form

Contact page

Optional phone, required consent with phone, safe preview success

Source: marketing/contact-form.tsx

Organism

About mission hero

About page

Responsive display, paired actions, reduced motion

Source: about/mission-hero.tsx

Organism

Navigation

Every public page; desktop links and mobile menu

Desktop, mobile closed, mobile open, keyboard focus

Source: marketing/nav.tsx

Organism

Homepage hero

Homepage

Responsive display, normal and reduced motion

Source: marketing/hero.tsx

Organism

Service cards and grid

Homepage; six service identities

Rest, hover, focus, narrow grid

Source: marketing/services.tsx + service-card.tsx

Organism

Feature selector and panel

Homepage

Seven selections; mobile pills and desktop sidebar

Source: marketing/platform.tsx

Organism

Pricing cards and tier actions

Homepage and pricing page

Platform, Growth, Scale; hover and focus

Source: marketing/pricing.tsx

Organism

Industry cards and grid

Homepage; twelve trade identities

Rest, hover, focus, responsive grid

Source: marketing/industries.tsx + industry-card.tsx

Organism

Audit conversion section

Homepage #get-started

Required fields, consent, validation, preview success

Source: marketing/contact.tsx + audit-form.tsx

Organism

Footer

Every public page

Responsive columns, legal and contact links

Source: marketing/footer.tsx

Organism

Service hero

All six service pages

Category colors, paired actions, reduced motion

Source: services/service-hero.tsx

Organism

Pain-point rows

Service pages

Long content, icon and text alignment

Source: services/pain-points.tsx

Organism

Solution cards

Service pages

Step labels, icons, responsive cards

Source: services/solution.tsx

Organism

Feature grid

Service pages

Divided surface, responsive rows, long descriptions

Source: services/feature-grid.tsx

Organism

Plan availability

Service pages

Included and not included, three plan identities

Source: services/pricing-tie-in.tsx

Organism

FAQ

Service pages

Static questions and full answers

Source: services/service-faq.tsx

Organism

Closing call to action

Service pages

Large action and supporting assurances

Source: services/service-cta.tsx

Organism

Article cards and category filters

Blog index

All, GEO, SEO, Ads; selected state and result count

Source: blog/blog-list.tsx + category-pill.tsx

Organism

Cookie consent

Public marketing layout

Preview banner; actions dismiss without saving consent

Source: cookie-consent.tsx