Color contrast should ignore overlapping elements that have transparent background

Take the following example:

```html

.overlap {
position: absolute;
top: 0;
left: 0;
width: 100px;
height: 100px;
}

Hello World

This causes an incomplete result for color contrast because the `.overlap` element is on top of the `` element in the DOM stack. However since the `.overlap` element has a transparent background it should just be ignored.

This same problem happens with [Material Button components](https://material.io/components/buttons) due to the ripple effect element that overlaps the button text.

```html

Button

```

Start by reproducing the provided HTML examples, including the Material Button markup, with axe-core's color-contrast check. Trace how overlapping elements are handled and verify that transparent overlays no longer make the result incomplete while opaque overlaps still affect it.

Written by the indexing model from the issue text.