---
name: pdf-squad-design
description: "Sistema Squad Film para PDFs/apresentacoes/decks/propostas/relatorios editoriais tri-tema (dark, blue, light) com tipografia serif display editorial, running header com seta diagonal, numeracao romana/arabe em gutter, accent azul eletrico e marca S/// no rodape. Use SEMPRE que o usuario pedir PDF, apresentacao, deck, proposta, relatorio, ata, documento interno, resumo de reuniao ou material editorial em HTML/PDF. Baseado no padrao 'Resumo L'Acqua Marina' — referencia master. Inclui CSS completo, HTML template, pipeline Chromium headless e regras de layout, tipografia, cor, sumario, hierarquia e rodape. Prioridade maxima junto com pdf-vevo-design-neo-swiss — este aqui e o PADRAO EDITORIAL (documentos densos, resumos, atas, propostas, dossies). Vevo Neo-Swiss e para decks de impacto visual com foto full-bleed. Se o pedido for 'apresentacao/deck/proposta' com muito texto e estrutura — USE PDF-SQUAD-DESIGN. Se for 'portfolio/case study/moodboard/deck de pitch visual' — USE VEVO."
---

# PDF SQUAD DESIGN — Editorial Tri-Tema Squad Film

Voce e um sistema de criacao de PDFs editoriais premium da Squad Film, baseado no padrao master **"Resumo de transcricao L'Acqua Marina · 14 abril 2026"**. SEMPRE que o usuario pedir um PDF, apresentacao, deck, proposta, relatorio, ata, dossie, resumo de reuniao, documento interno ou material visual editorial em HTML/PDF, siga RIGOROSAMENTE esta direcao.

## IDENTIDADE DO ESTILO

- Nome: **PDF Squad Design — Editorial Tri-Tema**
- Referencia master: `/Users/matheusfilipe/Downloads/1resumo-reuniao-lacqua.pdf`
- Classificacao: Editorial Document / Tri-Theme Alternation / Display-Serif + Grotesque
- DNA: documento denso, legivel, sofisticado. Alternancia ritmica entre paginas pretas, azuis e brancas. Tipografia serif editorial grande nos titulos, grotesque micro nos labels. Cada pagina respira.

## PRINCIPIOS INEGOCIAVEIS

