diff --git a/.dockerignore b/.dockerignore new file mode 100644 index 0000000..7bdc5b6 --- /dev/null +++ b/.dockerignore @@ -0,0 +1,8 @@ +.git +.gitea +.gitignore +README.md +build.sh +instruction.txt +n8ngo/ +kvmote/ diff --git a/.gitea/workflows/deploy-kvmote.yml b/.gitea/workflows/deploy-kvmote.yml new file mode 100644 index 0000000..77681c3 --- /dev/null +++ b/.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 diff --git a/.gitea/workflows/deploy-n8ngo.yml b/.gitea/workflows/deploy-n8ngo.yml new file mode 100644 index 0000000..aebc138 --- /dev/null +++ b/.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 diff --git a/.gitea/workflows/deploy.yml b/.gitea/workflows/deploy.yml index f51aaa2..2299df0 100644 --- a/.gitea/workflows/deploy.yml +++ b/.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 diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..c23d97c --- /dev/null +++ b/.gitignore @@ -0,0 +1 @@ +/.claude diff --git a/kvmote/Dockerfile b/kvmote/Dockerfile new file mode 100644 index 0000000..68c4033 --- /dev/null +++ b/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 diff --git a/kvmote/index.html b/kvmote/index.html new file mode 100644 index 0000000..67e47b9 --- /dev/null +++ b/kvmote/index.html @@ -0,0 +1,807 @@ + + + + + + KVMote — Dois PCs, Um Teclado, Zero Bagunça + + + + + +
+
+
⚡ Early Access — Hardware + Software
+

Dois PCs.
Um teclado.
Zero bagunça.

+

+ 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. +

+ Quero ser notificado quando lançar → +
+ +
+ A história do KVMote + Quadrinho: O problema, a solução, a conexão e o fluxo do KVMote +
+
+ + +
+
+ 🔌 Plug & Play — sem drivers + 📡 Sem fio via BLE + ⌨️ Teclado + Mouse + Clipboard + 🚫 Zero software no PC cliente + 💳 Pagamento único — sem assinatura + 🔒 Funciona em PCs corporativos + + 🔌 Plug & Play — sem drivers + 📡 Sem fio via BLE + ⌨️ Teclado + Mouse + Clipboard + 🚫 Zero software no PC cliente + 💳 Pagamento único — sem assinatura + 🔒 Funciona em PCs corporativos +
+
+ + +
+
+
+
⌨️
+
USB HID
+
+
+

O PC que você quer controlar te vê como um teclado e mouse normais

+

+ O KVMote aparece para o Windows como um periférico USB padrão — sem alertas de segurança, sem driver para instalar, sem aprovação do TI. + Funciona em qualquer PC: corporativo bloqueado, notebook pessoal, máquina de trabalho remoto. + Para o sistema operacional, é só mais um teclado plugado. +

+
+
+
+ + +
+
Por que o KVMote?
+

Diferente de tudo que você já usou

+
+
+
🔒
+

Zero software no cliente

+

O PC cliente enxerga apenas um teclado + mouse USB padrão. Funciona em Windows corporativo bloqueado, sem instalar nada.

+
+
+
📡
+

Sem fio de verdade

+

Comunicação por BLE (Bluetooth Low Energy). Sem cabos entre os PCs, sem configuração de rede, sem IP.

+
+
+
📋
+

Clipboard compartilhado

+

Copie no host, cole no cliente com Ctrl+V. Suporte a PT-BR com acentos e múltiplos layouts de teclado.

+
+
+
⚡
+

Hardware compacto

+

Dispositivo pequeno e discreto baseado em ESP32-S3. Sem drivers proprietários, sem dongles extras.

+
+
+
+ + +
+
Como funciona
+

Três passos e você está no controle

+
+
+
1
+

Conecte o hardware

+

Plugue o dispositivo KVMote na porta USB do PC cliente. Nenhum driver necessário.

+
+
→
+
+
2
+

Abra o app no host

+

