/* ==========================================================================
   Pour Toujours — Répertoire des fournisseurs (fiche, répertoire, catégories, régions)

   Même langage que les articles et les catégories du blogue (pour-toujours-aide, aide.css) :
   titres pleins et serrés, ligne d'accent en Georgia, surtitres rouille, fonds pâles
   (rose, vert pâle, sable), photos arrondies, pastilles à contour, aucune ombre.
   Règles : jamais de section à fond vert foncé; pas de mouvement au survol;
   Georgia seulement pour les lignes d'accent (jamais pour les chiffres).
   ========================================================================== */

/* ---------- Pleine largeur (Astra) ---------- */

.pf-page .site-content > .ast-container {
	max-width: none;
	padding-left: 0;
	padding-right: 0;
}

.ast-container > .ptg.pf {
	flex: 1 1 100%;
	width: 100%;
	min-width: 0;
	max-width: 100%;
}

/* ---------- Jetons (repris de aide.css) ---------- */

.pf {
	--pf-ink: #0b1616;
	--pf-ink-2: #2a3434;
	--pf-muted: #4a5555;
	--pf-soft: #5c6666;
	--pf-accent: #f7aea1;
	--pf-accent-strong: #f39a8a;
	--pf-rust: #8a4a40;
	--pf-tint: #fcefec;
	--pf-mint: #f3faf6;
	--pf-mint-2: #e3f0e8;
	--pf-sand: #f7f3f1;
	--pf-line: #ece4e0;
	--pf-line-2: #dcd3cf;
	--pf-chip: #e0d6d2;
	--pf-green: #2f6b55;
	--pf-amber: #8a6a2f;
	--pf-red: #b0403a;
	--pf-gutter: clamp(20px, 3vw, 48px);
	/* Distance sous l'en-tête fixe du site : mesurée en JS (pt-fournisseurs.js), 104px par défaut. */
	--pf-top: 104px;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 16px;
	line-height: 1.6;
	color: var(--pf-ink);
	background: #fff;
	-webkit-font-smoothing: antialiased;
}

.pf .ptg-wrap {
	max-width: 1520px;
	padding-left: var(--pf-gutter);
	padding-right: var(--pf-gutter);
}

.pf h1,
.pf h2,
.pf h3 {
	font-family: Helvetica, Arial, sans-serif;
	color: var(--pf-ink);
	letter-spacing: 0;
}

/* ---------- Éléments communs ---------- */

.pf .pf-eyebrow {
	display: block;
	margin: 0 0 10px;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--pf-rust);
}

.pf .pf-eyebrow--sub {
	margin-top: 24px;
	font-size: 12px;
}

.pf .pf-h2 {
	margin: 0 0 16px;
	font-size: clamp(24px, 2vw, 30px);
	font-weight: 800;
	line-height: 1.15;
	letter-spacing: -0.02em;
}

.pf .pf-muted {
	margin-top: 14px;
	font-size: 14px;
	color: var(--pf-soft);
}

.pf .pf-link {
	font-weight: 700;
	color: var(--pf-ink);
	text-decoration: underline;
	text-decoration-color: var(--pf-accent);
	text-decoration-thickness: 2px;
	text-underline-offset: 4px;
	transition: text-decoration-color 0.15s;
}

.pf .pf-link:hover {
	text-decoration-color: var(--pf-ink);
}

.pf .pf-crumbs {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0 0 18px;
	font-size: 14px;
	color: var(--pf-muted);
}

.pf .pf-crumbs a {
	text-decoration: none;
}

.pf .pf-crumbs a:hover {
	text-decoration: underline;
}

.pf .pf-crumbs [aria-current] {
	font-weight: 700;
	color: var(--pf-ink);
}

/* Boutons (comme .pt-aide-btn) */

.pf .pf-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-height: 48px;
	padding: 14px 22px;
	border: 1.5px solid transparent;
	border-radius: 999px;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 16px;
	font-weight: 800;
	line-height: 1;
	text-decoration: none;
	cursor: pointer;
	transition: background-color 0.15s, color 0.15s;
}

.pf .pf-btn--accent {
	background: var(--pf-accent);
	color: var(--pf-ink);
}

.pf .pf-btn--accent:hover {
	background: var(--pf-accent-strong);
	color: var(--pf-ink);
}

.pf .pf-btn--dark {
	background: var(--pf-ink);
	color: #fff;
}

.pf .pf-btn--dark:hover {
	background: var(--pf-ink-2);
	color: #fff;
}

/* Pastilles */

.pf .pf-pill {
	display: inline-flex;
	align-items: center;
	padding: 4px 10px;
	border-radius: 999px;
	background: var(--pf-accent);
	color: var(--pf-ink);
	font-size: 12px;
	font-weight: 700;
	line-height: 1.3;
}

.pf .pf-pill--white {
	background: #fff;
}

.pf .pf-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.pf .pf-chips a {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 40px;
	padding: 8px 16px;
	border: 1px solid var(--pf-chip);
	border-radius: 999px;
	background: #fff;
	color: var(--pf-ink);
	font-weight: 600;
	text-decoration: none;
	transition: border-color 0.15s;
}

.pf .pf-chips a:hover {
	border-color: var(--pf-ink);
}

.pf .pf-chips a[aria-current] {
	background: var(--pf-tint);
	border-color: var(--pf-accent);
}

.pf .pf-chips a span {
	font-size: 13px;
	font-weight: 700;
	color: var(--pf-soft);
}

/* Niveau de prix, pastille certifiée, disponibilité */

