# Ipê City — Deck Templates > Machine-readable slide-template reference for AI agents and LLMs. > Human version: https://ipe.city/deck > Brand reference: https://ipe.city/brand.md > Editable file: https://ipe.city/Ipe-Village-Deck-Templates.pptx --- ## How to use this file This is a system of **30 reusable slide layouts** ("templates") for building on-brand Ipê presentations. Each template has a stable `id`, a primary **tone**, and the content slots it expects. The output is a **self-presenting, animated** `.html` deck (keyboard nav + entrance animations). To assemble: pick a layout per slide, fill its slots with the user's content, and **alternate tones** so consecutive slides don't look the same. Every slide is a **16:9 frame** rendered as a CSS container, so all sizing uses `cqw` units (1cqw = 1% of slide width) and scales at any resolution. --- ## Output contract — what to produce When asked to "make an Ipê deck," produce **one self-contained `.html` file** from the scaffold below: it loads the brand fonts, recreates the brand theme, and **presents itself** — one slide at a time, fit to the viewport, advanced with the keyboard (Enter / Space / →). Paste one slide per `
`, tones alternating per the rhythm rules. Opened in any browser it runs as a deck; a 16:9 PDF (one slide per page) is optional via Print. **Rules of engagement for the agent:** 1. **Content first** — use the content you were given; do not invent stats, names, dates, or claims. Adapt text only to fit a slide, or fix grammar. 2. Pick a layout from the **30 templates** below and fill its `{{SLOTS}}`. If a slide fits none, design one in the same system (frame + `cqw` + tokens) — never off-brand. 3. Do **not** invent colors, fonts, gradients, or assets — use the `ipe-*` palette, `font-serif`/`font-sans`, and the asset URLs in **brand.md**. 4. Keep `cqw` sizing as written; only change slot text and the repeat-count of repeated items. 5. Obey the tone rhythm: never two consecutive slides of the same tone, and vary the canvas. 6. Motion is opt-in and subtle: `data-anim` on a few key parts, `data-count` on a hero number, `data-grow` on chart bars, `data-draw` on a timeline line. ### The scaffold (copy verbatim; paste slide blocks where marked) ```html Ipê Deck
→ / Space  ·  O overview  ·  F fullscreen
``` ### Image paths — important Template blocks use root-relative paths like `/branding/the-architect.png` (these resolve on ipe.city). For a **standalone file**, prefix every asset with the site origin so images load anywhere: ``` /branding/… → https://www.ipe.city/branding/… ``` e.g. `` → ``. The full asset catalog (gradients `bg-01..06`, visuals, wordmarks, The Architect) with descriptions and direct URLs is in **brand.md**. ### Export to PDF / PPTX - **PDF:** open the HTML, Print → "Save as PDF", set margins to None and background graphics ON. The `@page` rule already sizes pages to 16:9, one slide per page. - **PPTX:** import that PDF into Keynote/PowerPoint/Google Slides as full-page images, or start from the editable deck at https://ipe.city/Ipe-Village-Deck-Templates.pptx. --- ## Brand tokens (see brand.md for full kit) | Token | Hex | Tailwind class | |---|---|---| | Navy (primary bg) | `#002642` | `bg-ipe-navy` / `text-ipe-navy` | | Lime (accent) | `#A2D729` | `text-ipe-lime` / `bg-ipe-lime` | | Blue (secondary) | `#3AA5FF` | `text-ipe-blue` | | Yellow | `#FFB600` | `text-ipe-yellow` | | White (light bg) | `#EFF2F1` | `bg-ipe-white` | | Black | `#000000` | `bg-black` | - **Display / headings font**: Chakra Petch (`font-serif` in this codebase) - **Body font**: DM Sans (`font-sans`) - **Primary combo**: navy background + lime accent + white text. - **Date badge** convention: `APR 6 — MAY 1` (lime em dash). Village dates; the conference itself runs Apr 23 – May 1. - **Wordmark**: `/branding/ipe-wordmark-light.svg` (dark bg), `/branding/ipe-wordmark-dark.svg` (light bg). --- ## Tones & visual rhythm Every template has a primary **tone**. The rhythm rule: **never run two slides of the same tone back to back**. A good 10-slide deck cycles through tones like a piece of music. | Tone | Background | Used by | |---|---|---| | `navy` | `bg-ipe-navy` | section-divider, big-number, stat-grid, globe-statement, mosaic | | `light` | `bg-ipe-white` | statement, split-image, process-flow | | `black` | `bg-black` | cover-architect, manifesto | | `gradient` | `/branding/bg-0X.png` (default `bg-02` open / `bg-05` close) | cover-gradient, closing-cta | | `split` | half-navy + half-light | location, agenda-day | Recommended rhythms (pick one per deck): ``` A. gradient → navy → light → navy → black → light → navy → light → split → gradient B. black → light → navy → split → navy → light → navy → split → light → gradient ``` --- ## Shared primitives ### 16:9 slide frames ```html
``` ### Small parts ```html

