Markdown Support

# Heading 1
## Heading 2
### Heading 3

This is a regular paragraph with enhanced spacing and readability.
It uses light font weight with wide tracking for a modern look.

Multiple paragraphs are separated with blank lines.

**Bold text** gets special styling with a subtle background and left border.

*Italic text* appears in Spotify green with an underline effect.

[Link to another page](/introduction)

[External link](https://example.com)

[Email link](mailto:[email protected])

Use `inline code` for short snippets and variable names.

```typescript
function example() {
  return "Hello World";
}
```

- Unordered item 1
- Unordered item 2
  - Nested item
  
1. Ordered item 1
2. Ordered item 2
3. Ordered item 3

> This is a blockquote with enhanced styling.
> It can span multiple lines.

_"When people talk about traveling to the past, they worry about radically 
changing the present by doing something small, but barely anyone in the 
present really thinks that they can radically change the future by doing 
something small"_, quote from [just-shower-thoughts](...).

![Alt text describing the image](/images/blog/my-image.jpeg)

![Office view](/images/blog/nitro.jpeg)

![Olympic National Park](/images/blog/olympic.jpeg)

![Where my project sits in the system](/images/blog/project.png)

![Mt. Rainier](/images/blog/rainier.jpeg)

---

function applyCustomStyling(html: string): string {
  let styledHtml = html;

  // Example: Style H2 headings
  styledHtml = styledHtml.replace(
    /<h2>/g,
    '<div class="pt-8 pb-1"><h2 class="text-2xl md:text-3xl font-bold text-white mb-4 tracking-tight border-l-4 border-spotify-green pl-4 bg-spotify-light-dark/30 py-3 rounded-r-lg">'
  );
  styledHtml = styledHtml.replace(/<\/h2>/g, "</h2></div>");

  return styledHtml;
}

{
  "dependencies": {
    "gray-matter": "^4.0.3",
    "remark": "^15.0.1",
    "remark-html": "^16.0.1"
  }
}