diff --git a/src/components/Connection/ConnectionResult.tsx b/src/components/Connection/ConnectionResult.tsx
index 9b84097baf41dae29cf645dd15d3da9f65cec260..60740d100b40f11a1c9ea0ef2548fdf3b4922d45 100644
--- a/src/components/Connection/ConnectionResult.tsx
+++ b/src/components/Connection/ConnectionResult.tsx
@@ -132,7 +132,6 @@ const ConnectionResult: React.FC<ConnectionResultProps> = ({
             dataConsent: true,
             pdlConfirm: true,
             shouldLaunchAccount: true,
-            openSGEForm: false,
           })
         )
         dispatch(setShouldRefreshConsent(true))
diff --git a/src/components/Connection/SGEConnect/SgeConnect.scss b/src/components/Connection/SGEConnect/SgeConnect.scss
index 7a02ec9d467ca437008c501eb6db0d8d3294b179..cc76bd39863df6426034ce80897757cbc033b146 100644
--- a/src/components/Connection/SGEConnect/SgeConnect.scss
+++ b/src/components/Connection/SGEConnect/SgeConnect.scss
@@ -3,26 +3,13 @@
 @import 'src/styles/base/breakpoint';
 
 .sge-view {
+  box-sizing: border-box;
+  min-height: inherit;
+  width: inherit;
   display: flex;
+  flex: 1;
   flex-direction: column;
   justify-content: space-between;
-  background: $dark-light-2;
-  transition: all 0.5s ease-in;
-  position: fixed;
-  z-index: 25;
-  top: 4rem;
-  width: 100%;
-  height: 92vh;
-  overflow-y: auto;
-  overscroll-behavior: contain;
-  @media (min-width: $width-large-phone) {
-    top: 8rem;
-    height: 85vh;
-  }
-  @media (min-width: $width-tablet) {
-    width: 85%;
-  }
-
   .sge-container {
     padding: 1rem;
 
diff --git a/src/components/Connection/SGEConnect/SgeConnectView.tsx b/src/components/Connection/SGEConnect/SgeConnectView.tsx
index 1f5cbf4592e9c7e4a2e8784ed913d357f6fd4d03..4097240cce25b7bd4b5893985a8af81018003a7e 100644
--- a/src/components/Connection/SGEConnect/SgeConnectView.tsx
+++ b/src/components/Connection/SGEConnect/SgeConnectView.tsx
@@ -131,20 +131,11 @@ const SgeConnectView: React.FC = () => {
 
   return (
     <>
-      <CozyBar
-        titleKey={'common.title_sge_connect'}
-        displayBackArrow={true}
-        backFunction={() =>
-          dispatch(updateSgeStore({ ...sgeConnect, openSGEForm: false }))
-        }
-      />
+      <CozyBar titleKey={'common.title_sge_connect'} displayBackArrow={true} />
       <Header
         setHeaderHeight={defineHeaderHeight}
         desktopTitleKey={'common.title_sge_connect'}
         displayBackArrow={true}
-        backFunction={() =>
-          dispatch(updateSgeStore({ ...sgeConnect, openSGEForm: false }))
-        }
       ></Header>
       <Content height={headerHeight}>
         <div className="sge-view">
diff --git a/src/components/Connection/SGEConnect/SgeInit.spec.tsx b/src/components/Connection/SGEConnect/SgeInit.spec.tsx
index 0438327f0d93240f2ff0bee1ac8e7be70d105146..8755cca5bb3038b261b16375203bf7e596b27026 100644
--- a/src/components/Connection/SGEConnect/SgeInit.spec.tsx
+++ b/src/components/Connection/SGEConnect/SgeInit.spec.tsx
@@ -5,7 +5,6 @@ import { GlobalState } from 'models/global.model'
 import React from 'react'
 import { Provider } from 'react-redux'
 import configureStore from 'redux-mock-store'
-import { UpdateSGEConnect } from 'store/global/global.actions'
 import {
   fluidStatusData,
   SgeStatusWithAccount,
@@ -65,8 +64,7 @@ describe('SgeInit component', () => {
       </Provider>
     )
     wrapper.find(Button).first().simulate('click')
-    const updateSGEConnectAction: UpdateSGEConnect = store.getActions()[0]
-    expect(updateSGEConnectAction.payload?.openSGEForm).toBeTruthy()
+    expect(mockHistoryPush).toHaveBeenCalled()
   })
   it('should launch account and trigger creation process', async () => {
     const store = mockStore({
diff --git a/src/components/Connection/SGEConnect/SgeInit.tsx b/src/components/Connection/SGEConnect/SgeInit.tsx
index 6767e15ccf3caa149b1aec4709af8681aae99f01..6cf6b71d6aa9bd30671109c483c966268de70f5f 100644
--- a/src/components/Connection/SGEConnect/SgeInit.tsx
+++ b/src/components/Connection/SGEConnect/SgeInit.tsx
@@ -6,6 +6,7 @@ import { useI18n } from 'cozy-ui/transpiled/react/I18n'
 import { Account, FluidStatus } from 'models'
 import React, { useEffect } from 'react'
 import { useDispatch, useSelector } from 'react-redux'
+import { useHistory } from 'react-router-dom'
 import { AppStore } from 'store'
 import {
   setShouldRefreshConsent,
@@ -18,6 +19,7 @@ interface SgeInitProps {
 
 const SgeInit: React.FC<SgeInitProps> = ({ fluidStatus }: SgeInitProps) => {
   const { t } = useI18n()
+  const history = useHistory()
   const konnectorSlug: string = fluidStatus.connection.konnectorConfig.slug
   const account: Account | null = fluidStatus.connection.account
   const { sgeConnect } = useSelector((state: AppStore) => state.ecolyo.global)
@@ -54,7 +56,7 @@ const SgeInit: React.FC<SgeInitProps> = ({ fluidStatus }: SgeInitProps) => {
         <Button
           aria-label={t(`auth.${konnectorSlug}.accessibility.connect`)}
           onClick={() => {
-            dispatch(updateSgeStore({ ...sgeConnect, openSGEForm: true }))
+            history.push('/sge-connect')
           }}
           classes={{
             root: 'btn-highlight',
diff --git a/src/components/Connection/SGEConnect/__snapshots__/SgeConnectView.spec.tsx.snap b/src/components/Connection/SGEConnect/__snapshots__/SgeConnectView.spec.tsx.snap
index b3f663e1a20eac8ead33825146066f2ca829e2a6..f942fe39679b7581059f24af1d030026f0da57ff 100644
--- a/src/components/Connection/SGEConnect/__snapshots__/SgeConnectView.spec.tsx.snap
+++ b/src/components/Connection/SGEConnect/__snapshots__/SgeConnectView.spec.tsx.snap
@@ -15,7 +15,6 @@ exports[`SgeConnectView component should be rendered correctly 1`] = `
 >
   <SgeConnectView>
     <CozyBar
-      backFunction={[Function]}
       displayBackArrow={true}
       titleKey="common.title_sge_connect"
     >
@@ -339,7 +338,6 @@ exports[`SgeConnectView component should be rendered correctly 1`] = `
       </BarRight>
     </CozyBar>
     <Header
-      backFunction={[Function]}
       desktopTitleKey="common.title_sge_connect"
       displayBackArrow={true}
       setHeaderHeight={[Function]}
diff --git a/src/components/Header/Header.tsx b/src/components/Header/Header.tsx
index 49a4fc643c9eedaea8a402beccc410536e74e511..3a469698acd1c2763813fac605baae53afe10cfe 100644
--- a/src/components/Header/Header.tsx
+++ b/src/components/Header/Header.tsx
@@ -1,15 +1,16 @@
-import IconButton from '@material-ui/core/IconButton'
-import BackArrowIcon from 'assets/icons/ico/back-arrow.svg'
-import FeedbackIcon from 'assets/icons/ico/feedback.svg'
-import { useI18n } from 'cozy-ui/transpiled/react/I18n'
-import Icon from 'cozy-ui/transpiled/react/Icon'
-import { ScreenType } from 'enum/screen.enum'
 import React, { useCallback, useEffect, useRef } from 'react'
-import { useDispatch, useSelector } from 'react-redux'
-import { useHistory } from 'react-router-dom'
+import './header.scss'
+import { useI18n } from 'cozy-ui/transpiled/react/I18n'
+import { useSelector, useDispatch } from 'react-redux'
 import { AppStore } from 'store'
 import { updateModalIsFeedbacksOpen } from 'store/modal/modal.actions'
-import './header.scss'
+import { useHistory } from 'react-router-dom'
+
+import { ScreenType } from 'enum/screen.enum'
+import BackArrowIcon from 'assets/icons/ico/back-arrow.svg'
+import FeedbackIcon from 'assets/icons/ico/feedback.svg'
+import Icon from 'cozy-ui/transpiled/react/Icon'
+import IconButton from '@material-ui/core/IconButton'
 
 interface HeaderProps {
   textKey?: string
diff --git a/src/components/Header/header.scss b/src/components/Header/header.scss
index 1a73a5fe52558e97cdde7e43a0f59b8748042f00..58b400875df97adae6f402c919734b5db7e52a09 100644
--- a/src/components/Header/header.scss
+++ b/src/components/Header/header.scss
@@ -22,17 +22,17 @@
       $dark-2 100%
     );
     width: 100%;
-    display: flex;
-    justify-content: flex-end;
     .header-text {
       padding: 0 1rem 1rem 1rem;
       color: $grey-bright;
     }
   }
   .header-content {
-    width: 85%;
+    margin: 0 0 0 220px;
+    display: flex;
+    flex-direction: column;
     @media #{$tablet} {
-      width: 100%;
+      margin: 0;
     }
     @media #{$large-phone} {
       margin: 60px 0 0 0;
diff --git a/src/components/Home/ConsumptionView.spec.tsx b/src/components/Home/ConsumptionView.spec.tsx
index ad546465a3ec149c2e0bce52ae1376807c510366..70fd20ef2754ecc0ba5ad327de48470c77503f11 100644
--- a/src/components/Home/ConsumptionView.spec.tsx
+++ b/src/components/Home/ConsumptionView.spec.tsx
@@ -346,29 +346,4 @@ describe('ConsumptionView component', () => {
     )
     expect(wrapper.find('mock-releasenotes').exists()).toBeTruthy()
   })
-
-  it('should render SGE connect form', () => {
-    useSelectorSpy.mockReturnValue({
-      chart: {
-        currentTimeStep: TimeStep.WEEK,
-        loading: true,
-      },
-      global: {
-        fluidStatus: mockInitialEcolyoState.global.fluidStatus,
-        releaseNotes: mockInitialEcolyoState.global.releaseNotes,
-        sgeConnect: {
-          openSGEForm: true,
-        },
-        openPartnersIssueModal: mockedPartnersIssueModal,
-      },
-    })
-    useDispatchSpy.mockReturnValue(jest.fn())
-    mockUpdateProfile.mockResolvedValue(mockTestProfile1)
-    const wrapper = mount(
-      <Provider store={store}>
-        <ConsumptionView fluidType={FluidType.ELECTRICITY} />
-      </Provider>
-    )
-    expect(wrapper.find('mock-SgeConnectView').exists()).toBeTruthy()
-  })
 })
diff --git a/src/components/Home/ConsumptionView.tsx b/src/components/Home/ConsumptionView.tsx
index a511cd05eb9250cacde7c58d5c1bd9ce427e418b..c16b6ce740a524f091fd55dd4262b36371344efb 100644
--- a/src/components/Home/ConsumptionView.tsx
+++ b/src/components/Home/ConsumptionView.tsx
@@ -1,6 +1,5 @@
 import classNames from 'classnames'
 import ExpiredConsentModal from 'components/Connection/ExpiredConsentModal'
-import SgeConnectView from 'components/Connection/SGEConnect/SgeConnectView'
 import Content from 'components/Content/Content'
 import CustomPopupModal from 'components/CustomPopup/CustomPopupModal'
 import DateNavigator from 'components/DateNavigator/DateNavigator'
@@ -21,7 +20,7 @@ import { useDispatch, useSelector } from 'react-redux'
 import { useHistory } from 'react-router-dom'
 import ProfileService from 'services/profile.service'
 import { AppStore } from 'store'
-import { setCurrentTimeStep } from 'store/chart/chart.actions'
+import { setCurrentTimeStep, setLoading } from 'store/chart/chart.actions'
 import {
   setCustomPopup,
   setPartnersIssue,
@@ -52,7 +51,6 @@ const ConsumptionView: React.FC<ConsumptionViewProps> = ({
       releaseNotes,
       customPopupModal,
       openPartnersIssueModal,
-      sgeConnect,
     },
   } = useSelector((state: AppStore) => state.ecolyo)
 
@@ -156,6 +154,10 @@ const ConsumptionView: React.FC<ConsumptionViewProps> = ({
     }
   }, [dispatch, fluidType, currentTimeStep, fluidStatus])
 
+  useEffect(() => {
+    dispatch(setLoading(true))
+  }, [dispatch])
+
   useEffect(() => {
     let subscribed = true
     const expiredConsents: FluidType[] = []
@@ -238,7 +240,6 @@ const ConsumptionView: React.FC<ConsumptionViewProps> = ({
           </div>
         )}
       </Content>
-      {sgeConnect?.openSGEForm && <SgeConnectView />}
       {/* Partner issue modals for individual fluids */}
       {fluidStatus
         .filter(fluid => fluid.maintenance)
diff --git a/src/components/Konnector/KonnectorModalFooter.tsx b/src/components/Konnector/KonnectorModalFooter.tsx
index 81a92f638ec1053567e2bb8e89ac47f0c5049c0d..e476536b4972a3c12b910fccd23ed7f62bfb0421 100644
--- a/src/components/Konnector/KonnectorModalFooter.tsx
+++ b/src/components/Konnector/KonnectorModalFooter.tsx
@@ -9,6 +9,7 @@ import { FluidType } from 'enum/fluid.enum'
 import { KonnectorError } from 'enum/konnectorError.enum'
 import { Account } from 'models'
 import React, { useCallback } from 'react'
+import { useHistory } from 'react-router-dom'
 import AccountService from 'services/account.service'
 import './konnectorModal.scss'
 
@@ -33,17 +34,20 @@ const KonnectorModalFooter: React.FC<KonnectorModalFooterProps> = ({
 }: KonnectorModalFooterProps) => {
   const { t } = useI18n()
   const client = useClient()
+  const history = useHistory()
   const handleSGELoginRetry = useCallback(() => {
     handleCloseClick(state === SUCCESS_EVENT)
-  }, [handleCloseClick, state])
+    history.push('/sge-connect')
+  }, [handleCloseClick, history, state])
 
   const handleResetSGEAccount = useCallback(async () => {
     if (account) {
       const accountService = new AccountService(client)
       await accountService.deleteAccount(account)
       await handleAccountDeletion()
+      history.push('/sge-connect')
     }
-  }, [account, client, handleAccountDeletion])
+  }, [account, client, handleAccountDeletion, history])
 
   const errorButtons = () => {
     switch (error) {
diff --git a/src/components/Konnector/KonnectorViewerCard.tsx b/src/components/Konnector/KonnectorViewerCard.tsx
index 0569d12be1539d66922f22a7ef69f0d007c27f78..5bc0ce5666a1486ee5688c10afd2556298e66ffc 100644
--- a/src/components/Konnector/KonnectorViewerCard.tsx
+++ b/src/components/Konnector/KonnectorViewerCard.tsx
@@ -24,7 +24,6 @@ import {
   setFluidStatus,
   toggleChallengeDuelNotification,
   updatedFluidConnection,
-  updateSgeStore,
 } from 'store/global/global.actions'
 import { getAddPicto, getParamPicto } from 'utils/picto'
 import './konnectorViewerCard.scss'
@@ -425,21 +424,6 @@ const KonnectorViewerCard: React.FC<KonnectorViewerCardProps> = ({
     deleteAccountForConsentRefresh()
   }, [account, client, handleAccountDeletion, shouldRefreshConsent])
 
-  /** Closes SGE form if opened */
-  const closeSGEForm = useCallback(() => {
-    if (sgeConnect.openSGEForm) {
-      dispatch(
-        updateSgeStore({
-          ...sgeConnect,
-          openSGEForm: false,
-          // switch to false in case the form fails and the user have to give its consent again
-          dataConsent: false,
-          pdlConfirm: false,
-        })
-      )
-    }
-  }, [dispatch, sgeConnect])
-
   useEffect(() => {
     let subscribed = true
     async function getData() {
@@ -455,7 +439,6 @@ const KonnectorViewerCard: React.FC<KonnectorViewerCardProps> = ({
 
         const connectionFlow = new ConnectionFlow(client, trigger, konnector)
         await connectionFlow.launch()
-        closeSGEForm()
         connectionFlow.jobWatcher.on(ERROR_EVENT, () => {
           sendUsageEventError(fluidSlug, fluidStatus.lastDataDate === null)
           setKonnectorErrorDescription(connectionFlow.jobWatcher.on()._error)
@@ -495,7 +478,6 @@ const KonnectorViewerCard: React.FC<KonnectorViewerCardProps> = ({
     fluidSlug,
     sendUsageEventSuccess,
     shouldRefreshConsent,
-    closeSGEForm,
   ])
 
   return (
diff --git a/src/components/Routes/Routes.tsx b/src/components/Routes/Routes.tsx
index 2bcfc4fa87e609f8707a3e2d1711757bac39f4e2..28abfb02836537154edfc4cae16917a580311987 100644
--- a/src/components/Routes/Routes.tsx
+++ b/src/components/Routes/Routes.tsx
@@ -1,5 +1,6 @@
 import ActionView from 'components/Action/ActionView'
 import ChallengeView from 'components/Challenge/ChallengeView'
+import SgeConnectView from 'components/Connection/SGEConnect/SgeConnectView'
 import DuelView from 'components/Duel/DuelView'
 import EcogestureFormView from 'components/EcogestureForm/EcogestureFormView'
 import EcogestureSelection from 'components/EcogestureSelection/EcogestureSelection'
@@ -58,6 +59,7 @@ const Routes: React.FC<RouteProps> = ({ termsStatus }: RouteProps) => {
           <ConsumptionView fluidType={FluidType.MULTIFLUID} />
         </Route>
 
+        <Route path={`/sge-connect`} component={SgeConnectView} />
         <Route path={`/challenges/duel`} component={DuelView} />
         <Route path={`/challenges/quiz`} component={QuizView} />
         <Route path={`/challenges/exploration`} component={ExplorationView} />
diff --git a/src/models/sgeStore.model.ts b/src/models/sgeStore.model.ts
index 9a28f5c6f7dea6cf4a652367323d7bcc8d156466..59b30d9f42f3b5e912b4ad5b43838ce240e8f84e 100644
--- a/src/models/sgeStore.model.ts
+++ b/src/models/sgeStore.model.ts
@@ -9,5 +9,4 @@ export interface SgeStore {
   dataConsent: boolean
   pdlConfirm: boolean
   shouldLaunchAccount: boolean
-  openSGEForm: boolean
 }
diff --git a/src/store/global/global.reducer.ts b/src/store/global/global.reducer.ts
index 3c85abf91abe9478d68242e15d0d0a0a8e723244..848faf512645af8b0dc5798479555daf8672fd2a 100644
--- a/src/store/global/global.reducer.ts
+++ b/src/store/global/global.reducer.ts
@@ -131,7 +131,6 @@ const initialState: GlobalState = {
     dataConsent: false,
     pdlConfirm: false,
     shouldLaunchAccount: false,
-    openSGEForm: false,
   },
 }
 
diff --git a/src/styles/base/_layout.scss b/src/styles/base/_layout.scss
index 63369debd4a3f418c3b063be15c330ce58711b52..977aa5666dd3e1b703ae9ea0b95e787f1fdb0988 100644
--- a/src/styles/base/_layout.scss
+++ b/src/styles/base/_layout.scss
@@ -45,6 +45,76 @@ body {
   color: #32363f;
 }
 
+.header {
+  display: flex;
+  align-items: center;
+  flex-direction: column;
+  overflow: hidden;
+  width: 100%;
+  z-index: $z-header;
+  position: fixed;
+  top: 48px;
+  left: 0;
+  @media #{$large-phone} {
+    top: 0;
+  }
+  .header-top {
+    background: radial-gradient(
+      circle,
+      rgba(52, 54, 65, 1) 0%,
+      rgba(27, 28, 34, 1) 100%
+    );
+    width: 100%;
+    .header-text {
+      padding: 0 1rem 1rem 1rem;
+      color: $grey-bright;
+    }
+  }
+  .header-content {
+    margin: 0 0 0 220px;
+    display: flex;
+    flex-direction: column;
+    @media #{$tablet} {
+      margin: 0;
+    }
+    @media #{$large-phone} {
+      margin: 60px 0 0 0;
+    }
+    .header-content-top {
+      display: flex;
+      flex-direction: row;
+      &.header-content-top-right {
+        justify-content: flex-end;
+      }
+      .header-text {
+        padding: 2rem 1rem;
+        flex: 1;
+      }
+      .header-text-desktop {
+        display: flex;
+        flex: 1;
+        padding: 2rem 1.25rem;
+        color: $grey-bright;
+      }
+      .header-back-button {
+        padding: 0 0.75rem;
+      }
+      @media #{$large-phone} {
+        .header-text {
+          padding: 0 1rem 1rem 1rem;
+          color: $grey-bright;
+        }
+        .header-text-desktop {
+          display: none;
+        }
+        .header-feedbacks-button {
+          display: none;
+        }
+      }
+    }
+  }
+}
+
 .content-view-loading {
   height: 80vh;
   width: 100%;
diff --git a/tests/__mocks__/store.ts b/tests/__mocks__/store.ts
index 1ea3561a1304fcfb2ffe808370a0204707b4d4e2..a15e2e8033492356d231641805c5d913a0aa1fe2 100644
--- a/tests/__mocks__/store.ts
+++ b/tests/__mocks__/store.ts
@@ -135,7 +135,6 @@ export const mockInitialGlobalState: GlobalState = {
     pdlConfirm: false,
     zipCode: null,
     shouldLaunchAccount: false,
-    openSGEForm: false,
   },
 }
 export const mockExpiredElec: FluidStatus = {