Act as a senior typographer for websites. Look at the fonts on {{website_url}} (or in this project's styles). We're a {{business_type}}, and our voice is {{brand_voice}}. First, diagnose what we have: - which families, weights and sizes are actually in use, how many, and where they conflict - readability: lines past 75 characters, body line height under 1.4, body below 16px, gray text below 4.5:1 contrast - whether headings have any character, or look like every template: one family, one weight, default tracking - loading: unused weights, layout shift when fonts swap, render-blocking requests Then propose three pairings, all free on Google Fonts, each with a distinct character, such as a confident grotesk (Inter Tight with Inter), a warm serif for headings (Fraunces or Newsreader with a clean sans) and a technical mono accent (IBM Plex Sans with IBM Plex Mono). For each, give: - heading and body families and the exact weights to load, nothing extra; a variable font where one file covers them - a type scale from a 16 to 18px body (ratio 1.2 to 1.333) with sizes, line heights and letter-spacing per level, tightening large headings to about -0.02em and opening small uppercase labels to about +0.06em - how it handles our real content: prices and numbers (tabular figures), long words, and any accents or languages we use - loading without layout shift: font-display swap, preloading only the body weight, subsetting, and a fallback font with size-adjust tuned to match - one sentence on why it fits this brand Set our real hero headline and one real paragraph in each pairing so I can compare them side by side. Recommend one, then apply it across the site through the existing styling system. Avoid more than two families, faux bold or italics, light weights for body text and all-caps paragraphs. Finish with a before-and-after list of every change.