fix(feat): add locales and refine responsive landing page UI

src/styles/trust.css

@@ -4,7 +4,7 @@
   align-items: center;
   justify-content: center;
   width: 100%;
-  padding: 64px 16px;
+  padding: 60px 16px;
   background: #fff;
 }
 
@@ -30,9 +30,10 @@
 .trust__title {
   width: 100%;
   margin: 0;
-  font-size: 32px;
+  font-size: 28px;
   font-weight: 700;
   line-height: 1.2;
+  letter-spacing: var(--ls-28);
   color: #1a1a1a;
 }
 
@@ -42,6 +43,7 @@
   font-size: 18px;
   font-weight: 400;
   line-height: 1.5;
+  letter-spacing: var(--ls-18);
   color: #7a726d;
 }
 
@@ -126,6 +128,7 @@
   font-size: 16px;
   font-weight: 600;
   line-height: 22px;
+  letter-spacing: var(--ls-16);
   color: #0d0d0d;
 }
 
@@ -135,12 +138,13 @@
   font-size: 15px;
   font-weight: 500;
   line-height: 1.5;
+  letter-spacing: var(--ls-15);
   color: #7a726d;
 }
 
 .trust__divider {
   position: relative;
-  display: none;
+  display: none; /* shown only in desktop flex row via 1023px breakpoint */
   flex-shrink: 0;
   width: 0;
   height: 118px;
@@ -170,32 +174,72 @@
   }
 }
 
-@media (min-width: 768px) {
+@media (min-width: 440px) {
+  .trust {
+    padding-left: 20px;
+    padding-right: 20px;
+  }
+
   .trust__title {
-    font-size: 40px;
+    font-size: 32px;
+    letter-spacing: var(--ls-32);
+  }
+}
+
+@media (min-width: 576px) {
+  .trust {
+    padding-left: 28px;
+    padding-right: 28px;
+  }
+
+  .trust__title {
+    font-size: 36px;
+    letter-spacing: var(--ls-36);
+  }
+}
+
+@media (min-width: 768px) {
+  .trust {
+    padding-left: 36px;
+    padding-right: 36px;
+  }
+
+  .trust__title {
+    font-size: 42px;
+    letter-spacing: var(--ls-42);
   }
 
   .trust__grid {
-    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
+    position: relative;
+    grid-template-columns: repeat(2, minmax(0, 1fr));
+  }
+}
+
+@media (min-width: 768px) and (max-width: 1022px) {
+  .trust__grid > .trust-card:nth-child(1),
+  .trust__grid > .trust-card:nth-child(5) {
+    position: relative;
   }
 
-  .trust__divider {
-    display: block;
-    align-self: center;
-  }
-
-  .trust__divider:nth-of-type(4) {
-    display: none;
+  .trust__grid > .trust-card:nth-child(1)::after,
+  .trust__grid > .trust-card:nth-child(5)::after {
+    content: '';
+    position: absolute;
+    top: 50%;
+    right: -16px;
+    transform: translateY(-50%);
+    width: 0;
+    height: 118px;
+    border-left: 1px solid rgba(240, 132, 88, 0.5);
   }
 }
 
 @media (min-width: 1023px) {
   .trust {
-    padding: 120px;
-  }
-
-  .trust__title {
-    font-size: 48px;
+    padding-top: 60px;
+    padding-bottom: 60px;
+    padding-left: 36px;
+    padding-right: 36px;
   }
 
   .trust__grid {
@@ -211,3 +255,19 @@
     display: block;
   }
 }
+
+@media (min-width: 1200px) {
+  .trust__title {
+    font-size: 48px;
+    letter-spacing: var(--ls-48);
+  }
+}
+
+@media (min-width: 1376px) {
+  .trust {
+    padding-top: 120px;
+    padding-bottom: 120px;
+    padding-left: 120px;
+    padding-right: 120px;
+  }
+}