terminando de fazer a barra de progresso da pagina de cadastro

src/pages/RegistrationCompany/RegistrationCompany.style.ts

@@ -0,0 +1,78 @@
+import { ComponentProps } from 'react';
+import styled from 'styled-components';
+
+
+export const CardMain=styled.div`
+    display:flex;
+    justify-content:center;
+    align-items: center;
+
+`
+export const CardRegistration = styled.div`
+    display:flex;
+    justify-content:space-around;
+    align-items: center;
+    flex-direction: column;
+    margin-top:9.5rem;
+    margin-bottom: 9.5rem;
+    width:960px;
+    min-height: 87.8125rem;
+    border: 1px solid black;
+    border-radius: 1.4956rem;
+
+    h2{
+    font-size:40px;
+    }
+
+
+
+
+
+`
+export const HeaderCardRegistration=styled.div`
+    width: 100%;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    height: 120px;
+    justify-content: space-around;
+
+`
+
+export const Progression=styled.div`
+    display: flex;
+    flex-direction: column;
+    width: 100%;
+
+    img{
+        width: 789px;
+        heigth:25px;
+        align-self: center;    
+    }
+
+
+
+
+`
+export const Description= styled.div`
+        display:flex;
+        font-size:12px;
+        width: 100%;
+        justify-content: space-evenly;
+
+
+        span{
+        width:160px;
+        text-align:center;
+        }
+
+        .CompletedSpan{
+         text-align: right;
+         padding-right:40px;
+        }
+`
+export const FontWeightStep=styled.span`
+    font-weight:700;
+
+
+`

src/pages/RegistrationCompany/index.tsx

@@ -0,0 +1,42 @@
+import { zodResolver } from '@hookform/resolvers/zod';
+import { FormProvider, useForm } from 'react-hook-form';
+import { CardRegistration,CardMain, Progression, HeaderCardRegistration, Description, FontWeightStep,  } from "./RegistrationCompany.style"
+
+
+export default function RegistrationCompany(){
+
+    return(<>
+        <CardMain>
+            <CardRegistration>
+
+               <HeaderCardRegistration>
+                    <h2 >Cadastre-se!</h2>
+                    <Progression>
+                        <img  src="src/pages/RegistrationCompany/Property 1=Default.png" alt="barra de progresso" />
+                        <Description>
+                            <FontWeightStep>Dados da empresa</FontWeightStep>
+                            <span>Especificações da empresa</span>
+                            <span>Envio de documentos</span>
+                            <span>Aguardando aprovação</span>
+                            <span className="CompletedSpan">Concluido</span>
+                        </Description> 
+                    </Progression>
+
+               </HeaderCardRegistration>
+
+
+
+                <div>
+                    <h3>Vamos começar!</h3>
+                    <h4>Digite os dados da empresa.</h4>
+                    <p>*Dados obrigatorios</p>
+
+                </div>
+
+
+
+
+            </CardRegistration>
+        </CardMain>
+    </>)
+}

src/routes/public.routes.tsx

@@ -8,6 +8,7 @@ import NotFound404 from '../pages/NotFound404';
 import PurchaseConfirmation from '../pages/PurchaseConfirmation';
 import Restaurant from '../pages/Restaurant';
 import Restaurants from '../pages/Restaurants';
+import RegistrationCompany from '../pages/RegistrationCompany';
 import { Welcome } from '../pages/welcome';
 
 export function PublicRoutes() {
@@ -20,11 +21,13 @@ export function PublicRoutes() {
 				<Route path='faq' element={<Faq />} />
 				<Route path='conclua-sua-compra' element={<PurchaseConfirmation />} />
 				<Route path='carrinho' element={<Cart />} />
+				<Route path='cadastre-sua-empresa' element={<RegistrationCompany/>}/>
 				<Route
 					path='*'
 					element={<NotFound404 />}
 					errorElement={<NotFound404 />}
 				/>
+
 			</Route>
 		</Routes>
 	);