fsolla/teqo
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Compare commits

merge into: fsolla:main
Branches Tags
fsolla:main
fsolla:cheapest-inference-global-worktree-preset
fsolla:C141-perfis-de-permissao-por-assessor-visao-edicao-configura
fsolla:S10-pixel-do-meta-facebook-na-pagina-publica-de-campanha-cam
fsolla:S8-s8-secao-de-video-da-historia-na-home-de-campanha
fsolla:plans/plan-issue-15
fsolla:S9-captura-de-novidades-da-campanha-na-home-publica-form-cta
fsolla:INF3-teqo-deploy-cleanup
fsolla:plans/plan-issue-11
fsolla:S7-cards-da-secao-acompanhe-de-perto-sem-cantos-arredondados
fsolla:plans/plan-issue-12
fsolla:plans/plan-issue-13
fsolla:plans/plan-issue-14
fsolla:OPS62-followup-ci-flake-do-municipalitieswithoutupdatetool-u
fsolla:S4-compartilhar-conteudos-da-home-no-whatsapp
fsolla:OPS69-ops69-admin-do-payload-abre-em-branco-em-producao-impo
fsolla:OPS64-ops64-forgejo-pr-automerge-waitforchecks-conta-o-propr
fsolla:OPS68-docs-drift-github-era-no-agent-ops-readme-gh-pr-vercel
fsolla:OPS67-forgejo-retry-com-backoff-nos-fetchs-do-forgejo-api-fe
fsolla:OPS66-ops66-deploy-build-de-geracao-estatica-le-schema-novo-
fsolla:OPS65-ci-do-main-em-janela-de-30-min-matar-o-agent-pool-work
fsolla:S3-secao-de-conteudos-na-home-de-campanha-instagram
fsolla:OPS62-ci-cancelar-jobs-irmaos-quando-um-job-falha-fail-fast-
fsolla:plans/plan-issue-10
fsolla:S6-FOLLOWUP-e2e-cli-playwright-ignora-filtros-grep-posiciona
fsolla:OPS61-forgejo-contracts-de-merge-flip-quebrados-labels-nao-f
fsolla:OPS63-doc-guard-tambem-no-pre-push-changelog-append-only-agr
fsolla:OPS60-ops60-guard-de-intencao-explicita-para-escrita-no-buck
fsolla:OPS65-ci-main-janela-30min-e-matar-pool
fsolla:plans/plan-issue-9
fsolla:OPS59-pre-push-sem-e2e-e2e-roda-uma-vez-no-ci-gate-local-fic
fsolla:OPS52-media-guard-ops52-media-guard-de-intencao-explicita-pa
fsolla:OPS57-guard-forgejo-pr-automerge-alargar-gatilho-do-workflow
fsolla:OPS58-atualizar-artigos-de-producao-com-os-novos-posts-do-jo
fsolla:plans/plan-issue-8
fsolla:plans/plan-issue-7
fsolla:OPS56-forgejo-pr-automerge-falso-positivo-ja-mergeado-com-pr
fsolla:OPS52-media-ops52-media-recuperar-os-arquivos-de-media-de-pr
fsolla:plans/plan-issue-6
fsolla:plans/plan-issue-5
fsolla:plans/plan-issue-4
fsolla:OPS57-worktree-migra-para-worktrees-teqo
fsolla:S1-secao-de-conteudos-na-home-de-campanha-artigos
fsolla:OPS53-ops53-etapa-de-deploy-no-ci-para-o-homeserver-containe
fsolla:OPS52-migrar-a-media-de-producao-do-vercel-blob-para-o-garag
fsolla:OPS55-worktree-worktrees-root-env
fsolla:PUB5-slogan-da-campanha-mais-saude-mais-futuro-no-hero-e-no-
fsolla:plans/plan-issue-2
fsolla:plans/plan-issue-3
fsolla:plans/plan-issue-1
fsolla:OPS51-migrar-o-banco-de-producao-do-neon-para-o-postgres-do-
fsolla:pool-state
fsolla:OPS50-spike-services
fsolla:plans/ops50-52-migracao-forgejo-neon-blob
...
pull from: fsolla:plans/plan-issue-6
Branches Tags
fsolla:main
fsolla:cheapest-inference-global-worktree-preset
fsolla:C141-perfis-de-permissao-por-assessor-visao-edicao-configura
fsolla:S10-pixel-do-meta-facebook-na-pagina-publica-de-campanha-cam
fsolla:S8-s8-secao-de-video-da-historia-na-home-de-campanha
fsolla:plans/plan-issue-15
fsolla:S9-captura-de-novidades-da-campanha-na-home-publica-form-cta
fsolla:INF3-teqo-deploy-cleanup
fsolla:plans/plan-issue-11
fsolla:S7-cards-da-secao-acompanhe-de-perto-sem-cantos-arredondados
fsolla:plans/plan-issue-12
fsolla:plans/plan-issue-13
fsolla:plans/plan-issue-14
fsolla:OPS62-followup-ci-flake-do-municipalitieswithoutupdatetool-u
fsolla:S4-compartilhar-conteudos-da-home-no-whatsapp
fsolla:OPS69-ops69-admin-do-payload-abre-em-branco-em-producao-impo
fsolla:OPS64-ops64-forgejo-pr-automerge-waitforchecks-conta-o-propr
fsolla:OPS68-docs-drift-github-era-no-agent-ops-readme-gh-pr-vercel
fsolla:OPS67-forgejo-retry-com-backoff-nos-fetchs-do-forgejo-api-fe
fsolla:OPS66-ops66-deploy-build-de-geracao-estatica-le-schema-novo-
fsolla:OPS65-ci-do-main-em-janela-de-30-min-matar-o-agent-pool-work
fsolla:S3-secao-de-conteudos-na-home-de-campanha-instagram
fsolla:OPS62-ci-cancelar-jobs-irmaos-quando-um-job-falha-fail-fast-
fsolla:plans/plan-issue-10
fsolla:S6-FOLLOWUP-e2e-cli-playwright-ignora-filtros-grep-posiciona
fsolla:OPS61-forgejo-contracts-de-merge-flip-quebrados-labels-nao-f
fsolla:OPS63-doc-guard-tambem-no-pre-push-changelog-append-only-agr
fsolla:OPS60-ops60-guard-de-intencao-explicita-para-escrita-no-buck
fsolla:OPS65-ci-main-janela-30min-e-matar-pool
fsolla:plans/plan-issue-9
fsolla:OPS59-pre-push-sem-e2e-e2e-roda-uma-vez-no-ci-gate-local-fic
fsolla:OPS52-media-guard-ops52-media-guard-de-intencao-explicita-pa
fsolla:OPS57-guard-forgejo-pr-automerge-alargar-gatilho-do-workflow
fsolla:OPS58-atualizar-artigos-de-producao-com-os-novos-posts-do-jo
fsolla:plans/plan-issue-8
fsolla:plans/plan-issue-7
fsolla:OPS56-forgejo-pr-automerge-falso-positivo-ja-mergeado-com-pr
fsolla:OPS52-media-ops52-media-recuperar-os-arquivos-de-media-de-pr
fsolla:plans/plan-issue-6
fsolla:plans/plan-issue-5
fsolla:plans/plan-issue-4
fsolla:OPS57-worktree-migra-para-worktrees-teqo
fsolla:S1-secao-de-conteudos-na-home-de-campanha-artigos
fsolla:OPS53-ops53-etapa-de-deploy-no-ci-para-o-homeserver-containe
fsolla:OPS52-migrar-a-media-de-producao-do-vercel-blob-para-o-garag
fsolla:OPS55-worktree-worktrees-root-env
fsolla:PUB5-slogan-da-campanha-mais-saude-mais-futuro-no-hero-e-no-
fsolla:plans/plan-issue-2
fsolla:plans/plan-issue-3
fsolla:plans/plan-issue-1
fsolla:OPS51-migrar-o-banco-de-producao-do-neon-para-o-postgres-do-
fsolla:pool-state
fsolla:OPS50-spike-services
fsolla:plans/ops50-52-migracao-forgejo-neon-blob