.pf .pf-dots {
	display: inline-flex;
	font-weight: 700;
	letter-spacing: 0.02em;
	color: var(--pf-line-2);
}

.pf .pf-dots .is-on {
	color: var(--pf-ink);
}

.pf .pf-badge {
	display: inline-flex;
	color: var(--pf-green);
	vertical-align: middle;
}

.pf .pf-dot {
	display: inline-block;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: currentColor;
}

.pf .pf-dispo--disponible {
	color: var(--pf-green);
}

.pf .pf-dispo--places_limitees {
	color: var(--pf-amber);
}

.pf .pf-dispo--complet {
	color: var(--pf-red);
}

/* Citation avec trait rose (comme .pt-quote) */

.pf .pf-quote-line {
	margin: 0 0 18px;
	padding: 0 0 0 14px;
	border-left: 2px solid var(--pf-accent);
}

.pf .pf-quote-line p {
	margin: 0;
	font-family: Georgia, "Times New Roman", serif;
	font-size: 16px;
	line-height: 1.4;
	color: var(--pf-ink);
}

/* Listes numérotées : chiffres en Helvetica, centrés dans le cercle. */

.pf .pf-numbered {
	display: grid;
	gap: 12px;
	margin: 0;
	padding: 0;
	list-style: none;
	counter-reset: q;
}

.pf .pf-numbered li {
	position: relative;
	min-height: 28px;
	padding: 2px 0 0 42px;
	counter-increment: q;
}

.pf .pf-numbered li::before {
	content: counter(q);
	position: absolute;
	left: 0;
	top: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	border-radius: 50%;
	background: #fff;
	color: var(--pf-rust);
	font-family: Helvetica, Arial, sans-serif;
	font-size: 13px;
	font-weight: 700;
	line-height: 1;
	font-variant-numeric: lining-nums tabular-nums;
}

/* Puces roses (comme « L'essentiel » des articles) */

.pf .pf-bullets,
.pf .pf-essentiel ul {
	display: grid;
	gap: 10px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.pf .pf-bullets li,
.pf .pf-essentiel li {
	position: relative;
	padding-left: 26px;
}

.pf .pf-bullets li::before,
.pf .pf-essentiel li::before {
	content: "";
	position: absolute;
	left: 4px;
	top: 0.6em;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--pf-accent);
}

.pf .pf-bullets {
	margin-top: 20px;
}

/* Encadrés pâles */

.pf .pf-callout {
	padding: 28px 32px;
	border-radius: 22px;
}

.pf .pf-callout--tint {
	background: var(--pf-tint);
}

.pf .pf-callout--sand {
	background: var(--pf-sand);
}

.pf .pf-callout--mint {
	background: var(--pf-mint);
}

.pf .pf-callout__title {
	margin: 0 0 14px;
	font-size: 22px;
	font-weight: 800;
	line-height: 1.2;
	letter-spacing: -0.02em;
}

.pf .pf-callout__actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 14px 22px;
	margin-top: 22px;
}

/* ==========================================================================
   Répertoire : en-tête rose, liste, cartes
   ========================================================================== */

.pf .pf-hero {
	padding: 26px 0 28px;
	background: var(--pf-tint);
}

/* En-tête compact : on veut voir les fournisseurs tout de suite. */
.pf .pf-hero__grid {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	justify-content: space-between;
	gap: 16px 48px;
}

.pf .pf-hero .pf-crumbs {
	margin-bottom: 12px;
}

.pf .pf-hero__title {
	margin: 0;
	font-size: clamp(28px, 2.8vw, 40px);
	font-weight: 800;
	line-height: 1.08;
	letter-spacing: -0.03em;
}

.pf .pf-hero__lead {
	max-width: 80ch;
	margin: 8px 0 0;
	font-size: 16px;
	color: var(--pf-ink-2);
}

.pf .pf-hero__trust {
	display: flex;
	flex-wrap: wrap;
	gap: 6px 18px;
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: 14px;
	font-weight: 700;
}

.pf .pf-hero__trust li {
	display: inline-flex;
	align-items: center;
	gap: 6px;
}

.pf .pf-hero__trust .pf-ico {
	color: var(--pf-green);
}

.pf .pf-listing {
	padding-top: 28px;
}

.pf .pf-listing__head {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 16px 24px;
	margin-bottom: 18px;
}

.pf .pf-listing__head .pf-h2 {
	margin: 0;
}

/* Filtres : contrôles en pastilles, comme « Filtrer les guides… » */

.pf .pf-filters {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
}

.pf .pf-filter select,
.pf .pf-filter input {
	min-height: 44px;
	padding: 9px 16px;
	border: 1px solid var(--pf-line-2);
	border-radius: 999px;
	background: #fff;
	color: var(--pf-ink);
	font-family: inherit;
	font-size: 15px;
	transition: border-color 0.15s;
}

.pf .pf-filter select {
	appearance: none;
	padding-right: 40px;
	background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath fill='none' stroke='%230b1616' stroke-width='1.8' d='M5 8l5 5 5-5'/%3E%3C/svg%3E") right 14px center / 14px no-repeat;
	cursor: pointer;
}

.pf .pf-filter--short input {
	width: 120px;
}

.pf .pf-filter select:hover,
.pf .pf-filter input:hover {
	border-color: var(--pf-ink);
}

.pf .pf-filter select:focus,
.pf .pf-filter input:focus {
	outline: 2px solid var(--pf-accent);
	outline-offset: 1px;
	border-color: var(--pf-ink);
}

.pf .pf-budget {
	display: flex;
	margin: 0;
	padding: 3px;
	border: 1px solid var(--pf-line-2);
	border-radius: 999px;
	background: #fff;
}

