Problems with the implementation

I’m trying to do something like that here:

To have a header area that has a hero content and a navigation that are aligned to the top of the browser window and take up the full width of the browser window. The header area has a fixed size (e.g. 750 pixels, 100 vh, etc.). You should be able to insert an image or a video or a carousel into this header area. The image and the video should be centered and scaled (objet-fit: cover, or similar).

I would like to be able to create the following header types:

I just can’t get it to work. The goal would be for me to rearrange as little HTML structure as possible for each of these variations. Does anyone have the time and inclination to help me? Can do this gladly in a demo or a training, would even pay something for it if it is too much effort.