Added Legal tech page (#1541)

* Added Legal tech page * added contact link and resized a hero image * Updated several text blocks --------- Co-authored-by: trean <trean.mi@gmail.com>
2026-10-12 14:28:31 +02:00 · 2025-04-23 14:35:57 +02:00
parent b527126e5c
commit bc75a02122
43 changed files with 1994 additions and 0 deletions
@@ -0,0 +1,106 @@
+@use 'sass:math';
+@use '../helpers/functions' as *;
+
+.legal-tech-help {
+  position: relative;
+  overflow: hidden;
+  padding-top: $spacer * 4;
+  padding-bottom: $spacer * 4;
+  background-color: $neutral-10;
+
+  &__title {
+    position: relative;
+    margin: 0 auto $spacer * 5;
+    font-size: $spacer * 2.5;
+    line-height: $spacer * 3;
+    color: $neutral-98;
+    text-align: center;
+    z-index: 1;
+  }
+
+  &__items {
+    display: flex;
+    flex-direction: column;
+    gap: $spacer * 2;
+  }
+
+  &__item {
+    position: relative;
+    padding-left: $spacer * 1.5;
+
+    &-title {
+      margin-bottom: math.div($spacer, 4);
+      font-size: $spacer * 1.5;
+      line-height: pxToRem(34);
+      color: $neutral-98;
+    }
+
+    &-description {
+      margin-bottom: 0;
+      font-size: pxToRem(18);
+      line-height: pxToRem(27);
+      color: $neutral-70;
+    }
+
+    &:before {
+      display: block;
+      position: absolute;
+      left: 0;
+      top: pxToRem(12);
+      content: "";
+      width: $spacer * 0.5;
+      height: $spacer * 0.5;
+      background-image: url("data:image/svg+xml,%3Csvg width='8' height='10' viewBox='0 0 8 10' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4 0.5L0 2.75V7.25L4 9.5L8 7.25V2.75L4 0.5Z' fill='%23DC244C'/%3E%3C/svg%3E%0A");
+      background-position: center;
+      background-size: contain;
+      background-repeat: no-repeat;
+    }
+  }
+
+  &__preview {
+    position: relative;
+    margin-top: $spacer * 2.5;
+    z-index: 1;
+
+    img {
+      display: block;
+      width: 100%;
+      max-width: pxToRem(540);
+      margin: 0 auto;
+    }
+  }
+
+  .overlay-top {
+    right: auto;
+    left: 0;
+    transform: scaleX(-1);
+  }
+
+  .overlay-bottom {
+    left: auto;
+    right: 0;
+    transform: scaleX(-1);
+  }
+
+  @include media-breakpoint-up(xl) {
+    padding-top: $spacer * 7.5;
+    padding-bottom: $spacer * 9;
+
+    &__title {
+      font-size: $spacer * 3;
+      line-height: pxToRem(58);
+    }
+
+    &__items {
+      max-width: pxToRem(514);
+    }
+
+    &__preview {
+      margin-top: 0;
+
+      img {
+        margin-right: 0;
+      }
+    }
+  }
+}