# Design foundations (`design.md`)

## Brand positioning — as implemented

The public site communicates **premium digital craftsmanship** anchored in multilingual delivery (default English at `/`, numerous localized stacks). Organizational schema (`config/seo.php`) encodes factual positioning: Lisbon-headquartered digital marketing consultancy with multinational clients, emphasizing measurable outcomes—not abstract “creative fluff”.

Dashboard surfaces reflect **operations-first clarity** (dense cards, KPIs, pipeline states).

## Visual identity laws

| Law | Manifestation |
| --- | --- |
| Teal kinetic accent | `criazo-*` ramps + `#00b7b2` CTA anchors |
| Monochrome scaffolding | Neutral palette for body text and chrome |
| Rounded fidelity | Pill CTAs (`rounded-full`) + soft cards (`rounded-2xl` / `rounded-3xl`) |
| Glass overlays | Translucent blurred panels (`glass-effect`, `.glass-panel` on dashboard) |

## UX & conversion directives

1. **Progressive funneling** — Awareness (hero/industry narratives) → Consideration (case studies/logos/pricing calculators) → Action (sticky CTA + forms).
2. **Never orphan a page** — `explore-site-section` closing pattern + footer mega-matrix maintain crawl + user paths.
3. **Trust before complexity** — Logos/stat blocks precede accordion-deep educational content where templates allow.
4. **Locale integrity** — All user-visible marketing strings originate from `__('messages.*')` keys; avoids mixed-language leakage.

## SEO-first architecture defaults

Layouts centralize canonical, OG/Twitter, hreflang, and mandatory schema scaffolding. Adding a marketing page means **riding `layouts/app.blade.php`**, injecting stack sections, avoiding duplicate conflicting meta generators.

## Performance alignment

Tailwind CDN is acceptable for SSR marketing speed when paired with inlined critical CSS in layout. Respect `preload` cues for hero imagery (see homepage). Dashboard views ship separate manifests + service workers—these must remain isolated.

## Collaboration contract

- Designers annotate **Blade component paths** with wireframes.
- Engineers reference **this dossier + PHP registries** before introducing new CSS classes.
- Marketers log copy updates in translation files, not inline strings.

For token-level fidelity, defer to [`tokens.md`](tokens.md).