Execute o KVMote.exe no seu PC principal. Detecção automática via BLE — sem parear manualmente.

+
+
→
+
+
3
+

Leve o cursor à borda

+

Empurre o mouse para a borda configurada e o controle migra para o outro PC. Simples assim.

+
+
+
+ + +
+
+
Previsão de preço
+

Hardware + Software,
pagamento único

+
+
R$ 189 – 299
+
Preço único · sem assinatura · sem mensalidade
+
+
✦ Hardware ESP32-S3 pronto para uso
+
✦ Aplicativo KVMote para Windows (incluso)
+
✦ Controle de teclado, mouse e clipboard
+
✦ Suporte a PT-BR ABNT2 e US International
+
✦ Atualizações de firmware e software incluídas
+
+

+ O preço final depende do feedback de vocês. Responda o formulário abaixo e ajude a definir. +

+
+
+
+ + +
+
+
+
🎁
+

Sorteio de 2 dispositivos KVMote

+

+ Se validarmos que o produto vale a pena para vocês, vamos sortear + 2 unidades do hardware KVMote entre todos que se inscreverem com um email válido. + Sem pegadinha. Quem se inscrever no formulário abaixo já está participando. +

+
+
🎯 2 unidades sorteadas
+
📧 Basta ter email válido
+
✅ Inscrição = participação
+
+
+
+
+ + +
+
+

Inscreva-se e concorra!

+

Preencha abaixo para participar do sorteio e nos ajudar a definir o produto. Leva menos de 1 minuto.

+
+
+ + +
+
+ + + + + + diff --git a/kvmote/nginx.conf b/kvmote/nginx.conf new file mode 100644 index 0000000..b21b8c5 --- /dev/null +++ b/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; + } +} diff --git a/kvmote/quadrinhos_kvmote.png b/kvmote/quadrinhos_kvmote.png new file mode 100644 index 0000000..dc41b02 Binary files /dev/null and b/kvmote/quadrinhos_kvmote.png differ diff --git a/n8ngo/Dockerfile b/n8ngo/Dockerfile new file mode 100644 index 0000000..fd2c030 --- /dev/null +++ b/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 diff --git a/n8ngo/index.html b/n8ngo/index.html new file mode 100644 index 0000000..0daf505 --- /dev/null +++ b/n8ngo/index.html @@ -0,0 +1,471 @@ + + + + + + n8ngo — Hospedagem Managed de n8n + + + + + + + + + + + + + + + + + + + + + +
+
+ + + +
+ + Em fase de validação — vagas limitadas +
+ +

+ Seu n8n no ar em
+ 60 segundos +

+ +

+ Hospedagem managed de n8n com backup automático, monitoramento 24/7 + e subdomínio pronto. Você cria os fluxos, nós cuidamos do resto. +

+ +
+ + Quero meu n8n agora + + + Como funciona ↓ + +
+ +
+
+ + seudominio.n8ngo.host +
+
+ +
+
+ + +
+
+ + Como funciona +

Simples assim

+

+ Do zero ao n8n rodando em produção em três passos. Sem linha de comando, sem dor de cabeça. +

+ +
+ +
+
1
+

Escolha seu nome

+

+ Indique o subdomínio que quer usar — por exemplo, + minha-empresa.n8ngo.host. + É o seu espaço, com sua identidade. +

+
+ +
+
2
+

Nós configuramos tudo

+

+ Subimos o n8n, configuramos banco de dados, SSL, DNS, Uptime Kuma + e os backups automáticos. Você não precisa tocar em nada. +

+
+ +
+
3
+

Comece a automatizar

+

+ Acesse seu painel n8n, crie seus fluxos e deixe a automação + trabalhar por você. 24 horas por dia, 7 dias por semana. +

+
+ +
+
+
+ + +
+
+ + O que está incluso +

Tudo que você precisa.
Nada que você não precisa.

+

+ Cada instância n8ngo vem com uma stack completa pronta para produção. +

+ +
+ +
+ +
+

n8n pronto pra uso

