Gentrust AI
Talk With an Engineer
Book a Discovery Call

Phase 3.2 component system

Reusable building blocks for a calm engineering consultancy website.

A production-ready component foundation that extends Phase 3.1 while keeping content assembly for the next phase.

Review Components Inspect Interactions
Foundation Consistent by design
01

Warm surfaces, graphite text, forest accent.

02

Borders, spacing, and restrained motion before decoration.

03

Components designed for diagrams, guidance, and trust.

Buttons

Four action styles with complete interaction states.

Button variants share one rhythm, one radius, and subtle state changes for hover, focus, active, disabled, and loading.

Primary Secondary Ghost Text Link

Cards

A unified card family for services, methods, products, insights, and features.

Each variant uses the same border, radius, padding scale, and hover behavior while adapting its internal hierarchy to its job.

View Comparison

Service

Outcome-led service card

Designed for business problem framing before technical detail.

Explore service
01

Method

Process step card

Supports structured methodology sections with a clear sequence marker.

Product

Product proof card

Prepared for screenshots, architecture notes, and capability evidence.

Insight

Readable editorial preview

Built for articles that educate visitors before a sales conversation.

Guide 6 min read

Feature

Capability highlight

Compact enough for technical standards, workflows, and trust builders.

Timeline

A reusable process component for How We Work.

Vertical on desktop, horizontal on mobile, with a restrained reveal when it enters the viewport.

Review FAQ

  1. Discover

    Initial conversation

    Clarify context, goals, constraints, and whether there is a meaningful fit.

  2. Understand

    Business mapping

    Study operations before recommending a system, tool, or build path.

  3. Engineer

    System delivery

    Build practical software with maintainability, integration, and adoption in mind.

  4. Improve

    Long-term progress

    Measure outcomes and refine the system as the business changes.

Comparison

An elegant two-column contrast without a marketing table.

Built for explaining philosophical differences with calm structure and balanced visual weight.

Typical Agency

Technology first

  • Starts with requested features.
  • Measures progress by delivery volume.
  • Hands off after launch.

Gentrust AI

Business first

  • Starts with operational understanding.
  • Measures progress by business outcomes.
  • Builds for long-term improvement.

FAQ

Accessible accordion for common decision questions.

Minimal motion, keyboard-friendly controls, and semantic buttons keep the component quiet and usable.

No. The component is ready for answers that recommend the right solution, even when that solution is simpler than AI.

Yes. The visual pattern supports clear answers about integration, process, and technical risk without overwhelming the page.

The accordion accommodates practical guidance and expectation-setting for visitors who need clarity before committing to a project.

CTA module

Ready for the closing conversation point.

This remains a reusable call-to-action component for the next assembly phase.

Start a Conversation