.pf .pf-budget label {
	position: relative;
	display: flex;
}

.pf .pf-budget input {
	position: absolute;
	opacity: 0;
	pointer-events: none;
}

.pf .pf-budget label > span {
	display: flex;
	align-items: center;
	min-height: 36px;
	padding: 0 13px;
	border-radius: 999px;
	font-size: 14px;
	font-weight: 700;
	white-space: nowrap;
	cursor: pointer;
	transition: background-color 0.15s;
}

.pf .pf-budget label:hover > span {
	background: var(--pf-sand);
}

.pf .pf-budget input:checked + span {
	background: var(--pf-tint);
	box-shadow: inset 0 0 0 1px var(--pf-accent);
}

.pf .pf-budget input:focus-visible + span {
	outline: 2px solid var(--pf-accent);
}

.pf-js .pf [data-pf-nojs] {
	display: none;
}

.pf .pf-catnav {
	margin-bottom: 8px;
}

.pf .pf-regionnav {
	align-items: center;
}

.pf .pf-regionnav__label {
	margin-right: 4px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--pf-rust);
	white-space: nowrap;
}

/* Résultats */

.pf .pf-results {
	padding-bottom: 56px;
	transition: opacity 0.15s;
}

.pf .pf-results.is-loading {
	opacity: 0.4;
	pointer-events: none;
}

.pf .pf-results__bar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	margin: 18px 0 16px;
}

.pf .pf-count {
	margin: 0;
	font-size: 14px;
	color: var(--pf-muted);
}

.pf .pf-clear {
	font-size: 14px;
}

.pf .pf-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 40px 24px;
}

/* Carte : sans cadre, photo arrondie, comme les cartes de guides. */

.pf .pf-card {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.pf .pf-card__media {
	position: relative;
	aspect-ratio: 16 / 9;
	margin-bottom: 10px;
	border-radius: 18px;
	overflow: hidden;
	background: var(--pf-sand);
}

.pf .pf-card__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: filter 0.15s;
}

.pf .pf-card:hover .pf-card__media img {
	filter: brightness(0.9);
}

.pf .pf-card__pills {
	position: absolute;
	top: 12px;
	left: 12px;
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
}

.pf .pf-card__name {
	display: flex;
	align-items: center;
	gap: 6px;
	margin: 0;
	font-size: 19px;
	font-weight: 700;
	line-height: 1.25;
}

.pf .pf-card__name a {
	color: var(--pf-ink);
	text-decoration: none;
}

.pf .pf-card__name a::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
}

.pf .pf-card:hover .pf-card__name a {
	text-decoration: underline;
	text-decoration-color: var(--pf-accent);
	text-decoration-thickness: 2px;
	text-underline-offset: 3px;
}

.pf .pf-card__tagline {
	margin: 0;
	font-size: 15px;
	line-height: 1.45;
	color: var(--pf-muted);
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.pf .pf-card__facts {
	margin: 0;
	font-size: 14px;
	color: var(--pf-ink-2);
}

.pf .pf-card__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 4px 6px;
	margin: 6px 0 0;
	font-size: 13px;
	font-weight: 700;
	color: var(--pf-rust);
}

.pf .pf-card__meta .pf-dots .is-on {
	color: var(--pf-rust);
}

.pf .pf-card__loc {
	font-weight: 400;
	color: var(--pf-soft);
}

.pf .pf-empty {
	max-width: 560px;
	margin: 24px auto;
	padding: 36px 28px;
	border-radius: 22px;
	background: var(--pf-sand);
	text-align: center;
	display: grid;
	gap: 12px;
	justify-items: center;
}

.pf .pf-empty h2 {
	margin: 0;
	font-size: 21px;
	font-weight: 800;
}

.pf .pf-pages ul {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 6px;
	margin: 40px 0 0;
	padding: 0;
	list-style: none;
}

.pf .pf-pages a,
.pf .pf-pages span {
	display: block;
	min-width: 42px;
	padding: 9px 13px;
	border: 1px solid var(--pf-chip);
	border-radius: 999px;
	text-align: center;
	text-decoration: none;
	font-weight: 700;
}

.pf .pf-pages a:hover {
	border-color: var(--pf-ink);
}

.pf .pf-pages .current {
	background: var(--pf-tint);
	border-color: var(--pf-accent);
}

.pf .pf-callout--split {
	display: grid;
	grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
	gap: 40px;
	align-items: center;
	margin-bottom: 24px;
}

.pf .pf-callout__aside {
	display: grid;
	gap: 14px;
	justify-items: start;
}

.pf .pf-more {
	padding: 16px 0 64px;
}

.pf .pf-pro {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 18px 32px;
}

.pf .pf-pro .pf-callout__title {
	margin-bottom: 4px;
}

.pf .pf-pro p:last-child {
	margin: 0;
	color: var(--pf-ink-2);
}

/* « Comment bien choisir » : conseils à gauche, guides du blogue à droite. */

.pf .pf-choose {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr);
	gap: 32px 64px;
	padding-top: 8px;
	padding-bottom: 48px;
	align-items: start;
}

.pf .pf-choose .pf-bullets {
	margin-top: 4px;
	font-size: 16px;
}

.pf .pf-choose__guides .pf-row {
	grid-template-columns: 160px minmax(0, 1fr);
	gap: 20px;
	padding: 14px 0;
}

.pf .pf-choose__guides .pf-row strong {
	font-size: 17px;
}

.pf .pf-choose__guides .pf-row small {
	font-size: 14px;
}

