Add Suisse Intl font system with typography updates

[patcapulong]

Summary

• Configure custom Suisse Intl fonts in docs.json (Mintlify's recommended approach)
• Add Medium weight (500) for headings, bold text, navigation, and buttons
• Add Suisse Intl Mono for code blocks and API field names
• Use semantic selectors (data-component-part, IDs, Mintlify classes)
• Enable stylistic alternates for single-story 'a'
• Fix homepage footer alignment

Font Weights

• Regular (400): Body text, inactive sidebar items
• Medium (500): Headings, bold, buttons, nav, active sidebar
• Mono Bold (700): API field names

Test plan

• Verify fonts render correctly on homepage
• Check headings use Medium weight across docs
• Confirm code blocks use Suisse Intl Mono
• Test in both light and dark mode

[greptile-apps]

Greptile Summary

This PR establishes a comprehensive Suisse Intl font system for the Mintlify documentation site, configuring custom fonts through Mintlify's recommended docs.json approach and adding detailed CSS rules for typography consistency.

Key changes:

• Configured Suisse Intl (Regular 400, Medium 500) as heading/body fonts in docs.json
• Added Suisse Intl Mono for code blocks and API field names
• Enabled stylistic alternates ("salt") globally for single-story 'a' character
• Updated font-display from swap to block to prevent FOUT (Flash of Unstyled Text)
• Fixed homepage footer alignment by wrapping in .section container for consistency with other content sections
• Removed Bold (700) font file, mapping weight 700 to Medium for a lighter typographic feel

Minor observation:

• Book weight (450) is defined and preloaded but not currently utilized in CSS rules

Confidence Score: 5/5

• This PR is safe to merge - it contains only CSS/font configuration changes with no functional impact on the documentation content.
• All font files referenced in CSS and JSON configuration exist in the repository. The changes are well-structured and follow Mintlify's recommended font configuration pattern. The footer alignment fix uses existing CSS classes appropriately.
• No files require special attention. The unused Book weight font is a minor style consideration, not a blocking issue.

Important Files Changed

Filename	Overview
mintlify/docs.json	Added Mintlify fonts config for heading/body fonts and updated font preload links to include new mono fonts and Book weight
mintlify/styles/fonts.css	Added Book (450) and Mono font-face declarations, mapped bold (700) to Medium, changed font-display to block. Book weight (450) is defined but unused.
mintlify/styles/styles.css	Added comprehensive typography styling for headings, navigation, code blocks, and homepage elements. Removed redundant font-family declarations.
mintlify/index.mdx	Restructured footer to use .section wrapper for consistent alignment with other content sections

Sequence Diagram

sequenceDiagram
    participant Browser
    participant Mintlify as Mintlify Server
    participant Fonts as Font Files

    Browser->>Mintlify: Request page
    Mintlify->>Browser: Return HTML with preload links
    
    par Font Preloading
        Browser->>Fonts: Preload SuisseIntl-Regular.woff2
        Browser->>Fonts: Preload SuisseIntl-Book.woff2
        Browser->>Fonts: Preload SuisseIntl-Medium.woff2
        Browser->>Fonts: Preload SuisseIntlMono-Regular-WebXL.woff2
        Browser->>Fonts: Preload SuisseIntlMono-Bold-WebXL.woff2
    end
    
    Browser->>Mintlify: Load fonts.css
    Mintlify->>Browser: @font-face declarations
    
    Browser->>Mintlify: Load styles.css
    Mintlify->>Browser: Typography rules applied
    
    Note over Browser: font-display: block<br/>prevents FOUT

Loading

[greptile-apps]

Greptile found no issues!

From now on, if a review finishes and we haven't found any issues, we will not post anything, but you can confirm that we reviewed your changes in the status check section.

_{This feature can be toggled off in your Code Review Settings by deselecting "Create a status check for each PR".}

[greptile-apps]

_{4 files reviewed, 1 comment}

_{Edit Code Review Agent Settings | Greptile}

[greptile-apps]

style: Book weight (450) is defined and preloaded but not used anywhere in the CSS. Consider using it for buttons as the comment suggests, or remove to reduce font loading overhead.

Prompt To Fix With AI

This is a comment left during a code review.
Path: mintlify/styles/fonts.css
Line: 14:21

Comment:
**style:** Book weight (450) is defined and preloaded but not used anywhere in the CSS. Consider using it for buttons as the comment suggests, or remove to reduce font loading overhead.

How can I resolve this? If you propose a fix, please make it concise.