2 commits
main ... plans/plan

Author SHA1 Message Date
Francisco Solla
67f32b5602 style(plans S6): prettier no rascunho UI
All checks were successful
Agent PR Ready + auto-merge / ready-automerge (pull_request) Has been skipped
Details
CI (PR) / plans-only-closes (pull_request) Successful in 7s
Details
Main merge flips claimed issues to done + in-prod / issue-done (pull_request) Successful in 14s
Details
CI (PR) / typecheck (pull_request) Has been skipped
Details
CI (PR) / checks (pull_request) Successful in 2s
Details
CI (PR) / format (pull_request) Successful in 52s
Details
CI (PR) / knip (pull_request) Has been skipped
Details
CI (PR) / int (pull_request) Has been skipped
Details
CI (PR) / build (pull_request) Has been skipped
Details
Promote plan-issue Related on main merge / plan-issue-ready (pull_request) Successful in 11s
Details
CI (PR) / cycles (pull_request) Has been skipped
Details
CI (PR) / e2e (1) (pull_request) Has been skipped
Details
CI (PR) / docs-guards (pull_request) Successful in 9s
Details
Agent pool supervisor / tick (pull_request) Successful in 37s
Details
CI (PR) / scope (pull_request) Successful in 33s
Details
CI (PR) / lint (pull_request) Successful in 43s
Details
CI (PR) / unit (pull_request) Has been skipped
Details
CI (PR) / e2e (2) (pull_request) Has been skipped
Details
2026-08-18 07:55:50 -03:00
Francisco Solla
a114277a83 plan(S6): home de campanha sem carrossel no desktop — grade 3x2 nas bandeiras 2026-08-18 07:55:03 -03:00
4 changed files with 351 additions and 0 deletions
Show stats Expand all files Collapse all files

