feat: add n8ngo and kvmote landing pages as subdomains

- Add n8ngo/ and kvmote/ subfolders with Dockerfiles, nginx configs and static files
- Add dedicated Gitea workflows for each landing page (ports 8084/8085)
- Add paths-ignore to jobmaker workflow so it only triggers on its own files
- Add .dockerignore to keep landing page folders out of jobmaker image

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

.dockerignore

@@ -0,0 +1,8 @@
+.git
+.gitea
+.gitignore
+README.md
+build.sh
+instruction.txt
+n8ngo/
+kvmote/

.gitea/workflows/deploy-kvmote.yml

@@ -0,0 +1,90 @@
+name: Build and Deploy KVMote Landing Page
+
+on:
+  push:
+    branches: [ main ]
+    paths:
+      - 'kvmote/**'
+      - '.gitea/workflows/deploy-kvmote.yml'
+
+env:
+  REGISTRY: registry.redecarneir.us
+  IMAGE_NAME: kvmote-landing
+  DEPLOY_HOST: 92.246.130.58
+  DEPLOY_USER: root
+  CONTAINER_NAME: kvmote-landing
+  CONTAINER_PORT: 8085
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+
+    steps:
+    - name: Checkout code
+      uses: actions/checkout@v4
+
+    - name: Set up Docker Buildx
+      uses: docker/setup-buildx-action@v3
+
+    - name: Generate tags
+      id: meta
+      run: |
+        echo "LATEST_TAG=${REGISTRY}/${IMAGE_NAME}:latest" >> $GITHUB_OUTPUT
+        echo "VERSION_TAG=${REGISTRY}/${IMAGE_NAME}:$(date +%Y%m%d)-${GITHUB_SHA::8}" >> $GITHUB_OUTPUT
+
+    - name: Build Docker image
+      run: |
+        docker build \
+          -t ${{ steps.meta.outputs.LATEST_TAG }} \
+          -t ${{ steps.meta.outputs.VERSION_TAG }} \
+          ./kvmote
+
+    - name: Test container
+      run: |
+        docker run -d --name test-kvmote -p 8098:80 ${{ steps.meta.outputs.LATEST_TAG }}
+        sleep 5
+        docker exec test-kvmote wget -qO- http://localhost/ > /dev/null && echo "OK"
+        docker stop test-kvmote && docker rm test-kvmote
+
+    - name: Push to registry
+      run: |
+        docker push ${{ steps.meta.outputs.LATEST_TAG }}
+        docker push ${{ steps.meta.outputs.VERSION_TAG }}
+
+  deploy:
+    needs: build
+    runs-on: ubuntu-latest
+    if: github.ref == 'refs/heads/main'
+
+    steps:
+    - name: Setup SSH
+      run: |
+        mkdir -p ~/.ssh
+        echo "${{ secrets.DEPLOY_SSH_KEY }}" > ~/.ssh/id_rsa
+        chmod 600 ~/.ssh/id_rsa
+        ssh-keyscan -H ${{ env.DEPLOY_HOST }} >> ~/.ssh/known_hosts
+
+    - name: Deploy to server
+      run: |
+        ssh ${{ env.DEPLOY_USER }}@${{ env.DEPLOY_HOST }} << 'EOF'
+          set -e
+          docker pull ${{ env.REGISTRY }}/${{ env.IMAGE_NAME }}:latest
+          docker stop ${{ env.CONTAINER_NAME }} || true
+          docker rm ${{ env.CONTAINER_NAME }} || true
+          docker run -d \
+            --name ${{ env.CONTAINER_NAME }} \
+            --restart unless-stopped \
+            -p ${{ env.CONTAINER_PORT }}:80 \
+            ${{ env.REGISTRY }}/${{ env.IMAGE_NAME }}:latest
+          sleep 5
+          curl -f http://localhost:${{ env.CONTAINER_PORT }}/ || exit 1
+          docker image prune -f
+          echo "Deploy kvmote OK"
+        EOF
+
+    - name: Verify deployment
+      run: |
+        ssh ${{ env.DEPLOY_USER }}@${{ env.DEPLOY_HOST }} << 'EOF'
+          docker ps | grep ${{ env.CONTAINER_NAME }}
+          docker logs --tail 10 ${{ env.CONTAINER_NAME }}
+        EOF

.gitea/workflows/deploy-n8ngo.yml

@@ -0,0 +1,90 @@
+name: Build and Deploy n8ngo Landing Page
+
+on:
+  push:
+    branches: [ main ]
+    paths:
+      - 'n8ngo/**'
+      - '.gitea/workflows/deploy-n8ngo.yml'
+
+env:
+  REGISTRY: registry.redecarneir.us
+  IMAGE_NAME: n8ngo-landing
+  DEPLOY_HOST: 92.246.130.58
+  DEPLOY_USER: root
+  CONTAINER_NAME: n8ngo-landing
+  CONTAINER_PORT: 8084
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+
+    steps:
+    - name: Checkout code
+      uses: actions/checkout@v4
+
+    - name: Set up Docker Buildx
+      uses: docker/setup-buildx-action@v3
+
+    - name: Generate tags
+      id: meta
+      run: |
+        echo "LATEST_TAG=${REGISTRY}/${IMAGE_NAME}:latest" >> $GITHUB_OUTPUT
+        echo "VERSION_TAG=${REGISTRY}/${IMAGE_NAME}:$(date +%Y%m%d)-${GITHUB_SHA::8}" >> $GITHUB_OUTPUT
+
+    - name: Build Docker image
+      run: |
+        docker build \
+          -t ${{ steps.meta.outputs.LATEST_TAG }} \
+          -t ${{ steps.meta.outputs.VERSION_TAG }} \
+          ./n8ngo
+
+    - name: Test container
+      run: |
+        docker run -d --name test-n8ngo -p 8099:80 ${{ steps.meta.outputs.LATEST_TAG }}
+        sleep 5
+        docker exec test-n8ngo wget -qO- http://localhost/ > /dev/null && echo "OK"
+        docker stop test-n8ngo && docker rm test-n8ngo
+
+    - name: Push to registry
+      run: |
+        docker push ${{ steps.meta.outputs.LATEST_TAG }}
+        docker push ${{ steps.meta.outputs.VERSION_TAG }}
+
+  deploy:
+    needs: build
+    runs-on: ubuntu-latest
+    if: github.ref == 'refs/heads/main'
+
+    steps:
+    - name: Setup SSH
+      run: |
+        mkdir -p ~/.ssh
+        echo "${{ secrets.DEPLOY_SSH_KEY }}" > ~/.ssh/id_rsa
+        chmod 600 ~/.ssh/id_rsa
+        ssh-keyscan -H ${{ env.DEPLOY_HOST }} >> ~/.ssh/known_hosts
+
+    - name: Deploy to server
+      run: |
+        ssh ${{ env.DEPLOY_USER }}@${{ env.DEPLOY_HOST }} << 'EOF'
+          set -e
+          docker pull ${{ env.REGISTRY }}/${{ env.IMAGE_NAME }}:latest
+          docker stop ${{ env.CONTAINER_NAME }} || true
+          docker rm ${{ env.CONTAINER_NAME }} || true
+          docker run -d \
+            --name ${{ env.CONTAINER_NAME }} \
+            --restart unless-stopped \
+            -p ${{ env.CONTAINER_PORT }}:80 \
+            ${{ env.REGISTRY }}/${{ env.IMAGE_NAME }}:latest
+          sleep 5
+          curl -f http://localhost:${{ env.CONTAINER_PORT }}/ || exit 1
+          docker image prune -f
+          echo "Deploy n8ngo OK"
+        EOF
+
+    - name: Verify deployment
+      run: |
+        ssh ${{ env.DEPLOY_USER }}@${{ env.DEPLOY_HOST }} << 'EOF'
+          docker ps | grep ${{ env.CONTAINER_NAME }}
+          docker logs --tail 10 ${{ env.CONTAINER_NAME }}
+        EOF

.gitea/workflows/deploy.yml

@@ -4,8 +4,14 @@ name: Build and Deploy JobMaker
 on:
   push:
     branches: [ main ]
+    paths-ignore:
+      - 'n8ngo/**'
+      - 'kvmote/**'
   pull_request:
     branches: [ main ]
+    paths-ignore:
+      - 'n8ngo/**'
+      - 'kvmote/**'
 
 env:
   REGISTRY: registry.redecarneir.us

.gitignore

@@ -0,0 +1 @@
+/.claude

kvmote/Dockerfile

@@ -0,0 +1,12 @@
+FROM nginx:alpine
+
+RUN rm /etc/nginx/conf.d/default.conf
+
+COPY nginx.conf /etc/nginx/conf.d/default.conf
+COPY index.html /usr/share/nginx/html/index.html
+COPY quadrinhos_kvmote.png /usr/share/nginx/html/quadrinhos_kvmote.png
+
+EXPOSE 80
+
+HEALTHCHECK --interval=30s --timeout=5s --start-period=10s --retries=3 \
+  CMD wget -qO- http://localhost/ || exit 1

kvmote/index.html

