/*
* NeuroSphere — Design Tokens v2
* Source de vérité : _design-reference/neurosphere-design-system.md
* Ne pas modifier manuellement — éditer le design system puis répercuter ici.
*
* Chargé après Bootstrap, avant styles.css.
*/
/* ── 1. Couleurs de marque ────────────────────────────────── */
:root {
/* Indigo */
--indigo-900: #1C2340; /* headers, footer, titres, boutons primaires */
--indigo-700: #2B3465; /* hover sur indigo-900 */
--indigo-100: #E7E9F5; /* fond hover discret (nav, ghost buttons) */
/* Turquoise */
--turquoise: #2FB8A6; /* accent principal — liens, hover, CTA secondaires */
--turquoise-dim: #1F8E7F; /* texte sur fond turquoise-soft, hover accent */
--turquoise-soft: #DCF3F0; /* fonds de tags, badges de disponibilité */
/* Violet */
--violet: #7C6FE0; /* accent premium — badge Partenaire, blocs confiance */
--violet-dim: #5F52C4; /* texte sur fond violet-soft */
--violet-soft: #EDEAFC; /* fond des blocs de confiance / badges */
/* Succès */
--mint-soft: #DFF6EA; /* fonds succès / états positifs discrets */
}
/* ── 2. Neutres ───────────────────────────────────────────── */
:root {
--bg-paper: #FAFBFC; /* fond par défaut (blanc cassé) */
--bg-pale: #F0F3FA; /* alternance de sections */
--surface: #FFFFFF; /* cards, éléments élevés */
--ink: #1E2138; /* texte principal */
--ink-dim: #5B5F79; /* texte secondaire */
--ink-mute: #8E92A8; /* texte tertiaire, placeholders */
--line: rgba(28,35,64,.09); /* bordures discrètes */
--line-strong: rgba(28,35,64,.16); /* bordures marquées, séparateurs */
}
/* ── 3. Typographie ───────────────────────────────────────── */
:root {
--ff-display: "Bricolage Grotesque", sans-serif; /* H1–H3, wordmark */
--ff-body: "Inter", sans-serif; /* paragraphes, UI, boutons */
--ff-mono: "IBM Plex Mono", monospace; /* eyebrows, labels, stats */
}
/* ── 4. Rayons ────────────────────────────────────────────── */
:root {
--radius-s: 12px; /* petits éléments, tags */
--radius-m: 18px; /* cards standard */
--radius-l: 26px; /* cards principales, hero */
--radius-pill: 999px; /* boutons, badges */
}
/* ── 5. Élévation ─────────────────────────────────────────── */
:root {
--shadow-card: 0 1px 2px rgba(28,35,64,.05), 0 10px 24px -14px rgba(28,35,64,.14);
--shadow-card-hover:0 4px 10px rgba(28,35,64,.06), 0 18px 34px -16px rgba(28,35,64,.18);
}
/*
* ── Filtre SVG duotone ─────────────────────────────────────────────────────
* Colorise les photos réelles dans la palette indigo → turquoise pâle.
* Usage CSS : ajouter la classe .duotone sur un ![]()
ou .
* Snippet à inclure UNE FOIS en haut de sur chaque template PHP :
*
*
*
* Pour l'activer sur une image : 
*/
.duotone { filter: url(#duotone-brand); }