Unexpected Opacity Behavior - background images

Need help
1

I have a landing page which I want to have the following layers (from bottom to top):
Index - Blue
Background Image - B/W Graphic
Text - Pink (for example)

In order to “tint” the B/W Graphic to a blue color, I would like to adjust the opacity of the Background Image set to the Index as 70%.

Unfortunately, the Pink Text also becomes 70% transparent. I don’t think the text should inherit the group’s transparency setting for the background image, or am I wrong?

What is the correct way to set this up so that ONLY the Background Image BEHIND the text is 70% transparent on top of the (solid) Blue Index Background.

2

If you change the opacity every child will be applied to all its children, you would make the parent group type “align to parent” and add an image element (or group) to apply the opacity only on it

3

Could you clarify please?

4

Provide screenshots or details for the related elements in your editor