docs: planejar hero full-bleed da home

docs/superpowers/plans/2026-08-11-full-bleed-home-hero.md

@@ -0,0 +1,81 @@
+# Hero full-bleed da home Implementation Plan
+
+> **For agentic workers:** REQUIRED: Use superpowers:subagent-driven-development (if subagents available) or superpowers:executing-plans to implement this plan. Steps use checkbox (`- [ ]`) syntax for tracking.
+
+**Goal:** Fazer a fotografia configurada do hero da home preencher toda a coluna direita abaixo do header, preservando a leitura editorial e o fallback sem foto.
+
+**Architecture:** `x-home.hero` continuará a renderizar as duas variantes. A variante com imagem usará uma grade full-width com a coluna textual ancorada à régua global e a mídia como segundo trilho sem container; a variante tonal permanece contida. Os testes de feature e browser documentam os contratos de markup, tamanho e responsividade.
+
+**Tech Stack:** Laravel Blade, Tailwind CSS 4 utilities, Pest feature/browser tests, Vite.
+
+---
+
+## Chunk 1: Layout e contratos do hero
+
+### Task 1: Cobrir o spread full-bleed
+
+**Files:**
+- Modify: `tests/Feature/PublicSite/ImmersivePhotoHeroTest.php`
+- Modify: `tests/Browser/HomeEditorialCadenceTest.php`
+
+- [ ] **Step 1: Escrever as expectativas de feature para a variante com foto**
+
+Exigir `data-split-hero`, `data-hero-content`, `data-motion="page-open"`, `data-reveal-group`, `aria-labelledby="hero-heading"`, `loading="eager"`, `fetchpriority="high"` e `sizes="(max-width: 767px) 100vw, 55vw"`. Com `hero_image_path` nulo, exigir `data-tonal-hero`, os mesmos atributos de motion/semântica, ausência de `data-split-hero` e ausência de `<img` dentro de `[data-tonal-hero]`.
+
+- [ ] **Step 2: Estender a verificação browser de geometria**
+
+No viewport 1440×1000, obter os retângulos de `.site-header`, `[data-chapter="hero"]`, `[data-hero-content]` e `[data-split-hero]`; esperar, com tolerância de 1px, que `hero.top === header.bottom`, `media.top === hero.top`, `media.bottom === hero.bottom`, `media.right === innerWidth` e `hero.height === innerHeight - header.height`. No viewport 390×844, comparar `data-split-hero` com `[data-hero-content]`; esperar que a mídia inicie depois do conteúdo, que `width / height` fique entre 0,79 e 0,81, e que não exista overflow horizontal. Antes das duas visitas de fallback, zerar `hero_image_path`; numa visita com reduced motion, esperar conteúdo visível. Em outra com `reducedMotion: no-preference` e `IntersectionObserver` desabilitado antes da navegação, esperar ausência de `data-motion` em `document.documentElement`, cada `[data-motion="page-open"]` com `.is-active`, cada `[data-reveal]` com `.is-revealed` e `aria-labelledby="hero-heading"`.
+
+- [ ] **Step 3: Executar os testes focados e confirmar a falha inicial**
+
+Run: `php artisan test tests/Feature/PublicSite/ImmersivePhotoHeroTest.php && php artisan test tests/Browser/HomeEditorialCadenceTest.php`
+
+Expected: falha nas novas expectativas de geometria/markup até a alteração do componente.
+
+### Task 2: Implementar a grade full-bleed
+
+**Files:**
+- Modify: `resources/views/components/home/hero.blade.php`
+
+- [ ] **Step 1: Separar a variante com imagem do container compartilhado**
+
+Substituir `min-h-[100dvh]` do `<section>` por `md:h-[calc(100dvh-5.5rem)]` quando `hero_image_path` estiver preenchido e renderizar um wrapper `grid min-h-[calc(100dvh-5.5rem)] md:h-full md:grid-cols-[minmax(0,0.9fr)_minmax(0,1.1fr)]`. A coluna de texto deve manter `data-reveal-group`, receber `data-hero-content`, ter `padding-left: max(var(--amare-container-padding), calc((100vw - var(--amare-container-max)) / 2 + var(--amare-container-padding)))`, padding direito fluido e centralização vertical.
+
+- [ ] **Step 2: Tornar a mídia contínua**
+
+Aplicar ao bloco `data-split-hero` `overflow-hidden`, `bg-amare-bg-deep`, `md:min-h-full`; abaixo de `md`, aplicar `aspect-[4/5]`. Manter `data-motion-beat="media"`, `data-reveal-media`, `object-cover`, path/alt CMS e mudar `sizes` para `(max-width: 767px) 100vw, 55vw`.
+
+- [ ] **Step 3: Preservar o fallback**
+
+Manter o wrapper tonal existente para hero sem imagem, com `data-tonal-hero`, `data-motion="page-open"` e `data-reveal-group`; não renderizar o bloco de mídia nessa variante.
+
+- [ ] **Step 4: Executar os testes focados e confirmar a passagem**
+
+Run: `php artisan test tests/Feature/PublicSite/ImmersivePhotoHeroTest.php && php artisan test tests/Browser/HomeEditorialCadenceTest.php`
+
+Expected: PASS.
+
+### Task 3: Verificar e registrar
+
+**Files:**
+- Modify: `resources/views/components/home/hero.blade.php`
+- Modify: `tests/Feature/PublicSite/ImmersivePhotoHeroTest.php`
+- Modify: `tests/Browser/HomeEditorialCadenceTest.php`
+
+- [ ] **Step 1: Formatar e executar as verificações proporcionais**
+
+Run: `composer pint && composer phpstan && composer test:feature && composer test:browser && npm run build`
+
+Expected: todos os comandos passam.
+
+- [ ] **Step 2: Inspecionar o diff e registrar**
+
+Run: `git diff --check && git status --short`
+
+Expected: apenas os três arquivos de implementação/testes e a documentação deste plano/especificação aparecem como escopo.
+
+- [ ] **Step 3: Commit**
+
+Run: `git add resources/views/components/home/hero.blade.php tests/Feature/PublicSite/ImmersivePhotoHeroTest.php tests/Browser/HomeEditorialCadenceTest.php docs/superpowers && git commit -m "feat(home): tornar hero fotográfico full-bleed"`
+
+Expected: commit focado, sem artefatos de build ou screenshots.

