# Copa Digital Design System — instructions

Use these maintained instructions before creating or reviewing any Copa presentation, campaign, digital asset, interface, internal communication, or other branded material.

Complete the work yourself. Do not ask the user to copy files manually.

## Load the complete guide

Fetch and read the full document at:

```text
https://copa-digital-design-system.pages.dev/design-system.md
```

If this prompt is served from a preview or custom domain, also try `/design-system.md` on the same origin and prefer the newest dated copy.

Read the complete guide before making design decisions. Apply only the sections relevant to the requested deliverable; do not force web implementation rules onto a presentation or static asset.

## Preserve the order of authority

Use this precedence when sources disagree:

- Explicit brief, approved copy, and deliverable requirements.
- Official Copa Airlines brand manuals, components, and production assets.
- The fetched Copa Digital Design System guide.
- Comparable approved Copa implementations.
- Documented design judgment.

Never present a working convention or pending item as an official brand rule. If the guide does not cover a decision, identify the gap instead of inventing a Copa standard.

## Apply guidance by deliverable

- Presentations and internal documents: apply hierarchy, typography, palette, logo ownership, official iconography, legibility, and export quality.
- Marketing and campaign assets: apply the approved brand, placement, copy, CTA, responsive or format requirements, and production asset rules.
- Interfaces, landings, and promotional modules: also apply semantic structure, accessibility, responsive reflow, isolated implementation, asset paths, and relevant build checks.
- Any other internal material: use the closest applicable confirmed rules and clearly mark decisions that remain specific to that piece.

## Use Copa visual language only

- Do not use OpenAI visual patterns, components, icons, status pills, or decorative conventions in Copa work.
- Do not use decorative numbering for capabilities, benefits, or principles. Use numbering only when sequence is meaningful.
- Do not use detached uppercase title lashes, eyebrows, or kickers as generic section labels.
- When system context is required, use the confirmed Website Patterns section header: Primary / Main rounded surface, one short contextual line in white sentence case, and the main section title in large white type.
- Use the official two-family typography strategy: Gilroy for titles and large display text; Suisse Int’l for small text, functional UI, controls, labels, data, and long paragraphs where readability is critical.
- Do not make Gilroy the universal body family. Load only the approved font files and weights used by the deliverable; do not synthesize bold or italic.
- Use official Copa logos, colors, pictograms, and icon assets without recoloring, stretching, rebuilding, or inventing variants.
- Build official icon URLs by family, color, and canonical filename. Consult:
  `https://copa-digital-design-system.pages.dev/docs/design-references/copa-icons-cdn-catalog.md`
- Pair alert icons with explicit text. Do not rely on color or icon shape alone.

## Validate for the requested output

For every deliverable, check the brief, content accuracy, brand ownership, correct Gilroy/Suisse role assignment, font-file loading, color, icon source, logo treatment, hierarchy, contrast, legibility, dimensions, and export format.

For web or interactive deliverables, additionally run the available build, lint, and relevant tests; review mobile, tablet, desktop, keyboard interaction, focus visibility, horizontal overflow, asset paths, browser console, language expansion, and implementation isolation.

When finished, state which official sources were used, which decisions are specific to the deliverable, what was validated, and what remains pending.

## Canonical resources

- Human entrypoint: `https://copa-digital-design-system.pages.dev/`
- Full guide: `https://copa-digital-design-system.pages.dev/design-system.md`
- Icon catalog: `https://copa-digital-design-system.pages.dev/docs/design-references/copa-icons-cdn-catalog.md`
- Discovery file: `https://copa-digital-design-system.pages.dev/llms.txt`