diff --git a/CLAUDE.md b/CLAUDE.md
index 3b5317c..9e1306e 100644
--- a/CLAUDE.md
+++ b/CLAUDE.md
@@ -37,7 +37,8 @@ planetnix-website/
 │   ├── css/
 │   │   └── pico.min.css   # Pico CSS framework
 │   ├── fonts/             # Local fonts (Geist, Geist Mono)
-│   ├── images/            # Optimized images (76.6% size reduction)
+│   ├── images/            # Source images (PNGs, SVGs)
+│   │   └── generated/     # Generated images (WebP, responsive sizes)
 │   └── js/                # JavaScript files (if needed)
 ├── Justfile               # Command runner recipes with inline docs
 ├── .github/workflows/     # CI/CD automation
@@ -51,10 +52,15 @@ planetnix-website/
 All extra resources needed for the website should be placed in the `assets/` folder:
 - **assets/css/** - CSS stylesheets (Pico CSS only; custom styles are inlined in index.html for performance)
 - **assets/fonts/** - Local font files (Geist 400/700, Geist Mono 400 - only critical weights)
-- **assets/images/** - Optimized images, icons, logos, and graphics
-  - All images optimized using pngquant and optipng
-  - Lazy loading for below-the-fold images
+- **assets/images/** - Source images (PNG, SVG) and icons
+  - Source PNGs are optimized using pngquant and optipng
   - Total size reduced from 2.3 MB to 556 KB
+  - **DO NOT manually edit files in generated/ folder**
+- **assets/images/generated/** - Generated/optimized images (automatically created)
+  - WebP versions of all source PNGs
+  - Responsive image sizes (480w, 768w, 1024w) for background images
+  - Lazy loading for below-the-fold images
+  - This folder is regenerated by `just regenerate-all-images`
 - **assets/js/** - JavaScript files for interactivity (minimal)
 
 ## Development Workflow
@@ -64,41 +70,56 @@ All extra resources needed for the website should be placed in the `assets/` fol
 # 1. Enter the development environment
 flox activate
 
-# 2. Start the development server
-just dev
+# 2. Start the development server (managed by Flox services)
+flox services start
 
 # 3. Edit index.html - changes reload automatically
+
+# 4. Stop the server when done
+flox services stop
 ```
 
 ### Common Tasks
 
-**Important**: All `just` commands must be run within the Flox environment using `flox activate --`:
+**Important**: Development server is managed by Flox services, not Just commands.
 
 ```bash
+# Development Server (Flox Services)
+flox activate                                   # Enter environment first
+flox services start                             # Start dev server (http://localhost:8888)
+flox services stop                              # Stop dev server
+flox services status                            # Check server status
+
+# Just Commands (run within Flox environment)
 flox activate -- just                           # List all available commands
-flox activate -- just dev                       # Start development server
 flox activate -- just perf                      # Quick performance check (91/100 current)
 flox activate -- just lighthouse                # Full performance audit with HTML report
 flox activate -- just lighthouse-mobile         # Mobile performance test
-flox activate -- just optimize-images           # Re-optimize all PNG images
-flox activate -- just generate-responsive-images # Create responsive image sizes (480w, 768w, 1024w)
+flox activate -- just optimize-images           # Re-optimize source PNG images in-place
+flox activate -- just generate-responsive-images # Create responsive image sizes in generated/
+flox activate -- just generate-favicons         # Generate all favicon and app icons
+flox activate -- just regenerate-all-images     # Regenerate ALL images (WebP + responsive)
 flox activate -- just clean                     # Remove generated reports
-flox activate -- just info                      # Show environment info
 ```
 
-Alternatively, activate the Flox shell first, then run just commands directly:
+Alternatively, activate the Flox shell first, then run commands directly:
 ```bash
 flox activate
-# Now you can run just commands directly:
-just dev
+# Shows environment info and available commands automatically
+
+# Now you can run commands directly:
+flox services start
 just perf
+just lighthouse
+flox services stop
 ```
 
 ### Performance Testing
-- **Local**: Use `flox activate -- just perf` before committing
+- **Local**: Start server with `flox services start`, then use `just perf` before committing
 - **CI/CD**: Automated Lighthouse tests on every PR
 - **Comparison**: CI compares PR performance vs base branch
 - **Reports**: Posted as PR comments with score deltas
+- **Note**: Lighthouse commands require the dev server to be running
 
 ## Git Workflow
 
@@ -113,12 +134,35 @@ just perf
   - Keep PR descriptions concise and focused on the changes made
   - Describe what was changed and why, not how to test it
 
+## Image Workflow
+
+### Source vs Generated Images
+- **Source images** (`assets/images/`): Original PNGs and SVGs
+  - Edit and optimize these files when you need to change images
+  - Use `just optimize-images` to optimize source PNGs in-place
+- **Generated images** (`assets/images/generated/`): Auto-generated WebP and responsive sizes
+  - **NEVER manually edit** files in this folder
+  - Regenerate with `just regenerate-all-images` or `just generate-responsive-images`
+  - These files are referenced in index.html for optimal loading
+
+### Adding New Images
+1. Add source PNG/SVG to `assets/images/`
+2. Optimize it: `flox activate -- just optimize-images`
+3. Regenerate all optimized versions: `flox activate -- just regenerate-all-images`
+4. Update index.html to reference the new image (use generated/ for WebP versions)
+
+### Updating Favicons
+1. Replace `assets/images/planetnix-logo-small.png` with your new logo
+2. Regenerate all favicons: `flox activate -- just generate-favicons`
+3. All favicon and app icons will be updated in `assets/images/generated/`
+
 ## Design Philosophy
 
 - **No build process**: Direct HTML and CSS for maximum simplicity
 - **Single-page design**: All content accessible from one page
 - **Semantic styling**: Pico CSS uses semantic HTML, no utility classes
 - **Performance first**: Every optimization counts
+- **Separation of source and generated**: Source images in `assets/images/`, generated in `assets/images/generated/`
   - Images: 2.3 MB → 556 KB (76.6% reduction)
   - Initial load: Only 139 KB of images (lazy loading)
   - CSS inlined: Custom styles inlined to eliminate render-blocking requests
@@ -130,11 +174,15 @@ just perf
 
 ### Implemented
 - ✅ **Image optimization**: pngquant + optipng (76.6% size reduction)
+  - Source images in `assets/images/` (PNGs, SVGs)
+  - Generated images in `assets/images/generated/` (WebP, responsive sizes)
+  - Regenerate all with `just regenerate-all-images`
 - ✅ **Responsive images**: Multiple sizes (480w, 768w, 1024w, 1280w) for adaptive loading
   - **Why responsive?** Saves 142 KB on mobile by serving appropriately sized images
   - Background images use `srcset` to load optimal size based on viewport
   - Generated using `just generate-responsive-images` command
   - Smaller images for mobile (480w: ~15KB) vs desktop (1280w: ~100KB)
+  - All generated files placed in `assets/images/generated/`
 - ✅ **Lazy loading**: Below-the-fold images load on demand
 - ✅ **Explicit image dimensions**: All images have width/height attributes
   - **Why?** Prevents layout shift (CLS) during page load
diff --git a/Justfile b/Justfile
index 46c0189..c049eae 100644
--- a/Justfile
+++ b/Justfile
@@ -12,28 +12,23 @@
 # - imagemagick, pngquant, optipng: Image optimization tools
 #
 # Quick Start:
-#   just              # Show all available commands
-#   just dev          # Start development server
-#   just lighthouse   # Run performance audit
-#   just perf         # Quick performance score
+#   flox activate            # Enter development environment
+#   flox services start      # Start development server (http://localhost:8888)
+#   just                     # Show all available commands
+#   just lighthouse          # Run performance audit
+#   just perf                # Quick performance score
+#   flox services stop       # Stop development server
 #
 # Available Commands:
 #
-# Development:
-#   just dev                 - Start livereload server on http://localhost:8888
-#
 # Performance Testing (Lighthouse):
 #   just lighthouse          - Standard Lighthouse audit (opens HTML report)
 #   just lighthouse-full     - Comprehensive desktop audit
 #   just lighthouse-mobile   - Mobile performance audit
 #   just perf                - Quick performance score check (84/100 baseline)
 #
-#   All Lighthouse commands automatically:
-#   - Start dev server in background
-#   - Run the audit
-#   - Generate HTML and JSON reports
-#   - Open report in browser (except perf)
-#   - Stop server when done
+#   Note: Ensure dev server is running (flox services start) before
+#   running Lighthouse commands
 #
 # Image Optimization:
 #   just optimize-images              - Optimize all PNG images in assets/images/
@@ -41,9 +36,14 @@
 #   just generate-responsive-images   - Generate 480w, 768w, 1024w versions of
 #                                       background images for responsive loading
 #                                       Creates WebP versions optimized for mobile
+#                                       All generated files placed in assets/images/generated/
+#   just generate-favicons            - Generate all favicon and app icons from
+#                                       planetnix-logo-small.png (16x16, 32x32, 180x180,
+#                                       192x192, 512x512, favicon.ico)
+#   just regenerate-all-images        - Regenerate ALL optimized images from source
+#                                       Creates WebP versions of all PNGs + responsive sizes
 #
 # Utilities:
-#   just info                - Show Flox environment information
 #   just clean               - Remove all generated Lighthouse reports
 #
 # Report Files (all gitignored):
@@ -53,47 +53,50 @@
 #   lighthouse-perf.json                 - Performance score only
 #
 # Example Workflow:
-#   just info                # Check environment
+#   flox activate            # Enter environment (shows info + commands)
+#   flox services start      # Start dev server
 #   just lighthouse          # Run audit
 #   just lighthouse-mobile   # Test mobile
+#   flox services stop       # Stop dev server
 #   just clean               # Clean up reports
 #
 # Notes:
 # - Lighthouse runs via 'npx lighthouse' for cross-platform compatibility
 # - First run will auto-download Lighthouse (~1 minute)
 # - Subsequent runs are instant
-# - Dev server runs on http://localhost:8888
-# - Helper recipes (start-server-bg, stop-server) are internal utilities
+# - Dev server runs on http://localhost:8888 (managed by Flox services)
 #
 # ============================================================================
 
-# Default recipe - show available commands
-@_default:
-    just --list --unsorted
-
-# Start the development server
-dev:
-    @echo "🚀 Starting development server on http://localhost:8888"
-    flox activate -- livereload --port 8888
+# Default recipe - show environment info and available commands
+_default:
+    @echo "📦 Environment Information:"
+    @echo ""
+    @flox list
+    @echo ""
+    @echo "🔗 Dev Server: http://localhost:8888"
+    @echo ""
+    @echo "📋 Available Commands:"
+    @echo ""
+    @just --list --unsorted
 
 # Run Lighthouse performance audit
-lighthouse: start-server-bg
+lighthouse:
     @echo "🔍 Running Lighthouse performance audit..."
     @sleep 3
-    flox activate -- npx lighthouse http://localhost:8888 \
+    @flox activate -- npx lighthouse http://localhost:8888 \
         --output html \
         --output json \
         --output-path ./lighthouse-report \
         --view \
         --chrome-flags="--headless"
     @echo "✅ Lighthouse report generated: lighthouse-report.html"
-    @just stop-server
 
 # Run Lighthouse with detailed metrics
-lighthouse-full: start-server-bg
+lighthouse-full:
     @echo "🔍 Running comprehensive Lighthouse audit..."
     @sleep 3
-    flox activate -- npx lighthouse http://localhost:8888 \
+    @flox activate -- npx lighthouse http://localhost:8888 \
         --output html \
         --output json \
         --output-path ./lighthouse-report-full \
@@ -102,13 +105,12 @@ lighthouse-full: start-server-bg
         --view \
         --chrome-flags="--headless"
     @echo "✅ Full Lighthouse report generated: lighthouse-report-full.html"
-    @just stop-server
 
 # Run Lighthouse for mobile
-lighthouse-mobile: start-server-bg
+lighthouse-mobile:
     @echo "📱 Running Lighthouse mobile audit..."
     @sleep 3
-    flox activate -- npx lighthouse http://localhost:8888 \
+    @flox activate -- npx lighthouse http://localhost:8888 \
         --output html \
         --output json \
         --output-path ./lighthouse-mobile \
@@ -116,13 +118,12 @@ lighthouse-mobile: start-server-bg
         --view \
         --chrome-flags="--headless"
     @echo "✅ Mobile Lighthouse report generated: lighthouse-mobile.html"
-    @just stop-server
 
 # Quick performance check (just scores, no report)
-perf: start-server-bg
+perf:
     @echo "⚡ Running quick performance check..."
     @sleep 3
-    flox activate -- npx lighthouse http://localhost:8888 \
+    @flox activate -- npx lighthouse http://localhost:8888 \
         --only-categories=performance \
         --output json \
         --output-path ./lighthouse-perf.json \
@@ -130,21 +131,6 @@ perf: start-server-bg
         --chrome-flags="--headless"
     @echo "📊 Performance Score:"
     @flox activate -- node -e "const data = require('./lighthouse-perf.json'); console.log('  Performance: ' + Math.round(data.categories.performance.score * 100) + '/100');"
-    @just stop-server
-
-# Start server in background (helper)
-start-server-bg:
-    @echo "🔧 Starting server in background..."
-    @flox activate -- livereload --port 8888 > /dev/null 2>&1 & echo $$! > .server.pid
-    @sleep 2
-
-# Stop background server (helper)
-stop-server:
-    @if [ -f .server.pid ]; then \
-        echo "🛑 Stopping server..."; \
-        kill `cat .server.pid` 2>/dev/null || true; \
-        rm .server.pid; \
-    fi
 
 # Clean up generated reports
 clean:
@@ -173,24 +159,33 @@ optimize-images:
 # Generate responsive image sizes for background images
 # Creates 480w, 768w, and 1024w versions of specified images for responsive loading
 # Original 1280w images are preserved
+# All generated files are placed in assets/images/generated/
 generate-responsive-images:
     @echo "🖼️  Generating responsive image sizes..."
+    @mkdir -p assets/images/generated
     @cd assets/images && \
     for img in location-bg about-bg; do \
         echo "  Processing $${img}..."; \
         if [ -f "$${img}.png" ]; then \
             echo "    Creating 480w version..."; \
-            sips -z 320 480 "$${img}.png" --out "$${img}-480w.png" > /dev/null 2>&1; \
+            sips -z 320 480 "$${img}.png" --out "generated/$${img}-480w.png" > /dev/null 2>&1; \
             echo "    Creating 768w version..."; \
-            sips -z 512 768 "$${img}.png" --out "$${img}-768w.png" > /dev/null 2>&1; \
+            sips -z 512 768 "$${img}.png" --out "generated/$${img}-768w.png" > /dev/null 2>&1; \
             echo "    Creating 1024w version..."; \
-            sips -z 682 1024 "$${img}.png" --out "$${img}-1024w.png" > /dev/null 2>&1; \
+            sips -z 682 1024 "$${img}.png" --out "generated/$${img}-1024w.png" > /dev/null 2>&1; \
         else \
             echo "    ⚠️  $${img}.png not found, skipping"; \
         fi; \
     done && \
     echo "  Optimizing resized PNGs..." && \
-    just optimize-images > /dev/null && \
+    cd generated && \
+    for png in *-{480,768,1024}w.png; do \
+        if [ -f "$$png" ]; then \
+            flox activate -- pngquant --quality=65-80 --speed 1 --force "$$png" -o "$${png%.png}-temp.png" && \
+            flox activate -- optipng -o2 "$${png%.png}-temp.png" && \
+            mv "$${png%.png}-temp.png" "$$png"; \
+        fi; \
+    done && \
     echo "  Converting to WebP..." && \
     for img in location-bg about-bg; do \
         for size in 480 768 1024; do \
@@ -202,12 +197,58 @@ generate-responsive-images:
     @echo "✅ Responsive images generated"
     @echo ""
     @echo "📊 File sizes created:"
-    @cd assets/images && ls -lh *-{480,768,1024}w.webp 2>/dev/null || echo "No responsive images found"
+    @cd assets/images/generated && ls -lh *-{480,768,1024}w.webp 2>/dev/null || echo "No responsive images found"
 
-# Show current environment info
-info:
-    @echo "📦 Environment Information:"
+# Generate all favicon and app icon sizes from planetnix-logo-small.png
+# Creates all required icon sizes in assets/images/generated/
+# Sizes: favicon.ico, 16x16, 32x32, apple-touch-icon (180x180), android-chrome (192x192, 512x512)
+generate-favicons:
+    @echo "🎨 Generating favicons and app icons from planetnix-logo-small.png..."
+    @mkdir -p assets/images/generated
+    @cd assets/images && \
+    if [ ! -f "planetnix-logo-small.png" ]; then \
+        echo "❌ Error: planetnix-logo-small.png not found in assets/images/"; \
+        exit 1; \
+    fi && \
+    echo "  Creating favicon-16x16.png..." && \
+    flox activate -- magick planetnix-logo-small.png -resize 16x16 generated/favicon-16x16.png && \
+    echo "  Creating favicon-32x32.png..." && \
+    flox activate -- magick planetnix-logo-small.png -resize 32x32 generated/favicon-32x32.png && \
+    echo "  Creating apple-touch-icon.png (180x180)..." && \
+    flox activate -- magick planetnix-logo-small.png -resize 180x180 generated/apple-touch-icon.png && \
+    echo "  Creating android-chrome-192x192.png..." && \
+    flox activate -- magick planetnix-logo-small.png -resize 192x192 generated/android-chrome-192x192.png && \
+    echo "  Creating android-chrome-512x512.png..." && \
+    flox activate -- magick planetnix-logo-small.png -resize 512x512 generated/android-chrome-512x512.png && \
+    echo "  Creating favicon.ico (multi-resolution)..." && \
+    flox activate -- magick planetnix-logo-small.png -resize 16x16 -resize 32x32 -resize 48x48 generated/favicon.ico
+    @echo "✅ All favicons and app icons generated"
     @echo ""
-    @flox list
+    @echo "📊 Generated files:"
+    @cd assets/images/generated && ls -lh favicon* apple-touch-icon.png android-chrome-*.png 2>/dev/null
+
+# Regenerate all optimized images from source images
+# This command:
+# 1. Finds all PNG source images in assets/images/ (excluding generated/ folder)
+# 2. Creates WebP versions of all source PNGs in generated/
+# 3. Generates responsive sizes (480w, 768w, 1024w) for background images
+regenerate-all-images:
+    @echo "🖼️  Regenerating all optimized images..."
+    @mkdir -p assets/images/generated
     @echo ""
-    @echo "🔗 Dev Server: http://localhost:8888"
+    @echo "📸 Converting source PNGs to WebP..."
+    @cd assets/images && \
+    for img in *.png; do \
+        if [ -f "$$img" ] && [ "$$img" != "generated" ]; then \
+            echo "  Converting $$img to WebP..."; \
+            flox activate -- cwebp -q 90 "$$img" -o "generated/$${img%.png}.webp" 2>&1 | grep -E "(Saving|Output)" || true; \
+        fi; \
+    done
+    @echo ""
+    @echo "📐 Generating responsive sizes for background images..."
+    @just generate-responsive-images
+    @echo ""
+    @echo "✅ All optimized images regenerated"
+    @echo ""
+    @echo "📊 Generated files:"
+    @cd assets/images/generated && ls -lh *.webp 2>/dev/null | head -20 || echo "No generated images found"
diff --git a/README.md b/README.md
index 25cac01..940e55f 100644
--- a/README.md
+++ b/README.md
@@ -29,11 +29,16 @@ cd website
 flox activate
 
 # 3. Start the development server
-just dev
+flox services start
 ```
 
 That's it! Open http://localhost:8888 in your browser and start coding. Changes reload automatically.
 
+When you're done:
+```bash
+flox services stop
+```
+
 ## 🛠️ Technology Stack
 
 ### Core Technologies
@@ -56,20 +61,24 @@ That's it! Open http://localhost:8888 in your browser and start coding. Changes
 We use [Just](https://github.com/casey/just) for common development tasks. Run `just` to see all available commands:
 
 ```bash
-# Development
-just dev                 # Start development server on http://localhost:8888
-just info                # Show environment information
+# Development Server (managed by Flox)
+flox services start      # Start development server on http://localhost:8888
+flox services stop       # Stop development server
+flox services status     # Check server status
 
-# Performance Testing
+# Performance Testing (requires server to be running)
 just lighthouse          # Run full Lighthouse audit (opens HTML report)
 just lighthouse-mobile   # Test mobile performance
 just perf                # Quick performance score check
 
 # Image Optimization
-just optimize-images              # Optimize all PNG images
+just optimize-images              # Optimize all PNG images in place
 just generate-responsive-images   # Create responsive sizes (480w, 768w, 1024w)
+just generate-favicons            # Generate all favicon and app icons
+just regenerate-all-images        # Regenerate ALL optimized images from source
 
 # Utilities
+just                     # Show environment info and available commands
 just clean               # Remove generated reports
 ```
 
@@ -82,7 +91,8 @@ planetnix-website/
 │   ├── css/
 │   │   └── pico.min.css   # Pico CSS framework
 │   ├── fonts/             # Local fonts (Geist 400/700, Geist Mono 400)
-│   ├── images/            # Optimized images and icons
+│   ├── images/            # Source images and icons
+│   │   └── generated/     # Generated images (WebP, responsive sizes)
 │   └── js/                # JavaScript (if needed)
 ├── Justfile               # Command runner recipes
 ├── .github/workflows/     # CI/CD automation
@@ -106,10 +116,13 @@ We take performance seriously. Here's what we've optimized:
 
 ### Optimizations Applied
 - **Images**: Optimized from 2.3 MB → 556 KB (76.6% reduction using pngquant + optipng)
+  - Source PNGs stored in `assets/images/`
+  - Generated WebP and responsive sizes in `assets/images/generated/`
+  - Regenerate all: `just regenerate-all-images`
 - **Responsive Images**: Multiple sizes (480w, 768w, 1024w, 1280w) for adaptive loading
   - **Why?** Saves 142 KB on mobile by serving appropriately sized images
   - Mobile devices load small versions (~15KB) instead of full-size (~100KB)
-  - Regenerate with: `just generate-responsive-images`
+  - Regenerate responsive sizes: `just generate-responsive-images`
 - **Initial Load**: Only 139 KB of images load initially (lazy loading for below-the-fold content)
 - **Explicit Image Dimensions**: All images have width/height to prevent layout shift
   - **Why?** CLS score of 0 (perfect!) - no content jumping during load
@@ -154,13 +167,13 @@ We take performance seriously. Here's what we've optimized:
 3. **Make your changes**
    ```bash
    flox activate
-   just dev  # Start the dev server
+   flox services start  # Start the dev server
    # Edit files, see changes live!
    ```
 
 4. **Test your changes**
    ```bash
-   just perf  # Check performance impact
+   just perf  # Check performance impact (server must be running)
    ```
 
 5. **Commit and push**
@@ -206,8 +219,10 @@ Our CI/CD pipeline automatically:
 
 Test locally before pushing:
 ```bash
+flox services start    # Ensure server is running
 just perf              # Quick performance check
 just lighthouse        # Full audit with HTML report
+flox services stop     # Stop server when done
 ```
 
 ## 📚 Learn More
diff --git a/assets/images/bluesky.svg b/assets/images/bluesky.svg
new file mode 100644
index 0000000..8b48bb5
--- /dev/null
+++ b/assets/images/bluesky.svg
@@ -0,0 +1,10 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_77_35)">
+<path d="M12 10.8001C10.913 8.68606 7.954 4.74706 5.202 2.80506C2.566 0.944059 1.561 1.26606 0.902 1.56506C0.139 1.90806 0 3.08006 0 3.76806C0 4.45806 0.378 9.41806 0.624 10.2471C1.439 12.9831 4.337 13.9071 7.007 13.6111C7.143 13.5911 7.282 13.5721 7.422 13.5551C7.284 13.5771 7.146 13.5951 7.007 13.6111C3.095 14.1911 -0.38 15.6161 4.177 20.6891C9.19 25.8791 11.047 19.5761 12 16.3811C12.953 19.5761 14.05 25.6521 19.733 20.6891C24 16.3811 20.905 14.1911 16.993 13.6111C16.8542 13.5957 16.7159 13.577 16.578 13.5551C16.718 13.5721 16.857 13.5911 16.993 13.6111C19.663 13.9081 22.561 12.9831 23.376 10.2471C23.622 9.41906 24 4.45706 24 3.76906C24 3.07906 23.861 1.90806 23.098 1.56306C22.439 1.26506 21.434 0.943058 18.798 2.80306C16.046 4.74806 13.087 8.68706 12 10.8001Z" fill="white"/>
+</g>
+<defs>
+<clipPath id="clip0_77_35">
+<rect width="24" height="24" fill="white"/>
+</clipPath>
+</defs>
+</svg>
diff --git a/assets/images/about-bg-1024w.png b/assets/images/generated/about-bg-1024w.png
similarity index 100%
rename from assets/images/about-bg-1024w.png
rename to assets/images/generated/about-bg-1024w.png
diff --git a/assets/images/about-bg-1024w.webp b/assets/images/generated/about-bg-1024w.webp
similarity index 100%
rename from assets/images/about-bg-1024w.webp
rename to assets/images/generated/about-bg-1024w.webp
diff --git a/assets/images/about-bg-480w.png b/assets/images/generated/about-bg-480w.png
similarity index 100%
rename from assets/images/about-bg-480w.png
rename to assets/images/generated/about-bg-480w.png
diff --git a/assets/images/about-bg-480w.webp b/assets/images/generated/about-bg-480w.webp
similarity index 100%
rename from assets/images/about-bg-480w.webp
rename to assets/images/generated/about-bg-480w.webp
diff --git a/assets/images/about-bg-768w.png b/assets/images/generated/about-bg-768w.png
similarity index 100%
rename from assets/images/about-bg-768w.png
rename to assets/images/generated/about-bg-768w.png
diff --git a/assets/images/about-bg-768w.webp b/assets/images/generated/about-bg-768w.webp
similarity index 100%
rename from assets/images/about-bg-768w.webp
rename to assets/images/generated/about-bg-768w.webp
diff --git a/assets/images/about-bg.webp b/assets/images/generated/about-bg.webp
similarity index 100%
rename from assets/images/about-bg.webp
rename to assets/images/generated/about-bg.webp
diff --git a/assets/images/generated/android-chrome-192x192.png b/assets/images/generated/android-chrome-192x192.png
new file mode 100644
index 0000000..2f9868a
Binary files /dev/null and b/assets/images/generated/android-chrome-192x192.png differ
diff --git a/assets/images/generated/android-chrome-512x512.png b/assets/images/generated/android-chrome-512x512.png
new file mode 100644
index 0000000..7f7b8df
Binary files /dev/null and b/assets/images/generated/android-chrome-512x512.png differ
diff --git a/assets/images/generated/apple-touch-icon.png b/assets/images/generated/apple-touch-icon.png
new file mode 100644
index 0000000..2f9e175
Binary files /dev/null and b/assets/images/generated/apple-touch-icon.png differ
diff --git a/assets/images/generated/favicon-16x16.png b/assets/images/generated/favicon-16x16.png
new file mode 100644
index 0000000..d582f97
Binary files /dev/null and b/assets/images/generated/favicon-16x16.png differ
diff --git a/assets/images/generated/favicon-32x32.png b/assets/images/generated/favicon-32x32.png
new file mode 100644
index 0000000..0e83187
Binary files /dev/null and b/assets/images/generated/favicon-32x32.png differ
diff --git a/assets/images/generated/favicon.ico b/assets/images/generated/favicon.ico
new file mode 100644
index 0000000..6fa2c6d
Binary files /dev/null and b/assets/images/generated/favicon.ico differ
diff --git a/assets/images/grid.webp b/assets/images/generated/grid.webp
similarity index 100%
rename from assets/images/grid.webp
rename to assets/images/generated/grid.webp
diff --git a/assets/images/hero-moon.webp b/assets/images/generated/hero-moon.webp
similarity index 100%
rename from assets/images/hero-moon.webp
rename to assets/images/generated/hero-moon.webp
diff --git a/assets/images/location-bg-1024w.png b/assets/images/generated/location-bg-1024w.png
similarity index 100%
rename from assets/images/location-bg-1024w.png
rename to assets/images/generated/location-bg-1024w.png
diff --git a/assets/images/location-bg-1024w.webp b/assets/images/generated/location-bg-1024w.webp
similarity index 100%
rename from assets/images/location-bg-1024w.webp
rename to assets/images/generated/location-bg-1024w.webp
diff --git a/assets/images/location-bg-480w.png b/assets/images/generated/location-bg-480w.png
similarity index 100%
rename from assets/images/location-bg-480w.png
rename to assets/images/generated/location-bg-480w.png
diff --git a/assets/images/location-bg-480w.webp b/assets/images/generated/location-bg-480w.webp
similarity index 100%
rename from assets/images/location-bg-480w.webp
rename to assets/images/generated/location-bg-480w.webp
diff --git a/assets/images/location-bg-768w.png b/assets/images/generated/location-bg-768w.png
similarity index 100%
rename from assets/images/location-bg-768w.png
rename to assets/images/generated/location-bg-768w.png
diff --git a/assets/images/location-bg-768w.webp b/assets/images/generated/location-bg-768w.webp
similarity index 100%
rename from assets/images/location-bg-768w.webp
rename to assets/images/generated/location-bg-768w.webp
diff --git a/assets/images/location-bg.webp b/assets/images/generated/location-bg.webp
similarity index 100%
rename from assets/images/location-bg.webp
rename to assets/images/generated/location-bg.webp
diff --git a/assets/images/generated/speaker_kelsey_hightower.webp b/assets/images/generated/speaker_kelsey_hightower.webp
new file mode 100644
index 0000000..c348998
Binary files /dev/null and b/assets/images/generated/speaker_kelsey_hightower.webp differ
diff --git a/assets/images/generated/speaker_priya_ananthasankar.webp b/assets/images/generated/speaker_priya_ananthasankar.webp
new file mode 100644
index 0000000..3ccfaa4
Binary files /dev/null and b/assets/images/generated/speaker_priya_ananthasankar.webp differ
diff --git a/assets/images/generated/speaker_rok_garbas.webp b/assets/images/generated/speaker_rok_garbas.webp
new file mode 100644
index 0000000..cda710c
Binary files /dev/null and b/assets/images/generated/speaker_rok_garbas.webp differ
diff --git a/assets/images/generated/speaker_ron_efroni.webp b/assets/images/generated/speaker_ron_efroni.webp
new file mode 100644
index 0000000..491ba23
Binary files /dev/null and b/assets/images/generated/speaker_ron_efroni.webp differ
diff --git a/assets/images/generated/speaker_stormy_peters.webp b/assets/images/generated/speaker_stormy_peters.webp
new file mode 100644
index 0000000..2e98336
Binary files /dev/null and b/assets/images/generated/speaker_stormy_peters.webp differ
diff --git a/assets/images/mastodon.svg b/assets/images/mastodon.svg
new file mode 100644
index 0000000..2ea0ca8
--- /dev/null
+++ b/assets/images/mastodon.svg
@@ -0,0 +1,10 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_77_33)">
+<path d="M23.268 5.313C22.918 2.735 20.651 0.703 17.964 0.309C17.51 0.242 15.792 0 11.813 0H11.783C7.803 0 6.948 0.242 6.495 0.309C3.882 0.692 1.496 2.518 0.917002 5.127C0.640002 6.412 0.610002 7.837 0.661002 9.143C0.735002 11.017 0.749002 12.888 0.921002 14.754C1.039 15.994 1.246 17.224 1.541 18.434C2.091 20.671 4.318 22.532 6.501 23.291C8.837 24.083 11.35 24.214 13.757 23.671C14.022 23.61 14.284 23.539 14.543 23.458C15.128 23.274 15.813 23.068 16.317 22.705C16.3238 22.7 16.3294 22.6935 16.3333 22.6861C16.3373 22.6786 16.3396 22.6704 16.34 22.662V20.853C16.34 20.8451 16.3382 20.8373 16.3347 20.8302C16.3313 20.8231 16.3262 20.8169 16.32 20.812C16.3136 20.8069 16.3062 20.8033 16.2982 20.8016C16.2902 20.7999 16.2819 20.8 16.274 20.802C14.731 21.1671 13.1506 21.35 11.565 21.347C8.835 21.347 8.102 20.063 7.891 19.529C7.72217 19.0674 7.61491 18.5856 7.572 18.096C7.57159 18.0877 7.57313 18.0794 7.57649 18.0719C7.57986 18.0643 7.58496 18.0576 7.59138 18.0523C7.5978 18.0471 7.60536 18.0434 7.61346 18.0416C7.62156 18.0398 7.62996 18.04 7.638 18.042C9.155 18.405 10.71 18.588 12.27 18.588C12.646 18.588 13.02 18.588 13.395 18.578C14.965 18.534 16.619 18.454 18.163 18.156C18.201 18.148 18.24 18.141 18.273 18.132C20.708 17.668 23.026 16.212 23.262 12.528C23.27 12.383 23.292 11.008 23.292 10.858C23.294 10.346 23.459 7.228 23.268 5.313ZM19.52 14.508H16.959V8.29C16.959 6.981 16.409 6.314 15.289 6.314C14.059 6.314 13.443 7.104 13.443 8.664V12.067H10.897V8.663C10.897 7.103 10.28 6.313 9.049 6.313C7.937 6.313 7.381 6.981 7.379 8.29V14.508H4.822V8.102C4.822 6.792 5.159 5.752 5.833 4.982C6.529 4.212 7.441 3.818 8.573 3.818C9.884 3.818 10.875 4.318 11.535 5.316L12.173 6.376L12.811 5.316C13.471 4.317 14.461 3.818 15.771 3.818C16.901 3.818 17.814 4.213 18.511 4.982C19.186 5.752 19.523 6.792 19.523 8.102L19.52 14.508Z" fill="white"/>
+</g>
+<defs>
+<clipPath id="clip0_77_33">
+<rect width="24" height="24" fill="white"/>
+</clipPath>
+</defs>
+</svg>
diff --git a/assets/images/planetnix-logo-small.png b/assets/images/planetnix-logo-small.png
new file mode 100644
index 0000000..36b6eb7
Binary files /dev/null and b/assets/images/planetnix-logo-small.png differ
diff --git a/assets/images/speaker_kelsey_hightower.png b/assets/images/speaker_kelsey_hightower.png
index 1b8b932..842f890 100644
Binary files a/assets/images/speaker_kelsey_hightower.png and b/assets/images/speaker_kelsey_hightower.png differ
diff --git a/assets/images/speaker_kelsey_hightower.webp b/assets/images/speaker_kelsey_hightower.webp
deleted file mode 100644
index 216cdb9..0000000
Binary files a/assets/images/speaker_kelsey_hightower.webp and /dev/null differ
diff --git a/assets/images/speaker_priya_ananthasankar.png b/assets/images/speaker_priya_ananthasankar.png
index d609822..0cd44ef 100644
Binary files a/assets/images/speaker_priya_ananthasankar.png and b/assets/images/speaker_priya_ananthasankar.png differ
diff --git a/assets/images/speaker_priya_ananthasankar.webp b/assets/images/speaker_priya_ananthasankar.webp
deleted file mode 100644
index 7c0a09d..0000000
Binary files a/assets/images/speaker_priya_ananthasankar.webp and /dev/null differ
diff --git a/assets/images/speaker_rok_garbas.png b/assets/images/speaker_rok_garbas.png
index cb5357a..c827e18 100644
Binary files a/assets/images/speaker_rok_garbas.png and b/assets/images/speaker_rok_garbas.png differ
diff --git a/assets/images/speaker_rok_garbas.webp b/assets/images/speaker_rok_garbas.webp
deleted file mode 100644
index 1507767..0000000
Binary files a/assets/images/speaker_rok_garbas.webp and /dev/null differ
diff --git a/assets/images/speaker_ron_efroni.png b/assets/images/speaker_ron_efroni.png
index bb80143..a743d53 100644
Binary files a/assets/images/speaker_ron_efroni.png and b/assets/images/speaker_ron_efroni.png differ
diff --git a/assets/images/speaker_ron_efroni.webp b/assets/images/speaker_ron_efroni.webp
deleted file mode 100644
index 9d7535f..0000000
Binary files a/assets/images/speaker_ron_efroni.webp and /dev/null differ
diff --git a/assets/images/speaker_stormy_peters.webp b/assets/images/speaker_stormy_peters.webp
deleted file mode 100644
index cdc4bac..0000000
Binary files a/assets/images/speaker_stormy_peters.webp and /dev/null differ
diff --git a/assets/images/twitter.svg b/assets/images/twitter.svg
new file mode 100644
index 0000000..2719cb2
--- /dev/null
+++ b/assets/images/twitter.svg
@@ -0,0 +1,3 @@
+<svg width="24" height="22" viewBox="0 0 24 22" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M18.901 0H22.581L14.541 9.19L24 21.693H16.594L10.794 14.109L4.156 21.693H0.474L9.074 11.863L0 0.00100005H7.594L12.837 6.933L18.901 0ZM17.61 19.491H19.649L6.486 2.087H4.298L17.61 19.491Z" fill="white"/>
+</svg>
diff --git a/index.html b/index.html
index 8429b8e..6520deb 100644
--- a/index.html
+++ b/index.html
@@ -8,13 +8,13 @@
   <title>PlanetNix 2026</title>
   <meta name="description" content="PlanetNix 2026 - A two-day conference for Nix builders. March 5-6, 2026 in Pasadena, CA. Join developers, contributors, and teams using Nix in production for talks, workshops, and hands-on learning.">
 
-  <link rel="apple-touch-icon" sizes="180x180" href="assets/images/apple-touch-icon.png">
-  <link rel="icon" type="image/png" sizes="32x32" href="assets/images/favicon-32x32.png">
-  <link rel="icon" type="image/png" sizes="16x16" href="assets/images/favicon-16x16.png">
+  <link rel="apple-touch-icon" sizes="180x180" href="assets/images/generated/apple-touch-icon.png">
+  <link rel="icon" type="image/png" sizes="32x32" href="assets/images/generated/favicon-32x32.png">
+  <link rel="icon" type="image/png" sizes="16x16" href="assets/images/generated/favicon-16x16.png">
   <link rel="manifest" href="site.webmanifest">
 
   <!-- Preload LCP image for faster initial render -->
-  <link rel="preload" href="assets/images/hero-moon.webp" as="image" type="image/webp" fetchpriority="high">
+  <link rel="preload" href="assets/images/generated/hero-moon.webp" as="image" type="image/webp" fetchpriority="high">
 
   <!-- Preload critical fonts to speed up rendering -->
   <link rel="preload" href="assets/fonts/Geist-400.ttf" as="font" type="font/ttf" crossorigin>
@@ -50,11 +50,20 @@
   src: url(assets/fonts/GeistMono-400.ttf) format('truetype');
 }
 
+/* Configure pico */
+[data-theme="dark"],
 :root,
 :host {
     --pico-font-family-sans-serif: "Geist", sans-serif;
     --pico-font-family-monospace: "geist mono", monospace;
     --pico-color: #FFFFFF;
+    --pico-accordion-close-summary-color: #FFFFFF;
+    --pico-accordion-open-summary-color: #FFFFFF;
+    --pico-accordion-active-summary-color: #FFFFFF;
+    --pico-accordion-border-color: #FFFFFF;
+    --pico-accordion-close-summary-color: #FFFFFF;
+    --pico-accordion-open-summary-color: #FFFFFF;
+    --pico-icon-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgb(255, 255, 255)' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
 }
 
 /* Ensure images remain responsive with explicit dimensions */