Section label

APR 6—MAY 1
``` --- ## Template picker — choose by job | You need to… | Template | Tone | |---|---|---| | Open with gravitas + a human figure | `cover-architect` | black | | Open with energy, headline-only | `cover-gradient` | gradient | | Start a new chapter / section | `section-divider` | navy | | Make the room go quiet with one quote | `manifesto` | black | | State one idea + a short paragraph | `statement` | light | | Land one hero number | `big-number` | navy | | Pair a claim with a photo/screenshot | `split-image` | light | | Show 3–6 metrics of traction | `stat-grid` | navy | | Anchor the audience in a place | `location` | split | | Make a global / world-scale claim | `globe-statement` | navy | | Lay out one day's schedule | `agenda-day` | split | | Show programs/tracks/people (1 hero + supporting) | `mosaic` | navy | | Explain a 3–4 step process | `process-flow` | light | | Close with CTA + QR + handles | `closing-cta` | gradient | | Early overview / contents | `agenda` | navy | | A few bullet points | `bullet-list` | light | | Tabular data | `table` | navy | | Cinematic photo + overlay | `full-bleed-image` | gradient | | A bar chart | `chart` | light | | A 2×2 positioning map | `matrix-2x2` | black | | Problem vs solution | `problem-solution` | light | | Compare options × attributes | `feature-comparison` | light | | Pricing tiers | `pricing-tiers` | navy | | Team / people grid (photos) | `team` | light | | Sponsor / logo wall | `logo-wall` | black | | A historical timeline | `timeline` | light | | A forward roadmap | `roadmap` | navy | | Boxes-and-arrows diagram | `diagram-architecture` | black | | A code snippet | `code-block` | black | | A photo gallery | `photo-grid` | navy | A typical 8–10 slide deck: `cover-* → section-divider → statement/big-number → stat-grid → split-image/mosaic → globe-statement/manifesto → process-flow → location → closing-cta`, alternating tones throughout. --- ## Templates Each template below is a **complete, standalone copy-paste block**. Replace the `{{SLOT}}` placeholders with real content. Repeat or remove repeated items (stats, cards, logos, people, rows) as needed. Paste each block inside a `
` wrapper from the scaffold above, and add `data-anim` to the parts you want to stagger in (`data-count` for hero numbers). Image grids (`team`, `logo-wall`, `photo-grid`) take any number of items — set their grid columns to fit. --- ### 1. `cover-architect` - **Tone**: `black` (with The Architect editorial figure). - **Purpose**: Opener variant — when the deck needs gravitas and a human face. - **Slots**: `{{HEADLINE}}`, `{{HEADLINE_HIGHLIGHT}}` (lime phrase), `{{CAPTION}}`. ```html
Ipê Village
APR 6—MAY 1

{{HEADLINE}} {{HEADLINE_HIGHLIGHT}}

