---
version: alpha
name: Pitch — Translucent Violet FAQ Rows
colors:
  ink: '#C6A5FF'
  sample-1: '#000000'
  sample-2: '#280F62'
  sample-3: '#FFFFFF'
typography:
  heading:
    fontFamily: '"Mark Pro Bold", "Mark Pro Bold Placeholder", sans-serif'
    fontSize: 48px
    fontWeight: 700
    lineHeight: 57.6px
  body:
    fontFamily: '"Space Mono", "Space Mono Placeholder", monospace'
    fontSize: 18px
    fontWeight: 400
    lineHeight: 28.8px
---

## Overview
An isolated Pitch FAQ section with lavender heading, translucent rounded violet rows, bold centered questions and circular white plus controls. Inspected on 2026-10-03 at 1440px desktop and 390px mobile. The screenshot isolates `#faqs`; bounds were measured after a warm-up render and checked again after capture.

## Colors
Opaque token values come from computed CSS samples in this reference. The sampled-canvas token, when present, is a screenshot pixel sample. Gradients, alpha fills, photography and artwork are described visually rather than reduced to a single invented color.

## Typography
The computed heading sample (Not just another slide tool) uses "Mark Pro Bold", "Mark Pro Bold Placeholder", sans-serif, 48px, weight 700, leading 57.6px. Supporting text uses "Space Mono", "Space Mono Placeholder", monospace at 18px / 28.8px. The matching mobile heading-category sample is 32px / 38.4px. These are local computed samples, not a complete universal type scale. Use properly licensed fonts or appropriate fallbacks.

## Layout
The desktop layout centers a narrow stack of four questions below a section label and heading, leaving broad side margins. At 390px rows nearly fill the width with small gutters, longer questions wrap over more lines and the vertical rhythm expands. Both complete element crops exclude fixed site navigation. Desktop image: 1440 × 865 px. Mobile viewport: 390 × 844 px; isolated mobile components may be taller than the viewport. Two measured widths do not establish exact CSS breakpoints.

## Elevation & Depth
Translucent light-violet row fills and fine pale outlines sit on a dark violet canvas. No heavy floating shadows are needed to separate the rows.

## Shapes
Large rounded row corners and white circular plus controls contrast with centered bold question text. The lavender heading introduces the section without another container.

## Components
Four questions concerning free use, presentation services, trials and imports. All rows are captured closed. Answer expansion, keyboard controls and focus states were not exercised; hidden DOM answer text is not visual evidence of an open state.

## Do’s and Don’ts
Keep plus controls aligned when questions wrap and preserve comfortable touch targets. Do not claim accordion accessibility or expanded-state design from a closed-state screenshot. Provide useful labels, visible focus and reduced-motion alternatives when adapting; these are recommendations rather than a source accessibility audit.