@@ -240,28 +249,78 @@
 
 .signup-button {
     color: #FFFFFF;
-    background-color: #711AFF;
-    border: 1px solid #711AFF;
+    background-color: #5916C7;
+    border: 1px solid #5916C7;
     padding: 0.5em 1em;
     align-self: center;
     text-decoration: none;
 }
 
-.signup-button:hover {
-    /* background-color: transparent; */
-    /* color: #711AFF; */
-    border-color: #FFF;
-}
-
 /* Navigation Section */
 .navigation-section {
-    background-color: #000000;
+    background-color: rgba(0, 0, 0, 0.7);
+    backdrop-filter: blur(10px);
+    -webkit-backdrop-filter: blur(10px);
     justify-content: center;
     position: sticky;
     top: 0;
     z-index: 100;
     gap: 2em;
     height: 60px;
+    border-top: 1px solid #FFFFFF;
+    border-bottom: 1px solid #FFFFFF;
+}
+
+.navigation-section::before {
+    position: absolute;
+    background-color: #FFFFFF;
+    width: 1px;
+    height: 70px;
+    content: "";
+    z-index: 100;
+    top: -6px;
+    left: 46px;
+}
+
+.navigation-section::after{
+    position: absolute;
+    background-color: #FFFFFF;
+    width: 1px;
+    height: 70px;
+    content: "";
+    z-index: 100;
+    top: -6px;
+    right: 46px;
+}
+
+@media (max-width: 576px) {
+    .navigation-section::before{
+        left: 0;
+    }
+    .navigation-section::after{
+        right: 0;
+    }
+}
+
+.navigation-section ul {
+    display: flex;
+    list-style: none;
+    margin: 0;
+    padding: 0;
+    align-items: center;
+    height: 100%;
+}
+
+.navigation-section li {
+    display: flex;
+    align-items: center;
+    height: 100%;
+    border-right: 1px solid #FFFFFF;
+    padding: 0;
+}
+
+.navigation-section li:last-child {
+    border-right: none;
 }
 
 .navigation-section a {
@@ -271,18 +330,18 @@
     margin: 0 2em;
     padding: 0;
     font-size: 16px;
-    border-bottom: 1px solid #000;
+    border-bottom: 1px solid transparent;
+    transition: border-color 0.2s ease;
 }
 
 @media (max-width: 1024px) {
     .navigation-section a {
-        margin: 0 0.2em;
+        margin: 0 0.8em;
     }
 }
 
 .navigation-section a:hover {
-  border-bottom: 1px solid #FFF;
-  border-radius: 0;
+  color: #757575;
 }
 
 /* About Section */