{{CAPTION}}
``` --- ### 2. `cover-gradient` - **Tone**: `gradient` (default `bg-02` — dramatic dark-with-streak). - **Purpose**: Default opener — energetic, no figure, headline does the work. - **Slots**: `{{EYEBROW}}`, `{{HEADLINE}}`, `{{HEADLINE_HIGHLIGHT}}` (lime), `{{CAPTION}}`, `{{LOCATION}}`. Swap `bg-02.png` for any `bg-0{{N}}.png` (01–06). ```html
Ipê Village
APR 6—MAY 1

{{EYEBROW}}

{{HEADLINE}} {{HEADLINE_HIGHLIGHT}}

{{CAPTION}}
{{LOCATION}}
``` --- ### 3. `section-divider` - **Tone**: `navy`. - **Purpose**: Break the deck into chapters. - **Slots**: `{{INDEX}}` (e.g. `02`), `{{TITLE}}`, `{{SUBTITLE}}`. ```html
{{INDEX}}

{{TITLE}}

{{SUBTITLE}}

APR 6—MAY 1
``` --- ### 4. `manifesto` - **Tone**: `black` (with low-opacity `visual-heads` behind for texture). - **Purpose**: A single big quote/statement — the slide that makes the room go quiet. - **Slots**: `{{QUOTE_PART_1}}`, `{{QUOTE_HIGHLIGHT}}` (lime phrase inline), `{{QUOTE_PART_2}}`, `{{ATTRIBUTION}}`. Swap `visual-heads.svg` for `symbol-white.svg` or `visual-globe-triple.svg` for variation. ```html
“
{{QUOTE_PART_1}} {{QUOTE_HIGHLIGHT}} {{QUOTE_PART_2}}

{{ATTRIBUTION}}

``` --- ### 5. `statement` - **Tone**: `light`. - **Purpose**: One headline idea + short supporting paragraph. The workhorse slide. - **Slots**: `{{EYEBROW}}`, `{{HEADLINE}}` (≤16 words), `{{BODY}}` (≤2 sentences). ```html

{{EYEBROW}}

{{HEADLINE}}

{{BODY}}

Ipê ipe.city
``` --- ### 6. `big-number` - **Tone**: `navy`. - **Purpose**: Single hero number — the takeover slide for one piece of proof. - **Slots**: `{{EYEBROW}}`, `{{VALUE}}` (3–5 chars), `{{SUFFIX}}` (optional, e.g. `M`, `%`, `x`), `{{LABEL}}` (one sentence), `{{SOURCE}}`. ```html

{{EYEBROW}}

{{VALUE}}{{SUFFIX}}

{{LABEL}}

{{SOURCE}}

``` --- ### 7. `stat-grid` - **Tone**: `navy`. - **Purpose**: Multi-stat proof / traction (3–6 stats). - **Slots**: `{{EYEBROW}}`, `{{HEADLINE}}`; repeated stat cell `{{VALUE}}` / `{{LABEL}}`. ```html

{{EYEBROW}}

{{HEADLINE}}

{{VALUE}}

{{LABEL}}

``` --- ### 8. `split-image` - **Tone**: `light` (40/60 image-dominant). - **Purpose**: Pair a claim with a photo or screenshot. Big visual + concise copy. - **Slots**: `{{EYEBROW}}`, `{{HEADLINE}}`, `{{BODY}}`, `{{TAG}}`, `{{IMAGE}}`. ```html

{{EYEBROW}}

{{HEADLINE}}

{{BODY}}

{{TAG}}
``` --- ### 9. `location` - **Tone**: `split` (light text panel + navy map panel). - **Purpose**: Anchor the audience in place. Crucial for a place-based event. - **Slots**: `{{EYEBROW}}`, `{{CITY}}`, `{{REGION}}`, `{{VENUE}}`, `{{DATES}}`, `{{COORDS}}`, optional `top`/`left` for the lime pin (default: Florianópolis area). ```html

{{EYEBROW}}

{{CITY}}

{{REGION}}

Venue

{{VENUE}}

Dates

{{DATES}}

