Issue with Subtitle Circle and Layout on Smaller Screens
#### 🗹 Requirements

<!-- ⚠️ !!!
If you are unsure, what you are reporting is an issue or
it's a general question please go to the Gitter chat instead: https://gitter.im/ryanoasis/nerd-fonts
⚠️ !!! -->


<!-- ⚠️ !!! Issues not filled out with the template will be closed straight away and will only be responded to once filled properly ⚠️ !!! -->
<!-- By posting an issue you acknowledge the following: -->

- [x] I have searched the [issues](https://github.com/ryanoasis/nerd-fonts/issues) for my issue and found nothing related and/or helpful
- [x] I have searched the [FAQ](https://github.com/ryanoasis/nerd-fonts/wiki/FAQ-and-Troubleshooting) for help
- [x] I have searched the [Wiki](https://github.com/ryanoasis/nerd-fonts/wiki) for help

#### 🎯 Subject of the issue
As discussed in [Pull Request #1368](https://github.com/ryanoasis/nerd-fonts/pull/1368#issuecomment-1751669936), I've addressed an issue where the circle shrinks horizontally but not vertically. There's also an additional problem with the layout of the entire website.

**Experienced behavior**:
For screens with a width less than 767px, the subtitle inner circle inside the features section shrinks horizontally but not vertically. This results in an unusual appearance and overflow from its parent element.

Furthermore, while debugging this, I discovered a significant issue that breaks the layout of the entire website. Specifically, within the Font Patcher script section, the `<details>` tag overflows from its parent. This results in a horizontal scrollbar, which disrupts the website's layout.

**Expected behavior**:
I would expect the subtitle inner circle inside the features section to shrink both horizontally and vertically as the screen size decreases to ensure proper alignment.

Regarding the `<details>` tag, when a detail section is open, the `<summary>` section should overflow from its parent element without causing layout issues.

Assign this issue to me 🙋🏻‍♂️
#### 🔧 Your Setup
- Operating System: Windows 11
- Browser: Chrome

#### ★ Screenshots (Optional)
#### Before:
![Before Image 1](https://github.com/ryanoasis/nerd-fonts/assets/97181033/377356ce-3f55-415d-b610-4e3aa420c22b)
![Before Image 2](https://github.com/ryanoasis/nerd-fonts/assets/97181033/b43e0a32-ee46-4043-8380-8714e6536b0d)

#### After:
![After Image 1](https://github.com/ryanoasis/nerd-fonts/assets/97181033/6a78d7e2-1356-4096-a57e-75efc632e4d3)
![After Image 2](https://github.com/ryanoasis/nerd-fonts/assets/97181033/81829635-75ac-44dd-8f05-b2e63654bb78)

#### Before:
![Before Image 3](https://github.com/ryanoasis/nerd-fonts/assets/97181033/2d9922bc-062d-41e0-b08d-0bbfc505e1c1)
![Before Image 4](https://github.com/ryanoasis/nerd-fonts/assets/97181033/bb848c22-a0dc-4966-b777-6d3670b44d59)

#### After:
![After Image 3](https://github.com/ryanoasis/nerd-fonts/assets/97181033/40b16723-1e55-419a-8fc6-c443579ce8b2)
![After Image 4](https://github.com/ryanoasis/nerd-fonts/assets/97181033/56395e3f-fbd4-439f-93a2-cae6bca0d760)