@@ -517,6 +576,8 @@
 
 .faq-content {
     position: relative;
+    border-bottom: 1px solid #FFF;
+    margin-bottom: 5em;
 }
 
 .faq-content a {
@@ -527,10 +588,43 @@
     border-bottom: 1px solid #ffd02b;
 }
 
+.faq-content details {
+    border-top: 1px solid #FFFFFF;
+    padding-top: 1em;
+    color: #FFFFFF;
+}
+
+.faq-content details summary:focus:not([role]) {
+    color: #FFFFFF;
+}
+
+.faq-content details p,
+.faq-content details div {
+    color: #ADADAD;
+    font-size: 16px;
+}
+
+.faq-content blockquote {
+    border-left: 1px solid #ADADAD;
+    margin-left: 1em;
+    padding-top: 0.5em;
+    padding-bottom: 0.5em;
+}
+
+.faq-content blockquote p {
+    color: #ADADAD;
+}
+.faq-content blockquote h4 {
+    color: #ADADAD;
+    font-size: 1.3em;
+    font-weight: normal;
+}
+
 /* Footer */
 footer {
     font-size: 16px;
-    height: 200px;
+    font-family: var(--pico-font-family-monospace);
+    min-height: 250px;
     margin-top: 5em;
     padding-top: 120px;
     position: relative;
@@ -544,6 +638,23 @@
     );
 }
 
