major lander upgrades and somme udpates to documentionat

LANDING_PAGE_DEVELOPMENT_PLAN.md

@@ -0,0 +1,300 @@
+# Changemaker Lite Landing Page Development Plan
+*UPDATED: Grid-Optimized Media Integration Strategy*
+
+## Executive Summary
+We've revolutionized the Changemaker Lite landing page with an Alibaba-style grid system that maximizes screen real estate while aggressively promoting our self-hosting message: **"This Site Runs On Changemaker Lite."** The page is now a living proof-of-concept that converts visitors through demonstration, not just explanation.
+
+## 🚀 SELF-HOSTING HYPE STRATEGY
+**Core Message:** "The Infrastructure That Runs Itself"
+
+### Primary Positioning:
+- **"🤯 This Site Runs On Changemaker Lite"** - Meta-badge visible throughout
+- **Live Proof Points** - Show actual BNKops infrastructure running on the same hardware
+- **Real Savings Data** - Our actual $13,800/year savings vs corporate SaaS
+- **Zero Corporate Dependencies** - Emphasize complete digital liberation
+
+### Proof-of-Concept Integration:
+1. **Meta-Validation** - Every page element proves the platform works
+2. **Behind-the-Scenes Access** - Video demos of actual running services
+3. **Real Stats Display** - Live subscriber counts, uptime metrics, cost savings
+4. **Transparent Operations** - Show the actual $200 hardware running everything
+
+## 🎯 GRID SYSTEM ARCHITECTURE
+**Maximum Screen Real Estate - Alibaba Style**
+
+### Grid Layout Principles:
+- **Tight Spacing** - 0.5rem base gaps for content density
+- **Modular Cards** - Every element in contained, hover-interactive cards
+- **Responsive Scaling** - 4-column desktop → 2-column tablet → 1-column mobile
+- **Information Hierarchy** - Color-coded importance levels
+
+### Section Structure:
+1. **Hero Grid** - 2x2 layout: Main message + Video + Stats + Trust indicators
+2. **Proof Grid** - 4-card layout showing live infrastructure
+3. **Hardware Grid** - 3-option purchase matrix
+4. **Services Grid** - Tight showcase of all 11 included services
+
+## 📹 MEDIA INTEGRATION STRATEGY
+
+### Video Content Requirements:
+
+#### 1. HERO VIDEO: "See Changemaker Lite In Action" (3:00)
+**Script Outline:**
+```
+[0:00-0:15] HOOK: "What you're looking at right now is running on $200 hardware"
+[0:15-0:45] TERMINAL DEMO: docker compose ps, service URLs, real data
+[0:45-1:30] DASHBOARD TOUR: Homepage overview, all 11 services working
+[1:30-2:15] BACKEND ACCESS: NocoDB, Listmonk, email campaigns
+[2:15-2:45] COST COMPARISON: Corporate bills vs our $50/month
+[2:45-3:00] CTA: "Get the same setup for $200"
+```
+
+#### 2. BACKEND DEMO: "Homepage Dashboard Tour" (1:30)
+**Script Outline:**
+```
+[0:00-0:20] Homepage overview - all services green status
+[0:20-0:50] Click through key services (NocoDB, Listmonk, Gitea)
+[0:50-1:10] Show actual data - newsletters, databases, code repos
+[1:10-1:30] "This is what you get out of the box"
+```
+
+#### 3. SETUP DEMO: "30-Minute Time-lapse" (5:23)
+**Script Outline:**
+```
+[0:00-0:30] Unboxing hardware, connection setup
+[0:30-2:00] Initial boot, docker compose deployment
+[2:00-3:30] Service configuration, domain setup
+[3:30-4:30] Testing all services, sending first email
+[4:30-5:23] Final dashboard tour, "You're live!"
+```
+
+#### 4. COST BREAKDOWN: "Corporate vs Changemaker" (2:00)
+**Script Outline:**
+```
+[0:00-0:30] Show typical SaaS stack bills ($1,200/mo)
+[0:30-1:00] Break down each service cost vs Changemaker equivalent
+[1:00-1:30] Annual savings calculation ($13,800)
+[1:30-2:00] "Money for organizing, not shareholders"
+```
+
+### Video Production Specs:
+- **Resolution:** 1920x1080 minimum, 4K preferred for hero video
+- **Format:** MP4 with H.264 encoding
+- **Length:** Keep under 3 minutes for engagement
+- **Captions:** Required for accessibility
+- **Hosting:** Self-hosted on Changemaker Lite (of course!)
+
+## 🎨 VISUAL DESIGN UPDATES
+
+### Grid-Optimized Elements:
+- **Micro-interactions** - Card hovers, button states, loading animations
+- **Progressive Enhancement** - Mobile-first, desktop-enhanced
+- **Performance Focus** - Lazy loading, optimized assets, minimal JS
+- **Brand Consistency** - Trans flag colors throughout
+
+### Component Library:
+1. **Grid Cards** - Standardized containers with consistent padding
+2. **Video Placeholders** - Interactive preview states with play buttons
+3. **Stat Displays** - Animated counters with real data integration
+4. **CTA Buttons** - Primary/secondary hierarchy with hover effects
+
+## 💰 CONVERSION OPTIMIZATION
+
+### Three-Path Strategy:
+1. **Plug & Play ($200)** - Recommended, ships in 5 days
+2. **DIY Install (Free)** - Technical users, community support
+3. **Managed Hosting ($150/mo)** - Hands-off but still your infrastructure
+
+### Conversion Elements:
+- **Social Proof** - "Powers BNKops.com" trust indicators
+- **Urgency** - "Ships in 5 days" immediacy
+- **Risk Reduction** - "30-minute setup" simplicity promise
+- **Value Demonstration** - Live cost savings calculator
+
+## 🎭 CONTENT PERSONALITY
+
+### Voice & Tone:
+- **Confident Revolutionary** - "We're not just selling it - we're living it"
+- **Technical Transparency** - Show the actual infrastructure
+- **Community-Focused** - "Trans liberation tech"
+- **Anti-Corporate** - "Zero surveillance" messaging
+
+### Key Phrases:
+- "The Infrastructure That Runs Itself"
+- "What You're Looking At Right Now"
+- "Money for organizing, not shareholders"  
+- "Your data, your power, your movement"
+- "Digital liberation movement"
+
+## 📊 SUCCESS METRICS
+
+### Primary KPIs:
+1. **Hardware Orders** - Track $200 package conversions
+2. **Installation Attempts** - DIY guide engagement
+3. **Video Completion Rates** - Media effectiveness
+4. **Time on Page** - Grid layout engagement
+
+### Secondary Metrics:
+1. **Self-hosting Message Retention** - Post-visit surveys
+2. **Social Shares** - Viral potential tracking
+3. **Return Visits** - Community building indicator
+4. **Email Signups** - Newsletter conversion funnel
+
+## 🚧 TECHNICAL IMPLEMENTATION
+
+### Completed Updates:
+1. ✅ **Grid-optimized CSS** - Alibaba-style layout system
+2. ✅ **Self-hosting badges** - Meta-validation throughout
+3. ✅ **Grid HTML structure** - Maximum screen real estate utilization
+4. ✅ **Video placeholder integration** - Ready for content production
+
+### Next Phase:
+1. 📹 **Video Production** - Execute scripted content strategy
+2. 📊 **Analytics Setup** - Privacy-respecting conversion tracking
+3. 🧪 **A/B Testing Framework** - Message optimization capability
+4. 🚀 **Performance Optimization** - Mobile loading improvements
+
+### Performance Targets:
+- **Load Time:** <2 seconds on 3G
+- **Mobile Score:** >90 Lighthouse
+- **Accessibility:** AA WCAG compliance
+- **SEO:** Structured data, meta optimization
+
+## 🎬 VIDEO PRODUCTION ROADMAP
+
+### Phase 1: Hero Content (Priority 1)
+1. **"See Changemaker Lite In Action" (3:00)** - Main conversion driver
+2. **"30-Minute Setup Time-lapse" (5:23)** - Risk reduction
+
+### Phase 2: Proof Content (Priority 2)
+3. **"Homepage Dashboard Tour" (1:30)** - Technical demonstration
+4. **"Corporate vs Changemaker Costs" (2:00)** - Value proposition
+
+### Phase 3: Advanced Content (Priority 3)
+5. **"Behind the Scenes: How BNKops Runs" (4:00)** - Advanced proof
+6. **"Community Testimonials" (2:30)** - Social proof compilation
+
+### Production Requirements:
+- **Screen Recording:** OBS Studio with 1080p60 capture
+- **Hardware Demo:** Good lighting, stable camera setup  
+- **Audio:** Clear narration, background music optional
+- **Editing:** Simple cuts, captions, brand consistency
+- **Hosting:** Self-hosted on Changemaker Lite infrastructure
+
+## 📈 CONVERSION FUNNEL OPTIMIZATION
+
+### Landing Paths:
+1. **Curious Visitor** → Video Demo → Understanding → Newsletter Signup
+2. **Ready Buyer** → "Order Hardware" → Immediate conversion
+3. **DIY Techie** → Installation Guide → Community Engagement
+4. **Managed Solution** → Hosting Inquiry → Sales Process
+
+### Optimization Priorities:
+1. **Video Completion Rates** - Shorter, punchier content
+2. **Hardware Order Flow** - Streamlined purchase process
+3. **Newsletter Value** - Immediate PDF guides/resources
+4. **Mobile Experience** - Touch-optimized interactions
+
+## 🎯 IMMEDIATE ACTION ITEMS
+
+### This Week:
+1. **Video Script Finalization** - Get all 4 core scripts approved
+2. **Screen Recording Setup** - Prepare clean demo environment
+3. **Analytics Integration** - Privacy-respecting tracking setup
+4. **Mobile Testing** - Cross-device grid layout verification
+
+### Next Week:
+1. **Hero Video Production** - Priority 1 content creation
+2. **Setup Demo Recording** - Time-lapse capture
+3. **Performance Audit** - Loading speed optimization
+4. **A/B Testing Framework** - Message variation testing
+
+### Month 1:
+1. **Full Video Suite** - All 6 videos produced and integrated
+2. **Conversion Optimization** - Data-driven improvements
+3. **Community Feedback** - User testing and iteration
+4. **SEO Enhancement** - Search visibility improvements
+
+## 🏆 SUCCESS DEFINITION
+
+### Quantitative Goals:
+- **50% video completion rate** for hero video
+- **15% conversion rate** from visitor to newsletter signup
+- **10% hardware order rate** from engaged visitors
+- **<2 second load time** on mobile devices
+
+### Qualitative Goals:
+- **"I get it now"** - Clear self-hosting value proposition
+- **"This looks professional"** - Trust and credibility establishment
+- **"I want this"** - Emotional connection to digital sovereignty
+- **"It's actually simple"** - Technical barrier reduction
+
+---
+
+**THE LANDING PAGE IS NOW A LIVING PROOF THAT CHANGEMAKER LITE WORKS. EVERY VISITOR SEES EXACTLY WHAT THEY'LL GET - BECAUSE THEY'RE LOOKING AT IT.**
+
+## 📹 FUTURE MEDIA INTEGRATION
+
+### Video Content to Add Later:
+
+#### 1. HERO VIDEO: "The FOSS Campaign Revolution" (2:30)
+**Location:** Hero grid section
+**Script Outline:**
+```
+[0:00-0:15] HOOK: "Stop paying $1,200/month for campaign tech"
+[0:15-0:45] PROBLEM: Show corporate SaaS bills, vendor lock-in
+[0:45-1:30] SOLUTION: Changemaker Lite demo - all services running
+[1:30-2:00] PROOF: Real campaigns using it, cost savings
+[2:00-2:30] CTA: "Join the digital liberation movement"
+```
+
+#### 2. SERVICE DEMOS: Individual Tool Showcases (0:30 each)
+**Location:** Service cards in solution grid
+- **Listmonk Demo:** Email campaign creation
+- **NocoDB Demo:** Voter database management
+- **Chatwoot Demo:** Text banking in action
+- **n8n Demo:** Automation workflows
+
+#### 3. COMPARISON VIDEO: "Corporate vs FOSS" (1:30)
+**Location:** Comparison grid section
+**Content:** Side-by-side comparison of costs, features, data ownership
+
+#### 4. SETUP WALKTHROUGH: "From Box to Campaign" (5:00)
+**Location:** Get started section
+**Content:** Complete setup process time-lapse
+
+### Screenshot Requirements:
+- Dashboard overview showing all services
+- Individual service interfaces
+- Cost comparison charts
+- Hardware photos (unboxing, setup)
+- Real campaign examples (anonymized)
+
+### Animation Enhancements:
+- Service icon animations (already implemented)
+- Interactive comparison table
+- Live visitor counter
+- Real-time savings calculator
+
+## 🎯 COMPLETED UPDATES
+
+### Page Focus:
+✅ **Repositioned as FOSS political campaign solution**
+✅ **Removed video placeholders for cleaner grid**
+✅ **Added comparison with corporate alternatives**
+✅ **Emphasized cost savings and data ownership**
+
+### Design Implementation:
+✅ **Ultra-tight grid system (Alibaba-style)**
+✅ **Neon animations with trans flag colors**
+✅ **Smooth scroll and parallax effects**
+✅ **Responsive grid that reflows perfectly**
+✅ **Stagger animations on scroll**
+✅ **Interactive hover states**
+
+### Content Strategy:
+✅ **Clear problem/solution messaging**
+✅ **Service-by-service breakdown**
+✅ **Direct corporate alternative comparisons**
+✅ **Three-tier pricing strategy**
+✅ **Trust indicators and social proof**

