/* Jetons de design — repris de la charte du Compagnon (§4 et §9 du handoff).
   Source de vérité unique : aucune valeur de couleur, de typo ou d'espacement
   ne doit être écrite en dur ailleurs dans le thème. */

:root {
	/* --- Couleurs --------------------------------------------------------- */
	--pt-night: #0a2434;        /* bandeaux d'engagement : header, hero, prix */
	--pt-night-deep: #06151f;   /* pied de page final */
	--pt-cream: #faf7f0;        /* fond de page */
	--pt-cream-deep: #f5f0e6;   /* section alternée, vignettes neutres */
	--pt-card: #fcfaf5;         /* carte au repos (#fff au survol) */
	--pt-line: #e5ddcf;         /* toutes les bordures et filets, 1 px */
	--pt-line-strong: #cfc5b1;  /* filet des cadres de commerce, qui portent du blanc */
	--pt-band: #f3eee2;         /* bandeau d'achat (fiche produit, commande) */
	--pt-strike: #96a09a;       /* prix barré */

	--pt-ink: #1f2a24;          /* texte principal */
	--pt-ink-body: #2b3630;     /* corps d'article */
	--pt-ink-soft: #4a544d;     /* texte secondaire */
	--pt-ink-muted: #8a9688;    /* métadonnées, tertiaire */

	--pt-primary: #507249;      /* GRATUIT : blog, PDF, newsletter, Compagnon */
	--pt-primary-hover: #4c6d46;
	/* ⚠ SUR FOND NIGHT UNIQUEMENT — logo, progression, accents du pied.
	   Sur le crème il donne 1,87 de contraste : illisible, et invisible à la
	   relecture parce que ça « fait joli ». Sur fond clair, c'est --pt-primary. */
	--pt-primary-lite: #9cc196;
	--pt-primary-ul: #f0f5ef;   /* fond des blocs verts */

	--pt-brown: #8b4513;        /* PAYANT : formations — et ce qui alerte */
	--pt-brown-hover: #7a3d11;

	/* --- Alias de compatibilité ------------------------------------------
	   Ce ne sont PAS de nouvelles valeurs de charte : ce sont deux noms
	   appelés par les blocs HTML écrits à la main dans les articles, et qui
	   n'ont jamais existé ici. Une variable absente n'émet aucune erreur — la
	   déclaration est simplement ignorée. Résultat mesuré sur
	   `/methode-421-charcuterie/` : trois survols de boutons sans effet et une
	   étiquette de pourcentage sans couleur, dans le calculateur de salaison.
	   On les fait pointer vers les jetons qui existent plutôt que d'aller
	   corriger six déclarations dans du contenu. */
	--pt-primary-dk: var(--pt-primary-hover);
	--pt-brown-soft: var(--pt-brown);
	--pt-sand: #d4c6a3;         /* accent sur fond night */

	/* Textes sur fond night */
	--pt-on-night: #ffffff;
	--pt-on-night-body: #d3ddd0;
	--pt-on-night-nav: #cfe0c9;
	--pt-on-night-muted: #9fb0a8;

	/* --- Typographie ------------------------------------------------------ */
	--pt-font-title: "Tenor Sans", "Cormorant Garamond", Georgia, serif;
	--pt-font-body: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;

	/* --- Formes ----------------------------------------------------------- */
	--pt-radius: 0;             /* zéro coin arrondi, nulle part */
	--pt-border: 1px solid var(--pt-line);
	--pt-border-strong: 1px solid var(--pt-night);
	--pt-border-alert: 1px solid var(--pt-brown);
	--pt-border-free: 1px solid var(--pt-primary);
	--pt-border-soon: 1px dashed var(--pt-sand);

	--pt-shadow-card: 0 10px 30px rgba(10, 36, 52, 0.07);
	--pt-shadow-float: 0 30px 70px rgba(0, 0, 0, 0.35);

	--pt-transition-card: 0.15s;
	--pt-transition-button: 0.18s;

	/* --- Espacements ------------------------------------------------------ */
	--pt-section: 84px;         /* rythme vertical de section, desktop */
	--pt-section-tight: 56px;
	--pt-section-airy: 112px;
	--pt-gutter: 56px;          /* gouttière horizontale desktop */
	--pt-card-pad: 26px;

	/* --- Largeurs --------------------------------------------------------- */
	--pt-wrap: 1160px;          /* largeur du gabarit article */
	--pt-wrap-wide: 1180px;
	--pt-wrap-narrow: 1040px;
	--pt-measure: 700px;        /* colonne de texte d'article */
	--pt-rail: 250px;           /* rail de sommaire */
	--pt-rail-gap: 52px;
}

/* 768–1023 px : gouttières resserrées */
@media (max-width: 1023px) {
	:root {
		--pt-gutter: 32px;
		--pt-section: 64px;
		--pt-rail-gap: 32px;
	}
}

/* < 768 px : une colonne */
@media (max-width: 767px) {
	:root {
		--pt-gutter: 18px;
		--pt-section: 40px;
		--pt-section-tight: 26px;
		--pt-card-pad: 18px;
	}
}