@@ -0,0 +1,807 @@
+<!DOCTYPE html>
+<html lang="pt-BR">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>KVMote — Dois PCs, Um Teclado, Zero Bagunça</title>
+    <style>
+        :root {
+            --dark:    #0d1117;
+            --dark-2:  #161b22;
+            --blue:    #1e40af;
+            --blue-hi: #3b82f6;
+            --yellow:  #f59e0b;
+            --yellow-l:#fcd34d;
+            --white:   #f0f6fc;
+            --ink:     #000000;
+        }
+
+        * { margin: 0; padding: 0; box-sizing: border-box; }
+
+        body {
+            background: var(--dark);
+            color: var(--white);
+            font-family: 'Segoe UI', system-ui, -apple-system, sans-serif;
+            overflow-x: hidden;
+        }
+
+        /* ─── UTILITY ─── */
+        .ink-box {
+            border: 3px solid var(--ink);
+            box-shadow: 5px 5px 0 var(--ink);
+        }
+
+        /* ─── HERO ─── */
+        .hero {
+            min-height: 100vh;
+            background: linear-gradient(135deg, #050810 0%, #0d1f4a 45%, #050810 100%);
+            display: grid;
+            grid-template-columns: 1fr 1fr;
+            align-items: center;
+            gap: 3rem;
+            padding: 5rem 8% 4rem;
+            position: relative;
+            overflow: hidden;
+        }
+
+        /* dot-grid texture */
+        .hero::before {
+            content: '';
+            position: absolute;
+            inset: 0;
+            background-image: radial-gradient(circle, rgba(255,255,255,0.07) 1px, transparent 1px);
+            background-size: 28px 28px;
+            pointer-events: none;
+        }
+
+        /* speed-lines top-right */
+        .hero::after {
+            content: '';
+            position: absolute;
+            top: -60px;
+            right: -60px;
+            width: 340px;
+            height: 340px;
+            background: conic-gradient(
+                from 200deg,
+                transparent 0deg,
+                rgba(245,158,11,0.08) 2deg,
+                transparent 4deg,
+                transparent 8deg,
+                rgba(245,158,11,0.06) 10deg,
+                transparent 12deg
+            );
+            border-radius: 50%;
+            pointer-events: none;
+        }
+
+        .hero-text { position: relative; z-index: 1; }
+
+        .hero-badge {
+            display: inline-block;
+            background: var(--yellow);
+            color: var(--ink);
+            font-weight: 900;
+            font-size: 0.7rem;
+            letter-spacing: 3px;
+            text-transform: uppercase;
+            padding: 0.3rem 0.9rem;
+            border: 2px solid var(--ink);
+            box-shadow: 3px 3px 0 var(--ink);
+            margin-bottom: 1.6rem;
+        }
+
+        .hero h1 {
+            font-size: clamp(2.4rem, 4.5vw, 3.8rem);
+            font-weight: 900;
+            line-height: 1.1;
+            color: var(--white);
+            text-shadow: 4px 4px 0 var(--ink);
+            margin-bottom: 1.4rem;
+        }
+
+        .hero h1 em {
+            font-style: normal;
+            color: var(--yellow);
+        }
+
+        .hero-sub {
+            font-size: 1.05rem;
+            color: #94a3b8;
+            line-height: 1.7;
+            max-width: 460px;
+            margin-bottom: 2.2rem;
+        }
+
+        .hero-cta {
+            display: inline-block;
+            background: var(--yellow);
+            color: var(--ink);
+            font-weight: 900;
+            font-size: 1rem;
+            padding: 0.9rem 2rem;
+            border: 3px solid var(--ink);
+            box-shadow: 6px 6px 0 var(--ink);
+            text-decoration: none;
+            transition: transform 0.1s, box-shadow 0.1s;
+            letter-spacing: 0.5px;
+        }
+
+        .hero-cta:hover {
+            transform: translate(-2px, -2px);
+            box-shadow: 8px 8px 0 var(--ink);
+        }
+
+        .hero-image-wrap {
+            position: relative;
+            z-index: 1;
+            display: flex;
+            justify-content: center;
+        }
+
+        .hero-image-wrap img {
+            width: 100%;
+            max-width: 500px;
+            border: 4px solid var(--ink);
+            box-shadow: 10px 10px 0 var(--ink), 0 0 60px rgba(59,130,246,0.2);
+            display: block;
+        }
+
+        /* corner label on the comic */
+        .comic-label {
+            position: absolute;
+            top: -14px;
+            left: 20px;
+            background: var(--yellow);
+            color: var(--ink);
+            font-size: 0.7rem;
+            font-weight: 900;
+            text-transform: uppercase;
+            letter-spacing: 2px;
+            padding: 0.2rem 0.6rem;
+            border: 2px solid var(--ink);
+        }
+
+        /* ─── YELLOW STRIP ─── */
+        .strip {
+            background: var(--yellow);
+            border-top: 3px solid var(--ink);
+            border-bottom: 3px solid var(--ink);
+            padding: 0.9rem 0;
+            overflow: hidden;
+            white-space: nowrap;
+        }
+
+        .strip-track {
+            display: inline-flex;
+            gap: 3rem;
+            animation: scroll-strip 22s linear infinite;
+        }
+
+        .strip-track span {
+            font-weight: 900;
+            color: var(--ink);
+            font-size: 0.9rem;
+            display: inline-flex;
+            align-items: center;
+            gap: 0.4rem;
+        }
+
+        @keyframes scroll-strip {
+            from { transform: translateX(0); }
+            to   { transform: translateX(-50%); }
+        }
+
+        /* ─── FEATURES ─── */
+        .features {
+            padding: 5rem 8%;
+            background: var(--dark-2);
+        }
+
+        .section-label {
+            text-align: center;
+            margin-bottom: 0.6rem;
+        }
+
+        .section-label span {
+            display: inline-block;
+            background: var(--blue);
+            color: #fff;
+            font-size: 0.7rem;
+            font-weight: 900;
+            letter-spacing: 3px;
+            text-transform: uppercase;
+            padding: 0.25rem 0.8rem;
+            border: 2px solid var(--ink);
+        }
+
+        .section-title {
+            font-size: clamp(1.6rem, 3vw, 2.2rem);
+            font-weight: 900;
+            text-align: center;
+            color: var(--white);
+            text-shadow: 3px 3px 0 var(--ink);
+            margin-bottom: 3rem;
+        }
+
+        .section-title em {
+            font-style: normal;
+            color: var(--yellow);
+        }
+
+        .features-grid {
+            display: grid;
+            grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
+            gap: 1.5rem;
+            max-width: 1000px;
+            margin: 0 auto;
+        }
+
+        .feature-card {
+            background: var(--dark);
+            border: 3px solid var(--ink);
+            box-shadow: 5px 5px 0 var(--ink);
+            padding: 1.6rem;
+            transition: transform 0.15s, box-shadow 0.15s;
+        }
+
+        .feature-card:hover {
+            transform: translate(-2px, -2px);
+            box-shadow: 7px 7px 0 var(--ink);
+        }
+
+        .feature-icon { font-size: 2.2rem; margin-bottom: 0.9rem; }
+
+        .feature-card h3 {
+            font-size: 1rem;
+            font-weight: 900;
+            color: var(--yellow);
+            margin-bottom: 0.5rem;
+        }
+
+        .feature-card p {
+            font-size: 0.88rem;
+            color: #94a3b8;
+            line-height: 1.6;
+        }
+
+        /* ─── HOW IT WORKS ─── */
+        .how {
+            padding: 5rem 8%;
+            background: var(--dark);
+        }
+
+        .steps {
+            display: grid;
+            grid-template-columns: 1fr auto 1fr auto 1fr;
+            align-items: start;
+            gap: 1rem;
+            max-width: 860px;
+            margin: 0 auto;
+        }
+
+        .step { text-align: center; }
+
+        .step-num {
+            width: 58px;
+            height: 58px;
+            background: var(--blue);
+            border: 3px solid var(--ink);
+            box-shadow: 4px 4px 0 var(--ink);
+            border-radius: 50%;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            font-size: 1.4rem;
+            font-weight: 900;
+            margin: 0 auto 1rem;
+        }
+
+        .step h3 {
+            font-weight: 900;
+            font-size: 0.95rem;
+            margin-bottom: 0.4rem;
+            color: var(--white);
+        }
+
+        .step p {
+            font-size: 0.85rem;
+            color: #94a3b8;
+            line-height: 1.5;
+        }
+
+        .step-arrow {
+            font-size: 1.8rem;
+            color: var(--yellow);
+            font-weight: 900;
+            padding-top: 1rem;
+            align-self: center;
+        }
+
+        /* ─── PRICING ─── */
+        .pricing {
+            padding: 5rem 8%;
+            background: var(--dark-2);
+        }
+
+        .pricing-inner {
+            max-width: 680px;
+            margin: 0 auto;
+            text-align: center;
+        }
+
+        .pricing-card {
+            background: var(--dark);
+            border: 3px solid var(--ink);
+            box-shadow: 8px 8px 0 var(--ink);
+            padding: 2.5rem;
+            margin-top: 2rem;
+            text-align: left;
+        }
+
+        .price-tag {
+            font-size: 2.8rem;
+            font-weight: 900;
+            color: var(--yellow);
+            text-shadow: 3px 3px 0 var(--ink);
+            line-height: 1;
+        }
+
+        .price-sub {
+            color: #94a3b8;
+            font-size: 0.9rem;
+            margin-top: 0.4rem;
+            margin-bottom: 1.8rem;
+            padding-bottom: 1.5rem;
+            border-bottom: 2px dashed #334155;
+        }
+
+        .price-items {
+            display: flex;
+            flex-direction: column;
+            gap: 0.8rem;
+        }
+
+        .price-item {
+            display: flex;
+            align-items: center;
+            gap: 0.75rem;
+            font-size: 0.92rem;
+        }
+
+        .check {
+            color: var(--yellow);
+            font-size: 1.1rem;
+            font-weight: 900;
+            flex-shrink: 0;
+        }
+
+        .price-note {
+            margin-top: 1.5rem;
+            padding-top: 1.2rem;
+            border-top: 2px dashed #334155;
+            font-size: 0.82rem;
+            color: #64748b;
+            text-align: center;
+        }
+
+        /* ─── HID CALLOUT ─── */
+        .hid-callout {
+            background: var(--dark);
+            padding: 4rem 8%;
+            border-bottom: 3px solid var(--ink);
+        }
+
+        .hid-inner {
+            max-width: 860px;
+            margin: 0 auto;
+            display: grid;
+            grid-template-columns: auto 1fr;
+            gap: 2rem;
+            align-items: center;
+            background: linear-gradient(135deg, #0f2a5c, #1e3a8a);
+            border: 3px solid var(--ink);
+            box-shadow: 7px 7px 0 var(--ink);
+            padding: 2.5rem;
+        }
+
+        .hid-icon-wrap {
+            display: flex;
+            flex-direction: column;
+            align-items: center;
+            gap: 0.5rem;
+        }
+
+        .hid-icon {
+            font-size: 4rem;
+            line-height: 1;
+        }
+
+        .hid-tag {
+            background: var(--yellow);
+            color: var(--ink);
+            font-size: 0.6rem;
+            font-weight: 900;
+            letter-spacing: 2px;
+            text-transform: uppercase;
+            padding: 0.15rem 0.5rem;
+            border: 2px solid var(--ink);
+            white-space: nowrap;
+        }
+
+        .hid-text h3 {
+            font-size: 1.3rem;
+            font-weight: 900;
+            color: var(--white);
+            margin-bottom: 0.6rem;
+            text-shadow: 2px 2px 0 var(--ink);
+        }
+
+        .hid-text h3 em {
+            font-style: normal;
+            color: var(--yellow);
+        }
+
+        .hid-text p {
+            color: #93c5fd;
+            font-size: 0.92rem;
+            line-height: 1.65;
+        }
+
+        .hid-text p strong {
+            color: var(--white);
+        }
+
+        /* ─── RAFFLE ─── */
+        .raffle {
+            padding: 5rem 8%;
+            background: var(--dark);
+            border-top: 3px solid var(--ink);
+        }
+
+        .raffle-inner {
+            max-width: 760px;
+            margin: 0 auto;
+            text-align: center;
+        }
+
+        .raffle-card {
+            background: linear-gradient(135deg, #1c0a00, #3b1700);
+            border: 3px solid var(--ink);
+            box-shadow: 8px 8px 0 var(--ink);
+            padding: 3rem 2.5rem;
+            position: relative;
+            overflow: hidden;
+        }
+
+        /* confetti dots */
+        .raffle-card::before {
+            content: '';
+            position: absolute;
+            inset: 0;
+            background-image:
+                radial-gradient(circle, rgba(245,158,11,0.15) 2px, transparent 2px),
+                radial-gradient(circle, rgba(255,255,255,0.06) 1px, transparent 1px);
+            background-size: 40px 40px, 20px 20px;
+            background-position: 0 0, 10px 10px;
+            pointer-events: none;
+        }
+
+        .raffle-emoji {
+            font-size: 3.5rem;
+            margin-bottom: 1rem;
+            position: relative;
+        }
+
+        .raffle-card h3 {
+            font-size: clamp(1.5rem, 3vw, 2rem);
+            font-weight: 900;
+            color: var(--yellow);
+            text-shadow: 3px 3px 0 var(--ink);
+            margin-bottom: 0.8rem;
+            position: relative;
+        }
+
+        .raffle-card p {
+            color: #d97706;
+            font-size: 0.95rem;
+            line-height: 1.7;
+            max-width: 520px;
+            margin: 0 auto 1.8rem;
+            position: relative;
+        }
+
+        .raffle-card p strong {
+            color: var(--yellow-l);
+        }
+
+        .raffle-badges {
+            display: flex;
+            justify-content: center;
+            gap: 1rem;
+            flex-wrap: wrap;
+            position: relative;
+        }
+
+        .raffle-badge {
+            background: var(--yellow);
+            color: var(--ink);
+            font-weight: 900;
+            font-size: 0.8rem;
+            padding: 0.4rem 1rem;
+            border: 2px solid var(--ink);
+            box-shadow: 3px 3px 0 var(--ink);
+            letter-spacing: 0.5px;
+        }
+
+        /* ─── FORM SECTION ─── */
+        .form-section {
+            padding: 5rem 8%;
+            background: #f1f5f9;
+            border-top: 4px solid var(--ink);
+            border-bottom: 4px solid var(--ink);
+        }
+
+        .form-header {
+            text-align: center;
+            margin-bottom: 2.5rem;
+        }
+
+        .form-header h2 {
+            font-size: clamp(1.6rem, 3vw, 2.2rem);
+            font-weight: 900;
+            color: #0d1117;
+            text-shadow: 3px 3px 0 rgba(0,0,0,0.12);
+            margin-bottom: 0.5rem;
+        }
+
+        .form-header h2 em {
+            font-style: normal;
+            color: #1e40af;
+        }
+
+        .form-header p {
+            color: #475569;
+            font-size: 0.95rem;
+        }
+
+        .form-wrap {
+            max-width: 680px;
+            margin: 0 auto;
+            background: #ffffff;
+            border: 3px solid var(--ink);
+            box-shadow: 8px 8px 0 var(--ink);
+            padding: 2rem 2.5rem;
+        }
+
+        /* ─── FOOTER ─── */
+        footer {
+            background: #000;
+            padding: 1.8rem 8%;
+            text-align: center;
+            font-size: 0.83rem;
+            color: #6b7280;
+            border-top: 3px solid var(--yellow);
+        }
+
+        footer strong { color: var(--yellow); }
+
+        /* ─── RESPONSIVE ─── */
+        @media (max-width: 820px) {
+            .hero {
+                grid-template-columns: 1fr;
+                text-align: center;
+                padding: 4rem 6% 3rem;
+                gap: 2rem;
+            }
+            .hero-sub { margin: 0 auto 2rem; }
+            .hero-image-wrap { order: -1; }
+            .hero-image-wrap img { max-width: 340px; }
+
+            .steps {
+                grid-template-columns: 1fr;
+                gap: 2rem;
+            }
+            .step-arrow { display: none; }
+
+            .form-wrap { padding: 1.5rem; }
+
+            .hid-inner {
+                grid-template-columns: 1fr;
+                text-align: center;
+            }
+        }
+    </style>
+</head>
+<body>
+
+<!-- ══════════ HERO ══════════ -->
+<section class="hero">
+    <div class="hero-text">
+        <div class="hero-badge">⚡ Early Access — Hardware + Software</div>
+        <h1>Dois PCs.<br>Um teclado.<br><em>Zero bagunça.</em></h1>
+        <p class="hero-sub">
+            KVMote deixa você controlar dois computadores com o mesmo teclado e mouse — sem software no PC cliente, sem assinatura, sem fio entre as máquinas.
+        </p>
+        <a href="#form" class="hero-cta">Quero ser notificado quando lançar →</a>
+    </div>
+
+    <div class="hero-image-wrap">
+        <span class="comic-label">A história do KVMote</span>
+        <img src="quadrinhos_kvmote.png" alt="Quadrinho: O problema, a solução, a conexão e o fluxo do KVMote">
+    </div>
+</section>
+
+<!-- ══════════ STRIP ══════════ -->
+<div class="strip">
+    <div class="strip-track">
+        <span>🔌 Plug &amp; Play — sem drivers</span>
+        <span>📡 Sem fio via BLE</span>
+        <span>⌨️ Teclado + Mouse + Clipboard</span>
+        <span>🚫 Zero software no PC cliente</span>
+        <span>💳 Pagamento único — sem assinatura</span>
+        <span>🔒 Funciona em PCs corporativos</span>
+        <!-- duplicado para loop contínuo -->
+        <span>🔌 Plug &amp; Play — sem drivers</span>
+        <span>📡 Sem fio via BLE</span>
+        <span>⌨️ Teclado + Mouse + Clipboard</span>
+        <span>🚫 Zero software no PC cliente</span>
+        <span>💳 Pagamento único — sem assinatura</span>
+        <span>🔒 Funciona em PCs corporativos</span>
+    </div>
+</div>
+
+<!-- ══════════ HID CALLOUT ══════════ -->
+<section class="hid-callout">
+    <div class="hid-inner">
+        <div class="hid-icon-wrap">
+            <div class="hid-icon">⌨️</div>
+            <div class="hid-tag">USB HID</div>
+        </div>
+        <div class="hid-text">
+            <h3>O PC que você quer controlar te vê como um <em>teclado e mouse normais</em></h3>
+            <p>
+                O KVMote aparece para o Windows como um periférico USB padrão — <strong>sem alertas de segurança, sem driver para instalar, sem aprovação do TI.</strong>
+                Funciona em qualquer PC: corporativo bloqueado, notebook pessoal, máquina de trabalho remoto.
+                Para o sistema operacional, é só mais um teclado plugado.
+            </p>
+        </div>
+    </div>
+</section>
+
+<!-- ══════════ FEATURES ══════════ -->
+<section class="features">
+    <div class="section-label"><span>Por que o KVMote?</span></div>
+    <h2 class="section-title">Diferente de tudo que você <em>já usou</em></h2>
+    <div class="features-grid">
+        <div class="feature-card">
+            <div class="feature-icon">🔒</div>
+            <h3>Zero software no cliente</h3>
+            <p>O PC cliente enxerga apenas um teclado + mouse USB padrão. Funciona em Windows corporativo bloqueado, sem instalar nada.</p>
+        </div>
+        <div class="feature-card">
+            <div class="feature-icon">📡</div>
+            <h3>Sem fio de verdade</h3>
+            <p>Comunicação por BLE (Bluetooth Low Energy). Sem cabos entre os PCs, sem configuração de rede, sem IP.</p>
+        </div>
+        <div class="feature-card">
+            <div class="feature-icon">📋</div>
+            <h3>Clipboard compartilhado</h3>
+            <p>Copie no host, cole no cliente com Ctrl+V. Suporte a PT-BR com acentos e múltiplos layouts de teclado.</p>
+        </div>
+        <div class="feature-card">
+            <div class="feature-icon">⚡</div>
+            <h3>Hardware compacto</h3>
+            <p>Dispositivo pequeno e discreto baseado em ESP32-S3. Sem drivers proprietários, sem dongles extras.</p>
+        </div>
+    </div>
+</section>
+
+<!-- ══════════ HOW IT WORKS ══════════ -->
+<section class="how">
+    <div class="section-label"><span>Como funciona</span></div>
+    <h2 class="section-title">Três passos e você está <em>no controle</em></h2>
+    <div class="steps">
+        <div class="step">
+            <div class="step-num">1</div>
+            <h3>Conecte o hardware</h3>
+            <p>Plugue o dispositivo KVMote na porta USB do PC cliente. Nenhum driver necessário.</p>
+        </div>
+        <div class="step-arrow">→</div>
+        <div class="step">
+            <div class="step-num">2</div>
+            <h3>Abra o app no host</h3>
+            <p>Execute o KVMote.exe no seu PC principal. Detecção automática via BLE — sem parear manualmente.</p>
+        </div>
+        <div class="step-arrow">→</div>
+        <div class="step">
+            <div class="step-num">3</div>
+            <h3>Leve o cursor à borda</h3>
+            <p>Empurre o mouse para a borda configurada e o controle migra para o outro PC. Simples assim.</p>
+        </div>
+    </div>
+</section>
+
+<!-- ══════════ PRICING ══════════ -->
+<section class="pricing">
+    <div class="pricing-inner">
+        <div class="section-label"><span>Previsão de preço</span></div>
+        <h2 class="section-title">Hardware + Software,<br><em>pagamento único</em></h2>
+        <div class="pricing-card">
+            <div class="price-tag">R$ 189 – 299</div>
+            <div class="price-sub">Preço único · sem assinatura · sem mensalidade</div>
+            <div class="price-items">
+                <div class="price-item"><span class="check">✦</span> Hardware ESP32-S3 pronto para uso</div>
+                <div class="price-item"><span class="check">✦</span> Aplicativo KVMote para Windows (incluso)</div>
+                <div class="price-item"><span class="check">✦</span> Controle de teclado, mouse e clipboard</div>
+                <div class="price-item"><span class="check">✦</span> Suporte a PT-BR ABNT2 e US International</div>
+                <div class="price-item"><span class="check">✦</span> Atualizações de firmware e software incluídas</div>
+            </div>
+            <p class="price-note">
+                O preço final depende do feedback de vocês. Responda o formulário abaixo e ajude a definir.
+            </p>
+        </div>
+    </div>
+</section>
+
+<!-- ══════════ RAFFLE ══════════ -->
+<section class="raffle">
+    <div class="raffle-inner">
+        <div class="raffle-card">
+            <div class="raffle-emoji">🎁</div>
+            <h3>Sorteio de 2 dispositivos KVMote</h3>
+            <p>
+                Se validarmos que o produto vale a pena para vocês, vamos sortear
+                <strong>2 unidades do hardware KVMote</strong> entre todos que se inscreverem com um email válido.
+                Sem pegadinha. Quem se inscrever no formulário abaixo já está participando.
+            </p>
+            <div class="raffle-badges">
+                <div class="raffle-badge">🎯 2 unidades sorteadas</div>
+                <div class="raffle-badge">📧 Basta ter email válido</div>
+                <div class="raffle-badge">✅ Inscrição = participação</div>
+            </div>
+        </div>
+    </div>
+</section>
+
+<!-- ══════════ FORM ══════════ -->
+<section class="form-section" id="form">
+    <div class="form-header">
+        <h2>Inscreva-se e <em>concorra!</em></h2>
+        <p>Preencha abaixo para participar do sorteio e nos ajudar a definir o produto. Leva menos de 1 minuto.</p>
+    </div>
+    <div class="form-wrap">
+        <iframe
+            data-tally-src="https://tally.so/embed/44vbdO?alignLeft=1&hideTitle=1&transparentBackground=1&dynamicHeight=1"
+            loading="lazy"
+            width="100%"
+            height="721"
+            frameborder="0"
+            marginheight="0"
+            marginwidth="0"
+            title="KVMote">
+        </iframe>
+        <script>
+            var d = document, w = "https://tally.so/widgets/embed.js",
+            v = function () {
+                "undefined" != typeof Tally
+                    ? Tally.loadEmbeds()
+                    : d.querySelectorAll("iframe[data-tally-src]:not([src])").forEach(function (e) { e.src = e.dataset.tallySrc; });
+            };
+            if ("undefined" != typeof Tally) v();
+            else if (d.querySelector('script[src="' + w + '"]') == null) {
+                var s = d.createElement("script");
+                s.src = w; s.onload = v; s.onerror = v;
+                d.body.appendChild(s);
+            }
+        </script>
+    </div>
+</section>
+
+<!-- ══════════ FOOTER ══════════ -->
+<footer>
+    <strong>KVMote</strong> — KVM over Bluetooth · Projeto independente · Em desenvolvimento
+</footer>
+
+</body>
+</html>

kvmote/nginx.conf

@@ -0,0 +1,19 @@
+server {
+    listen 80;
+    server_name _;
+    root /usr/share/nginx/html;
+    index index.html;
+
+    gzip on;
+    gzip_types text/html text/css application/javascript image/png;
+    gzip_min_length 256;
+
+    location ~* \.(css|js|png|jpg|svg|ico|woff2?)$ {
+        expires 30d;
+        add_header Cache-Control "public, immutable";
+    }
+
+    location / {
+        try_files $uri $uri/ /index.html;
+    }
+}

n8ngo/Dockerfile

@@ -0,0 +1,12 @@
+FROM nginx:alpine
+
+RUN rm /etc/nginx/conf.d/default.conf
+
+COPY nginx.conf /etc/nginx/conf.d/default.conf
+COPY index.html /usr/share/nginx/html/index.html
+COPY style.css  /usr/share/nginx/html/style.css
+
+EXPOSE 80
+
+HEALTHCHECK --interval=30s --timeout=5s --start-period=10s --retries=3 \
+  CMD wget -qO- http://localhost/ || exit 1

n8ngo/index.html

@@ -0,0 +1,471 @@
+<!DOCTYPE html>
+<html lang="pt-BR">
+<head>
+  <meta charset="UTF-8" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+  <title>n8ngo — Hospedagem Managed de n8n</title>
+  <meta name="description" content="Seu n8n no ar em 60 segundos. Hospedagem managed com subdomínio próprio, backup automático e monitoramento 24/7. Você cria os fluxos, nós cuidamos do resto." />
+
+  <!-- Open Graph -->
+  <meta property="og:title" content="n8ngo — Hospedagem Managed de n8n" />
+  <meta property="og:description" content="Seu n8n no ar em 60 segundos. Subdomínio, backup e monitoramento inclusos." />
+  <meta property="og:type" content="website" />
+
+  <link rel="icon" type="image/svg+xml" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><rect width='32' height='32' rx='8' fill='%230f172a'/><text x='4' y='24' font-size='22' font-family='monospace' font-weight='bold' fill='%2310b981'>n</text></svg>" />
+
+  <link rel="preconnect" href="https://fonts.googleapis.com" />
+  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
+  <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;500&display=swap" rel="stylesheet" />
+
+  <link rel="stylesheet" href="style.css" />
+</head>
+<body>
+
+<!-- ══════════════════════════════════════════
+     NAV
+══════════════════════════════════════════ -->
+<nav class="nav" role="navigation" aria-label="Navegação principal">
+  <div class="container nav-inner">
+    <a href="#" class="nav-logo" aria-label="n8ngo início">n8n<span>go</span></a>
+    <a href="#precadastro" class="nav-cta">
+      Quero meu n8n →
+    </a>
+  </div>
+</nav>
+
+<!-- ══════════════════════════════════════════
+     HERO
+══════════════════════════════════════════ -->
+<section class="hero" aria-labelledby="hero-title">
+  <div class="container">
+
+    <div class="promo-banner fade-in" role="alert" aria-live="polite">
+      <span class="promo-fire" aria-hidden="true">🎁</span>
+      <span>
+        <strong>Promoção de lançamento:</strong>
+        os <strong>10 primeiros</strong> cadastros completos ganham
+        <strong>6 meses grátis</strong> no plano básico.
+      </span>
+      <a href="#precadastro" class="promo-cta-link">Garantir vaga →</a>
+    </div>
+
+    <div class="hero-eyebrow fade-in">
+      <span class="dot" aria-hidden="true"></span>
+      Em fase de validação — vagas limitadas
+    </div>
+
+    <h1 class="hero-title fade-in" id="hero-title">
+      Seu n8n no ar em<br class="br-desktop" />
+      <span class="highlight">60 segundos</span>
+    </h1>
+
+    <p class="hero-sub fade-in">
+      Hospedagem managed de n8n com backup automático, monitoramento 24/7
+      e subdomínio pronto. Você cria os fluxos, nós cuidamos do resto.
+    </p>
+
+    <div class="hero-actions fade-in">
+      <a href="#precadastro" class="btn-primary">
+        Quero meu n8n agora
+      </a>
+      <a href="#como-funciona" class="btn-secondary">
+        Como funciona ↓
+      </a>
+    </div>
+
+    <div class="fade-in">
+      <div class="hero-domain" aria-label="Exemplo de subdomínio: seudominio.n8ngo.host">
+        <span class="lock-icon" aria-hidden="true">🔒</span>
+        <span class="domain-part">seudominio</span><span>.n8ngo.host</span>
+      </div>
+    </div>
+
+  </div>
+</section>
+
+<!-- ══════════════════════════════════════════
+     COMO FUNCIONA
+══════════════════════════════════════════ -->
+<section class="section how" id="como-funciona" aria-labelledby="how-title">
+  <div class="container">
+
+    <span class="section-label fade-in">Como funciona</span>
+    <h2 class="section-title fade-in" id="how-title">Simples assim</h2>
+    <p class="section-sub fade-in">
+      Do zero ao n8n rodando em produção em três passos. Sem linha de comando, sem dor de cabeça.
+    </p>
+
+    <div class="how-grid" role="list">
+
+      <article class="step-card fade-in" role="listitem">
+        <div class="step-number" aria-label="Passo 1">1</div>
+        <h3 class="step-title">Escolha seu nome</h3>
+        <p class="step-desc">
+          Indique o subdomínio que quer usar — por exemplo,
+          <strong>minha-empresa</strong>.n8ngo.host.
+          É o seu espaço, com sua identidade.
+        </p>
+      </article>
+
+      <article class="step-card fade-in" role="listitem">
+        <div class="step-number" aria-label="Passo 2">2</div>
+        <h3 class="step-title">Nós configuramos tudo</h3>
+        <p class="step-desc">
+          Subimos o n8n, configuramos banco de dados, SSL, DNS, Uptime Kuma
+          e os backups automáticos. Você não precisa tocar em nada.
+        </p>
+      </article>
+
+      <article class="step-card fade-in" role="listitem">
+        <div class="step-number" aria-label="Passo 3">3</div>
+        <h3 class="step-title">Comece a automatizar</h3>
+        <p class="step-desc">
+          Acesse seu painel n8n, crie seus fluxos e deixe a automação
+          trabalhar por você. 24 horas por dia, 7 dias por semana.
+        </p>
+      </article>
+
+    </div>
+  </div>
+</section>
+
+<!-- ══════════════════════════════════════════
+     O QUE ESTÁ INCLUSO
+══════════════════════════════════════════ -->
+<section class="section" id="incluso" aria-labelledby="incluso-title">
+  <div class="container">
+
+    <span class="section-label fade-in">O que está incluso</span>
+    <h2 class="section-title fade-in" id="incluso-title">Tudo que você precisa.<br />Nada que você não precisa.</h2>
+    <p class="section-sub fade-in">
+      Cada instância n8ngo vem com uma stack completa pronta para produção.
+    </p>
+
+    <div class="features-grid" role="list">
+
+      <article class="feature-card fade-in" role="listitem">
+        <div class="feature-icon" aria-hidden="true">🚀</div>
+        <div class="feature-body">
+          <h3>n8n pronto pra uso</h3>
+          <p>Última versão estável do n8n, configurado e otimizado para performance. Atualizações gerenciadas por nós.</p>
+        </div>
+      </article>
+
+      <article class="feature-card fade-in" role="listitem">
+        <div class="feature-icon" aria-hidden="true">🌐</div>
+        <div class="feature-body">
+          <h3>Subdomínio exclusivo</h3>
+          <p><em>seudominio</em>.n8ngo.host com SSL/TLS configurado. Agências podem ter sub-subdomínios para cada cliente.</p>
+        </div>
+      </article>
+
+      <article class="feature-card fade-in" role="listitem">
+        <div class="feature-icon" aria-hidden="true">💾</div>
+        <div class="feature-body">
+          <h3>Backup automático</h3>
+          <p>Backup diário dos fluxos + backup completo semanal. Painel de acesso para restauração quando precisar.</p>
+        </div>
+      </article>
+
+      <article class="feature-card fade-in" role="listitem">
+        <div class="feature-icon" aria-hidden="true">📊</div>
+        <div class="feature-body">
+          <h3>Monitoramento 24/7</h3>
+          <p>Uptime Kuma integrado monitorando sua instância continuamente. Alertas por email em caso de queda.</p>
+        </div>
+      </article>
+
+      <article class="feature-card fade-in" role="listitem">
+        <div class="feature-icon" aria-hidden="true">🏢</div>
+        <div class="feature-body">
+          <h3>Modelo Agência</h3>
+          <p>Gerencie múltiplos clientes com sub-subdomínios dedicados: <em>cliente.agencia</em>.n8ngo.host.</p>
+        </div>
+      </article>
+
+      <article class="feature-card fade-in" role="listitem">
+        <div class="feature-icon" aria-hidden="true">🔒</div>
+        <div class="feature-body">
+          <h3>Dados no Brasil</h3>
+          <p>Servidores em São Paulo. Conformidade com a LGPD. Seus dados e os dos seus clientes ficam aqui.</p>
+        </div>
+      </article>
+
+    </div>
+  </div>
+</section>
+
+<!-- ══════════════════════════════════════════
+     COMPARAÇÃO
+══════════════════════════════════════════ -->
+<section class="section comparison" id="comparacao" aria-labelledby="comparacao-title">
+  <div class="container">
+
+    <span class="section-label fade-in">Comparação</span>
+    <h2 class="section-title fade-in" id="comparacao-title">n8ngo vs as outras opções</h2>
+    <p class="section-sub fade-in">
+      Você pode configurar tudo sozinho. Mas será que faz sentido?
+    </p>
+
+    <div class="table-wrapper fade-in">
+      <table aria-label="Comparação entre opções de hospedagem de n8n">
+        <thead>
+          <tr>
+            <th scope="col">Recurso</th>
+            <th scope="col">VPS + n8n manual</th>
+            <th scope="col">n8n Cloud</th>
+            <th scope="col" class="col-highlight">n8ngo</th>
+          </tr>
+        </thead>
+        <tbody>
+          <tr>
+            <td>Setup inicial</td>
+            <td>Você configura tudo</td>
+            <td>Automático</td>
+            <td class="col-highlight">Automático</td>
+          </tr>
+          <tr>
+            <td>Subdomínio próprio</td>
+            <td class="partial">Você configura DNS</td>
+            <td><span class="cross" aria-label="Não disponível">✕ Não disponível</span></td>
+            <td class="col-highlight"><span class="check" aria-label="Incluso">✓ Incluso</span></td>
+          </tr>
+          <tr>
+            <td>Backup de fluxos</td>
+            <td class="partial">Você configura</td>
+            <td class="partial">Limitado</td>
+            <td class="col-highlight"><span class="check" aria-label="Diário + semanal">✓ Diário + semanal</span></td>
+          </tr>
+          <tr>
+            <td>Monitoramento</td>
+            <td class="partial">Você instala</td>
+            <td class="partial">Básico</td>
+            <td class="col-highlight"><span class="check" aria-label="Uptime Kuma integrado">✓ Uptime Kuma integrado</span></td>
+          </tr>
+          <tr>
+            <td>Alertas de queda</td>
+            <td class="partial">Você configura</td>
+            <td class="partial">Email</td>
+            <td class="col-highlight"><span class="check" aria-label="Email automático">✓ Email automático</span></td>
+          </tr>
+          <tr>
+            <td>Modelo Agência</td>
+            <td><span class="cross" aria-label="Não">✕ Não</span></td>
+            <td><span class="cross" aria-label="Não">✕ Não</span></td>
+            <td class="col-highlight"><span class="check" aria-label="Sub-subdomínios">✓ Sub-subdomínios</span></td>
+          </tr>
+          <tr>
+            <td>Execuções</td>
+            <td>Ilimitadas</td>
+            <td class="partial">Por plano</td>
+            <td class="col-highlight"><span class="check" aria-label="Ilimitadas">✓ Ilimitadas</span></td>
+          </tr>
+          <tr>
+            <td>Dados no Brasil</td>
+            <td class="partial">Depende do servidor</td>
+            <td><span class="cross" aria-label="Não">✕ Não</span></td>
+            <td class="col-highlight"><span class="check" aria-label="São Paulo, LGPD">✓ São Paulo, LGPD</span></td>
+          </tr>
+          <tr>
+            <td>Preço</td>
+            <td>R$20–80/mês + seu tempo</td>
+            <td>A partir de €24/mês</td>
+            <td class="col-highlight">A definir*</td>
+          </tr>
+        </tbody>
+      </table>
+    </div>
+    <p style="margin-top:0.75rem; font-size:0.8125rem; color:var(--text-muted);">
+      * Estamos em fase de validação. Você pode influenciar o preço final no formulário de pré-cadastro.
+    </p>
+
+  </div>
+</section>
+
+<!-- ══════════════════════════════════════════
+     NÃO QUER PAGAR?
+══════════════════════════════════════════ -->
+<section class="section" id="gratis" aria-labelledby="gratis-title">
+  <div class="container">
+
+    <span class="section-label fade-in">Transparência</span>
+    <h2 class="section-title fade-in" id="gratis-title">Não quer pagar? Sem problema.</h2>
+    <p class="section-sub fade-in">
+      O n8n é open source e você pode rodá-lo gratuitamente no seu computador.
+      Aqui está como fazer isso agora mesmo.
+    </p>
+
+    <div class="free-box fade-in">
+      <p>
+        O n8n pertence à n8n GmbH e é distribuído gratuitamente com código aberto.
+        Se você só quer explorar a ferramenta ou automatizar processos locais, não
+        precisa pagar nada — use o Docker e rode em qualquer máquina:
+      </p>
+
+      <ol class="steps-list" aria-label="Passos para rodar o n8n localmente">
+        <li>
+          <span class="step-num" aria-hidden="true">1</span>
+          <span>
+            Instale o
+            <a href="https://docs.docker.com/get-docker/" target="_blank" rel="noopener noreferrer">Docker</a>
+            na sua máquina (Windows, Mac ou Linux — tudo funciona).
+          </span>
+        </li>
+        <li>
+          <span class="step-num" aria-hidden="true">2</span>
+          <span>
+            Abra o terminal e rode:<br />
+            <code class="code-block">docker run -it --rm -p 5678:5678 n8nio/n8n</code>
+          </span>
+        </li>
+        <li>
+          <span class="step-num" aria-hidden="true">3</span>
+          <span>
+            Acesse
+            <code class="code-block">localhost:5678</code>
+            no navegador. Pronto — n8n funcionando.
+          </span>
+        </li>
+        <li>
+          <span class="step-num" aria-hidden="true">4</span>
+          <span>
+            Quando quiser salvar seus fluxos, exporte-os como JSON via
+            <strong>Menu → Download</strong>. É a sua propriedade, leve para onde quiser.
+          </span>
+        </li>
+      </ol>
+
+      <p>
+        Documentação oficial do n8n:
+        <a href="https://docs.n8n.io" target="_blank" rel="noopener noreferrer">docs.n8n.io →</a>
+      </p>
+
+      <p class="tagline">
+        Quando quiser colocar em produção 24/7 com backup automático e monitoramento real,
+        estaremos aqui — sem julgamentos. 😉
+      </p>
+    </div>
+
+  </div>
+</section>
+
+<!-- ══════════════════════════════════════════
+     PRÉ-CADASTRO
+══════════════════════════════════════════ -->
+<section class="section precadastro" id="precadastro" aria-labelledby="form-title">
+  <div class="container">
+
+    <div style="text-align:center;">
+      <span class="section-label fade-in">Pré-cadastro</span>
+      <h2 class="section-title fade-in" id="form-title">Quer ser um dos primeiros?</h2>
+      <p class="section-sub fade-in" style="margin:0 auto;">
+        Estamos em fase de validação. Cadastre-se e ajude a moldar o n8ngo —
+        sua opinião define o preço e as funcionalidades do produto final.
+      </p>
+    </div>
+
+    <div class="promo-form-banner fade-in" role="note">
+      <div class="promo-form-icon" aria-hidden="true">🎁</div>
+      <div>
+        <strong>Promoção de lançamento</strong><br />
+        Os <strong>10 primeiros cadastros validados</strong> ganham 6 meses grátis no plano básico.
+        Para valer, preencha o formulário abaixo e clique em <strong>Submit</strong> — só conta quem
+        concluir o envio pelo Tally. Em até <strong>30 dias</strong> entraremos em contato pelo email
+        informado para confirmar os ganhadores — use um email que você acompanha de verdade.
+      </div>
+    </div>
+
+    <div class="form-wrapper fade-in">
+      <!-- Tally.so embed -->
+      <iframe
+        data-tally-src="https://tally.so/embed/EkDM6X?alignLeft=1&hideTitle=1&dynamicHeight=1"
+        loading="lazy"
+        width="100%"
+        height="782"
+        frameborder="0"
+        marginheight="0"
+        marginwidth="0"
+        title="N8N Go! — Formulário de Pré-cadastro"
+        aria-label="Formulário de pré-cadastro n8ngo"
+      ></iframe>
+    </div>
+
+  </div>
+</section>
+
+<!-- ══════════════════════════════════════════
+     FOOTER
+══════════════════════════════════════════ -->
+<footer class="footer" role="contentinfo">
+  <div class="container footer-inner">
+
+    <div class="footer-logo">
+      n8n<span>go</span> — Hospedagem managed de n8n
+    </div>
+
+    <nav class="footer-links" aria-label="Links do rodapé">
+      <a href="/termos" aria-label="Termos de uso (em breve)">Termos de Uso</a>
+      <a href="/privacidade" aria-label="Política de privacidade (em breve)">Privacidade</a>
+      <a href="mailto:ola@n8ngo.com.br">Contato</a>
+    </nav>
+
+    <p class="footer-disclaimer">
+      n8ngo não é afiliado ao n8n GmbH.
+    </p>
+
+  </div>
+</footer>
+
+<!-- ══════════════════════════════════════════
+     SCRIPTS
+══════════════════════════════════════════ -->
+
+<!-- Tally embed loader -->
+<script>
+  var d = document,
+      w = "https://tally.so/widgets/embed.js",
+      v = function () {
+        if (typeof Tally !== "undefined") {
+          Tally.loadEmbeds();
+        } else {
+          d.querySelectorAll("iframe[data-tally-src]:not([src])").forEach(function (e) {
+            e.src = e.dataset.tallySrc;
+          });
+        }
+      };
+  if (typeof Tally !== "undefined") {
+    v();
+  } else if (d.querySelector('script[src="' + w + '"]') == null) {
+    var s = d.createElement("script");
+    s.src = w;
+    s.onload = v;
+    s.onerror = v;
+    d.body.appendChild(s);
+  }
+</script>
+
+<!-- Fade-in on scroll -->
+<script>
+  (function () {
+    var els = document.querySelectorAll('.fade-in');
+
+    if (!('IntersectionObserver' in window)) {
+      els.forEach(function (el) { el.classList.add('visible'); });
+      return;
+    }
+
+    var observer = new IntersectionObserver(function (entries) {
+      entries.forEach(function (entry) {
+        if (entry.isIntersecting) {
+          entry.target.classList.add('visible');
+          observer.unobserve(entry.target);
+        }
+      });
+    }, { threshold: 0.12, rootMargin: '0px 0px -40px 0px' });
+
+    els.forEach(function (el) { observer.observe(el); });
+  })();
+</script>
+
+</body>
+</html>

n8ngo/nginx.conf

@@ -0,0 +1,19 @@
+server {
+    listen 80;
+    server_name _;
+    root /usr/share/nginx/html;
+    index index.html;
+
+    gzip on;
+    gzip_types text/html text/css application/javascript;
+    gzip_min_length 256;
+
+    location ~* \.(css|js|png|jpg|svg|ico|woff2?)$ {
+        expires 30d;
+        add_header Cache-Control "public, immutable";
+    }
+
+    location / {
+        try_files $uri $uri/ /index.html;
+    }
+}

n8ngo/style.css

@@ -0,0 +1,713 @@
+/* =============================================
+   n8ngo — Managed n8n Hosting
+   style.css
+   ============================================= */
+
+@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;500&display=swap');
+
+/* ─── Reset & Base ─────────────────────────── */
+*, *::before, *::after {
+  box-sizing: border-box;
+  margin: 0;
+  padding: 0;
+}
+
+:root {
+  --bg-base:      #0f172a;
+  --bg-surface:   #1e293b;
+  --bg-elevated:  #263248;
+  --border:       #334155;
+  --border-light: #475569;
+
+  --green:        #10b981;
+  --green-dim:    #059669;
+  --cyan:         #06b6d4;
+  --cyan-dim:     #0891b2;
+
+  --text-primary:   #f1f5f9;
+  --text-secondary: #94a3b8;
+  --text-muted:     #64748b;
+
+  --radius-sm: 6px;
+  --radius-md: 12px;
+  --radius-lg: 20px;
+
+  --transition: 0.2s ease;
+}
+
+html {
+  scroll-behavior: smooth;
+  font-size: 16px;
+}
+
+body {
+  background-color: var(--bg-base);
+  color: var(--text-primary);
+  font-family: 'Inter', system-ui, sans-serif;
+  line-height: 1.6;
+  -webkit-font-smoothing: antialiased;
+}
+
+a {
+  color: var(--cyan);
+  text-decoration: none;
+  transition: color var(--transition);
+}
+a:hover { color: var(--green); }
+
+img { max-width: 100%; display: block; }
+
+/* ─── Utilities ─────────────────────────────── */
+.container {
+  width: 100%;
+  max-width: 1100px;
+  margin: 0 auto;
+  padding: 0 1.25rem;
+}
+
+.section {
+  padding: 5rem 0;
+}
+
+.section-label {
+  display: inline-block;
+  font-size: 0.75rem;
+  font-weight: 600;
+  letter-spacing: 0.12em;
+  text-transform: uppercase;
+  color: var(--cyan);
+  margin-bottom: 0.75rem;
+}
+
+.section-title {
+  font-size: clamp(1.75rem, 4vw, 2.5rem);
+  font-weight: 800;
+  line-height: 1.2;
+  color: var(--text-primary);
+  margin-bottom: 1rem;
+}
+
+.section-sub {
+  font-size: 1.0625rem;
+  color: var(--text-secondary);
+  max-width: 600px;
+}
+
+/* ─── Fade-in on scroll ─────────────────────── */
+.fade-in {
+  opacity: 0;
+  transform: translateY(24px);
+  transition: opacity 0.55s ease, transform 0.55s ease;
+}
+.fade-in.visible {
+  opacity: 1;
+  transform: none;
+}
+
+/* ─── Nav ───────────────────────────────────── */
+.nav {
+  position: sticky;
+  top: 0;
+  z-index: 100;
+  background: rgba(15, 23, 42, 0.85);
+  backdrop-filter: blur(12px);
+  -webkit-backdrop-filter: blur(12px);
+  border-bottom: 1px solid var(--border);
+}
+
+.nav-inner {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  height: 60px;
+}
+
+.nav-logo {
+  font-size: 1.25rem;
+  font-weight: 800;
+  color: var(--text-primary);
+  letter-spacing: -0.02em;
+}
+.nav-logo span { color: var(--green); }
+
+.nav-cta {
+  display: inline-flex;
+  align-items: center;
+  gap: 0.4rem;
+  background: var(--green);
+  color: #0f172a;
+  font-weight: 700;
+  font-size: 0.875rem;
+  padding: 0.5rem 1.1rem;
+  border-radius: var(--radius-sm);
+  transition: background var(--transition), transform var(--transition);
+}
+.nav-cta:hover {
+  background: var(--green-dim);
+  color: #0f172a;
+  transform: translateY(-1px);
+}
+
+/* ─── Hero ──────────────────────────────────── */
+.hero {
+  position: relative;
+  overflow: hidden;
+  padding: 6rem 0 5rem;
+  text-align: center;
+}
+
+/* Grid background */
+.hero::before {
+  content: '';
+  position: absolute;
+  inset: 0;
+  background-image:
+    linear-gradient(rgba(6, 182, 212, 0.06) 1px, transparent 1px),
+    linear-gradient(90deg, rgba(6, 182, 212, 0.06) 1px, transparent 1px);
+  background-size: 48px 48px;
+  mask-image: radial-gradient(ellipse 80% 60% at 50% 0%, black 40%, transparent 100%);
+  pointer-events: none;
+}
+
+/* Glow orb */
+.hero::after {
+  content: '';
+  position: absolute;
+  top: -120px;
+  left: 50%;
+  transform: translateX(-50%);
+  width: 600px;
+  height: 600px;
+  background: radial-gradient(circle, rgba(16, 185, 129, 0.15) 0%, transparent 65%);
+  pointer-events: none;
+}
+
+.hero-eyebrow {
+  display: inline-flex;
+  align-items: center;
+  gap: 0.5rem;
+  background: rgba(16, 185, 129, 0.12);
+  border: 1px solid rgba(16, 185, 129, 0.3);
+  color: var(--green);
+  font-size: 0.8125rem;
+  font-weight: 600;
+  padding: 0.35rem 0.9rem;
+  border-radius: 999px;
+  margin-bottom: 1.75rem;
+  letter-spacing: 0.02em;
+}
+.hero-eyebrow .dot {
+  width: 6px;
+  height: 6px;
+  border-radius: 50%;
+  background: var(--green);
+  animation: pulse-dot 2s ease-in-out infinite;
+}
+
+@keyframes pulse-dot {
+  0%, 100% { opacity: 1; transform: scale(1); }
+  50%       { opacity: 0.5; transform: scale(0.7); }
+}
+
+.hero-title {
+  font-size: clamp(2.25rem, 6vw, 3.75rem);
+  font-weight: 800;
+  line-height: 1.1;
+  letter-spacing: -0.03em;
+  margin-bottom: 1.25rem;
+  position: relative;
+}
+
+.hero-title .highlight {
+  background: linear-gradient(135deg, var(--green) 0%, var(--cyan) 100%);
+  -webkit-background-clip: text;
+  -webkit-text-fill-color: transparent;
+  background-clip: text;
+}
+
+.hero-sub {
+  font-size: clamp(1rem, 2.5vw, 1.1875rem);
+  color: var(--text-secondary);
+  max-width: 620px;
+  margin: 0 auto 2.25rem;
+  line-height: 1.7;
+}
+
+.hero-actions {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 1rem;
+  flex-wrap: wrap;
+  margin-bottom: 3rem;
+}
+
+.btn-primary {
+  display: inline-flex;
+  align-items: center;
+  gap: 0.5rem;
+  background: linear-gradient(135deg, var(--green) 0%, var(--cyan) 100%);
+  color: #0f172a;
+  font-weight: 700;
+  font-size: 1rem;
+  padding: 0.8rem 1.75rem;
+  border-radius: var(--radius-sm);
+  transition: opacity var(--transition), transform var(--transition), box-shadow var(--transition);
+  box-shadow: 0 0 24px rgba(16, 185, 129, 0.3);
+}
+.btn-primary:hover {
+  opacity: 0.9;
+  color: #0f172a;
+  transform: translateY(-2px);
+  box-shadow: 0 0 36px rgba(16, 185, 129, 0.45);
+}
+
+.btn-secondary {
+  display: inline-flex;
+  align-items: center;
+  gap: 0.5rem;
+  background: transparent;
+  color: var(--text-secondary);
+  font-weight: 600;
+  font-size: 1rem;
+  padding: 0.8rem 1.5rem;
+  border-radius: var(--radius-sm);
+  border: 1px solid var(--border);
+  transition: border-color var(--transition), color var(--transition);
+}
+.btn-secondary:hover {
+  border-color: var(--border-light);
+  color: var(--text-primary);
+}
+
+/* Domain pill */
+.hero-domain {
+  display: inline-flex;
+  align-items: center;
+  gap: 0.65rem;
+  background: var(--bg-surface);
+  border: 1px solid var(--border);
+  border-radius: var(--radius-md);
+  padding: 0.75rem 1.25rem;
+  font-family: 'JetBrains Mono', monospace;
+  font-size: 0.9375rem;
+  color: var(--text-primary);
+  animation: float 4s ease-in-out infinite;
+}
+.hero-domain .domain-part { color: var(--cyan); }
+.hero-domain .lock-icon {
+  color: var(--green);
+  font-size: 0.875rem;
+}
+
+@keyframes float {
+  0%, 100% { transform: translateY(0); }
+  50%       { transform: translateY(-6px); }
+}
+
+/* ─── How it works ──────────────────────────── */
+.how {
+  background: var(--bg-surface);
+  border-top: 1px solid var(--border);
+  border-bottom: 1px solid var(--border);
+}
+
+.how-grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
+  gap: 2rem;
+  margin-top: 3rem;
+}
+
+.step-card {
+  position: relative;
+  background: var(--bg-elevated);
+  border: 1px solid var(--border);
+  border-radius: var(--radius-md);
+  padding: 1.75rem;
+  transition: border-color var(--transition), transform var(--transition);
+}
+.step-card:hover {
+  border-color: var(--border-light);
+  transform: translateY(-3px);
+}
+
+.step-number {
+  width: 36px;
+  height: 36px;
+  border-radius: 50%;
+  background: linear-gradient(135deg, var(--green), var(--cyan));
+  color: #0f172a;
+  font-weight: 800;
+  font-size: 0.875rem;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin-bottom: 1rem;
+  flex-shrink: 0;
+}
+
+.step-title {
+  font-size: 1.0625rem;
+  font-weight: 700;
+  margin-bottom: 0.5rem;
+  color: var(--text-primary);
+}
+
+.step-desc {
+  font-size: 0.9375rem;
+  color: var(--text-secondary);
+  line-height: 1.65;
+}
+
+/* Connector line between steps (desktop) */
+@media (min-width: 768px) {
+  .how-grid {
+    position: relative;
+  }
+  .how-grid::before {
+    content: '';
+    position: absolute;
+    top: 52px;
+    left: calc(33.3% - 0px);
+    right: calc(33.3% - 0px);
+    height: 1px;
+    background: linear-gradient(90deg, var(--green), var(--cyan));
+    opacity: 0.4;
+    pointer-events: none;
+  }
+}
+
+/* ─── Features / Included ───────────────────── */
+.features-grid {
+  display: grid;
+  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
+  gap: 1.25rem;
+  margin-top: 3rem;
+}
+
+.feature-card {
+  background: var(--bg-surface);
+  border: 1px solid var(--border);
+  border-radius: var(--radius-md);
+  padding: 1.5rem 1.75rem;
+  display: flex;
+  gap: 1rem;
+  align-items: flex-start;
+  transition: border-color var(--transition), transform var(--transition), box-shadow var(--transition);
+}
+.feature-card:hover {
+  border-color: rgba(16, 185, 129, 0.4);
+  transform: translateY(-2px);
+  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.3);
+}
+
+.feature-icon {
+  font-size: 1.5rem;
+  line-height: 1;
+  flex-shrink: 0;
+  margin-top: 0.1rem;
+}
+
+.feature-body h3 {
+  font-size: 1rem;
+  font-weight: 700;
+  margin-bottom: 0.35rem;
+  color: var(--text-primary);
+}
+.feature-body p {
+  font-size: 0.9rem;
+  color: var(--text-secondary);
+  line-height: 1.6;
+}
+
+/* ─── Comparison Table ──────────────────────── */
+.comparison {
+  background: var(--bg-surface);
+  border-top: 1px solid var(--border);
+  border-bottom: 1px solid var(--border);
+}
+
+.table-wrapper {
+  overflow-x: auto;
+  margin-top: 3rem;
+  border-radius: var(--radius-md);
+  border: 1px solid var(--border);
+}
+
+table {
+  width: 100%;
+  border-collapse: collapse;
+  min-width: 600px;
+  font-size: 0.9375rem;
+}
+
+thead tr {
+  background: var(--bg-elevated);
+}
+
+th {
+  padding: 1rem 1.25rem;
+  font-weight: 700;
+  font-size: 0.875rem;
+  text-align: center;
+  color: var(--text-secondary);
+  border-bottom: 1px solid var(--border);
+}
+th:first-child { text-align: left; }
+
+th.col-highlight {
+  color: var(--text-primary);
+  background: rgba(16, 185, 129, 0.1);
+  position: relative;
+}
+th.col-highlight::after {
+  content: '★ Recomendado';
+  display: block;
+  font-size: 0.6875rem;
+  font-weight: 600;
+  color: var(--green);
+  letter-spacing: 0.05em;
+  margin-top: 0.2rem;
+}
+
+td {
+  padding: 0.875rem 1.25rem;
+  border-bottom: 1px solid var(--border);
+  color: var(--text-secondary);
+  text-align: center;
+  vertical-align: middle;
+}
+td:first-child {
+  text-align: left;
+  color: var(--text-primary);
+  font-weight: 500;
+}
+tr:last-child td { border-bottom: none; }
+
+td.col-highlight {
+  background: rgba(16, 185, 129, 0.05);
+  color: var(--text-primary);
+  font-weight: 600;
+}
+
+.check { color: var(--green); font-size: 1.05rem; }
+.cross { color: var(--text-muted); }
+.partial { color: #f59e0b; }
+
+/* ─── Free section ──────────────────────────── */
+.free-box {
+  background: var(--bg-surface);
+  border: 1px solid var(--border);
+  border-left: 3px solid var(--cyan);
+  border-radius: var(--radius-md);
+  padding: 2rem 2.25rem;
+  margin-top: 2rem;
+}
+
+.free-box p {
+  color: var(--text-secondary);
+  font-size: 0.9375rem;
+  line-height: 1.7;
+  margin-bottom: 1.5rem;
+}
+
+.steps-list {
+  list-style: none;
+  display: flex;
+  flex-direction: column;
+  gap: 0.75rem;
+  margin-bottom: 1.5rem;
+}
+
+.steps-list li {
+  display: flex;
+  align-items: flex-start;
+  gap: 0.75rem;
+  font-size: 0.9375rem;
+  color: var(--text-secondary);
+}
+
+.steps-list .step-num {
+  width: 24px;
+  height: 24px;
+  border-radius: 50%;
+  background: rgba(6, 182, 212, 0.15);
+  border: 1px solid rgba(6, 182, 212, 0.3);
+  color: var(--cyan);
+  font-size: 0.75rem;
+  font-weight: 700;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-shrink: 0;
+  margin-top: 0.1rem;
+}
+
+.code-block {
+  display: inline-block;
+  background: var(--bg-base);
+  border: 1px solid var(--border);
+  border-radius: var(--radius-sm);
+  padding: 0.35rem 0.65rem;
+  font-family: 'JetBrains Mono', monospace;
+  font-size: 0.85rem;
+  color: var(--cyan);
+  margin: 0.15rem 0;
+}
+
+.free-box .tagline {
+  font-style: italic;
+  color: var(--text-muted);
+  font-size: 0.9rem;
+  border-top: 1px solid var(--border);
+  padding-top: 1.25rem;
+  margin-top: 0;
+  margin-bottom: 0;
+}
+
+/* ─── Promo banner — hero ───────────────────── */
+.promo-banner {
+  display: flex;
+  align-items: center;
+  gap: 0.65rem;
+  flex-wrap: wrap;
+  justify-content: center;
+  background: linear-gradient(135deg, rgba(16,185,129,0.12), rgba(6,182,212,0.12));
+  border: 1px solid rgba(16,185,129,0.4);
+  border-radius: var(--radius-md);
+  padding: 0.75rem 1.25rem;
+  font-size: 0.9375rem;
+  color: var(--text-primary);
+  margin-bottom: 1.5rem;
+  max-width: 680px;
+  margin-left: auto;
+  margin-right: auto;
+  line-height: 1.5;
+}
+
+.promo-fire { font-size: 1.1rem; flex-shrink: 0; }
+
+.promo-cta-link {
+  display: inline-block;
+  background: var(--green);
+  color: #0f172a;
+  font-weight: 700;
+  font-size: 0.8125rem;
+  padding: 0.3rem 0.8rem;
+  border-radius: var(--radius-sm);
+  white-space: nowrap;
+  transition: background var(--transition), transform var(--transition);
+}
+.promo-cta-link:hover {
+  background: var(--green-dim);
+  color: #0f172a;
+  transform: translateY(-1px);
+}
+
+/* ─── Promo banner — before form ───────────── */
+.promo-form-banner {
+  display: flex;
+  align-items: flex-start;
+  gap: 1.1rem;
+  max-width: 680px;
+  margin: 2rem auto 0;
+  background: linear-gradient(135deg, rgba(16,185,129,0.1), rgba(6,182,212,0.07));
+  border: 1.5px solid rgba(16,185,129,0.45);
+  border-radius: var(--radius-md);
+  padding: 1.25rem 1.5rem;
+  font-size: 0.9375rem;
+  color: var(--text-secondary);
+  line-height: 1.6;
+}
+
+.promo-form-icon {
+  font-size: 1.5rem;
+  flex-shrink: 0;
+  margin-top: 0.1rem;
+}
+
+.promo-form-banner strong { color: var(--text-primary); }
+
+
+/* ─── Pre-registration ──────────────────────── */
+.precadastro {
+  background: var(--bg-surface);
+  border-top: 1px solid var(--border);
+}
+
+.form-wrapper {
+  max-width: 680px;
+  margin: 2.5rem auto 0;
+  background: #ffffff;
+  border-radius: var(--radius-lg);
+  padding: 2rem 2.5rem 1.5rem;
+  box-shadow: 0 0 0 1px rgba(255,255,255,0.06), 0 24px 64px rgba(0,0,0,0.4);
+}
+
+/* ─── Footer ────────────────────────────────── */
+.footer {
+  background: var(--bg-base);
+  border-top: 1px solid var(--border);
+  padding: 2.5rem 0;
+}
+
+.footer-inner {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 1rem;
+  text-align: center;
+}
+
+.footer-logo {
+  font-size: 1.1rem;
+  font-weight: 800;
+  color: var(--text-primary);
+}
+.footer-logo span { color: var(--green); }
+
+.footer-links {
+  display: flex;
+  gap: 1.5rem;
+  flex-wrap: wrap;
+  justify-content: center;
+}
+
+.footer-links a {
+  font-size: 0.875rem;
+  color: var(--text-muted);
+  transition: color var(--transition);
+}
+.footer-links a:hover { color: var(--text-secondary); }
+
+.footer-disclaimer {
+  font-size: 0.8125rem;
+  color: var(--text-muted);
+}
+
+/* ─── Responsive ────────────────────────────── */
+@media (max-width: 640px) {
+  .section { padding: 3.5rem 0; }
+
+  .hero { padding: 4rem 0 3rem; }
+
+  .how-grid,
+  .features-grid {
+    grid-template-columns: 1fr;
+  }
+
+  .form-wrapper {
+    padding: 1.25rem 1rem 0.75rem;
+  }
+
+  .step-card { padding: 1.25rem; }
+}
+
+@media (min-width: 768px) {
+  .footer-inner {
+    flex-direction: row;
+    justify-content: space-between;
+    text-align: left;
+  }
+}