4.0.1 - fixes

src/lib/components/ServiceLandingPage.svelte

@@ -3,10 +3,14 @@
   import { reveal } from '$lib/actions/reveal';
   import BookingSection from '$lib/components/BookingSection.svelte';
   import TestimonialsSection from '$lib/components/TestimonialsSection.svelte';
+  import { getImageMetadata } from '$lib/image-metadata';
   import type { ServicePageContent, SiteSharedContent } from '$lib/types';
 
   export let content: SiteSharedContent;
   export let pageContent: ServicePageContent;
+
+  $: heroImage = getImageMetadata(pageContent.hero.imageUrl);
+  $: highlightImage = pageContent.highlight ? getImageMetadata(pageContent.highlight.imageUrl) : null;
 </script>
 
 <main class="service-page">
@@ -25,6 +29,8 @@
         <img
           src={pageContent.hero.imageUrl}
           alt={pageContent.hero.imageAlt}
+          width={heroImage?.width}
+          height={heroImage?.height}
           loading="eager"
           fetchpriority="high"
           decoding="async"
@@ -45,7 +51,10 @@
           <img
             src={pageContent.highlight.imageUrl}
             alt={pageContent.highlight.imageAlt}
+            width={highlightImage?.width}
+            height={highlightImage?.height}
             loading="lazy"
+            decoding="async"
           />
         </div>
       </div>