/* ==========================================================================
   Fiche : sommaire | contenu | carte vert pâle (comme les articles)
   ========================================================================== */

.pf .pf-art {
	display: grid;
	grid-template-columns: 220px minmax(0, 1fr) 300px;
	gap: 0 56px;
	max-width: 1520px;
	margin: 0 auto;
	padding: 44px var(--pf-gutter) 72px;
	align-items: start;
}

/* Sommaire (comme .pt-aide-toc) */

.pf .pf-toc {
	position: sticky;
	top: var(--pf-top);
	font-size: 15px;
}

.pf .pf-toc__title {
	display: block;
	margin-bottom: 10px;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--pf-soft);
}

.pf .pf-toc ol,
.pf .pf-toc-mobile ol {
	display: flex;
	flex-direction: column;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.pf .pf-toc a {
	display: block;
	padding-left: 12px;
	border-left: 2px solid var(--pf-line);
	color: #3e4848;
	line-height: 1.4;
	text-decoration: none;
	transition: border-color 0.15s, color 0.15s;
}

.pf .pf-toc a:hover,
.pf .pf-toc a.is-active {
	color: var(--pf-ink);
	border-left-color: var(--pf-accent);
}

.pf .pf-toc-mobile {
	display: none;
	margin: 0 0 28px;
	padding: 4px 18px;
	border: 1.5px solid var(--pf-line);
	border-radius: 16px;
}

.pf .pf-toc-mobile summary {
	padding: 12px 0;
	font-weight: 700;
	cursor: pointer;
}

.pf .pf-toc-mobile ol {
	padding-bottom: 14px;
}

.pf .pf-toc-mobile a {
	text-decoration: underline;
	text-decoration-color: var(--pf-accent);
	text-underline-offset: 3px;
}

/* En-tête de la fiche */

.pf .pf-main {
	min-width: 0;
}

.pf .pf-head__title {
	display: flex;
	align-items: center;
	gap: 18px;
}

.pf .pf-head__logo {
	flex: 0 0 auto;
	width: 64px;
	height: 64px;
	border-radius: 50%;
	border: 1px solid var(--pf-line);
	background: #fff;
	overflow: hidden;
	display: flex;
	align-items: center;
	justify-content: center;
}

.pf .pf-head__logo img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	padding: 9px;
}

.pf .pf-head__name {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	margin: 0;
	font-size: clamp(34px, 3.6vw, 52px);
	font-weight: 800;
	line-height: 1.05;
	letter-spacing: -0.035em;
}

.pf .pf-head__name .pf-badge svg {
	width: 26px;
	height: 26px;
}

.pf .pf-head__tagline {
	max-width: 52ch;
	margin: 12px 0 0;
	font-family: Georgia, "Times New Roman", serif;
	font-size: 20px;
	line-height: 1.35;
}

.pf .pf-meta {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 18px 0 28px;
	padding: 0;
	list-style: none;
}

.pf .pf-meta li {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	padding: 6px 12px;
	border-radius: 999px;
	background: var(--pf-sand);
	color: var(--pf-ink);
	font-size: 14px;
	font-weight: 700;
}

.pf .pf-meta a {
	color: inherit;
	text-decoration: none;
}

/* Disponibilité : texte et point dans la couleur de l'état. */
.pf .pf-meta li.pf-dispo--disponible {
	color: var(--pf-green);
}

.pf .pf-meta li.pf-dispo--places_limitees {
	color: var(--pf-amber);
}

.pf .pf-meta li.pf-dispo--complet {
	color: var(--pf-red);
}

.pf .pf-meta .pf-meta--tint {
	background: var(--pf-tint);
}

.pf .pf-meta .pf-meta--tint a {
	text-decoration: underline;
	text-decoration-color: var(--pf-accent);
	text-underline-offset: 3px;
}

/* Mosaïque */

.pf .pf-mosaic {
	position: relative;
	display: grid;
	grid-template-columns: 2fr 1fr 1fr;
	grid-template-rows: 1fr 1fr;
	gap: 6px;
	height: clamp(280px, 30vw, 460px);
	border-radius: 22px;
	overflow: hidden;
}

.pf .pf-mosaic__item {
	display: block;
	overflow: hidden;
	background: var(--pf-sand);
}

.pf .pf-mosaic__item img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: filter 0.15s;
}

.pf .pf-mosaic__item:hover img {
	filter: brightness(0.88);
}

.pf .pf-mosaic__item:first-child {
	grid-row: 1 / 3;
}

.pf .pf-mosaic--1 {
	grid-template-columns: 1fr;
}

.pf .pf-mosaic--2,
.pf .pf-mosaic--3 {
	grid-template-columns: 2fr 1fr;
}

.pf .pf-mosaic--2 .pf-mosaic__item:nth-child(2) {
	grid-row: 1 / 3;
}

.pf .pf-mosaic--4 .pf-mosaic__item:nth-child(4) {
	grid-column: 2 / 4;
}

.pf .pf-mosaic__all {
	position: absolute;
	right: 14px;
	bottom: 14px;
	padding: 8px 14px;
	border-radius: 999px;
	background: #fff;
	color: var(--pf-ink);
	font-size: 14px;
	font-weight: 700;
	text-decoration: none;
	transition: background-color 0.15s;
}

.pf .pf-mosaic__all:hover {
	background: var(--pf-tint);
}

/* L'essentiel (vert pâle, comme dans les articles) */

.pf .pf-essentiel {
	margin: 32px 0 8px;
	padding: 24px 28px;
	border-radius: 18px;
	background: var(--pf-mint);
	scroll-margin-top: var(--pf-top);
}

