Italic Newsreader at the same font-size renders visibly taller than its regular sibling — the cursive 'B' has a flourish that extends above the cap-line. Matching font-sizes meant Bifrost always looked larger, and trying to fit that flourish inside the line-box / gradient-clip either made the wordmark cramped or clipped the top off. Asymmetric sizes for optical match: Project — 18px regular Newsreader Bifrost — 16px italic Newsreader At those sizes, Project's 18px cap-height roughly equals Bifrost's 16px cap + flourish-ascender, so the two words read as the same visual height. inline-block + padding 3px top / 1px bottom on Bifrost keeps the gradient-clip bbox tall enough to contain the flourish without clipping, while vertical-align: baseline keeps the typographic baseline aligned with Project's baseline so the wordmark sits on one line. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com> |
||
|---|---|---|
| .. | ||
| AppLayout.astro | ||
| BaseLayout.astro | ||