/* Cabinet CAP — tokens du design system (design-system-bd61efae), repris à l'identique. Source : charte graphique officielle. Ces valeurs font foi ; ne pas les modifier ici sans mettre à jour le design system. Fonte : la charte prescrit Futura PT ; Jost* la remplace faute de licence web (chargée dans le ). */ :root { /* Harmonie 6 teintes (charte p.4), dans l'ordre imposé */ --cap-vert-jaune: #7EBD5A; --cap-vert-bleu: #36A67B; --cap-bleu-clair: #71C9E6; --cap-bleu: #3F82C4; --cap-violet: #504596; --cap-violet-fonce: #33295D; /* Neutres charte */ --cap-noir: #1D1D1B; --cap-gris-texte: #706F6F; --cap-blanc: #FFFFFF; --cap-encre: #2C2E35; /* Teintes claires dérivées */ --cap-vert-jaune-050: #F1F8EC; --cap-vert-jaune-100: #DDEED0; --cap-vert-bleu-050: #EAF6F1; --cap-vert-bleu-100: #C6E7DA; --cap-bleu-clair-050: #EEF9FD; --cap-bleu-clair-100: #D3EFF8; --cap-bleu-050: #EDF3FA; --cap-bleu-100: #CFE0F1; --cap-violet-050: #EFEEF6; --cap-violet-100: #D3D0E6; --cap-violet-fonce-050: #EBEAF0; --cap-violet-fonce-100: #C8C5D5; /* Teintes sombres (survol, pression) */ --cap-bleu-600: #356EA6; --cap-bleu-700: #2B5A88; --cap-violet-600: #443B80; --cap-violet-700: #372F69; --cap-vert-bleu-600: #2E8D69; --cap-vert-jaune-600: #6BA24D; /* Gris neutres */ --gris-050: #F7F7F8; --gris-100: #EFEFF1; --gris-200: #E2E2E5; --gris-300: #CBCBD0; --gris-400: #A5A5AC; --gris-500: #807F85; --gris-600: #5E5E64; --gris-700: #414147; /* Alias sémantiques */ --text-fort: var(--cap-encre); --text-body: var(--cap-gris-texte); --text-doux: var(--gris-500); --text-inverse: #FFFFFF; --text-lien: var(--cap-bleu); --text-lien-hover: var(--cap-violet); --surface-page: #FFFFFF; --surface-douce: var(--gris-050); --surface-carte: #FFFFFF; --surface-encre: var(--cap-encre); --surface-accent: var(--cap-violet-fonce); --bordure: var(--gris-200); --bordure-forte: var(--gris-300); --bordure-focus: var(--cap-bleu); --action-primaire: var(--cap-violet); --action-primaire-hover: var(--cap-violet-600); --action-primaire-active: var(--cap-violet-700); --action-secondaire: var(--cap-bleu); --action-secondaire-hover: var(--cap-bleu-600); --action-secondaire-active: var(--cap-bleu-700); --succes: var(--cap-vert-bleu); --succes-doux: var(--cap-vert-bleu-050); --info: var(--cap-bleu-clair); --info-doux: var(--cap-bleu-clair-050); --attention: #D98B2B; --attention-doux: #FBF1E4; --erreur: #C4453F; --erreur-doux: #FAECEB; /* Typographie */ --font-core: "Jost", "Futura PT", "Futura", -apple-system, "Segoe UI", sans-serif; --font-display: var(--font-core); --poids-light: 300; --poids-book: 400; --poids-medium: 500; --poids-demi: 600; --poids-bold: 700; --taille-3xs: 11px; --taille-2xs: 12px; --taille-xs: 13px; --taille-sm: 15px; --taille-md: 17px; --taille-lg: 20px; --taille-xl: 24px; --taille-2xl: 30px; --taille-3xl: 38px; --taille-4xl: 48px; --taille-5xl: 62px; --taille-6xl: 80px; --interligne-serre: 1.1; --interligne-titre: 1.18; --interligne-normal: 1.5; --interligne-aere: 1.65; --espacement-titre: -0.015em; --espacement-caps: 0.14em; --type-display: var(--poids-bold) var(--taille-5xl)/var(--interligne-serre) var(--font-display); --type-h1: var(--poids-bold) var(--taille-4xl)/var(--interligne-titre) var(--font-display); --type-h2: var(--poids-medium) var(--taille-3xl)/var(--interligne-titre) var(--font-display); --type-h3: var(--poids-medium) var(--taille-2xl)/var(--interligne-titre) var(--font-display); --type-h4: var(--poids-medium) var(--taille-xl)/var(--interligne-titre) var(--font-core); --type-chapo: var(--poids-light) var(--taille-lg)/var(--interligne-aere) var(--font-core); --type-body: var(--poids-book) var(--taille-md)/var(--interligne-normal) var(--font-core); --type-body-sm: var(--poids-book) var(--taille-sm)/var(--interligne-normal) var(--font-core); --type-label: var(--poids-medium) var(--taille-xs)/1.3 var(--font-core); --type-surtitre: var(--poids-medium) var(--taille-2xs)/1.3 var(--font-core); /* Espacements (base 4) */ --esp-1: 4px; --esp-2: 8px; --esp-3: 12px; --esp-4: 16px; --esp-5: 20px; --esp-6: 24px; --esp-7: 32px; --esp-8: 40px; --esp-9: 48px; --esp-10: 64px; --esp-11: 80px; --esp-12: 96px; --esp-13: 128px; --gouttiere: 24px; --largeur-contenu: 1200px; --largeur-texte: 68ch; --epaisseur-regle: 6px; /* Rayons */ --rayon-xs: 3px; --rayon-sm: 6px; --rayon-md: 10px; --rayon-lg: 16px; --rayon-xl: 24px; --rayon-pill: 999px; /* Élévations */ --ombre-1: 0 1px 2px rgba(29,29,27,.06), 0 1px 1px rgba(29,29,27,.04); --ombre-2: 0 2px 8px rgba(29,29,27,.07), 0 1px 2px rgba(29,29,27,.05); --ombre-3: 0 8px 24px rgba(29,29,27,.09), 0 2px 6px rgba(29,29,27,.05); --ombre-4: 0 18px 48px rgba(51,41,93,.14), 0 4px 12px rgba(29,29,27,.06); --ombre-focus: 0 0 0 3px rgba(63,130,196,.35); --voile-violet: rgba(51,41,93,.55); /* Mouvement */ --duree-instant: 90ms; --duree-rapide: 160ms; --duree-normale: 240ms; --duree-lente: 420ms; --courbe-sortie: cubic-bezier(.2,.7,.3,1); --courbe-entree: cubic-bezier(.4,0,1,1); --courbe-douce: cubic-bezier(.4,0,.2,1); --transition-ui: all var(--duree-rapide) var(--courbe-sortie); }