Stage full bleed style page head

Desktop view

The 'full bleed image', spanning from browser edge to browser edge
The height of the image can be adjusted:
- Extra small (default)
  - Viewports
    - XS 160px
    - S 236px
    - M 300 px
    - L/XL 400 px
- Small
  - Viewports
    - XS 160px
    - S 236px
    - M 400px
    - L/XL 500 px
- Medium
  - Viewports
    - XS 160px
    - S 236px
    - M 500px
    - L/XL 600 px
- Large
  - Viewports
    - XS 160px
    - S 236px
    - M 600px
    - L/XL 700 px
The image can set to be hidden for the viewports small and XS
Additional settings allowing to change position of text:
- Top alignment
- Center alignment
- Bottom alignment
Possibility to apply a white context box to improve readability of text if needed
Optionally, font in all text elements can be in white color if background image is dark. Make sure readability remains accessible
Optionally, a second CTA can be integrated
Action stamp functionality
Margin below page heads
Hiding the bottom margin allows eliminating white space between page heads that have an image and a Top Level Grid (or other Top Level component) that has a background color
Only use for these cases.

Image selection
- If you want the text to appear in front of the image without a white background in desktop view, make sure it's readable (accessible).
Required image sizes:
- For 'desktop'-view (large and medium viewport)
  - Ratio 64:25,
    resolution min. 3840 x 1500px
  - Ratio 160:69,
    resolution min. 3840 x 1656px
- For 'mobile'-view (small and extra small viewport)
  - Ratio 64:25,
    resolution min. 2046 x 800px
  - Ratio 160:69,
    resolution min. 2046 x 883px
- The "full-bleed" image has the same definition as on the "Promotion stage" component on the homepage.