Cover lap

The obvious structure, cover then a sibling plate pulled up over it, paints nothing: a cover's veil and photograph are positioned children with a z-index, the cover itself forms no stacking context, so a later sibling's background paints UNDER them, invisibly, with every gate green (wordpress-mechanics.md §10). So the paper band is a full-width group INSIDE the cover's inner container, which core gives z-index: 1, and the cover's minHeight (20rem) is only a floor: the band's margin-top is what gives the photograph its height.

The first draft of this pattern also used a custom contentPosition, which shrink-wraps the inner container, so the band stopped short of the right edge and the photograph showed beside it; and its plate was paper on paper, so the lap was invisible. Both passed every gate. The render caught them.

Every word is on the plate, a contrast ground under base type, measured as an ordinary pair: 21:1 in every check theme. The photograph carries a 20% veil and nothing else. The cover states its own text colour so core's :where() rule that paints cover text #fff never applies.

The photograph: the cover ships EMPTY and is valid at 6.6 and 7.0. Then the headline, which wants to stay on two lines at 390.

• Paper lap: the plate is a sheet of base with a one-pixel hairline in currentColor, so its edge survives on the half where the band is the same colour; the button is ink on paper.
• In motion: backgroundType: "video"; a clip instead of a still. The cover ships empty here too; choose a short, silent, looping clip, and core writes autoplay muted loop playsinline.

A full-bleed cover on its own fills the storefront's stage edge to edge, and on a buyer's page it is never alone either. So the pattern ships with what comes next: a short row on your theme's paper under the cover, a tracked label and one paragraph at a 34rem measure. It is ordinary page copy, it shows where the cover ENDS, and it is the first thing a buyer rewrites or deletes. It carries the same chains as everything else.

Two knobs on the product page, set before copying and applied to the copied markup and the live frame alike (src/constants/finish.js):

• Corners: border-radius on the plate, sharp, soft (8px) or round (20px).
• Plate: solid, or glass, the plate's own chain at 88% over transparent through color-mix(). The colour still inherits; only the alpha is trim. Measured 2026-08-21 with the contrast walk compositing the layer over every ground beneath it, the paper band and both photograph bounds: ink glass 13.1:1 at worst in Twenty Twenty-Five, paper glass 13.6:1 over the black bound. color-mix() needs a 2023 browser; on an older one the declaration is dropped and the plate paints nothing, which is why the authored state is solid and glass is the buyer's choice.