.pf .pf-essentiel li {
	font-size: 16px;
}

/* Sections */

.pf .pf-section {
	padding: 36px 0 0;
	scroll-margin-top: var(--pf-top);
}

.pf .pf-prose {
	max-width: 72ch;
	font-size: 17px;
	line-height: 1.75;
	color: var(--pf-ink-2);
}

.pf .pf-prose p {
	margin: 0;
}

.pf .pf-prose p + p {
	margin-top: 1em;
}

.pf .pf-prose[data-pf-more].is-clamped {
	max-height: 14em;
	overflow: hidden;
	-webkit-mask-image: linear-gradient(#000 55%, transparent);
	mask-image: linear-gradient(#000 55%, transparent);
}

.pf .pf-more-btn {
	margin-top: 10px;
	padding: 0;
	border: 0;
	background: none;
	color: var(--pf-ink);
	font: inherit;
	font-weight: 700;
	text-decoration: underline;
	text-decoration-color: var(--pf-accent);
	text-decoration-thickness: 2px;
	text-underline-offset: 4px;
	cursor: pointer;
}

/* Lignes libellé / valeur */

.pf .pf-rows {
	margin: 0;
	border-top: 1px solid var(--pf-line);
}

.pf .pf-rows > div {
	display: grid;
	grid-template-columns: 220px minmax(0, 1fr);
	gap: 16px;
	padding: 13px 0;
	border-bottom: 1px solid var(--pf-line);
	font-size: 15px;
}

.pf .pf-rows dt {
	font-weight: 700;
}

.pf .pf-rows dd {
	margin: 0;
	color: var(--pf-ink-2);
}

.pf .pf-checks {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.pf .pf-checks li {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	padding: 6px 12px;
	border-radius: 999px;
	background: var(--pf-mint);
	font-size: 14px;
	font-weight: 600;
}

.pf .pf-checks li::before {
	content: "";
	width: 12px;
	height: 12px;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath fill='none' stroke='%232f6b55' stroke-width='3' d='M4 10.5l4 4 8-9'/%3E%3C/svg%3E") center / contain no-repeat;
}

.pf .pf-links {
	display: flex;
	flex-wrap: wrap;
	gap: 6px 18px;
}

.pf .pf-links a {
	font-weight: 700;
	color: var(--pf-ink);
	text-decoration: underline;
	text-decoration-color: var(--pf-accent);
	text-decoration-thickness: 2px;
	text-underline-offset: 4px;
}

.pf .pf-updated {
	margin-top: 16px;
}

/* Forfaits */

.pf .pf-packages {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 14px;
	margin-top: 18px;
}

.pf .pf-package {
	padding: 22px;
	border-radius: 18px;
	background: var(--pf-sand);
}

.pf .pf-package h3 {
	margin: 0;
	font-size: 17px;
	font-weight: 800;
}

.pf .pf-package__price {
	margin: 4px 0 10px;
	font-size: 22px;
	font-weight: 800;
	letter-spacing: -0.02em;
}

.pf .pf-package .pf-bullets {
	margin-top: 0;
	font-size: 15px;
}

/* Photos */

.pf .pf-gallery {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 6px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.pf .pf-gallery a {
	display: block;
	aspect-ratio: 1;
	border-radius: 12px;
	overflow: hidden;
	background: var(--pf-sand);
}

.pf .pf-gallery img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: filter 0.15s;
}

.pf .pf-gallery a:hover img {
	filter: brightness(0.88);
}

.pf .pf-video {
	position: relative;
	aspect-ratio: 16 / 9;
	margin-bottom: 12px;
	border-radius: 18px;
	overflow: hidden;
	background: var(--pf-sand);
}

.pf .pf-video iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
}

/* Questions à poser (encadré rose) */

.pf #questions {
	margin-top: 40px;
	scroll-margin-top: var(--pf-top);
}

.pf #questions .pf-numbered {
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px 28px;
	font-size: 15px;
}

/* FAQ */

.pf .pf-catfaq {
	padding-top: 8px;
	padding-bottom: 56px;
}

.pf .pf-catfaq .pf-faq {
	max-width: 860px;
}

.pf .pf-faq details {
	border-bottom: 1px solid var(--pf-line);
}

.pf .pf-faq details:first-child {
	border-top: 1px solid var(--pf-line);
}

.pf .pf-faq summary {
	position: relative;
	padding: 15px 36px 15px 0;
	font-weight: 700;
	cursor: pointer;
	list-style: none;
}

.pf .pf-faq summary::-webkit-details-marker {
	display: none;
}

.pf .pf-faq summary::after {
	content: "+";
	position: absolute;
	right: 4px;
	top: 50%;
	transform: translateY(-50%);
	font-size: 22px;
	font-weight: 400;
	color: var(--pf-rust);
}

.pf .pf-faq details[open] summary::after {
	content: "–";
}

.pf .pf-faq .pf-prose {
	padding-bottom: 16px;
	font-size: 16px;
}

.pf .pf-ask {
	margin: 18px 0 0;
}

/* Témoignages */

.pf .pf-quotes {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	gap: 14px;
}

.pf .pf-quote {
	margin: 0;
	padding: 22px 24px;
	border-radius: 18px;
	background: var(--pf-sand);
}

.pf .pf-quote blockquote {
	margin: 0;
	padding: 0 0 0 14px;
	border-left: 2px solid var(--pf-accent);
}

.pf .pf-quote blockquote p {
	margin: 0;
	font-family: Georgia, "Times New Roman", serif;
	font-size: 16px;
	line-height: 1.5;
}