BIN
docs/plans/home-campanha-sem-carrossel-desktop-ui-draft-desktop.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 144 KiB

BIN
docs/plans/home-campanha-sem-carrossel-desktop-ui-draft-mobile.png Normal file
View file

Binary file not shown.
Side by side

After

Width:  |  Height:  |  Size: 74 KiB

263
docs/plans/home-campanha-sem-carrossel-desktop-ui-draft.html Normal file
View file

@ -0,0 +1,263 @@
<!doctype html>
<html lang="pt-BR">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<script src="https://cdn.jsdelivr.net/npm/@tailwindcss/browser@4"></script>
<title>UI draft — Home de campanha sem carrossel no desktop</title>
</head>
<body class="bg-zinc-950 text-zinc-100 antialiased">
<main class="mx-auto max-w-6xl p-8">
<p class="max-w-3xl text-sm text-zinc-400">
Visitante da home pública de campanha (jorgesolla1313) em desktop. As seções "Por que essa
eleição importa" (3 cards) e "Nossa caminhada" (6 cards) deixam de ser carrossel no desktop:
todo o conteúdo fica visível de uma vez. Mobile (~390px) mantém o carrossel atual.
</p>
<!-- ============ CENA: desktop ============ -->
<section data-shot="desktop" class="mt-8 rounded-2xl bg-white p-8 text-zinc-900 shadow-xl">
<p class="mb-6 text-center text-xs font-bold tracking-widest text-zinc-500 uppercase">
Desktop ≥ 1024px — conteúdo inteiro visível, sem carrossel
</p>
<!-- ===== SEÇÃO: Por que essa eleição importa ===== -->
<div class="rounded-xl bg-zinc-900 px-8 pt-7 pb-8 text-white">
<p class="text-[11px] font-extrabold tracking-[0.14em] text-zinc-400 uppercase">
Por que essa eleição importa
</p>
<h2 class="mt-3 max-w-[616px] text-2xl leading-tight font-extrabold">
Eleger deputado é coisa séria<br /><span class="text-zinc-300"
>O Congresso tem nas mãos vidas reais e o SUS</span
>
</h2>
<p class="mt-3 max-w-[716px] text-sm leading-relaxed text-zinc-300">
É no Congresso que se define o orçamento do SUS, o piso da enfermagem, a recompra de
Mataripe e o fim da escala 6×1. Reeleger Lula não basta: é preciso eleger uma bancada
aliada.
</p>
<!-- 3 cards lado a lado -->
<div class="mt-7 flex gap-[21px]">
<!-- card 1 -->
<div class="w-[355px] overflow-hidden rounded-[10px] bg-zinc-800">
<div
class="flex h-[280px] items-center justify-center bg-zinc-600 text-xs font-semibold text-zinc-300"
>
foto (fundo.avif)
</div>
<div class="p-4">
<h3 class="text-[15px] leading-snug font-bold">Pelo fim da escala 6x1!</h3>
<p class="mt-1.5 text-xs leading-relaxed text-zinc-400">
Jornadas longas aumentam o risco de AVC e infarto. Descanso é saúde pública…
</p>
</div>
</div>
<!-- card 2 -->
<div class="w-[355px] overflow-hidden rounded-[10px] bg-zinc-800">
<div
class="flex h-[280px] items-center justify-center bg-zinc-600 text-xs font-semibold text-zinc-300"
>
foto (53569851134_02afc18fb4_o.avif)
</div>
<div class="p-4">
<h3 class="text-[15px] leading-snug font-bold">Pra valorizar o SUS</h3>
<p class="mt-1.5 text-xs leading-relaxed text-zinc-400">
O SUS é o sistema de saúde de todo brasileiro. Com Lula, a saúde voltou a receber
recursos…
</p>
</div>
</div>
<!-- card 3 -->
<div class="w-[355px] overflow-hidden rounded-[10px] bg-zinc-800">
<div
class="flex h-[280px] items-center justify-center bg-zinc-600 text-xs font-semibold text-zinc-300"
>
foto (52396285023_561ffc0ff6_o.avif)
</div>
<div class="p-4">
<h3 class="text-[15px] leading-snug font-bold">Pra defender os baianos</h3>
<p class="mt-1.5 text-xs leading-relaxed text-zinc-400">
A Refinaria de Mataripe foi vendida no governo Bolsonaro e segue nas mãos de
estrangeiros…
</p>
</div>
</div>
</div>
</div>
<div class="h-6" aria-hidden="true"></div>
<!-- ===== SEÇÃO: Nossa caminhada ===== -->
<div class="rounded-xl bg-zinc-100 px-8 pt-7 pb-8 text-zinc-900">
<p class="text-[11px] font-extrabold tracking-[0.14em] text-red-700 uppercase">
Nossa caminhada
</p>
<h2 class="mt-3 max-w-[664px] text-2xl leading-tight font-extrabold">
Junto com o trabalhador e<br /><span class="text-red-700"
>do lado de quem mais precisa, sempre.</span
>
</h2>
<p class="mt-3 max-w-[730px] text-sm leading-relaxed text-zinc-500">
Não é promessa de palanque, é a experiência de quem já fez na gestão do SUS, do
Ministério da Saúde e da saúde da Bahia.
</p>
<!-- sem chips: grade 3 colunas x 2 linhas -->
<div class="mt-7 grid grid-cols-3 gap-[14px]">
<div class="rounded-[10px] bg-white p-4">
<h3 class="text-sm leading-snug font-bold">Defender o SUS e valorizar quem cuida</h3>
<p class="mt-1.5 text-xs leading-relaxed text-zinc-500">
Saúde é direito, não mercadoria. Fim do subfinanciamento, piso da enfermagem e dos
agentes pagos…
</p>
</div>
<div class="rounded-[10px] bg-white p-4">
<h3 class="text-sm leading-snug font-bold">Fim da escala 6×1 e jornada de 40h</h3>
<p class="mt-1.5 text-xs leading-relaxed text-zinc-500">
Sem redução de salário. Jornada longa é questão de saúde pública: quem trabalha
demais adoece…
</p>
</div>
<div class="rounded-[10px] bg-white p-4">
<h3 class="text-sm leading-snug font-bold">
Educação em tempo integral e federais no interior
</h3>
<p class="mt-1.5 text-xs leading-relaxed text-zinc-500">
IFs, campus federal, escola de tempo integral: o interior não pode ficar para trás…
</p>
</div>
<div class="rounded-[10px] bg-white p-4">
<h3 class="text-sm leading-snug font-bold">Recomprar a Refinaria de Mataripe</h3>
<p class="mt-1.5 text-xs leading-relaxed text-zinc-500">
Recomprar a refinaria é defender a Bahia e a soberania do Brasil. Preço justo de
combustível…
</p>
</div>
<div class="rounded-[10px] bg-white p-4">
<h3 class="text-sm leading-snug font-bold">
Salário mínimo forte, emprego e moradia
</h3>
<p class="mt-1.5 text-xs leading-relaxed text-zinc-500">
Valorização do mínimo, Bolsa Família, Minha Casa Minha Vida e agricultura familiar
como motor…
</p>
</div>
<div class="rounded-[10px] bg-white p-4">
<h3 class="text-sm leading-snug font-bold">Defesa intransigente da democracia</h3>
<p class="mt-1.5 text-xs leading-relaxed text-zinc-500">
Participação popular, instituições fortes e combate à desinformação. Eleger o
parlamento é coisa séria…
</p>
</div>
</div>
</div>
</section>
<!-- ============ CENA: mobile (referência — carrossel mantido) ============ -->
<section
data-shot="mobile"
class="mt-8 w-[390px] rounded-2xl bg-zinc-900 p-8 text-white shadow-xl"
>
<p class="mb-6 text-center text-[11px] font-bold tracking-widest text-zinc-500 uppercase">
Mobile ~390px — carrossel atual preservado (referência)
</p>
<!-- problema: 1 card por tela + dots -->
<div class="rounded-xl bg-zinc-950 p-5">
<p class="text-[10px] font-extrabold tracking-[0.14em] text-zinc-400 uppercase">
Por que essa eleição importa
</p>
<h2 class="mt-2 text-lg leading-tight font-extrabold">
Eleger deputado é coisa séria<br /><span class="text-zinc-300"
>O Congresso tem nas mãos vidas reais e o SUS</span
>
</h2>
<p class="mt-2 text-xs leading-relaxed text-zinc-400">
É no Congresso que se define o orçamento do SUS, o piso da enfermagem, a recompra de
Mataripe e o fim da escala 6×1…
</p>
<div class="mt-4 w-[355px] max-w-full overflow-hidden rounded-[10px] bg-zinc-800">
<div
class="flex h-[240px] items-center justify-center bg-zinc-600 text-xs font-semibold text-zinc-300"
>
foto (fundo.avif)
</div>
<div class="p-4">
<h3 class="text-[15px] leading-snug font-bold">Pelo fim da escala 6x1!</h3>
<p class="mt-1.5 text-xs leading-relaxed text-zinc-400">
Jornadas longas aumentam o risco de AVC e infarto…
</p>
</div>
</div>
<!-- dots -->
<div class="mt-3 flex items-center justify-center gap-1.5" aria-hidden="true">
<span class="h-1.5 w-6 rounded-full bg-zinc-300"></span>
<span class="h-1.5 w-1.5 rounded-full bg-zinc-600"></span>
<span class="h-1.5 w-1.5 rounded-full bg-zinc-600"></span>
</div>
<p class="mt-2 text-center text-[10px] text-zinc-500">1 de 3 · auto-avanço ~4s</p>
</div>
<div class="h-5" aria-hidden="true"></div>
<!-- bandeiras: chips + 1 card por tela -->
<div class="rounded-xl bg-zinc-100 p-5 text-zinc-900">
<p class="text-[10px] font-extrabold tracking-[0.14em] text-red-700 uppercase">
Nossa caminhada
</p>
<h2 class="mt-2 text-lg leading-tight font-extrabold">
Junto com o trabalhador e<br /><span class="text-red-700"
>do lado de quem mais precisa, sempre.</span
>
</h2>
<p class="mt-2 text-xs leading-relaxed text-zinc-500">
Não é promessa de palanque, é a experiência de quem já fez na gestão do SUS…
</p>
<!-- chips -->
<div class="mt-4 flex gap-1.5 overflow-hidden" aria-hidden="true">
<span
class="rounded-full bg-zinc-800 px-3 py-1.5 text-[10px] font-bold text-white uppercase"
>
Saúde
</span>
<span
class="rounded-full bg-zinc-300 px-3 py-1.5 text-[10px] font-bold text-zinc-500 uppercase"
>
Educação
</span>
<span
class="rounded-full bg-zinc-300 px-3 py-1.5 text-[10px] font-bold text-zinc-500 uppercase"
>
Renda
</span>
<span
class="rounded-full bg-zinc-300 px-3 py-1.5 text-[10px] font-bold text-zinc-500 uppercase"
>
Democracia
</span>
<span
class="rounded-full bg-zinc-300 px-3 py-1.5 text-[10px] font-bold text-zinc-500 uppercase"
>
Bahia
</span>
<span
class="rounded-full bg-zinc-300 px-3 py-1.5 text-[10px] font-bold text-zinc-500 uppercase"
>
Trabalho
</span>
</div>
<div class="mt-3 rounded-[10px] bg-white p-4">
<h3 class="text-sm leading-snug font-bold">Defender o SUS e valorizar quem cuida</h3>
<p class="mt-1.5 text-xs leading-relaxed text-zinc-500">
Saúde é direito, não mercadoria. Fim do subfinanciamento, piso da enfermagem e dos
agentes pagos, concursos públicos, vacinação e ciência.
</p>
</div>
<p class="mt-2 text-center text-[10px] text-zinc-500">
1 de 6 · deslize para ver as próximas
</p>
</div>
</section>
</main>
</body>
</html>