+@media (max-width: 768px) {
+    footer {
+        margin-top: -6em;
+    }
+}
+
+.footer-socials {
+    display: flex;
+    flex-direction: row;
+    justify-content: center;
+    margin: 0 10%;
+    border-top: 1px solid #FFF;
+    padding: 1em;
+    line-height: 1.8em;
+    gap: 3em;
+}
+
 .footer-content  {
     display: flex;
     flex-direction: row;
@@ -558,7 +669,6 @@
     .footer-content  {
         flex-direction: column;
         align-items: center;
-        margin-top: -2em;
     }
 }
 
@@ -606,7 +716,7 @@
     <section class="hero-section">
       <div class="hero-planet">
         <picture>
-          <source srcset="assets/images/hero-moon.webp" type="image/webp">
+          <source srcset="assets/images/generated/hero-moon.webp" type="image/webp">
           <img src="assets/images/hero-moon.png" alt="Moon" fetchpriority="high" width="1024" height="467">
         </picture>
       </div>
@@ -646,7 +756,7 @@ <h2 class="section-title">Speakers</h2>
         <div class="speakers-grid">
           <div>
             <picture>
-              <source srcset="assets/images/speaker_kelsey_hightower.webp" type="image/webp">
+              <source srcset="assets/images/generated/speaker_kelsey_hightower.webp" type="image/webp">
               <img src="assets/images/speaker_kelsey_hightower.png" loading="lazy" alt="Kelsey Hightower" width="267" height="267">
             </picture>
             <h3>Kelsey Hightower</h3>