.pf .pf-quote figcaption {
	margin-top: 12px;
	font-size: 13px;
	font-weight: 700;
	color: var(--pf-rust);
}

/* Équipe */

.pf .pf-team {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
	gap: 14px;
}

.pf .pf-member {
	display: flex;
	gap: 16px;
	align-items: flex-start;
	padding: 20px;
	border-radius: 18px;
	background: var(--pf-sand);
}

.pf .pf-member__photo {
	flex: 0 0 auto;
	width: 64px;
	height: 64px;
	border-radius: 50%;
	object-fit: cover;
}

.pf .pf-member h3 {
	margin: 0;
	font-size: 17px;
	font-weight: 800;
}

.pf .pf-member__role {
	margin: 2px 0 6px;
	font-size: 13px;
	font-weight: 700;
	color: var(--pf-rust);
}

.pf .pf-member p:not(.pf-member__role) {
	margin: 0;
	font-size: 15px;
	color: var(--pf-ink-2);
}

/* Demande (encadré sable, comme « Tu n'as pas encore le Planificateur? ») */

.pf .pf-contact {
	display: grid;
	grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr);
	gap: 32px;
	margin-top: 48px;
	scroll-margin-top: var(--pf-top);
}

.pf .pf-contact__intro p:not(.pf-eyebrow) {
	margin: 0 0 10px;
	font-size: 15px;
	color: var(--pf-muted);
}

.pf .pf-contact__intro .pf-contact__rep {
	font-weight: 700;
	color: var(--pf-green);
}

.pf .pf-form {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px;
}

.pf .pf-field {
	display: grid;
	gap: 5px;
	margin: 0;
	font-size: 13px;
	font-weight: 700;
}

.pf .pf-field--full,
.pf .pf-form__error,
.pf .pf-form__foot {
	grid-column: 1 / -1;
}

.pf .pf-field abbr {
	color: var(--pf-rust);
	text-decoration: none;
}

.pf .pf-field input,
.pf .pf-field textarea {
	width: 100%;
	min-height: 44px;
	padding: 9px 12px;
	border: 1px solid var(--pf-line-2);
	border-radius: 12px;
	background: #fff;
	color: var(--pf-ink);
	font-family: inherit;
	font-size: 15px;
	font-weight: 400;
	transition: border-color 0.15s;
}

.pf .pf-field textarea {
	resize: vertical;
	line-height: 1.45;
}

.pf .pf-field input:hover,
.pf .pf-field textarea:hover {
	border-color: var(--pf-muted);
}

.pf .pf-field input:focus,
.pf .pf-field textarea:focus {
	outline: 2px solid var(--pf-accent);
	outline-offset: 1px;
	border-color: var(--pf-ink);
}

.pf .pf-form__foot {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
}

.pf .pf-check-input {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 14px;
}

.pf .pf-check-input input {
	width: 18px;
	height: 18px;
	accent-color: var(--pf-ink);
}

.pf .pf-hp {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.pf .pf-form__error {
	margin: 0;
	padding: 10px 12px;
	border-radius: 12px;
	background: #fff;
	color: var(--pf-red);
	font-size: 14px;
}

.pf .pf-done {
	align-self: center;
	padding: 22px 24px;
	border-radius: 18px;
	background: #fff;
}

.pf .pf-done__title {
	margin: 0 0 6px;
	font-size: 20px;
	font-weight: 800;
	color: var(--pf-green);
}

.pf .pf-done p {
	margin: 0 0 10px;
}

/* Fournisseurs similaires : rangées (comme les articles liés) */

.pf .pf-similar {
	padding-top: 48px;
}

.pf .pf-list {
	margin: 0;
	padding: 0;
	list-style: none;
	border-top: 1px solid var(--pf-line);
}

.pf .pf-list li {
	border-bottom: 1px solid var(--pf-line);
}

.pf .pf-row {
	display: grid;
	grid-template-columns: 200px minmax(0, 1fr);
	gap: 24px;
	align-items: center;
	padding: 18px 0;
	color: var(--pf-ink);
	text-decoration: none;
}

.pf .pf-row__media {
	display: block;
	aspect-ratio: 16 / 10;
	border-radius: 14px;
	overflow: hidden;
	background: var(--pf-sand);
}

.pf .pf-row__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: filter 0.15s;
}

.pf .pf-row:hover .pf-row__media img {
	filter: brightness(0.9);
}

.pf .pf-row__text {
	display: grid;
	gap: 4px;
}

.pf .pf-row strong {
	font-size: 19px;
	font-weight: 800;
	line-height: 1.25;
	letter-spacing: -0.01em;
}

.pf .pf-row:hover strong {
	text-decoration: underline;
	text-decoration-color: var(--pf-accent);
	text-decoration-thickness: 2px;
	text-underline-offset: 3px;
}

.pf .pf-row small {
	font-size: 15px;
	line-height: 1.5;
	color: var(--pf-muted);
}

.pf .pf-row__meta {
	font-size: 13px;
	font-weight: 700;
	color: var(--pf-rust);
}

.pf .pf-topics {
	padding-top: 48px;
}

.pf .pf-topics .pf-h2 {
	font-size: 22px;
}

/* Carte vert pâle à droite (comme .pt-blog-card) */

.pf .pf-side {
	position: sticky;
	top: var(--pf-top);
}

.pf .pf-side__card {
	padding: 24px;
	border-radius: 20px;
	background: var(--pf-mint);
}