{{COORDS}}
Santa Catarina
``` --- ### 10. `globe-statement` - **Tone**: `navy` (with wireframe globe as a low-opacity backdrop). - **Purpose**: Statements about global scope — network states, sovereignty, world-spanning ideas. - **Slots**: `{{EYEBROW}}`, `{{HEADLINE}}`, `{{HEADLINE_HIGHLIGHT}}` (lime), `{{BODY}}`. ```html

{{EYEBROW}}

{{HEADLINE}} {{HEADLINE_HIGHLIGHT}}

{{BODY}}

``` --- ### 11. `agenda-day` - **Tone**: `split` (navy date panel + light schedule panel). - **Purpose**: A single day's program with time-stamped sessions. Use one per day; for milestone roadmaps use a sequence of these. - **Slots**: left — `{{EYEBROW}}`, `{{DATE_DAY}}` (e.g. `24`), `{{DATE_MONTH}}` (e.g. `APRIL`), `{{DAY_NAME}}`, `{{DAY_THEME}}`. Right — repeat one row per session: `{{TIME}}`, `{{SESSION}}`, `{{SPEAKER_OR_LOCATION}}`. ```html

{{EYEBROW}}

{{DATE_DAY}}

{{DATE_MONTH}}

{{DAY_NAME}}

{{DAY_THEME}}

{{TIME}}

{{SESSION}}

{{SPEAKER_OR_LOCATION}}

``` --- ### 12. `mosaic` - **Tone**: `navy` (asymmetric editorial grid: 1 big tile + 4 small). - **Purpose**: Replaces the old `feature-grid` and `people-grid`. Use for tracks, programs, sessions, partners, speakers — anything that's a mix of "one hero + several supporting items." - **Slots**: `{{EYEBROW}}`, `{{HEADLINE}}`; big tile — `{{BIG_IMAGE}}`, `{{BIG_TAG}}`, `{{BIG_TITLE}}`; small tile (repeat 4×) — `{{SMALL_TITLE}}`, `{{SMALL_DESC}}`. ```html

{{EYEBROW}}

{{HEADLINE}}

{{BIG_TAG}}

{{BIG_TITLE}}

{{SMALL_TITLE}}

{{SMALL_DESC}}

``` > **Note**: the 3×2 grid + 2×2 big tile leaves 2 cells for small tiles. For 4 small tiles, change the grid to `grid-cols-4 grid-rows-2` and the big tile to `col-span-2 row-span-2`. --- ### 13. `process-flow` - **Tone**: `light`. - **Purpose**: A sequence of 3–4 numbered steps with lime arrows between them. Use for "how it works", application flow, onboarding. - **Slots**: `{{EYEBROW}}`, `{{HEADLINE}}`; per step — `{{INDEX}}` (01, 02, 03), `{{STEP_TITLE}}`, `{{STEP_DESC}}`. Drop the trailing arrow on the last step. ```html

{{EYEBROW}}

{{HEADLINE}}

{{INDEX}}

{{STEP_TITLE}}

{{STEP_DESC}}

→
``` --- ### 14. `closing-cta` - **Tone**: `gradient` (default `bg-05` — cinematic horizon). - **Purpose**: The final slide. Replaces the static contact-list closing. Carries a clear CTA + QR + handles. - **Slots**: `{{HEADLINE}}`, `{{HEADLINE_HIGHLIGHT}}` (lime), `{{BODY}}`, `{{CTA_LABEL}}` (e.g. `Apply at ipe.city`), `{{CTA_HINT}}` (e.g. `Applications close Mar 15`), `{{HANDLE_1/2/3}}`, `{{QR_CODE_PATH}}`. Swap `bg-05.png` for any `bg-0{{N}}.png`. ```html
Ipê Village
APR 6—MAY 1

{{HEADLINE}} {{HEADLINE_HIGHLIGHT}}

{{BODY}}

{{CTA_LABEL}}→

{{CTA_HINT}}

{{HANDLE_1}} {{HANDLE_2}} {{HANDLE_3}}
Scan to learn more
``` --- ### 15. `agenda` - **Tone**: `navy`. **Purpose**: early overview of what the deck covers. - **Slots**: `{{EYEBROW}}`, `{{TITLE}}`; per item — `{{INDEX}}` (`01`), `{{LABEL}}`. ```html