@@ -654,7 +764,7 @@ <h3>Kelsey Hightower</h3>
           </div>
           <div>
             <picture>
-              <source srcset="assets/images/speaker_ron_efroni.webp" type="image/webp">
+              <source srcset="assets/images/generated/speaker_ron_efroni.webp" type="image/webp">
               <img src="assets/images/speaker_ron_efroni.png" loading="lazy" alt="Ron Efroni" width="267" height="267">
             </picture>
             <h3>Ron Efroni</h3>
@@ -662,7 +772,7 @@ <h3>Ron Efroni</h3>
           </div>
           <div>
             <picture>
-              <source srcset="assets/images/speaker_priya_ananthasankar.webp" type="image/webp">
+              <source srcset="assets/images/generated/speaker_priya_ananthasankar.webp" type="image/webp">
               <img src="assets/images/speaker_priya_ananthasankar.png" loading="lazy" alt="Priya Ananthasankar" width="267" height="267">
             </picture>
             <h3>Priya Ananthasankar</h3>
@@ -670,7 +780,7 @@ <h3>Priya Ananthasankar</h3>
           </div>
           <div>
             <picture>
-              <source srcset="assets/images/speaker_stormy_peters.webp" type="image/webp">
+              <source srcset="assets/images/generated/speaker_stormy_peters.webp" type="image/webp">
               <img src="assets/images/speaker_stormy_peters.png" loading="lazy" alt="Stormy Peters" width="267" height="267">
             </picture>
             <h3>Stormy Peters</h3>
