Adjust carousel spacing to allow for media cards (#12576)

* Add space to top of carousel between tablet and wide

* Replace margin with flex gap

dotcom-rendering/src/components/ScrollableSmall.importable.tsx

@@ -54,8 +54,12 @@ const themeButtonDisabled = {
 const carouselContainerStyles = css`
 	display: flex;
 	flex-direction: column-reverse;
+	${from.tablet} {
+		gap: ${space[2]}px;
+	}
 	${from.wide} {
 		flex-direction: row;
+		gap: ${space[1]}px;
 	}
 
 	/* Extend carousel into outer margins on mobile */
@@ -161,9 +165,6 @@ const verticalLineStyles = css`
 
 const buttonContainerStyles = css`
 	margin-left: auto;
-	${from.wide} {
-		margin-left: ${space[1]}px;
-	}
 `;
 
 const buttonLayoutStyles = css`