{{EYEBROW}}

{{TITLE}}

{{INDEX}} {{LABEL}}
``` --- ### 16. `bullet-list` - **Tone**: `light`. **Purpose**: the default text slide — a point in a few bullets. - **Slots**: `{{EYEBROW}}`, `{{HEADLINE}}`; per bullet — `{{TEXT}}`. ```html

{{EYEBROW}}

{{HEADLINE}}

{{TEXT}}

``` --- ### 17. `table` - **Tone**: `navy` (swap to a dark `bg-0{{N}}` gradient + `bg-black/55` scrim for colour). - **Slots**: `{{EYEBROW}}`, `{{HEADLINE}}`; `{{COL}}` headers; per cell `{{CELL}}` (first cell of a row is the bold label). ```html

{{EYEBROW}}

{{HEADLINE}}

{{COL_1}} {{COL_2}} {{COL_3}} {{COL_4}}
{{CELL_1}} {{CELL_2}} {{CELL_3}} {{CELL_4}}
``` --- ### 18. `full-bleed-image` - **Tone**: `gradient`. **Purpose**: cinematic edge-to-edge image with a text overlay. - **Slots**: `{{IMAGE}}`, `{{EYEBROW}}`, `{{HEADLINE}}`, `{{HEADLINE_HIGHLIGHT}}` (lime), `{{BODY}}`. ```html

{{EYEBROW}}

{{HEADLINE}} {{HEADLINE_HIGHLIGHT}}

{{BODY}}

``` --- ### 19. `chart` - **Tone**: `light`. **Purpose**: a simple bar chart. Inline SVG (themes via tokens, prints cleanly). - **Slots**: `{{EYEBROW}}`, `{{HEADLINE}}`; compute each bar's `x/y/height` for your data. Last bar lime (`#A2D729`); others `#002642`. Add `data-grow` to each `` so bars grow on entry. ```html

{{EYEBROW}}

{{HEADLINE}}

{{VALUE}} {{LABEL}}
``` --- ### 20. `matrix-2x2` - **Tone**: `black`. **Purpose**: positioning map across two axes. Inline SVG; your item is the lime dot. - **Slots**: `{{EYEBROW}}`, `{{HEADLINE}}`, `{{BODY}}`; axis + competitor labels; place your dot's ``/`` (label centred **above** the dot so it never clips). ```html

{{EYEBROW}}

{{HEADLINE}}

{{BODY}}

{{X_HIGH}} {{X_LOW}} {{Y_HIGH}} {{Y_LOW}} {{ITEM}} {{YOU}}
``` --- ### 21. `problem-solution` - **Tone**: `light`. **Purpose**: the classic pairing, side by side. - **Slots**: `{{EYEBROW}}`, `{{HEADLINE}}` (highlight a word with the lime underline); per side a label + points. ```html

{{EYEBROW}}

{{HEADLINE_1}} {{HIGHLIGHT}} {{HEADLINE_2}}

{{PROBLEM_LABEL}}

{{PROBLEM_POINT}}

{{SOLUTION_LABEL}}

{{SOLUTION_POINT}}

``` --- ### 22. `feature-comparison` - **Tone**: `light`. **Purpose**: options × attributes, with checks. Your column (last) is lime. - **Slots**: `{{EYEBROW}}`, `{{HEADLINE}}`; `{{OPTION}}` headers; per row a `{{ATTRIBUTE}}` + a cell each (`✓` or `—`). ```html

{{EYEBROW}}

{{HEADLINE}}

{{OPTION_1}} {{OPTION_2}} {{OPTION_3}}
{{ATTRIBUTE}} — ✓ ✓
``` --- ### 23. `pricing-tiers` - **Tone**: `navy`. **Purpose**: one column per tier; mark one as highlighted (lime fill). - **Slots**: `{{EYEBROW}}`, `{{HEADLINE}}`; per tier — `{{NAME}}`, `{{PRICE}}`, `{{PERIOD}}`, `{{FEATURE}}` (repeat). Highlighted tier swaps `bg-white/5 ring-1 ring-white/10` → `bg-ipe-lime text-ipe-navy`. ```html