@@ -678,7 +788,7 @@ <h3>Stormy Peters</h3>
           </div>
           <div>
             <picture>
-              <source srcset="assets/images/speaker_rok_garbas.webp" type="image/webp">
+              <source srcset="assets/images/generated/speaker_rok_garbas.webp" type="image/webp">
               <img src="assets/images/speaker_rok_garbas.png" loading="lazy" alt="Rok Garbas" width="267" height="267">
             </picture>
             <h3>Rok Garbas</h3>
@@ -694,10 +804,10 @@ <h3>Rok Garbas</h3>
           <picture>
             <source
               type="image/webp"
-              srcset="assets/images/about-bg-480w.webp 480w,
-                      assets/images/about-bg-768w.webp 768w,
-                      assets/images/about-bg-1024w.webp 1024w,
-                      assets/images/about-bg.webp 1280w"
+              srcset="assets/images/generated/about-bg-480w.webp 480w,
+                      assets/images/generated/about-bg-768w.webp 768w,
+                      assets/images/generated/about-bg-1024w.webp 1024w,
+                      assets/images/generated/about-bg.webp 1280w"
               sizes="100vw">
             <img src="assets/images/about-bg.png" alt="About Background" loading="lazy" width="1280" height="853">
           </picture>
@@ -750,10 +860,10 @@ <h3>Reproducible builds,
Cross-compiling, Flakes, CA derivations</h3>
           <picture>
             <source
               type="image/webp"
