Oversized page titles on mobile push critical content below the fold

**Describe the bug**
On mobile devices, page titles on detail pages (such as Project and Chapter detail pages) are excessively large. The title text often wraps into multiple lines, which pushes critical content below the fold and increases unnecessary scrolling.

**To Reproduce**
Steps to reproduce the behavior:

1. Open the site on a mobile device or using browser dev tools
2. Set the viewport width to a mobile size (320–400px)
3. Navigate to a Project or Chapter detail page
4. Observe the page title occupying multiple lines and pushing main content downward

**Expected behavior**
Page titles on mobile should be appropriately sized to maintain visual hierarchy while keeping important content visible without excessive scrolling.

**Are you going to work on fixing this?**

- [x] Yes
- [ ] No

**Screenshots**


**Desktop (please complete the following information):**

- OS: Windows 11
- Browser: Chrome
- Version: Latest

**Smartphone (please complete the following information):**

- Device: Android phone
- OS: Android
- Browser: Chrome
- Version: Latest

**Additional context**
This issue is consistently reproducible across multiple detail pages and appears to be related to mobile typography or responsive heading styles.