{{EYEBROW}}

{{HEADLINE}}

{{NAME}}

{{PRICE}}{{PERIOD}}

{{FEATURE}}

``` --- ### 24. `team` - **Tone**: `light`. **Purpose**: people grid (photo + name + role). **Flexible count** — set the grid columns to fit: ≤4 → that many; 5–6 → 3; 7+ → 4. - **Slots**: `{{EYEBROW}}`, `{{HEADLINE}}`; per member — `{{PHOTO}}`, `{{NAME}}`, `{{ROLE}}`. ```html

{{EYEBROW}}

{{HEADLINE}}

{{NAME}}

{{ROLE}}

``` --- ### 25. `logo-wall` - **Tone**: `black`. **Purpose**: partners / sponsors / "backed by". **Flexible count** — set the grid columns to fit (≤4 → that many; 5–6 → 3; 7+ → 4). Use monochrome white logos. - **Slots**: `{{EYEBROW}}`, `{{HEADLINE}}`, `{{HEADLINE_HIGHLIGHT}}` (lime); per logo — `{{LOGO}}` (a white SVG/PNG). ```html

{{EYEBROW}}

{{HEADLINE}} {{HEADLINE_HIGHLIGHT}}

``` --- ### 26. `timeline` - **Tone**: `light`. **Purpose**: chronological **past** events. Inline SVG; add `data-draw="0"` to the baseline `` so it draws on. Last node lime. - **Slots**: `{{EYEBROW}}`, `{{HEADLINE}}`; per event — `{{DATE}}`, `{{LABEL}}` (space node `cx` evenly). ```html

{{EYEBROW}}

{{HEADLINE}}

{{DATE}} {{LABEL}}
``` --- ### 27. `roadmap` - **Tone**: `navy`. **Purpose**: phased **forward** plan with status. Status dot: lime `#A2D729` (now/done) or `#ffffff40` (next). - **Slots**: `{{EYEBROW}}`, `{{HEADLINE}}`; per phase — `{{PERIOD}}`, `{{TITLE}}`, `{{ITEM}}` (repeat), `{{STATUS_DOT}}`. ```html

{{EYEBROW}}

{{HEADLINE}}

{{PERIOD}}

{{TITLE}}

{{ITEM}}

``` --- ### 28. `diagram-architecture` - **Tone**: `black`. **Purpose**: boxes-and-arrows for a flow. Numbered node-cards with lime arrows. - **Slots**: `{{EYEBROW}}`, `{{HEADLINE}}`, `{{HEADLINE_HIGHLIGHT}}` (lime); per node — `{{N}}` (`01`), `{{TITLE}}`, `{{DESC}}`. Drop the trailing arrow on the last node. ```html

{{EYEBROW}}

{{HEADLINE}} {{HEADLINE_HIGHLIGHT}}

{{N}}

{{TITLE}}

{{DESC}}

→
``` --- ### 29. `code-block` - **Tone**: `black` (dark terminal). **Purpose**: a syntax-highlighted snippet. - **Slots**: `{{EYEBROW}}`, `{{HEADLINE}}`, `{{FILENAME}}`, `{{CODE}}` (pre-formatted; wrap comments in `text-white/35`, highlights in `text-ipe-lime`). ```html

{{EYEBROW}}

{{HEADLINE}}

{{FILENAME}} 
{{CODE}}
``` --- ### 30. `photo-grid` - **Tone**: `navy`. **Purpose**: a gallery / moodboard. **Flexible count** — set the grid columns (≤3 → that many; 4–6 → 3; 7+ → 4). - **Slots**: `{{EYEBROW}}`, `{{HEADLINE}}`; per photo — `{{SRC}}`, `{{CAPTION}}`. ```html

{{EYEBROW}}

{{HEADLINE}}

{{CAPTION}}