-              srcset="assets/images/location-bg-480w.webp 480w,
-                      assets/images/location-bg-768w.webp 768w,
-                      assets/images/location-bg-1024w.webp 1024w,
-                      assets/images/location-bg.webp 1280w"
+              srcset="assets/images/generated/location-bg-480w.webp 480w,
+                      assets/images/generated/location-bg-768w.webp 768w,
+                      assets/images/generated/location-bg-1024w.webp 1024w,
+                      assets/images/generated/location-bg.webp 1280w"
               sizes="100vw">
             <img src="assets/images/location-bg.png" alt="Location Background" loading="lazy" width="1280" height="853">
           </picture>
@@ -777,110 +887,134 @@ <h2 class="section-title">location</h2>
       <section class="faq-section">
         <h2 class="section-title">FAQ</h2>
         <div class="faq-content">
-          <h3>
-            How to sign up?
-          </h3>
-          <p>
-            Planet Nix is part of the <a
-              href="https://www.socallinuxexpo.org/scale/23x">SCALE
-            conference</a>. Either a full SCALE Pass or Expo Pass will provide
-            entrance to Planet Nix.
-          </p>
-
-          <h3>
-            Do I need to prepare anything?
-          </h3>
-          <p>
-            As you prepare for the event we'd like to encourage all attendees to download
-            any important repositories to their local machines and prepare their API-Keys
-            beforehand as we will get rate limited by some organizations. The Nix manual
-            shows how to configure nix to use with access-tokens. For GitHub for example we
-            recommend a fine-grained token with no extra account permissions, as it will be
-            only used for authentication purposes.
-          </p>
-
-          <h3>
-            I am interested in helping? What can I do?
-          </h3>
-          <p>
-            We are actively looking for volunteers for before, during and after
-            the event. If you are interested, please reach out to <a
-            href="mailto:planetnix@flox.dev">planetnix@flox.dev</a>
-          </p>
-
-          <h3>
-            Will there be video recording?
-          </h3>
-          <p>
-            Yes, you can view the livestream on the <a
-            href="https://www.youtube.com/@socallinuxexpo">SCaLE Youtube
-            Channel</a>.
-          </p>
-
-          <h3>
-            This website is broken! Can I fix it?
-          </h3>
-          <p>
-            Yes! The website source is at: <a
-              href="https://github.com/planetnix/website">https://github.com/planetnix/website</a>.
-          </p>
-
-          <h3>
-            What is a Unconf?
-          </h3>
-          <p>
-            An Unconference is all about you taking the lead. No predetermined
-            schedules or set topics. Have a burning question or exciting idea
-            about Nix? Grab a group, snag a table, and dive into the
-            conversation. This is your time to connect with like-minded
-            individuals and discuss whatever you're passionate about.
-          </p>
-
-          <h3>
-            How do I get to Planet Nix?
-          </h3>
-          <p>
-            The best information can be found on the <a
-              href="https://www.visitpasadena.com/convention-center/attendees/directions-parking/">Visit
-            Pasadena</a> website.
-            <h4>By plane</h4>
-            <p>
-              If you are coming from LAX, it is possible to reach the convention center via public transportation in approximately 90 minutes.
-              Head to Terminal B Lower Level and take the <a
-                href="https://www.flylax.com/flyaway-bus">FlyAway Bus</a> to <a
-                href="https://metrolinktrains.com/rider-info/general-info/stations/l.a.-union-station/">Union
-              Station</a>. Take the Metro A Line to Memorial Park Station or
-              Del Mar Station, both stations are 0.4 miles away from the
-              convention center and about a ten minute walk.
-            </p>
-            <h4>By car</h4>
-            <p>
-              There are a number of ways to get to the convention center by
-              car. See the <a
-                href="https://www.visitpasadena.com/convention-center/attendees/directions-parking/">Visit
-              Pasadena</a> site for the most accurate information. There are
-              several parking structures around the convention center with a
-              daily flat rate of $15.
-            </p>
-            <h4>By metro</h4>
-            <p>
-              Head to your nearest metro stop and take the metro to <a
-                href="https://metrolinktrains.com/rider-info/general-info/stations/l.a.-union-station/">Union
-              Station</a>. Take the Metro A Line to Memorial Park Station or
-              Del Mar Station, both stations are 0.4 miles away from the
-              convention center and about a ten minute walk.
-            </p>
-          </p>
-
+          <details>
+            <summary>
+              How to sign up?
+            </summary>
+            <div>
+              Planet Nix is part of the <a
+                href="https://www.socallinuxexpo.org/scale/23x">SCALE
+              conference</a>. Either a full SCALE Pass or Expo Pass will provide
+              entrance to Planet Nix.
+            </div>
+          </details>
+          <details>
+            <summary>
+              Do I need to prepare anything?
+            </summary>
+            <div>
+              As you prepare for the event we'd like to encourage all attendees to download
+              any important repositories to their local machines and prepare their API-Keys
+              beforehand as we will get rate limited by some organizations. The Nix manual
+              shows how to configure nix to use with access-tokens. For GitHub for example we
+              recommend a fine-grained token with no extra account permissions, as it will be
+              only used for authentication purposes.
+            </div>
+          </details>
+          <details>
+            <summary>
+              I am interested in helping? What can I do?
+            </summary>
+            <div>
+              We are actively looking for volunteers for before, during and after
+              the event. If you are interested, please reach out to <a
+              href="mailto:planetnix@flox.dev">planetnix@flox.dev</a>
+            </div>
+          </details>
+          <details>
+            <summary>
+              Will there be video recording?
+            </summary>
+            <div>
+              Yes, you can view the livestream on the <a
+              href="https://www.youtube.com/@socallinuxexpo">SCaLE Youtube
+              Channel</a>.
+            </div>
+          </details>
+          <details>
+            <summary>
+              This website is broken! Can I fix it?
+            </summary>
+            <div>
+              Yes! The website source is at: <a
+                href="https://github.com/planetnix/website">https://github.com/planetnix/website</a>.
+            </div>
+          </details>
+          <details>
+            <summary>
+              What is a Unconf?
+            </summary>
+            <div>
+              An Unconference is all about you taking the lead. No predetermined
+              schedules or set topics. Have a burning question or exciting idea
+              about Nix? Grab a group, snag a table, and dive into the
+              conversation. This is your time to connect with like-minded
+              individuals and discuss whatever you're passionate about.
+            </div>
+          </details>
+          <details>
+            <summary>
+              How do I get to Planet Nix?
+            </summary>
+            <div>
+              <p>
+                The best information can be found on the <a
+                  href="https://www.visitpasadena.com/convention-center/attendees/directions-parking/">Visit
+                Pasadena</a> website.
+              </p>
+              <blockquote>
+                <h4>By plane</h4>
+                <p>
+                  If you are coming from LAX, it is possible to reach the convention center via public transportation in approximately 90 minutes.
+                  Head to Terminal B Lower Level and take the <a
+                    href="https://www.flylax.com/flyaway-bus">FlyAway Bus</a> to <a
+                    href="https://metrolinktrains.com/rider-info/general-info/stations/l.a.-union-station/">Union
+                  Station</a>. Take the Metro A Line to Memorial Park Station or
+                  Del Mar Station, both stations are 0.4 miles away from the
+                  convention center and about a ten minute walk.
+                </p>
+                <h4>By car</h4>
+                <p>
+                  There are a number of ways to get to the convention center by
+                  car. See the <a
+                    href="https://www.visitpasadena.com/convention-center/attendees/directions-parking/">Visit
+                  Pasadena</a> site for the most accurate information. There are
+                  several parking structures around the convention center with a
+                  daily flat rate of $15.
+                </p>
+                <h4>By metro</h4>
+                <p>
+                  Head to your nearest metro stop and take the metro to <a
+                    href="https://metrolinktrains.com/rider-info/general-info/stations/l.a.-union-station/">Union
+                  Station</a>. Take the Metro A Line to Memorial Park Station or
+                  Del Mar Station, both stations are 0.4 miles away from the
+                  convention center and about a ten minute walk.
+                </p>
+              </blockquote>
+            </div>
+          </details>
         </div>
       </section>
 
       <footer>