.pf .pf-side__title {
	margin: 4px 0 8px;
	font-size: 19px;
	font-weight: 800;
	line-height: 1.25;
	letter-spacing: -0.015em;
}

.pf .pf-side__title span {
	display: block;
	font-family: Georgia, "Times New Roman", serif;
	font-weight: 400;
	letter-spacing: -0.01em;
}

.pf .pf-side__title .pf-dots {
	display: inline-flex;
	font-family: Helvetica, Arial, sans-serif;
	font-weight: 700;
}

.pf .pf-side__card > p:not(.pf-side__title) {
	margin: 0 0 18px;
	font-size: 15px;
	line-height: 1.5;
	color: var(--pf-ink-2);
}

.pf .pf-side__card .pf-btn {
	width: 100%;
}

.pf .pf-side__link {
	display: block;
	margin-top: 12px;
	font-size: 14px;
	font-weight: 700;
	text-align: center;
	color: var(--pf-ink);
	text-decoration: underline;
	text-decoration-color: var(--pf-accent);
	text-underline-offset: 3px;
}

/* Barre mobile */

.pf .pf-bar {
	display: none;
}

/* ---------- Visionneuse ---------- */

.pf-lb {
	width: 100vw;
	max-width: 100vw;
	height: 100vh;
	max-height: 100vh;
	margin: 0;
	padding: 0;
	border: 0;
	background: rgba(11, 22, 22, 0.94);
	color: #fff;
}

.pf-lb[open] {
	display: flex;
	align-items: center;
	justify-content: center;
}

.pf-lb::backdrop {
	background: rgba(11, 22, 22, 0.94);
}

.pf-lb img {
	max-width: calc(100vw - 160px);
	max-height: calc(100vh - 130px);
	object-fit: contain;
	border-radius: 8px;
}

.pf-lb button {
	position: absolute;
	width: 48px;
	height: 48px;
	border: 0;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.14);
	color: #fff;
	font-size: 28px;
	line-height: 1;
	cursor: pointer;
	transition: background-color 0.15s;
}

.pf-lb button:hover {
	background: rgba(255, 255, 255, 0.26);
}

.pf-lb__close {
	top: 18px;
	right: 18px;
}

.pf-lb__nav--prev {
	left: 18px;
}

.pf-lb__nav--next {
	right: 18px;
}

.pf-lb__count {
	position: absolute;
	bottom: 20px;
	left: 0;
	right: 0;
	margin: 0;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 14px;
	text-align: center;
}

/* ==========================================================================
   Écrans
   ========================================================================== */

@media (min-width: 1500px) {
	.pf .pf-grid {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}
}

@media (max-width: 1280px) {
	.pf .pf-art {
		grid-template-columns: minmax(0, 1fr) 280px;
		gap: 0 40px;
	}

	.pf .pf-toc {
		display: none;
	}

	.pf .pf-toc-mobile {
		display: block;
		margin-top: 24px;
	}
}