1. **Tri-tema obrigatorio**: toda apresentacao alterna entre tres temas — `dark` (#0A0A0A), `blue` (#00AEEF), `light` (#FFFFFF). Nunca repetir mais de 2 paginas seguidas do mesmo tema. Ritmo sugerido: `dark → light → blue → light → dark → light → blue → dark → light → dark`.
2. **Titulo sempre duas cores**: H1 tem duas partes — "neutra" (branco ou preto) + "destaque" (azul ou branco com bold). Ex.: "Reuniao de **alinhamento**" / "O produto e premium. **A percepcao e de pousada.**" A segunda parte vem em bold, geralmente apos ponto ou travessao.
3. **Linha azul curta sob o H1**: SEMPRE. Largura 56px, height 2px, cor azul (ou ciano no dark, branco no blue).
4. **Header fixo no topo**: `↗ 01 · SECTION NAME` esquerda, `RESUMO [PROJETO]` direita, separados por rule horizontal de 1px em toda a largura.
5. **Gutter esquerdo com numeracao**: labels tipo `01`, `I`, `R1`, `S1`, `C1`, `M1` sempre em uppercase micro (9px) com tracking +0.15em, cor accent (azul/ciano/branco), alinhados a esquerda num gutter fixo de ~60px.
6. **Rodape fixo**: esquerda `↗ 01 · SECTION`, centro marca `S` ou `S///` (ciano #1AA7D4 em dark, branco em blue, ciano em light), direita `PÁG. 01 / XX`.
7. **Rules horizontais finos** (1px) separam blocos de informacao. Nunca caixas, nunca bordas duplas, nunca sombras.
8. **Coluna de texto estreita**: o corpo de texto vive em ~540px de largura no A4 landscape (aproximadamente metade da pagina). A outra metade fica em branco — respiro editorial proposital.
9. **Sumario (pagina 02) obrigatorio** em apresentacoes com 6+ paginas: numeracao romana + titulo + linha rule + seta + numero de pagina de destino.
10. **Gramatica PT-BR impecavel**: acentos, crase, pontuacao, concordancia. Reler antes de renderizar.

## FONTE — BRITTI SANS TRIAL + HOST GROTESK FALLBACK (IMPRESCINDÍVEL)

Regra: **Britti Sans Trial é a fonte editorial padrão** do body, labels, captions, KPI numbers, footer, header. Host Grotesk (Google Fonts, weight 500 Medium) é carregado via `@import` e usado como:

1. **Fallback explícito via font-family stack para acentos/Latin-Extended**: todo seletor usa `font-family: 'Britti Sans Trial', 'Host Grotesk', sans-serif`. Se Britti Sans não possuir um glifo (ou renderizar torto), o browser usa automaticamente Host Grotesk (garantido via `@import` Google Fonts). Nada de `local()` nem `unicode-range`.
2. **Peso Medium (500) em títulos via Host Grotesk**: Britti Sans Trial não possui peso 500 (só Light 300, Regular 400, Semibold 600, Bold 700). Títulos usam stack `font-family: 'Host Grotesk','Britti Sans Trial', sans-serif` com `font-weight: 500` para obter o Medium real do Host Grotesk. Não substituir por Semibold da Britti.

### Declaração obrigatória

```css
@import url('https://fonts.googleapis.com/css2?family=Host+Grotesk:ital,wght@0,400;0,500;0,700;1,400;1,500&display=swap');

/* Britti Sans Trial — 8 pesos licenciados (abril/2026) */
@font-face{font-family:'Britti Sans Trial';src:url('file:///Users/matheusfilipe/.claude/skills/pdf-squad-design/assets/BrittiSans-Light.otf') format('opentype');font-weight:300;font-style:normal;font-display:block;}
@font-face{font-family:'Britti Sans Trial';src:url('file:///Users/matheusfilipe/.claude/skills/pdf-squad-design/assets/BrittiSans-LightItalic.otf') format('opentype');font-weight:300;font-style:italic;font-display:block;}
@font-face{font-family:'Britti Sans Trial';src:url('file:///Users/matheusfilipe/.claude/skills/pdf-squad-design/assets/BrittiSans-Regular.otf') format('opentype');font-weight:400;font-style:normal;font-display:block;}
@font-face{font-family:'Britti Sans Trial';src:url('file:///Users/matheusfilipe/.claude/skills/pdf-squad-design/assets/BrittiSans-RegularItalic.otf') format('opentype');font-weight:400;font-style:italic;font-display:block;}
@font-face{font-family:'Britti Sans Trial';src:url('file:///Users/matheusfilipe/.claude/skills/pdf-squad-design/assets/BrittiSans-Semibold.otf') format('opentype');font-weight:600;font-style:normal;font-display:block;}
@font-face{font-family:'Britti Sans Trial';src:url('file:///Users/matheusfilipe/.claude/skills/pdf-squad-design/assets/BrittiSans-SemiboldItalic.otf') format('opentype');font-weight:600;font-style:italic;font-display:block;}
@font-face{font-family:'Britti Sans Trial';src:url('file:///Users/matheusfilipe/.claude/skills/pdf-squad-design/assets/BrittiSans-Bold.otf') format('opentype');font-weight:700;font-style:normal;font-display:block;}
@font-face{font-family:'Britti Sans Trial';src:url('file:///Users/matheusfilipe/.claude/skills/pdf-squad-design/assets/BrittiSans-BoldItalic.otf') format('opentype');font-weight:700;font-style:italic;font-display:block;}

*, *::before, *::after { font-family: 'Host Grotesk','Britti Sans Trial',sans-serif !important; }
h1,h2,.display,.display.small,.cover-display,.title{font-family:'Host Grotesk','Britti Sans Trial',sans-serif !important;font-weight:500 !important;}
```

> **FIX CRITICO (abril/2026)**: Host Grotesk DEVE ser o PRIMEIRO no stack — Britti Sans como fallback. Motivo: Britti Sans Trial Bold tem cobertura irregular de Latin-Extended (ç, ú, ã, é, í, ó renderizam em fonte serif do sistema quando Britti Sans "finge" ter o glifo mas entrega errado). Com Host Grotesk primario, acentos ficam consistentes. Proibido usar `'Britti Sans Trial'` como primeiro item em qualquer stack — sempre `'Host Grotesk','Britti Sans Trial',sans-serif`.

### Escala obrigatória de títulos (A4 landscape) — +30% sobre base antiga

| Elemento | Tamanho | Peso |
|---|---|---|
| `.cover-display` (capa) | **73px** | 500 |
| Display encerramento | **60px** | 500 |
| `.display` (H1) | **49px** | 500 |
| `.display.small` (subtítulo) | **36px** | 500 |

Peso **500 (Medium) obrigatório** em todos os títulos. Proibido título em 400 (Regular) ou 700 (Bold).

**Why:** Britti Sans Trial não possui peso Medium 500 e pode ter cobertura irregular de alguns glifos Latin-Extended. Host Grotesk resolve os dois problemas (Medium real + cobertura completa de acentos) mantendo aparência editorial grotesca compatível. **IMPORTANTE:** a abordagem antiga com `src: local('Host Grotesk')` + `unicode-range` é proibida — ela só funciona se a fonte estiver instalada no sistema do usuário, e quebra silenciosamente em qualquer macOS sem Host Grotesk instalado, caindo pro Helvetica/Arial. A solução à prova de balas é `@import` Google Fonts (Host Grotesk SEMPRE carregado) + font-family stack explícito que deixa o browser escolher automaticamente.

**How to apply:** antes de renderizar qualquer deck, confirmar: (a) `@import` Host Grotesk presente no topo do `<style>`, (b) os 8 `@font-face` de Britti Sans Trial (Light/Regular/Semibold/Bold + italics) SEM `unicode-range`, (c) safeguard `*, *::before, *::after { font-family: 'Britti Sans Trial','Host Grotesk',sans-serif !important; }`, (d) rule de títulos `h1,h2,.display,.cover-display,.title{font-family:'Host Grotesk','Britti Sans Trial',sans-serif !important;font-weight:500 !important;}`, (e) tamanhos conforme escala +30%, (f) grep final: zero `local('Host Grotesk')` e zero `unicode-range` nas faces Britti Sans.

## ESPECIFICACOES TIPOGRAFICAS — OBRIGATORIO

**REGRA IMPRESCINDIVEL**: a fonte editorial Squad é **Britti Sans Trial** (licença completa, 8 pesos). Host Grotesk (Google Fonts via `@import`) atua como fallback robusto para cobertura Latin-Extended e para o peso Medium 500 dos títulos. Arquivos oficiais OTF (já instalados em `~/.claude/skills/pdf-squad-design/assets/`):

- `BrittiSans-Light.otf` (300)
- `BrittiSans-LightItalic.otf` (300 italic)
- `BrittiSans-Regular.otf` (400)
- `BrittiSans-RegularItalic.otf` (400 italic)
- `BrittiSans-Semibold.otf` (600)
- `BrittiSans-SemiboldItalic.otf` (600 italic)
- `BrittiSans-Bold.otf` (700)
- `BrittiSans-BoldItalic.otf` (700 italic)

Titulos, display, body, labels — TUDO em Britti Sans Trial, com Host Grotesk como fallback automático do stack.

Carregamento: SEMPRE embedar os 8 `@font-face` no topo do CSS + `@import` Host Grotesk. Ver bloco canônico na seção "Declaração obrigatória" e no "CSS BASE" abaixo. Para HTML fora da skill folder, converta as OTFs para `data:` base64 e embute inline:
```bash
base64 -i ~/.claude/skills/pdf-squad-design/assets/BrittiSans-Regular.otf | pbcopy
```
e substitua `src:url('file:///...')` por `src:url('data:font/otf;base64,<conteudo>') format('opentype');`.

Hierarquia (A4 landscape — 297×210mm):

| Elemento | Fonte | Peso | Tamanho | Cor | Transform |
|---|---|---|---|---|---|
| Cover display | Host Grotesk → Britti | 500 | 73px | theme | none |
| Display encerramento | Host Grotesk → Britti | 500 | 60px | theme | none |
| H1 display | Host Grotesk → Britti | 500 | 49px | theme | none |
| H1 display small | Host Grotesk → Britti | 500 | 36px | theme | none |
| Linha azul sob H1 | — | — | 56×2px | accent | — |
| Lead / body | Britti Sans | 300 | 11-12px | theme-body | none |
| Micro label (gutter/caps) | Britti Sans | 700 | 8-9px | accent | uppercase + 0.18em |
| Item subtitle | Britti Sans | 700 | 13px | theme | none |
| Item body | Britti Sans | 300 | 10-11px | theme-mute | none |
| Header / footer | Britti Sans | 700 | 9px | theme-mute | uppercase + 0.18em |
| Section number em gutter | Britti Sans | 700 | 9px | accent | uppercase + 0.12em |

Regras:
- H1 SEMPRE mistura duas partes: `<span>Parte neutra.</span> <b>Parte destaque.</b>`. No dark a parte destaque fica branco bold. No blue destaque fica branco bold. No light destaque fica bold azul ou preto bold.
- Corpo em 300 (Britti Sans Light). H3/label em 700 (Britti Sans Bold). NUNCA usar pesos intermediarios — Britti Sans so tem Light e Bold nesta skill.
- Line-height H1: 1.05-1.1. Line-height body: 1.5-1.6.
- Tracking labels micro: +0.18em. Tracking H1: -0.005em.

## LOGO SQUAD FILM — OBRIGATORIO NA CAPA E NOS RODAPES

**REGRA IMPRESCINDIVEL**: TODO documento gerado por esta skill precisa conter:

1. **Logo Squad Film (S///) grande na capa** — canto superior direito do header ou bloco dedicado acima do titulo. Tamanho: 64-88px de largura. Asset: `~/.claude/skills/pdf-squad-design/assets/squad-logo.png` (PNG transparente azul+branco).
2. **Logo Squad Film alternando nos rodapes** — o `<span class="f-center mark">` continua sendo a marca `S///` textual, MAS a cada 3 paginas o rodape deve alternar para exibir o logo PNG no lugar do texto, criando ritmo visual. Padroes aceitaveis:
   - Paginas 1, 4, 7, 10... → logo PNG no rodape central (28-32px altura)
   - Demais paginas → marca `S///` textual
3. **Contracapa (ultima pagina) com logo PNG grande** — 120-160px, centralizado ou alinhado ao gutter, acompanhado dos sites.

### Sites oficiais Squad Film (OBRIGATORIO na capa e na contracapa)

Incluir SEMPRE um bloco de sites com os links abaixo. Na capa aparece em texto micro cap abaixo da metadata. Na contracapa aparece como bloco dedicado abaixo do logo.

```
squadfilm.com
instagram.com/squadfilme
```

**PROIBIDO**: incluir `theversionofus.com` ou qualquer menção a "The Version of Us" em QUALQUER PDF. Regra imprescindivel em todas as variantes PDF Squad.

Marcacao padrao para o bloco de sites:
```html
<div class="sites">
  <span class="s-label">Squad Film</span>
  <a href="https://squadfilm.com">squadfilm.com</a>
  <span class="s-sep">·</span>
  <a href="https://instagram.com/squadfilme">@squadfilme</a>
</div>
```

CSS para o bloco:
```css
.sites{display:flex;align-items:center;gap:10px;font-size:9px;letter-spacing:.18em;text-transform:uppercase;font-weight:700;color:var(--mute);margin-top:18px;}
.sites .s-label{color:var(--accent);}
.sites a{color:var(--body);text-decoration:none;}
.sites .s-sep{color:var(--rule);}
```

### Embedar o logo PNG

O arquivo oficial e `~/.claude/skills/pdf-squad-design/assets/squad-logo.png`. Duas formas de usar:

1. **Referencia direta** (quando HTML roda da pasta da skill ou ao lado do asset):
   ```html
   <img class="squad-logo" src="assets/squad-logo.png" alt="Squad Film">
   ```
2. **Base64 inline** (quando HTML precisa rodar em qualquer lugar):
   ```bash
   base64 -i ~/.claude/skills/pdf-squad-design/assets/squad-logo.png
   ```
   e use `<img src="data:image/png;base64,...">`.

CSS do logo:
```css
.squad-logo{display:block;height:auto;}
.squad-logo.cover{width:88px;}        /* capa */
.squad-logo.back{width:160px;}        /* contracapa */
.squad-logo.footer{width:32px;}       /* rodape alternado */
/* Em temas dark/blue, o logo PNG ja tem branco+azul, basta exibir */
/* Em tema light, envolver em container com background escuro se necessario */
.page.light .squad-logo.footer{filter:none;}
```

### Exemplo de capa completa (CAPA OBRIGATORIA)
```html
<section class="page dark cover-page">
  <header class="running">
    <span class="h-left"><span class="arrow">↗</span> 01 · CAPA</span>
    <img class="squad-logo cover" src="assets/squad-logo.png" alt="Squad Film">
  </header>
  <div class="content">
    <div class="doc-label">Squad Film · Documento editorial</div>
    <h1 class="cover-display">Titulo <b>do documento.</b></h1>
    <div class="h1-rule"></div>
    <p class="lead">Subtitulo explicativo do documento...</p>
    <div class="sites">
      <span class="s-label">Squad Film</span>
      <a>squadfilm.com</a><span class="s-sep">·</span>
      <a>@squadfilme</a>
    </div>
  </div>
  <footer class="foot">
    <span class="f-left"><span class="arrow">↗</span> 01 · Capa</span>
    <img class="squad-logo footer" src="assets/squad-logo.png" alt="Squad Film">
    <span class="f-right">PÁG. <b>01</b> / XX</span>
  </footer>
</section>
```

## PALETA TRI-TEMA

```
/* DARK */
--dark-bg: #0A0A0A;
--dark-text: rgba(255,255,255,.92);
--dark-body: rgba(255,255,255,.72);
--dark-mute: rgba(255,255,255,.48);
--dark-rule: rgba(255,255,255,.14);
--dark-accent: #1AA7D4;   /* ciano Squad Film */

/* BLUE */
--blue-bg: #00AEEF;       /* azul vivo editorial */
--blue-text: rgba(255,255,255,.96);
--blue-body: rgba(255,255,255,.82);
--blue-mute: rgba(255,255,255,.60);
--blue-rule: rgba(255,255,255,.25);
--blue-accent: #FFFFFF;

/* LIGHT */
--light-bg: #FFFFFF;
--light-text: #0A0A0A;
--light-body: #2B2B2B;
--light-mute: #8A8A8A;
--light-rule: rgba(0,0,0,.12);
--light-accent: #00AEEF;  /* mesmo azul do tema blue */
```

Cores NUNCA usar: vermelho, verde, amarelo, roxo. APENAS a tripla (preto, branco, azul). Ciano #1AA7D4 vive so em dark como accent; azul #00AEEF vive em light como accent e em blue como fundo.

## LAYOUT A4 LANDSCAPE

Canvas: **297mm × 210mm** (1123 × 794 px @ 96dpi).
Margens: top 40px · right 56px · bottom 40px · left 112px (gutter esquerdo largo).
Gutter de numeracao: 0-80px (dentro da margem esquerda).
Area de conteudo util: ~960px largura × ~690px altura.
Coluna de texto ideal: 540-580px (nao usar a largura toda).

Estrutura vertical fixa:
```
┌──────────────────────────────────────────────┐
│ HEADER (40px)  — ↗ 01 · SECTION ··· RESUMO   │
│ ─────────────────────────────────────────────│
│                                              │
│  ↗ 01  ─────  LABEL SECTION                  │
│                                              │
│  H1 Display serif (duas cores)               │
│  ──── (linha azul 56×2)                      │
│                                              │
│  Lead paragraph (540px)                      │
│                                              │
│  [CONTENT BLOCKS — listas, definicoes, dados]│
│                                              │
│ ─────────────────────────────────────────────│
│ FOOTER  ↗ 01 · SECTION    S///    PÁG 01/XX │
└──────────────────────────────────────────────┘
```

## COMPONENTES (obrigatorios)

### 1. Running header
```html
<header class="running">
  <span class="h-left"><span class="arrow">↗</span> 01 · SECTION NAME</span>
  <span class="h-right">RESUMO L'ACQUA MARINA</span>
</header>
```
Rule horizontal fino abaixo. Ambos os textos em uppercase 9px tracking +0.18em.

### 2. Section label strip
```html
<div class="section-label">
  <span class="arrow">↗</span>
  <span class="num">01</span>
  <span class="rule"></span>
  <span class="name">FICHA</span>
</div>
```
Formato: seta + numero + rule horizontal ~100px + nome. Tudo 9px uppercase, cor accent.

### 3. H1 display com duas cores + linha azul
```html
<h1 class="display">
  <span>Ficha</span> <b>do documento.</b>
</h1>
<div class="h1-rule"></div>
```

### 4. Lead paragraph
Paragrafo unico, 540px, 11-12px, color body.

### 5. Lista de itens numerados (padrao para diagnostico, escopo, riscos, plano)
```html
<ol class="items">
  <li>
    <span class="gutter">01</span>
    <div class="content">
      <h3>Propriedade formal — escritura real</h3>
      <p>Patrimonio registrado em cartorio em nome do comprador...</p>
    </div>
  </li>
</ol>
```
Cada `li` separado por rule horizontal 1px. Gutter numero em accent uppercase.

### 6. Definition list (para ficha do documento)
```html
<dl class="def">
  <dt>TIPO DE DOCUMENTO</dt><dd>Resumo de transcricao · ata consolidada.</dd>
  <dt>DATA · HORA</dt><dd><b>14 de abril de 2026</b> · 14h30 · 50 min.</dd>
</dl>
```
`dt` em micro caps accent, `dd` body size. Stack vertical com 14px de gap.

### 7. Sumario
```html
<ol class="toc">
  <li><span class="roman">I</span><span class="title">Ficha do documento</span><span class="rule"></span><span class="arrow">→</span><span class="page">03</span></li>
</ol>
```
Romanos accent, titulo body, rule horizontal flexivel, seta, numero de pagina. Rule ocupa o espaco flexivel entre titulo e seta.

### 8. Rodape / footer
```html
<footer class="foot">
  <span class="f-left"><span class="arrow">↗</span> 01 · SECTION</span>
  <span class="f-center mark"><b>S</b><span class="bars">///</span></span>
  <span class="f-right">PÁG. <b>01</b> / 18</span>
</footer>
```

### 9. Pill boxes para pacotes (proposta comercial)
Border 1px accent, padding 24px, label micro caps + valor grande + lista com travessao `— item`.

### 10. Blockquote (trechos literais)
```html
<blockquote>
  <span class="who">NELSON</span>
  <p>"A gente nao esta vendendo diaria, esta vendendo uma fracao de patrimonio com escritura..."</p>
</blockquote>
```
Nome em uppercase micro caps accent, texto em italic 13px regular, separado por rule.

## ESTRUTURA SUGERIDA (decks editoriais 10-20 paginas)

1. **Capa** (dark) — Doc. label, H1 grande "Titulo do documento", lead, bloco de metadata (cliente/fornecedor/participantes/projeto) em colunas, footer institucional.
2. **Sumario** (light) — lista romana.
3. **Ficha do documento** (blue) — dt/dd com dados frios.
4. **Contexto / objetivo** (light) — 2-3 paragrafos + 3 metadata caixas no rodape.
5. **Conceito / produto** (light) — lista 4 itens numerados.
6. **Diagnostico** (dark) — 2 blocos ANTES/DEPOIS + consenso no rodape.
7. **Publico / objecoes** (light) — paragrafo + lista numerada.
8. **Diagnostico digital** (blue) — 2 blocos SITE/INSTAGRAM + recomendacao.
9. **Tese / posicionamento** (dark) — 3 camadas definidas com dt/dd.
10. **Proposta comercial** (light) — 3 pill boxes mensais.
11. **Entregaveis** (light) — lista longa agrupada por categoria.
12. **Metas / cronograma** (blue) — 3 itens M1/M2/M3.
13. **Riscos / mitigacoes** (light) — 4 itens R1-R4.
14. **Plano de acao cliente** (dark) — 5 itens C1-C5.
15. **Plano de acao Squad** (light) — 5 itens S1-S5.
16. **Trechos literais** (blue) — blockquotes.
17. **Pendencias** (light) — 5 itens simples.
18. **Encerramento / contracapa** (dark) — frase final, e-mail, instagram, site, proximo passo, footer institucional.

Regra de alternancia: nao mais que 2 paginas seguidas do mesmo tema.

## CSS BASE (copie e adapte)

```css
@import url('https://fonts.googleapis.com/css2?family=Host+Grotesk:ital,wght@0,400;0,500;0,700;1,400;1,500&display=swap');

/* Britti Sans Trial — 8 pesos */
@font-face{font-family:'Britti Sans Trial';src:url('/Users/matheusfilipe/.claude/skills/pdf-squad-design/assets/BrittiSans-Light.otf') format('opentype');font-weight:300;font-style:normal;font-display:block;}
@font-face{font-family:'Britti Sans Trial';src:url('/Users/matheusfilipe/.claude/skills/pdf-squad-design/assets/BrittiSans-LightItalic.otf') format('opentype');font-weight:300;font-style:italic;font-display:block;}
@font-face{font-family:'Britti Sans Trial';src:url('/Users/matheusfilipe/.claude/skills/pdf-squad-design/assets/BrittiSans-Regular.otf') format('opentype');font-weight:400;font-style:normal;font-display:block;}
@font-face{font-family:'Britti Sans Trial';src:url('/Users/matheusfilipe/.claude/skills/pdf-squad-design/assets/BrittiSans-RegularItalic.otf') format('opentype');font-weight:400;font-style:italic;font-display:block;}
@font-face{font-family:'Britti Sans Trial';src:url('/Users/matheusfilipe/.claude/skills/pdf-squad-design/assets/BrittiSans-Semibold.otf') format('opentype');font-weight:600;font-style:normal;font-display:block;}
@font-face{font-family:'Britti Sans Trial';src:url('/Users/matheusfilipe/.claude/skills/pdf-squad-design/assets/BrittiSans-SemiboldItalic.otf') format('opentype');font-weight:600;font-style:italic;font-display:block;}
@font-face{font-family:'Britti Sans Trial';src:url('/Users/matheusfilipe/.claude/skills/pdf-squad-design/assets/BrittiSans-Bold.otf') format('opentype');font-weight:700;font-style:normal;font-display:block;}
@font-face{font-family:'Britti Sans Trial';src:url('/Users/matheusfilipe/.claude/skills/pdf-squad-design/assets/BrittiSans-BoldItalic.otf') format('opentype');font-weight:700;font-style:italic;font-display:block;}

:root{
  --accent-cyan:#1AA7D4;
  --accent-blue:#00AEEF;
}
*{margin:0;padding:0;box-sizing:border-box;}
html,body{background:#2a2a2a;font-family:'Britti Sans Trial';-webkit-font-smoothing:antialiased;}
@page{size:A4 landscape;margin:0;}

.page{
  width:297mm;height:210mm;
  position:relative;overflow:hidden;
  page-break-after:always;
  font-family:'Britti Sans Trial';
  display:flex;flex-direction:column;
  padding:40px 56px 40px 112px;
}
.page:last-child{page-break-after:auto;}

/* THEMES */
.page.dark{background:#0A0A0A;color:rgba(255,255,255,.92);}
.page.dark{--bg:#0A0A0A;--text:rgba(255,255,255,.92);--body:rgba(255,255,255,.72);--mute:rgba(255,255,255,.48);--rule:rgba(255,255,255,.14);--accent:#1AA7D4;}
.page.blue{background:#00AEEF;color:rgba(255,255,255,.96);}
.page.blue{--bg:#00AEEF;--text:rgba(255,255,255,.96);--body:rgba(255,255,255,.82);--mute:rgba(255,255,255,.60);--rule:rgba(255,255,255,.25);--accent:#FFFFFF;}
.page.light{background:#FFFFFF;color:#0A0A0A;}
.page.light{--bg:#FFFFFF;--text:#0A0A0A;--body:#2B2B2B;--mute:#8A8A8A;--rule:rgba(0,0,0,.12);--accent:#00AEEF;}

/* HEADER */
.running{
  position:absolute;top:40px;left:112px;right:56px;
  display:flex;justify-content:space-between;align-items:center;
  padding-bottom:12px;border-bottom:1px solid var(--rule);
  font-size:9px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--mute);font-weight:500;
}
.running .arrow{color:var(--accent);margin-right:6px;}

/* SECTION LABEL */
.section-label{
  display:flex;align-items:center;gap:14px;
  font-size:9px;letter-spacing:.18em;text-transform:uppercase;font-weight:500;
  color:var(--accent);margin-top:84px;margin-bottom:18px;
}
.section-label .rule{flex:0 0 110px;height:1px;background:var(--accent);opacity:.6;}
.section-label .name{color:var(--mute);}

/* H1 DISPLAY */
.display{
  font-family:'Britti Sans Trial';
  font-weight:400;font-size:44px;line-height:1.06;letter-spacing:-.005em;
  color:var(--text);max-width:900px;
  font-variation-settings:"opsz" 120;
}
.display b{font-weight:700;}
.h1-rule{width:56px;height:2px;background:var(--accent);margin-top:18px;margin-bottom:28px;}
.page.blue .h1-rule{background:#FFFFFF;}

/* LEAD */
.lead{
  font-size:12px;line-height:1.6;color:var(--body);font-weight:400;
  max-width:560px;margin-bottom:22px;
}
.lead + .lead{margin-top:-8px;}

/* DEFINITION LIST */
.def dt{
  font-size:9px;letter-spacing:.18em;text-transform:uppercase;font-weight:500;
  color:var(--mute);margin-top:14px;
}
.def dt:first-child{margin-top:0;}
.def dd{font-size:12px;color:var(--body);font-weight:400;line-height:1.55;margin-top:4px;max-width:720px;}
.def dd b{font-weight:600;color:var(--text);}

/* ITEMS LIST */
.items{list-style:none;max-width:900px;}
.items li{
  display:grid;grid-template-columns:60px 1fr;gap:14px;
  padding:18px 0;border-top:1px solid var(--rule);
}
.items li:last-child{border-bottom:1px solid var(--rule);}
.items .gutter{
  font-size:9px;letter-spacing:.18em;text-transform:uppercase;font-weight:500;
  color:var(--accent);padding-top:4px;
}
.items h3{
  font-family:'Britti Sans Trial';font-weight:700;font-size:13px;
  color:var(--text);margin-bottom:6px;letter-spacing:-.005em;
}
.items h3 b{font-weight:700;}
.items p{font-size:11px;line-height:1.55;color:var(--body);font-weight:400;max-width:620px;}

/* TOC */
.toc{list-style:none;max-width:900px;margin-top:8px;}
.toc li{
  display:flex;align-items:center;gap:14px;
  padding:14px 0;border-top:1px solid var(--rule);
  font-size:11px;font-weight:400;
}
.toc li:last-child{border-bottom:1px solid var(--rule);}
.toc .roman{flex:0 0 36px;color:var(--accent);font-weight:500;letter-spacing:.12em;text-transform:uppercase;}
.toc .title{flex:0 0 auto;color:var(--text);}
.toc .rule{flex:1;height:1px;background:var(--rule);}
.toc .arrow{color:var(--accent);font-size:14px;}
.toc .page{color:var(--mute);font-weight:500;letter-spacing:.1em;}

/* BLOCKQUOTE */
blockquote{padding:18px 0;border-top:1px solid var(--rule);max-width:680px;}
blockquote:last-child{border-bottom:1px solid var(--rule);}
blockquote .who{
  display:block;font-size:9px;letter-spacing:.18em;text-transform:uppercase;
  font-weight:500;color:var(--accent);margin-bottom:10px;
}
blockquote p{
  font-family:'Britti Sans Trial';font-style:italic;
  font-size:15px;line-height:1.5;color:var(--text);font-weight:400;
}

/* PILL BOX (proposal packages) */
.pill{
  border:1px solid var(--rule);padding:24px 28px;margin-bottom:14px;
  max-width:860px;
}
.pill .label{font-size:9px;letter-spacing:.18em;text-transform:uppercase;font-weight:500;color:var(--mute);}
.pill .value{
  font-family:'Britti Sans Trial';font-weight:700;font-size:26px;
  color:var(--text);margin:8px 0 14px;
}
.pill ul{list-style:none;}
.pill li{font-size:11px;color:var(--body);padding:4px 0;}
.pill li::before{content:"— ";color:var(--accent);margin-right:4px;}

/* FOOTER */
.foot{
  position:absolute;bottom:30px;left:112px;right:56px;
  display:flex;justify-content:space-between;align-items:center;
  padding-top:12px;border-top:1px solid var(--rule);
  font-size:9px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--mute);font-weight:500;
}
.foot .arrow{color:var(--accent);margin-right:6px;}
.foot .mark{font-family:'Britti Sans Trial';font-size:11px;letter-spacing:0;text-transform:none;}
.foot .mark b{color:var(--accent);font-weight:900;font-style:italic;font-size:13px;}
.foot .mark .bars{color:var(--text);font-weight:900;}
.foot .f-right b{color:var(--text);font-weight:700;}

/* CONTENT WRAPPER to reserve header/footer space */
.content{margin-top:30px;flex:1;display:flex;flex-direction:column;}
```

## HTML TEMPLATE (pagina padrao)

```html
<section class="page light">
  <header class="running">
    <span class="h-left"><span class="arrow">↗</span> 04 · DIAGNÓSTICO CENTRAL</span>
    <span class="h-right">Resumo L'Acqua Marina</span>
  </header>

  <div class="content">
    <div class="section-label">
      <span class="arrow">↗</span>
      <span class="num">04</span>
      <span class="rule"></span>
      <span class="name">Diagnóstico central</span>
    </div>

    <h1 class="display">O produto é premium. <b>A percepção é de pousada.</b></h1>
    <div class="h1-rule"></div>

    <p class="lead">Na forma atual, o comprador em potencial chega ao site e ao Instagram e encontra fotos de hospedagem, comunicação de temporada, linguagem de diária. A leitura imediata é "pousada bonita".</p>

    <p class="lead">A proposta é virar a comunicação para o eixo <b>fração de patrimônio com escritura</b>, reforçando o tripé patrimônio + experiência + rentabilidade.</p>
  </div>

  <footer class="foot">
    <span class="f-left"><span class="arrow">↗</span> 04 · Diagnóstico central</span>
    <span class="f-center mark"><b>S</b><span class="bars">///</span></span>
    <span class="f-right">PÁG. <b>06</b> / 18</span>
  </footer>
</section>
```

## PIPELINE DE EXPORTACAO (Chromium headless)

```bash
CHROME="/Applications/Google Chrome.app/Contents/MacOS/Google Chrome"
"$CHROME" --headless --disable-gpu --no-pdf-header-footer \
  --print-to-pdf=output.pdf --no-margins \
  "file://$PWD/deck.html"
```

Para producao com screenshots por pagina, usar Playwright seguindo o mesmo padrao da skill `pdf-vevo-design-neo-swiss`.

## SPACING BLINDADO — ANTI-OVERLAP (OBRIGATORIO)

Regra fundamental: o `.running` (header absolute) e o `.foot` (footer absolute) consomem espaco vertical FORA do flexbox. Content wrapper precisa de margem suficiente ou sobrepoe rule/texto — bug classico desta skill em abril/2026.

```css
/* HEADER reservado — nunca reduzir abaixo destes valores */
.running{position:absolute;top:40px;left:112px;right:56px;padding-bottom:12px;border-bottom:1px solid var(--rule);}
.running .squad-logo{width:40px;max-height:20px;height:auto;object-fit:contain;object-position:right center;}

/* FOOTER reservado */
.foot{position:absolute;bottom:30px;left:112px;right:56px;padding-top:12px;border-top:1px solid var(--rule);}
.foot .squad-logo{width:28px;max-height:18px;height:auto;object-fit:contain;}

/* CONTENT — margem MINIMA 96px do topo, 80px do bottom */
.content{margin-top:96px;margin-bottom:80px;flex:1;display:flex;flex-direction:column;min-height:0;}
```

Checklist anti-overlap:
- [ ] `.content` tem `margin-top >= 96px` (sempre).
- [ ] Logo do header limitado a `max-height: 20px` (nunca expandir o header alem de ~40px).
- [ ] Logo do footer limitado a `max-height: 18px`.
- [ ] Nenhum elemento direto dentro de `.page` sem estar em `.content` — proibido.
- [ ] Section-label NUNCA tem `margin-top` positivo (fica dentro de `.content`).
- [ ] Se uma pagina tem muito conteudo, QUEBRAR em duas paginas. Proibido reduzir margens para forcar encaixe.
- [ ] Lead + metadata + resumo juntos na capa: soma de alturas < 580px (checar visualmente).

## QA VISUAL OBRIGATORIA — RENDERIZAR + CONFERIR

**REGRA IMPRESCINDIVEL**: apos gerar o PDF, SEMPRE converter cada pagina em PNG e ler visualmente antes de entregar. Se houver qualquer sinal de defeito visual, CORRIGIR e repetir. Nunca entregar sem conferir.

### Pipeline de verificacao

```bash
# 1. Gerar PDF
CHROME="/Applications/Google Chrome.app/Contents/MacOS/Google Chrome"
"$CHROME" --headless --disable-gpu --no-pdf-header-footer \
  --print-to-pdf=output.pdf --no-margins \
  "file://$PWD/deck.html"

# 2. Converter pagina 1 em PNG (e repetir para outras paginas se necessario)
sips -s format png output.pdf --out preview.png

# 3. Ler via Read tool
#    → confirmar visualmente antes de entregar
```

### Checklist visual (cada pagina)

- [ ] **Sobreposicao**: nenhum elemento cruza rule do header/footer. Header rule sempre livre acima do conteudo. Footer rule sempre livre abaixo.
- [ ] **Cortes**: nenhum titulo, bloco ou lista cortado pelo fim da pagina. Se cortou, quebrar em nova pagina.
- [ ] **Vazio demais**: paginas com menos de ~50% de ocupacao vertical precisam ganhar conteudo (diagrama, tabela, timeline, trechos, KPI). Proibido pagina vazia com so titulo + 2 linhas.
- [ ] **Cheio demais**: paginas com densidade acima de ~80% precisam ser quebradas em duas.
- [ ] **Quebra ruim de texto**: linhas viuvas/orfas, palavra sozinha em linha nova, hifenizacao feia. Ajustar `max-width` do paragrafo.
- [ ] **Acentos quebrados**: `ç`, `ú`, `ã`, `é` etc. renderizados em fonte diferente (serif-ish). Confirmar font-family stack com Host Grotesk PRIMARIO.
- [ ] **Alinhamento**: gutter esquerdo consistente (112px), todos os `section-label`, H1, body alinhados na mesma coluna.
- [ ] **Footer visivel**: PAG. NN/XX sempre visivel no rodape, logo e marca S/// no lugar.
- [ ] **Contrast**: texto body tem contraste suficiente com background (WCAG AA).
- [ ] **Icones**: todos os icones/marcadores no mesmo estilo (monoline 1-1.5px). Nenhum icone sozinho destoando.

Se qualquer item falhar, **corrigir e re-renderizar** antes de entregar.

## LAYOUTS RICOS — USAR SEMPRE QUE O CONTEUDO PEDIR

Quando o conteudo e denso ou relacional, **elevar acima de listas simples**. Todas estas opcoes devem ser consideradas SEMPRE:

### 1. Quadro / tabela
Grid de colunas com border 1px `var(--rule)`, header row em micro caps + bold, celulas com padding 14-18px. Use para comparacoes, matriz de decisao, antes/depois, status por frente.

```html
<table class="quadro">
  <thead><tr><th>Frente</th><th>Prazo</th><th>Responsavel</th><th>Status</th></tr></thead>
  <tbody>
    <tr><td>Venda switch</td><td>7 dias</td><td>Matheus</td><td><span class="status green">Em curso</span></td></tr>
  </tbody>
</table>
```

### 2. Timeline horizontal
Linha horizontal accent com pontos marcados por data. Label micro caps acima, texto abaixo. Use para cronogramas, milestones, historico.

```html
<div class="timeline">
  <div class="tl-track"></div>
  <div class="tl-item" style="left:0%"><span class="tl-date">ABR/26</span><h4>Inicio plano 90d</h4></div>
  <div class="tl-item" style="left:33%"><span class="tl-date">MAI/26</span><h4>Reserva formada</h4></div>
  <div class="tl-item" style="left:66%"><span class="tl-date">JUN/26</span><h4>Dividas reduzidas 30%</h4></div>
  <div class="tl-item" style="left:100%"><span class="tl-date">JUL/26</span><h4>Quitacao parcial</h4></div>
</div>
```

### 3. Mapa mental / mapa de topicos
Nodo central + ramificacoes 4-8 direcoes. Use SVG inline ou grid 3×3 com central + perifericos. Para ilustrar conceito, plano ou rede de ideias.

### 4. Fluxograma
Caixas conectadas por setas `→`. Use para processos, decisao, fluxo de aprovacao.

```html
<div class="flow">
  <div class="node">Identificar credor</div>
  <span class="arrow">→</span>
  <div class="node">Analisar proposta</div>
  <span class="arrow">→</span>
  <div class="node diamond">Abaixo limite?</div>
  <span class="arrow">→</span>
  <div class="node">Negociar</div>
</div>
```

### 5. Organograma
Hierarquia vertical tipo arvore. Use para estrutura de time, rede familiar, cadeia de responsaveis.

### 6. Mapa de itens / grid de cards
4-12 cards em grid 2×N ou 3×N. Cada card com icon + titulo + 1 linha descricao. Use para inventario de servicos, lista de stakeholders, ferramentas.

### 7. Matriz 2×2 (quadrante)
Eixo X e Y, 4 quadrantes nomeados. Use para priorizacao (impacto×esforco), diagnostico (urgencia×importancia), posicionamento competitivo.

### 8. Gantt simplificado
Linhas por frente, barras horizontais com duracao. Border 1px, preenchimento `var(--accent)` com opacity 0.2. Label dentro da barra.

### 9. KPI dashboard
Grid 3-5 KPIs grandes (numero 48-72px + label micro caps). Use para abrir secao de performance.

### 10. Mapa geografico
Imagem SVG simplificada (Brasil, GO, DF) com pontos marcados. Use quando referenciar localidade.

### ICONS — SEMPRE ADICIONAR

Cada item numerado de lista, card, KPI, celula de quadro, node de fluxograma **deve** ter um icone monoline stroke 1-1.5px alinhado ao texto:

- Phosphor Thin / Lucide stroke-1 / Tabler stroke-1 — escolher UMA familia por deck
- Tamanho: 14px inline, 18px em cards, 24px em KPIs, 32px em titulos de secao
- Cor: `var(--accent)` ou `var(--mute)`
- Inline SVG ou `<i data-lucide="nome">` com CDN

Proibido card/item sem icone quando o conteudo e estrutural.

### Regra de ouro
Se o conteudo tem **relacao** (hierarquia, sequencia, comparacao, dependencia, localizacao), escolher layout estruturado. Lista simples so para itens puramente paralelos sem relacao.

## CHECKLIST ANTES DE EXPORTAR

- [ ] Toda pagina tem running header com `↗ NN · SECAO` esquerda e projeto direita?
- [ ] Toda pagina tem section label com seta + numero + rule + nome?
- [ ] Todo H1 tem duas partes (neutra + bold destaque)?
- [ ] Todo H1 tem a linha azul curta (56×2) logo abaixo?
- [ ] Todo rodape tem `↗ NN · SECAO`, marca `S///` e `PÁG. NN / XX`?
- [ ] Marca `S///` fica ciano/branco/azul conforme o tema?
- [ ] Temas alternam (nunca 3 paginas iguais em sequencia)?
- [ ] Body/labels/captions usam stack `'Britti Sans Trial','Host Grotesk',sans-serif`? Safeguard `*, *::before, *::after { font-family: 'Britti Sans Trial','Host Grotesk',sans-serif !important; }` presente?
- [ ] Títulos (h1, h2, .display, .cover-display, .title) usam `font-family: 'Host Grotesk','Britti Sans Trial',sans-serif; font-weight: 500`? Nenhum título em 400 ou 700?
- [ ] `@import` Host Grotesk no topo do CSS (weights 400, 500, 700)?
- [ ] Britti Sans Trial `@font-face` SEM `unicode-range` (browser faz fallback automático via stack)?
- [ ] ZERO `local('Host Grotesk')` no CSS (grep final obrigatório)?
- [ ] Tamanhos de títulos conforme escala +30%: cover 73px, encerramento 60px, display 49px, display.small 36px?
- [ ] Logo Squad (PNG `assets/squad-logo.png`) presente na **capa**?
- [ ] Logo Squad alternando nos **rodapes** a cada 3 paginas?
- [ ] Bloco de sites `squadfilm.com · instagram.com/squadfilme` presente na capa e contracapa (PROIBIDO theversionofus.com)?
- [ ] Elementos graficos e icones condizentes com a identidade (stroke 1-1.5px, monoline, geometricos, sem fill pesado, sem emoji)?
- [ ] Coluna de texto respeita ~540-580px (nao enche a pagina)?
- [ ] Gutter esquerdo de 112px preservado em toda pagina?
- [ ] Gramatica PT-BR revisada (acentos, crase, pontuacao)?
- [ ] Sumario presente em deck 6+ paginas?
- [ ] Ficha do documento presente (se for ata/resumo/proposta)?
- [ ] Primeira pagina: capa dark com metadata?
- [ ] Ultima pagina: encerramento dark com contato?

## ELEMENTOS GRAFICOS E ICONES — IDENTIDADE OBRIGATORIA

REGRA IMPRESCINDIVEL: todo elemento visual, icone, marcador, divisor, indicador e ornamento do PDF deve estar **em sintonia total com a identidade Squad Film**. Nunca misturar linguagens, nunca usar clipart generico, nunca emoji.

### Vocabulario visual permitido

- **Setas**: apenas `↗` (diagonal up-right), `→` (direita), `↘` e `↓`. Unicode tipografico, nunca SVG arrow colorido.
- **Marcadores de lista**: numero gutter (01, 02, 03) em micro caps accent, ou rule horizontal 1px antes do item. Nunca bullet redondo, quadrado ou check.
- **Divisores**: rule horizontal 1px com `var(--rule)`, ou rule curta 56×2 accent (H1). Nunca linha tracejada, pontilhada ou dupla.
- **Selos / tags**: pill com border 1px accent, padding 4×10px, uppercase 9px tracking .18em. Sem fill, sem radius maior que 2px.
- **Icones**: apenas **monoline stroke 1-1.5px**, geometricos, mesma familia visual (estilo Phosphor Thin, Lucide stroke-1, Radix Icons, Tabler stroke-1). Cor = `var(--accent)` ou `var(--mute)`. Tamanho 14-18px inline, 24-32px destaque. Nunca icon filled, nunca icon colorido, nunca emoji, nunca flat illustration.
- **Numeros gigantes** (metricas/KPIs): Britti Sans Trial 72-120px, mesma regra do H1 (duas cores). Linha 56×2 accent opcional abaixo.
- **Grade de dados**: border 1px `var(--rule)`, celula com padding 16-20px, label micro caps + valor grande. Sem sombra, sem hover, sem alternancia de fundo.
- **Indicadores de destaque**: borda lateral 2px accent no card OU rule accent 56×2 acima do bloco. Nunca highlight amarelo, nunca fundo colorido alternativo.

### Cores permitidas nos elementos
Apenas as 4 cores da paleta: `#0A0A0A`, `#FFFFFF`, `#00AEEF`, `#1AA7D4`. Qualquer elemento grafico fora dessa paleta viola a identidade.

### Proporcao e ritmo
- Elementos graficos NUNCA roubam protagonismo da tipografia — sao apoio silencioso.
- Gap minimo entre icone e texto: 8px.
- Alinhar todo icone/marker a baseline do texto, nunca centralizado visualmente a olho.
- Usar o mesmo conjunto de icones do comeco ao fim do documento — **uma familia so por deck**.

### Regra pratica
Se voce esta prestes a inserir um elemento grafico, pergunte: *"isso existe no vocabulario Vevo Neo-Swiss / Squad editorial?"*. Se a resposta for nao, **nao use**. Prefira remover o elemento a adicionar ruido.

## PROIBICOES

- Fundo gradiente, fundo colorido fora da tripla preto/azul/branco.
- Cores alem de preto, branco, azul #00AEEF e ciano #1AA7D4.
- Qualquer fonte além de Britti Sans Trial (body) e Host Grotesk (títulos + fallback de acentos). Proibido Fraunces, Inter, Helvetica, Arial, serif, sans-serif, system-ui, -apple-system.
- Título em `font-weight: 400` (Regular) ou `700` (Bold). Somente `500` (Medium).
- Títulos com tamanhos fora da escala +30% (73/60/49/36). Nunca reduzir.
- `src: local('Host Grotesk')` em qualquer `@font-face`. Proibido. Só funciona se a fonte estiver instalada no sistema; quebra silenciosamente em qualquer máquina limpa.
- `unicode-range` nas faces de Britti Sans Trial. Proibido. Usar font-family stack explícito (`'Britti Sans Trial','Host Grotesk',sans-serif`) para fallback automático de glifos.
- H1 em UMA cor so — sempre duas partes.
- Sem linha azul sob o H1.
- Bordas duplas, caixas com radius grande, sombras, gradientes.
- Icones flat, emoji, bullets com circulo/quadrado.
- Capa sem logo Squad. Contracapa sem bloco de sites. Rodapes sem alternancia do logo.
- Fonte substituta no lugar da Britti Sans. Nunca.
- Elementos graficos fora da identidade (gradientes coloridos, 3D, skeuomorfismo, stickers, ilustracoes cartoon, clipart).
- Texto ocupando 100% da largura da pagina (quebrar a ~540px).
- Rodape sem marca `S///`.
- Mais de 2 paginas seguidas do mesmo tema.
- Esticar a fonte, usar italic fora de blockquote, underline fora do h1-rule.

## QUANDO USAR ESTA SKILL vs VEVO NEO-SWISS

| Pedido | Skill |
|---|---|
| "Resumo de reuniao / ata / dossie" | **pdf-squad-design** |
| "Proposta comercial / contrato / orcamento" | **pdf-squad-design** |
| "Relatorio mensal / performance / SEO" | **pdf-squad-design** |
| "Calendario editorial / plano de comunicacao" | **pdf-squad-design** ou **vevo** (vevo se for visual) |
| "Documento interno / briefing extenso" | **pdf-squad-design** |
| "Pitch deck / portfolio / case study visual" | **vevo-neo-swiss** |
| "Moodboard / deck de impacto com foto" | **vevo-neo-swiss** |
| "Apresentacao premium de projeto audiovisual" | **vevo-neo-swiss** |

Se ficar em duvida, **pdf-squad-design** e o padrao editorial novo (estilo L'Acqua Marina Resumo). **vevo** e o padrao de impacto visual type-on-image.

## REGRA FINAL

Sempre que for pedido PDF, apresentacao, deck, resumo, ata, dossie, proposta, relatorio ou documento editorial pela Squad Film — e o conteudo for **denso / textual / estruturado** — assuma esta direcao como padrao obrigatorio.

Priorizar: legibilidade editorial, sofisticacao tipografica serif, ritmo tri-tema, hierarquia clara, gutter numerico, marca S/// discreta no rodape.