Hero A — two circles, held in the logo's own relationship

The hero from home-A-v1.html, unchanged in copy and type. Two circles only, positioned in the same relationship they have inside the logo — the slate ring low and to the left of the gold — and cut by the right edge of the hero band. Three scales.

The relationship is derived from the mark, not eyeballed. In the client's logo the gold outer ring is radius 191 with an 18px stroke, and the slate ring is radius 118 with a 32px stroke, offset (−28, +40) from it. Expressed as ratios of the gold radius that is: slate radius 0.618, gold stroke 0.094, slate stroke 0.168, offset (−0.147, +0.209). Every scale below is computed from those numbers, so the pair holds its proportions instead of drifting as it grows.

The gold circle's centre sits precisely on the band edge, so it is cut exactly in half at any viewport width; the slate follows it inward. The artwork is one SVG spanning the band with preserveAspectRatio="xMaxYMid slice", which pins the crop rather than letting it drift into the text on a wide monitor.

Both colours are the mark's own: gold #D59F0F fading to white, slate flat #3D5867. Neither is a flat approximation of the other.

It is decoration, not the mark, so it carries aria-hidden. The real logo appears once, correctly, in the header, from the client's own file.