Optimize PNG Clarity for WordPress

I have a single PNG artwork sitting in a content section on my WordPress home page. It looks perfectly crisp on my local files, yet once the page loads online the image softens and the details blur. I’d like your help getting that artwork to display as sharply on the site as it does on my screen.

Here’s the situation:
• File type: PNG (no alternate versions uploaded).
• Placement: embedded inside a standard Gutenberg content block on the homepage—not a background layer, not a featured image.
• Theme and plugins are up-to-date; caching/CDN is active.

What I need from you:
1. Diagnose why the current PNG is degrading—whether it’s WordPress compression, scaling, CSS, CDN, or anything else.
2. Provide and implement the best-fit solution (optimised export settings, correct @2x or WebP fallback, tweaked CSS, or even converting to SVG if that’s the cleanest route).
3. Supply the final asset(s) and a brief note so I can repeat the fix on future uploads.

If this sounds straightforward to you and you’ve handled image optimisation for WordPress before, let’s get the artwork looking razor-sharp.