fixed page - 85% ready if you asked me

src/pages/Home.css

@@ -6,27 +6,24 @@
   overflow: hidden;
   min-height: 768px;
   margin-inline: calc(0px - var(--page-gutter));
-  color: var(--paper);
-  background: var(--ink);
-}
-.home-hero__image {
-  position: absolute;
-  inset: 0;
-  width: 100%;
-  height: 100%;
-  object-fit: cover;
-  object-position: center 65%;
+  color: var(--ink);
+  background: var(--wash);
 }
 .home-hero__shade {
   position: absolute;
   inset: 0;
-  background:
-    linear-gradient(90deg, #132630e8 0%, #1f3239a8 54%, #17262f73 100%),
-    linear-gradient(0deg, #111b22b5 0%, transparent 45%);
+  z-index: 1;
+  background: linear-gradient(
+    90deg,
+    #f5f3eef5 0%,
+    #f5f3eed1 42%,
+    #f5f3ee5c 70%,
+    transparent 100%
+  );
 }
 .home-hero__content {
   position: relative;
-  z-index: 1;
+  z-index: 2;
   max-width: 900px;
   padding: 65px 62px 90px;
 }
@@ -41,7 +38,7 @@
 .home-hero__description {
   max-width: 400px;
   margin: 0 0 30px;
-  color: #eeece5;
+  color: var(--muted);
   font-size: 15px;
   line-height: 1.8;
 }
@@ -52,6 +49,7 @@
 }
 .home-hero__bottom {
   position: absolute;
+  z-index: 2;
   bottom: 0;
   left: var(--page-gutter);
   right: var(--page-gutter);
@@ -59,18 +57,18 @@
   justify-content: space-between;
   gap: 20px;
   padding: 20px 0;
-  border-top: 1px solid #ffffff35;
+  border-top: 1px solid #282a2330;
   font-size: 11px;
   line-height: 1.6;
 }
 .home-hero__tagline {
   font-size: clamp(14px, 1.2vw, 16px);
   font-weight: 500;
-  color: #ffffff;
+  color: var(--ink);
   letter-spacing: 0.01em;
 }
 .home-hero__image-note {
-  color: #e2e2dc;
+  color: var(--muted);
 }
 .home-intro {
   display: grid;