README.md

@@ -17,7 +17,7 @@ Changemaker Lite is a streamlined documentation and development platform featuri
 
 ```bash
 # Clone the repository
-git clone https://gitea.bnkops.com/admin/Changemaker.git
+git clone https://gitea.bnkops.com/admin/changemaker.lite
 cd changemaker.lite
 
 # Configure environment (creates .env file)

mkdocs/docs/cost-comparison.md

@@ -0,0 +1,203 @@
+# Cost Comparison: Corporation vs. Community
+
+## The True Cost of Corporate Dependency
+
+When movements choose corporate software, they're not just paying subscription fees—they're paying with their power, their privacy, and their future. Let's break down the real costs.
+
+## Monthly Cost Analysis
+
+### Small Campaign (50 supporters, 5,000 emails/month)
+
+| Service Category | Corporate Solution | Monthly Cost | Changemaker Lite | Monthly Cost |
+|------------------|-------------------|--------------|------------------|--------------|
+| **Email Marketing** | Mailchimp | $59/month | Listmonk | $0* |
+| **Database & CRM** | Airtable Pro | $240/month | NocoDB | $0* |
+| **Website Hosting** | Squarespace | $40/month | Static Server | $0* |
+| **Documentation** | Notion Team | $96/month | MkDocs | $0* |
+| **Development** | GitHub Codespaces | $87/month | Code Server | $0* |
+| **Automation** | Zapier Professional | $73/month | n8n | $0* |
+| **File Storage** | Google Workspace | $72/month | PostgreSQL + Storage | $0* |
+| **Analytics** | Corporate tracking | Privacy cost† | Self-hosted | $0* |
+| **TOTAL** | | **$667/month** | | **$50/month** |
+
+*\*Included in base Changemaker Lite hosting cost*
+*†Privacy costs are incalculable but include surveillance, data sales, and community manipulation*
+
+---
+
+### Medium Campaign (500 supporters, 50,000 emails/month)
+
+| Service Category | Corporate Solution | Monthly Cost | Changemaker Lite | Monthly Cost |
+|------------------|-------------------|--------------|------------------|--------------|
+| **Email Marketing** | Mailchimp | $299/month | Listmonk | $0* |
+| **Database & CRM** | Airtable Pro | $600/month | NocoDB | $0* |
+| **Website Hosting** | Squarespace | $65/month | Static Server | $0* |
+| **Documentation** | Notion Team | $240/month | MkDocs | $0* |
+| **Development** | GitHub Codespaces | $174/month | Code Server | $0* |
+| **Automation** | Zapier Professional | $146/month | n8n | $0* |
+| **File Storage** | Google Workspace | $144/month | PostgreSQL + Storage | $0* |
+| **Analytics** | Corporate tracking | Privacy cost† | Self-hosted | $0* |
+| **TOTAL** | | **$1,668/month** | | **$75/month** |
+
+---
+
+### Large Campaign (5,000 supporters, 500,000 emails/month)
+
+| Service Category | Corporate Solution | Monthly Cost | Changemaker Lite | Monthly Cost |
+|------------------|-------------------|--------------|------------------|--------------|
+| **Email Marketing** | Mailchimp | $1,499/month | Listmonk | $0* |
+| **Database & CRM** | Airtable Pro | $1,200/month | NocoDB | $0* |
+| **Website Hosting** | Squarespace + CDN | $120/month | Static Server | $0* |
+| **Documentation** | Notion Team | $480/month | MkDocs | $0* |
+| **Development** | GitHub Codespaces | $348/month | Code Server | $0* |
+| **Automation** | Zapier Professional | $292/month | n8n | $0* |
+| **File Storage** | Google Workspace | $288/month | PostgreSQL + Storage | $0* |
+| **Analytics** | Corporate tracking | Privacy cost† | Self-hosted | $0* |
+| **TOTAL** | | **$4,227/month** | | **$150/month** |
+
+## Annual Savings Breakdown
+
+### 3-Year Cost Comparison
+
+| Campaign Size | Corporate Total | Changemaker Total | **Savings** |
+|---------------|----------------|-------------------|-------------|
+| **Small** | $24,012 | $1,800 | **$22,212** |
+| **Medium** | $60,048 | $2,700 | **$57,348** |
+| **Large** | $152,172 | $5,400 | **$146,772** |
+
+## Hidden Costs of Corporate Software
+
+### What You Can't Put a Price On
+
+#### Privacy Violations
+- **Data Harvesting**: Every interaction monitored and stored
+- **Behavioral Profiling**: Your community mapped and analyzed  
+- **Third-Party Sales**: Your data sold to unknown entities
+- **Government Access**: Warrantless surveillance through corporate partnerships
+
+#### Political Manipulation
+- **Algorithmic Suppression**: Your content reach artificially limited
+- **Narrative Control**: Corporate interests shape what your community sees
+- **Shadow Banning**: Activists systematically de-platformed
+- **Counter-Intelligence**: Your strategies monitored by opposition
+
+#### Movement Disruption
+- **Dependency Creation**: Critical infrastructure controlled by adversaries
+- **Community Fragmentation**: Platforms designed to extract attention, not build power
+- **Organizing Interference**: Corporate algorithms prioritize engagement over solidarity
+- **Cultural Assimilation**: Movement culture shaped by corporate values
+
+## The Changemaker Advantage
+
+### What You Get for $50-150/month
+
+#### Complete Infrastructure
+- **Email System**: Unlimited contacts, unlimited sends
+- **Database Power**: Unlimited records, unlimited complexity
+- **Web Presence**: Unlimited sites, unlimited traffic
+- **Development Environment**: Full coding environment with AI assistance
+- **Documentation Platform**: Beautiful, searchable knowledge base
+- **Automation Engine**: Connect everything, automate everything
+- **File Storage**: Unlimited files, unlimited backups
+
+#### True Ownership
+- **Your Domain**: No corporate branding or limitations
+- **Your Data**: Complete export capability, no lock-in
+- **Your Rules**: No terms of service to violate
+- **Your Community**: No algorithmic manipulation
+
+#### Community Support
+- **Open Documentation**: Complete guides and tutorials available
+- **Community-Driven Development**: Built by and for liberation movements
+- **Technical Support**: Professional assistance from BNKops cooperative
+- **Political Alignment**: Technology designed with movement values
+
+## The Compound Effect
+
+### Year Over Year Savings
+
+Corporate software costs grow exponentially:
+- **Year 1**: "Starter" pricing to hook you
+- **Year 2**: Feature limits force tier upgrades  
+- **Year 3**: Usage growth triggers premium pricing
+- **Year 4**: Platform changes force expensive migrations
+- **Year 5**: Lock-in enables arbitrary price increases
+
+Changemaker Lite costs grow linearly with actual infrastructure needs:
+- **Year 1**: Base infrastructure costs
+- **Year 2**: Modest increases for storage/bandwidth only
+- **Year 3**: Scale only with actual technical requirements  
+- **Year 4**: Community-driven improvements at no extra cost
+- **Year 5**: Established infrastructure with declining per-user costs
+
+### 10-Year Projection
+
+| Year | Corporate (Medium Campaign) | Changemaker Lite | Annual Savings |
+|------|---------------------------|------------------|----------------|
+| 1 | $20,016 | $900 | $19,116 |
+| 2 | $22,017 | $900 | $21,117 |
+| 3 | $24,219 | $1,080 | $23,139 |
+| 4 | $26,641 | $1,080 | $25,561 |
+| 5 | $29,305 | $1,260 | $28,045 |
+| 6 | $32,235 | $1,260 | $30,975 |
+| 7 | $35,459 | $1,440 | $34,019 |
+| 8 | $39,005 | $1,440 | $37,565 |
+| 9 | $42,905 | $1,620 | $41,285 |
+| 10 | $47,196 | $1,620 | $45,576 |
+| **TOTAL** | **$318,998** | **$12,600** | **$306,398** |
+
+## Calculate Your Own Savings
+
+### Current Corporate Costs Worksheet
+
+**Email Marketing**: $____/month  
+**Database/CRM**: $____/month  
+**Website Hosting**: $____/month  
+**Documentation**: $____/month  
+**Development Tools**: $____/month  
+**Automation**: $____/month  
+**File Storage**: $____/month  
+**Other SaaS**: $____/month  
+
+**Monthly Total**: $____  
+**Annual Total**: $____  
+
+**Changemaker Alternative**: $50-150/month  
+**Your Annual Savings**: $____
+
+## Beyond the Numbers
+
+### What Movements Do With Their Savings
+
+The money saved by choosing community-controlled technology doesn't disappear—it goes directly back into movement building:
+
+- **Hire organizers** instead of paying corporate executives
+- **Fund direct actions** instead of funding surveillance infrastructure  
+- **Support community members** instead of enriching shareholders
+- **Build lasting power** instead of temporary platform dependency
+
+## Making the Switch
+
+### Transition Strategy
+
+You don't have to switch everything at once:
+
+1. **Start with documentation** - Move your knowledge base to MkDocs
+2. **Add email infrastructure** - Set up Listmonk for newsletters
+3. **Build your database** - Move contact management to NocoDB
+4. **Automate connections** - Use n8n to integrate everything
+5. **Phase out corporate tools** - Cancel subscriptions as you replicate functionality
+
+### Investment Timeline
+
+- **Month 1**: Initial setup and learning ($150 including setup time)
+- **Month 2-3**: Data migration and team training ($100/month)
+- **Month 4+**: Full operation at optimal cost ($50-150/month based on scale)
+
+### ROI Calculation
+
+Most campaigns recover their entire first-year investment in **60-90 days** through subscription savings alone.
+
+---
+
+*Ready to stop feeding your budget to corporate surveillance? [Get started with Changemaker Lite today](/getting-started/) and take control of your digital infrastructure.*

mkdocs/docs/getting-started.md

@@ -1,23 +1,55 @@
-# Getting Started
+# Getting Started with Digital Liberation 🏳️‍⚧️
 
-Welcome to Changemaker Lite! This guide will help you get up and running on Ubuntu 24.04 LTS (Noble Numbat) with Docker.
+Welcome to Changemaker Lite! You're about to reclaim your digital sovereignty and stop feeding your secrets to corporations. This guide will help you set up your own political infrastructure that you actually own and control.
+
+## Why Changemaker Lite?
+
+Before we dive into the technical setup, let's be clear about what you're doing here:
+
+!!! quote "The Reality"
+    **If you do politics, who is reading your secrets?** Every corporate platform you use is extracting your power, selling your data, and building profiles on your community. It's time to break free.
+
+### What You're Getting
+
+- **Data Sovereignty**: Your data stays on your servers
+- **Cost Savings**: $50/month instead of $2,000+/month for corporate solutions  
+- **Community Control**: Technology that serves movements, not shareholders
+- **Trans Liberation**: Tools built with radical politics and care
+
+### What You're Leaving Behind
+
+- ❌ Corporate surveillance and data extraction
+- ❌ Escalating subscription fees and vendor lock-in
+- ❌ Algorithmic manipulation of your community
+- ❌ Terms of service that can silence you anytime
+
+---
 
 ## System Requirements
 
 ### Operating System
+
 - **Ubuntu 24.04 LTS (Noble Numbat)** - Recommended and tested
 - Other Linux distributions with systemd support
 - WSL2 on Windows (limited functionality)
 
+!!! tip "New to Linux?"
+    Consider [Linux Mint](https://www.linuxmint.com/) - it looks like Windows but opens the door to true digital freedom.
+
 ### Hardware Requirements
+
 - **CPU**: 2+ cores (4+ recommended)
-- **RAM**: 4GB minimum (8GB recommended)
+- **RAM**: 4GB minimum (8GB recommended)  
 - **Storage**: 20GB+ available disk space
 - **Network**: Stable internet connection
 
+!!! info "Cloud Hosting"
+    You can run this on a VPS from providers like Hetzner, DigitalOcean, or Linode for $20-50/month.
+
 ### Software Prerequisites
 
 1. **Docker Engine** (24.0+)
+
 ```bash
 # Install Docker
 curl -fsSL https://get.docker.com | sudo sh
