Testimonial stagger

Two large-format client testimonials in equal 50/50 columns with an intentional vertical stagger. Designed for executive dialogue and dual customer case studies, giving both voices prominent weight without forcing them into a rigid horizontal row.

The signature is the descending vertical cadence between two equally weighted 50% columns. The second column is dropped by several lines of reading height (padding-top: clamp(3rem, 6vw, 6.5rem)), so the eye moves naturally from the first statement across and down to the second, avoiding the visual competition of two large adjacent quotes.

This keeps the section distinct from the rest of the catalogue. testimonial-lead-and-rail is an asymmetric 58/42 lead with a stacked secondary rail; testimonial-trio is three bottom-aligned cards with ragged tops; testimonial-metric anchors a quote to a number. This pattern provides a rhythmic pair of equal peers.

• Ruled seam (variations/ruled-seam.html) adds a vertical currentColor hairline down the center seam between the two columns, accentuating the vertical step.

• The typeface. No font family is stated anywhere. Both quotes inherit your theme's typography ladder.
• Your colours. The section uses base for the ground and contrast for text, with universal fallback guarantees.
• The attribution rules. Every hairline is currentColor, matching your text colour.
• Your spacing scale. Padding and block gaps draw on spacing presets.

• Full bleed with a 1240px container. Spans the viewport while keeping reading columns to roughly 560px.
• The vertical offset. Steps the right column down by clamp(3rem, 6vw, 6.5rem).
• The quote ramp. Set at var(--wp--preset--font-size--large, clamp(1.25rem, 1.9vw, 1.6875rem)) with 1.45 line-height for confident reading.
• A portrait on each attribution rule. A 6rem square frame sits beside the name on the hairline under each quote. Because the columns are offset, the two faces land at different heights, so the step the composition is built on is drawn twice: once by the top of the quote and once by the face under it. Neither image states a colour.

1. The two quotes. Replace with two substantial customer or stakeholder quotes (35–55 words each).
2. The attributions. Edit the names, the roles and the two portraits. It is a square crop of a head-and-shoulders photograph, not a centre crop of a full-length one: a waist-up frame squared from the middle loses the crown of the head and reads as a torso at this size.
3. The section eyebrow. "Executive perspectives" can be renamed or deleted.

• Core blocks only: group, columns, column, paragraph, image.
• Every colour is a fallback chain ending in universal presets.
• Text contrast is verified at 4.5:1 on all text pairs.