/* ==========================================================================
   PRISME AMIENS — Design tokens & composants de base
   Palette extraite directement du logo (dégradé vert → bleu → violet →
   magenta → corail, étincelle or). Fond sombre, texte blanc, boutons
   pilule blancs — conforme à la direction artistique déjà en place sur
   le site (cf. page d'accueil).

   Police : Poppins, auto-hébergée (fichiers .woff2 dans ../fonts/) plutôt
   que chargée depuis Google Fonts — évite l'envoi de l'IP des visiteurs
   à un tiers, cohérent avec la posture RGPD déjà affichée par PRISME
   pour l'application PRISME Amiens.
   ========================================================================== */

@font-face {
	font-family: "Poppins PRISME";
	src: url("../fonts/poppins-v24-latin-regular.woff2") format("woff2");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: "Poppins PRISME";
	src: url("../fonts/poppins-v24-latin-600.woff2") format("woff2");
	font-weight: 600;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: "Poppins PRISME";
	src: url("../fonts/poppins-v24-latin-700.woff2") format("woff2");
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}

:root {
	--prisme-fond: #17171A;
	--prisme-fond-carte: #201F24;
	--prisme-bordure: #34333B;
	--prisme-texte: #FFFFFF;
	--prisme-texte-att: #A9A9B4;

	--prisme-vert: #2ECC71;
	--prisme-bleu: #2F8FE0;
	--prisme-violet: #7B5CF0;
	--prisme-magenta: #E14FA0;
	--prisme-corail: #F0653C;
	--prisme-or: #F5A623;

	--prisme-font: "Poppins PRISME", "Helvetica Neue", Arial, sans-serif;
	--prisme-radius: 18px;
	--prisme-radius-pill: 999px;
}

/* Composant carte sombre partagé (crise, FAQ, programmes) */
.prisme-card {
	font-family: var(--prisme-font, "Helvetica Neue", Arial, sans-serif);
	background: var(--prisme-fond-carte, #201F24) !important;
	color: var(--prisme-texte, #FFFFFF) !important;
	border: 1px solid var(--prisme-bordure, #34333B);
	border-radius: var(--prisme-radius, 18px);
}

/* Bouton pilule blanc — identique au style des CTA de la page d'accueil */
.prisme-btn-pill {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	font-family: var(--prisme-font);
	font-weight: 600;
	font-size: 15px;
	background: #FFFFFF;
	color: #17171A;
	border: none;
	border-radius: var(--prisme-radius-pill);
	padding: 13px 22px;
	text-decoration: none;
	cursor: pointer;
	transition: transform 0.12s ease, opacity 0.12s ease;
}
.prisme-btn-pill:hover,
.prisme-btn-pill:focus-visible {
	opacity: 0.9;
	transform: translateY(-1px);
	color: #17171A;
}
.prisme-btn-pill:active {
	transform: translateY(0);
	opacity: 0.8;
}

/* Variante pleine largeur (boutons d'action sur mobile) */
.prisme-btn-pill--block {
	display: flex;
	width: 100%;
}