@@ -29,12 +61,14 @@ sudo usermod -aG docker $USER
 ```
 
 2. **Docker Compose** (v2.20+)
+
 ```bash
 # Verify Docker Compose v2 is installed
 docker compose version
 ```
 
 3. **Essential Tools**
+
 ```bash
 # Install required packages
 sudo apt update
@@ -46,7 +80,7 @@ sudo apt install -y git curl jq openssl
 ### 1. Clone Repository
 
 ```bash
-git clone https://gitea.bnkops.com/admin/Changemaker.git
+git clone https://gitea.bnkops.com/admin/changemaker.lite
 cd changemaker.lite
 ```
 
@@ -59,6 +93,7 @@ The `config.sh` script will guide you through the initial setup:
 ```
 
 This wizard will:
+
 - ✅ Create a `.env` file with secure defaults
 - ✅ Scan for available ports to avoid conflicts
 - ✅ Set up your domain configuration
@@ -106,6 +141,7 @@ docker compose ps
 ```
 
 Expected output should show all services as "Up":
+
 - code-server-changemaker
 - listmonk_app
 - listmonk_db
@@ -124,26 +160,31 @@ Expected output should show all services as "Up":
 Once services are running, access them locally:
 
 ### 🏠 Homepage Dashboard
+
 - **URL**: http://localhost:3010
 - **Purpose**: Central hub for all services
 - **Features**: Service status, quick links, monitoring
 
 ### 💻 Development Tools
+
 - **Code Server**: http://localhost:8888 - VS Code in browser
 - **Gitea**: http://localhost:3030 - Git repository management
 - **MkDocs Dev**: http://localhost:4000 - Live documentation preview
 - **MkDocs Prod**: http://localhost:4001 - Built documentation
 
 ### 📧 Communication
+
 - **Listmonk**: http://localhost:9000 - Email campaigns
   - Login with credentials set during configuration
 
 ### 🔄 Automation & Data
+
 - **n8n**: http://localhost:5678 - Workflow automation
   - Login with credentials set during configuration
 - **NocoDB**: http://localhost:8090 - No-code database
 
 ### 🛠️ Interactive Tools
+
 - **Map Viewer**: http://localhost:3000 - Geographic data visualization
 - **Mini QR**: http://localhost:8089 - QR code generator
 
@@ -158,6 +199,7 @@ For secure public access, use the production deployment script:
 ```
 
 This script will:
+
 1. Install and configure `cloudflared`
 2. Create a Cloudflare tunnel
 3. Set up DNS records automatically
@@ -177,6 +219,7 @@ This script will:
 After successful deployment, services will be available at:
 
 **Public Services**:
+
 - `https://yourdomain.com` - Main documentation site
 - `https://listmonk.yourdomain.com` - Email campaigns
 - `https://docs.yourdomain.com` - Documentation preview
@@ -187,6 +230,7 @@ After successful deployment, services will be available at:
 - `https://qr.yourdomain.com` - QR generator
 
 **Protected Services** (require authentication):
+
 - `https://homepage.yourdomain.com` - Dashboard
 - `https://code.yourdomain.com` - Code Server
 
@@ -283,11 +327,13 @@ docker compose up -d
 If services fail to start due to port conflicts:
 
 1. Check which ports are in use:
+
 ```bash
 sudo ss -tulpn | grep LISTEN
 ```
 
 2. Re-run configuration to get new ports:
+
 ```bash
 ./config.sh
 ```

mkdocs/docs/index.md

@@ -1,6 +1,13 @@
+---
+template: home.html
+hide:
+  - navigation
+  - toc
+---
+
 # Welcome to Changemaker Lite
 
-A streamlined, self-hosted platform for documentation, development, and digital activism.
+Stop feeding your secrets to corporations. Own your political infrastructure.
 
 ## Quick Start
 
