Lighthouse mobile LCP 5.8s, it's the hero image, desktop is fine

Two problems, and the lazy loading made it worse. The hero is your LCP, so you want it loaded first, not deferred.

1. Convert it: a 2.4 MB PNG photo should be a ~150 KB WebP or AVIF. Squoosh does it in the browser.
2. Serve a smaller one to phones and tell the browser it matters:

<img
  src="/hero-1600.webp"
  srcset="/hero-800.webp 800w, /hero-1600.webp 1600w"
  sizes="100vw"
  width="1600" height="900"
  fetchpriority="high"
  alt="..."
/>

Remove loading="lazy" from the hero, keep it on images below the fold.

For the font: self-host it (fontsource package) or at least add <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> and display=swap. Also check if Bolt imported 4 weights when you only use 2.

Also check if there's a background video or a big Lottie animation above the fold. Bolt added one to mine without me noticing and it was 3 MB.