---
name: style-portfolio
description: Portfolio / showcase design - huge typography, image-first, minimal chrome, narrative scroll. Use when the user asks for "portfolio", "showcase", "case study", "studio", "agency", "creative folio" style.
---

# Style Portfolio

Le travail parle, l'interface disparaît. La navigation est un cadre, pas un sujet.

## Palette

- BG: noir profond `#0a0a0a` ou blanc éclatant `#ffffff` - jamais entre les deux.
- FG: contraste maximum (`#ffffff` sur noir, `#000000` sur blanc).
- Un seul accent chromatique (souvent la couleur du projet en cours).

## Typographie

- Display: XL (10-15vw), display bold ou black (Neue Machina, PP Neue Montreal, Suisse Int'l, Outfit Black), letter-spacing serré à -0.04em.
- Body: sans neutre 17-19 px, line-height 1.5.
- Kicker: mono ou uppercase small letter-spacing 0.2em.

## Layout

- Sections plein écran (`100vh`), une par projet.
- Grid éditorial cassée : image 8-col, texte 4-col alternés.
- Marges 4-8%, respiration verticale forte (8-12rem entre sections).
- Navigation cachée après scroll, réapparaît au scroll-up.

## Motion

- Reveal au scroll (blur+fade+up), stagger 60-120ms entre éléments.
- Curseur custom qui grossit sur les liens (`mix-blend-mode: difference`).
- Media autoplay + loop sur les covers projet.
- Transitions inter-pages avec Framer Motion ou Next `router` events.

## Rules

- Une seule police display sur tout le site.
- Zéro card avec ombre - les images se suffisent.
- Chaque projet a sa propre couleur signature, tokens override localement.