@@ -8,7 +15,7 @@ Get up and running in minutes:
 
 ```bash
 # Clone the repository
-git clone https://gitea.bnkops.com/admin/Changemaker.git
+git clone https://gitea.bnkops.com/admin/changemaker.lite
 cd changemaker.lite
 
 # Configure environment
@@ -26,21 +33,25 @@ docker compose up -d
 Changemaker Lite includes these essential services:
 
 ### Core Services
+
 - **[Homepage](services/homepage.md)** (Port 3010) - Central dashboard and service monitoring
 - **[Code Server](services/code-server.md)** (Port 8888) - VS Code in your browser
 - **[MkDocs](services/mkdocs.md)** (Port 4000) - Documentation with live preview  
 - **[Static Server](services/static-server.md)** (Port 4001) - Production documentation site
 
 ### Communication & Automation
+
 - **[Listmonk](services/listmonk.md)** (Port 9000) - Newsletter and email campaign management
 - **[n8n](services/n8n.md)** (Port 5678) - Workflow automation platform
 
 ### Data & Development
+
 - **[NocoDB](services/nocodb.md)** (Port 8090) - No-code database platform
 - **[PostgreSQL](services/postgresql.md)** (Port 5432) - Database backend for Listmonk
 - **[Gitea](services/gitea.md)** (Port 3030) - Self-hosted Git service
 
 ### Interactive Tools
+
 - **[Map Viewer](services/map.md)** (Port 3000) - Interactive map with NocoDB integration
 - **[Mini QR](services/mini-qr.md)** (Port 8089) - QR code generator
 

mkdocs/docs/javascripts/home.js

@@ -0,0 +1,222 @@
+// Changemaker Lite - Minimal Interactions
+
+document.addEventListener('DOMContentLoaded', function() {
+    // Terminal copy functionality
+    const terminals = document.querySelectorAll('.terminal-box');
+    terminals.forEach(terminal => {
+        terminal.addEventListener('click', function() {
+            const code = this.textContent.trim();
+            navigator.clipboard.writeText(code).then(() => {
+                // Quick visual feedback
+                this.style.background = '#0a0a0a';
+                setTimeout(() => {
+                    this.style.background = '#000';
+                }, 200);
+            });
+        });
+    });
+    
+    // Smooth scroll for anchors
+    document.querySelectorAll('a[href^="#"]').forEach(anchor => {
+        anchor.addEventListener('click', function (e) {
+            e.preventDefault();
+            const target = document.querySelector(this.getAttribute('href'));
+            if (target) {
+                target.scrollIntoView({ behavior: 'smooth', block: 'start' });
+            }
+        });
+    });
+    
+    // Reduced motion support
+    if (window.matchMedia('(prefers-reduced-motion: reduce)').matches) {
+        document.documentElement.style.scrollBehavior = 'auto';
+        const style = document.createElement('style');
+        style.textContent = '*, *::before, *::after { animation: none !important; transition: none !important; }';
+        document.head.appendChild(style);
+    }
+});
+
+// Changemaker Lite - Smooth Grid Interactions
+
+document.addEventListener('DOMContentLoaded', function() {
+    // Smooth scroll for anchors
+    document.querySelectorAll('a[href^="#"]').forEach(anchor => {
+        anchor.addEventListener('click', function (e) {
+            e.preventDefault();
+            const target = document.querySelector(this.getAttribute('href'));
+            if (target) {
+                target.scrollIntoView({ behavior: 'smooth', block: 'start' });
+            }
+        });
+    });
+    
+    // Add stagger animation to grid cards on scroll
+    const observerOptions = {
+        threshold: 0.1,
+        rootMargin: '0px 0px -50px 0px'
+    };
+    
+    const observer = new IntersectionObserver((entries) => {
+        entries.forEach((entry, index) => {
+            if (entry.isIntersecting) {
+                setTimeout(() => {
+                    entry.target.style.opacity = '1';
+                    entry.target.style.transform = 'translateY(0)';
+                }, index * 50);
+                observer.unobserve(entry.target);
+            }
+        });
+    }, observerOptions);
+    
+    // Observe all grid cards
+    document.querySelectorAll('.grid-card').forEach((card, index) => {
+        card.style.opacity = '0';
+        card.style.transform = 'translateY(20px)';
+        card.style.transition = 'opacity 0.5s ease, transform 0.5s ease';
+        observer.observe(card);
+    });
+    
+    // Neon hover effect for service cards
+    document.querySelectorAll('.service-card').forEach(card => {
+        card.addEventListener('mouseenter', function(e) {
+            const rect = this.getBoundingClientRect();
+            const x = e.clientX - rect.left;
+            const y = e.clientY - rect.top;
+            
+            const ripple = document.createElement('div');
+            ripple.style.position = 'absolute';
+            ripple.style.left = x + 'px';
+            ripple.style.top = y + 'px';
+            ripple.style.width = '0';
+            ripple.style.height = '0';
+            ripple.style.borderRadius = '50%';
+            ripple.style.background = 'rgba(91, 206, 250, 0.3)';
+            ripple.style.transform = 'translate(-50%, -50%)';
+            ripple.style.pointerEvents = 'none';
+            ripple.style.transition = 'width 0.6s, height 0.6s, opacity 0.6s';
+            
+            this.appendChild(ripple);
+            
+            setTimeout(() => {
+                ripple.style.width = '200px';
+                ripple.style.height = '200px';
+                ripple.style.opacity = '0';
+            }, 10);
+            
+            setTimeout(() => {
+                ripple.remove();
+            }, 600);
+        });
+    });
+    
+    // Animated counter for stats
+    const animateValue = (element, start, end, duration) => {
+        const range = end - start;
+        const increment = range / (duration / 16);
+        let current = start;
+        
+        const timer = setInterval(() => {
+            current += increment;
+            if (current >= end) {
+                current = end;
+                clearInterval(timer);
+            }
+            element.textContent = Math.round(current);
+        }, 16);
+    };
+    
+    // Animate stat numbers on scroll
+    const statObserver = new IntersectionObserver((entries) => {
+        entries.forEach(entry => {
+            if (entry.isIntersecting) {
+                const statNumber = entry.target.querySelector('.stat-number');
+                if (statNumber && !statNumber.animated) {
+                    statNumber.animated = true;
+                    const value = parseInt(statNumber.textContent);
+                    if (!isNaN(value)) {
+                        statNumber.textContent = '0';
+                        animateValue(statNumber, 0, value, 1000);
+                    }
+                }
+                statObserver.unobserve(entry.target);
+            }
+        });
+    }, observerOptions);
+    
+    document.querySelectorAll('.stat-item').forEach(stat => {
+        statObserver.observe(stat);
+    });
+    
+    // Add parallax effect to hero section
+    let ticking = false;
+    function updateParallax() {
+        const scrolled = window.pageYOffset;
+        const hero = document.querySelector('.hero-grid');
+        if (hero) {
+            hero.style.transform = `translateY(${scrolled * 0.3}px)`;
+        }
+        ticking = false;
+    }
+    
+    function requestTick() {
+        if (!ticking) {
+            window.requestAnimationFrame(updateParallax);
+            ticking = true;
+        }
+    }
+    
+    // Only add parallax on desktop
+    if (window.innerWidth > 768) {
+        window.addEventListener('scroll', requestTick);
+    }
+    
+    // Button ripple effect
+    document.querySelectorAll('.btn').forEach(button => {
+        button.addEventListener('click', function(e) {
+            const rect = this.getBoundingClientRect();
+            const x = e.clientX - rect.left;
+            const y = e.clientY - rect.top;
+            
+            const ripple = document.createElement('span');
+            ripple.style.position = 'absolute';
+            ripple.style.left = x + 'px';
+            ripple.style.top = y + 'px';
+            ripple.className = 'btn-ripple';
+            
+            this.appendChild(ripple);
+            
+            setTimeout(() => {
+                ripple.remove();
+            }, 600);
+        });
+    });
+    
+    // Reduced motion support
+    if (window.matchMedia('(prefers-reduced-motion: reduce)').matches) {
+        document.documentElement.style.scrollBehavior = 'auto';
+        window.removeEventListener('scroll', requestTick);
+    }
+});
+
+// Add CSS for button ripple
+const style = document.createElement('style');
+style.textContent = `
+    .btn-ripple {
+        position: absolute;
+        width: 20px;
+        height: 20px;
+        border-radius: 50%;
+        background: rgba(111, 66, 193, 0.5); /* mkdocs purple */
+        transform: translate(-50%, -50%) scale(0);
+        animation: ripple-animation 0.6s ease-out;
+        pointer-events: none;
+    }
+    
+    @keyframes ripple-animation {
+        to {
+            transform: translate(-50%, -50%) scale(10);
+            opacity: 0;
+        }
+    }
+`;
+document.head.appendChild(style);

mkdocs/docs/overrides/home.html

@@ -0,0 +1,339 @@
+{% extends "main.html" %}
+
+{% block extrahead %}
+  {{ super() }}
+  <script>
+    // Add data attribute for CSS targeting
+    document.body.setAttribute('data-md-template', 'home');
+  </script>
+{% endblock %}
+
+{% block content %}
+<div class="md-content--home">
+
+<!-- Hero Grid Section -->
+<section class="hero-grid">
+    <div class="grid-container">
+        <!-- Main Hero Block -->
+        <div class="hero-main grid-card">
+            <div class="meta-badge">🤯 This Site Runs On Changemaker Lite</div>
+            <h1>The Only FOSS Political Campaign Stack</h1>
+            <p>Stop paying $1,200/month to corporate platforms. Run your entire political campaign on $200 hardware with fewer corporate dependencies every day.</p>
+            
+            <div class="hero-ctas">
+                <a href="#solution" class="btn btn-primary">See The Solution</a>
+                <a href="#get-started" class="btn btn-secondary">Get Started $200</a>
+            </div>
+        </div>
+        
+        <!-- Problem Statement Block -->
+        <div class="hero-problem grid-card">
+            <h3>The Problem</h3>
+            <div class="problem-list">
+                <div class="problem-item">💸 NGP VAN: $1,000+/mo</div>
+                <div class="problem-item">📧 Mailchimp: $200+/mo</div>
+                <div class="problem-item">🔒 Your data: Their servers</div>
+                <div class="problem-item">👁️ Surveillance: Always on</div>
+            </div>
+        </div>
+        
+        <!-- Solution Stats Block -->
+        <div class="hero-stats grid-card">
+            <h3>The Solution</h3>
+            <div class="stat-grid">
+                <div class="stat-item">
+                    <div class="stat-number">$200</div>
+                    <div class="stat-label">One-time cost</div>
+                </div>
+                <div class="stat-item">
+                    <div class="stat-number">11</div>
+                    <div class="stat-label">Campaign tools</div>
+                </div>
+                <div class="stat-item">
+                    <div class="stat-number">100%</div>
+                    <div class="stat-label">Your data</div>
+                </div>
+                <div class="stat-item">
+                    <div class="stat-number">↓</div>
+                    <div class="stat-label">Fewer corporate deps every day</div>
+                </div>
+            </div>
+        </div>
+        
+        <!-- Trust Indicators -->
+        <div class="hero-trust grid-card">
+            <h3>Proven By</h3>
+            <div class="trust-items">
+                <div class="trust-item">
+                    <span class="trust-icon">⚡</span>
+                    <span class="trust-text">Powers BNKops.com</span>
+                </div>
+                <div class="trust-item">
+                    <span class="trust-icon">🏳️‍⚧️</span>
+                    <span class="trust-text">Trans liberation tech</span>
+                </div>
+                <div class="trust-item">
+                    <span class="trust-icon">🛡️</span>
+                    <span class="trust-text">Zero surveillance</span>
+                </div>
+                <div class="trust-item">
+                    <span class="trust-icon">🚀</span>
+                    <span class="trust-text">30-min setup</span>
+                </div>
+            </div>
+        </div>
+    </div>
+</section>
+
+<!-- Solution Grid -->
+<section class="solution-grid" id="solution">
+    <div class="grid-container">
+        <div class="section-header">
+            <h2>Everything Your Campaign Needs</h2>
+            <p>Replace your entire SaaS stack with open source alternatives. <b>First free and open source canvassing solution included.</b></p>
+        </div>
+        
+        <div class="services-grid">
+            <!-- Code Server -->
+            <div class="service-card grid-card">
+                <div class="service-icon">💻</div>
+                <h3>Code Server</h3>
+                <div class="service-replaces">Replaces: VS Code</div>
+                <ul class="service-features">
+                    <li>Browser-based IDE</li>
+                    <li>Customizable workspace</li>
+                    <li>Live collaboration</li>
+                </ul>
+                <div class="service-tool">Code Server</div>
+            </div>
+
+            <!-- MkDocs -->
+            <div class="service-card grid-card">
+                <div class="service-icon">📖</div>
+                <h3>Documentation</h3>
+                <div class="service-replaces">Replaces: Confluence</div>
+                <ul class="service-features">
+                    <li>Markdown-based</li>
+                    <li>Live preview</li>
+                    <li>Static site generation</li>
+                </ul>
+                <div class="service-tool">MkDocs</div>
+            </div>
+
+            <!-- Listmonk -->
+            <div class="service-card grid-card">
+                <div class="service-icon">📧</div>
+                <h3>Email Campaigns</h3>
+                <div class="service-replaces">Replaces: Mailchimp</div>
+                <ul class="service-features">
+                    <li>Unlimited subscribers</li>
+                    <li>A/B testing</li>
+                    <li>Analytics</li>
+                </ul>
+                <div class="service-tool">Listmonk</div>
+            </div>
+
+            <!-- NocoDB -->
+            <div class="service-card grid-card">
+                <div class="service-icon">📊</div>
+                <h3>Database & Canvassing</h3>
+                <div class="service-replaces">Replaces: Airtable</div>
+                <ul class="service-features">
+                    <li>Contact management</li>
+                    <li>Custom fields</li>
+                    <li>Canvassing support</li>
+                </ul>
+                <div class="service-tool">NocoDB</div>
+            </div>
+
+            <!-- Map Viewer -->
+            <div class="service-card grid-card">
+                <div class="service-icon">🗺️</div>
+                <h3>Interactive Maps</h3>
+                <div class="service-replaces">Replaces: Google Maps</div>
+                <ul class="service-features">
+                    <li>Real-time geolocation</li>
+                    <li>Custom map layers</li>
+                    <li>Location management</li>
+                </ul>
+                <div class="service-tool">Map Viewer</div>
+            </div>
+
+            <!-- Automation -->
+            <div class="service-card grid-card">
+                <div class="service-icon">🔄</div>
+                <h3>Workflow Automation</h3>
+                <div class="service-replaces">Replaces: Zapier</div>
+                <ul class="service-features">
+                    <li>Workflow builder</li>
+                    <li>API connections</li>
+                    <li>Event triggers</li>
+                </ul>
+                <div class="service-tool">n8n</div>
+            </div>
+
+            <!-- QR Code Generator -->
+            <div class="service-card grid-card">
+                <div class="service-icon">📱</div>
+                <h3>QR Code Generator</h3>
+                <div class="service-replaces">Replaces: QR Code SaaS</div>
+                <ul class="service-features">
+                    <li>Customizable codes</li>
+                    <li>Batch generation</li>
+                    <li>Static and dynamic codes</li>
+                </ul>
+                <div class="service-tool">Mini QR</div>
+            </div>
+
+            <!-- Gitea -->
+            <div class="service-card grid-card">
+                <div class="service-icon">🔧</div>
+                <h3>Version Control</h3>
+                <div class="service-replaces">Replaces: GitHub</div>
+                <ul class="service-features">
+                    <li>Self-hosted Git</li>
+                    <li>Collaborative development</li>
+                    <li>Issue tracking</li>
+                </ul>
+                <div class="service-tool">Gitea</div>
+            </div>
+        </div>
+    </div>
+</section>
+
+<!-- Comparison Grid -->
+<section class="comparison-grid">
+    <div class="grid-container">
+        <div class="section-header">
+            <h2>Corporate SaaS vs Changemaker Lite</h2>
+            <p>Why campaigns are switching to self-hosted FOSS</p>
+        </div>
+        
+        <div class="comparison-table">
+            <div class="comparison-header grid-card">
+                <div></div>
+                <div class="compare-col">Corporate SaaS</div>
+                <div class="compare-col highlight">Changemaker Lite</div>
+            </div>
+            
+            <div class="comparison-row grid-card">
+                <div class="compare-label">Monthly Cost</div>
+                <div class="compare-value bad">$1,200+</div>
+                <div class="compare-value good">$50 hosting</div>
+            </div>
+            
+            <div class="comparison-row grid-card">
+                <div class="compare-label">Data Ownership</div>
+                <div class="compare-value bad">Their servers</div>
+                <div class="compare-value good">100% yours</div>
+            </div>
+            
+            <div class="comparison-row grid-card">
+                <div class="compare-label">Surveillance</div>
+                <div class="compare-value bad">Always tracked</div>
+                <div class="compare-value good">Zero tracking</div>
+            </div>
+            
+            <div class="comparison-row grid-card">
+                <div class="compare-label">Vendor Lock-in</div>
+                <div class="compare-value bad">Trapped forever</div>
+                <div class="compare-value good">Export anytime</div>
+            </div>
+            
+            <div class="comparison-row grid-card">
+                <div class="compare-label">Customization</div>
+                <div class="compare-value bad">Limited options</div>
+                <div class="compare-value good">Full control</div>
+            </div>
+        </div>
+    </div>
+</section>
+
+<!-- Get Started Grid -->
+<section class="get-started-grid" id="get-started">
+    <div class="grid-container">
+        <div class="section-header">
+            <h2>Start Your Digital Liberation</h2>
+            <p>Three ways to break free from corporate campaign tech</p>
+        </div>
+        
+        <div class="options-grid">
+            <!-- Plug & Play -->
+            <div class="option-card grid-card featured">
+                <div class="option-badge">Most Popular</div>
+                <div class="option-icon">🚀</div>
+                <h3>Plug & Play</h3>
+                <div class="option-price">$200</div>
+                <div class="option-features">
+                    <div class="feature">✓ Pre-configured hardware</div>
+                    <div class="feature">✓ 30-minute setup</div>
+                    <div class="feature">✓ All 11 services ready</div>
+                    <div class="feature">✓ Priority support</div>
+                    <div class="feature">✓ Ships on request</div>
+                </div>
+                <a href="https://bnkops.com/hardware" class="btn btn-primary">Order Hardware</a>
+            </div>
+            
+            <!-- DIY -->
+            <div class="option-card grid-card">
+                <div class="option-icon">🛠️</div>
+                <h3>DIY Install</h3>
+                <div class="option-price">Free</div>
+                <div class="option-features">
+                    <div class="feature">✓ Use your hardware</div>
+                    <div class="feature">✓ Docker compose</div>
+                    <div class="feature">✓ Full documentation</div>
+                    <div class="feature">✓ Community support</div>
+                    <div class="feature">✓ Learn the system</div>
+                </div>
+                <a href="/getting-started/" class="btn btn-secondary">Install Guide</a>
+            </div>
+            
+            <!-- Managed -->
+            <div class="option-card grid-card">
+                <div class="option-icon">☁️</div>
+                <h3>Managed Hosting</h3>
+                <div class="option-price">$???/mo</div>
+                <div class="option-features">
+                    <div class="feature">✓ We manage everything</div>
+                    <div class="feature">✓ Your domain</div>
+                    <div class="feature">✓ Daily backups</div>
+                    <div class="feature">✓ 24/7 monitoring</div>
+                    <div class="feature">✓ Still your data</div>
+                </div>
+                <a href="https://bnkops.com/hosting" class="btn btn-secondary">Learn More</a>
+            </div>
+        </div>
+        
+        <!-- Final CTA -->
+        <div class="final-cta grid-card">
+            <h3>Join the Movement</h3>
+            <p>Some of the biggest players in local politics are already using it; maybe give it a try?</p>
+            <div class="cta-buttons">
+                <a href="https://bnkops.com/newsletter" class="btn btn-primary">Get Campaign Tips</a>
+                <a href="https://docs.bnkops.com" class="btn btn-secondary">Read Documentation</a>
+            </div>
+        </div>
+        <!-- Subscribe Card -->
+        <div class="subscribe-card grid-card">
+          <h3>Subscribe</h3>
+          <form action="https://newsletter.bnkops.com/subscription/form" method="POST" target="_blank" autocomplete="off">
+            <input type="hidden" name="nonce">
+            <p>
+              <input type="email" name="email" required placeholder="E-mail">
+            </p>
+            <p>
+              <input type="text" name="name" placeholder="Name (optional)">
+            </p>
+            <p>
+              <input id="48b84" type="checkbox" name="l" checked value="48b841e7-841b-458b-95f8-63903a1c0912">
+              <label for="48b84">~ Weekly Updates</label>
+            </p>
+            <input type="submit" value="Subscribe" class="action-btn primary">
+          </form>
+        </div>
+    </div>
+</section>
+
+</div>
+{% endblock %}

mkdocs/docs/overrides/main.html

@@ -1,6 +1,8 @@
 {% extends "base.html" %}
 
 {% block extrahead %}
+  {{ super() }}
+  <!-- Custom meta tags or head content can go here -->
 {% endblock %}
 
 {% block announce %}

mkdocs/docs/philosophy.md

@@ -0,0 +1,188 @@
+# Philosophy: Your Secrets, Your Power, Your Movement
+
+## The Question That Changes Everything
+
+**If you are a political actor, who do you trust with your secrets?**
+
+This isn't just a technical question—it's the core political question of our time. Every email you send, every document you create, every contact list you build, every strategy you develop: where does it live? Who owns the servers? Who has the keys?
+
+## The Corporate Extraction Machine
+
+### How They Hook You
+
+Corporate software companies have perfected the art of digital colonization:
+
+1. **Free Trials** - They lure you in with "free" accounts
+2. **Feature Creep** - Essential features require paid tiers  
+3. **Data Lock-In** - Your data becomes harder to export
+4. **Price Escalation** - $40/month becomes $750/month as you grow
+5. **Surveillance Integration** - Your organizing becomes their intelligence
+
+### The Real Product
+
+!!! warning "You Are Not the Customer"
+    If you're not paying for the product, you ARE the product. But even when you are paying, you're often still the product.
+
+Corporate platforms don't make money from your subscription fees—they make money from:
+
+- **Data Sales** to third parties
+- **Algorithmic Manipulation** for corporate and political interests  
+- **Surveillance Contracts** with governments and corporations
+- **Predictive Analytics** about your community and movement
+
+## The BNKops Alternative
+
+### Who We Are
+
+**BNKops** is a cooperative based in amiskwaciy-wâskahikan (Edmonton, Alberta) on Treaty 6 territory. We're not a corporation—we're a collective of skilled organizers, developers, and community builders who believe technology should serve liberation, not oppression.
+
+### Our Principles
+
+#### 🏳️‍⚧️ 🇵🇸 Liberation First
+
+Technology that centers the most marginalized voices and fights for collective liberation. Trans rights are human rights, and our tools reflect this commitment.
+
+#### 🤝 Community Over Profit  
+
+We operate as a cooperative because we believe in shared ownership and democratic decision-making. No venture capitalists, no shareholders, no extraction.
+
+#### ⚡ Data Sovereignty
+
+Your data belongs to you and your community. We build tools that let you own your digital infrastructure completely.
+
+#### 🔒 Security Culture
+
+Real security comes from community control, not corporate promises. We integrate security culture practices into our technology design.
+
+## The Changemaker Difference
+
+### Traditional Corporate Flow
+
+```
+Your Data → Corporate Server → Surveillance → Profit → Your Oppression
+```
+
+### Changemaker Flow  
+
+```
+Your Data → Your Server → Your Community → Your Power → Liberation
+```
+
+### Why This Matters
+
+When you control your technology infrastructure:
+
+- **Your secrets stay secret** - No corporate access to sensitive organizing data
+- **Your community stays connected** - No algorithmic manipulation of your reach
+- **Your costs stay low** - No extraction-based pricing as you grow
+- **Your future stays yours** - No vendor lock-in or platform dependency
+
+## The Philosophy in Practice
+
+### Security Culture Meets Technology
+
+Traditional security culture asks: "Who needs to know this information?" 
+
+Digital security culture asks: "Who controls the infrastructure where this information lives?"
+
+### Community Technology
+
+We believe in **community technology** - tools that:
+
+- Are owned and controlled by the communities that use them
+- Are designed with liberation politics from the ground up
+- Prioritize care, consent, and collective power
+- Can be understood, modified, and improved by community members
+
+### Prefigurative Politics
+
+The tools we use shape the movements we build. Corporate tools create corporate movements—hierarchical, surveilled, and dependent. Community-controlled tools create community-controlled movements—democratic, secure, and sovereign.
+
+## Common Questions
+
+### "Isn't this just for tech people?"
+
+**No.** We specifically designed Changemaker Lite for organizers, activists, and movement builders who may not have technical backgrounds. Our philosophy is that everyone deserves digital sovereignty, not just people with computer science degrees.
+
+### "What about convenience?"
+
+Corporate platforms are convenient because they've extracted billions of dollars from users to fund that convenience. When you own your tools, there's a learning curve—but it's the same learning curve as learning to organize, learning to build power, learning to create change.
+
+### "Can't we just use corporate tools carefully?"
+
+Would you hold your most sensitive organizing meetings in a room owned by your opposition? Would you store your membership lists in filing cabinets at a corporation that profits from surveillance? Digital tools are the same.
+
+### "What about security?"
+
+Real security comes from community control, not corporate promises. When you control your infrastructure:
+
+- You decide what gets logged and what doesn't
+- You choose who has access and who doesn't  
+- You know exactly where your data is and who can see it
+- You can't be de-platformed or locked out of your own data
+
+## Historical Context
+
+### Learning from Past Struggles
+
+Every liberation movement has had to solve the problem of secure communication and information sharing:
+
+- **Underground Railroad** - Coded songs and safe houses
+- **Labor Movement** - Secret meetings and encrypted telegrams  
+- **Civil Rights Movement** - CB radios and phone trees
+- **LGBTQ+ Liberation** - Chosen families and community networks
+
+The internet should expand these traditions, not replace them with corporate surveillance.
+
+### The Surveillance Capitalism Trap
+
+As Shoshana Zuboff documents in "The Age of Surveillance Capitalism," we're living through a new form of capitalism that extracts value from human experience itself. Political movements are particularly valuable targets because:
+
+- Political data predicts behavior
+- Movement intelligence can be used to counter-organize
+- Community networks can be mapped and disrupted
+- Organizing strategies can be monitored and neutralized
+
+## Taking Action
+
+### Start Where You Are
+
+You don't have to replace everything at once. Start with one tool, one campaign, one project. Learn the technology alongside your organizing.
+
+### Build Community Capacity
+
+The goal isn't individual self-sufficiency—it's community technological sovereignty. Share skills, pool resources, learn together.
+
+### Connect with Others
+
+You're not alone in this. The free and open source software community, the digital security community, and the appropriate technology movement are all working on similar problems.
+
+### Remember Why
+
+This isn't about technology for its own sake. It's about building the infrastructure for the world we want to see—where communities have power, where people control their own data, where technology serves liberation.
+
+---
+
+## Resources for Deeper Learning
+
+### Essential Reading
+
+- [De-corp Your Software Stack](https://docs.bnkops.com/archive/repo.archive/thatreallyblondehuman/Thoughts%20🤔/If%20you%20do%20politics%20who%20is%20reading%20your%20secrets%20-%20why%20you%20should%20de-corp%20your%20software%20stack/) - Our full manifesto
+- [The Age of Surveillance Capitalism](https://en.wikipedia.org/wiki/The_Age_of_Surveillance_Capitalism) by Shoshana Zuboff
+- [Security Culture Handbook](https://docs.bnkops.com/archive/repo.archive/Zines%20We%20Like%20😎/What%20Is%20Security%20Culture%20☠/)
+
+### Community Resources
+
+- [BNKops Repository](https://docs.bnkops.com/) - Documentation and knowledge base
+- [Activist Handbook](https://activist.org/) - Movement building resources
+- [EFF Surveillance Self-Defense](https://ssd.eff.org/) - Digital security guides
+
+### Technical Learning
+
+- [Self-Hosted Awesome List](https://github.com/awesome-selfhosted/awesome-selfhosted) - Open source alternatives
+- [Linux Journey](https://linuxjourney.com/) - Learn Linux basics
+- [Docker Curriculum](https://docker-curriculum.com/) - Learn containerization
+
+---
+
+*This philosophy document is a living document. Contribute your thoughts, experiences, and improvements through the [BNKops documentation platform](https://docs.bnkops.com/).*

mkdocs/docs/services/gitea.md

@@ -0,0 +1,53 @@
+# Gitea
+
+Self-hosted Git service for collaborative development.
+
+## Overview
+
+Gitea is a lightweight, self-hosted Git service similar to GitHub, GitLab, and Bitbucket. It provides a web interface for managing repositories, issues, pull requests, and more.
+
+## Features
+
+- Git repository hosting
+- Web-based interface
+- Issue tracking
+- Pull requests
+- Wiki and code review
+- Lightweight and easy to deploy
+
+## Access
+
+- **Default Web Port**: `${GITEA_WEB_PORT:-3030}` (default: 3030)
+- **Default SSH Port**: `${GITEA_SSH_PORT:-2222}` (default: 2222)
+- **URL**: `http://localhost:${GITEA_WEB_PORT:-3030}`
+- **Default Data Directory**: `/data/gitea`
+
+## Configuration
+
+### Environment Variables
+
+- `GITEA__database__DB_TYPE`: Database type (e.g., `sqlite3`, `mysql`, `postgres`)
+- `GITEA__database__HOST`: Database host (default: `${GITEA_DB_HOST:-gitea-db:3306}`)
+- `GITEA__database__NAME`: Database name (default: `${GITEA_DB_NAME:-gitea}`)
+- `GITEA__database__USER`: Database user (default: `${GITEA_DB_USER:-gitea}`)
+- `GITEA__database__PASSWD`: Database password (from `.env`)
+- `GITEA__server__ROOT_URL`: Root URL (e.g., `${GITEA_ROOT_URL}`)
+- `GITEA__server__HTTP_PORT`: Web port (default: 3000 inside container)
+- `GITEA__server__DOMAIN`: Domain (e.g., `${GITEA_DOMAIN}`)
+
+### Volumes
+
+- `gitea_data:/data`: Gitea configuration and data
+- `/etc/timezone:/etc/timezone:ro`
+- `/etc/localtime:/etc/localtime:ro`
+
+## Usage
+
+1. Access Gitea at `http://localhost:${GITEA_WEB_PORT:-3030}`
+2. Register or log in as an admin user
+3. Create or import repositories
+4. Collaborate with your team
+
+## Official Documentation
+
+For more details, visit the [official Gitea documentation](https://docs.gitea.com/).

mkdocs/docs/services/homepage.md

@@ -55,15 +55,18 @@ Homepage uses YAML configuration files located in `./configs/homepage/`:
 Homepage is pre-configured with all Changemaker Lite services:
 
 ### Essential Tools
+
 - **Code Server** (Port 8888): VS Code in the browser
 - **Listmonk** (Port 9000): Newsletter & mailing list manager
 - **NocoDB** (Port 8090): No-code database platform
 
 ### Content & Documentation
+
 - **MkDocs** (Port 4000): Live documentation server
 - **Static Site** (Port 4001): Built documentation hosting
 
 ### Automation & Data
+
 - **n8n** (Port 5678): Workflow automation platform
 - **PostgreSQL** (Port 5432): Database backends
 
@@ -142,21 +145,25 @@ Homepage monitors Docker containers automatically when configured:
 ### Common Issues
 
 **Configuration not loading**: Check YAML syntax in configuration files
+
 ```bash
 docker logs homepage-changemaker
 ```
 
 **Icons not displaying**: Verify icon paths and file permissions
+
 ```bash
 ls -la ./assets/icons/
 ```
 
 **Services not reachable**: Verify network connectivity between containers
+
 ```bash
 docker exec homepage-changemaker ping service-name
 ```
 
 **Widget data not updating**: Check Docker socket permissions and container access
+
 ```bash
 docker exec homepage-changemaker ls -la /var/run/docker.sock
 ```
@@ -193,6 +200,7 @@ responsive:
 ## Official Documentation
 
 For comprehensive configuration guides and advanced features:
+
 - [Homepage Documentation](https://gethomepage.dev/)
 - [GitHub Repository](https://github.com/gethomepage/homepage)
 - [Configuration Examples](https://gethomepage.dev/configs/)

mkdocs/docs/services/map.md

@@ -0,0 +1,98 @@
+# Map
+
+Interactive map service for geospatial data visualization, powered by NocoDB and Leaflet.js.
+
+## Overview
+
+The Map service provides an interactive web-based map for displaying, searching, and analyzing geospatial data from a NocoDB backend. It supports real-time geolocation, adding new locations, and is optimized for both desktop and mobile use.
+
+## Features
+
+- Interactive map visualization with OpenStreetMap
+- Real-time geolocation support
+- Add new locations directly from the map
+- Auto-refresh every 30 seconds
+- Responsive design for mobile devices
+- Secure API proxy to protect credentials
+- Docker containerization for easy deployment
+
+## Access
+
+- **Default Port**: `${MAP_PORT:-3000}` (default: 3000)
+- **URL**: `http://localhost:${MAP_PORT:-3000}`
+- **Default Workspace**: `/app/public/`
+
+## Configuration
+
+All configuration is done via environment variables:
+
+| Variable            | Description                        | Default      |
+|---------------------|------------------------------------|--------------|
+| `NOCODB_API_URL`    | NocoDB API base URL                | Required     |
+| `NOCODB_API_TOKEN`  | API authentication token           | Required     |
+| `NOCODB_VIEW_URL`   | Full NocoDB view URL               | Required     |
+| `PORT`              | Server port                        | 3000         |
+| `DEFAULT_LAT`       | Default map latitude               | 53.5461      |
+| `DEFAULT_LNG`       | Default map longitude              | -113.4938    |
+| `DEFAULT_ZOOM`      | Default map zoom level             | 11           |
+
+### Volumes
+
+- `./map/app/public`: Map public assets
+
+## Usage
+
+1. Access the map at `http://localhost:${MAP_PORT:-3000}`
+2. Search for locations or addresses
+3. Add or view custom markers
+4. Analyze geospatial data as needed
+
+## NocoDB Table Setup
+
+### Required Columns
+
+- `geodata` (Text): Format "latitude;longitude" 
+- `latitude` (Decimal): Precision 10, Scale 8
+- `longitude` (Decimal): Precision 11, Scale 8
+
+### Form Fields (as seen in the interface)
+
+- `First Name` (Text): Person's first name
+- `Last Name` (Text): Person's last name  
+- `Email` (Email): Contact email address
+- `Unit Number` (Text): Apartment/unit number
+- `Support Level` (Single Select): 
+  - 1 - Strong Support (Green)
+  - 2 - Moderate Support (Yellow) 
+  - 3 - Low Support (Orange)
+  - 4 - No Support (Red)
+- `Address` (Text): Full street address
+- `Sign` (Checkbox): Has campaign sign (true/false)
+- `Sign Size` (Single Select): Small, Medium, Large
+- `Geo-Location` (Text): Formatted as "latitude;longitude"
+
+## API Endpoints
+
+- `GET /api/locations` - Fetch all locations
+- `POST /api/locations` - Create new location
+- `GET /api/locations/:id` - Get single location
+- `PUT /api/locations/:id` - Update location
+- `DELETE /api/locations/:id` - Delete location
+- `GET /health` - Health check
+
+## Security Considerations
+
+- API tokens are kept server-side only
+- CORS is configured for security
+- Rate limiting prevents abuse
+- Input validation on all endpoints
+- Helmet.js for security headers
+
+## Troubleshooting
+
+- Ensure NocoDB table has required columns and valid coordinates
+- Check API token permissions and network connectivity
+
+## Official Documentation
+
+Refer to the [project README](../../map/README.md) for more information.

mkdocs/docs/services/mini-qr.md

@@ -0,0 +1,40 @@
+# Mini QR
+
+Simple QR code generator service.
+
+## Overview
+
+Mini QR is a lightweight service for generating QR codes for URLs, text, or other data. It provides a web interface for quick QR code creation and download.
+
+## Features
+
+- Generate QR codes for text or URLs
+- Download QR codes as images
+- Simple and fast interface
+- No user registration required
+
+## Access
+
+- **Default Port**: `${MINI_QR_PORT:-8089}` (default: 8089)
+- **URL**: `http://localhost:${MINI_QR_PORT:-8089}`
+
+## Configuration
+
+### Environment Variables
+
+- `QR_DEFAULT_SIZE`: Default size of generated QR codes
+- `QR_IMAGE_FORMAT`: Image format (e.g., `png`, `svg`)
+
+### Volumes
+
+- `./configs/mini-qr`: QR code service configuration
+
+## Usage
+
+1. Access Mini QR at `http://localhost:${MINI_QR_PORT:-8089}`
+2. Enter the text or URL to encode
+3. Download or share the generated QR code
+
+## Official Documentation
+
+See the [project README](../../README.md) for more details.

mkdocs/docs/services/n8n.md

@@ -57,27 +57,32 @@ n8n is a powerful workflow automation tool that allows you to connect various ap
 ## Common Use Cases
 
 ### Documentation Automation
+
 - Auto-generate documentation from code comments
 - Sync documentation between different platforms
 - Notify team when documentation is updated
 
 ### Email Campaign Integration
+
 - Connect Listmonk with external data sources
 - Automate subscriber management
 - Trigger campaigns based on events
 
 ### Database Management with NocoDB
+
 - Sync data between NocoDB and external APIs
 - Automate data entry and validation
 - Create backup workflows for database content
 - Generate reports from NocoDB data
 
 ### Development Workflows
+
 - Auto-deploy documentation on git push
 - Sync code changes with documentation
 - Backup automation
 
 ### Data Processing
+
 - Process CSV files and import to databases
 - Transform data between different formats
 - Schedule regular data updates
@@ -85,16 +90,19 @@ n8n is a powerful workflow automation tool that allows you to connect various ap
 ## Example Workflows
 
 ### Simple Webhook to Email
+
 ```
 Webhook → Email
 ```
 
 ### Scheduled Documentation Backup
+
 ```
 Schedule → Read Files → Compress → Upload to Storage
 ```
 
 ### Git Integration
+
 ```
 Git Webhook → Process Changes → Update Documentation → Notify Team
 ```
@@ -110,6 +118,7 @@ Git Webhook → Process Changes → Update Documentation → Notify Team
 ## Integration with Other Services
 
 n8n can integrate with all services in your Changemaker Lite setup:
+
 - **Listmonk**: Manage subscribers and campaigns
 - **PostgreSQL**: Read/write database operations
 - **Code Server**: File operations and git integration
@@ -139,6 +148,7 @@ docker exec -it n8n-changemaker sh
 ## Official Documentation
 
 For comprehensive n8n documentation:
+
 - [n8n Documentation](https://docs.n8n.io/)
 - [Community Workflows](https://n8n.io/workflows/)
 - [Node Reference](https://docs.n8n.io/integrations/builtin/)

mkdocs/docs/services/nocodb.md

@@ -34,6 +34,7 @@ NocoDB is an open-source no-code platform that transforms any database into a sm
 ### Database Backend
 
 NocoDB uses a dedicated PostgreSQL instance (`root_db`) with the following configuration:
+
 - **Database Name**: `root_db`
 - **Username**: `postgres`
 - **Password**: `password`
@@ -56,16 +57,19 @@ NocoDB uses a dedicated PostgreSQL instance (`root_db`) with the following confi
 ## Common Use Cases
 
 ### Content Management
+
 - Create content databases for blogs and websites
 - Manage product catalogs and inventories
 - Track customer information and interactions
 
 ### Project Management
+
 - Task and project tracking systems
 - Team collaboration workspaces
 - Resource and timeline management
 
 ### Data Collection
+
 - Custom forms for surveys and feedback
 - Event registration and management
 - Lead capture and CRM systems
@@ -131,16 +135,19 @@ Application settings and metadata are stored in the `nc_data` volume.
 ### Common Issues
 
 **Service won't start**: Check if the PostgreSQL database is healthy
+
 ```bash
 docker logs root_db
 ```
 
 **Database connection errors**: Verify database credentials and network connectivity
+
 ```bash
 docker exec nocodb nc_data nc
 ```
 
 **Performance issues**: Monitor resource usage and optimize queries
+
 ```bash
 docker stats nocodb root_db
 ```
@@ -148,6 +155,7 @@ docker stats nocodb root_db
 ## Official Documentation
 
 For comprehensive guides and advanced features:
+
 - [NocoDB Documentation](https://docs.nocodb.com/)
 - [GitHub Repository](https://github.com/nocodb/nocodb)
 - [Community Forum](https://community.nocodb.com/)

mkdocs/docs/stylesheets/home.css

@@ -0,0 +1,706 @@
+/* Changemaker Lite - Ultra-Tight Grid System */
+
+/* Homepage-specific variables */
+.md-content--home {
+  /* Trans flag colors with neon glow variants */
+  --mkdocs-purple: #6f42c1;
+  --mkdocs-purple-dark: #3d2064;
+  --trans-blue: var(--mkdocs-purple); /* override for main accent */
+  --trans-pink: #F5A9B8;
+  --trans-white: #FFFFFF;
+  --trans-white-dim: #E0E0E0;
+  
+  /* Dark theme colors */
+  --home-dark-bg: #0a0a0a;
+  --home-dark-surface: #151515;
+  --home-dark-card: #1a1a1a;
+  --home-dark-border: #2a2a2a;
+  --home-dark-text: #e0e0e0;
+  --home-dark-text-muted: #999;
+  
+  /* Grid colors */
+  --grid-primary: var(--trans-blue);
+  --grid-secondary: var(--trans-pink);
+  --grid-accent: var(--trans-white);
+  --grid-border: rgba(91, 206, 250, 0.2);
+  
+  /* Neon effects - optimized for grid density */
+  --neon-blue-shadow: 0 0 8px rgba(91, 206, 250, 0.6);
+  --neon-pink-shadow: 0 0 8px rgba(245, 169, 184, 0.6);
+  --neon-white-shadow: 0 0 6px rgba(255, 255, 255, 0.4);
+  
+  /* Tight spacing for maximum content density */
+  --space-xs: 0.25rem;
+  --space-sm: 0.5rem;
+  --space-md: 0.75rem;
+  --space-lg: 1rem;
+  --space-xl: 1.5rem;
+  --space-2xl: 2rem;
+  
+  /* Compact typography */
+  --text-xs: 0.7rem;
+  --text-sm: 0.8rem;
+  --text-base: 0.9rem;
+  --text-lg: 1rem;
+  --text-xl: 1.1rem;
+  --text-2xl: 1.3rem;
+  --text-3xl: 1.8rem;
+  --text-4xl: 2.2rem;
+  
+  /* Layout */
+  --home-radius: 8px;
+  --home-max-width: 1400px;
+  --grid-gap: var(--space-sm);
+  --card-padding: var(--space-md);
+}
+
+/* Homepage body setup */
+body[data-md-template="home"] {
+  background: var(--home-dark-bg);
+  margin: 0;
+  padding: 0;
+  overflow-x: hidden;
+}
+
+/* Hide MkDocs chrome completely */
+body[data-md-template="home"] .md-header,
+body[data-md-template="home"] .md-tabs,
+body[data-md-template="home"] .md-sidebar,
+body[data-md-template="home"] .md-footer,
+body[data-md-template="home"] .md-footer-meta {
+  display: none !important;
+}
+
+body[data-md-template="home"] .md-content {
+  padding: 0 !important;
+  margin: 0 !important;
+}
+
+body[data-md-template="home"] .md-main__inner {
+  margin: 0 !important;
+  max-width: none !important;
+}
+
+/* Homepage content wrapper */
+.md-content--home {
+  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
+  color: var(--home-dark-text);
+  background: var(--home-dark-bg);
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+  min-height: 100vh;
+  line-height: 1.4;
+}
+
+/* =================================
+   ULTRA-TIGHT GRID SYSTEM
+   ================================= */
+
+.grid-container {
+  max-width: 1200px;
+  margin: 0 auto;
+  padding: var(--space-sm);
+  display: grid;
+  gap: var(--space-xs);
+}
+
+.grid-card {
+  background: var(--home-dark-card);
+  border: 1px solid var(--grid-border);
+  border-radius: 4px;
+  padding: var(--space-md);
+  transition: all 0.2s ease;
+  position: relative;
+  overflow: hidden;
+}
+
+.grid-card::before {
+  content: '';
+  position: absolute;
+  top: 0;
+  left: -100%;
+  width: 100%;
+  height: 2px;
+  background: linear-gradient(90deg, transparent, var(--trans-blue), transparent);
+  transition: left 0.5s ease;
+}
+
+.grid-card:hover::before {
+  left: 100%;
+}
+
+.grid-card:hover {
+  border-color: var(--trans-blue);
+  box-shadow: 0 0 15px rgba(91, 206, 250, 0.3);
+  transform: translateY(-1px);
+}
+
+/* =================================
+   HERO GRID - ULTRA COMPACT
+   ================================= */
+
+.hero-grid {
+  padding: var(--space-md) 0;
+  background: linear-gradient(180deg, var(--home-dark-bg) 0%, var(--home-dark-surface) 100%);
+}
+
+.hero-grid .grid-container {
+  grid-template-columns: 2fr 1fr;
+  grid-template-rows: auto auto;
+  grid-template-areas: 
+    "hero-main hero-problem"
+    "hero-stats hero-trust";
+  gap: var(--space-sm);
+}
+
+.hero-main {
+  grid-area: hero-main;
+}
+
+.hero-problem {
+  grid-area: hero-problem;
+}
+
+.hero-stats {
+  grid-area: hero-stats;
+}
+
+.hero-trust {
+  grid-area: hero-trust;
+}
+
+/* Neon badge animation */
+.meta-badge {
+  background: linear-gradient(135deg, var(--trans-blue), var(--trans-pink));
+  color: #000;
+  font-size: 0.7rem;
+  font-weight: 700;
+  padding: 0.2rem 0.8rem;
+  border-radius: 20px;
+  display: inline-block;
+  margin-bottom: var(--space-sm);
+  animation: neon-pulse 2s ease-in-out infinite;
+}
+
+@keyframes neon-pulse {
+  0%, 100% { 
+    box-shadow: 0 0 5px rgba(91, 206, 250, 0.8),
+                0 0 10px rgba(91, 206, 250, 0.6),
+                0 0 15px rgba(91, 206, 250, 0.4);
+  }
+  50% { 
+    box-shadow: 0 0 10px rgba(245, 169, 184, 0.8),
+                0 0 20px rgba(245, 169, 184, 0.6),
+                0 0 30px rgba(245, 169, 184, 0.4);
+  }
+}
+
+.hero-main h1 {
+  font-size: 2rem;
+  font-weight: 800;
+  margin: 0 0 var(--space-sm) 0;
+  line-height: 1.1;
+  background: linear-gradient(135deg, var(--trans-white), var(--trans-blue));
+  -webkit-background-clip: text;
+  -webkit-text-fill-color: transparent;
+  background-clip: text;
+  animation: text-glow 3s ease-in-out infinite;
+}
+
+@keyframes text-glow {
+  0%, 100% { filter: brightness(1); }
+  50% { filter: brightness(1.2); }
+}
+
+.hero-main p {
+  font-size: 0.9rem;
+  color: var(--home-dark-text-muted);
+  margin: 0 0 var(--space-lg) 0;
+  line-height: 1.4;
+}
+
+.hero-ctas {
+  display: flex;
+  gap: var(--space-sm);
+}
+
+/* Problem/Solution blocks */
+.hero-problem h3,
+.hero-stats h3,
+.hero-trust h3 {
+  font-size: 0.9rem;
+  margin: 0 0 var(--space-sm) 0;
+  color: var(--trans-blue);
+  text-transform: uppercase;
+  letter-spacing: 0.05em;
+}
+
+.problem-list {
+  display: flex;
+  flex-direction: column;
+  gap: var(--space-xs);
+}
+
+.problem-item {
+  font-size: 0.8rem;
+  color: var(--home-dark-text-muted);
+  padding: var(--space-xs);
+  background: var(--home-dark-surface);
+  border-radius: 2px;
+}
+
+.stat-grid {
+  display: grid;
+  grid-template-columns: 1fr 1fr;
+  gap: var(--space-xs);
+}
+
+.stat-item {
+  text-align: center;
+  padding: var(--space-xs);
+  background: var(--home-dark-surface);
+  border-radius: 2px;
+}
+
+.stat-number {
+  font-size: 1.2rem;
+  font-weight: 700;
+  color: var(--trans-blue);
+  margin: 0;
+  animation: number-glow 4s ease-in-out infinite;
+}
+
+@keyframes number-glow {
+  0%, 100% { text-shadow: 0 0 5px rgba(91, 206, 250, 0.5); }
+  50% { text-shadow: 0 0 10px rgba(91, 206, 250, 0.8); }
+}
+
+.stat-label {
+  font-size: 0.65rem;
+  color: var(--home-dark-text-muted);
+  margin: 0;
+}
+
+.trust-items {
+  display: grid;
+  grid-template-columns: 1fr 1fr;
+  gap: var(--space-xs);
+}
+
+.trust-item {
+  display: flex;
+  align-items: center;
+  gap: var(--space-xs);
+  font-size: 0.7rem;
+  padding: var(--space-xs);
+  background: var(--home-dark-surface);
+  border-radius: 2px;
+}
+
+/* =================================
+   SERVICES GRID - ULTRA COMPACT
+   ================================= */
+
+.solution-grid {
+  padding: var(--space-lg) 0;
+  border-top: 1px solid var(--grid-border);
+}
+
+.section-header {
+  text-align: center;
+  margin-bottom: var(--space-lg);
+}
+
+.section-header h2 {
+  font-size: 1.8rem;
+  font-weight: 700;
+  margin: 0 0 var(--space-xs) 0;
+  color: var(--home-dark-text);
+}
+
+.section-header p {
+  font-size: 0.9rem;
+  color: var(--home-dark-text-muted);
+  margin: 0;
+}
+
+.services-grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
+  gap: var(--space-sm);
+}
+
+.service-card {
+  text-align: center;
+  cursor: pointer;
+}
+
+.service-card:hover .service-icon {
+  animation: icon-bounce 0.5s ease;
+}
+
+@keyframes icon-bounce {
+  0%, 100% { transform: translateY(0); }
+  50% { transform: translateY(-5px); }
+}
+
+.service-icon {
+  font-size: 2rem;
+  margin-bottom: var(--space-xs);
+}
+
+.service-card h3 {
+  font-size: 0.9rem;
+  margin: 0 0 var(--space-xs) 0;
+  color: var(--home-dark-text);
+}
+
+.service-replaces {
+  font-size: 0.65rem;
+  color: var(--trans-pink);
+  margin-bottom: var(--space-sm);
+  text-transform: uppercase;
+  letter-spacing: 0.05em;
+}
+
+.service-features {
+  list-style: none;
+  padding: 0;
+  margin: 0 0 var(--space-sm) 0;
+  font-size: 0.7rem;
+  color: var(--home-dark-text-muted);
+}
+
+.service-features li {
+  padding: 0.1rem 0;
+}
+
+.service-tool {
+  font-size: 0.75rem;
+  font-weight: 600;
+  color: var(--trans-blue);
+  padding: 0.2rem 0.5rem;
+  background: var(--home-dark-surface);
+  border-radius: 2px;
+  display: inline-block;
+}
+
+/* =================================
+   COMPARISON TABLE - GRID STYLE
+   ================================= */
+
+.comparison-grid {
+  padding: var(--space-lg) 0;
+  background: var(--home-dark-surface);
+}
+
+.comparison-table {
+  display: grid;
+  gap: var(--space-xs);
+}
+
+.comparison-header,
+.comparison-row {
+  display: grid;
+  grid-template-columns: 1fr 1fr 1fr;
+  align-items: center;
+}
+
+.comparison-header {
+  font-weight: 700;
+  font-size: 0.8rem;
+  text-transform: uppercase;
+  letter-spacing: 0.05em;
+}
+
+.compare-col {
+  text-align: center;
+  padding: var(--space-sm);
+}
+
+.compare-col.highlight {
+  color: var(--trans-blue);
+}
+
+.comparison-row {
+  font-size: 0.8rem;
+}
+
+.compare-label {
+  padding: var(--space-sm);
+  font-weight: 600;
+}
+
+.compare-value {
+  text-align: center;
+  padding: var(--space-sm);
+}
+
+.compare-value.bad {
+  color: #ff6b6b;
+}
+
+.compare-value.good {
+  color: #4ecdc4;
+  font-weight: 600;
+}
+
+/* =================================
+   OPTIONS GRID - ULTRA COMPACT
+   ================================= */
+
+.get-started-grid {
+  padding: var(--space-lg) 0;
+}
+
+.options-grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
+  gap: var(--space-sm);
+  margin-bottom: var(--space-lg);
+}
+
+.option-card {
+  text-align: center;
+  position: relative;
+}
+
+.option-card.featured {
+  border-color: var(--trans-blue);
+  animation: featured-glow 3s ease-in-out infinite;
+}
+
+@keyframes featured-glow {
+  0%, 100% { 
+    box-shadow: 0 0 10px rgba(91, 206, 250, 0.4),
+                0 0 20px rgba(91, 206, 250, 0.2);
+  }
+  50% { 
+    box-shadow: 0 0 20px rgba(91, 206, 250, 0.6),
+                0 0 30px rgba(91, 206, 250, 0.3);
+  }
+}
+
+.option-badge {
+  position: absolute;
+  top: -8px;
+  left: 50%;
+  transform: translateX(-50%);
+  background: var(--trans-blue);
+  color: #000;
+  padding: 0.1rem 0.6rem;
+  border-radius: 10px;
+  font-size: 0.65rem;
+  font-weight: 700;
+}
+
+.option-icon {
+  font-size: 2.5rem;
+  margin-bottom: var(--space-sm);
+}
+
+.option-card h3 {
+  font-size: 1.2rem;
+  margin: 0 0 var(--space-xs) 0;
+  color: var(--home-dark-text);
+}
+
+.option-price {
+  font-size: 2rem;
+  font-weight: 700;
+  color: var(--trans-blue);
+  margin-bottom: var(--space-sm);
+}
+
+.option-features {
+  margin-bottom: var(--space-lg);
+  text-align: left;
+}
+
+.feature {
+  padding: 0.2rem 0;
+  color: var(--home-dark-text-muted);
+  font-size: 0.75rem;
+}
+
+/* Final CTA */
+.final-cta {
+  text-align: center;
+  padding: var(--space-xl);
+}
+
+.final-cta h3 {
+  font-size: 1.5rem;
+  margin: 0 0 var(--space-sm) 0;
+  color: var(--home-dark-text);
+}
+
+.final-cta p {
+  font-size: 0.9rem;
+  color: var(--home-dark-text-muted);
+  margin: 0 0 var(--space-lg) 0;
+}
+
+.cta-buttons {
+  display: flex;
+  gap: var(--space-sm);
+  justify-content: center;
+}
+
+/* =================================
+   BUTTONS - NEON STYLE
+   ================================= */
+
+.btn {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  padding: 0.4rem 1rem;
+  font-size: 0.8rem;
+  font-weight: 600;
+  text-decoration: none;
+  border-radius: 4px;
+  transition: all 0.2s ease;
+  border: 1px solid transparent;
+  cursor: pointer;
+  min-width: 100px;
+  position: relative;
+  overflow: hidden;
+  color: var(--mkdocs-purple-dark);
+}
+
+.btn::before {
+  content: '';
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  width: 0;
+  height: 0;
+  border-radius: 50%;
+  background: rgba(255, 255, 255, 0.2);
+  transform: translate(-50%, -50%);
+  transition: width 0.6s, height 0.6s;
+}
+
+.btn:hover::before {
+  width: 300px;
+  height: 300px;
+}
+
+.btn-primary {
+  background: var(--mkdocs-purple);
+  color: var(--mkdocs-purple-dark);
+  border-color: var(--mkdocs-purple);
+}
+
+.btn-primary:hover {
+  background: var(--mkdocs-purple-dark);
+  color: #000;
+  box-shadow: 0 0 15px var(--mkdocs-purple);
+  transform: translateY(-1px);
+}
+
+.btn-secondary {
+  background: transparent;
+  color: var(--mkdocs-purple);
+  border-color: var(--mkdocs-purple);
+}
+
+.btn-secondary:hover {
+  background: var(--mkdocs-purple-dark);
+  color: #000;
+  box-shadow: 0 0 15px var(--mkdocs-purple);
+}
+
+/* =================================
+   RESPONSIVE - ULTRA TIGHT
+   ================================= */
+
+@media (max-width: 768px) {
+  .grid-container {
+    gap: var(--space-xs);
+    padding: var(--space-xs);
+  }
+  
+  .hero-grid .grid-container {
+    grid-template-columns: 1fr;
+    grid-template-areas: 
+      "hero-main"
+      "hero-problem"
+      "hero-stats"
+      "hero-trust";
+  }
+  
+  .services-grid {
+    grid-template-columns: 1fr;
+  }
+  
+  .comparison-header,
+  .comparison-row {
+    font-size: 0.7rem;
+  }
+  
+  .options-grid {
+    grid-template-columns: 1fr;
+  }
+  
+  .cta-buttons {
+    flex-direction: column;
+  }
+  
+  .hero-main h1 {
+    font-size: 1.5rem;
+  }
+}
+
+@media (max-width: 480px) {
+  .grid-card {
+    padding: var(--space-sm);
+  }
+  
+  .trust-items,
+  .stat-grid {
+    grid-template-columns: 1fr;
+  }
+  
+  .service-card {
+    padding: var(--space-sm);
+  }
+  
+  .hero-main h1 {
+    font-size: 1.3rem;
+  }
+}
+
+/* =================================
+   PERFORMANCE
+   ================================= */
+
+@media (prefers-reduced-motion: reduce) {
+  * {
+    animation: none !important;
+    transition: none !important;
+  }
+}
+
+/* GPU acceleration */
+.grid-card,
+.btn {
+  will-change: transform;
+  backface-visibility: hidden;
+}
+
+/* Badge for FOSS First */
+.badge-new {
+  display: inline-block;
+  background: var(--mkdocs-purple);
+  color: #fff;
+  font-size: 0.65em;
+  font-weight: 700;
+  border-radius: 8px;
+  padding: 0.1em 0.5em;
+  margin-left: 0.3em;
+  letter-spacing: 0.03em;
+  vertical-align: middle;
+  box-shadow: 0 0 6px var(--mkdocs-purple-dark);
+}