fix: remove height constraint and add vertical margin to banner visual containers at desktop breakpoint

Remove `height: 100%` from tablet breakpoint and add `margin: ${space[6]}px 0` at desktop breakpoint for visual container styling. Apply changes consistently across DesignableBanner, v2/Banner, and v2/BannerVisual components.

Author: Juarez Mota

dotcom-rendering/src/components/marketing/banners/designableBanner/DesignableBanner.tsx

@@ -901,10 +901,10 @@ const styles = {
 			justify-self: center;
 		}
 		${from.tablet} {
-			height: 100%;
 			width: 100%;
 		}
 		${from.desktop} {
+			margin: ${space[6]}px 0;
 			justify-self: end;
 		}
 		${between.desktop.and.wide} {

dotcom-rendering/src/components/marketing/banners/designableBanner/v2/Banner.tsx

@@ -191,10 +191,10 @@ const styles = {
 			justify-self: center;
 		}
 		${from.tablet} {
-			height: 100%;
 			width: 100%;
 		}
 		${from.desktop} {
+			margin: ${space[6]}px 0;
 			justify-self: end;
 		}
 		${between.desktop.and.wide} {

dotcom-rendering/src/components/marketing/banners/designableBanner/v2/components/BannerVisual.tsx

@@ -1,5 +1,5 @@
 import { css } from '@emotion/react';
-import { between, from } from '@guardian/source/foundations';
+import { between, from, space } from '@guardian/source/foundations';
 import type { Image } from '@guardian/support-dotcom-components/dist/shared/types';
 import type { ImageAttrs } from '../../../../shared/ResponsiveImage';
 import { ResponsiveImage } from '../../../../shared/ResponsiveImage';
@@ -58,10 +58,10 @@ const getStyles = (isHeaderImage = false) => {
 				justify-self: center;
 			}
 			${from.tablet} {
-				height: 100%;
 				width: 100%;
 			}
 			${from.desktop} {
+				margin: ${space[6]}px 0;
 				justify-self: end;
 			}
 			${between.desktop.and.wide} {