diff --git a/.gitignore b/.gitignore
index 1c3fa73..cfd6cb6 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,3 +1,4 @@
public/
resources/
.hugo_build.lock
+.claude-session/
diff --git a/IMPLEMENTATION_GUIDE.md b/IMPLEMENTATION_GUIDE.md
new file mode 100644
index 0000000..3f93032
--- /dev/null
+++ b/IMPLEMENTATION_GUIDE.md
@@ -0,0 +1,275 @@
+# Implementation Guide: Typography Redesign
+## For internetforkids.org (Hugo + Congo Theme)
+
+### EASIEST PATH: Modify Congo Theme
+
+The Congo theme is already set up - no need to switch themes. Just customize typography files.
+
+#### Step 1: Update Font Imports
+**File:** `layouts/partials/head.html` or `config/_default/params.toml`
+
+Add Google Fonts (if using Option A or B):
+```html
+
+
+
+```
+
+Or for Option B:
+```html
+
+```
+
+#### Step 2: Override Congo's CSS
+**File:** `assets/css/custom.css` (create if doesn't exist)
+
+```css
+/* Option A: Sam Altman Style */
+:root {
+ --font-serif: 'Crimson Text', Georgia, serif;
+ --font-sans: 'Oxygen', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
+}
+
+body {
+ font-family: var(--font-sans);
+ font-size: 16px;
+ line-height: 1.6;
+ color: #555;
+}
+
+h1, h2, h3, h4, h5, h6 {
+ font-family: var(--font-serif);
+ font-weight: 400;
+}
+
+h1 { font-size: 50px; }
+h2 { font-size: 28px; }
+h3 { font-size: 24px; }
+
+article {
+ max-width: 600px;
+ margin: 0 auto;
+}
+
+/* Add spacing between articles */
+article + article {
+ margin-top: 80px;
+}
+```
+
+Or Option B (Dario Amodei):
+```css
+:root {
+ --font-serif: Georgia, 'Times New Roman', serif;
+}
+
+body {
+ font-family: var(--font-serif);
+ font-size: 20px;
+ line-height: 1.6;
+ color: #1f1e1d;
+ background-color: #f0ede6;
+}
+
+h1, h2, h3, h4, h5, h6 {
+ font-family: var(--font-serif);
+ font-weight: 600;
+}
+
+h1 { font-size: 36px; }
+h2 { font-size: 24px; }
+
+article {
+ max-width: 800px;
+ margin: 0 auto;
+ padding: 40px 20px;
+}
+
+p {
+ margin-bottom: 20px;
+}
+```
+
+#### Step 3: Update Congo config
+**File:** `config/_default/params.toml`
+
+```toml
+# Change this line if using warm background:
+# colorScheme = "avocado" # Current
+colorScheme = "slate" # For Option A (darker)
+
+defaultAppearance = "light"
+
+[article]
+ showDate = true
+ showReadingTime = true
+ showAuthor = true
+ showBreadcrumbs = true
+ showTableOfContents = true
+```
+
+#### Step 4: Build & Test
+```bash
+hugo server
+# Visit http://localhost:1313 to preview changes
+```
+
+---
+
+### MEDIUM PATH: Switch to Blowfish Theme
+
+Blowfish is modern, actively maintained, and Tailwind-based.
+
+**Pros:**
+- Better performance (Tailwind CSS)
+- Modern design foundation
+- Easy typography customization
+
+**Cons:**
+- Requires theme migration
+- May need content restructuring
+
+**Steps:**
+1. Clone Blowfish: `git submodule add https://github.com/nunocoracao/blowfish themes/blowfish`
+2. Update `config.toml`: `theme = "blowfish"`
+3. Customize `assets/css/custom.css` with serif fonts
+4. Copy content structure from Congo
+
+---
+
+### CUSTOM THEME PATH: Build from Scratch
+
+**Only if neither Congo customization nor Blowfish works.**
+
+Would require:
+1. Creating new Hugo theme folder
+2. Implementing all layouts (baseof.html, single.html, list.html, etc.)
+3. Writing custom CSS
+4. Time investment: 15-20 hours
+
+---
+
+### RECOMMENDED IMPLEMENTATION ORDER
+
+#### Phase 1: Quick Win (Day 1)
+1. Add Google Fonts to layout
+2. Add custom.css with typography rules
+3. Test locally with `hugo server`
+4. Check all article pages render correctly
+
+#### Phase 2: Fine-tuning (Day 2)
+1. Adjust font sizes for mobile responsiveness
+2. Test on different screen sizes
+3. Verify links, navigation, colors work
+4. Get feedback from team
+
+#### Phase 3: Deployment (Day 3)
+1. Deploy to staging if available
+2. Live testing on actual domain
+3. Deploy to production
+4. Monitor for issues
+
+---
+
+### RESPONSIVE CONSIDERATIONS
+
+Add mobile breakpoints to custom.css:
+
+```css
+/* Mobile adjustments */
+@media (max-width: 768px) {
+ body {
+ font-size: 16px; /* Don't go smaller on mobile */
+ }
+
+ h1 {
+ font-size: 28px; /* Scale down headings */
+ }
+
+ h2 {
+ font-size: 20px;
+ }
+
+ article {
+ max-width: 100%; /* Use full width on mobile */
+ padding: 20px; /* But add side padding */
+ }
+}
+```
+
+---
+
+### TESTING CHECKLIST
+
+- [ ] Homepage renders correctly
+- [ ] Article pages display proper typography
+- [ ] Mobile view is readable
+- [ ] Dark mode works (if enabled)
+- [ ] Links are visible and clickable
+- [ ] Images scale properly
+- [ ] Code blocks are readable
+- [ ] Lists and blockquotes look good
+- [ ] Date/author metadata is clear
+- [ ] Sidebar navigation works
+
+---
+
+### ROLLBACK PLAN
+
+If changes don't work:
+1. Delete `assets/css/custom.css`
+2. Revert `config/_default/params.toml` changes
+3. Restart Hugo server
+4. Original Congo theme returns
+
+No destructive changes - fully reversible.
+
+---
+
+### FILE LOCATIONS TO MODIFY
+
+```
+internetforkids/
+├── config/
+│ └── _default/
+│ └── params.toml # Update font settings
+├── assets/
+│ └── css/
+│ └── custom.css # ADD new file with typography
+├── layouts/
+│ └── partials/
+│ └── head.html # ADD Google Fonts link
+└── themes/
+ └── congo/ # Don't modify directly
+```
+
+---
+
+### QUICK COMMAND REFERENCE
+
+```bash
+# View live preview
+hugo server
+
+# Check for errors
+hugo server --debug
+
+# Build static site
+hugo
+
+# Watch for changes
+hugo server --watch
+```
+
+---
+
+### FONT PAIRING LOGIC
+
+**Rule:** Serif + Sans creates visual contrast
+
+- Serif headings = authority, elegance
+- Sans body = modern, readable
+- Same serif throughout = literary, unified
+
+Pick ONE approach and stick with it.
+
diff --git a/TYPOGRAPHY_QUICK_REFERENCE.md b/TYPOGRAPHY_QUICK_REFERENCE.md
new file mode 100644
index 0000000..0325457
--- /dev/null
+++ b/TYPOGRAPHY_QUICK_REFERENCE.md
@@ -0,0 +1,113 @@
+# Typography Quick Reference Guide
+## For internetforkids.org Redesign
+
+### THE THREE APPROACHES
+
+#### Approach 1: Sam Altman (Classic Contrast)
+```
+BEFORE: AFTER:
+[Heading in default font] --> [HEADING in Crimson Text]
+Body text in same font --> Body text in Oxygen sans-serif
+16px, 1.5 line height --> 16px, 1.6 line height
+Wide width (800px+) --> 500px max width (focused)
+```
+**Best for:** Pure, elegant simplicity | Strong serif/sans contrast
+
+---
+
+#### Approach 2: Dario Amodei (Literary Warmth)
+```
+BEFORE: AFTER:
+[Heading] --> [Heading in Newsreader serif]
+Body text --> Body text in Newsreader serif (same)
+16px, 1.5 line height --> 20px, 1.6 line height
+White background --> Warm cream (#f0ede6)
+Dark gray text --> Dark brown (#1f1e1d)
+```
+**Best for:** Literary, sophisticated feel | Unified serif throughout
+
+---
+
+#### Approach 3: Blowfish Evolution (Modern)
+```
+BEFORE: AFTER:
+[Congo default] --> [Blowfish with serif headings]
+Sans-serif body --> San-serif body (improved)
+16px --> 18px
+1.5 line height --> 1.7 line height
+Current spacing --> Generous whitespace/padding
+```
+**Best for:** Modern tech aesthetic | Easier migration path
+
+---
+
+### IMMEDIATE VISUAL CHANGES
+
+**Typography improvement boils down to 3 things:**
+
+1. **Font Selection**
+ - Headings: Switch from default to serif (Crimson Text, Merriweather, or Georgia)
+ - Effect: Instant premium feel, 80% of the improvement
+
+2. **Spacing** (line-height + margins)
+ - Increase body line-height from 1.5 to 1.6-1.7
+ - Increase margins between sections
+ - Effect: More breathing room, easier to read
+
+3. **Color & Width**
+ - Option: Keep pure white OR add warm cream background
+ - Reduce max-width to 700-850px (narrower = more readable)
+ - Effect: Better focus, more intimate feel
+
+---
+
+### MEASUREMENTS COMPARISON
+
+```
+METRIC Sam Altman Dario Amodei Congo (Current)
+Body Font Size 16px 20px 14-16px
+Body Line Height 1.6 (25.6px) 1.6 (32px) ~1.5
+Heading Font Size (H1) 50px 36px Varies
+Heading Weight 400 600 Varies
+Content Width 500px 800px+ 800px+
+Paragraph Margin 24px 20px ~15-20px
+Background #fff #f0ede6 Avocado scheme
+Text Color #555 #1f1e1d Varies
+```
+
+---
+
+### FONT STACK EXAMPLES
+
+**Option A (Sam Altman style):**
+```css
+/* Headings */
+font-family: 'Crimson Text', Georgia, serif;
+
+/* Body */
+font-family: 'Oxygen', -apple-system, BlinkMacSystemFont, sans-serif;
+```
+
+**Option B (Dario Amodei style):**
+```css
+/* All text */
+font-family: 'Newsreader', Georgia, 'Times New Roman', serif;
+```
+
+**Option C (Blowfish compatible):**
+```css
+/* Headings */
+font-family: 'Merriweather', Georgia, serif;
+
+/* Body */
+font-family: 'Inter', system-ui, -apple-system, sans-serif;
+```
+
+---
+
+### ONE-SENTENCE SUMMARY
+
+Sam Altman = **Classic elegance** (serif + sans contrast)
+Dario Amodei = **Warm literacy** (unified serif, cream background)
+Blowfish = **Modern readability** (clean sans + serif accents)
+
diff --git a/TYPOGRAPHY_RESEARCH.md b/TYPOGRAPHY_RESEARCH.md
new file mode 100644
index 0000000..cd73796
--- /dev/null
+++ b/TYPOGRAPHY_RESEARCH.md
@@ -0,0 +1,202 @@
+# Typography Research: Premium CEO/Founder Blog Design
+## Research for internetforkids.org Redesign
+
+### REFERENCE SITES ANALYZED
+
+#### 1. Sam Altman's Blog (blog.samaltman.com)
+**Platform:** Posthaven (custom blog hosting)
+**Typography Profile:**
+- **Body Text:** Oxygen sans-serif, 16px, line-height 25.6px (1.6x)
+- **Headings:** Crimson Text serif (elegant classical serif), 50px (h1), 26px (h2), font-weight 400
+- **Content Width:** 500px (tight, focused reading)
+- **Color:** Dark gray (rgb(85,85,85)) on white
+- **Margins:** 80px bottom margin between articles
+- **Visual Style:** Minimal sidebar nav, clean article focus, serif headings create premium feel
+- **Key Feature:** Perfect contrast between serif headings and sans-serif body - typography-driven design
+
+#### 2. Dario Amodei's Site (darioamodei.com)
+**Platform:** Webflow (custom-built)
+**Typography Profile:**
+- **Body Text:** Newsreader 24 Pt (custom serif typeface), 20px, line-height 32px (1.6x)
+- **Headings:** Same Newsreader font, 28.8px, font-weight 600
+- **Background:** Warm off-white (rgb(240,238,230)) - cream/tan color
+- **Content Width:** Max content appears ~800-900px
+- **Paragraph Spacing:** 20px bottom margin
+- **Color:** Very dark brown (rgb(31,30,29))
+- **Visual Style:** Essay-focused, clean list navigation, warm palette, generous whitespace
+- **Key Feature:** Unified serif typography throughout creates "literary" aesthetic
+
+#### 3. Medium CEO Blog Tag
+**Platform:** Medium.com
+**Typography Profile:**
+- **Body Text:** Times font, 16px
+- **Headings:** Sohne sans-serif, 42px, font-weight 500, line-height 52px
+- **Text Color:** Dark with alpha transparency rgba(0,0,0,0.8)
+- **Layout:** Card-based article previews with images
+- **Visual Style:** Clean grid, image-heavy curation
+- **Key Feature:** Sans-serif headings with generous line-height (1.24x) allows larger size without feeling cramped
+
+---
+
+### DESIGN PATTERNS SUMMARY
+
+#### TYPOGRAPHY HIERARCHY
+All premium CEO blogs use this pattern:
+1. **Serif headings** (Crimson Text, Newsreader, Times) - conveys sophistication
+2. **Sans-serif body** or **consistent serif throughout** - readability focus
+3. **Line-height 1.6x** standard (25.6px-32px) - premium spacing
+4. **Generous margins** - breathing room between articles/sections
+
+#### CONTENT WIDTH STRATEGIES
+- **Sam Altman:** 500px - ultra-focused reading (oldest, Posthaven)
+- **Dario Amodei:** ~800-900px - comfortable essay width
+- **Medium:** Full-width cards, article content centered
+
+#### COLOR PALETTES
+- **Sam Altman:** Pure white background + dark gray text (classic)
+- **Dario Amodei:** Warm off-white/cream background (rgb(240,238,230)) + dark brown (more inviting)
+- **Medium:** White + near-black (standard web)
+
+---
+
+### HUGO THEMES ANALYSIS
+
+#### BLOWFISH (Actively maintained, Tailwind CSS)
+- **Typography:** Tailwind default (system-ui sans-serif)
+- **Body:** 18px, line-height 28px
+- **Headings:** 36px, line-height 40px
+- **Strengths:** Modern, lightweight, responsive, good for tech blogs
+- **Weakness:** Uses sans-serif throughout, less premium feel than CEO blogs
+
+#### CURRENT: CONGO THEME
+- **Used by:** internetforkids.org
+- **Assessment:** Functional but dated, color-scheme focused rather than typography-focused
+- **Issue:** No special serif/sans-serif contrast, standard blog styling
+
+---
+
+### KEY TYPOGRAPHY RECOMMENDATIONS FOR INTERNETFORKIDS.ORG
+
+#### OPTION A: "Premium CEO Blog" (Dario Amodei style)
+**Best for:** Creating premium, literary feel
+- **Headings:** Serif font (Crimson Text, Merriweather, or Georgia)
+ - H1: 28-36px, weight 600-700
+ - H2: 24px, weight 600
+- **Body:** Serif OR high-quality sans-serif
+ - Font size: 18-20px
+ - Line-height: 1.6-1.7 (28-34px actual)
+ - Max width: 700-850px
+- **Background:** Warm off-white/cream (rgb(240,238,230) or similar)
+- **Text Color:** Dark brown (rgb(31-40, 30-35, 29-25))
+
+#### OPTION B: "Classic Contrast" (Sam Altman style)
+**Best for:** Clean, modern aesthetic with traditional feel
+- **Headings:** Serif (Crimson Text)
+ - H1: 48-56px, weight 400
+- **Body:** Clean sans-serif (Oxygen, Inter, system-ui)
+ - Font size: 16-18px
+ - Line-height: 1.6
+- **Content Width:** 500-600px (narrow, focused)
+- **Background:** Pure white
+- **Color:** Dark gray to black
+
+#### OPTION C: "Modern Blowfish Evolution" (Current + Typography)
+**Best for:** Staying with Hugo, but improving typography
+- Modify Congo theme or switch to Blowfish
+- Add serif Google Fonts headings
+- Increase body font size to 18px minimum
+- Increase line-height to 1.7
+- Add generous margin/padding
+- Warm color palette option
+
+---
+
+### RECOMMENDED FONTS (Web Safe + Google Fonts)
+
+#### SERIF (Headings)
+- **Crimson Text** - Classic, elegant (Sam Altman choice)
+- **Merriweather** - Friendly, readable serif
+- **Newsreader** - Modern editorial serif (Dario Amodei choice, custom)
+- **Georgia** - Web-safe fallback, built-in
+- **EB Garamond** - High elegance, small caps
+
+#### SANS-SERIF (Body)
+- **Inter** - Modern, super readable (used by Blowfish)
+- **Oxygen** - Friendly, humanist (Sam Altman choice)
+- **System-ui** - OS default fonts (fastest, no load)
+- **Newsreader** - Can use throughout (literary approach)
+- **Lora** - Optimized for screen reading
+
+---
+
+### SPECIFIC CSS VALUES TO IMPLEMENT
+
+```css
+/* DARIO AMODEI INSPIRED */
+body {
+ font-family: Georgia, 'Newsreader', serif; /* or serif-only */
+ font-size: 20px;
+ line-height: 1.6; /* = 32px */
+ color: #1f1e1d;
+ background: #f0ede6; /* warm cream */
+}
+
+h1, h2, h3 { font-family: Georgia, serif; }
+h1 { font-size: 32-36px; font-weight: 600; }
+h2 { font-size: 24px; font-weight: 600; }
+
+article {
+ max-width: 800px;
+ margin: 0 auto;
+ padding: 40px 20px;
+}
+
+/* SAM ALTMAN INSPIRED */
+body {
+ font-family: 'Oxygen', -apple-system, sans-serif;
+ font-size: 16px;
+ line-height: 1.6;
+ color: #555;
+}
+
+h1, h2, h3 {
+ font-family: 'Crimson Text', Georgia, serif;
+ font-weight: 400;
+}
+
+article {
+ max-width: 500px;
+ margin: 0 auto;
+}
+
+article + article {
+ margin-top: 80px;
+}
+```
+
+---
+
+### VISUAL DISTINCTIONS
+
+| Aspect | Sam Altman | Dario Amodei | Medium |
+|--------|-----------|--------------|--------|
+| **Serif/Sans** | Serif headings + Sans body | All serif | Sans headings + serif body |
+| **Line Height** | 1.6 | 1.6 | 1.24 (headings), 1.6 (body) |
+| **Width** | 500px (tight) | 800px+ (comfortable) | Full-width |
+| **Background** | Pure white | Warm cream | White |
+| **Text Color** | Medium gray | Dark brown | Near-black |
+| **Overall Feel** | Classic minimal | Literary, warm | Modern, democratic |
+
+---
+
+### NEXT STEPS FOR INTERNETFORKIDS.ORG
+
+1. **Choose style direction:** Premium literary (Dario) vs. classic minimal (Sam)
+2. **Select font family:** Crimson Text (serif headings) or Newsreader (serif throughout)
+3. **Adjust spacing:** Increase line-height from current ~1.5 to 1.6-1.7
+4. **Set content width:** 700-850px for readability (current Congo theme likely wider)
+5. **Add whitespace:** Increase margins/padding between sections
+6. **Consider background:** Keep white or add warm cream tone
+7. **Test on live content:** Ensure changes work with existing posts
+8. **Consider theme swap:** Blowfish (modern) or custom modifications to Congo
+
diff --git a/themes/congo b/themes/congo
new file mode 160000
index 0000000..b426bf9
--- /dev/null
+++ b/themes/congo
@@ -0,0 +1 @@
+Subproject commit b426bf91b0a90edbb4063bf4efd463536a1f99fe