@media (max-width: 1100px) {
	.pf .pf-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.pf .pf-contact,
	.pf .pf-callout--split {
		grid-template-columns: 1fr;
		gap: 22px;
	}

	.pf #questions .pf-numbered {
		grid-template-columns: 1fr;
	}

	.pf .pf-choose {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 900px) {
	.pf .pf-art {
		display: block;
		padding-top: 28px;
	}

	.pf .pf-side {
		display: none;
	}

	.pf .pf-mosaic {
		height: 280px;
		margin: 0 calc(-1 * var(--pf-gutter));
		border-radius: 0;
		grid-template-columns: 1fr;
		grid-template-rows: 1fr;
	}

	.pf .pf-mosaic__item:not(:first-child) {
		display: none;
	}

	.pf .pf-mosaic__item:first-child {
		grid-row: auto;
	}

	.pf .pf-rows > div {
		grid-template-columns: 1fr;
		gap: 4px;
	}

	.pf .pf-gallery {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.pf .pf-row {
		grid-template-columns: 120px minmax(0, 1fr);
		gap: 16px;
	}

	.pf .pf-row small {
		display: none;
	}

	.pf .pf-bar {
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: 50;
		display: flex;
		align-items: center;
		gap: 10px;
		padding: 12px 20px calc(12px + env(safe-area-inset-bottom));
		background: var(--pf-mint);
		border-top: 1px solid var(--pf-mint-2);
		transition: transform 0.2s;
	}

	.pf .pf-bar.is-hidden {
		transform: translateY(110%);
	}

	.pf .pf-bar__price {
		margin-right: auto;
		font-size: 13px;
		line-height: 1.2;
		color: var(--pf-muted);
	}

	.pf .pf-bar__price strong {
		display: block;
		font-size: 17px;
		color: var(--pf-ink);
	}

	.pf .pf-bar__tel {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 44px;
		height: 44px;
		border-radius: 50%;
		background: #fff;
		color: var(--pf-ink);
	}

	.pf .pf-bar__btn {
		min-height: 44px;
		padding: 0 18px;
		font-size: 15px;
	}

	.pf-single {
		padding-bottom: 72px;
	}

	.pf-lb img {
		max-width: 100vw;
		max-height: calc(100vh - 150px);
		border-radius: 0;
	}

	.pf-lb__nav {
		top: auto;
		bottom: 14px;
	}
}

@media (max-width: 640px) {
	.pf .pf-grid {
		grid-template-columns: 1fr;
		gap: 32px;
	}

	.pf .pf-listing {
		padding-top: 22px;
	}

	.pf .pf-hero__trust {
		display: none;
	}

	/* Téléphone : région et style côte à côte, budget sur une ligne. */
	.pf .pf-filters {
		display: grid;
		grid-template-columns: 1fr 1fr;
		width: 100%;
		gap: 8px;
	}

	.pf .pf-filter select,
	.pf .pf-filter input {
		width: 100%;
		min-height: 42px;
		padding: 8px 32px 8px 12px;
		font-size: 14px;
		background-position: right 10px center;
	}

	.pf .pf-filter--short input {
		padding-right: 12px;
	}

	.pf .pf-budget {
		grid-column: 1 / -1;
	}

	.pf .pf-listing__head {
		margin-bottom: 14px;
	}

	.pf .pf-listing__head .pf-h2 {
		font-size: 22px;
	}

	.pf .pf-budget {
		width: 100%;
	}

	.pf .pf-budget label {
		flex: 1;
	}

	.pf .pf-budget label > span {
		width: 100%;
		justify-content: center;
		padding: 0 4px;
	}

	.pf .pf-catnav {
		flex-wrap: nowrap;
		overflow-x: auto;
		scrollbar-width: none;
	}

	.pf .pf-catnav a {
		flex: 0 0 auto;
	}

	.pf .pf-callout {
		padding: 24px 22px;
	}

	.pf .pf-form {
		grid-template-columns: 1fr;
	}

	.pf .pf-form__foot .pf-btn {
		width: 100%;
	}
}

/* Mobile : 16px minimum dans les champs, sinon l'iPhone zoome dès qu'on touche un champ. */
@media (max-width: 900px) {
	.pf .pf-field input,
	.pf .pf-field textarea,
	.pf .pf-filter select,
	.pf .pf-filter input {
		font-size: 16px;
	}
}

/* Mobile : la rangée de catégories défile de côté; un fondu à droite l'indique. */
@media (max-width: 640px) {
	.pf .pf-catnav {
		margin-right: calc(-1 * var(--pf-gutter));
		padding-right: var(--pf-gutter);
		-webkit-mask-image: linear-gradient(90deg, #000 85%, transparent);
		mask-image: linear-gradient(90deg, #000 85%, transparent);
	}
}

/* Clavier : contour visible sur tous les éléments interactifs du répertoire. */
.pf a:focus-visible,
.pf button:focus-visible,
.pf summary:focus-visible,
.pf select:focus-visible,
.pf input:focus-visible,
.pf textarea:focus-visible {
	outline: 2px solid var(--pf-accent-strong);
	outline-offset: 2px;
}

.pf .pf-card__name a:focus-visible {
	outline: none;
}

.pf .pf-card:has(.pf-card__name a:focus-visible) .pf-card__media {
	outline: 2px solid var(--pf-accent-strong);
	outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
	.pf *,
	.pf *::before,
	.pf *::after {
		transition: none !important;
	}
}

.pf .pf-hero__trust a {
	color: inherit;
	text-decoration: underline;
	text-decoration-color: var(--pf-accent);
	text-decoration-thickness: 2px;
	text-underline-offset: 3px;
}

.pf .pf-hero__trust a:hover {
	text-decoration-color: currentColor;
}

/* Date d'abord : carte « Vérifier la disponibilité » et premier champ du formulaire */

.pf .pf-form__date {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	gap: 10px 20px;
}

.pf .pf-form__date .pf-field {
	flex: 1 1 220px;
	max-width: 320px;
}

.pf .pf-form__date .pf-check-input {
	min-height: 44px;
}

.pf .pf-avail {
	display: grid;
	gap: 12px;
	margin: 0 0 4px;
}

.pf .pf-avail .pf-field input {
	border-color: var(--pf-mint-2);
}

.pf .pf-avail .pf-field input:hover {
	border-color: var(--pf-muted);
}

.pf .pf-field input[type="date"] {
	appearance: none;
	-webkit-appearance: none;
	min-width: 0;
}

/* Recommandé par Pour Toujours */

.pf .pf-reco {
	margin: 32px 0 0;
	padding: 24px 28px;
	border: 1px solid var(--pf-accent);
	border-radius: 18px;
	background: var(--pf-tint);
	scroll-margin-top: var(--pf-top);
}

.pf .pf-reco + .pf-essentiel {
	margin-top: 16px;
}

.pf .pf-reco .pf-eyebrow,
.pf .pf-meta .pf-meta--reco a {
	display: inline-flex;
	align-items: center;
	gap: 6px;
}

.pf .pf-reco .pf-eyebrow svg,
.pf .pf-meta .pf-meta--reco svg {
	width: 16px;
	height: 16px;
	flex: none;
}

.pf .pf-reco__quote {
	margin: 10px 0 12px;
	padding: 0;
	border: 0;
}

.pf .pf-reco__quote p {
	margin: 0;
	max-width: 68ch;
	font-family: Georgia, "Times New Roman", serif;
	font-size: 19px;
	line-height: 1.5;
	color: var(--pf-ink);
}

.pf .pf-reco__sign {
	margin: 0;
	font-size: 14px;
	font-weight: 700;
}

.pf .pf-reco__lien {
	margin: 10px 0 0;
	font-size: 13px;
	line-height: 1.45;
	color: var(--pf-muted);
}

.pf .pf-meta .pf-meta--reco {
	background: var(--pf-tint);
	box-shadow: inset 0 0 0 1px var(--pf-accent);
}

.pf .pf-meta .pf-meta--reco a {
	color: inherit;
	text-decoration: none;
}

@media (max-width: 640px) {
	.pf .pf-reco {
		padding: 20px;
	}

	.pf .pf-reco__quote p {
		font-size: 17px;
	}
}