+

Última versão estável do n8n, configurado e otimizado para performance. Atualizações gerenciadas por nós.

+
+
+ +
+ +
+

Subdomínio exclusivo

+

seudominio.n8ngo.host com SSL/TLS configurado. Agências podem ter sub-subdomínios para cada cliente.

+
+
+ +
+ +
+

Backup automático

+

Backup diário dos fluxos + backup completo semanal. Painel de acesso para restauração quando precisar.

+
+
+ +
+ +
+

Monitoramento 24/7

+

Uptime Kuma integrado monitorando sua instância continuamente. Alertas por email em caso de queda.

+
+
+ +
+ +
+

Modelo Agência

+

Gerencie múltiplos clientes com sub-subdomínios dedicados: cliente.agencia.n8ngo.host.

+
+
+ +
+ +
+

Dados no Brasil

+

Servidores em São Paulo. Conformidade com a LGPD. Seus dados e os dos seus clientes ficam aqui.

+
+
+ +
+
+
+ + +
+
+ + Comparação +

n8ngo vs as outras opções

+

+ Você pode configurar tudo sozinho. Mas será que faz sentido? +

+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
RecursoVPS + n8n manualn8n Cloudn8ngo
Setup inicialVocê configura tudoAutomáticoAutomático
Subdomínio próprioVocê configura DNS✕ Não disponível✓ Incluso
Backup de fluxosVocê configuraLimitado✓ Diário + semanal
MonitoramentoVocê instalaBásico✓ Uptime Kuma integrado
Alertas de quedaVocê configuraEmail✓ Email automático
Modelo Agência✕ Não✕ Não✓ Sub-subdomínios
ExecuçõesIlimitadasPor plano✓ Ilimitadas
Dados no BrasilDepende do servidor✕ Não✓ São Paulo, LGPD
PreçoR$20–80/mês + seu tempoA partir de €24/mêsA definir*
+
+

+ * Estamos em fase de validação. Você pode influenciar o preço final no formulário de pré-cadastro. +

+ +
+
+ + +
+
+ + Transparência +

Não quer pagar? Sem problema.

+

+ O n8n é open source e você pode rodá-lo gratuitamente no seu computador. + Aqui está como fazer isso agora mesmo. +

+ +
+

+ 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: +

+ +
    +
  1. + + + Instale o + Docker + na sua máquina (Windows, Mac ou Linux — tudo funciona). + +
    2. +
  2. + + + Abra o terminal e rode:
    + docker run -it --rm -p 5678:5678 n8nio/n8n +     +
    3. +
  3. + + + Acesse + localhost:5678 + no navegador. Pronto — n8n funcionando. + +
    4. +
  4. + + + Quando quiser salvar seus fluxos, exporte-os como JSON via + Menu → Download. É a sua propriedade, leve para onde quiser. + +
    5. +
+ +

+ Documentação oficial do n8n: + docs.n8n.io → +

+ +

+ Quando quiser colocar em produção 24/7 com backup automático e monitoramento real, + estaremos aqui — sem julgamentos. 😉 +

+
+ +
+
+ + +
+
+ +
+ Pré-cadastro +

Quer ser um dos primeiros?

+

+ 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. +

+
+ +
+ +
+ Promoção de lançamento
+ Os 10 primeiros cadastros validados ganham 6 meses grátis no plano básico. + Para valer, preencha o formulário abaixo e clique em Submit — só conta quem + concluir o envio pelo Tally. Em até 30 dias entraremos em contato pelo email + informado para confirmar os ganhadores — use um email que você acompanha de verdade. +
+
+ +
+ + +
+ +
+
+ + + + + + + + + + + + + + diff --git a/n8ngo/nginx.conf b/n8ngo/nginx.conf new file mode 100644 index 0000000..f2589fc --- /dev/null +++ b/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; + } +} diff --git a/n8ngo/style.css b/n8ngo/style.css new file mode 100644 index 0000000..29f6d3a --- /dev/null +++ b/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; + } +}