src/views/home/ui/home.tsx

@@ -1,7 +1,7 @@
 import Main from './main/main';
 import Offer from './offer/offer';
 import Result from './result/result';
-// import License from './license/license';
+import License from './license/license';
 // import Contacts from './contacts/contacts';
 // import Footer from './footer/footer';
 
@@ -11,7 +11,7 @@ export default function HomePage() {
       <Main />
       <Offer />
       <Result />
-      {/*<License />*/}
+      <License />
       {/*<Contacts />*/}
       {/*<Footer />*/}
     </>

src/views/home/ui/license/license.module.scss

@@ -1,2 +1,82 @@
 .License {
+  padding: 160px;
+
+
+  .Header {
+    font-family: $font-open-sans;
+    font-weight: $font-semi-bold;
+    font-size: 60px;
+    line-height: 100%;
+    color: $color-text;
+    margin-bottom: 80px;
+  }
+
+  .Slider {
+    margin-bottom: 80px;
+  }
+
+  .Form {
+    position: relative;
+    padding: 40px 60px;
+    background: #292E3D;
+    border-radius: 28px;
+    overflow: hidden;
+
+    display: flex;
+    flex-direction: row;
+    gap: 40px;
+
+    &:after {
+      content: '';
+      display: block;
+      width: 100%;
+      height: 100%;
+      position: absolute;
+      z-index: 1;
+      left: 0;
+      top: 0;
+      background-color: rgba(#163055, .6);
+      transition: 250ms background-color;
+    }
+    .Background {
+      position: absolute;
+      object-fit: cover;
+      z-index: 1;
+    }
+
+    .Offer {
+      flex: 2;
+      .Title {
+        position: relative;
+        z-index: 2;
+        font-family: $font-open-sans;
+        font-weight: $font-regular;
+        font-size: 48px;
+        line-height: 110%;
+        color: $color-white;
+        margin: 0 0 50px;
+      }
+
+      .SubTitle {
+        position: relative;
+        z-index: 2;
+        font-family: $font-open-sans;
+        font-weight: $font-light;
+        font-size: 30px;
+        line-height: 100%;
+        color: $color-white;
+        margin-bottom: 16px;
+        max-width: 820px;
+      }
+    }
+
+    .Inputs {
+      position: relative;
+      z-index: 2;
+      flex: 1;
+      display: flex;
+      flex-direction: column;
+    }
+
+  }
 }

src/views/home/ui/license/license.tsx

@@ -1,5 +1,45 @@
 import s from './license.module.scss';
 
+import { Button, Mark } from '@shared/ui';
+
+import bgForm from '@public/images/bg-form.jpg';
+import Image from 'next/image';
+
 export default function License() {
-  return <section className={s.License}>License</section>;
+  return (
+    <section className={s.License}>
+      <h2 className={s.Header}>
+        Наши услуги <Mark>подтверждены лицензиями</Mark> и сертификатами
+      </h2>
+
+      <div className={s.Slider}>Slider here</div>
+
+      <div className={s.Form}>
+        <div className={s.Offer}>
+          <Image
+            className={s.Background}
+            src={bgForm}
+            placeholder='blur'
+            alt={''}
+            quality={75}
+            fill
+            priority
+          />
+          <h3 className={s.Title}>
+            Заключите договор до 1 июня и получите скидку на проведение пожарной
+            экспертизы 15 %
+          </h3>
+          <p className={s.SubTitle}>
+            Оставьте свои контактные данные и мы закрепим скидку до 1 июня за
+            вами
+          </p>
+        </div>
+        <div className={s.Inputs}>
+          <input type='text' placeholder='Ваше имя' />
+          <input type='text' placeholder='+79991234567' />
+          <Button variant='orange'>Получить консультацию</Button>
+        </div>
+      </div>
+    </section>
+  );
 }