ui: reorder product switcher dropdown with divider before Fern CLI/Dashboard

[kgowru]

Summary

Reorders the product switcher dropdown on buildwithfern.com/learn so the
primary products (Home, SDKs, Docs, CLI Generator) appear first, followed
by a divider, then secondary products (Fern CLI, Dashboard). The specs
column (OpenAPI, AsyncAPI, OpenRPC, gRPC) on the right is unchanged.

Layout

Desktop (≥1024px) grid:

Row 1:   Home              | SDKs             | OpenAPI
Row 2:   Docs              | CLI Generator    | AsyncAPI
        ───── divider ─────                   | OpenRPC
Row 3:   Fern CLI          | Dashboard        | gRPC

Mobile / tablet (<1024px) stacks vertically in the same order with a
thin rule above Fern CLI to mirror the divider.

Changes

• fern/docs.yml: reorder the products list to: Home → SDKs → Docs →
  CLI Generator → Fern CLI → Dashboard (specs entries unchanged).
• fern/assets/styles.css:
  • Update the desktop grid placement so Docs+CLI Generator occupy row 2
    and Fern CLI+Dashboard occupy row 3.
  • Add a ::after pseudo-element on .fern-product-selector-radio-group
    that draws a 1px divider in the gap between row 2 and row 3,
    spanning columns 1 and 2 only.
  • Add a border-top divider above Fern CLI for stacked layouts.

Review & Testing Checklist for Human

• Open the Vercel preview, click the "Docs" product switcher in the
  header on a desktop viewport, and verify the order matches the
  layout above with the divider visible between row 2 and row 3.
• Confirm the specs column on the right (OpenAPI, AsyncAPI, OpenRPC,
  gRPC) looks visually identical to today.
• Resize the viewport below ~1024px (or open on mobile) and verify
  the stacked dropdown still shows a divider above Fern CLI.
• Toggle to dark mode and check the divider color still reads as a
  subtle hairline (uses --grayscale-5).

Notes

The divider is drawn purely in CSS — no schema or component changes are
required. The math for the desktop divider position is keyed to the
existing height: 248px, padding: 1.25rem, and gap: 1.5rem on the
radio group; if those values change the divider position may need to be
retuned.

Link to Devin session: https://app.devin.ai/sessions/8b89134331b8478fa7ab28ecd2091911
Requested by: @kgowru

[devin-ai-integration]

🤖 Devin AI Engineer

I'll be helping with this pull request! Here's what you should know:

✅ I will automatically:

• Address comments on this PR. Add '(aside)' to your comment to have me ignore it.
• Look at CI failures and help fix them

Note: I can only respond to comments from users who have write access to this repository.

⚙️ Control Options:

• Disable automatic comment and CI monitoring

[github-actions]

🌿 Preview your docs: https://fern-preview-devin-1778689868-product-switcher-reorder.docs.buildwithfern.com/learn

[devin-ai-integration]

Test results — all passed

Tested the new product switcher dropdown on the Vercel preview (open) by clicking the header product switcher and visually verifying the grid layout.

• Row 1: Home | SDKs
• Row 2: Docs | CLI Generator
• Divider visible between row 2 and row 3, spans cols 1–2 only (does not bleed into specs column)
• Row 3: Fern CLI | Dashboard
• Specs column unchanged on the right: OpenAPI → AsyncAPI → OpenRPC → gRPC
• Close + reopen renders identical layout, no flicker

Evidence (open)

Full dropdown

Left/middle columns zoomed — order + divider

Right column zoomed — specs unchanged

Devin session