feat: add start section

src/pages/home/home.module.scss

@@ -0,0 +1,106 @@
+.Start {
+  padding: 0px 160px 0px;
+
+  &_BgWrapper {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100vw;
+    height: 900px;
+    z-index: -1;
+
+    & img {
+      object-fit: cover;
+      filter: brightness(0.5);
+    }
+  }
+}
+
+.Header {
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+  align-items: center;
+  border-bottom: 1px solid $color-white;
+  height: 80px;
+
+  .Logo {
+    color: $color-white;
+  }
+
+  .Buttons {
+    color: $color-white;
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    gap: 30px;
+
+    .Icon {
+      width: 60px;
+      height: 60px;
+      cursor: pointer;
+    }
+
+    .Button {
+      display: flex;
+      flex-direction: row;
+      gap: 16px;
+      height: 48px;
+      padding: 24px;
+    }
+  }
+}
+
+.Info {
+  display: flex;
+  flex-direction: row;
+  padding: 160px 0 200px;
+
+  .Content {
+    display: flex;
+    flex-direction: column;
+    justify-content: flex-start;
+    gap: 60px;
+
+    .Title {
+      font-family: $font-open-sans;
+      font-weight: $font-regular;
+      font-size: 60px;
+      line-height: 1;
+      color: $color-white;
+      max-width: 960px;
+    }
+
+    .List {
+      display: flex;
+      flex-direction: column;
+      justify-content: flex-start;
+      gap: 16px;
+    }
+
+    .ListItem {
+      font-family: $font-open-sans;
+      font-weight: $font-semi-bold;
+      font-size: 26px;
+      line-height: 1;
+      color: $color-white;
+    }
+  }
+
+  .Phone {
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+    flex-basis: 40%;
+    gap: 40px;
+
+    .Title {
+      font-family: $font-open-sans;
+      font-weight: $font-semi-bold;
+      font-size: 60px;
+      line-height: 1;
+      color: $color-white;
+    }
+  }
+}

src/pages/home/home.tsx

@@ -0,0 +1,57 @@
+import s from './home.module.scss';
+import { Button } from '@shared/ui';
+import waIcon from '@public/svg/whatsapp.svg';
+import tgIcon from '@public/svg/telegram.svg';
+import callBtn from '@public/svg/phone-calling.svg';
+import bgStart from '@public/images/bg-start-desktop.jpg';
+import Image from 'next/image';
+
+export default function Home() {
+  return (
+    <section className={s.Start}>
+      <div className={s.Start_BgWrapper}>
+        <Image
+          src={bgStart}
+          placeholder='blur'
+          alt={''}
+          sizes='100vw'
+          quality={100}
+          fill
+          priority
+        />
+      </div>
+      <div className={s.Header}>
+        <div className={s.Logo}>Пожарная экспертиза</div>
+        <div className={s.Buttons}>
+          <Image className={s.Icon} src={waIcon} alt='whatsapp' />
+          <Image className={s.Icon} src={tgIcon} alt='telegram' />
+          <Button className={s.Button}>
+            <Image src={callBtn} alt='Call' />
+            Обратный звонок
+          </Button>
+        </div>
+      </div>
+      <div className={s.Info}>
+        <div className={s.Content}>
+          <h1 className={s.Title}>
+            Полное обследование объекта на соответствие требованиям пожарной
+            безопасности
+          </h1>
+          <ul className={s.List}>
+            <li className={s.ListItem}>
+              Пожарно-техническое обследование (пожарный аудит)
+            </li>
+            <li className={s.ListItem}>Расчёт пожарного риска</li>
+            <li className={s.ListItem}>
+              Сокращение затрат на модернизацию пожарных систем
+            </li>
+          </ul>
+        </div>
+        <div className={s.Phone}>
+          <p className={s.Title}>+7 999 123 45 67</p>
+          <Button variant='orange'>Получить консультацию</Button>
+        </div>
+      </div>
+    </section>
+  );
+}

src/pages/home/index.tsx

@@ -1 +1 @@
-export { default } from './ui/Home';
+export { default as HomePage } from './home';

src/pages/home/ui/Home.tsx

@@ -1,5 +0,0 @@
-function Home() {
-  return <main>Home</main>;
-}
-
-export default Home;