Finesse the CSS

client/landing/stepper/declarative-flow/internals/steps-repository/difm-starting-point/index.tsx

@@ -6,7 +6,6 @@ import { recordTracksEvent } from 'calypso/lib/analytics/tracks';
 import DIFMLanding from 'calypso/my-sites/marketing/do-it-for-me/difm-landing';
 import type { Step } from '../../types';
 
-import './style.scss';
 const STEP_NAME = 'difmStartingPoint';
 const DIFMStartingPoint: Step = function ( { navigation } ) {
 	const { goNext, goBack, submit } = navigation;

client/my-sites/marketing/do-it-for-me/difm-landing.scss

@@ -0,0 +1,9 @@
+.difm-starting-point {
+	.step-container.difmStartingPoint {
+		margin-top: 4vh;
+
+		.step-container__header {
+			padding-inline-end: 0;
+		}
+	}
+}

client/my-sites/marketing/do-it-for-me/difm-landing.tsx

@@ -33,6 +33,8 @@ import {
 import { getSitePlan } from 'calypso/state/sites/selectors';
 import type { TranslateResult } from 'i18n-calypso';
 
+import './difm-landing.scss';
+
 const Placeholder = styled.span`
 	padding: 0 60px;
 	animation: loading-fade 800ms ease-in-out infinite;
@@ -55,12 +57,14 @@ const Placeholder = styled.span`
 const Wrapper = styled.div`
 	display: flex;
 	align-items: flex-start;
-	gap: 96px;
 	padding: 12px;
+	max-width: 1040px;
+	margin: 0 auto;
 `;
 
 const ContentSection = styled.div`
 	flex: 1;
+	padding-right: 10px;
 `;
 
 const ImageSection = styled.div`
@@ -76,9 +80,14 @@ const ImageSection = styled.div`
 `;
 
 const Header = styled( FormattedHeader )`
+	margin: 0 0 24px 0 !important;
 	.formatted-header__title {
-		font-size: 2.25rem;
+		font-size: 2.75rem;
 		line-height: 3rem;
+		text-wrap: nowrap;
+	}
+	.formatted-header__subtitle {
+		font-size: 1rem;
 	}
 `;
 
@@ -189,6 +198,7 @@ const CTASectionWrapper = styled.div`
 const StepContainer = styled.div`
 	display: flex;
 	gap: 20px;
+	margin-top: 0;
 `;
 
 const ProgressLine = styled.div`