# Deploying the website

The live site is the **`site/`** folder — plain HTML, CSS and JS. No framework,
no `_next` folder, no Node, no database. Fonts load from Google's CDN so there
are no font files to upload.

## What to upload

Everything **inside `site/`** goes into your hosting document root
(`public_html/` on cPanel):

```
public_html/
  .htaccess
  index.html  about.html  services.html  recruitment.html
  team-building.html  jobs.html  blog.html  contact.html
  request-quote.html  thank-you.html  404.html
  job-*.html   post-*.html
  sitemap.xml  robots.txt  favicon.ico
  css/styles.css
  js/nav.js
  assets/favicon.svg
```

That's it — every page links to `css/styles.css` and `js/nav.js` with plain
relative paths, so it works in any folder and even opens correctly by
double-clicking `index.html`.

## Upload steps (cPanel)

1. File Manager → open `public_html/`.
2. If replacing the current WordPress site: **back it up first** (Files +
   Database), then delete the old files.
3. Upload **`phina-consultant-site.zip`** (in the project root — only ~80 KB).
4. Select it → **Extract** → into `public_html/`.
5. Delete the zip.
6. Enable *Settings → Show Hidden Files* and confirm **`.htaccess`** is there.

Or drag the contents of `site/` over by FTP — with only 24 small files and no
underscore folders, there's nothing for the client to trip on.

## Contact form

Both forms (Contact and Request a Quote) submit to **FormSubmit.co** — no
account, no API key. After the site is live:

1. Open `contact.html` on the live site and send a test message.
2. FormSubmit emails a **one-time activation link** to
   `info@phinaconsultant.co.ke`. Click it.
3. Done — every submission after that is delivered to that inbox, and the
   sender is bounced to `thank-you.html`.

To change the destination address or switch to Formspree/Web3Forms, edit the
`FORM_ACTION` line near the top of `scripts/build-static.mjs` and re-run
`npm run build:site` — or just edit the `action="..."` attribute in
`site/contact.html` and `site/request-quote.html` directly.

## SSL

Enable AutoSSL / Let's Encrypt in cPanel. `.htaccess` already redirects
HTTP → HTTPS.

## Editing content later

Two options:

- **Quick text edits** — open the `.html` file in `site/` and edit it directly.
- **Structural / repeated changes** — edit `scripts/build-static.mjs` (the copy
  for every page lives in the `services`, `jobs`, `posts`, `whyChooseUs`, …
  arrays near the bottom) and run:

  ```bash
  npm run build:site      # regenerates site/ + phina-consultant-site.zip
  npm run preview:site    # view at http://localhost:3000 before uploading
  ```

  Note: `build:site` overwrites everything in `site/`, so don't mix the two
  approaches without copying your hand edits back into the script.

## Logo & photos

Drop files into `site/assets/` with these exact names (full notes in
`site/assets/README-IMAGES.txt`):

| File | Used for |
|------|----------|
| `site/assets/logo.png` | Header + footer logo |
| `site/assets/photos/hero.jpg` | Home hero image |
| `site/assets/photos/about.jpg` | About page banner |
| `site/assets/photos/team-building.jpg` | Team Building page banner |

Missing files fall back gracefully (logo → "P" monogram, photos → brand
gradient), so the site never shows a broken image. After adding them run
`npm run build:site` and re-upload — or just drop the files straight into
`public_html/assets/` (and `public_html/assets/photos/`) on the server.

## Colours & fonts

All design tokens are CSS variables at the top of `site/css/styles.css`
(`--brand-700`, `--accent`, `--ink-900`, …). Change them there.

---

### The Next.js version

An earlier React/Next.js build of the same site still lives in `src/` +
`next.config.ts`. It is **not** what you deploy now. Ignore it unless you later
move to a Node host; `npm run build:next` builds it into `out/`.