fix: use new mobile vector for our work

Replace the clip-path composition of the desktop SVG with a real <img> that references the artist-supplied mobile-work-vector.svg. Drop the CSS-layer trick and the ::before/::after background pieces; the new mobile SVG already covers the composition. Update the linework composition test to assert against the new <img>.

views/blocks/our-work/our-work.css

@@ -219,48 +219,6 @@
         position: absolute;
     }
 
-    /*
-     * CSS layers keep the approved external SVG available. Browsers do not load
-     * nested external images from an SVG embedded through an img element.
-     */
-    .our-work__vector-mobile::after,
-    .our-work__vector-mobile-clip::before {
-        background-image: var(--our-work-vector-image);
-        background-repeat: no-repeat;
-        background-size: 100% 100%;
-        content: "";
-        height: 98.756vw;
-        position: absolute;
-        width: 238.806vw;
-    }
-
-    .our-work__vector-mobile-clip {
-        clip-path: polygon(
-            74.63% 24.77%,
-            100% 24.77%,
-            100% 56.31%,
-            0 56.31%,
-            0 48.42%,
-            54.73% 48.42%,
-            54.73% 43.92%,
-            67.16% 43.92%,
-            67.16% 38.29%,
-            74.63% 38.29%
-        );
-        inset: 0;
-        position: absolute;
-    }
-
-    .our-work__vector-mobile-clip::before {
-        left: 24.876vw;
-        top: 59.701vw;
-    }
-
-    .our-work__vector-mobile::after {
-        left: -106.965vw;
-        top: 121.891vw;
-    }
-
     .our-work__inner {
         gap: 0;
         padding-inline: 2rem !important;

views/blocks/our-work/our-work.php

@@ -9,9 +9,10 @@
 
 namespace CWC;
 
-$left_image   = get_field( 'left_image' );
+$left_image        = get_field( 'left_image' );
-$bottom_image = get_field( 'bottom_image' );
+$bottom_image      = get_field( 'bottom_image' );
-$vector_url   = get_stylesheet_directory_uri() . '/views/blocks/our-work/our-work-vector.svg';
+$vector_url        = get_stylesheet_directory_uri() . '/views/blocks/our-work/our-work-vector.svg';
+$mobile_vector_url = get_theme_file_uri( '/static/img/mobile-work-vector.svg' );
 
 $classes = 'our-work mx-break-out mb-36';
 
@@ -32,11 +33,13 @@ $wrapper = blockWrapperAttributes( $classes, $is_preview );
 
 <section <?php echo wp_kses_post( $wrapper ); ?>>
 	<div class="our-work__vector" aria-hidden="true">
-		<div
+		<div class="our-work__vector-mobile">
-			class="our-work__vector-mobile"
+			<img
-			style="<?php echo esc_attr( '--our-work-vector-image: url(' . esc_url( $vector_url ) . ');' ); ?>"
+				src="<?php echo esc_url( $mobile_vector_url ); ?>"
-		>
+				alt=""
-			<div class="our-work__vector-mobile-clip"></div>
+				loading="lazy"
+				role="presentation"
+			/>
 		</div>
 
 		<div class="our-work__vector-desktop">