diff --git a/x-pack/plugins/security_solution/public/app/components/onboarding/onboarding_page_service.ts b/x-pack/plugins/security_solution/public/app/components/onboarding/onboarding_page_service.ts
index ea5beab4608d2..16448b92d3a4f 100644
--- a/x-pack/plugins/security_solution/public/app/components/onboarding/onboarding_page_service.ts
+++ b/x-pack/plugins/security_solution/public/app/components/onboarding/onboarding_page_service.ts
@@ -13,22 +13,26 @@ import type { StepId } from '../../../common/components/landing_page/onboarding/
 export class OnboardingPageService {
   private productTypesSubject$: BehaviorSubject<SecurityProductTypes | undefined>;
   private projectsUrlSubject$: BehaviorSubject<string | undefined>;
+  private usersUrlSubject$: BehaviorSubject<string | undefined>;
   private projectFeaturesUrlSubject$: BehaviorSubject<string | undefined>;
   private availableStepsSubject$: BehaviorSubject<StepId[]>;
 
   public productTypes$: Observable<SecurityProductTypes | undefined>;
   public projectsUrl$: Observable<string | undefined>;
+  public usersUrl$: Observable<string | undefined>;
   public projectFeaturesUrl$: Observable<string | undefined>;
   public availableSteps$: Observable<StepId[]>;
 
   constructor() {
     this.productTypesSubject$ = new BehaviorSubject<SecurityProductTypes | undefined>(undefined);
     this.projectsUrlSubject$ = new BehaviorSubject<string | undefined>(undefined);
+    this.usersUrlSubject$ = new BehaviorSubject<string | undefined>(undefined);
     this.projectFeaturesUrlSubject$ = new BehaviorSubject<string | undefined>(undefined);
     this.availableStepsSubject$ = new BehaviorSubject<StepId[]>([]);
 
     this.productTypes$ = this.productTypesSubject$.asObservable();
     this.projectsUrl$ = this.projectsUrlSubject$.asObservable();
+    this.usersUrl$ = this.usersUrlSubject$.asObservable();
     this.projectFeaturesUrl$ = this.projectFeaturesUrlSubject$.asObservable();
     this.availableSteps$ = this.availableStepsSubject$.asObservable();
   }
@@ -39,6 +43,9 @@ export class OnboardingPageService {
   setProjectFeaturesUrl(projectFeaturesUrl: string | undefined) {
     this.projectFeaturesUrlSubject$.next(projectFeaturesUrl);
   }
+  setUsersUrl(userUrl: string | undefined) {
+    this.usersUrlSubject$.next(userUrl);
+  }
   setProjectsUrl(projectsUrl: string | undefined) {
     this.projectsUrlSubject$.next(projectsUrl);
   }
diff --git a/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/card_item.test.tsx b/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/card_item.test.tsx
index 91417dc8e3ddf..c0730847c5e43 100644
--- a/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/card_item.test.tsx
+++ b/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/card_item.test.tsx
@@ -9,7 +9,7 @@ import { render } from '@testing-library/react';
 import { CardItem } from './card_item';
 import type { ExpandedCardSteps, StepId } from './types';
 
-import { QuickStartSectionCardsId, SectionId, OverviewSteps } from './types';
+import { SectionId, ViewDashboardSteps, AddAndValidateYourDataCardsId } from './types';
 jest.mock('./card_step');
 
 describe('CardItemComponent', () => {
@@ -17,7 +17,7 @@ describe('CardItemComponent', () => {
   const onStepClicked = jest.fn();
   const toggleTaskCompleteStatus = jest.fn();
   const expandedCardSteps = {
-    [QuickStartSectionCardsId.watchTheOverviewVideo]: {
+    [AddAndValidateYourDataCardsId.viewDashboards]: {
       isExpanded: false,
       expandedSteps: [] as StepId[],
     },
@@ -26,17 +26,17 @@ describe('CardItemComponent', () => {
   it('should render card', () => {
     const { getByTestId } = render(
       <CardItem
-        activeStepIds={[OverviewSteps.getToKnowElasticSecurity]}
-        cardId={QuickStartSectionCardsId.watchTheOverviewVideo}
+        activeStepIds={[ViewDashboardSteps.analyzeData]}
+        cardId={AddAndValidateYourDataCardsId.viewDashboards}
         expandedCardSteps={expandedCardSteps}
         finishedSteps={finishedSteps}
         toggleTaskCompleteStatus={toggleTaskCompleteStatus}
         onStepClicked={onStepClicked}
-        sectionId={SectionId.quickStart}
+        sectionId={SectionId.addAndValidateYourData}
       />
     );
 
-    const cardTitle = getByTestId(QuickStartSectionCardsId.watchTheOverviewVideo);
+    const cardTitle = getByTestId(AddAndValidateYourDataCardsId.viewDashboards);
     expect(cardTitle).toBeInTheDocument();
   });
 
@@ -44,12 +44,12 @@ describe('CardItemComponent', () => {
     const { queryByText } = render(
       <CardItem
         activeStepIds={[]}
-        cardId={QuickStartSectionCardsId.watchTheOverviewVideo}
+        cardId={AddAndValidateYourDataCardsId.viewDashboards}
         expandedCardSteps={expandedCardSteps}
         finishedSteps={new Set([])}
         toggleTaskCompleteStatus={toggleTaskCompleteStatus}
         onStepClicked={onStepClicked}
-        sectionId={SectionId.quickStart}
+        sectionId={SectionId.addAndValidateYourData}
       />
     );
 
diff --git a/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/card_step/content/data_ingestion_hub_video.tsx b/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/card_step/content/data_ingestion_hub_video.tsx
new file mode 100644
index 0000000000000..181d4a797ebbc
--- /dev/null
+++ b/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/card_step/content/data_ingestion_hub_video.tsx
@@ -0,0 +1,77 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+import { EuiFlexGroup, EuiFlexItem, EuiIcon, useEuiTheme } from '@elastic/eui';
+import { css } from '@emotion/react';
+import React, { useCallback } from 'react';
+import { INGESTION_HUB_VIDEO_SOURCE } from '../../../../../constants';
+import { WATCH_VIDEO_BUTTON_TITLE } from '../../translations';
+
+const VIDEO_CONTENT_HEIGHT = 309;
+
+const DataIngestionHubVideoComponent: React.FC = () => {
+  const ref = React.useRef<HTMLIFrameElement>(null);
+  const [isVideoPlaying, setIsVideoPlaying] = React.useState(false);
+  const { euiTheme } = useEuiTheme();
+
+  const onVideoClicked = useCallback(() => {
+    setIsVideoPlaying(true);
+  }, []);
+
+  return (
+    <div
+      css={css`
+        border-radius: 0px;
+      `}
+    >
+      <div
+        css={css`
+          height: ${VIDEO_CONTENT_HEIGHT}px;
+        `}
+      >
+        {isVideoPlaying && (
+          <EuiFlexGroup
+            css={css`
+              background-color: ${euiTheme.colors.fullShade};
+              height: 100%;
+              width: 100%;
+              position: absolute;
+              z-index: 1;
+              cursor: pointer;
+            `}
+            gutterSize="none"
+            justifyContent="center"
+            alignItems="center"
+            onClick={onVideoClicked}
+          >
+            <EuiFlexItem grow={false}>
+              <EuiIcon type="playFilled" size="xxl" color={euiTheme.colors.emptyShade} />
+            </EuiFlexItem>
+          </EuiFlexGroup>
+        )}
+        {!isVideoPlaying && (
+          <iframe
+            ref={ref}
+            allowFullScreen
+            className="vidyard_iframe"
+            frameBorder="0"
+            height="100%"
+            width="100%"
+            referrerPolicy="no-referrer"
+            sandbox="allow-scripts allow-same-origin"
+            scrolling="no"
+            allow={isVideoPlaying ? 'autoplay;' : undefined}
+            src={`${INGESTION_HUB_VIDEO_SOURCE}${isVideoPlaying ? '?autoplay=1' : ''}`}
+            title={WATCH_VIDEO_BUTTON_TITLE}
+          />
+        )}
+      </div>
+    </div>
+  );
+};
+
+export const DataIngestionHubVideo = React.memo(DataIngestionHubVideoComponent);
diff --git a/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/card_step/step_content.test.tsx b/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/card_step/step_content.test.tsx
index 2d67c587dce51..5d3aae3f3d7dd 100644
--- a/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/card_step/step_content.test.tsx
+++ b/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/card_step/step_content.test.tsx
@@ -4,41 +4,52 @@
  * 2.0; you may not use this file except in compliance with the Elastic License
  * 2.0.
  */
+
 import React from 'react';
-import { render } from '@testing-library/react';
 import { StepContent } from './step_content';
-import { QuickStartSectionCardsId, SectionId } from '../types';
-import { overviewVideoSteps } from '../sections';
+import { AddAndValidateYourDataCardsId, SectionId } from '../types';
+import { viewDashboardSteps } from '../sections';
+import { mountWithIntl } from '@kbn/test-jest-helpers';
 
 jest.mock('../context/step_context');
-jest.mock('../../../../lib/kibana');
+jest.mock('@kbn/security-solution-navigation/src/context');
+jest.mock('../../../../lib/kibana', () => ({
+  useKibana: () => ({
+    services: {
+      notifications: {
+        toasts: {
+          addError: jest.fn(),
+        },
+      },
+    },
+  }),
+}));
 
 describe('StepContent', () => {
   const toggleTaskCompleteStatus = jest.fn();
 
   const props = {
-    cardId: QuickStartSectionCardsId.watchTheOverviewVideo,
+    cardId: AddAndValidateYourDataCardsId.viewDashboards,
     indicesExist: false,
-    sectionId: SectionId.quickStart,
-    step: overviewVideoSteps[0],
+    sectionId: SectionId.addAndValidateYourData,
+    step: viewDashboardSteps[0],
     toggleTaskCompleteStatus,
   };
 
   it('renders step content when hasStepContent is true and isExpandedStep is true', () => {
     const mockProps = { ...props, hasStepContent: true, isExpandedStep: true };
-    const { getByTestId, getByText } = render(<StepContent {...mockProps} />);
+    const wrapper = mountWithIntl(<StepContent {...mockProps} />);
 
-    const splitPanelElement = getByTestId('split-panel');
+    const splitPanelElement = wrapper.find('[data-test-subj="split-panel"]');
 
-    expect(
-      getByText(
-        'Elastic Security unifies analytics, EDR, cloud security capabilities, and more into a SaaS solution that helps you improve your organization’s security posture, defend against a wide range of threats, and prevent breaches.'
-      )
-    ).toBeInTheDocument();
-    expect(
-      getByText('To explore the platform’s core features, watch the video:')
-    ).toBeInTheDocument();
+    expect(splitPanelElement.exists()).toBe(true);
 
-    expect(splitPanelElement).toBeInTheDocument();
+    expect(
+      wrapper
+        .text()
+        .includes(
+          'Use dashboards to visualize data and stay up-to-date with key information. Create your own, or use Elastic’s default dashboards — including alerts, user authentication events, known vulnerabilities, and more.'
+        )
+    ).toBe(true);
   });
 });
diff --git a/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/data_ingestion_hub_header/cards/card.styles.ts b/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/data_ingestion_hub_header/cards/card.styles.ts
new file mode 100644
index 0000000000000..377a7b73efe5c
--- /dev/null
+++ b/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/data_ingestion_hub_header/cards/card.styles.ts
@@ -0,0 +1,56 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+import { COLOR_MODES_STANDARD, useEuiTheme } from '@elastic/eui';
+import { css } from '@emotion/css';
+
+export const useCardStyles = () => {
+  const { euiTheme, colorMode } = useEuiTheme();
+  const isDarkMode = colorMode === COLOR_MODES_STANDARD.dark;
+
+  return css`
+    min-width: 315px;
+    &.headerCard:hover {
+      *:not(.headerCardContent) {
+        text-decoration: none;
+      }
+      .headerCardContent,
+      .headerCardContent * {
+        text-decoration: underline;
+        text-decoration-color: ${euiTheme.colors.primaryText};
+      }
+    }
+
+    ${isDarkMode
+      ? `
+          background-color: ${euiTheme.colors.lightestShade};
+          box-shadow: none;
+          border: 1px solid ${euiTheme.colors.mediumShade};
+        `
+      : ''}
+
+    .headerCardTitle {
+      font-size: ${euiTheme.base * 0.875}px;
+      font-weight: ${euiTheme.font.weight.semiBold};
+      line-height: ${euiTheme.size.l};
+      color: ${euiTheme.colors.title};
+      text-decoration: none;
+    }
+
+    .headerCardImage {
+      width: 64px;
+      height: 64px;
+    }
+
+    .headerCardDescription {
+      font-size: 12.25px;
+      font-weight: ${euiTheme.font.weight.regular};
+      line-height: ${euiTheme.base * 1.25}px;
+      color: ${euiTheme.colors.darkestShade};
+    }
+  `;
+};
diff --git a/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/data_ingestion_hub_header/cards/card.test.tsx b/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/data_ingestion_hub_header/cards/card.test.tsx
new file mode 100644
index 0000000000000..2b0aee4b69019
--- /dev/null
+++ b/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/data_ingestion_hub_header/cards/card.test.tsx
@@ -0,0 +1,42 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+import React from 'react';
+import { render } from '@testing-library/react';
+import { Card } from './card';
+
+jest.mock('../../../../../lib/kibana', () => ({
+  useEuiTheme: jest.fn(() => ({ euiTheme: { colorTheme: 'DARK' } })),
+}));
+
+describe('DataIngestionHubHeaderCardComponent', () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+
+  it('should render the title, description, and icon', () => {
+    const { getByTestId, getByText } = render(
+      <Card icon={'mockIcon.png'} title={'Mock Title'} description={'Mock Description'}>
+        <div>{'test'}</div>
+      </Card>
+    );
+
+    expect(getByText('Mock Title')).toBeInTheDocument();
+    expect(getByText('Mock Description')).toBeInTheDocument();
+    expect(getByTestId('data-ingestion-header-card-icon')).toHaveAttribute('src', 'mockIcon.png');
+  });
+
+  it('should apply dark mode styles when color mode is DARK', () => {
+    const { container } = render(
+      <Card icon={'mockIcon.png'} title={'Mock Title'} description={'Mock Description'}>
+        <div>{'test'}</div>
+      </Card>
+    );
+    const cardElement = container.querySelector('.euiCard');
+    expect(cardElement).toHaveStyle('background-color:rgb(255, 255, 255)');
+  });
+});
diff --git a/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/data_ingestion_hub_header/cards/card.tsx b/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/data_ingestion_hub_header/cards/card.tsx
new file mode 100644
index 0000000000000..7a5c3bd1c2ded
--- /dev/null
+++ b/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/data_ingestion_hub_header/cards/card.tsx
@@ -0,0 +1,60 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+import type { ReactNode } from 'react';
+import React from 'react';
+import type { EuiCardProps } from '@elastic/eui';
+import { EuiCard, EuiTitle } from '@elastic/eui';
+import classNames from 'classnames';
+import { useCardStyles } from './card.styles';
+
+interface CardProps {
+  icon: string;
+  title: string;
+  description: string;
+  children: ReactNode;
+  onClick?: () => void;
+  href?: EuiCardProps['href'];
+  target?: EuiCardProps['target'];
+}
+
+export const Card: React.FC<CardProps> = React.memo((props) => {
+  const { icon, title, description, children, onClick, href, target } = props;
+
+  const cardStyles = useCardStyles();
+  const cardClassName = classNames(cardStyles, 'headerCard');
+
+  return (
+    <EuiCard
+      className={cardClassName}
+      onClick={onClick}
+      href={href}
+      target={target}
+      data-test-subj="data-ingestion-header-card"
+      layout="horizontal"
+      titleSize="xs"
+      icon={
+        <img
+          data-test-subj="data-ingestion-header-card-icon"
+          className="headerCardImage"
+          src={icon}
+          alt={title}
+        />
+      }
+      title={
+        <EuiTitle className="headerCardTitle">
+          <h3>{title}</h3>
+        </EuiTitle>
+      }
+      description={<p className="headerCardDescription">{description}</p>}
+    >
+      <div className="headerCardContent">{children}</div>
+    </EuiCard>
+  );
+});
+
+Card.displayName = 'Card';
diff --git a/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/data_ingestion_hub_header/cards/header_cards.tsx b/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/data_ingestion_hub_header/cards/header_cards.tsx
new file mode 100644
index 0000000000000..99f37edfd4652
--- /dev/null
+++ b/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/data_ingestion_hub_header/cards/header_cards.tsx
@@ -0,0 +1,64 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+import type { ReactNode } from 'react';
+import React, { useMemo } from 'react';
+import { COLOR_MODES_STANDARD, useEuiTheme } from '@elastic/eui';
+import { useSpaceId } from '../../../../../hooks/use_space_id';
+import video from '../../images/data_ingestion_hub_video.png';
+import darkVideo from '../../images/dark_data_ingestion_hub_video.png';
+import teammates from '../../images/data_ingestion_hub_teammates.png';
+import darkTeammates from '../../images/dark_data_ingestion_hub_teammates.png';
+import demo from '../../images/data_ingestion_hub_demo.png';
+import darkDemo from '../../images/dark_data_ingestion_hub_demo.png';
+import * as i18n from '../translations';
+import { useUsersUrl } from '../../hooks/use_users_url';
+import { VideoCard } from './video_card/video_card';
+import { LinkCard } from './link_card/link_card';
+
+const demoUrl = 'https://www.elastic.co/demo-gallery/security-overview';
+
+export const useHeaderCards: () => ReactNode[] = () => {
+  const { colorMode } = useEuiTheme();
+  const isDarkMode = colorMode === COLOR_MODES_STANDARD.dark;
+  const usersUrl = useUsersUrl();
+  const spaceId = useSpaceId();
+
+  const cards = useMemo(() => {
+    const headerCards = [
+      <LinkCard
+        icon={isDarkMode ? darkTeammates : teammates}
+        title={i18n.DATA_INGESTION_HUB_HEADER_TEAMMATES_TITLE}
+        description={i18n.DATA_INGESTION_HUB_HEADER_TEAMMATES_DESCRIPTION}
+        href={usersUrl}
+        linkTitle={i18n.DATA_INGESTION_HUB_HEADER_TEAMMATES_LINK_TITLE}
+      />,
+      <LinkCard
+        icon={isDarkMode ? darkDemo : demo}
+        title={i18n.DATA_INGESTION_HUB_HEADER_DEMO_TITLE}
+        description={i18n.DATA_INGESTION_HUB_HEADER_DEMO_DESCRIPTION}
+        href={demoUrl}
+        linkTitle={i18n.DATA_INGESTION_HUB_HEADER_DEMO_LINK_TITLE}
+      />,
+    ];
+
+    if (spaceId) {
+      return [
+        <VideoCard
+          spaceId={spaceId}
+          icon={isDarkMode ? darkVideo : video}
+          title={i18n.DATA_INGESTION_HUB_HEADER_VIDEO_TITLE}
+          description={i18n.DATA_INGESTION_HUB_HEADER_VIDEO_DESCRIPTION}
+        />,
+        ...headerCards,
+      ];
+    }
+    return headerCards;
+  }, [isDarkMode, spaceId, usersUrl]);
+
+  return cards;
+};
diff --git a/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/data_ingestion_hub_header/cards/link_card/link_card.tsx b/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/data_ingestion_hub_header/cards/link_card/link_card.tsx
new file mode 100644
index 0000000000000..dc079ec2ef2ea
--- /dev/null
+++ b/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/data_ingestion_hub_header/cards/link_card/link_card.tsx
@@ -0,0 +1,43 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+import React from 'react';
+import { EuiLink, useEuiTheme } from '@elastic/eui';
+import { css } from '@emotion/css';
+import { Card } from '../card';
+
+interface VideoCardProps {
+  icon: string;
+  title: string;
+  description: string;
+  href?: string;
+  linkTitle: string;
+}
+
+export const LinkCard: React.FC<VideoCardProps> = React.memo((props) => {
+  const { icon, title, description, href, linkTitle } = props;
+  const { euiTheme } = useEuiTheme();
+
+  return (
+    <Card href={href} target="_blank" icon={icon} title={title} description={description}>
+      <EuiLink
+        href={href}
+        external={true}
+        target="_blank"
+        className={css({
+          fontSize: euiTheme.size.m,
+          fontWeight: euiTheme.font.weight.medium,
+          lineHeight: euiTheme.size.base,
+        })}
+      >
+        {linkTitle}
+      </EuiLink>
+    </Card>
+  );
+});
+
+LinkCard.displayName = 'LinkCard';
diff --git a/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/data_ingestion_hub_header/cards/video_card/video_card.tsx b/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/data_ingestion_hub_header/cards/video_card/video_card.tsx
new file mode 100644
index 0000000000000..1081b0db365b7
--- /dev/null
+++ b/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/data_ingestion_hub_header/cards/video_card/video_card.tsx
@@ -0,0 +1,75 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+import React, { useState } from 'react';
+import { useLocalStorage } from 'react-use';
+import { EuiLink, EuiText } from '@elastic/eui';
+import { Card } from '../card';
+import { DataIngestionHubVideoModal } from './video_modal';
+import * as i18n from '../../translations';
+
+interface VideoCardProps {
+  icon: string;
+  title: string;
+  description: string;
+  spaceId: string;
+}
+
+export const getStorageKeyBySpace = (storageKey: string, spaceId: string | null | undefined) => {
+  if (spaceId == null) {
+    return storageKey;
+  }
+  return `${storageKey}.${spaceId}`;
+};
+
+const IS_ONBOARDING_HUB_VISITED_LOCAL_STORAGE_KEY = 'secutirySolution.isOnboardingHubVisited';
+
+export const VideoCard: React.FC<VideoCardProps> = React.memo((props) => {
+  const { icon, title, description, spaceId } = props;
+  const [isModalVisible, setIsModalVisible] = useState(false);
+
+  const isOnboardingHubVisitedStorageKey = getStorageKeyBySpace(
+    IS_ONBOARDING_HUB_VISITED_LOCAL_STORAGE_KEY,
+    spaceId
+  );
+
+  const [isOnboardingHubVisited, setIsOnboardingHubVisited] = useLocalStorage<boolean | null>(
+    isOnboardingHubVisitedStorageKey,
+    null
+  );
+
+  const closeVideoModal = () => {
+    if (isOnboardingHubVisited === null) {
+      setIsOnboardingHubVisited(true);
+    }
+    setIsModalVisible(false);
+  };
+
+  const showVideoModal = () => {
+    setIsModalVisible(true);
+  };
+
+  return (
+    <>
+      <Card onClick={showVideoModal} icon={icon} title={title} description={description}>
+        <EuiText size="xs">
+          <EuiLink onClick={showVideoModal}>
+            {i18n.DATA_INGESTION_HUB_HEADER_VIDEO_LINK_TITLE}
+          </EuiLink>
+        </EuiText>
+      </Card>
+      {isModalVisible && (
+        <DataIngestionHubVideoModal
+          onCloseModal={closeVideoModal}
+          isOnboardingHubVisited={isOnboardingHubVisited}
+        />
+      )}
+    </>
+  );
+});
+
+VideoCard.displayName = 'VideoCard';
diff --git a/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/data_ingestion_hub_header/cards/video_card/video_modal.styles.ts b/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/data_ingestion_hub_header/cards/video_card/video_modal.styles.ts
new file mode 100644
index 0000000000000..82e690a1783f5
--- /dev/null
+++ b/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/data_ingestion_hub_header/cards/video_card/video_modal.styles.ts
@@ -0,0 +1,29 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+import { css } from '@emotion/css';
+import { useMemo } from 'react';
+
+export const useDataIngestionHubHeaderVideoModalStyles = () => {
+  const dataIngestionHubHeaderStyles = useMemo(() => {
+    return {
+      modalFooterStyles: css({
+        justifyContent: 'center',
+      }),
+      modalBodyStyles: css({
+        '.euiModalBody__overflow': { padding: '0px', maskImage: 'none' },
+        overflow: 'hidden',
+        padding: '0px',
+        height: '312px',
+      }),
+      modalTitleStyles: css({ textAlign: 'center', fontSize: '1.375rem', fontWeight: 700 }),
+      modalDescriptionStyles: css({ textAlign: 'center' }),
+      modalStyles: css({ width: 550 }),
+    };
+  }, []);
+  return dataIngestionHubHeaderStyles;
+};
diff --git a/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/data_ingestion_hub_header/cards/video_card/video_modal.test.tsx b/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/data_ingestion_hub_header/cards/video_card/video_modal.test.tsx
new file mode 100644
index 0000000000000..f706045502ff8
--- /dev/null
+++ b/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/data_ingestion_hub_header/cards/video_card/video_modal.test.tsx
@@ -0,0 +1,43 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+import React from 'react';
+import { render } from '@testing-library/react';
+import { DataIngestionHubVideoModal } from './video_modal';
+
+const mockOnCloseModal = jest.fn();
+
+describe('VideoCardComponent', () => {
+  it('should render the title, description', () => {
+    const { getByText } = render(
+      <DataIngestionHubVideoModal onCloseModal={mockOnCloseModal} isOnboardingHubVisited={true} />
+    );
+
+    expect(getByText('Welcome to Elastic Security!')).toBeInTheDocument();
+    expect(
+      getByText(
+        'We’re excited to support you in protecting your organization’s data. Here’s a preview of the steps you’ll take to set up.'
+      )
+    ).toBeInTheDocument();
+  });
+
+  it('should render the button label "Close" on isOnboardingHubVisited true', () => {
+    const { getByTestId } = render(
+      <DataIngestionHubVideoModal onCloseModal={mockOnCloseModal} isOnboardingHubVisited={true} />
+    );
+
+    expect(getByTestId('video-modal-button')).toHaveTextContent('Close');
+  });
+
+  it('should render the button label "Head to steps" on isOnboardingHubVisited false', () => {
+    const { getByTestId } = render(
+      <DataIngestionHubVideoModal onCloseModal={mockOnCloseModal} isOnboardingHubVisited={false} />
+    );
+
+    expect(getByTestId('video-modal-button')).toHaveTextContent('Head to steps');
+  });
+});
diff --git a/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/data_ingestion_hub_header/cards/video_card/video_modal.tsx b/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/data_ingestion_hub_header/cards/video_card/video_modal.tsx
new file mode 100644
index 0000000000000..f19b1b0919a32
--- /dev/null
+++ b/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/data_ingestion_hub_header/cards/video_card/video_modal.tsx
@@ -0,0 +1,80 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+import React from 'react';
+import {
+  EuiButton,
+  EuiFlexGroup,
+  EuiFlexItem,
+  EuiModal,
+  EuiModalBody,
+  EuiModalFooter,
+  EuiModalHeaderTitle,
+  EuiSpacer,
+  EuiText,
+  useGeneratedHtmlId,
+} from '@elastic/eui';
+import { DataIngestionHubVideo } from '../../../card_step/content/data_ingestion_hub_video';
+import {
+  DATA_INGESTION_HUB_VIDEO_MODAL_BUTTON,
+  DATA_INGESTION_HUB_VIDEO_MODAL_BUTTON_CLOSE,
+  DATA_INGESTION_HUB_VIDEO_MODAL_DESCRIPTION,
+  DATA_INGESTION_HUB_VIDEO_MODAL_TITLE,
+} from '../../translations';
+import { useDataIngestionHubHeaderVideoModalStyles } from './video_modal.styles';
+
+interface DataIngestionHubVideoModalComponentProps {
+  onCloseModal: () => void;
+  isOnboardingHubVisited?: boolean | null;
+}
+
+export const DataIngestionHubVideoModal: React.FC<DataIngestionHubVideoModalComponentProps> =
+  React.memo(({ onCloseModal, isOnboardingHubVisited }) => {
+    const modalTitle = useGeneratedHtmlId();
+    const {
+      modalStyles,
+      modalFooterStyles,
+      modalBodyStyles,
+      modalTitleStyles,
+      modalDescriptionStyles,
+    } = useDataIngestionHubHeaderVideoModalStyles();
+
+    return (
+      <EuiModal
+        data-test-subj="data-ingestion-hub-video-modal"
+        aria-labelledby={modalTitle}
+        className={modalStyles}
+        onClose={onCloseModal}
+      >
+        <EuiModalBody className={modalBodyStyles}>
+          <DataIngestionHubVideo />
+        </EuiModalBody>
+        <EuiModalFooter className={modalFooterStyles}>
+          <EuiFlexGroup wrap={true} justifyContent="center">
+            <EuiFlexItem grow={false} justifyContent="center">
+              <EuiModalHeaderTitle className={modalTitleStyles} id={modalTitle}>
+                {DATA_INGESTION_HUB_VIDEO_MODAL_TITLE}
+              </EuiModalHeaderTitle>
+              <EuiSpacer size="m" />
+              <EuiText size="s" className={modalDescriptionStyles}>
+                {DATA_INGESTION_HUB_VIDEO_MODAL_DESCRIPTION}
+              </EuiText>
+            </EuiFlexItem>
+            <EuiFlexItem grow={false}>
+              <EuiButton data-test-subj="video-modal-button" color="primary" onClick={onCloseModal}>
+                {isOnboardingHubVisited
+                  ? DATA_INGESTION_HUB_VIDEO_MODAL_BUTTON_CLOSE
+                  : DATA_INGESTION_HUB_VIDEO_MODAL_BUTTON}
+              </EuiButton>
+            </EuiFlexItem>
+          </EuiFlexGroup>
+        </EuiModalFooter>
+      </EuiModal>
+    );
+  });
+
+DataIngestionHubVideoModal.displayName = 'DataIngestionHubVideoModal';
diff --git a/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/styles/data_ingestion_hub_header.styles.ts b/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/data_ingestion_hub_header/index.styles.ts
similarity index 100%
rename from x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/styles/data_ingestion_hub_header.styles.ts
rename to x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/data_ingestion_hub_header/index.styles.ts
diff --git a/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/data_ingestion_hub_header/index.test.tsx b/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/data_ingestion_hub_header/index.test.tsx
index e9a9c068b0926..862611b81dd99 100644
--- a/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/data_ingestion_hub_header/index.test.tsx
+++ b/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/data_ingestion_hub_header/index.test.tsx
@@ -5,21 +5,48 @@
  * 2.0.
  */
 import React from 'react';
-import { render } from '@testing-library/react';
+import { render, fireEvent } from '@testing-library/react';
 import { DataIngestionHubHeader } from '.';
 import darkRocket from '../images/dark_rocket.png';
 import { useCurrentUser } from '../../../../lib/kibana';
+import { useHeaderCards } from './cards/header_cards';
+import { VideoCard } from './cards/video_card/video_card';
 
-jest.mock('../../../../lib/kibana', () => ({
-  useCurrentUser: jest.fn(),
-  useEuiTheme: jest.fn(() => ({ euiTheme: { colorTheme: 'DARK' } })),
+const mockSpace = {
+  id: 'space',
+  name: 'space',
+  disabledFeatures: [],
+};
+
+jest.mock('../../../../lib/kibana', () => {
+  const original = jest.requireActual('../../../../lib/kibana');
+
+  return {
+    useCurrentUser: jest.fn(),
+    useEuiTheme: jest.fn(() => ({ colorMode: 'DARK' })),
+    useKibana: () => ({
+      ...original.useKibana(),
+      services: {
+        ...original.useKibana().services,
+        spaces: {
+          getActiveSpace: jest.fn().mockResolvedValue(mockSpace),
+        },
+      },
+    }),
+  };
+});
+
+jest.mock('./cards/header_cards', () => ({
+  useHeaderCards: jest.fn(),
 }));
 
 const mockUseCurrentUser = useCurrentUser as jest.Mock;
+const mockUseHeaderCards = useHeaderCards as jest.Mock;
 
 describe('WelcomeHeaderComponent', () => {
   beforeEach(() => {
     jest.clearAllMocks();
+    mockUseHeaderCards.mockReturnValue([]);
   });
 
   it('should render fullName when fullName is provided', () => {
@@ -74,4 +101,22 @@ describe('WelcomeHeaderComponent', () => {
     const image = queryByTestId('data-ingestion-hub-header-image');
     expect(image).toHaveStyle({ backgroundImage: `url(${darkRocket})` });
   });
+
+  it('should display the modal when the "video" card is clicked', () => {
+    mockUseHeaderCards.mockReturnValue([
+      <VideoCard
+        spaceId="mockSpaceId"
+        icon={'mockIcon.png'}
+        title={'Video'}
+        description={'Video description'}
+      />,
+    ]);
+    const { getByText, queryByTestId } = render(<DataIngestionHubHeader />);
+
+    const cardElement = getByText('Watch video');
+    fireEvent.click(cardElement);
+
+    const modalElement = queryByTestId('data-ingestion-hub-video-modal');
+    expect(modalElement).toBeInTheDocument();
+  });
 });
diff --git a/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/data_ingestion_hub_header/index.tsx b/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/data_ingestion_hub_header/index.tsx
index 167029c5cc431..f1ee9ed2e4fe2 100644
--- a/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/data_ingestion_hub_header/index.tsx
+++ b/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/data_ingestion_hub_header/index.tsx
@@ -14,10 +14,12 @@ import {
   GET_STARTED_DATA_INGESTION_HUB_SUBTITLE,
 } from '../translations';
 import { useCurrentUser } from '../../../../lib/kibana';
-import { useDataIngestionHubHeaderStyles } from '../styles/data_ingestion_hub_header.styles';
+import { useDataIngestionHubHeaderStyles } from './index.styles';
+import { useHeaderCards } from './cards/header_cards';
 
-const DataIngestionHubHeaderComponent: React.FC = () => {
+export const DataIngestionHubHeader: React.FC = React.memo(() => {
   const userName = useCurrentUser();
+  const headerCards = useHeaderCards();
 
   const {
     headerContentStyles,
@@ -34,35 +36,48 @@ const DataIngestionHubHeaderComponent: React.FC = () => {
   const headerDescriptionClassNames = classnames('eui-displayBlock', headerDescriptionStyles);
 
   return (
-    <EuiFlexGroup
-      data-test-subj="data-ingestion-hub-header"
-      justifyContent="center"
-      alignItems="center"
-    >
-      <EuiFlexItem
-        data-test-subj="data-ingestion-hub-header-image"
-        grow={false}
-        className={headerImageStyles}
-      />
-      <EuiFlexItem grow={false} className={headerContentStyles}>
-        {name && (
-          <EuiTitle
-            size="l"
-            className={headerTitleStyles}
-            data-test-subj="data-ingestion-hub-header-greetings"
-          >
-            <span>{GET_STARTED_PAGE_TITLE(name)}</span>
-          </EuiTitle>
-        )}
-        <EuiSpacer size="s" />
-        <h1 className={headerSubtitleClassNames}>{GET_STARTED_DATA_INGESTION_HUB_SUBTITLE}</h1>
-        <EuiSpacer size="s" />
-        <span className={headerDescriptionClassNames}>
-          {GET_STARTED_DATA_INGESTION_HUB_DESCRIPTION}
-        </span>
-      </EuiFlexItem>
-    </EuiFlexGroup>
+    <>
+      <EuiFlexGroup
+        data-test-subj="data-ingestion-hub-header"
+        justifyContent="center"
+        alignItems="center"
+      >
+        <EuiFlexItem
+          data-test-subj="data-ingestion-hub-header-image"
+          grow={false}
+          className={headerImageStyles}
+        />
+        <EuiFlexItem grow={false} className={headerContentStyles}>
+          {name && (
+            <EuiTitle
+              size="l"
+              className={headerTitleStyles}
+              data-test-subj="data-ingestion-hub-header-greetings"
+            >
+              <span>{GET_STARTED_PAGE_TITLE(name)}</span>
+            </EuiTitle>
+          )}
+          <EuiSpacer size="s" />
+          <h1 className={headerSubtitleClassNames}>{GET_STARTED_DATA_INGESTION_HUB_SUBTITLE}</h1>
+          <EuiSpacer size="s" />
+          <span className={headerDescriptionClassNames}>
+            {GET_STARTED_DATA_INGESTION_HUB_DESCRIPTION}
+          </span>
+        </EuiFlexItem>
+      </EuiFlexGroup>
+      <EuiSpacer size="xxl" />
+      <EuiFlexGroup
+        data-test-subj="data-ingestion-hub-header-cards"
+        justifyContent="center"
+        alignItems="center"
+        wrap
+      >
+        {headerCards.map((card, i) => (
+          <EuiFlexItem key={i}>{card}</EuiFlexItem>
+        ))}
+      </EuiFlexGroup>
+    </>
   );
-};
+});
 
-export const DataIngestionHubHeader = React.memo(DataIngestionHubHeaderComponent);
+DataIngestionHubHeader.displayName = 'DataIngestionHubHeader';
diff --git a/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/data_ingestion_hub_header/translations.ts b/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/data_ingestion_hub_header/translations.ts
new file mode 100644
index 0000000000000..7bc3ec5f52714
--- /dev/null
+++ b/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/data_ingestion_hub_header/translations.ts
@@ -0,0 +1,100 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+import { i18n } from '@kbn/i18n';
+
+export const DATA_INGESTION_HUB_HEADER_VIDEO_TITLE = i18n.translate(
+  'xpack.securitySolution.onboarding.dataIngestionHubHeader.video.title',
+  {
+    defaultMessage: 'Watch 2 minute overview video',
+  }
+);
+
+export const DATA_INGESTION_HUB_HEADER_VIDEO_DESCRIPTION = i18n.translate(
+  'xpack.securitySolution.onboarding.dataIngestionHubHeader.video.description',
+  {
+    defaultMessage: 'Get acquainted with Elastic Security',
+  }
+);
+
+export const DATA_INGESTION_HUB_HEADER_VIDEO_LINK_TITLE = i18n.translate(
+  'xpack.securitySolution.onboarding.dataIngestionHubHeader.video.link.title',
+  {
+    defaultMessage: 'Watch video',
+  }
+);
+
+export const DATA_INGESTION_HUB_HEADER_DEMO_TITLE = i18n.translate(
+  'xpack.securitySolution.onboarding.dataIngestionHubHeader.demo.title',
+  {
+    defaultMessage: 'See Elastic Security in action',
+  }
+);
+
+export const DATA_INGESTION_HUB_HEADER_DEMO_DESCRIPTION = i18n.translate(
+  'xpack.securitySolution.onboarding.dataIngestionHubHeader.demo.description',
+  {
+    defaultMessage: 'Explore the demo, no setup required!',
+  }
+);
+
+export const DATA_INGESTION_HUB_HEADER_DEMO_LINK_TITLE = i18n.translate(
+  'xpack.securitySolution.onboarding.dataIngestionHubHeader.demo.link.title',
+  {
+    defaultMessage: 'Explore Demo',
+  }
+);
+
+export const DATA_INGESTION_HUB_HEADER_TEAMMATES_TITLE = i18n.translate(
+  'xpack.securitySolution.onboarding.dataIngestionHubHeader.teammates.title',
+  {
+    defaultMessage: 'Add teammates',
+  }
+);
+
+export const DATA_INGESTION_HUB_HEADER_TEAMMATES_DESCRIPTION = i18n.translate(
+  'xpack.securitySolution.onboarding.dataIngestionHubHeader.teammates.description',
+  {
+    defaultMessage: 'Increase collaboration across your org',
+  }
+);
+
+export const DATA_INGESTION_HUB_HEADER_TEAMMATES_LINK_TITLE = i18n.translate(
+  'xpack.securitySolution.onboarding.dataIngestionHubHeader.teammates.link.title',
+  {
+    defaultMessage: 'Add users',
+  }
+);
+
+export const DATA_INGESTION_HUB_VIDEO_MODAL_TITLE = i18n.translate(
+  'xpack.securitySolution.onboarding.dataIngestionHubHeader.videoModal.title',
+  {
+    defaultMessage: 'Welcome to Elastic Security!',
+  }
+);
+
+export const DATA_INGESTION_HUB_VIDEO_MODAL_DESCRIPTION = i18n.translate(
+  'xpack.securitySolution.onboarding.dataIngestionHubHeader.videoModal.description',
+  {
+    defaultMessage:
+      'We’re excited to support you in protecting your organization’s data. Here’s a preview of the steps you’ll take to set up.',
+  }
+);
+
+export const DATA_INGESTION_HUB_VIDEO_MODAL_BUTTON = i18n.translate(
+  'xpack.securitySolution.onboarding.dataIngestionHubHeader.videoModal.button',
+  {
+    defaultMessage: 'Head to steps',
+  }
+);
+
+export const DATA_INGESTION_HUB_VIDEO_MODAL_BUTTON_CLOSE = i18n.translate(
+  'xpack.securitySolution.onboarding.dataIngestionHubHeader.videoModal.buttonClose',
+  {
+    defaultMessage: 'Close',
+  }
+);
diff --git a/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/helpers.test.ts b/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/helpers.test.ts
index 9fa382567b79e..59a536a853c8e 100644
--- a/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/helpers.test.ts
+++ b/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/helpers.test.ts
@@ -148,11 +148,6 @@ describe('setupActiveSections', () => {
         .activeStepIds
     ).toEqual([CreateProjectSteps.createFirstProject]);
 
-    expect(
-      getCard(QuickStartSectionCardsId.watchTheOverviewVideo, SectionId.quickStart, activeSections)
-        .activeStepIds
-    ).toEqual([OverviewSteps.getToKnowElasticSecurity]);
-
     expect(
       getCard(
         AddAndValidateYourDataCardsId.addIntegrations,
diff --git a/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/hooks/use_toggle_panel.test.tsx b/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/hooks/use_toggle_panel.test.tsx
index 283a44ec07c09..ccf84ef849bf2 100644
--- a/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/hooks/use_toggle_panel.test.tsx
+++ b/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/hooks/use_toggle_panel.test.tsx
@@ -59,7 +59,6 @@ describe('useTogglePanel', () => {
 
   const onboardingSteps: StepId[] = [
     CreateProjectSteps.createFirstProject,
-    OverviewSteps.getToKnowElasticSecurity,
     AddIntegrationsSteps.connectToDataSources,
     ViewDashboardSteps.analyzeData,
     EnablePrebuiltRulesSteps.enablePrebuiltRules,
@@ -119,12 +118,6 @@ describe('useTogglePanel', () => {
             stepsLeft: 0,
             activeStepIds: [CreateProjectSteps.createFirstProject],
           },
-          [QuickStartSectionCardsId.watchTheOverviewVideo]: {
-            id: QuickStartSectionCardsId.watchTheOverviewVideo,
-            timeInMins: 0,
-            stepsLeft: 1,
-            activeStepIds: [OverviewSteps.getToKnowElasticSecurity],
-          },
         },
         [SectionId.addAndValidateYourData]: {
           [AddAndValidateYourDataCardsId.addIntegrations]: {
@@ -181,12 +174,6 @@ describe('useTogglePanel', () => {
             stepsLeft: 0,
             activeStepIds: [CreateProjectSteps.createFirstProject],
           },
-          [QuickStartSectionCardsId.watchTheOverviewVideo]: {
-            id: QuickStartSectionCardsId.watchTheOverviewVideo,
-            timeInMins: 0,
-            stepsLeft: 1,
-            activeStepIds: [OverviewSteps.getToKnowElasticSecurity],
-          },
         },
         [SectionId.addAndValidateYourData]: {
           [AddAndValidateYourDataCardsId.addIntegrations]: {
@@ -244,12 +231,6 @@ describe('useTogglePanel', () => {
             stepsLeft: 0,
             activeStepIds: [CreateProjectSteps.createFirstProject],
           },
-          [QuickStartSectionCardsId.watchTheOverviewVideo]: {
-            id: QuickStartSectionCardsId.watchTheOverviewVideo,
-            timeInMins: 0,
-            stepsLeft: 1,
-            activeStepIds: [OverviewSteps.getToKnowElasticSecurity],
-          },
         },
         [SectionId.addAndValidateYourData]: {
           [AddAndValidateYourDataCardsId.addIntegrations]: {
diff --git a/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/hooks/use_users_url.ts b/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/hooks/use_users_url.ts
new file mode 100644
index 0000000000000..8597a98b37e7f
--- /dev/null
+++ b/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/hooks/use_users_url.ts
@@ -0,0 +1,14 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License
+ * 2.0; you may not use this file except in compliance with the Elastic License
+ * 2.0.
+ */
+
+import { useObservable } from 'react-use';
+import { useKibana } from '../../../../lib/kibana';
+
+export const useUsersUrl = () => {
+  const { usersUrl$ } = useKibana().services.onboarding;
+  return useObservable(usersUrl$, undefined);
+};
diff --git a/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/images/dark_data_ingestion_hub_demo.png b/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/images/dark_data_ingestion_hub_demo.png
new file mode 100644
index 0000000000000..506f7fa2ecfbd
Binary files /dev/null and b/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/images/dark_data_ingestion_hub_demo.png differ
diff --git a/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/images/dark_data_ingestion_hub_teammates.png b/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/images/dark_data_ingestion_hub_teammates.png
new file mode 100644
index 0000000000000..1b96c3f021e29
Binary files /dev/null and b/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/images/dark_data_ingestion_hub_teammates.png differ
diff --git a/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/images/dark_data_ingestion_hub_video.png b/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/images/dark_data_ingestion_hub_video.png
new file mode 100644
index 0000000000000..af8e5783c196a
Binary files /dev/null and b/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/images/dark_data_ingestion_hub_video.png differ
diff --git a/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/images/data_ingestion_hub_demo.png b/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/images/data_ingestion_hub_demo.png
new file mode 100644
index 0000000000000..661363b453888
Binary files /dev/null and b/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/images/data_ingestion_hub_demo.png differ
diff --git a/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/images/data_ingestion_hub_teammates.png b/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/images/data_ingestion_hub_teammates.png
new file mode 100644
index 0000000000000..ff5e65d738bb6
Binary files /dev/null and b/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/images/data_ingestion_hub_teammates.png differ
diff --git a/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/images/data_ingestion_hub_video.png b/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/images/data_ingestion_hub_video.png
new file mode 100644
index 0000000000000..b7bfff6c3da9a
Binary files /dev/null and b/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/images/data_ingestion_hub_video.png differ
diff --git a/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/onboarding.test.tsx b/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/onboarding.test.tsx
index 983719bc571a0..9d8e119040e6c 100644
--- a/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/onboarding.test.tsx
+++ b/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/onboarding.test.tsx
@@ -16,7 +16,6 @@ import {
 import { ProductLine, ProductTier } from './configs';
 import type { AppContextTestRender } from '../../../mock/endpoint';
 import { createAppRootMockRenderer } from '../../../mock/endpoint';
-import { useIsExperimentalFeatureEnabled } from '../../../hooks/use_experimental_features';
 import { useKibana as mockUseKibana } from '../../../lib/kibana/__mocks__';
 
 const mockedUseKibana = mockUseKibana();
@@ -44,9 +43,6 @@ jest.mock('../../../lib/kibana', () => {
 });
 
 jest.mock('./toggle_panel');
-jest.mock('../../../hooks/use_experimental_features', () => ({
-  useIsExperimentalFeatureEnabled: jest.fn().mockReturnValue(false),
-}));
 
 describe('OnboardingComponent', () => {
   let render: () => ReturnType<AppContextTestRender['render']>;
@@ -66,7 +62,6 @@ describe('OnboardingComponent', () => {
   };
 
   beforeEach(() => {
-    (useIsExperimentalFeatureEnabled as jest.Mock).mockReturnValue(false);
     mockedContext = createAppRootMockRenderer();
     render = () => (renderResult = mockedContext.render(<OnboardingComponent {...props} />));
   });
@@ -79,34 +74,21 @@ describe('OnboardingComponent', () => {
     render();
 
     const pageTitle = renderResult.getByText('Hi UserFullName!');
-    const subtitle = renderResult.getByText(`Get started with Security`);
-    const description = renderResult.getByText(
-      `This area shows you everything you need to know. Feel free to explore all content. You can always come back here at any time.`
-    );
+    const subtitle = renderResult.getByText(`Welcome to Elastic Security`);
+    const description = renderResult.getByText(`Follow these steps to set up your workspace.`);
 
     expect(pageTitle).toBeInTheDocument();
     expect(subtitle).toBeInTheDocument();
     expect(description).toBeInTheDocument();
   });
 
-  it('should render welcomeHeader and TogglePanel', () => {
+  it('should render dataIngestionHubHeader and TogglePanel', () => {
     render();
-
-    const welcomeHeader = renderResult.getByTestId('welcome-header');
-    const togglePanel = renderResult.getByTestId('toggle-panel');
-
-    expect(welcomeHeader).toBeInTheDocument();
-    expect(togglePanel).toBeInTheDocument();
-  });
-
-  it('should render dataIngestionHubHeader if dataIngestionHubEnabled flag is true', () => {
-    (useIsExperimentalFeatureEnabled as jest.Mock).mockReturnValue(true);
-
-    render();
-
     const dataIngestionHubHeader = renderResult.getByTestId('data-ingestion-hub-header');
+    const togglePanel = renderResult.getByTestId('toggle-panel');
 
     expect(dataIngestionHubHeader).toBeInTheDocument();
+    expect(togglePanel).toBeInTheDocument();
   });
 
   describe('AVC 2024 Results banner', () => {
diff --git a/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/onboarding.tsx b/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/onboarding.tsx
index 8451cf2178f49..37a9c94a41f4d 100644
--- a/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/onboarding.tsx
+++ b/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/onboarding.tsx
@@ -15,7 +15,6 @@ import { useTogglePanel } from './hooks/use_toggle_panel';
 import { Progress } from './progress_bar';
 import { StepContextProvider } from './context/step_context';
 import { CONTENT_WIDTH } from './helpers';
-import { WelcomeHeader } from './welcome_header';
 import { DataIngestionHubHeader } from './data_ingestion_hub_header';
 import { Footer } from './footer';
 import { useScrollToHash } from './hooks/use_scroll';
@@ -26,7 +25,6 @@ import type { StepId } from './types';
 import { useOnboardingStyles } from './styles/onboarding.styles';
 import { useKibana } from '../../../lib/kibana';
 import type { OnboardingHubStepLinkClickedParams } from '../../../lib/telemetry/events/onboarding/types';
-import { useIsExperimentalFeatureEnabled } from '../../../hooks/use_experimental_features';
 
 interface OnboardingProps {
   indicesExist?: boolean;
@@ -67,7 +65,6 @@ export const OnboardingComponent: React.FC<OnboardingProps> = ({
     },
     [telemetry]
   );
-  const isDataIngestionHubEnabled = useIsExperimentalFeatureEnabled('dataIngestionHubEnabled');
 
   const [showAVCBanner, setShowAVCBanner] = useState(
     storage.get('securitySolution.showAvcBanner') ?? true
@@ -79,21 +76,6 @@ export const OnboardingComponent: React.FC<OnboardingProps> = ({
 
   useScrollToHash();
 
-  const renderDataIngestionHubHeader = useMemo(
-    () =>
-      isDataIngestionHubEnabled ? (
-        <DataIngestionHubHeader />
-      ) : (
-        <WelcomeHeader productTier={productTier} />
-      ),
-    [isDataIngestionHubEnabled, productTier]
-  );
-
-  const kibanaPageTemplateSectionStyles = useMemo(
-    () => (isDataIngestionHubEnabled ? headerSectionStyles : ''),
-    [headerSectionStyles, isDataIngestionHubEnabled]
-  );
-
   return (
     <div className={wrapperStyles}>
       {useIsStillYear2024() && showAVCBanner && (
@@ -102,11 +84,11 @@ export const OnboardingComponent: React.FC<OnboardingProps> = ({
         </KibanaPageTemplate.Section>
       )}
       <KibanaPageTemplate.Section
-        className={kibanaPageTemplateSectionStyles}
+        className={headerSectionStyles}
         restrictWidth={CONTENT_WIDTH}
         paddingSize="xl"
       >
-        {renderDataIngestionHubHeader}
+        <DataIngestionHubHeader />
       </KibanaPageTemplate.Section>
       <KibanaPageTemplate.Section
         restrictWidth={CONTENT_WIDTH}
diff --git a/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/reducer.test.ts b/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/reducer.test.ts
index 18c1bc240141b..354238ada550f 100644
--- a/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/reducer.test.ts
+++ b/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/reducer.test.ts
@@ -35,7 +35,6 @@ import {
 } from './types';
 const onboardingSteps = [
   CreateProjectSteps.createFirstProject,
-  OverviewSteps.getToKnowElasticSecurity,
   AddIntegrationsSteps.connectToDataSources,
   ViewDashboardSteps.analyzeData,
   EnablePrebuiltRulesSteps.enablePrebuiltRules,
@@ -120,12 +119,6 @@ describe('reducer', () => {
           stepsLeft: 0,
           activeStepIds: [CreateProjectSteps.createFirstProject],
         },
-        [QuickStartSectionCardsId.watchTheOverviewVideo]: {
-          id: QuickStartSectionCardsId.watchTheOverviewVideo,
-          timeInMins: 0,
-          stepsLeft: 0,
-          activeStepIds: [OverviewSteps.getToKnowElasticSecurity],
-        },
       },
       [SectionId.addAndValidateYourData]: {
         [AddAndValidateYourDataCardsId.addIntegrations]: {
@@ -212,12 +205,6 @@ describe('getActiveSectionsInitialStates', () => {
           stepsLeft: 0,
           activeStepIds: [CreateProjectSteps.createFirstProject],
         },
-        [QuickStartSectionCardsId.watchTheOverviewVideo]: {
-          id: QuickStartSectionCardsId.watchTheOverviewVideo,
-          timeInMins: 0,
-          stepsLeft: 1,
-          activeStepIds: [OverviewSteps.getToKnowElasticSecurity],
-        },
       },
       [SectionId.addAndValidateYourData]: {
         [AddAndValidateYourDataCardsId.addIntegrations]: {
@@ -249,7 +236,7 @@ describe('getActiveSectionsInitialStates', () => {
       },
     });
 
-    expect(totalActiveSteps).toEqual(6);
-    expect(totalStepsLeft).toEqual(5);
+    expect(totalActiveSteps).toEqual(5);
+    expect(totalStepsLeft).toEqual(4);
   });
 });
diff --git a/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/sections.tsx b/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/sections.tsx
index dea59ad81d0e5..a00a8a75e563f 100644
--- a/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/sections.tsx
+++ b/x-pack/plugins/security_solution/public/common/components/landing_page/onboarding/sections.tsx
@@ -111,10 +111,6 @@ export const sections: Section[] = [
         steps: createProjectSteps,
         hideSteps: true,
       },
-      {
-        id: QuickStartSectionCardsId.watchTheOverviewVideo,
-        steps: overviewVideoSteps,
-      },
     ],
   },
   {
diff --git a/x-pack/plugins/security_solution/public/common/constants.ts b/x-pack/plugins/security_solution/public/common/constants.ts
index 62ac21424d604..8590646082a9c 100644
--- a/x-pack/plugins/security_solution/public/common/constants.ts
+++ b/x-pack/plugins/security_solution/public/common/constants.ts
@@ -16,3 +16,5 @@ export const RISK_SCORE_LOW = 21;
 export const RISK_SCORE_MEDIUM = 47;
 export const RISK_SCORE_HIGH = 73;
 export const RISK_SCORE_CRITICAL = 99;
+
+export const INGESTION_HUB_VIDEO_SOURCE = '//play.vidyard.com/K6kKDBbP9SpXife9s2tHNP.html?';
diff --git a/x-pack/plugins/security_solution_ess/public/onboarding/onboarding.ts b/x-pack/plugins/security_solution_ess/public/onboarding/onboarding.ts
index 3bcde37f4c75d..a5e32e25644bb 100644
--- a/x-pack/plugins/security_solution_ess/public/onboarding/onboarding.ts
+++ b/x-pack/plugins/security_solution_ess/public/onboarding/onboarding.ts
@@ -15,7 +15,14 @@ import {
 import type { Services } from '../common/services';
 
 export const setOnboardingSettings = (services: Services) => {
-  const { securitySolution } = services;
+  const {
+    securitySolution,
+    application: { getUrlForApp },
+  } = services;
+
+  securitySolution.setOnboardingPageSettings.setUsersUrl(
+    getUrlForApp('management', { path: 'security/users' })
+  );
 
   securitySolution.setOnboardingPageSettings.setAvailableSteps([
     OverviewSteps.getToKnowElasticSecurity,
diff --git a/x-pack/plugins/security_solution_serverless/public/plugin.ts b/x-pack/plugins/security_solution_serverless/public/plugin.ts
index 8ea73d406cb3e..9bc7df9972b5c 100644
--- a/x-pack/plugins/security_solution_serverless/public/plugin.ts
+++ b/x-pack/plugins/security_solution_serverless/public/plugin.ts
@@ -78,6 +78,9 @@ export class SecuritySolutionServerlessPlugin
     securitySolution.setOnboardingPageSettings.setProjectsUrl(
       getCloudUrl('projects', services.cloud)
     );
+    securitySolution.setOnboardingPageSettings.setUsersUrl(
+      getCloudUrl('usersAndRoles', services.cloud)
+    );
     setOnboardingSettings(services);
     startNavigation(services);
 
diff --git a/x-pack/test_serverless/functional/services/svl_sec_navigation.ts b/x-pack/test_serverless/functional/services/svl_sec_navigation.ts
index c990258cd8060..bde44125d142f 100644
--- a/x-pack/test_serverless/functional/services/svl_sec_navigation.ts
+++ b/x-pack/test_serverless/functional/services/svl_sec_navigation.ts
@@ -19,7 +19,7 @@ export function SvlSecNavigationServiceProvider({
     async navigateToLandingPage() {
       await retry.tryForTime(60 * 1000, async () => {
         await PageObjects.common.navigateToApp('landingPage');
-        await testSubjects.existOrFail('welcome-header', { timeout: 2000 });
+        await testSubjects.existOrFail('data-ingestion-hub-header', { timeout: 2000 });
       });
     },
   };