diff --git a/squads/professional-web-squad/README.md b/squads/professional-web-squad/README.md
new file mode 100644
index 00000000..92d76771
--- /dev/null
+++ b/squads/professional-web-squad/README.md
@@ -0,0 +1,32 @@
+# Professional Web Squad
+
+Squad especializado em criação de sites e landing pages profissionais de alta conversão.
+
+## Agentes
+
+| Agente | Especialidade | Comandos principais |
+|--------|--------------|-------------------|
+| 🔍 `discovery` | Briefing e descoberta | `*briefing`, `*define-persona`, `*define-value-proposition` |
+| ✍️ `copywriter` | Copy e storytelling | `*write-headline`, `*write-copy`, `*write-cta` |
+| 🖥️ `web-designer` | Design e UX | `*plan-sections`, `*create-wireframe`, `*optimize-above-fold` |
+| 📈 `seo-specialist` | SEO e performance | `*keyword-research`, `*write-meta`, `*audit-seo` |
+| 🎨 `ui-ux-expert` | UI/UX sênior | `*color-palette`, `*typography-scale`, `*create-moodboard` |
+
+## Workflow recomendado
+
+```
+1. @discovery → *briefing → *define-persona → *define-value-proposition
+2. @copywriter → *write-headline → *write-copy → *write-cta
+3. @web-designer → *plan-sections → *create-wireframe → *optimize-above-fold
+4. @ui-ux-expert → *create-moodboard → *color-palette → *typography-scale
+5. @seo-specialist → *keyword-research → *write-meta → *audit-seo
+6. @web-designer → *review-ux (revisão final)
+7. @ui-ux-expert → *ui-review (validação visual)
+8. @seo-specialist → *check-core-web-vitals (performance final)
+```
+
+## Gerado por
+
+- **Squad Creator:** @squad-creator (Craft)
+- **Blueprint:** `squads/.designs/professional-web-squad-design.yaml`
+- **Data:** 2026-05-23
diff --git a/squads/professional-web-squad/agents/copywriter.md b/squads/professional-web-squad/agents/copywriter.md
new file mode 100644
index 00000000..825831d8
--- /dev/null
+++ b/squads/professional-web-squad/agents/copywriter.md
@@ -0,0 +1,32 @@
+---
+agent: Copywriter & Storytelling Agent
+id: copywriter
+icon: "✍️"
+squad: professional-web-squad
+---
+
+# Copywriter & Storytelling Agent
+
+Especialista em copy persuasivo, storytelling, headlines magnéticas, CTAs de alta conversão e narrativa de marca. Adapta tom e voz ao público-alvo definido no briefing.
+
+## Commands
+
+- `*write-headline` — Criar headlines e subheadlines de alto impacto
+- `*write-copy` — Escrever copy para seções específicas da página
+- `*create-story` — Desenvolver narrativa e storytelling da marca
+- `*write-cta` — Criar CTAs e microcopy de conversão
+- `*write-about` — Escrever seção Sobre / Quem Somos
+- `*review-copy` — Revisar e otimizar copy existente
+
+## Workflow
+
+```
+*write-headline → *write-copy → *write-cta → *review-copy
+```
+
+## Dependencies
+
+- tasks/copywriter-write-headline.md
+- tasks/copywriter-write-copy.md
+- tasks/copywriter-create-story.md
+- tasks/copywriter-write-cta.md
diff --git a/squads/professional-web-squad/agents/discovery.md b/squads/professional-web-squad/agents/discovery.md
new file mode 100644
index 00000000..09dcf82e
--- /dev/null
+++ b/squads/professional-web-squad/agents/discovery.md
@@ -0,0 +1,31 @@
+---
+agent: Discovery Agent
+id: discovery
+icon: "🔍"
+squad: professional-web-squad
+---
+
+# Discovery Agent
+
+Conduz o briefing inicial, define público-alvo, persona, proposta de valor e objetivo do site antes de qualquer criação de conteúdo ou design.
+
+## Commands
+
+- `*briefing` — Conduzir briefing completo com o cliente
+- `*define-persona` — Definir persona e público-alvo
+- `*define-value-proposition` — Definir proposta de valor e diferenciais
+- `*competitor-analysis` — Analisar concorrentes do segmento
+- `*project-scope` — Definir escopo e objetivos do projeto
+
+## Workflow
+
+```
+*briefing → *define-persona → *define-value-proposition → *competitor-analysis
+```
+
+## Dependencies
+
+- tasks/discovery-briefing.md
+- tasks/discovery-define-persona.md
+- tasks/discovery-define-value-proposition.md
+- tasks/discovery-competitor-analysis.md
diff --git a/squads/professional-web-squad/agents/seo-specialist.md b/squads/professional-web-squad/agents/seo-specialist.md
new file mode 100644
index 00000000..d7a603fe
--- /dev/null
+++ b/squads/professional-web-squad/agents/seo-specialist.md
@@ -0,0 +1,32 @@
+---
+agent: SEO & Performance Agent
+id: seo-specialist
+icon: "📈"
+squad: professional-web-squad
+---
+
+# SEO & Performance Agent
+
+Otimiza sites e landing pages para mecanismos de busca. Define estratégia de keywords, meta tags, estrutura semântica (HTML5), performance (Core Web Vitals) e boas práticas técnicas de SEO on-page.
+
+## Commands
+
+- `*keyword-research` — Pesquisar e mapear keywords primárias e secundárias
+- `*write-meta` — Criar title tags, meta descriptions e OG tags
+- `*audit-seo` — Auditar SEO on-page da página
+- `*optimize-performance` — Otimizar performance e velocidade
+- `*check-core-web-vitals` — Verificar métricas Core Web Vitals (LCP, FID, CLS)
+- `*generate-schema-markup` — Gerar marcação Schema.org estruturada
+
+## Workflow
+
+```
+*keyword-research → *write-meta → *audit-seo → *check-core-web-vitals
+```
+
+## Dependencies
+
+- tasks/seo-keyword-research.md
+- tasks/seo-write-meta.md
+- tasks/seo-audit.md
+- tasks/seo-check-core-web-vitals.md
diff --git a/squads/professional-web-squad/agents/ui-ux-expert.md b/squads/professional-web-squad/agents/ui-ux-expert.md
new file mode 100644
index 00000000..dc1a7bab
--- /dev/null
+++ b/squads/professional-web-squad/agents/ui-ux-expert.md
@@ -0,0 +1,33 @@
+---
+agent: Senior UI/UX Design Expert
+id: ui-ux-expert
+icon: "🎨"
+squad: professional-web-squad
+---
+
+# Senior UI/UX Design Expert
+
+Especialista sênior em UI/UX com foco em experiências visuais de alto impacto. Define paleta de cores, tipografia, espaçamento, micro-interações e padrões de design que combinam estética profissional com alta conversão. Referência em tendências de design moderno para web.
+
+## Commands
+
+- `*design-system` — Definir design system e padrões visuais do projeto
+- `*color-palette` — Criar paleta de cores com acessibilidade e psicologia das cores
+- `*typography-scale` — Definir escala tipográfica e hierarquia de texto
+- `*ui-review` — Revisar UI implementada e apontar melhorias
+- `*create-moodboard` — Criar moodboard e direção criativa
+- `*design-component` — Especificar componente visual detalhado
+- `*accessibility-check` — Verificar acessibilidade (WCAG AA)
+
+## Workflow
+
+```
+*create-moodboard → *color-palette → *typography-scale → *design-system → *ui-review
+```
+
+## Dependencies
+
+- tasks/ui-ux-color-palette.md
+- tasks/ui-ux-typography-scale.md
+- tasks/ui-ux-create-moodboard.md
+- tasks/ui-ux-review.md
diff --git a/squads/professional-web-squad/agents/web-designer.md b/squads/professional-web-squad/agents/web-designer.md
new file mode 100644
index 00000000..e4b65eb0
--- /dev/null
+++ b/squads/professional-web-squad/agents/web-designer.md
@@ -0,0 +1,32 @@
+---
+agent: Web Designer & UX Agent
+id: web-designer
+icon: "🖥️"
+squad: professional-web-squad
+---
+
+# Web Designer & UX Agent
+
+Define estrutura visual, layout, hierarquia de informação e experiência do usuário focada em conversão. Cria wireframes de seções, guias de estilo e especificações visuais para landing pages e sites profissionais.
+
+## Commands
+
+- `*design-layout` — Definir layout geral e grid da página
+- `*plan-sections` — Planejar seções e ordem de conteúdo
+- `*create-wireframe` — Criar wireframe anotado das seções
+- `*define-style-guide` — Definir guia de estilo visual
+- `*review-ux` — Revisar experiência do usuário e fluxo
+- `*optimize-above-fold` — Otimizar área acima da dobra (hero)
+
+## Workflow
+
+```
+*plan-sections → *create-wireframe → *define-style-guide → *optimize-above-fold
+```
+
+## Dependencies
+
+- tasks/web-designer-plan-sections.md
+- tasks/web-designer-create-wireframe.md
+- tasks/web-designer-define-style-guide.md
+- tasks/web-designer-optimize-above-fold.md
diff --git a/squads/professional-web-squad/checklists/.gitkeep b/squads/professional-web-squad/checklists/.gitkeep
new file mode 100644
index 00000000..e69de29b
diff --git a/squads/professional-web-squad/config/coding-standards.md b/squads/professional-web-squad/config/coding-standards.md
new file mode 100644
index 00000000..179aa2e4
--- /dev/null
+++ b/squads/professional-web-squad/config/coding-standards.md
@@ -0,0 +1,30 @@
+# Coding Standards — professional-web-squad
+
+## Princípios gerais
+
+- Semântica HTML5 correta (section, article, nav, main, header, footer)
+- CSS: variáveis CSS para tokens de design (cores, fontes, espaçamento)
+- Mobile-first: media queries do menor para o maior breakpoint
+- Performance: imagens otimizadas (WebP, lazy loading), fontes com font-display: swap
+- Acessibilidade: WCAG AA mínimo, aria-labels, foco visível
+
+## Nomenclatura
+
+- Classes CSS: BEM (block__element--modifier)
+- IDs: apenas para âncoras e formulários
+- Arquivos: kebab-case (hero-section.html)
+
+## Estrutura de arquivos recomendada
+
+```
+projeto/
+├── index.html
+├── css/
+│ ├── tokens.css # Design tokens (variáveis CSS)
+│ ├── base.css # Reset e estilos globais
+│ └── components/ # Estilos por seção
+├── js/
+│ └── main.js
+└── assets/
+ └── images/
+```
diff --git a/squads/professional-web-squad/config/source-tree.md b/squads/professional-web-squad/config/source-tree.md
new file mode 100644
index 00000000..7ad8b856
--- /dev/null
+++ b/squads/professional-web-squad/config/source-tree.md
@@ -0,0 +1,31 @@
+# Source Tree — professional-web-squad
+
+## Estrutura do squad
+
+```
+squads/professional-web-squad/
+├── squad.yaml # Manifest do squad
+├── README.md # Documentação do squad
+├── config/
+│ ├── coding-standards.md # Padrões de código
+│ ├── tech-stack.md # Tecnologias
+│ └── source-tree.md # Este arquivo
+├── agents/
+│ ├── discovery.md # 🔍 Discovery Agent
+│ ├── copywriter.md # ✍️ Copywriter & Storytelling
+│ ├── web-designer.md # 🖥️ Web Designer & UX
+│ ├── seo-specialist.md # 📈 SEO & Performance
+│ └── ui-ux-expert.md # 🎨 Senior UI/UX Expert
+├── tasks/
+│ ├── discovery-*.md # Tasks de discovery
+│ ├── copywriter-*.md # Tasks de copy
+│ ├── web-designer-*.md # Tasks de design
+│ ├── seo-*.md # Tasks de SEO
+│ └── ui-ux-*.md # Tasks de UI/UX
+├── workflows/ # Workflows multi-agente
+├── checklists/ # Checklists de qualidade
+├── templates/ # Templates de documento
+├── tools/ # Ferramentas customizadas
+├── scripts/ # Scripts utilitários
+└── data/ # Dados estáticos
+```
diff --git a/squads/professional-web-squad/config/tech-stack.md b/squads/professional-web-squad/config/tech-stack.md
new file mode 100644
index 00000000..985714db
--- /dev/null
+++ b/squads/professional-web-squad/config/tech-stack.md
@@ -0,0 +1,28 @@
+# Tech Stack — professional-web-squad
+
+## Stack padrão (sem framework)
+
+| Camada | Tecnologia | Notas |
+|--------|-----------|-------|
+| Markup | HTML5 semântico | SEO-friendly |
+| Estilos | CSS3 + variáveis CSS | Tokens de design |
+| Scripts | JavaScript vanilla | Sem dependências obrigatórias |
+| Fontes | Google Fonts | Inter, Montserrat, Playfair |
+| Ícones | Lucide Icons / SVG inline | Performance |
+| Imagens | WebP + fallback JPG | Compressão obrigatória |
+
+## Opções de framework (por projeto)
+
+| Framework | Quando usar |
+|-----------|-------------|
+| Next.js | Sites com SSR, blog, e-commerce |
+| Astro | Sites estáticos, máxima performance |
+| Webflow | Clientes que gerenciam conteúdo |
+| WordPress + ACF | Clientes com CMS familiar |
+
+## Ferramentas de desenvolvimento
+
+- Vite (bundler)
+- PostCSS + Autoprefixer
+- Prettier (formatação)
+- Lighthouse (performance e SEO)
diff --git a/squads/professional-web-squad/data/.gitkeep b/squads/professional-web-squad/data/.gitkeep
new file mode 100644
index 00000000..e69de29b
diff --git a/squads/professional-web-squad/scripts/.gitkeep b/squads/professional-web-squad/scripts/.gitkeep
new file mode 100644
index 00000000..e69de29b
diff --git a/squads/professional-web-squad/squad.yaml b/squads/professional-web-squad/squad.yaml
new file mode 100644
index 00000000..cb15f838
--- /dev/null
+++ b/squads/professional-web-squad/squad.yaml
@@ -0,0 +1,63 @@
+name: professional-web-squad
+version: 1.0.0
+description: "Squad especializado em criação de sites e landing pages profissionais de alta conversão"
+author: Lucas
+license: MIT
+slashPrefix: web
+
+aios:
+ minVersion: "2.1.0"
+ type: squad
+
+components:
+ agents:
+ - discovery.md
+ - copywriter.md
+ - web-designer.md
+ - seo-specialist.md
+ - ui-ux-expert.md
+ tasks:
+ - discovery-briefing.md
+ - discovery-define-persona.md
+ - discovery-define-value-proposition.md
+ - discovery-competitor-analysis.md
+ - copywriter-write-headline.md
+ - copywriter-write-copy.md
+ - copywriter-create-story.md
+ - copywriter-write-cta.md
+ - web-designer-plan-sections.md
+ - web-designer-create-wireframe.md
+ - web-designer-define-style-guide.md
+ - web-designer-optimize-above-fold.md
+ - seo-keyword-research.md
+ - seo-write-meta.md
+ - seo-audit.md
+ - seo-check-core-web-vitals.md
+ - ui-ux-color-palette.md
+ - ui-ux-typography-scale.md
+ - ui-ux-create-moodboard.md
+ - ui-ux-review.md
+ workflows: []
+ checklists: []
+ templates: []
+ tools: []
+ scripts: []
+
+config:
+ extends: extend
+ coding-standards: config/coding-standards.md
+ tech-stack: config/tech-stack.md
+ source-tree: config/source-tree.md
+
+dependencies:
+ node: []
+ python: []
+ squads: []
+
+tags:
+ - web
+ - landing-page
+ - copy
+ - seo
+ - design
+ - conversion
diff --git a/squads/professional-web-squad/tasks/copywriter-create-story.md b/squads/professional-web-squad/tasks/copywriter-create-story.md
new file mode 100644
index 00000000..314c72f3
--- /dev/null
+++ b/squads/professional-web-squad/tasks/copywriter-create-story.md
@@ -0,0 +1,53 @@
+---
+task: Criar Storytelling
+agent: copywriter
+responsavel: "@copywriter"
+responsavel_type: agent
+atomic_layer: task
+icon: "✍️"
+elicit: true
+Entrada: |
+ - marca: Informações sobre a marca e fundador
+ - persona_documento: Persona definida
+ - objetivo: Objetivo emocional da narrativa
+Saida: |
+ - narrativa_de_marca: História da marca estruturada
+ - arco_storytelling: Estrutura narrativa em 3 atos
+Checklist:
+ - "[ ] Identificar o herói da história (cliente ou fundador)"
+ - "[ ] Mapear o conflito/desafio central"
+ - "[ ] Desenvolver a jornada de transformação"
+ - "[ ] Conectar com as dores da persona"
+ - "[ ] Finalizar com resolução e CTA"
+---
+
+# *create-story
+
+Desenvolve a narrativa e storytelling da marca, criando conexão emocional com a persona.
+
+## Framework: Jornada do Herói (adaptada para web)
+
+```
+Ato 1 — CONTEXTO
+"Você sabe como é [situação de dor]..."
+
+Ato 2 — CONFLITO
+"A maioria das pessoas tenta [solução comum], mas [por que não funciona]..."
+
+Ato 3 — RESOLUÇÃO
+"[Produto/serviço] foi criado para [transformação]. Hoje, [resultado real]."
+```
+
+## Output
+
+```markdown
+# Narrativa — [Marca]
+
+## Arco da História
+**Contexto:** [situação inicial identificável pela persona]
+**Conflito:** [problema que a solução resolve]
+**Resolução:** [transformação que o produto/serviço proporciona]
+
+## Copy de Storytelling
+[Texto corrido da narrativa, pronto para usar na página]
+```
diff --git a/squads/professional-web-squad/tasks/copywriter-write-copy.md b/squads/professional-web-squad/tasks/copywriter-write-copy.md
new file mode 100644
index 00000000..f9d67860
--- /dev/null
+++ b/squads/professional-web-squad/tasks/copywriter-write-copy.md
@@ -0,0 +1,45 @@
+---
+task: Escrever Copy de Seção
+agent: copywriter
+responsavel: "@copywriter"
+responsavel_type: agent
+atomic_layer: task
+icon: "✍️"
+elicit: true
+Entrada: |
+ - briefing_completo: Briefing do projeto
+ - persona_documento: Persona definida
+ - secao_alvo: Qual seção será escrita (hero, benefícios, sobre, depoimentos, FAQ, CTA)
+Saida: |
+ - copy_secao: Copy completo da seção solicitada
+ - alternativas: 2 variações alternativas
+Checklist:
+ - "[ ] Identificar objetivo da seção"
+ - "[ ] Adaptar tom ao público-alvo"
+ - "[ ] Escrever versão principal"
+ - "[ ] Revisar clareza e persuasão"
+ - "[ ] Gerar 2 variações alternativas"
+---
+
+# *write-copy
+
+Escreve copy persuasivo para seções específicas da página, adaptado à persona e ao objetivo de conversão.
+
+## Seções suportadas
+
+| Seção | Objetivo | Tom |
+|-------|----------|-----|
+| Hero | Capturar atenção imediata | Direto, impactante |
+| Benefícios | Convencer com lógica | Claro, específico |
+| Sobre | Gerar confiança | Humano, autêntico |
+| Depoimentos | Prova social | Natural, específico |
+| FAQ | Quebrar objeções | Empático, direto |
+| CTA Final | Provocar ação | Urgente, motivador |
+
+## Princípios
+
+- Escrever para a persona, não para o cliente
+- Benefícios > Features
+- Específico > Genérico
+- Uma ideia por parágrafo
+- CTA claro em toda seção
diff --git a/squads/professional-web-squad/tasks/copywriter-write-cta.md b/squads/professional-web-squad/tasks/copywriter-write-cta.md
new file mode 100644
index 00000000..6a375f49
--- /dev/null
+++ b/squads/professional-web-squad/tasks/copywriter-write-cta.md
@@ -0,0 +1,52 @@
+---
+task: Escrever CTAs
+agent: copywriter
+responsavel: "@copywriter"
+responsavel_type: agent
+atomic_layer: task
+icon: "✍️"
+elicit: true
+Entrada: |
+ - objetivo_conversao: O que o visitante deve fazer (comprar, agendar, baixar, etc.)
+ - persona_documento: Persona definida
+Saida: |
+ - ctas_variações: 10 variações de CTA para teste
+ - microcopy: Textos de suporte ao CTA (abaixo do botão)
+Checklist:
+ - "[ ] Identificar ação desejada"
+ - "[ ] Gerar 10 variações de CTA"
+ - "[ ] Incluir gatilhos de urgência e benefício"
+ - "[ ] Criar microcopy de suporte"
+ - "[ ] Testar clareza e especificidade"
+---
+
+# *write-cta
+
+Cria CTAs de alta conversão e microcopy de suporte para maximizar cliques e conversões.
+
+## Fórmulas de CTA eficazes
+
+- **Resultado direto:** "Quero meu site hoje"
+- **Benefício + ação:** "Começar a vender mais agora"
+- **Baixo risco:** "Ver demonstração gratuita"
+- **Urgência:** "Garantir minha vaga (restam X)"
+- **Específico:** "Agendar minha consultoria de 30 min"
+
+## Microcopy de suporte
+
+Texto abaixo do botão que reduz objeções:
+- "Sem compromisso. Cancele quando quiser."
+- "Já são +500 empresas usando"
+- "Resposta em até 24h"
+- "100% seguro e sem spam"
+
+## Output
+
+```markdown
+# CTAs — [Projeto]
+
+| # | CTA | Microcopy | Gatilho |
+|---|-----|-----------|---------|
+| 1 | [texto] | [suporte] | [urgência/benefício] |
+[...]
+```
diff --git a/squads/professional-web-squad/tasks/copywriter-write-headline.md b/squads/professional-web-squad/tasks/copywriter-write-headline.md
new file mode 100644
index 00000000..5e58caba
--- /dev/null
+++ b/squads/professional-web-squad/tasks/copywriter-write-headline.md
@@ -0,0 +1,50 @@
+---
+task: Escrever Headlines
+agent: copywriter
+responsavel: "@copywriter"
+responsavel_type: agent
+atomic_layer: task
+icon: "✍️"
+elicit: true
+Entrada: |
+ - proposta_de_valor: Proposta de valor definida
+ - persona_documento: Persona com dores e desejos
+Saida: |
+ - headlines_variações: 5-10 opções de headline
+ - subheadlines: 3-5 opções de subheadline para cada headline
+Checklist:
+ - "[ ] Estudar proposta de valor e persona"
+ - "[ ] Gerar 10 variações de headline"
+ - "[ ] Aplicar gatilhos emocionais"
+ - "[ ] Testar clareza e especificidade"
+ - "[ ] Gerar subheadlines complementares"
+ - "[ ] Selecionar top 3 para teste"
+---
+
+# *write-headline
+
+Cria headlines magnéticas que capturam atenção, comunicam o valor e provocam ação imediata.
+
+## Fórmulas eficazes
+
+- **Resultado + Tempo:** "Aumente suas vendas em 30 dias sem aumentar o orçamento"
+- **Dor → Solução:** "Cansado de sites que não convertem? Isso vai mudar."
+- **Curiosidade:** "O que os maiores sites do Brasil fazem diferente"
+- **Prova social:** "Como [número] empresas dobraram seus leads com esse método"
+- **Promessa direta:** "Landing pages que vendem — entregamos em 7 dias"
+
+## Output
+
+```markdown
+# Headlines — [Projeto]
+
+## Opção 1 (Resultado + Tempo)
+**H:** [headline]
+**Sub:** [subheadline]
+
+## Opção 2 (Dor → Solução)
+**H:** [headline]
+**Sub:** [subheadline]
+
+[...]
+```
diff --git a/squads/professional-web-squad/tasks/discovery-briefing.md b/squads/professional-web-squad/tasks/discovery-briefing.md
new file mode 100644
index 00000000..a084b4ae
--- /dev/null
+++ b/squads/professional-web-squad/tasks/discovery-briefing.md
@@ -0,0 +1,49 @@
+---
+task: Briefing Completo
+agent: discovery
+responsavel: "@discovery"
+responsavel_type: agent
+atomic_layer: task
+icon: "🔍"
+elicit: true
+Entrada: |
+ - objetivo_do_site: Qual o objetivo principal (vender, capturar leads, informar)
+ - tipo_de_negocio: Produto, serviço, pessoal ou institucional
+ - publico_alvo: Descrição inicial do público
+Saida: |
+ - briefing_completo: Documento de briefing estruturado
+ - restricoes: Restrições de marca, prazo ou tecnologia
+ - referencias: Sites de referência e inspiração
+Checklist:
+ - "[ ] Coletar objetivo do site"
+ - "[ ] Identificar tipo de negócio"
+ - "[ ] Mapear público-alvo inicial"
+ - "[ ] Levantar referências visuais"
+ - "[ ] Documentar restrições e prazos"
+ - "[ ] Confirmar briefing com cliente"
+---
+
+# *briefing
+
+Conduz o briefing inicial com o cliente para entender o objetivo, público-alvo e contexto do projeto antes de qualquer criação.
+
+## Perguntas-chave
+
+1. **Objetivo:** O que você quer que o visitante faça ao acessar o site?
+2. **Negócio:** O que você vende/oferece? Qual o diferencial?
+3. **Público:** Para quem é esse site? Qual a dor principal desse público?
+4. **Referências:** Quais sites você admira? O que gosta e o que não gosta neles?
+5. **Restrições:** Tem identidade visual? Cores obrigatórias? Prazo?
+
+## Output
+
+```markdown
+# Briefing — [Nome do Projeto]
+
+**Objetivo:** [capturar leads / vender / informar]
+**Tipo:** [produto / serviço / pessoal / institucional]
+**Público-alvo:** [descrição]
+**Proposta inicial:** [o que torna único]
+**Referências:** [links]
+**Restrições:** [cores, prazos, tecnologias]
+```
diff --git a/squads/professional-web-squad/tasks/discovery-competitor-analysis.md b/squads/professional-web-squad/tasks/discovery-competitor-analysis.md
new file mode 100644
index 00000000..88a349ea
--- /dev/null
+++ b/squads/professional-web-squad/tasks/discovery-competitor-analysis.md
@@ -0,0 +1,54 @@
+---
+task: Análise de Concorrentes
+agent: discovery
+responsavel: "@discovery"
+responsavel_type: agent
+atomic_layer: task
+icon: "🔍"
+elicit: true
+Entrada: |
+ - segmento: Mercado/nicho do projeto
+ - concorrentes_conhecidos: Lista de concorrentes mencionados pelo cliente
+Saida: |
+ - analise_competitiva: Tabela comparativa dos concorrentes
+ - oportunidades: Gaps e oportunidades identificadas
+ - gaps: O que os concorrentes não oferecem
+Checklist:
+ - "[ ] Listar 3-5 concorrentes diretos"
+ - "[ ] Analisar posicionamento de cada um"
+ - "[ ] Avaliar copy e proposta de valor"
+ - "[ ] Identificar padrões de design"
+ - "[ ] Mapear gaps e oportunidades"
+---
+
+# *competitor-analysis
+
+Analisa os principais concorrentes para identificar oportunidades de posicionamento e diferenciação.
+
+## Análise por concorrente
+
+Para cada concorrente, avaliar:
+- Proposta de valor principal
+- Público-alvo declarado
+- Pontos fortes do site
+- Pontos fracos do site
+- CTA principal
+- Tom de voz
+
+## Output
+
+```markdown
+# Análise Competitiva
+
+| Concorrente | Proposta | Pontos Fortes | Pontos Fracos | CTA |
+|-------------|----------|---------------|---------------|-----|
+| [nome] | [...] | [...] | [...] | [...] |
+
+## Oportunidades identificadas
+- [oportunidade 1]
+- [oportunidade 2]
+
+## Gaps do mercado
+- [gap 1]
+- [gap 2]
+```
diff --git a/squads/professional-web-squad/tasks/discovery-define-persona.md b/squads/professional-web-squad/tasks/discovery-define-persona.md
new file mode 100644
index 00000000..cf06cb3d
--- /dev/null
+++ b/squads/professional-web-squad/tasks/discovery-define-persona.md
@@ -0,0 +1,54 @@
+---
+task: Definir Persona
+agent: discovery
+responsavel: "@discovery"
+responsavel_type: agent
+atomic_layer: task
+icon: "🔍"
+elicit: true
+Entrada: |
+ - briefing_completo: Documento de briefing
+ - dados_do_mercado: Informações sobre o segmento (opcional)
+Saida: |
+ - persona_documento: Persona estruturada com nome, dores e desejos
+ - dores: Lista de dores e frustrações do público
+ - desejos: Lista de desejos e aspirações
+ - gatilhos: Gatilhos de decisão de compra
+Checklist:
+ - "[ ] Nomear e humanizar a persona"
+ - "[ ] Mapear dados demográficos"
+ - "[ ] Listar dores e frustrações"
+ - "[ ] Listar desejos e aspirações"
+ - "[ ] Identificar gatilhos de decisão"
+ - "[ ] Validar persona com cliente"
+---
+
+# *define-persona
+
+Define a persona principal do projeto com base no briefing, mapeando dores, desejos e gatilhos de compra.
+
+## Output
+
+```markdown
+# Persona — [Nome]
+
+**Idade:** [faixa]
+**Ocupação:** [cargo/área]
+**Objetivo principal:** [o que quer alcançar]
+
+## Dores
+- [dor 1]
+- [dor 2]
+
+## Desejos
+- [desejo 1]
+- [desejo 2]
+
+## Gatilhos de decisão
+- [gatilho 1]
+- [gatilho 2]
+
+## Objeções comuns
+- [objeção 1]
+- [objeção 2]
+```
diff --git a/squads/professional-web-squad/tasks/discovery-define-value-proposition.md b/squads/professional-web-squad/tasks/discovery-define-value-proposition.md
new file mode 100644
index 00000000..e67a8701
--- /dev/null
+++ b/squads/professional-web-squad/tasks/discovery-define-value-proposition.md
@@ -0,0 +1,54 @@
+---
+task: Definir Proposta de Valor
+agent: discovery
+responsavel: "@discovery"
+responsavel_type: agent
+atomic_layer: task
+icon: "🔍"
+elicit: true
+Entrada: |
+ - persona_documento: Persona definida
+ - produto_servico: Descrição do produto ou serviço
+Saida: |
+ - proposta_de_valor: Declaração clara da proposta de valor
+ - diferenciais: Lista de diferenciais competitivos
+ - beneficios: Benefícios concretos para o público
+Checklist:
+ - "[ ] Identificar o que o produto resolve"
+ - "[ ] Mapear diferenciais vs concorrência"
+ - "[ ] Traduzir features em benefícios"
+ - "[ ] Redigir proposta de valor em 1 frase"
+ - "[ ] Validar clareza e relevância"
+---
+
+# *define-value-proposition
+
+Define a proposta de valor única do projeto, traduzindo features em benefícios concretos para a persona.
+
+## Framework: Value Proposition Canvas
+
+```
+Para [persona] que [dor/necessidade],
+[produto/serviço] oferece [benefício principal]
+diferente de [alternativa], porque [diferencial único].
+```
+
+## Output
+
+```markdown
+# Proposta de Valor
+
+**Declaração:** [1 frase clara e direta]
+
+## Diferenciais
+- [diferencial 1]
+- [diferencial 2]
+
+## Benefícios para a persona
+- [benefício 1]
+- [benefício 2]
+
+## Prova social / evidências
+- [evidência 1]
+- [evidência 2]
+```
diff --git a/squads/professional-web-squad/tasks/seo-audit.md b/squads/professional-web-squad/tasks/seo-audit.md
new file mode 100644
index 00000000..b712fe0e
--- /dev/null
+++ b/squads/professional-web-squad/tasks/seo-audit.md
@@ -0,0 +1,64 @@
+---
+task: Auditoria SEO On-Page
+agent: seo-specialist
+responsavel: "@seo-specialist"
+responsavel_type: agent
+atomic_layer: task
+icon: "📈"
+elicit: true
+Entrada: |
+ - url_ou_html_pagina: URL da página publicada ou HTML para análise
+Saida: |
+ - relatorio_seo: Relatório completo de SEO on-page
+ - issues_criticos: Lista de problemas críticos
+ - recomendacoes: Recomendações priorizadas
+Checklist:
+ - "[ ] Verificar estrutura de headings (H1→H2→H3)"
+ - "[ ] Avaliar densidade de keywords"
+ - "[ ] Checar atributos alt em imagens"
+ - "[ ] Verificar links internos e externos"
+ - "[ ] Avaliar velocidade de carregamento"
+ - "[ ] Verificar mobile-friendliness"
+ - "[ ] Checar meta tags"
+ - "[ ] Verificar Schema Markup"
+---
+
+# *audit-seo
+
+Audita o SEO on-page da página e gera relatório com issues e recomendações priorizadas.
+
+## Checklist de Auditoria
+
+### Técnico
+- [ ] H1 único e com keyword
+- [ ] Hierarquia de headings lógica
+- [ ] Meta title dentro de 60 chars
+- [ ] Meta description dentro de 160 chars
+- [ ] Imagens com alt text descritivo
+- [ ] URL amigável e com keyword
+- [ ] HTTPS ativo
+- [ ] Sitemap.xml presente
+- [ ] robots.txt configurado
+
+### Conteúdo
+- [ ] Keyword na primeira frase
+- [ ] Densidade de keyword 1-2%
+- [ ] Conteúdo original (sem duplicação)
+- [ ] Links internos relevantes
+- [ ] Links externos de autoridade
+
+## Output
+
+```markdown
+# Relatório SEO — [Projeto]
+
+## Score Geral: [X/100]
+
+## Issues Críticos
+- [ ] [issue]
+
+## Recomendações
+| Prioridade | Ação | Impacto |
+|------------|------|---------|
+| Alta | [ação] | [impacto] |
+```
diff --git a/squads/professional-web-squad/tasks/seo-check-core-web-vitals.md b/squads/professional-web-squad/tasks/seo-check-core-web-vitals.md
new file mode 100644
index 00000000..576c33ed
--- /dev/null
+++ b/squads/professional-web-squad/tasks/seo-check-core-web-vitals.md
@@ -0,0 +1,61 @@
+---
+task: Verificar Core Web Vitals
+agent: seo-specialist
+responsavel: "@seo-specialist"
+responsavel_type: agent
+atomic_layer: task
+icon: "📈"
+elicit: true
+Entrada: |
+ - url_pagina: URL da página publicada
+Saida: |
+ - scores_cwv: Scores de LCP, FID/INP e CLS
+ - itens_melhoria: Lista de elementos a otimizar
+ - prioridades: Ordem de correção por impacto
+Checklist:
+ - "[ ] Medir LCP (Largest Contentful Paint)"
+ - "[ ] Medir INP (Interaction to Next Paint)"
+ - "[ ] Medir CLS (Cumulative Layout Shift)"
+ - "[ ] Identificar elementos problemáticos"
+ - "[ ] Gerar plano de otimização"
+---
+
+# *check-core-web-vitals
+
+Verifica as métricas Core Web Vitals do Google e gera recomendações de otimização.
+
+## Metas (Google Pass)
+
+| Métrica | Meta | Descrição |
+|---------|------|-----------|
+| **LCP** | ≤ 2.5s | Maior elemento visível carregado |
+| **INP** | ≤ 200ms | Resposta a interações do usuário |
+| **CLS** | ≤ 0.1 | Estabilidade visual da página |
+
+## Causas comuns de falha
+
+**LCP alto:**
+- Imagens hero sem lazy loading ou compressão
+- Web fonts bloqueando renderização
+- Servidor lento (TTFB > 600ms)
+
+**CLS alto:**
+- Imagens sem width/height definidos
+- Anúncios/embeds sem espaço reservado
+- Fontes causando layout shift (FOUT)
+
+## Output
+
+```markdown
+# Core Web Vitals — [Projeto]
+
+| Métrica | Score | Meta | Status |
+|---------|-------|------|--------|
+| LCP | [X]s | ≤2.5s | ✅/⚠️/❌ |
+| INP | [X]ms | ≤200ms | ✅/⚠️/❌ |
+| CLS | [X] | ≤0.1 | ✅/⚠️/❌ |
+
+## Ações prioritárias
+1. [ação com maior impacto]
+2. [...]
+```
diff --git a/squads/professional-web-squad/tasks/seo-keyword-research.md b/squads/professional-web-squad/tasks/seo-keyword-research.md
new file mode 100644
index 00000000..b78635de
--- /dev/null
+++ b/squads/professional-web-squad/tasks/seo-keyword-research.md
@@ -0,0 +1,56 @@
+---
+task: Pesquisa de Keywords
+agent: seo-specialist
+responsavel: "@seo-specialist"
+responsavel_type: agent
+atomic_layer: task
+icon: "📈"
+elicit: true
+Entrada: |
+ - segmento: Mercado/nicho do projeto
+ - proposta_de_valor: Proposta de valor definida
+ - localizacao: Localização geográfica alvo (Brasil, SP, etc.)
+Saida: |
+ - keywords_primarias: 3-5 keywords principais com volume estimado
+ - keywords_secundarias: 10-20 keywords de cauda longa
+ - volume_busca: Estimativa de volume mensal
+Checklist:
+ - "[ ] Pesquisar keywords principais do segmento"
+ - "[ ] Identificar intenção de busca"
+ - "[ ] Mapear keywords de cauda longa"
+ - "[ ] Verificar competitividade (baixa/média/alta)"
+ - "[ ] Organizar por prioridade"
+---
+
+# *keyword-research
+
+Pesquisa e mapeia as melhores keywords para posicionar o site nos mecanismos de busca.
+
+## Tipos de intenção de busca
+
+| Intenção | Exemplo | Objetivo |
+|----------|---------|----------|
+| Informacional | "como criar landing page" | Topo do funil |
+| Navegacional | "criação de sites SP" | Meio do funil |
+| Transacional | "contratar designer de sites" | Fundo do funil |
+| Comercial | "melhor agência landing page" | Decisão de compra |
+
+## Output
+
+```markdown
+# Keywords — [Projeto]
+
+## Keywords Primárias
+| Keyword | Volume/mês | Dificuldade | Intenção |
+|---------|-----------|-------------|----------|
+| [kw] | [vol] | [baixa/média/alta] | [tipo] |
+
+## Keywords Secundárias (cauda longa)
+- [keyword 1]
+- [keyword 2]
+[...]
+
+## Recomendação de foco
+**Keyword principal:** [kw]
+**Justificativa:** [razão da escolha]
+```
diff --git a/squads/professional-web-squad/tasks/seo-write-meta.md b/squads/professional-web-squad/tasks/seo-write-meta.md
new file mode 100644
index 00000000..f48f6520
--- /dev/null
+++ b/squads/professional-web-squad/tasks/seo-write-meta.md
@@ -0,0 +1,59 @@
+---
+task: Escrever Meta Tags
+agent: seo-specialist
+responsavel: "@seo-specialist"
+responsavel_type: agent
+atomic_layer: task
+icon: "📈"
+elicit: false
+Entrada: |
+ - copy_aprovado: Copy principal da página
+ - keywords_primarias: Keywords mapeadas
+Saida: |
+ - title_tag: Title tag otimizado (50-60 chars)
+ - meta_description: Meta description (150-160 chars)
+ - og_tags: Open Graph tags para redes sociais
+Checklist:
+ - "[ ] Title tag com keyword primária"
+ - "[ ] Meta description com CTA"
+ - "[ ] OG:title, OG:description, OG:image"
+ - "[ ] Twitter Card tags"
+ - "[ ] Canonical URL"
+---
+
+# *write-meta
+
+Cria todas as meta tags necessárias para SEO e compartilhamento em redes sociais.
+
+## Regras de ouro
+
+**Title tag:**
+- 50-60 caracteres
+- Keyword no início
+- Inclui nome da marca no final
+- Formato: `[Keyword Principal] — [Benefício] | [Marca]`
+
+**Meta description:**
+- 150-160 caracteres
+- Inclui keyword naturalmente
+- Tem um CTA implícito
+- Descreve o benefício real da página
+
+## Output
+
+```html
+
+[keyword] — [benefício] | [Marca]
+
+
+
+
+
+
+
+
+
+
+
+
+```
diff --git a/squads/professional-web-squad/tasks/ui-ux-color-palette.md b/squads/professional-web-squad/tasks/ui-ux-color-palette.md
new file mode 100644
index 00000000..dc616fbb
--- /dev/null
+++ b/squads/professional-web-squad/tasks/ui-ux-color-palette.md
@@ -0,0 +1,60 @@
+---
+task: Criar Paleta de Cores
+agent: ui-ux-expert
+responsavel: "@ui-ux-expert"
+responsavel_type: agent
+atomic_layer: task
+icon: "🎨"
+elicit: true
+Entrada: |
+ - briefing_completo: Briefing com tom e referências da marca
+ - referencias_visuais: Sites ou imagens de referência
+ - publico_alvo: Persona definida
+Saida: |
+ - paleta_cores: Paleta completa com hexadecimais
+ - uso_de_cada_cor: Guia de uso por contexto
+ - acessibilidade: Verificação de contraste WCAG AA
+Checklist:
+ - "[ ] Definir cor primária (identidade)"
+ - "[ ] Definir cor de destaque/CTA"
+ - "[ ] Definir neutras (fundo, texto)"
+ - "[ ] Verificar contraste WCAG AA (4.5:1)"
+ - "[ ] Testar em fundo claro e escuro"
+ - "[ ] Documentar uso correto"
+---
+
+# *color-palette
+
+Cria paleta de cores estratégica baseada em psicologia das cores, identidade de marca e acessibilidade.
+
+## Psicologia das cores por segmento
+
+| Cor | Emoção | Ideal para |
+|-----|--------|-----------|
+| Azul | Confiança, segurança | Finanças, saúde, tech |
+| Verde | Crescimento, natureza | Saúde, sustentabilidade |
+| Laranja | Energia, urgência | CTAs, e-commerce |
+| Roxo | Premium, criatividade | Luxo, design, educação |
+| Vermelho | Urgência, paixão | Promoções, food |
+| Preto | Sofisticação | Luxo, moda |
+
+## Contraste WCAG AA
+
+- Texto normal: mínimo 4.5:1
+- Texto grande (18px+): mínimo 3:1
+- Componentes UI: mínimo 3:1
+
+## Output
+
+```markdown
+# Paleta de Cores — [Projeto]
+
+| Papel | Nome | Hex | Contraste s/ branco |
+|-------|------|-----|---------------------|
+| Primária | [nome] | #XXXXXX | X.X:1 |
+| CTA/Destaque | [nome] | #XXXXXX | X.X:1 |
+| Texto principal | [nome] | #XXXXXX | X.X:1 |
+| Fundo | [nome] | #XXXXXX | — |
+| Fundo alternativo | [nome] | #XXXXXX | — |
+| Alerta/Erro | [nome] | #XXXXXX | X.X:1 |
+```
diff --git a/squads/professional-web-squad/tasks/ui-ux-create-moodboard.md b/squads/professional-web-squad/tasks/ui-ux-create-moodboard.md
new file mode 100644
index 00000000..508caabf
--- /dev/null
+++ b/squads/professional-web-squad/tasks/ui-ux-create-moodboard.md
@@ -0,0 +1,65 @@
+---
+task: Criar Moodboard
+agent: ui-ux-expert
+responsavel: "@ui-ux-expert"
+responsavel_type: agent
+atomic_layer: task
+icon: "🎨"
+elicit: true
+Entrada: |
+ - briefing_completo: Briefing com tom e objetivos
+ - referencias_visuais: URLs ou descrições de referências do cliente
+Saida: |
+ - moodboard: Direção criativa documentada
+ - direcao_criativa: Descrição da estética escolhida
+ - justificativa: Por que essa direção serve ao objetivo
+Checklist:
+ - "[ ] Coletar referências do cliente"
+ - "[ ] Pesquisar referências do mercado"
+ - "[ ] Identificar padrões visuais desejados"
+ - "[ ] Definir adjetivos visuais da marca"
+ - "[ ] Documentar direção criativa"
+ - "[ ] Validar com o cliente"
+---
+
+# *create-moodboard
+
+Cria o moodboard e define a direção criativa visual do projeto antes da execução do design.
+
+## Adjetivos visuais (escolha 3-5)
+
+```
+Moderno | Elegante | Bold | Minimalista | Vibrante
+Profissional | Amigável | Premium | Jovem | Confiável
+Tecnológico | Natural | Orgânico | Limpo | Dinâmico
+```
+
+## Elementos do moodboard
+
+1. **Paleta de humor:** cores que evocam a emoção certa
+2. **Referências de sites:** 3-5 sites com elementos admiráveis
+3. **Referências de tipografia:** exemplos do estilo de texto
+4. **Referências de imagem:** estilo fotográfico ou ilustrativo
+5. **Referências de layout:** grids, espaçamento, ritmo visual
+
+## Output
+
+```markdown
+# Moodboard — [Projeto]
+
+## Adjetivos visuais
+[adjetivo 1], [adjetivo 2], [adjetivo 3]
+
+## Direção criativa
+[Parágrafo descrevendo a estética: "O design deve transmitir X através de Y..."]
+
+## Referências
+- **Layout:** [URL ou descrição]
+- **Tipografia:** [URL ou descrição]
+- **Cores:** [URL ou descrição]
+- **Fotografia/Ícones:** [URL ou descrição]
+
+## O que EVITAR
+- [elemento visual a evitar]
+- [elemento visual a evitar]
+```
diff --git a/squads/professional-web-squad/tasks/ui-ux-review.md b/squads/professional-web-squad/tasks/ui-ux-review.md
new file mode 100644
index 00000000..563579a0
--- /dev/null
+++ b/squads/professional-web-squad/tasks/ui-ux-review.md
@@ -0,0 +1,60 @@
+---
+task: Revisão de UI
+agent: ui-ux-expert
+responsavel: "@ui-ux-expert"
+responsavel_type: agent
+atomic_layer: task
+icon: "🎨"
+elicit: true
+Entrada: |
+ - design_implementado: URL, screenshot ou arquivo do design implementado
+Saida: |
+ - feedback_ui: Feedback detalhado por seção
+ - inconsistencias: Lista de inconsistências visuais
+ - melhorias: Melhorias priorizadas por impacto
+Checklist:
+ - "[ ] Verificar consistência da paleta de cores"
+ - "[ ] Verificar hierarquia tipográfica"
+ - "[ ] Checar alinhamento e espaçamento"
+ - "[ ] Avaliar contraste e acessibilidade"
+ - "[ ] Verificar responsividade (mobile/tablet/desktop)"
+ - "[ ] Avaliar qualidade visual geral"
+ - "[ ] Verificar consistência de componentes"
+---
+
+# *ui-review
+
+Revisa a UI implementada com olhar sênior, identificando inconsistências e oportunidades de melhoria.
+
+## Critérios de avaliação
+
+| Critério | Peso | O que verificar |
+|----------|------|-----------------|
+| Consistência visual | Alta | Cores, fontes, espaçamento padronizados |
+| Hierarquia | Alta | Clareza na ordem de leitura |
+| Contraste | Alta | Legibilidade em todos os elementos |
+| Alinhamento | Média | Grid limpo, sem elementos desalinhados |
+| Espaçamento | Média | Respiração adequada, não sufocado |
+| Responsividade | Alta | Funcional em todos os breakpoints |
+| Microinterações | Baixa | Hover, focus, transições suaves |
+
+## Output
+
+```markdown
+# Revisão UI — [Projeto]
+
+## Score por critério
+| Critério | Score | Status |
+|----------|-------|--------|
+| Consistência | X/10 | ✅/⚠️/❌ |
+[...]
+
+## Issues por seção
+### [Seção]
+- ⚠️ [issue]
+- ❌ [issue crítico]
+
+## Top 5 melhorias prioritárias
+1. [melhoria de maior impacto]
+[...]
+```
diff --git a/squads/professional-web-squad/tasks/ui-ux-typography-scale.md b/squads/professional-web-squad/tasks/ui-ux-typography-scale.md
new file mode 100644
index 00000000..98cbb73a
--- /dev/null
+++ b/squads/professional-web-squad/tasks/ui-ux-typography-scale.md
@@ -0,0 +1,58 @@
+---
+task: Definir Escala Tipográfica
+agent: ui-ux-expert
+responsavel: "@ui-ux-expert"
+responsavel_type: agent
+atomic_layer: task
+icon: "🎨"
+elicit: true
+Entrada: |
+ - guia_de_estilo: Guia de estilo base (se existir)
+ - tom_da_marca: Tom de voz (moderno, clássico, bold, minimalista)
+Saida: |
+ - escala_tipografica: Escala completa de tamanhos e pesos
+ - fontes_selecionadas: Fontes para heading e body
+ - hierarquia: Guia de uso de cada nível
+Checklist:
+ - "[ ] Selecionar fonte para headings"
+ - "[ ] Selecionar fonte para body"
+ - "[ ] Definir escala de tamanhos"
+ - "[ ] Definir pesos (font-weight)"
+ - "[ ] Definir line-height por elemento"
+ - "[ ] Verificar legibilidade em mobile"
+---
+
+# *typography-scale
+
+Define a escala tipográfica completa do projeto, garantindo hierarquia clara e legibilidade em todos os dispositivos.
+
+## Combinações de fontes recomendadas
+
+| Estilo | Heading | Body | Caráter |
+|--------|---------|------|---------|
+| Moderno | Inter | Inter | Clean, tech |
+| Editorial | Playfair Display | Lato | Premium, elegante |
+| Bold | Montserrat | Open Sans | Forte, confiante |
+| Humanista | Nunito | Source Sans | Amigável, acessível |
+
+## Output
+
+```markdown
+# Escala Tipográfica — [Projeto]
+
+## Fontes
+- **Heading:** [fonte] (Google Fonts)
+- **Body:** [fonte] (Google Fonts)
+
+## Escala
+
+| Elemento | Tamanho | Peso | Line-height | Uso |
+|----------|---------|------|-------------|-----|
+| H1 | 56px / 40px mob | 700 | 1.1 | Headline hero |
+| H2 | 40px / 32px mob | 600 | 1.2 | Títulos de seção |
+| H3 | 28px / 24px mob | 600 | 1.3 | Subtítulos |
+| Body L | 18px | 400 | 1.6 | Textos principais |
+| Body | 16px | 400 | 1.6 | Textos gerais |
+| Small | 14px | 400 | 1.5 | Legendas, notas |
+| CTA | 16px | 600 | 1 | Botões |
+```
diff --git a/squads/professional-web-squad/tasks/web-designer-create-wireframe.md b/squads/professional-web-squad/tasks/web-designer-create-wireframe.md
new file mode 100644
index 00000000..22b528d4
--- /dev/null
+++ b/squads/professional-web-squad/tasks/web-designer-create-wireframe.md
@@ -0,0 +1,56 @@
+---
+task: Criar Wireframe
+agent: web-designer
+responsavel: "@web-designer"
+responsavel_type: agent
+atomic_layer: task
+icon: "🖥️"
+elicit: true
+Entrada: |
+ - estrutura_pagina: Seções planejadas e ordenadas
+ - copy_aprovado: Copy ou rascunho de copy disponível
+Saida: |
+ - wireframe_anotado: Wireframe ASCII ou descritivo de cada seção
+ - notas_ux: Anotações de UX e comportamento
+Checklist:
+ - "[ ] Wireframe do Hero (desktop e mobile)"
+ - "[ ] Wireframe de cada seção"
+ - "[ ] Anotar hierarquia visual"
+ - "[ ] Indicar posições de CTA"
+ - "[ ] Notas de comportamento (hover, scroll, animações)"
+---
+
+# *create-wireframe
+
+Cria wireframes anotados de cada seção da página, especificando layout, hierarquia e comportamento.
+
+## Formato de wireframe ASCII
+
+```
+┌─────────────────────────────────────┐
+│ [LOGO] [MENU] [CTA] │ ← Nav: sticky, CTA destaque
+├─────────────────────────────────────┤
+│ │
+│ [HEADLINE PRINCIPAL] │ ← H1: acima da dobra
+│ [Subheadline de apoio] │
+│ │
+│ [CTA PRIMÁRIO] [CTA SECUNDÁRIO] │ ← CTAs: 40px height mín.
+│ │
+│ [Imagem Hero / Vídeo] │ ← Visual: direita no desktop
+│ │
+└─────────────────────────────────────┘
+```
+
+## Output
+
+```markdown
+# Wireframe — [Projeto]
+
+## Seção 1: Hero
+[ASCII wireframe]
+**Notas UX:** [comportamento, animações, responsivo]
+
+## Seção 2: [Nome]
+[ASCII wireframe]
+[...]
+```
diff --git a/squads/professional-web-squad/tasks/web-designer-define-style-guide.md b/squads/professional-web-squad/tasks/web-designer-define-style-guide.md
new file mode 100644
index 00000000..337338cb
--- /dev/null
+++ b/squads/professional-web-squad/tasks/web-designer-define-style-guide.md
@@ -0,0 +1,54 @@
+---
+task: Definir Guia de Estilo
+agent: web-designer
+responsavel: "@web-designer"
+responsavel_type: agent
+atomic_layer: task
+icon: "🖥️"
+elicit: true
+Entrada: |
+ - briefing_completo: Briefing com referências visuais
+ - referencias_visuais: URLs ou descrição de referências
+Saida: |
+ - guia_de_estilo: Documento completo do guia de estilo
+ - cores: Paleta com uso de cada cor
+ - tipografia: Fontes e escala tipográfica
+ - espacamento: Sistema de espaçamento
+Checklist:
+ - "[ ] Definir paleta de cores (primária, secundária, neutras)"
+ - "[ ] Selecionar tipografia (heading + body)"
+ - "[ ] Definir escala de tamanhos"
+ - "[ ] Estabelecer sistema de espaçamento"
+ - "[ ] Definir estilo de botões e inputs"
+ - "[ ] Documentar uso correto e incorreto"
+---
+
+# *define-style-guide
+
+Define o guia de estilo visual completo do projeto, incluindo cores, tipografia, espaçamento e componentes base.
+
+## Output
+
+```markdown
+# Guia de Estilo — [Projeto]
+
+## Cores
+| Uso | Nome | Hex | Onde usar |
+|-----|------|-----|-----------|
+| Primária | [nome] | #XXXXXX | CTAs, destaque |
+| Secundária | [nome] | #XXXXXX | Suporte |
+| Neutra Clara | [nome] | #XXXXXX | Backgrounds |
+| Neutra Escura | [nome] | #XXXXXX | Textos |
+| Alerta | [nome] | #XXXXXX | Erros, avisos |
+
+## Tipografia
+| Elemento | Fonte | Tamanho | Peso |
+|----------|-------|---------|------|
+| H1 | [fonte] | 48-64px | 700 |
+| H2 | [fonte] | 32-40px | 600 |
+| Body | [fonte] | 16-18px | 400 |
+| CTA | [fonte] | 16px | 600 |
+
+## Espaçamento
+Base: 8px | Escala: 8, 16, 24, 32, 48, 64, 96px
+```
diff --git a/squads/professional-web-squad/tasks/web-designer-optimize-above-fold.md b/squads/professional-web-squad/tasks/web-designer-optimize-above-fold.md
new file mode 100644
index 00000000..f4781e44
--- /dev/null
+++ b/squads/professional-web-squad/tasks/web-designer-optimize-above-fold.md
@@ -0,0 +1,51 @@
+---
+task: Otimizar Acima da Dobra
+agent: web-designer
+responsavel: "@web-designer"
+responsavel_type: agent
+atomic_layer: task
+icon: "🖥️"
+elicit: true
+Entrada: |
+ - wireframe_anotado: Wireframe do hero
+ - headline_aprovada: Headline selecionada
+Saida: |
+ - hero_otimizado: Especificação detalhada do hero
+ - recomendacoes_cta: Posição, cor e texto do CTA principal
+Checklist:
+ - "[ ] Garantir headline visível sem scroll"
+ - "[ ] CTA primário acima da dobra"
+ - "[ ] Hierarquia visual clara (H1 → Sub → CTA)"
+ - "[ ] Visual de apoio que reforça a mensagem"
+ - "[ ] Otimizar para mobile first"
+ - "[ ] Verificar contraste e legibilidade"
+---
+
+# *optimize-above-fold
+
+Otimiza a área acima da dobra (hero) para máximo impacto e conversão imediata.
+
+## Checklist de conversão do Hero
+
+- [ ] Headline responde: "O que é isso e por que me importo?"
+- [ ] Subheadline complementa sem repetir
+- [ ] CTA principal em destaque visual claro
+- [ ] Visual reforça a proposta (não decora apenas)
+- [ ] Sem distrações: navegação limpa
+- [ ] Mobile: tudo visível sem scroll no iPhone SE
+
+## Output
+
+```markdown
+# Hero Otimizado — [Projeto]
+
+**Headline:** [texto final]
+**Subheadline:** [texto final]
+**CTA:** [texto] | Cor: [hex] | Posição: [centralizado/esquerda]
+**Visual:** [descrição do elemento visual]
+
+## Especificação técnica
+- Max-width: 1200px
+- Padding: 120px top, 80px bottom
+- Mobile: stack vertical, CTA full-width
+```
diff --git a/squads/professional-web-squad/tasks/web-designer-plan-sections.md b/squads/professional-web-squad/tasks/web-designer-plan-sections.md
new file mode 100644
index 00000000..b09358e0
--- /dev/null
+++ b/squads/professional-web-squad/tasks/web-designer-plan-sections.md
@@ -0,0 +1,55 @@
+---
+task: Planejar Seções da Página
+agent: web-designer
+responsavel: "@web-designer"
+responsavel_type: agent
+atomic_layer: task
+icon: "🖥️"
+elicit: true
+Entrada: |
+ - briefing_completo: Briefing do projeto
+ - objetivo_conversao: Objetivo principal da página
+Saida: |
+ - estrutura_pagina: Lista ordenada de seções
+ - ordem_secoes: Justificativa para ordem escolhida
+ - hierarquia: Importância visual de cada seção
+Checklist:
+ - "[ ] Definir tipo de página (landing / site completo)"
+ - "[ ] Selecionar seções necessárias"
+ - "[ ] Ordenar por jornada do visitante"
+ - "[ ] Definir hierarquia visual"
+ - "[ ] Validar com objetivo de conversão"
+---
+
+# *plan-sections
+
+Planeja a estrutura e ordem das seções da página com base na jornada do visitante e no objetivo de conversão.
+
+## Seções padrão (landing page de conversão)
+
+```
+1. Hero → Capturar atenção (acima da dobra)
+2. Problema → Identificar a dor do visitante
+3. Solução → Apresentar o produto/serviço
+4. Benefícios → Detalhar o valor entregue
+5. Como funciona → Reduzir fricção e incerteza
+6. Prova social → Depoimentos e resultados
+7. Oferta/Preço → Apresentar a proposta comercial
+8. FAQ → Quebrar objeções finais
+9. CTA Final → Provocar a conversão
+10. Rodapé → Confiança e informações legais
+```
+
+## Output
+
+```markdown
+# Estrutura da Página — [Projeto]
+
+| Ordem | Seção | Objetivo | Prioridade |
+|-------|-------|----------|------------|
+| 1 | Hero | [objetivo] | Alta |
+[...]
+
+## Justificativa da ordem
+[Explicação da jornada do visitante]
+```
diff --git a/squads/professional-web-squad/templates/.gitkeep b/squads/professional-web-squad/templates/.gitkeep
new file mode 100644
index 00000000..e69de29b
diff --git a/squads/professional-web-squad/tools/.gitkeep b/squads/professional-web-squad/tools/.gitkeep
new file mode 100644
index 00000000..e69de29b
diff --git a/squads/professional-web-squad/workflows/.gitkeep b/squads/professional-web-squad/workflows/.gitkeep
new file mode 100644
index 00000000..e69de29b