refactor(landing): replace identical-card grids in how-it-works and open-source

[fancyboi999]

Closes #1939.

Replaces the equal-weight card grids in how-it-works and open-source with non-grid layouts. Full motivation and the four "before" shots are in the issue; this PR has the implementation and the "after" shots side-by-side.

How It Works

Desktop — 4 large serif numerals with a horizontal rule (arrow on 1–3, dot on 4):

Before	After

Mobile — vertical timeline with a continuous left rail and white/80 numerals (was white/28):

Before	After

Open Source

Two-column narrative list. The first item ("Self-host anywhere") gets a serif headline — the most concrete differentiator earns more visual weight than the abstract ones. divide-y for separation, no card borders:

Before	After

Mobile stacks heading above description per item:

Before	After

What I did NOT change

• i18n schema, keys, copy — every existing translation entry still resolves.
• Section IDs (#how-it-works, #open-source) — anchor links still work.
• Shared components, tokens, color values, font config.
• Any other landing files or shared packages.

Files touched: 2.

Validation

pnpm --filter @multica/web typecheck  → pass
pnpm --filter @multica/web test       → 20/20 pass
pnpm exec eslint  apps/web/features/landing/components/how-it-works-section.tsx \
                  apps/web/features/landing/components/open-source-section.tsx
                                       → clean

pnpm --filter @multica/web lint over the whole package reports 7 pre-existing errors in apps/web/app/not-found.tsx (@next/next/no-html-link-for-pages); they're untouched by this change.

Manually verified at 1440px and 390px against localhost:3000 with locale forced to en. Screenshots above are from those runs.

Trade-offs

• The horizontal connecting rule on desktop only renders inside each step's column; it visually suggests a connection without me committing to literal cross-column lines (which break ungracefully on narrow viewports). If reviewers want a continuous line across all 4 columns, that's a follow-up — happy to switch the geometry, but it adds a layout dependency I wanted to avoid in the first cut.
• The serif emphasis on "Self-host anywhere" assumes that item stays at index 0. Today both the i18n source and the rendered order make that a safe assumption. If the order ever changes, the emphasis follows position, not item identity. Open to making this explicit (e.g. flagging "primary highlight" in the dict) if you'd prefer.

[vercel]

@fancyboi999 is attempting to deploy a commit to the IndexLabs Team on Vercel.

A member of the Team first needs to authorize it.

[fancyboi999]

Pushed 968ccab — revisited the typography on Open Source.

The previous version used Instrument Serif for the first highlight ("Self-host anywhere") and Inter for the rest. The intent was hierarchy via typeface contrast, but the practical effect was that item 0 read as visually disconnected from items 1–3, raising the legitimate question "is this a bug or intentional".

Switched to a single typeface (Inter) with size contrast instead:

• Item 0 — text-[22px] sm:text-[24px] font-semibold
• Items 1–3 — text-[17px] sm:text-[18px] font-semibold

Ratio is ~1.33. Hierarchy is preserved, single-typeface consistency is restored, and the "different font means different category" ambiguity is gone.

Updated screenshot in the PR description references the new asset commit on the assets/landing-redesign branch.

Before this commit	After this commit

The first link is pinned to the previous asset commit; the second tracks the branch tip.