Subdirectory deployment with GitHub pages

My structure is as follows:

• FE (React) being hosted with GH Pages

• BE (Asp.Net) running on a linux container + Nginx on AWS' ec2

• Domain services with Hostinger

Both FE and BE are currently running on HTTP. Using 'website.com' as the FE access point + 'api.website.com' as the BE point. It all seem to work.

Now I'd like to have a subdirectory as the access point. So instead of website.com > website.com/abc

What I've done so far:

1. GH Pages deploys from /root , custom domain is website.com (no change)
2. FE: Public>CNAME file : website.com (no change)
3. FE: vite.config : 'base: '/abc/'
4. FE: package.json : "homepage": "website.com/abc"
5. Hostinger DNS settings:

• A @ ec2_ip (added)
• A api ec2_ip (no change)
• CNAME www website.com (no change)

6. BE: Nginx config, added:

   server {
     listen 80;
     server_name website.com;
   
     location /abc/ {
       proxy_pass https://USERNAME.github.io/REPO-NAME/;
       proxy_set_header Host $host;
       proxy_set_header X-Real-IP $remote_addr;
       proxy_ssl_server_name on;
   }
   

   }

7. I'm building and deploying, as usual

Is this the right way to go about this?
I'm getting 404 "File not found" ...what have I missed?