``` --- ## What changed from the previous spec - **Dropped** `tiers`, `feature-grid`, `people-grid`, `timeline`, `pricing` — they were nearly the same skeleton. Their use cases now live in: `mosaic` (features/people/tracks), `process-flow` (sequence/tiers), `agenda-day` (timeline/roadmap). - **Added** `cover-gradient`, `manifesto`, `big-number`, `location`, `globe-statement`, `agenda-day`, `mosaic`, `process-flow`, `closing-cta`. - **Wired up the unused brand kit**: gradients (`bg-02`, `bg-05`), `visual-map-sc`, `visual-globe-sphere`, `visual-heads`. The previous spec used 1 of 15 brand assets; this one uses 8. - **Tone system** is now first-class — every template is labeled, and the "no two adjacent same-tone slides" rule prevents monotony. --- ## Authoring rules 1. **One idea per slide.** If a slide needs two headlines, split it. 2. **Alternate tones** — never run two slides of the same tone back to back. See the rhythm presets above. 3. Headlines in `font-serif` (Chakra Petch), body in `font-sans` (DM Sans). 4. Lime is an accent, never a background for body text. Navy + white is the base. 5. Use the date badge `APR 6 — MAY 1` on `cover-*`, `section-divider`, and `closing-cta` only — keep it off everywhere else so it stays a signal, not noise. 6. Keep stat values short (`+170`, `$3,610`, `+2M`). Labels ≤4 words. 7. Logos always go on navy with `brightness-0 invert` so every mark is uniform white. 8. On gradient frames, always include a dark scrim under the headline area for legibility — the shared primitive shows the pattern. 9. The chevron `symbol-*.svg` files render as the triple-globe mark at large sizes; only use them at small sizes (logo lockups, watermarks ≤6cqw) — never as a giant background. 10. All measurements inside a slide use `cqw` so the slide scales at any size. --- ## Copy guidelines (filling the slots) Write like the brand: direct, confident, builder-to-builder, forward-looking (see brand.md → Voice & Tone). Concrete length limits so slides never overflow their frame: | Slot type | Limit | Notes | |---|---|---| | Eyebrow | 2–4 words, UPPERCASE | A label, not a sentence: `HOW IT WORKS`, `2025 — FIRST EDITION`. | | Headline | ≤ 12 words | One idea. Put the punch word(s) in `{{HEADLINE_HIGHLIGHT}}` (lime). | | Body paragraph | ≤ 2 sentences (~30 words) | Supports the headline; don't restate it. | | Stat value | ≤ 6 chars | `+170`, `$3,610`, `+2M`, `3`. | | Stat / step / tile label | ≤ 4 words | | | Quote (manifesto) | ≤ 28 words | Highlight the turn of phrase in lime. | | CTA label | ≤ 4 words | Verb-first: `Apply at ipe.city`. | - Exactly **one** lime highlight per headline — it's an accent, not a highlighter. - Numbers beat adjectives: prefer a `big-number`/`stat-grid` over "huge", "massive". - If copy won't fit the limit, the slide is doing too much — split it into two. --- ## Worked example (end-to-end) Three filled slides to paste into the scaffold's paste zone (tones gradient → navy → gradient). Opened in a browser they present themselves; real decks follow the same pattern. ```html
Ipê Village
APR 6—MAY 1

Village 2026

A month-long pop-up village for the network state.

April 6 — May 1, 2026
Jurerê Internacional, Brazil

2025 — First edition

Brazil's first pop-up village was a massive success.

+170

Residents & visitors

+2M

Social media views

+30

Apps created

$3,610

Spent onchain locally

+10

Countries represented

3

New couples

Ipê Village
APR 6—MAY 1

See you in Florianópolis.

Applications for residents, Hacker House partners, and speakers are open. We pair on a rolling basis until Mar 15.

Apply at ipe.city→

Applications close Mar 15

jean@ipe.city@ipecity on Xdocs.ipe.city
``` Dropped into the scaffold and opened in a browser, these present themselves (→ to advance) and print to a 16:9 PDF. Add the rest the same way — one `
` per template block, tones alternating and canvases varied — for a complete, world-class deck.