+ );
+};
+
+export default ProfileMenuStartupName;
diff --git a/FrontEnd/src/components/ProfileView/ProfileMenu/ProfileMenuStartup/ProfileMenuStartup.module.css b/FrontEnd/src/components/ProfileView/ProfileMenu/ProfileMenuStartup/ProfileMenuStartup.module.css
new file mode 100644
index 000000000..c46cdd678
--- /dev/null
+++ b/FrontEnd/src/components/ProfileView/ProfileMenu/ProfileMenuStartup/ProfileMenuStartup.module.css
@@ -0,0 +1,87 @@
+.profile-menu-startup-block {
+ display: flex;
+ flex-direction: column;
+ align-items: flex-start;
+ gap: 24px;
+ border-radius: 8px;
+}
+.profile-menu-startup-main {
+ display: flex;
+ flex-direction: column;
+ align-items: flex-start;
+ gap: 12px;
+}
+.profile-menu-startup-main__title {
+ display: flex;
+ flex-direction: column;
+ align-items: flex-start;
+ align-self: stretch;
+ box-shadow: 0 4px 8px 0 rgba(65, 64, 69, 0.10);
+}
+.profile-menu-startup-main__title-block {
+ display: flex;
+ padding: 8px 12px;
+ align-items: flex-start;
+ gap: 10px;
+ align-self: stretch;
+ border-radius: 4px;
+}
+.profile-menu-startup-main__title-text {
+ width: 742px;
+ color: #25292C;
+ font-family: Inter, sans-serif;
+ font-size: 16px;
+ font-style: normal;
+ font-weight: 700;
+ line-height: 20px; /* 125% */
+ text-transform: uppercase;
+}
+.profile-menu-startup-main__content {
+ display: flex;
+ padding: 12px;
+ flex-direction: column;
+ align-items: flex-start;
+ gap: 12px;
+}
+.profile-menu-main__content-block {
+ display: flex;
+ flex-direction: column;
+ align-items: flex-start;
+ gap: 12px;
+}
+.profile-menu-main__content-block-title {
+ color: #25292C;
+ font-feature-settings: 'calt' off;
+ font-family: Inter, sans-serif;
+ font-size: 16px;
+ font-style: normal;
+ font-weight: 600;
+ line-height: 20px; /* 125% */
+ letter-spacing: -0.16px;
+}
+.profile-menu-main__content-block-text {
+ width: 776px;
+ color: #25292C;
+ font-feature-settings: 'calt' off;
+ font-family: Inter, sans-serif;
+ font-size: 14px;
+ font-style: normal;
+ font-weight: 400;
+ line-height: 22px; /* 157.143% */
+ letter-spacing: -0.14px;
+}
+.profile-startup-divider {
+ align-self: stretch;
+ height: 1px;
+ background: #DEE1E8;
+}
+.profile-menu-more-text {
+ color: #1F9A7C;
+ font-feature-settings: 'calt' off;
+ font-family: Inter, sans-serif;
+ font-size: 14px;
+ font-style: normal;
+ font-weight: 400;
+ line-height: 22px;
+ letter-spacing: -0.14px;
+}
diff --git a/FrontEnd/src/components/ProfileView/ProfileMenu/ProfileText.jsx b/FrontEnd/src/components/ProfileView/ProfileMenu/ProfileText.jsx
new file mode 100644
index 000000000..ef77c0f3f
--- /dev/null
+++ b/FrontEnd/src/components/ProfileView/ProfileMenu/ProfileText.jsx
@@ -0,0 +1,24 @@
+export const profileInfo = {
+ more: "читати далі",
+ sections: [
+ {
+ about1: "«Ace&W by Stakhovsky» – авторське вино від легенди українського тенісу Сергія Стаховського!\n" +
+ "Опанувати виноробство українець вирішив наприкінці 2015 року – після тривалої роботи у Франції. Саме тоді видатний тенісист Сергій Стаховський узяв в оренду 20 гектарів землі на Закарпатті та почав вирощувати мерло, сапераві й трамінер рожевий. Опанувати виноробство українець вирішив наприкінці 2015 року – після тривалої роботи у Франції. Два роки команда Stakhovsky wines культивувала ґрунт, пересаджувала виноград, поливала. І лише у 2018-му новоспечений винороб зібрав свій перший уро... ",
+ about2: "Опанувати виноробство українець вирішив наприкінці 2015 року – після тривалої роботи у Франції. Саме тоді видатний тенісист Сергій Стаховський узяв в оренду 20 гектарів землі на Закарпатті та почав вирощувати мерло, сапераві й трамінер рожевий. Опанувати виноробство українець вирішив наприкінці 2015 року – після тривалої роботи у Франції. Два роки команда Stakhovsky wines культивувала ґрунт, пересаджувала виноград, поливала. І лише у 2018-му новоспечений винороб зібравІ лише у 2018-му новоспечений винороб зібрав свій перший урожай...",
+ about3: "“Good to the Last Drop”"
+ },
+ {
+ startup1: "Опанувати виноробство українець вирішив наприкінці 2015 року – після тривалої роботи у Франції. Саме тоді видатний тенісист Сергій Стаховський узяв в оренду 20 гектарів землі на Закарпатті та почав вирощувати мерло, сапераві й трамінер рожевий.",
+ startup2: "150 000 тисяч (грн)",
+ startup3: "Що може бути банальнішим за черговий маркетплейс.\n" +
+ "Що може бути банальнішим за черговий маркетплейс.\n" +
+ "Що може бути банальнішим за черговий маркетплейс.",
+ startup4: "Опанувати виноробство українець вирішив наприкінці 2015 року – після тривалої роботи у Франції. Саме тоді видатний тенісист Сергій Стаховський узяв в оренду 20 гектарів землі на Закарпатті та почав вирощувати мерло, сапераві й трамінер рожевий. Опанувати виноробство українець вирішив наприкінці 2015 року – після тривалої роботи у Франції. Два роки команда Stakhovsky wines культивувала ґрунт, пересаджувала виноград, поливала. І лише у 2018-му новоспечений винороб зібравІ лише у 2018-му новоспечений винороб зібрав свій перший урожай...",
+ startup5: "Опанувати виноробство українець вирішив наприкінці 2015 року – після тривалої роботи у Франції. Саме тоді видатний тенісист Сергій Стаховський узяв в оренду 20 гектарів землі на Закарпатті та почав вирощувати мерло, сапераві й трамінер рожевий.",
+ },
+ {
+ services1: "Що може бути банальнішим за черговий маркетплейс? Однак, відкриття нового торгового інтернет-майданчика лише на перший погляд здається поганою ідеєю. ",
+
+ }
+ ]
+};
diff --git a/FrontEnd/src/components/ProfileView/ProfileNavBar/ProfileNavBar.jsx b/FrontEnd/src/components/ProfileView/ProfileNavBar/ProfileNavBar.jsx
new file mode 100644
index 000000000..2e47724f0
--- /dev/null
+++ b/FrontEnd/src/components/ProfileView/ProfileNavBar/ProfileNavBar.jsx
@@ -0,0 +1,61 @@
+import React, { Component } from "react";
+import classes from "./ProfileNavBar.module.css";
+
+class ProfileNavBar extends Component {
+ constructor(props) {
+ super(props);
+ this.state = {
+ activeIndex: 0,
+ };
+ }
+
+ onMenuItemClick = (index) => {
+ this.setState({ activeIndex: index });
+
+ const anchors = ["about-company", "startup", "goods-services", "logistics", "cooperation"];
+ const targetAnchorId = anchors[index];
+ const targetAnchor = document.getElementById(targetAnchorId);
+
+ if (targetAnchor) {
+ window.scrollTo({
+ top: targetAnchor.offsetTop,
+ behavior: "smooth",
+ });
+ }
+ };
+
+ renderMenuItem = (text, index) => {
+ const { activeIndex } = this.state;
+ const isActive = activeIndex === index;
+ const menuItemClass = isActive ? classes["active-nav-bar-item"] : classes["inactive-nav-bar-item"];
+ const dividerClass = isActive ? classes["active-divider"] : classes["inactive-divider"];
+
+ return (
+