Issue with Loading Images on Vercel

I'm encountering a peculiar problem when trying to load images on my landing page hosted on Vercel. Locally, the images display correctly, as shown in the image below:

However, when deploying to Vercel, the images are not being found. I am using two different paths for the images, both in the tailwind.config.mjs file and the Header.astro file.

tailwind.config.mjs File:

backgroundImage: {
    'bg-header': "url('./public/img/header/REHeader.jpg')"
},

Header.astro File:

<img
    src="../../public/img/header/RE2logo.png"
    class="h-12 w-24"
    alt="Resident Evil Logo"
/>

The final result of my deployment, with the images not loading, can be seen here.

The GitHub repository can be accessed here!

Note: I am using the Astro framework!

Could someone help me understand why the images are not loading after deploying to Vercel? I appreciate any guidance or solutions to this issue.

As requested, I'm adding an answer with a few details

Let's say you have the following project structure, (taken from astro documentaion)

├── public/
│   ├── robots.txt
│   ├── favicon.svg
│   └── social-image.png
├── src/
│   └── ...
├── astro.config.mjs
├── package.json
└── tsconfig.json

All of your code that lives in the src folder gets optimised and compiled whereas astro (like many/most tools out there, won't touch your public folder and any assets that it might contain) Usually, you'd want to put any images/assets in your src folder, however if you don't want the compiler to process any files, you put them in your public folder.

After you build your project, astro will create something like below

├── _astro/
│   └── ...
├── index.html
├── robots.txt
└── social-image.png

Notice that everything inside your public folder has been dumped into the root of your project alongside the index.html page.

Furthermore, in your case, since you have created a folder inside the public directory, astro will retain that and copy the folder as-is in your project root.

I would recommend running your build command on your local machine to examine the project structure after astro compiles everything.