Redesign landing and generate Proto docs

src/components/LegalPage/LegalPage.module.css

@@ -1,34 +1,17 @@
 .page {
+  display: flex;
+  flex-direction: column;
   min-height: 100vh;
   background: light-dark(var(--mantine-color-white), var(--mantine-color-dark-8));
 }
 
 .shell {
-  padding-top: var(--mantine-spacing-md);
-  padding-bottom: calc(var(--mantine-spacing-xl) * 2);
-}
-
-.header {
-  min-height: 58px;
-  padding-bottom: var(--mantine-spacing-md);
-  border-bottom: 1px solid light-dark(var(--mantine-color-gray-3), var(--mantine-color-dark-5));
-}
-
-.brand {
-  display: inline-flex;
-  align-items: center;
-  gap: var(--mantine-spacing-xs);
-  color: light-dark(var(--mantine-color-dark-9), var(--mantine-color-white));
-  text-decoration: none;
-}
-
-.brand img {
-  border-radius: var(--mantine-radius-sm);
+  flex: 1;
 }
 
 .main {
   width: 100%;
-  padding-top: 96px;
+  padding: 96px 0 112px;
 }
 
 .intro {
@@ -46,10 +29,6 @@
   line-height: 1.08;
 }
 
-.document {
-  padding-bottom: 72px;
-}
-
 .lead {
   max-width: 780px;
   margin: 0;
@@ -124,14 +103,9 @@
   white-space: pre-line;
 }
 
-.footer {
-  padding-top: var(--mantine-spacing-lg);
-  border-top: 1px solid light-dark(var(--mantine-color-gray-3), var(--mantine-color-dark-5));
-}
-
 @media (max-width: 48em) {
   .main {
-    padding-top: 72px;
+    padding: 72px 0 88px;
   }
 
   .intro {
@@ -147,17 +121,7 @@
 }
 
 @media (max-width: 36em) {
-  .shell {
-    padding-inline: var(--mantine-spacing-md);
-  }
-
-  .header {
-    align-items: flex-start;
-    flex-direction: column;
-  }
-
-  .footer {
-    align-items: flex-start;
-    flex-direction: column;
+  .main {
+    padding-top: 56px;
   }
 }