Added blend mode to header

styles.css

@@ -229,7 +229,8 @@ ul {
   isolation: isolate;
 }
 
-.homepage-hero-section.image-overlap-heading-dynamic-inversion-container {
+.homepage-hero-section.image-overlap-heading-dynamic-inversion-container,
+.approach-section.image-overlap-heading-dynamic-inversion-container {
   background-color: var(--color-weathered-paper);
 }
 
@@ -436,6 +437,10 @@ ul {
   overflow: hidden;
 }
 
+.approach-image-overlap-title {
+  transform: translateY(25%);
+}
+
 .oversized-editorial-title {
   position: relative;
   z-index: 2;
@@ -452,11 +457,12 @@ ul {
   grid-template-columns: repeat(12, minmax(0, 1fr));
   align-items: end;
   gap: clamp(2rem, 4vw, 4.5rem);
-  margin-top: clamp(1rem, 2vw, 2rem);
+  margin-top: 0;
 }
 
 .approach-supporting-copy {
   grid-column: 1 / 4;
+  min-width: 0;
   padding-top: clamp(3rem, 7vw, 7rem);
   color: var(--color-softened-black);
   font-size: 0.94rem;
@@ -464,7 +470,8 @@ ul {
 
 .approach-image-figure {
   grid-column: 4 / 12;
-  margin-top: -1.5rem;
+  min-width: 0;
+  margin-top: 0;
 }
 
 .approach-principles-grid {
@@ -917,8 +924,14 @@ ul {
     grid-column: 1 / 5;
   }
 
+  .approach-content-grid {
+    align-items: start;
+    margin-top: 0;
+  }
+
   .approach-image-figure {
     grid-column: 5 / 13;
+    margin-top: 0;
   }
 
   .work-heading-grid .oversized-editorial-title {
@@ -1097,6 +1110,28 @@ ul {
   }
 }
 
+@media (min-width: 32.0625rem) and (max-width: 48rem) {
+  .approach-content-grid {
+    display: grid;
+    grid-template-columns: repeat(12, minmax(0, 1fr));
+    align-items: start;
+    gap: clamp(1.5rem, 4vw, 2.5rem);
+    margin-top: 0;
+  }
+
+  .approach-supporting-copy {
+    grid-column: 1 / 6;
+    max-width: none;
+    padding-top: clamp(2rem, 6vw, 3rem);
+  }
+
+  .approach-image-figure {
+    grid-column: 6 / 13;
+    margin-top: 0;
+    margin-left: 0;
+  }
+}
+
 @media (max-width: 40rem) {
   .approach-principles-grid {
     grid-template-columns: minmax(0, 1fr);
@@ -1170,6 +1205,13 @@ ul {
     letter-spacing: 0.02em;
   }
 
+  .approach-image-overlap-title {
+    transform: none;
+    color: var(--color-noel-black);
+    filter: none;
+    mix-blend-mode: normal;
+  }
+
   .work-heading-grid .oversized-editorial-title {
     font-size: clamp(3.15rem, 15.5vw, 5rem);
   }