docs/superpowers/specs/2026-08-11-full-bleed-home-hero-design.md

@@ -7,7 +7,7 @@ Dar à fotografia do hero da home a mesma presença contínua da referência apr
 ## Escopo
 
 - Alterar somente o componente `resources/views/components/home/hero.blade.php` e seus testes diretos.
-- Quando `hero_image_path` existir, usar uma grade externa `0.9fr / 1.1fr` a partir de `md` (768px), com altura mínima `calc(100dvh - 5.5rem)`: o espaço restante depois do header desktop. A mídia deve chegar ao topo e à base da seção, sem padding vertical ou lateral de container.
+- Quando `hero_image_path` existir, usar uma grade externa `0.9fr / 1.1fr` a partir de `md` (768px), com altura exata `calc(100dvh - 5.5rem)`: o espaço restante depois do header desktop. A mídia deve chegar ao topo e à base da seção, sem padding vertical ou lateral de container.
 - Manter o texto, CTAs, imagem CMS, `alt`, carregamento eager, `fetchpriority`, responsividade de imagem e atributos de motion existentes.
 - Abaixo de `md`, manter a ordem texto seguido de imagem, sem overflow horizontal, e fixar a mídia em `aspect-ratio: 4 / 5` com `object-cover`.
 - Quando não houver imagem configurada, manter a abertura tonal, tipográfica e contida já existente, sem área vazia para mídia.
@@ -19,11 +19,11 @@ Dar à fotografia do hero da home a mesma presença contínua da referência apr
 
 ## Estrutura
 
-O componente continuará sendo a única unidade de layout do hero. A variante com foto terá um wrapper full-width em desktop. A coluna textual terá como margem esquerda `max(var(--amare-container-padding), calc((100vw - var(--amare-container-max)) / 2 + var(--amare-container-padding)))`, a mesma régua esquerda de `container-amare`, e padding direito fluido para não comprimir a leitura. O bloco de mídia ocupará os 55% da grade, receberá `data-split-hero` e `data-reveal-media`, e deixará de ficar limitado pelo container. O atributo `sizes` será `(max-width: 767px) 100vw, 55vw`. A variante sem foto permanece no wrapper atual.
+O componente continuará sendo a única unidade de layout do hero. A variante com foto terá um wrapper full-width em desktop. A coluna textual terá `data-hero-content`, margem esquerda `max(var(--amare-container-padding), calc((100vw - var(--amare-container-max)) / 2 + var(--amare-container-padding)))`, a mesma régua esquerda de `container-amare`, e padding direito fluido para não comprimir a leitura. O bloco de mídia ocupará os 55% da grade, receberá `data-split-hero` e `data-reveal-media`, e deixará de ficar limitado pelo container. O atributo `sizes` será `(max-width: 767px) 100vw, 55vw`. A variante sem foto permanece no wrapper atual.
 
 ## Critérios de aceitação
 
-- Em desktop, `data-split-hero` inicia sob o header e mede pelo menos `calc(100dvh - 5.5rem)`, sem margens externas de container.
+- Em desktop, `data-split-hero` inicia sob o header e mede `calc(100dvh - 5.5rem)`, sem margens externas de container.
 - A foto usa `object-cover`, `loading="eager"`, `fetchpriority="high"`, path/alt próprios do hero e `sizes="(max-width: 767px) 100vw, 55vw"`.
 - Em mobile, o conteúdo essencial continua acessível antes da foto, sem overflow nem texto recortado.
 - O fallback sem foto continua com `data-tonal-hero`, sem `data-split-hero` e sem mídia renderizada.