# Safat Al Fahim — website template

No build step. Open `index.html`; styles live in `assets/site.css`, behaviour in `assets/site.js`, fonts are self-hosted in `assets/fonts`. Open `index.html` in a browser, then replace the copy, images and links with your own.

## Fonts (Google Fonts, free)
- **Anton** — the name lockup and poster headlines
- **Newsreader** — editorial headlines and body text
- **Archivo** (expanded width, italic) — racing-style labels
- **Figtree** — buttons and small UI

## Palette
| Name | Hex |
|---|---|
| Pit | #1C1C1C |
| Ink | #161514 |
| Asphalt | #4A4A4A |
| Concrete | #827F7A |
| Bone | #E6E5D7 |
| Fog | #D6E0DA |
| Coral | #EB5E69 |

## What's inside
- Pinned photo hero whose five start lights switch on as you scroll, then go out
- Two-column story layout with a sticky chapter nav
- Poster-style SVG illustrations, a line-drawn brew kit, a filterable coffee list
- A working panda-dial chronograph that tells Berlin time and runs a 1:16 brew timer
- Tabs, copy-to-clipboard buttons, and a template sheet (this one)

## Inspirations
brittanychiang.com · tej.as · standartmag.com · gozauber.com · "Cars & Tunnels" poster by Moore Creativ · Anthropic launch posts

## Swap these before you publish
- `assets/img/hero.jpg` (not included in the template)
- `Safat_Al_Fahim_CV.pdf` (not included)
- All personal copy, links and the coffee list

Layout and code are free to reuse. Personal content and photos belong to Safat Al Fahim.