Alfred — Three-Path Download and Upgrade CTA

---
version: alpha
name: Alfred — Three-Path Download and Upgrade CTA
colors:
  primary: '#5C1F87'
  purple: '#5C1F87'
  teal: '#2E8796'
  canvas: '#FFFFFF'
  body-ink: '#757575'
  heading-ink: '#5A5A5A'
  sample-heading: '#5A5A5A'
  sample-supporting: '#757575'
typography:
  heading:
    fontFamily: Bitter, serif
    fontSize: 28.8px
    fontWeight: 400
    lineHeight: 40.32px
  supporting:
    fontFamily: Bitter, serif
    fontSize: 16px
    fontWeight: 400
    lineHeight: 25.6px
---

## Overview
A patterned closing section with three white cards for the free Mac app, Powerpack and iOS remote, using one purple and two teal conversion buttons. Inspected on 2026-10-05. The exact isolated element is `#download`; a warm full-page render preceded measurement and a fresh image was cropped to its current document bounds.

## Colors
Use the observed palette tokens for the corresponding text and surfaces; photographs, artwork and gradients are not reduced to invented solid-color tokens. Purple marks product identity and teal marks paid actions; white and restrained gray carry the longer explanatory content.

## Typography
The listed font families and sizes are measured CSS samples. The selected heading sample is Bitter, serif at 28.8px, weight 400, line-height 40.32px. A supporting paragraph sample uses 16px with 25.6px leading. These local samples are not a universal type scale. Child spans or image artwork can paint differently from inherited container styles.

## Layout
A centered introduction sits over three equal desktop cards. The section uses 40px vertical padding and is approximately 625px high. At 390px the cards stack in the same reading order and the full component grows to roughly 1249px. Version, compatibility and legacy-version links remain beneath the cards. Primary image dimensions are 1440 × 625px at a 1440px viewport. The mobile evidence is 390 × 1250px at a 390px viewport. These two widths do not identify exact breakpoint thresholds.

## Elevation & Depth
White cards separate offers from the pale decorative background. Depth is subtle; strong button fills matter more than shadows.

## Shapes
Softly rounded white rectangles, italic explanatory lines and 4px action-button corners balance the serif headings.

## Components
Free Alfred download, paid Powerpack and Alfred Remote actions, followed by version requirements, notarization, terms and an older-version link. No download or transaction was initiated.

## Do’s and Don’ts
Keep each destination explicit and preserve compatibility information near the actions. Do not imply all three products are free or replace the distinct download and purchase labels with identical generic buttons. Provide visible focus states, meaningful alternative text and usable touch targets when adapting; no complete accessibility audit was performed.