88
docs/plans/home-campanha-sem-carrossel-desktop.md Normal file
View file

@ -0,0 +1,88 @@
# Home de campanha sem carrossel no desktop — "Por que essa eleição importa" + "Nossa caminhada" (S6)
Status: registrado
Atualizado em: 2026-08-18
Issue: #34
Priority: P2
Model: composer-2.5
Impeccable: B — mudança de layout em duas seções visíveis da home pública de campanha
Rascunho UI: docs/plans/home-campanha-sem-carrossel-desktop-ui-draft.html + PNGs embutidos abaixo
Appetite: ~0,5–1 dia eng; só layout responsivo, sem dados novos
Responsável: —
## Intenção
As duas seções centrais de mensagem da home pública (jorgesolla1313.com.br) rodam carrossel em **todas** as larguras, com auto-avanço (~4s). No desktop o conteúdo inteiro cabe na página — não há motivo para o carrossel ativo: ele esconde cards, impõe ritmo de leitura e move a tela sozinho. Quem visita em desktop (imprensa, parceiros, eleitor no computador) deve ver toda a mensagem de uma vez: os 3 cards de "Por que essa eleição importa" lado a lado e os 6 cards de "Nossa caminhada" em grade 3 colunas × 2 linhas. O mobile (maioria do tráfego, onde o carrossel faz sentido) fica exatamente como está.
## Persona e fluxo
- **Persona / contexto:** visitante em desktop (imprensa, parceiros, eleitor no computador) rolando a home de campanha; lê com calma e não tem o gesto de swipe do mobile.
- **Job principal:** entender os argumentos da campanha sem esperar o auto-avanço nem perder cards ocultos.
- **Fluxo desejado:** rola a home → seção "Por que essa eleição importa" mostra os 3 cards inteiros → continua → seção "Nossa caminhada" mostra as 6 bandeiras em grade → lê tudo no seu ritmo.
- **Anti-goals de produto:** o mobile NÃO muda (carrossel segue); a seção "Acompanhe de perto" (S1, já em bento no desktop) NÃO é tocada; nada de redesenho de cards/copy/imagens.
### Rascunho UI (B)
![Rascunho UI — desktop](home-campanha-sem-carrossel-desktop-ui-draft-desktop.png)
![Rascunho UI — mobile (referência: carrossel preservado)](home-campanha-sem-carrossel-desktop-ui-draft-mobile.png)
Fonte iterável: [`home-campanha-sem-carrossel-desktop-ui-draft.html`](home-campanha-sem-carrossel-desktop-ui-draft.html).
## Objetivo e aceite
- Desktop (≥1024px): "Por que essa eleição importa" mostra os **3 cards lado a lado**, todos visíveis, sem auto-avanço, sem rolagem oculta e sem indicadores de carrossel.
- Desktop (≥1024px): "Nossa caminhada" mostra os **6 cards em grade 3 colunas × 2 linhas**, sem auto-avanço; os chips de navegação não aparecem no desktop (ver questões em aberto).
- Mobile (<1024px): comportamento atual 100% preservado (carrossel 1 card por tela, auto-avanço ~4s com pausa em hover/foco/toque, chips sincronizados, swipe).
- Mesma copy, mesmas imagens, mesma ordem de cards; nenhuma mudança de conteúdo.
- As seções continuam sem sobreposição e com respiro (alturas recalibradas para o conteúdo inteiro visível).
- Acessibilidade: no desktop, nada de foco em elemento inativo de carrossel; a leitura não é interrompida por movimento.
- Zero mudança de schema/migration/Consent; zero dados novos.
## Dados (intenção)
- **Vou apresentar dados?** Não — só layout de conteúdo já existente (cards estáticos).
- **Decisões desbloqueadas:** nenhuma nova (a pessoa lê os cards no próprio ritmo).
- **Forma:** _adiada ao plano de implementação_ — restrição de produto: sem contadores, sem elementos novos.
## Direção no codebase (hipótese)
- **Áreas prováveis:** `src/app/(frontend)/(home)/page.tsx` (seções `problem` e `flags`, itens `problemItems`/`flagItems`); `src/components/CampaignCarousel.tsx` (componente compartilhado das duas seções — como o desktop deixa de ser carrossel fica a critério de quem executa: variante estática em `lg` ou estado desativado no desktop); bloco `[data-theme='campaign-site']` de `src/app/(frontend)/styles.css` (alturas fixas das seções, posicionamento absoluto de eyebrow/título/copy/carrossel, insets e gaps do track).
- **Precedente a olhar:** `docs/plans/secao-conteudos-home-artigos.md`/`-impl.md` (S1 — a seção "Acompanhe de perto" já resolveu bento no desktop + carrossel no mobile, com `CampaignContentCarousel`, módulo separado); e2e `tests/e2e/frontend.e2e.spec.ts` (o teste de auto-avanço/controles hoje roda em viewport desktop — precisa virar asserção de grade estática no desktop e/ou migrar o teste de carrossel para viewport mobile); unit `tests/unit/campaignCarousel.unit.spec.tsx` (comportamento mobile do componente permanece).
- **Risco de acoplamento:** as duas seções usam altura fixa com elementos posicionados em absoluto (eyebrow/título/copy/carrossel em `top:` com `clamp`) — a troca para grade exige recalibrar as alturas para o conteúdo inteiro visível; a seção S1 usa `CampaignContentCarousel` (módulo próprio) e não é afetada.
## Dependências
- Nenhuma.
- Soft: `docs/plans/secao-conteudos-home-artigos.md` (S1) — referência de como a home já resolveu "bento no desktop + carrossel no mobile".
## Fora de escopo
- Mudar o comportamento mobile (carrossel preservado).
- Redesenhar cards, copy, imagens, cores ou espaçamento interno das seções — só a disposição (grade) e os elementos de carrossel.
- Remover o carrossel da seção "Acompanhe de perto" (S1 já é bento no desktop).
- Layout dedicado novo para tablets (segue carrossel abaixo de 1024px, como hoje).
- Qualquer outra seção da home ou do site.
## Rabbit holes de produto
- **Redesenho dos cards de bandeira no desktop.** Se alguém "só completar": entra foto/ícone/cor por bandeira, reescreve copy, e o item vira redesign de seção. **Corte neste item:** mantém o card atual (título + corpo) só mudando a disposição para grade 3×2.
- **Ajustes de respiro em outras seções.** Se alguém "só completar": recalibra hero, prova social e S1 junto. **Corte:** só as alturas das duas seções afetadas, o mínimo para a grade caber.
- **"Melhorar" o carrossel no meio do caminho.** Se alguém "só completar": troca o comportamento mobile junto. **Corte:** mobile é intocável neste item.
## Questões em aberto (produto)
- **Chips de "Nossa caminhada" no desktop?** **Opções:** A) somem no desktop (a grade estática é a navegação; chip é chrome de carrossel) | B) ficam como rótulos estáticos não-clicáveis acima da grade | C) viram âncoras para a própria seção. **Recomendação:** A — na grade, chips não têm função e pareceriam clicáveis sem efeito. _(assumido — A, validar no gate)_
- **Proporção dos cards de bandeira no desktop?** **Opções:** A) grade 3×2 com cards preenchendo a coluna (~374px de largura, altura definida pelo conteúdo com respiro — rascunho acima) | B) manter o card horizontal baixo atual (~327×100) forçando 3 colunas estreitas. **Recomendação:** A — o card baixo existe porque o carrossel empilha; na grade, título + corpo respiram melhor. _(assumido — A, validar no gate)_
- **Breakpoint da grade?** **Opções:** A) `lg` (1024px, o mesmo do carrossel atual) | B) outro valor. **Recomendação:** A — manter o breakpoint que já governa as larguras dos cards. _(assumido — A)_
- **Nome da seção dos 6 cards.** O pedido chama de "Nossa campanha"; no site a seção se chama **"Nossa caminhada"** (eyebrow, mesma que usa o carrossel de 6 cards). Confirmar que é esta — assumido que sim, dada a grade 3×2.
## Referências
- GitHub Issue #34
- Rascunho UI (gate): `docs/plans/home-campanha-sem-carrossel-desktop-ui-draft.html` + PNGs acima
- `src/app/(frontend)/(home)/page.tsx` — seções `problem` (3 cards) e `flags` (6 cards)
- `src/components/CampaignCarousel.tsx` — componente carrossel das duas seções (variants `problem`/`flags`)
- `src/app/(frontend)/styles.css` — alturas/posicionamento das seções, insets/gaps do track
- `tests/e2e/frontend.e2e.spec.ts` — testes de auto-avanço/controles (hoje em viewport desktop)
- `docs/plans/secao-conteudos-home-artigos.md` (S1) — precedente bento desktop + carrossel mobile