+        <div class="footer-socials">
+          <a href="https://x.com/planetnixconf">
+            <img src="assets/images/twitter.svg" alt="PlanetNix Twitter/X" width="24" height="24">
+          </a>
+          <a href="https://fosstodon.org/@planetnix@mastodon.social">
+            <img src="assets/images/mastodon.svg" alt="PlanetNix Mastodon" width="24" height="24">
+          </a>
+          <a href="https://bsky.app/profile/planetnix.bsky.social">
+            <img src="assets/images/bluesky.svg" alt="PlanetNix Bluesky" width="24" height="24">
+          </a>
+        </div>
         <div class="footer-content">
           <div>
-            PlanetNix:
+            © 2026 PlanetNix
+            (
             <a href="2025/">2025</a>,
             <a href="2024/">2024</a>
+            )
           </div>
           <div>Presented by <a href="https://flox.dev"><img src="assets/images/flox_logo.png" alt="Flox" width="72" height="36"></a></div>
           <div><a href="planetnix@flox.dev">planetnix@flox.dev</a></div>
@@ -890,5 +1024,15 @@ <h4>By metro</h4>
   </main>
 
 
+  <script>
+let accordion = document.querySelectorAll('.faq-content details')
+accordion.forEach(function (d, index) {
+  d.onclick = () => {
+    accordion.forEach(function(c, i) {
+      index === i ?'':c.removeAttribute('open')
+    });
+  };
+});
+  </script>
 </body>
 </html>
diff --git a/site.webmanifest b/site.webmanifest
index 8f626ab..ffc3318 100644
--- a/site.webmanifest
+++ b/site.webmanifest
@@ -3,12 +3,12 @@
   "short_name": "",
   "icons": [
     {
-      "src": "/assets/images/android-chrome-192x192.png",
+      "src": "/assets/images/generated/android-chrome-192x192.png",
       "sizes": "192x192",
       "type": "image/png"
     },
     {
-      "src": "/assets/images/android-chrome-512x512.png",
+      "src": "/assets/images/generated/android-chrome-512x512.png",
       "sizes": "512x512",
       "type": "image/png"
     }