Angular route not working only in production / http-server

I appreciate your time.

I've been working on a 2-page website with Angular 13.1.2. Everything seems to be working fine on 'ng serve' but on production "/careers throws error 404.

I do not use routerLink, instead I use the following function:

navToCareers(){
   this.router.navigate(['/careers'],{replaceUrl:true}).then(() => {
      window.location.reload();
   });
}

This is the Navbar HTML (app-header):

<div fxFlex class="top-navbar menu900">
  <span fxFlex></span>
  <li class="active text:hover-lime">
    <a href="#home" class="ms-4 text-decoration-none">Home </a>
  </li>
  <li><a href="#about" class="ms-4 text-decoration-none">About</a></li>
  <li>
    <a href="#services" class="ms-4 text-decoration-none">Services</a>
  </li>
  <li>
    <a href="#techstack" class="ms-4 text-decoration-none">Tech Stack</a>
  </li>
  <li (click)="navToCareers()">
    <a class="ms-4 text-decoration-none">Careers</a>
  </li>
  <li><a href="#contact" class="ms-4 text-decoration-none">Contact</a></li>
</div>

P.S. The route does not work either from Navbar nor from manual input in the link.