/* ============================================================
 * AS Page — Socle éditorial (contenus PAGE et ARTICLE)
 * Thème SOMBRE. DÉPEND DU SOCLE AS Core : les tokens --as-*
 * (couleurs, rayons, polices) et les composants mutualisés
 * (.as-breadcrumb, .as-chapter/.as-chapter-num, .as-btn-premium,
 * .as-sticky-tabs, .as-compare-deeper, .as-faq-*, .as-disclosure-*)
 * proviennent de as-core.css, chargé en dépendance.
 * Ce fichier ne contient que le SPÉCIFIQUE du plugin (préfixe as-pg-).
 * ============================================================ */

/* ---------- Cadre global sombre (OBLIGATOIRE, cf. as-core/AGENTS.md §13) ---------- */
.as-pg-wrap {
	font-family: var(--as-font-body, 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif);
	color: var(--as-ink-2);
	background: var(--as-bg);
	line-height: 1.6;
	max-width: 1180px;
	margin: 0 auto;
	padding: 14px 16px 30px;
	border-radius: 18px;
	--as-sticky-bg: rgba(14, 21, 37, 0.94);
}
.as-pg-wrap * { box-sizing: border-box; }
.as-pg-wrap a { color: var(--as-accent); text-decoration: none; }
.as-pg-wrap a:hover { color: var(--as-accent-2); text-decoration: underline; }
.as-pg-wrap code {
	font-size: 0.92em;
	padding: 1px 6px;
	border-radius: 6px;
	background: var(--as-bg-2);
	border: 1px solid var(--as-line);
	color: var(--as-ink);
}

/* En layout `article`, la colonne principale est plus étroite : on resserre
   les paddings pour ne pas perdre de largeur utile. */
.as-pg-wrap--article { padding: 12px 14px 26px; }

/* ---------- Hero ---------- */
.as-pg-hero { margin: 6px 0 22px; }
.as-pg-kicker {
	font-size: 11.5px;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--as-accent);
	font-weight: 600;
	margin: 0 0 8px;
}
.as-pg-h1 {
	font-family: var(--as-font-head);
	font-weight: 700;
	font-size: clamp(24px, 3.8vw, 36px);
	line-height: 1.14;
	margin: 0 0 14px;
	background: linear-gradient(100deg, #ffffff, #b9c6f5 70%);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
}
.as-pg-chapo {
	font-size: clamp(15px, 1.6vw, 17px);
	color: var(--as-ink-2);
	max-width: 82ch;
	margin: 0 0 4px;
}
.as-pg-chapo p { margin: 0 0 10px; }
.as-pg-chapo strong { color: var(--as-ink); }

/* ---------- Signature d'article ---------- */
.as-pg-byline {
	display: flex;
	align-items: center;
	gap: 12px;
	flex-wrap: wrap;
	margin: 18px 0 0;
	padding: 12px 14px;
	background: var(--as-card);
	border: 1px solid var(--as-line);
	border-radius: var(--as-radius-sm);
}
.as-pg-byline-photo {
	width: 56px;
	height: 56px;
	border-radius: 50%;
	object-fit: cover;
	border: 2px solid var(--as-line-2);
	flex-shrink: 0;
}
.as-pg-byline-body { flex: 1 1 200px; min-width: 0; }
.as-pg-byline-id { margin: 0; display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.as-pg-byline-nom { font-family: var(--as-font-head); font-weight: 600; font-size: 14.5px; color: var(--as-ink); }
/* Signature cliquable (archive d'auteur) : encre de la ligne, accent au survol
   seulement — même traitement que le nom de plateforme des tableaux, pour ne
   pas transformer le chapô en zone de liens colorés. */
a.as-pg-byline-nom { text-decoration: underline; text-decoration-style: dotted; text-underline-offset: 3px; }
a.as-pg-byline-nom:hover,
a.as-pg-byline-nom:focus-visible { color: var(--as-accent); text-decoration-style: solid; }
.as-pg-byline-linkedin { font-size: 12px; font-weight: 600; }
.as-pg-byline-role { margin: 2px 0 0; font-size: 12.5px; color: var(--as-muted); }
.as-pg-dates {
	margin: 0;
	display: flex;
	gap: 14px;
	flex-wrap: wrap;
	font-size: 12px;
	color: var(--as-muted);
}
.as-pg-dates--page { margin: 14px 0 0; }

/* ---------- Sommaire ancré (sticky mutualisé) ---------- */
.as-pg-toc {
	display: flex;
	gap: 7px;
	flex-wrap: wrap;
	padding: 9px 10px;
	margin: 0 0 22px;
	border: 1px solid var(--as-line);
	border-radius: var(--as-radius-pill);
}
.as-pg-toc-chip {
	display: inline-block;
	font-size: 12px;
	font-weight: 600;
	padding: 5px 12px;
	border-radius: var(--as-radius-pill);
	background: var(--as-bg-2);
	border: 1px solid var(--as-line);
	color: var(--as-ink-2) !important;
	white-space: nowrap;
	text-decoration: none !important;
}
.as-pg-toc-chip:hover,
.as-pg-toc-chip.is-current {
	background: var(--as-accent-bg);
	border-color: var(--as-accent);
	color: var(--as-ink) !important;
}

/* ---------- Sections ---------- */
.as-pg-section {
	background: var(--as-card);
	border: 1px solid var(--as-line);
	border-radius: var(--as-radius);
	padding: 22px;
	margin: 0 0 18px;
	scroll-margin-top: 110px;
}
.as-pg-h2 {
	font-family: var(--as-font-head);
	font-size: clamp(18px, 2.4vw, 23px);
	font-weight: 600;
	color: var(--as-ink);
	margin: 0 0 14px;
	line-height: 1.25;
}
.as-pg-h3 {
	font-family: var(--as-font-head);
	font-size: 15.5px;
	font-weight: 600;
	color: var(--as-ink);
	margin: 22px 0 10px;
}
.as-pg-section-intro {
	color: var(--as-ink-2);
	font-size: 14.5px;
	max-width: 84ch;
	margin: 0 0 16px;
}
.as-pg-section-intro p { margin: 0 0 8px; }
.as-pg-sub { margin: 0 0 6px; }

.as-pg-p {
	margin: 0 0 12px;
	font-size: 14.5px;
	max-width: 80ch;
}
.as-pg-p strong,
.as-pg-list strong { color: var(--as-ink); }

.as-pg-list {
	margin: 0 0 14px;
	padding: 0 0 0 4px;
	list-style: none;
	max-width: 84ch;
}
.as-pg-list li {
	position: relative;
	padding: 0 0 0 20px;
	margin: 0 0 9px;
	font-size: 14.3px;
}
.as-pg-list li::before {
	content: "▸";
	position: absolute;
	left: 0;
	top: 0;
	color: var(--as-accent);
	font-weight: 700;
}
.as-pg-list--tight li { margin-bottom: 5px; font-size: 13.8px; }

/* ---------- Chiffres clés ---------- */
.as-pg-kpis {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(165px, 1fr));
	gap: 10px;
	margin: 0 0 18px;
}
.as-pg-kpis-lead { margin-bottom: 20px; }
.as-pg-kpi {
	background: var(--as-bg-2);
	border: 1px solid var(--as-line);
	border-radius: var(--as-radius-sm);
	padding: 14px 14px 12px;
	display: flex;
	flex-direction: column;
	gap: 3px;
}
.as-pg-kpi-val {
	font-family: var(--as-font-head);
	font-size: clamp(19px, 2.5vw, 24px);
	font-weight: 700;
	color: var(--as-ink);
	line-height: 1.1;
}
.as-pg-kpi-lbl { font-size: 12.3px; color: var(--as-ink-2); line-height: 1.35; }
.as-pg-kpi-note { font-size: 11px; color: var(--as-muted); }
.as-pg-kpis--compact .as-pg-kpi { padding: 12px; }
.as-pg-kpis--presse .as-pg-kpi { background: var(--as-card); }

/* ---------- Encarts ---------- */
.as-pg-callout {
	display: flex;
	gap: 12px;
	align-items: flex-start;
	background: var(--as-bg-2);
	border: 1px solid var(--as-line-2);
	border-left: 3px solid var(--as-accent);
	border-radius: var(--as-radius-sm);
	padding: 14px 16px;
	margin: 0 0 16px;
}
.as-pg-callout--warn  { border-left-color: var(--as-autre); }
.as-pg-callout--legal { border-left-color: var(--as-accent-2); }
.as-pg-callout--ok    { border-left-color: var(--as-pos); }
.as-pg-callout-icon { font-size: 17px; line-height: 1.3; flex-shrink: 0; }
.as-pg-callout-body { min-width: 0; flex: 1; }
.as-pg-callout-body > :last-child { margin-bottom: 0; }
.as-pg-callout-body p { margin: 0 0 9px; font-size: 14px; }
.as-pg-callout-body strong { color: var(--as-ink); }
.as-pg-callout-title {
	font-family: var(--as-font-head);
	font-size: 13.5px;
	font-weight: 600;
	color: var(--as-ink);
	margin: 0 0 7px !important;
}
.as-pg-callout--warn .as-pg-callout-title  { color: var(--as-autre); }
.as-pg-callout--legal .as-pg-callout-title { color: var(--as-accent-2); }
.as-pg-callout--ok .as-pg-callout-title    { color: var(--as-pos); }
.as-pg-callout .as-pg-list { margin-bottom: 0; }

/* ---------- Listes de définitions ---------- */
.as-pg-dl { margin: 0 0 16px; }
.as-pg-dl-row {
	display: grid;
	grid-template-columns: minmax(150px, 230px) 1fr;
	gap: 8px 18px;
	padding: 9px 0;
	border-bottom: 1px solid var(--as-line);
}
.as-pg-dl-row:last-child { border-bottom: 0; }
.as-pg-dl dt { font-size: 12.5px; font-weight: 600; color: var(--as-muted); }
.as-pg-dl dd { margin: 0; font-size: 14px; color: var(--as-ink-2); }
.as-pg-dl dd strong { color: var(--as-ink); }
.as-pg-dl--contact .as-pg-dl-row { border-bottom-style: dashed; }

/* ---------- Cartes éditoriales ---------- */
.as-pg-cards {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
	gap: 12px;
	margin: 0 0 16px;
}
.as-pg-card {
	background: var(--as-bg-2);
	border: 1px solid var(--as-line);
	border-radius: var(--as-radius-sm);
	padding: 16px;
	display: flex;
	flex-direction: column;
	gap: 7px;
}
.as-pg-card-icon { font-size: 20px; line-height: 1; }
.as-pg-card-title {
	font-family: var(--as-font-head);
	font-size: 14.5px;
	font-weight: 600;
	color: var(--as-ink);
	margin: 0;
}
.as-pg-card-text { margin: 0; font-size: 13.6px; color: var(--as-ink-2); }
.as-pg-card-text strong { color: var(--as-ink); }
.as-pg-card-link { margin-top: auto; font-size: 13px; font-weight: 600; }

/* ---------- Règles de la communauté (✅ / ⛔) ---------- */
.as-pg-rules {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(290px, 1fr));
	gap: 12px;
	margin: 0 0 16px;
}
.as-pg-rules-col {
	background: var(--as-bg-2);
	border: 1px solid var(--as-line);
	border-radius: var(--as-radius-sm);
	padding: 16px;
}
.as-pg-rules-col--ok { border-top: 3px solid var(--as-pos); }
.as-pg-rules-col--ko { border-top: 3px solid var(--as-neg); }

/* ⚠️ Variante COMPARAISON : deux colonnes qui opposent A et B, et non « ce qui
   est bien » à « ce qui est interdit ». Le vert et le rouge des filets
   par défaut porteraient alors un jugement de valeur faux — les avantages de
   la SCPI ne sont pas des fautes. La variante les remplace par les deux
   teintes de comparaison du site, qui identifient un univers sans le noter.
   À n'employer que quand les DEUX colonnes sont légitimes. */
.as-pg-rules--vs .as-pg-rules-col--ok { border-top-color: var(--as-accent); }
.as-pg-rules--vs .as-pg-rules-col--ko { border-top-color: var(--as-immo); }
.as-pg-rules-title {
	font-family: var(--as-font-head);
	font-size: 14px;
	font-weight: 600;
	color: var(--as-ink);
	margin: 0 0 12px;
}
.as-pg-rules-list { list-style: none; margin: 0; padding: 0; }
.as-pg-rules-list li {
	display: flex;
	gap: 9px;
	align-items: flex-start;
	margin: 0 0 9px;
	font-size: 13.6px;
}
.as-pg-rules-mark { flex-shrink: 0; font-size: 12px; line-height: 1.5; }
.as-pg-rules-list strong { color: var(--as-ink); }

/* ---------- Tableaux éditoriaux ----------
   Comparatifs, barèmes, simulateurs, tableaux de chiffres sourcés. Le repli
   mobile (cellules empilées sous leur en-tête via `data-th`) est en bas de
   fichier : ces tableaux sont majoritairement consultés au téléphone. */
.as-pg-tablewrap {
	overflow-x: auto;
	margin: 0 0 14px;
	background: var(--as-bg-2);
	border: 1px solid var(--as-line);
	border-radius: var(--as-radius-sm);
}
.as-pg-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 13.8px;
}
.as-pg-table-caption {
	caption-side: top;
	text-align: left;
	padding: 11px 14px 2px;
	font-family: var(--as-font-head);
	font-size: 13px;
	font-weight: 600;
	color: var(--as-ink);
}
.as-pg-table th,
.as-pg-table td {
	padding: 10px 14px;
	text-align: left;
	vertical-align: top;
	border-bottom: 1px solid var(--as-line);
}
.as-pg-table thead th {
	font-family: var(--as-font-head);
	font-size: 11.5px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .04em;
	color: var(--as-muted);
	background: var(--as-card);
	white-space: nowrap;
}
.as-pg-table tbody tr:last-child td { border-bottom: 0; }
.as-pg-table tbody td:first-child { color: var(--as-ink); font-weight: 600; }
.as-pg-table strong { color: var(--as-ink); }
.as-pg-table-note {
	margin: -6px 0 16px;
	font-size: 12.2px;
	line-height: 1.5;
	color: var(--as-muted);
	max-width: 88ch;
}

/* Face-à-face de plateformes : la colonne des critères sert de repère, on lui
   donne une largeur stable pour que les deux colonnes de droite s'alignent. */
.as-pg-tablewrap--compare .as-pg-table th:first-child,
.as-pg-tablewrap--compare .as-pg-table td:first-child { width: 26%; min-width: 150px; }
.as-pg-tablewrap--familles .as-pg-table th:first-child,
.as-pg-tablewrap--familles .as-pg-table td:first-child { width: 22%; min-width: 140px; }

/* Simulateur : colonnes chiffrées à droite, comparables d'un coup d'œil. */
.as-pg-tablewrap--simul .as-pg-table thead th + th,
.as-pg-tablewrap--simul .as-pg-table td + td { text-align: right; }

/* Chiffres sourcés : la valeur en tête de ligne porte l'information. */
.as-pg-tablewrap--chiffres .as-pg-table td:first-child {
	font-family: var(--as-font-head);
	font-size: 15px;
	color: var(--as-accent);
	white-space: nowrap;
}
.as-pg-tablewrap--chiffres .as-pg-table td:nth-child(3),
.as-pg-tablewrap--chiffres .as-pg-table td:nth-child(4),
.as-pg-tablewrap--sources .as-pg-table td:nth-child(2) { font-size: 12.8px; color: var(--as-muted); }
.as-pg-tablewrap--sources .as-pg-table td:first-child { white-space: nowrap; }

/* ---------- Marche à suivre numérotée ----------
   La numérotation reste celle de l'élément `<ol>` (marqueur natif stylé) :
   elle est annoncée par les lecteurs d'écran et reprise telle quelle par les
   moteurs qui extraient la procédure. */
.as-pg-steps {
	margin: 0 0 16px;
	padding: 0 0 0 34px;
	max-width: 88ch;
}
.as-pg-step {
	margin: 0 0 12px;
	padding: 2px 0 2px 14px;
	border-left: 2px solid var(--as-line);
}
.as-pg-step:last-child { margin-bottom: 0; }
.as-pg-step::marker {
	font-family: var(--as-font-head);
	font-size: 14px;
	font-weight: 700;
	color: var(--as-accent);
}
.as-pg-step-title {
	display: flex;
	align-items: baseline;
	gap: 9px;
	flex-wrap: wrap;
	font-family: var(--as-font-head);
	font-size: 14.5px;
	font-weight: 600;
	color: var(--as-ink);
	margin: 0 0 5px;
}
.as-pg-step-delai {
	font-family: var(--as-font-body);
	font-size: 10.5px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .04em;
	white-space: nowrap;
	padding: 2px 9px;
	border-radius: var(--as-radius-pill);
	background: var(--as-accent-bg);
	border: 1px solid var(--as-accent);
	color: var(--as-accent);
}
.as-pg-step-body { font-size: 13.9px; color: var(--as-ink-2); }
.as-pg-step-body p { margin: 0 0 8px; }
.as-pg-step-body strong { color: var(--as-ink); }
.as-pg-step-body > :last-child { margin-bottom: 0; }

/* ---------- Extrait de liste noire officielle ---------- */
.as-pg-blacklist {
	list-style: none;
	margin: 0 0 14px;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(235px, 1fr));
	gap: 8px;
}
.as-pg-blacklist-item {
	display: flex;
	flex-direction: column;
	gap: 3px;
	padding: 10px 12px;
	background: var(--as-bg-2);
	border: 1px solid var(--as-line);
	border-left: 3px solid var(--as-neg);
	border-radius: var(--as-radius-sm);
}
.as-pg-blacklist-site {
	font-family: var(--as-font-head);
	font-size: 13.3px;
	font-weight: 600;
	color: var(--as-ink);
	overflow-wrap: anywhere;
}
.as-pg-blacklist-cat { font-size: 11.5px; color: var(--as-accent); }
.as-pg-blacklist-date { font-size: 11px; color: var(--as-muted); }

/* ---------- Nuances typographiques ---------- */
.as-pg-muted { color: var(--as-muted); font-size: .92em; }
.as-pg-dl--bareme .as-pg-dl-row { border-bottom-style: dashed; }
.as-pg-dl--verdict dt { color: var(--as-accent); }

/* ---------- Actions / CTA ---------- */
.as-pg-actions {
	display: flex;
	gap: 10px;
	flex-wrap: wrap;
	margin: 16px 0 0;
}

/* ---------- Presse ---------- */
/* Mur de logos : plaques blanches uniformes, les logos des médias étant
   fournis sur fond clair et dans des formats très hétérogènes. */
.as-pg-presse-mur {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 10px;
	margin: 0 0 20px;
}
.as-pg-presse-mur-item {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 116px;
	height: 54px;
	padding: 8px 12px;
	background: #fff;
	border: 1px solid var(--as-line-2);
	border-radius: var(--as-radius-sm);
}
.as-pg-presse-mur-item img {
	max-width: 100%;
	max-height: 100%;
	width: auto;
	height: auto;
	object-fit: contain;
}

/* Barre de filtres : le mur de presse et la barre générique
   `.as-pg-filtres[data-cible]` partagent le même habillage. */
.as-pg-presse-filtres,
.as-pg-filtres {
	display: flex;
	gap: 7px;
	flex-wrap: wrap;
	margin: 0 0 16px;
}
.as-pg-filtre {
	font-family: var(--as-font-body);
	font-size: 12.3px;
	font-weight: 600;
	padding: 6px 13px;
	border-radius: var(--as-radius-pill);
	background: var(--as-bg-2);
	border: 1px solid var(--as-line);
	color: var(--as-ink-2);
	cursor: pointer;
	transition: background .15s ease, border-color .15s ease;
}
.as-pg-filtre:hover { border-color: var(--as-line-2); }
.as-pg-filtre.is-active {
	background: var(--as-accent-bg);
	border-color: var(--as-accent);
	color: var(--as-ink);
}
.as-pg-filtre-n { opacity: .65; font-weight: 500; }

.as-pg-presse-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
	gap: 12px;
}
.as-pg-presse-grid--une { grid-template-columns: repeat(auto-fit, minmax(330px, 1fr)); }

.as-pg-presse-item {
	background: var(--as-bg-2);
	border: 1px solid var(--as-line);
	border-radius: var(--as-radius-sm);
	padding: 16px;
	display: flex;
	flex-direction: column;
	gap: 9px;
}
.as-pg-presse-item--une {
	background: var(--as-card-2);
	border-color: var(--as-line-2);
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, .03);
}
.as-pg-presse-extrait {
	margin: -4px 0 4px;
	border-radius: var(--as-radius-sm);
	overflow: hidden;
	border: 1px solid var(--as-line);
	background: #fff;
}
.as-pg-presse-extrait img { display: block; width: 100%; height: auto; }

.as-pg-presse-head {
	display: flex;
	align-items: center;
	gap: 10px;
	flex-wrap: wrap;
}
.as-pg-presse-logo {
	width: 46px;
	height: 46px;
	border-radius: 10px;
	background: #fff;
	border: 1px solid var(--as-line-2);
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	flex-shrink: 0;
	padding: 4px;
}
.as-pg-presse-logo img { max-width: 100%; max-height: 100%; object-fit: contain; }
.as-pg-presse-logo--txt { background: var(--as-card); border-style: dashed; }
.as-pg-presse-logo-nom {
	font-family: var(--as-font-head);
	font-size: 14px;
	font-weight: 700;
	letter-spacing: .02em;
	color: var(--as-ink-2);
	text-align: center;
	line-height: 1.15;
}
.as-pg-presse-meta { min-width: 0; flex: 1 1 140px; display: flex; flex-direction: column; gap: 4px; }
.as-pg-presse-media {
	font-family: var(--as-font-head);
	font-size: 13.5px;
	font-weight: 600;
	color: var(--as-ink);
}
.as-pg-presse-tags { display: flex; gap: 5px; flex-wrap: wrap; }
.as-pg-presse-tag {
	font-size: 10.5px;
	font-weight: 600;
	padding: 2px 8px;
	border-radius: var(--as-radius-pill);
	background: var(--as-card);
	border: 1px solid var(--as-line);
	color: var(--as-muted);
	white-space: nowrap;
}
.as-pg-presse-tag--theme { color: var(--as-accent); border-color: var(--as-accent); background: var(--as-accent-bg); }
.as-pg-presse-tag--lang  { color: var(--as-enr); border-color: rgba(95, 217, 160, .45); }
.as-pg-presse-date { font-size: 11.5px; color: var(--as-muted); white-space: nowrap; }

.as-pg-presse-titre {
	font-family: var(--as-font-head);
	font-size: 15px;
	font-weight: 600;
	line-height: 1.32;
	color: var(--as-ink);
	margin: 0;
}
.as-pg-presse-titre a { color: var(--as-ink) !important; }
.as-pg-presse-titre a:hover { color: var(--as-accent) !important; }
.as-pg-presse-quote {
	margin: 0;
	padding: 0 0 0 13px;
	border-left: 3px solid var(--as-accent);
}
.as-pg-presse-quote p {
	margin: 0;
	font-size: 13.6px;
	font-style: italic;
	color: var(--as-ink);
}
.as-pg-presse-quote p::before { content: "« "; }
.as-pg-presse-quote p::after  { content: " »"; }
.as-pg-presse-quote p strong { font-style: normal; }
.as-pg-presse-quote cite {
	display: block;
	margin: 6px 0 0;
	font-size: 11.5px;
	font-style: normal;
	color: var(--as-muted);
	text-transform: uppercase;
	letter-spacing: .04em;
}
.as-pg-presse-cite { margin: 0; font-size: 13.4px; color: var(--as-ink-2); }
.as-pg-presse-cite strong { color: var(--as-ink); }
.as-pg-presse-lien { margin: auto 0 0; font-size: 12.8px; font-weight: 600; }

.as-pg-presse-archive { margin: 16px 0 0; }
.as-pg-presse-archive > summary {
	cursor: pointer;
	font-size: 13px;
	font-weight: 600;
	color: var(--as-ink-2);
	padding: 9px 0;
	list-style: none;
}
.as-pg-presse-archive > summary::before { content: "▸ "; color: var(--as-accent); }
.as-pg-presse-archive[open] > summary::before { content: "▾ "; }
.as-pg-presse-archive > summary::-webkit-details-marker { display: none; }
.as-pg-presse-archive .as-pg-presse-grid { margin-top: 10px; }

/* ---------- Newsletter (panneau d'inscription MailPoet) ----------
   Le formulaire est composé dans MailPoet, avec ses propres styles (souvent
   en ligne) pensés pour un fond clair. Plutôt que de les combattre à coups
   de !important — fragile à chaque modification du formulaire —, on lui
   donne le fond qu'il attend, à l'intérieur du cadre sombre de la page. */
.as-pg-section--nl { border-color: var(--as-line-2); }
.as-pg-nl {
	background: var(--as-bg-2);
	border: 1px solid var(--as-line-2);
	border-radius: var(--as-radius);
	padding: 18px;
	margin: 0 0 4px;
	scroll-margin-top: 110px;
}
.as-pg-nl-title {
	font-family: var(--as-font-head);
	font-size: 16px;
	font-weight: 600;
	color: var(--as-ink);
	margin: 0 0 6px;
}
.as-pg-nl-intro { color: var(--as-ink-2); font-size: 14px; }
.as-pg-nl-intro p { margin: 0 0 12px; }
.as-pg-nl-form {
	background: #fff;
	color: #0e1525;
	border-radius: var(--as-radius-sm);
	padding: 16px;
	max-width: 620px;
}
.as-pg-nl-form .mailpoet_form { max-width: 100%; }
.as-pg-nl-form input[type="text"],
.as-pg-nl-form input[type="email"] { max-width: 100%; }
.as-pg-nl-note {
	margin: 12px 0 0;
	font-size: 12.2px;
	color: var(--as-muted);
	line-height: 1.5;
	max-width: 78ch;
}
.as-pg-nl-note p { margin: 0; }

/* Modules mutualisés embarqués (offres du classement) : on borne leur
   respiration dans le flux éditorial, la mise en forme reste la leur. */
.as-pg-section .as-mp-embed { margin: 0 0 16px; }

/* ---------- Plans d'investissement & offres de bienvenue ----------
   Le tableau est le composant mutualisé .as-table du socle : on ne
   redéfinit ici que ce qui lui manque pour porter une offre (pastille
   plateforme, gain mis en avant, code, bouton d'inscription). */
.as-pg-inv-table-wrap { margin: 0 0 18px; }
.as-pg-inv-caption {
	caption-side: top;
	text-align: left;
	padding: 10px 14px 0;
	font-size: 12.2px;
	color: var(--as-muted);
}
.as-pg-inv-table { min-width: 760px; }
.as-pg-inv-table--mini { min-width: 560px; }
.as-pg-inv-table tfoot td,
.as-pg-inv-table tfoot th {
	border-top: 1px solid var(--as-line-2);
	background: var(--as-card-2);
	color: var(--as-ink);
	padding: 12px 14px;
	text-align: right;
}
.as-pg-inv-table tfoot th { text-align: left; font-size: 12.5px; letter-spacing: .04em; text-transform: uppercase; }

.as-pg-inv-plat { display: inline-flex; align-items: center; gap: 9px; min-width: 0; }
.as-pg-inv-logo {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 26px;
	flex-shrink: 0;
	padding: 2px 4px;
	border-radius: 5px;
	background: #ffffff; /* Îlot clair assumé : les logos sont pensés sur fond blanc. */
	border: 1px solid var(--as-line);
}
.as-pg-inv-logo img { max-width: 100%; max-height: 100%; object-fit: contain; display: block; }
.as-pg-inv-logo--txt {
	background: var(--as-bg-2);
	color: var(--as-muted);
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
}
.as-pg-inv-nom { font-weight: 600; color: var(--as-ink); font-size: 13.5px; }

.as-pg-inv-offre {
	font-size: 12.6px;
	color: var(--as-ink-2);
	max-width: 34ch;
	white-space: normal;
}
.as-pg-inv-cond {
	display: block;
	margin-top: 3px;
	font-size: 11.5px;
	color: var(--as-muted);
	line-height: 1.4;
}
.as-pg-inv-gain { color: var(--as-enr); font-weight: 600; white-space: nowrap; }
.as-pg-inv-taux { font-size: 12.2px; color: var(--as-muted); font-weight: 400; }

.as-pg-inv-code {
	display: inline-block;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .04em;
	padding: 3px 9px;
	border-radius: var(--as-radius-pill);
	background: rgba(240, 196, 106, 0.13);
	border: 1px dashed var(--as-autre);
	color: var(--as-autre);
	white-space: nowrap;
}
.as-pg-inv-nocode { font-size: 12px; color: var(--as-muted); font-style: italic; }

.as-pg-inv-cta {
	display: inline-block;
	font-size: 12.5px;
	font-weight: 600;
	padding: 6px 13px;
	border-radius: var(--as-radius-pill);
	background: var(--as-accent-bg);
	border: 1px solid var(--as-accent);
	color: var(--as-accent);
	white-space: nowrap;
}
.as-pg-inv-cta:hover { background: var(--as-accent); color: #0b1120; text-decoration: none; }

/* Répartition pédagogique par classe d'actifs : la valeur porte le texte,
   l'intitulé porte le montant — on lui laisse donc plus de place. */
.as-pg-dl--mix .as-pg-dl-row { grid-template-columns: minmax(180px, 260px) 1fr; }
.as-pg-dl--mix dt { color: var(--as-ink); font-size: 13px; }

/* ---------- Illustrations légendées ----------
   Les visuels d'un dossier (captures de nomenclature, exemples d'affichage)
   sont larges et détaillés : on les laisse respirer sur toute la colonne, et
   on les pose sur un fond CLAIR — ce sont des captures pensées sur blanc, les
   assombrir les rendrait illisibles. Îlot clair assumé, comme les logos de
   presse et le formulaire MailPoet. */
.as-pg-figure {
	margin: 0 0 16px;
	padding: 10px;
	background: #ffffff;
	border: 1px solid var(--as-line);
	border-radius: var(--as-radius-sm);
}
.as-pg-figure-img {
	display: block;
	width: 100%;
	height: auto;
	max-width: 100%;
	border-radius: 8px;
}
.as-pg-figure-caption {
	margin: 9px 2px 1px;
	font-size: 12.3px;
	line-height: 1.5;
	color: #4a5673;
	text-align: center;
}
.as-pg-figure-caption strong { color: #1e2740; }
/* Capture haute et étroite (nomenclature en colonne) : plafonner la hauteur
   évite qu'une seule image occupe deux écrans de défilement. */
.as-pg-figure--haute .as-pg-figure-img {
	max-height: 720px;
	width: auto;
	margin: 0 auto;
	object-fit: contain;
}

/* ---------- Grille de blocs titrés ----------
   Une nomenclature longue découpée en familles : le lecteur balaie les titres
   au lieu de subir un tableau de cinquante lignes. */
.as-pg-blocs {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(310px, 1fr));
	gap: 12px;
	margin: 0 0 16px;
}
.as-pg-bloc {
	padding: 13px 14px 4px;
	background: var(--as-card);
	border: 1px solid var(--as-line);
	border-radius: var(--as-radius-sm);
	min-width: 0;
}
.as-pg-bloc-title {
	display: flex;
	align-items: center;
	gap: 9px;
	flex-wrap: wrap;
	font-family: var(--as-font-head);
	font-size: 13px;
	font-weight: 600;
	letter-spacing: .03em;
	text-transform: uppercase;
	color: var(--as-ink);
	margin: 0 0 10px;
	padding: 0;
}
.as-pg-bloc-label { min-width: 0; }
.as-pg-bloc-badge {
	font-family: var(--as-font-body);
	font-size: 10.5px;
	font-weight: 700;
	letter-spacing: .05em;
	text-transform: uppercase;
	padding: 3px 8px;
	border-radius: var(--as-radius-pill);
	background: rgba(95, 217, 160, 0.14);
	border: 1px solid var(--as-enr);
	color: var(--as-enr);
	white-space: nowrap;
}
.as-pg-bloc-intro {
	margin: -4px 0 10px;
	font-size: 12.7px;
	line-height: 1.5;
	color: var(--as-muted);
}
.as-pg-bloc-intro p { margin: 0 0 6px; }
/* Le bloc EST déjà une carte : son tableau ne reprend ni fond ni bordure. */
.as-pg-bloc .as-pg-tablewrap {
	background: transparent;
	border: 0;
	border-radius: 0;
	margin-bottom: 10px;
}
.as-pg-bloc .as-pg-table { font-size: 13px; }
/* Gouttière à DROITE des cellules plutôt qu'un padding symétrique : le tableau
   reste aligné sur le bord gauche du bloc, et les en-têtes courts (« Code »,
   « Unité ») cessent de se coller à la colonne voisine. */
.as-pg-bloc .as-pg-table th,
.as-pg-bloc .as-pg-table td { padding: 7px 14px 7px 0; }
.as-pg-bloc .as-pg-table th:last-child,
.as-pg-bloc .as-pg-table td:last-child { padding-right: 0; text-align: right; }
.as-pg-bloc .as-pg-table thead th { background: transparent; }
/* Colonne de CODES (A1, C2 bis…) : repère de lecture, pas intitulé — on la
   distingue pour que l'œil retrouve une ligne citée dans le texte, et on la
   réduit à sa largeur utile. Réservée aux tableaux qui en portent une
   réellement : appliquée partout, elle écraserait la première colonne des
   tableaux dont l'intitulé EST la première colonne. */
.as-pg-tablewrap--codes .as-pg-table tbody td:first-child {
	font-family: var(--as-font-head);
	font-size: 12.2px;
	color: var(--as-accent);
	white-space: nowrap;
	width: 1%;
}

/* Bloc dont le contenu est une nouveauté de la version décrite : la bordure
   d'accent le signale au survol de la page, sans dépendre du badge. */
.as-pg-bloc--nouveau { border-color: rgba(95, 217, 160, 0.42); }

/* ---------- Bloc repliable (légendes, formules) ----------
   `<details>` natif : fonctionne sans JavaScript, le corps reste dans le HTML
   (donc indexable), l'état est annoncé aux lecteurs d'écran sans ARIA. */
.as-pg-details {
	margin: 0 0 16px;
	background: var(--as-bg-2);
	border: 1px solid var(--as-line);
	border-radius: var(--as-radius-sm);
	overflow: hidden;
}
.as-pg-details-summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	padding: 12px 15px;
	cursor: pointer;
	list-style: none;
	background: var(--as-card);
	font-family: var(--as-font-head);
	font-size: 13.2px;
	font-weight: 600;
	color: var(--as-ink);
	transition: background .18s ease, color .18s ease;
}
.as-pg-details-summary::-webkit-details-marker { display: none; }
.as-pg-details-summary::marker { content: ''; }
.as-pg-details-summary:hover { background: var(--as-card-2); color: var(--as-accent); }
.as-pg-details-summary:focus-visible {
	outline: 2px solid var(--as-accent);
	outline-offset: -2px;
}
.as-pg-details-head { min-width: 0; }
.as-pg-details-label { min-width: 0; }
/* Le libellé peut porter un TITRE (h3) : il ne doit alors ni se comporter comme
   un titre de section (marges, taille) ni casser l'alignement du résumé. */
.as-pg-details-label--heading {
	margin: 0;
	padding: 0;
	font-family: inherit;
	font-size: inherit;
	font-weight: inherit;
	line-height: inherit;
	color: inherit;
}
.as-pg-details-meta {
	display: block;
	margin-top: 3px;
	font-family: var(--as-font-body);
	font-size: 12.2px;
	font-weight: 400;
	line-height: 1.4;
	color: var(--as-muted);
}
.as-pg-details-summary:hover .as-pg-details-meta { color: var(--as-ink-2); }
.as-pg-details-chevron {
	flex-shrink: 0;
	width: 9px;
	height: 9px;
	border-right: 2px solid var(--as-accent);
	border-bottom: 2px solid var(--as-accent);
	transform: rotate(45deg) translate(-2px, -2px);
	transition: transform .2s ease;
}
.as-pg-details[open] > .as-pg-details-summary { color: var(--as-accent); }
.as-pg-details[open] > .as-pg-details-summary .as-pg-details-chevron {
	transform: rotate(225deg) translate(-2px, -2px);
}
.as-pg-details-body { padding: 14px 15px 4px; }
.as-pg-details-intro {
	margin: 0 0 10px;
	font-size: 13px;
	line-height: 1.55;
	color: var(--as-ink-2);
}
.as-pg-details-intro p { margin: 0 0 8px; }
.as-pg-details-note {
	margin: 4px 0 12px;
	font-size: 12.2px;
	line-height: 1.5;
	color: var(--as-muted);
}
/* Une légende de nomenclature est une liste de définitions très longue :
   le code (A1, B2…) sert de repère, on lui donne une largeur stable. */
.as-pg-details .as-pg-dl--legende .as-pg-dl-row { grid-template-columns: 74px 1fr; }
.as-pg-details .as-pg-dl--legende dt {
	font-family: var(--as-font-head);
	font-size: 12.5px;
	color: var(--as-accent);
}
.as-pg-details .as-pg-dl--legende dd { font-size: 13px; }

/* ---------- Indicateurs de performance (dossier méthodologique) ---------- */

/* Pastille d'état de santé d'un projet. Les cinq couleurs sont celles du
   référentiel France Fintech, reprises à l'identique : elles sont normatives,
   ce ne sont pas des choix graphiques. */
.as-pg-indic-dot {
	display: inline-block;
	width: 15px;
	height: 15px;
	border-radius: 50%;
	border: 1px solid var(--as-line-2);
	vertical-align: -2px;
	margin-right: 8px;
}
.as-pg-indic-dot--vert   { background: rgb(0, 128, 0); }
.as-pg-indic-dot--jaune  { background: rgb(255, 255, 0); }
.as-pg-indic-dot--orange { background: rgb(255, 102, 0); }
.as-pg-indic-dot--rouge  { background: rgb(255, 0, 0); }
.as-pg-indic-dot--noir   { background: rgb(0, 0, 0); }
.as-pg-indic-rvb {
	font-family: var(--as-font-head);
	font-size: 11.5px;
	color: var(--as-muted);
	white-space: nowrap;
}
/* Pastille et nom de couleur restent sur la même ligne : « 🟠 Orange » coupé
   en deux se lit comme deux informations distinctes. */
.as-pg-tablewrap--sante .as-pg-table td:nth-child(2) { white-space: nowrap; }
.as-pg-tablewrap--sante .as-pg-table td:first-child { font-weight: 500; color: var(--as-ink-2); }

/* Étiquette de version publiée par une plateforme.
   ⚠️ Les modificateurs disent l'ÉCART À LA VERSION EN VIGUEUR, jamais le numéro
   publié : une classe `--v5` deviendrait un contresens le jour de la V6, alors
   que « courante / précédente / antérieure / aucune » reste vrai à chaque
   nouvelle grille. Le numéro, lui, est le texte du badge. */
.as-pg-indic-badge {
	display: inline-block;
	font-size: 11.5px;
	font-weight: 700;
	letter-spacing: .04em;
	padding: 3px 9px;
	border-radius: var(--as-radius-pill);
	border: 1px solid var(--as-line-2);
	background: var(--as-bg-2);
	color: var(--as-muted);
	white-space: nowrap;
}
.as-pg-indic-badge--courante {
	background: rgba(95, 217, 160, 0.14);
	border-color: var(--as-enr);
	color: var(--as-enr);
}
.as-pg-indic-badge--precedente {
	background: rgba(127, 178, 229, 0.13);
	border-color: var(--as-immo);
	color: var(--as-immo);
}
.as-pg-indic-badge--ancien {
	background: rgba(240, 196, 106, 0.13);
	border-color: var(--as-autre);
	color: var(--as-autre);
}
.as-pg-indic-badge--absent {
	background: rgba(240, 128, 154, 0.12);
	border-color: var(--as-neg);
	color: var(--as-neg);
}
.as-pg-indic-reserve {
	display: block;
	margin-top: 3px;
	font-size: 11.6px;
	line-height: 1.4;
	color: var(--as-muted);
}
/* Colonne « source officielle » : lien discret, jamais un appel à l'action. */
.as-pg-indic-source { font-size: 12.4px; white-space: nowrap; }
.as-pg-indic-liens { font-size: 12.4px; }
.as-pg-indic-liens a + a::before {
	content: '·';
	margin: 0 6px;
	color: var(--as-muted);
}
/* Le nom de la plateforme porte le maillage interne. Lien discret : il garde
   l'encre de la colonne d'identité et ne prend l'accent qu'au survol — 37 noms
   en bleu vif rendraient la première colonne illisible. Sélecteur porté par
   `.as-scope` pour passer devant la règle de lien globale du socle. */
.as-scope a.as-pg-indic-nom {
	color: var(--as-ink);
	text-decoration: none;
	border-bottom: 1px dotted var(--as-line-fort, var(--as-muted));
}
.as-scope a.as-pg-indic-nom:hover,
.as-scope a.as-pg-indic-nom:focus-visible {
	color: var(--as-accent);
	border-bottom-color: var(--as-accent);
	border-bottom-style: solid;
}

/* Absence assumée : la cellule dit pourquoi elle est vide, en retrait. */
.as-pg-indic-vide {
	font-size: 12.4px;
	font-style: italic;
	color: var(--as-muted);
	opacity: .75;
}
.as-pg-tablewrap--versions .as-pg-table td:first-child { white-space: normal; min-width: 150px; }

/* ---------- Déclaration d'impôt (guide de vulgarisation) ---------- */

/* Répertoire des IFU : une fiche repliable par plateforme, en deux colonnes
   sur grand écran — vingt-huit fiches empilées feraient une colonne
   interminable, alors qu'on n'en ouvre qu'une ou deux. */
.as-pg-details--ifu { margin-bottom: 8px; }
.as-pg-details--ifu .as-pg-details-summary { padding: 10px 13px; font-size: 12.8px; }
.as-pg-details--ifu .as-pg-details-body { padding: 12px 13px 2px; }
.as-pg-details--ifu .as-pg-figure { margin-bottom: 10px; }

/* Index d'ancres non collant (« trouver ma plateforme ») : mêmes puces que le
   sommaire, mais dans le flux — une seule barre sticky par page. */
.as-pg-toc--plain {
	position: static;
	top: auto;
	z-index: auto;
}
.as-pg-toc--index {
	margin-bottom: 14px;
	max-height: 168px;
	overflow-y: auto;
}

/* Référence d'une case de la déclaration (2TT, 2BH…) : c'est un identifiant,
   il se repère comme tel. */
.as-pg-impots-case {
	display: inline-block;
	font-family: var(--as-font-head);
	font-size: 12.5px;
	font-weight: 700;
	letter-spacing: .05em;
	padding: 3px 10px;
	border-radius: var(--as-radius-pill);
	background: var(--as-accent-bg);
	border: 1px solid var(--as-accent);
	color: var(--as-accent);
	white-space: nowrap;
}
.as-pg-impots-detail {
	display: block;
	margin-top: 4px;
	font-size: 12.7px;
	font-weight: 400;
	line-height: 1.5;
	color: var(--as-ink-2);
}
.as-pg-tablewrap--cases .as-pg-table td:first-child,
.as-pg-tablewrap--reports .as-pg-table td:first-child { width: 1%; white-space: nowrap; }
.as-pg-tablewrap--cases .as-pg-table td:last-child { font-size: 12.6px; color: var(--as-muted); }
.as-pg-tablewrap--bareme .as-pg-table td:last-child,
.as-pg-tablewrap--bareme .as-pg-table th:last-child { text-align: right; white-space: nowrap; }
.as-pg-tablewrap--calendrier .as-pg-table td:last-child { white-space: nowrap; }

/* Formule de calcul mise en évidence dans un bloc replié. */
.as-pg-indic-formule {
	margin: 0 0 12px;
	padding: 12px 14px;
	background: var(--as-card);
	border: 1px solid var(--as-line-2);
	border-left: 3px solid var(--as-accent);
	border-radius: var(--as-radius-sm);
	font-family: var(--as-font-head);
	font-size: 13.5px;
	line-height: 1.7;
	color: var(--as-ink);
	overflow-x: auto;
}
.as-pg-indic-formule strong { color: var(--as-accent); }

/* ---------- Fiches régionales (« Le crowdfunding en région ») ---------- */

/* Le tableau des plateformes d'une région porte six colonnes, dont deux
   très courtes (année, ticket) et une colonne de liens. On rend leur
   largeur utile plutôt que de laisser le tableau répartir uniformément :
   le nom de la plateforme et la colonne de maillage ont besoin de la place,
   pas les millésimes. */
.as-pg-reg-table .as-pg-table th:nth-child(4),
.as-pg-reg-table .as-pg-table td:nth-child(4),
.as-pg-reg-table .as-pg-table th:nth-child(5),
.as-pg-reg-table .as-pg-table td:nth-child(5) {
	white-space: nowrap;
	width: 1%;
}

/* Colonne de maillage interne : les liens séparés par « · » ne doivent pas
   se couper au milieu d'un libellé. */
.as-pg-reg-table .as-pg-table td:last-child { line-height: 1.75; }
.as-pg-reg-table .as-pg-table td:last-child a { white-space: nowrap; }

/* Les KPI régionaux sont peu nombreux (de deux à cinq) : on les laisse
   respirer plutôt que de les étirer sur toute la largeur. */
.as-pg-reg-kpis { justify-content: flex-start; }

/* ⚠️ CORRECTIF MUTUALISÉ — filtres sur un TABLEAU.
   `as_pg_render_filtres()` masque les items en posant l'attribut `hidden`
   (as-page.js). Sur une liste, la règle `[hidden] { display: none }` de la
   feuille du navigateur suffit. Sur un tableau, elle est écrasée sous 760 px
   par le repli en cartes (`.as-pg-table tr { display: block }`), qui est une
   règle d'auteur : les lignes filtrées restaient donc VISIBLES au téléphone.
   Le sélecteur d'attribut ci-dessous est plus spécifique que la règle de
   repli, il gagne donc à toutes les largeurs et sans `!important`.
   Concerne toutes les fiches régionales ET le registre des versions
   d'indicateurs, qui filtre lui aussi un tableau. */
.as-pg-table tr[hidden],
.as-pg-table tbody tr[hidden] { display: none; }

/* ---------- Garanties du financement participatif ---------- */

/* Autres appellations d'une même sûreté (« ex-privilège de prêteur de
   deniers »). C'est une information de reconnaissance, pas un titre : elle
   passe sous le nom, en retrait. */
.as-pg-gar-alias {
	display: block;
	margin-top: 2px;
	font-size: 12.2px;
	font-weight: 400;
	line-height: 1.45;
	color: var(--as-muted);
}

/* Colonne « faut-il un juge ? ». ⚠️ Ces deux classes signalent un DÉLAI, pas
   une qualité : une sûreté qui se réalise sans juge est plus rapide, elle
   n'est pas « meilleure » — la page dit exactement le contraire d'un
   palmarès. D'où l'accent positif sur « Non » et une emphase NEUTRE sur
   « Oui » : un rouge se lirait comme un classement. */
.as-pg-gar-rapide {
	font-weight: 700;
	color: var(--as-pos);
}
.as-pg-gar-lent {
	font-weight: 600;
	color: var(--as-ink-2);
}

/* Intertitre à l'intérieur d'une fiche repliable : il n'entre pas dans le plan
   de titres de la page (les `h3` sont dans les `summary`), c'est un simple
   séparateur de lecture. */
.as-pg-gar-sous-titre {
	margin: 14px 0 6px;
	font-family: var(--as-font-head);
	font-size: 13px;
	letter-spacing: .01em;
	color: var(--as-ink);
}

/* Les fiches de garanties se lisent comme le répertoire des IFU : on n'en
   ouvre qu'une ou deux. Deux colonnes dès qu'il y a la place (règle commune
   plus bas), et un peu d'air entre les fiches. */
.as-pg-gar-liste .as-pg-details { margin-bottom: 8px; }

/* L'ordre de distribution est une procédure en trois blocs, pas une liste de
   puces : on garde la numérotation de l'élément `ol`, qui reste annoncée aux
   lecteurs d'écran et extractible par les moteurs. */
.as-pg-gar-ordre { margin-bottom: 4px; }

/* Blocs à contenu LONG (une famille de sûretés, un piège de lecture, un signal
   d'alerte : chacun porte une liste de définitions de deux lignes). La grille
   par défaut en `auto-fit` à 310 px en poserait trois de front sur la largeur
   du cadre et laisserait un orphelin ; deux colonnes tiennent la mesure de
   lecture et se remplissent proprement, quel que soit le nombre d'entrées. */
.as-pg-gar-familles,
.as-pg-gar-pieges,
.as-pg-ana-signaux { grid-template-columns: repeat(auto-fit, minmax(420px, 1fr)); }

/* ---------- Analyse d'un projet (grille de lecture) ---------- */

/* Rappel du bloc auquel appartient un point de contrôle, sous son intitulé :
   utile une fois la grille filtrée, indispensable une fois le tableau replié
   en cartes sur mobile. */
.as-pg-ana-bloc {
	display: inline-block;
	margin-top: 3px;
	padding: 1px 8px;
	border-radius: var(--as-radius-pill);
	background: var(--as-card-2, var(--as-card));
	border: 1px solid var(--as-line);
	font-size: 11.6px;
	font-weight: 600;
	letter-spacing: .02em;
	color: var(--as-muted);
	white-space: nowrap;
}

/* Colonne « ce qui doit alerter ». Un signal n'est PAS une interdiction (le
   chapitre le dit) : l'accent reste discret, jamais l'alarme rouge d'une
   erreur. */
.as-pg-ana-alerte {
	display: block;
	font-size: 12.7px;
	line-height: 1.55;
	color: var(--as-ink-2);
	border-left: 2px solid var(--as-autre, var(--as-accent));
	padding-left: 9px;
}

/* La grille compte quatre colonnes de texte long : sans largeur minimale, la
   première se réduit à un mot par ligne. Le repli en cartes sous 760 px lève
   la contrainte (bloc mobile plus bas). */
.as-pg-ana-grille .as-pg-table { min-width: 760px; }
.as-pg-ana-grille .as-pg-table td:first-child { min-width: 170px; white-space: normal; }

/* `.as-pg-ana-blocs` n'a volontairement AUCUNE règle : les six blocs de la
   grille portent deux lignes chacun, la grille `auto-fit` par défaut leur va.
   La classe reste posée comme crochet de mise en page et repère de débogage. */

/* Les quatre ratios se consultent un par un, comme les fiches de garanties. */
.as-pg-ana-reperes .as-pg-details { margin-bottom: 8px; }

/* Les KPI de la démonstration chiffrée arrivent au milieu d'un chapitre, pas
   en tête de page : ils respirent moins. */
.as-pg-ana-kpis { margin-top: 14px; }

/* ---------- Pied de page ---------- */
.as-pg-maillage { margin-top: 4px; }
.as-pg-disclosure {
	margin: 18px 0 0;
	font-size: 12.3px;
	color: var(--as-muted);
	line-height: 1.5;
}

/* ---------- Robots d'investissement (comparatif) ---------- */

/* Identité d'une plateforme en tête de ligne : même structure que les tableaux
   d'offres (`.as-pg-inv-plat`) — pastille de logo puis nom cliquable. */
.as-pg-rob-plat { display: inline-flex; align-items: center; gap: 9px; min-width: 0; }
.as-pg-rob-logo {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 26px;
	flex-shrink: 0;
	padding: 2px 4px;
	border-radius: 5px;
	background: #ffffff; /* Îlot clair assumé : les logos sont pensés sur fond blanc. */
	border: 1px solid var(--as-line);
}
.as-pg-rob-logo img { max-width: 100%; max-height: 100%; object-fit: contain; display: block; }
.as-pg-rob-logo--txt {
	background: var(--as-bg-2);
	color: var(--as-muted);
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
}
.as-pg-rob-nom { font-weight: 600; color: var(--as-ink); font-size: 13.5px; }

/* Le nom porte le maillage vers la fiche d'avis. Lien discret, comme dans le
   tableau des versions d'indicateurs : il garde l'encre de la colonne et ne
   prend l'accent qu'au survol. Sélecteur porté par `.as-scope` pour passer
   devant la règle de lien globale du socle. */
.as-scope a.as-pg-rob-lien {
	color: var(--as-ink);
	text-decoration: none;
	border-bottom: 1px dotted var(--as-line-fort, var(--as-muted));
}
.as-scope a.as-pg-rob-lien:hover,
.as-scope a.as-pg-rob-lien:focus-visible {
	color: var(--as-accent);
	border-bottom-color: var(--as-accent);
	border-bottom-style: solid;
}

/* Colonne « réglages de risque » : c'est la colonne qui porte la thèse de la
   page, elle a droit à l'accent. « aucun » reste neutre — un rouge se lirait
   comme une sanction, alors qu'un robot simple peut être le bon choix. */
.as-pg-rob-oui { color: var(--as-enr); font-size: 14px; }
.as-pg-rob-non { color: var(--as-muted); font-style: italic; font-size: 12.6px; }

/* ---- Matrices binaires : l'information se prend d'un coup d'œil ----
   Une coche verte, une croix neutre, et au plus un palier de trois mots. Tout
   le reste (à quoi sert le réglage, comment il se règle) vit dans la légende
   repliable sous le tableau et dans la fiche du robot. C'est ce qui permet aux
   huit colonnes de tenir dans la largeur du cadre, sans défilement latéral. */
.as-pg-rob-matrice .as-pg-table td { text-align: center; vertical-align: middle; }
.as-pg-rob-matrice .as-pg-table td:first-child { text-align: left; }
.as-pg-rob-matrice .as-pg-table th { text-align: center; font-size: 11.4px; line-height: 1.25; }
.as-pg-rob-matrice .as-pg-table th:first-child { text-align: left; }

/* ⚠️ Coche et croix DESSINÉES, sur un élément vide.
   Les caractères « ✔ » / « ✖ » n'existent dans aucune police du site : le
   navigateur les rendait avec une police emoji de repli, qui peint ses propres
   couleurs et ignore `color` — la coche restait grise. Le tracé CSS supprime
   toute dépendance à une police et rend l'accent enfin fiable. */
.as-pg-rob-y,
.as-pg-rob-n {
	display: block;
	position: relative;
	width: 16px;
	height: 16px;
	margin: 0 auto;
}
/* Coche : deux bords d'un rectangle, pivotés. */
.as-pg-rob-y::after {
	content: '';
	position: absolute;
	left: 5px;
	top: 1px;
	width: 5px;
	height: 10px;
	border: solid var(--as-enr);
	border-width: 0 2px 2px 0;
	transform: rotate(42deg);
}
/* Croix : deux barres. Volontairement discrète et NEUTRE — un rouge se lirait
   comme une sanction, alors qu'un robot simple peut être le bon choix. */
.as-pg-rob-n::before,
.as-pg-rob-n::after {
	content: '';
	position: absolute;
	left: 2px;
	top: 7px;
	width: 12px;
	height: 2px;
	border-radius: 1px;
	background: var(--as-line-2);
}
.as-pg-rob-n::before { transform: rotate(45deg); }
.as-pg-rob-n::after { transform: rotate(-45deg); }

/* Le palier, sous la coche : volontairement petit — s'il devient lisible de
   loin, c'est qu'il est trop long et qu'il élargit la colonne. */
.as-pg-rob-c {
	display: block;
	margin-top: 4px;
	font-size: 11.2px;
	line-height: 1.25;
	color: var(--as-ink-2);
	white-space: nowrap;
}

/* Légende repliable d'une matrice : ce que chaque réglage permet de refuser. */
.as-pg-rob-details { margin-top: -4px; }
.as-pg-rob-legende .as-pg-dl-row { align-items: start; }

/* Absence assumée : « non constaté lors de la revue », jamais « impossible ».
   Même traitement que `.as-pg-indic-vide` — en retrait, sans alarme. */
.as-pg-rob-vide {
	font-size: 12.4px;
	font-style: italic;
	color: var(--as-muted);
	opacity: .75;
}

/* Nom du robot sous celui de la plateforme, dans le tableau de synthèse :
   c'est le seul endroit du comparatif où les deux sont associés. */
.as-pg-rob-sous {
	display: block;
	margin-top: 2px;
	font-size: 11.6px;
	color: var(--as-muted);
}
/* Dénominateur du décompte de réglages : « 12/16 » se lit d'un coup, le 16
   n'a pas à peser autant que le 12. */
.as-pg-rob-sur { color: var(--as-muted); font-size: 12px; }

/* Aucune largeur minimale imposée : avec des cellules binaires, la grille tient
   dans le cadre. ⚠️ Ne pas réintroduire de `min-width` ici — c'est ce qui
   renvoyait la matrice en défilement latéral. Seule la colonne d'intitulés
   mérite de la place, et le nom de plateforme d'un en-tête doit pouvoir se
   replier sur deux lignes plutôt que d'élargir sa colonne. */
/* ⚠️ `table-layout: fixed` est la clé, et il n'est pas décoratif. En mode
   automatique, un en-tête long (« LA PREMIÈRE BRIQUE », « LES ENTREPRÊTEURS »,
   en capitales et interlettré) élargit sa colonne, pousse les suivantes, et la
   dernière plateforme sort du cadre — c'est ce qui coupait Tokimo. En mode
   fixe, les colonnes de robots sont égales par construction et le contenu se
   replie au lieu de repousser. Corollaire : le palier doit pouvoir passer à la
   ligne. */
.as-pg-rob-matrice .as-pg-table { table-layout: fixed; }
/* ⚠️ La colonne d'intitulés est la variable d'ajustement quand le registre
   gagne un robot : chaque point qu'on lui reprend est redistribué à parts
   égales entre les colonnes de plateformes. Elle est passée de 27 à 24 % à
   l'entrée du huitième robot ; sous ~22 %, les intitulés de réglages se
   replient sur trois lignes et la matrice se creuse. */
.as-pg-rob-matrice .as-pg-table th:first-child,
.as-pg-rob-matrice .as-pg-table td:first-child { width: 24%; white-space: normal; }
.as-pg-rob-matrice .as-pg-table th { white-space: normal; }
/* Colonnes de plateformes : on récupère en largeur utile ce que la gouttière
   prenait — huit fois 14 px de chaque côté, c'est plus d'une colonne entière. */
.as-pg-rob-matrice .as-pg-table th + th,
.as-pg-rob-matrice .as-pg-table td + td { padding-left: 6px; padding-right: 6px; }
.as-pg-rob-matrice .as-pg-rob-c { white-space: normal; }
.as-pg-rob-synthese .as-pg-table td:first-child { white-space: normal; }
.as-pg-rob-synthese .as-pg-table td:last-child { white-space: normal; }
.as-pg-rob-sans .as-pg-table td:last-child { white-space: normal; }

/* ---- Hiérarchie de surfaces ----
   ⚠️ Le socle pose le MÊME fond (`--as-card`) sur la section et sur les blocs
   titrés : deux cartes de la même couleur l'une dans l'autre ne se distinguent
   pas, et toute la page se lit comme un seul aplat. On rétablit donc trois
   niveaux, du plus sombre au plus clair : la famille recule, le tableau
   avance. C'est lui qu'on vient lire. */
.as-pg-rob-famille {
	background: var(--as-bg-2);
	border-color: var(--as-line-2);
	padding-bottom: 10px;
}
.as-pg-rob-famille .as-pg-tablewrap {
	background: var(--as-card);
	border-color: var(--as-line-2);
}
.as-pg-rob-famille .as-pg-details {
	background: var(--as-card);
	border-color: var(--as-line-2);
}
/* La question à laquelle la famille répond : elle doit se voir, c'est elle qui
   donne le sens du tableau qui suit. */
.as-pg-rob-question {
	padding-left: 10px;
	border-left: 2px solid var(--as-line-2);
	color: var(--as-ink-2);
}

/* ---- Lisibilité d'une grille large ----
   Huit colonnes de coches se lisent en diagonale : sans repère, l'œil perd sa
   ligne entre l'intitulé et la dernière plateforme. Trois aides, toutes
   discrètes — alternance de lignes, colonne d'intitulés tenue à part, filets
   verticaux entre plateformes — plus un survol qui suit la ligne. */
.as-pg-rob-matrice .as-pg-table thead th {
	background: var(--as-card-2);
	border-bottom: 2px solid var(--as-line-2);
}
.as-pg-rob-matrice .as-pg-table tbody tr:nth-child(even) td { background: rgba(255, 255, 255, .022); }
.as-pg-rob-matrice .as-pg-table tbody tr:hover td { background: rgba(124, 141, 240, .07); }
.as-pg-rob-matrice .as-pg-table th:first-child,
.as-pg-rob-matrice .as-pg-table td:first-child {
	background: var(--as-card-2);
	border-right: 1px solid var(--as-line-2);
}
.as-pg-rob-matrice .as-pg-table tbody tr:hover td:first-child { background: var(--as-card-2); }
.as-pg-rob-matrice .as-pg-table th + th,
.as-pg-rob-matrice .as-pg-table td + td { border-left: 1px solid var(--as-line); }

/* Même traitement sur le tableau de synthèse : c'est la même grille de
   lecture, elle doit se comporter pareil. */
.as-pg-rob-synthese .as-pg-table thead th {
	background: var(--as-card-2);
	border-bottom: 2px solid var(--as-line-2);
}
.as-pg-rob-synthese .as-pg-table tbody tr:nth-child(even) td { background: rgba(255, 255, 255, .022); }
.as-pg-rob-synthese .as-pg-table tbody tr:hover td { background: rgba(124, 141, 240, .07); }

/* La légende d'une matrice répète son titre de bloc (« Réglages disponibles :
   Ce qui borne l'exposition »). On la garde pour les lecteurs d'écran — c'est
   le nom accessible du tableau — mais on cesse de l'afficher deux fois. */
.as-pg-rob-matrice .as-pg-table-caption {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	white-space: nowrap;
}

/* La question à laquelle une famille de réglages répond, en tête de bloc :
   c'est elle qui donne le sens de la matrice qui suit. */
.as-pg-rob-question {
	margin: 0 0 6px;
	color: var(--as-ink-2);
	font-size: 13.2px;
}

/* Une famille = un bloc large : les matrices sont bien trop larges pour deux
   colonnes de front, quelle que soit la taille de l'écran. */
.as-pg-rob-blocs { grid-template-columns: 1fr; }

/* Fiches détaillées : les captures d'écran d'interface sont hautes et étroites
   pour certaines, larges pour d'autres. On borne la hauteur pour qu'une
   capture verticale n'occupe pas un écran entier. */
.as-pg-rob-figure .as-pg-figure-img { max-height: 620px; width: auto; margin: 0 auto; }
.as-pg-rob-dl { margin-bottom: 12px; }

/* ---------- Sommaire éditorial (/actu-dossier/) ----------
   ⚠️ Ces règles ne sont PAS portées par `.as-pg-wrap` : le bloc « À la une »
   est un composant EXPORTABLE, rendu dans la page d'accueil du site (AS Home),
   qui n'a pas ce conteneur. Ne pas les y imbriquer.

   Aucun contenu ne porte d'image de une à ce jour : la vignette est une TUILE
   dérivée de la rubrique (teinte + pictogramme), pas une illustration. Le jour
   où les contenus auront un visuel, c'est elle — et elle seule — qui devient
   une `<img>`. */

.as-pg-actu-carte {
	/* Teinte de repli : chaque carte écrase ces trois variables en style inline
	   à partir de la couleur de sa rubrique, validée côté PHP (#rrggbb). */
	--as-pg-teinte: var(--as-accent);
	--as-pg-teinte-bg: var(--as-accent-bg);
	--as-pg-teinte-fort: var(--as-accent-bg);
	--as-pg-teinte-line: var(--as-line-2);

	position: relative; /* Ancrage du lien étiré du titre. */
	display: flex;
	flex-direction: column;
	background: var(--as-bg-2);
	border: 1px solid var(--as-line);
	border-radius: var(--as-radius-sm);
	overflow: hidden;
	transition: border-color .15s ease, transform .15s ease;
}
.as-pg-actu-carte:hover,
.as-pg-actu-carte:focus-within { border-color: var(--as-pg-teinte-line); transform: translateY(-2px); }

/* Vignette : dégradé teinté + trame discrète, pour que l'absence de photo ne
   se lise pas comme un aplat resté vide. Elle porte l'IDENTITÉ de la carte
   (rubrique) — la ligne de pastilles en dessous ne porte que son ÉTAT. */
.as-pg-actu-vignette {
	position: relative;
	display: flex;
	align-items: center;
	gap: 9px;
	min-height: 52px;
	padding: 9px 15px;
	background:
		radial-gradient(120px 90px at 12% 20%, var(--as-pg-teinte-bg), transparent 70%),
		linear-gradient(120deg, var(--as-pg-teinte-bg), transparent 72%),
		var(--as-card);
	border-bottom: 1px solid var(--as-line);
	overflow: hidden;
}
.as-pg-actu-vignette::after {
	content: "";
	position: absolute;
	inset: 0;
	background-image: radial-gradient(var(--as-pg-teinte-line) 1px, transparent 1px);
	background-size: 15px 15px;
	opacity: .16;
}
.as-pg-actu-vignette-icone { position: relative; font-size: 20px; line-height: 1; flex-shrink: 0; }
.as-pg-actu-vignette-rub {
	position: relative;
	font-size: 10.6px;
	font-weight: 700;
	letter-spacing: .13em;
	text-transform: uppercase;
	color: var(--as-pg-teinte);
	line-height: 1.3;
}
.as-pg-actu-vignette-txt {
	position: relative;
	font-size: 10.6px;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--as-muted);
	text-align: center;
}

.as-pg-actu-corps {
	display: flex;
	flex: 1 1 auto;
	flex-direction: column;
	gap: 7px;
	padding: 13px 15px 14px;
	min-width: 0;
}
.as-pg-actu-tags { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; }
.as-pg-actu-flag {
	display: inline-flex;
	align-items: center;
	padding: 2px 9px;
	border-radius: var(--as-radius-pill);
	font-size: 10.8px;
	font-weight: 700;
	letter-spacing: .02em;
	white-space: nowrap;
}
.as-pg-actu-flag--neuf  { background: rgba(95, 217, 160, .16); color: var(--as-enr); border: 1px solid rgba(95, 217, 160, .45); }
.as-pg-actu-flag--maj   { background: rgba(124, 141, 240, .16); color: var(--as-accent); border: 1px solid rgba(124, 141, 240, .45); }
/* Contenu signé par un tiers : la mention est neutre, elle informe — elle ne
   met pas en avant (cf. AGENTS.md §12duodecies). */
.as-pg-actu-flag--signe { background: var(--as-card-2); color: var(--as-muted); border: 1px solid var(--as-line-2); font-weight: 600; text-transform: none; }

.as-pg-actu-titre {
	font-family: var(--as-font-head);
	font-size: 14.6px;
	font-weight: 600;
	line-height: 1.32;
	margin: 0;
}
/* Un seul lien par carte — mais toute la surface est cliquable : le titre
   s'étire sur la carte (`position: relative` ci-dessus). Multiplier les ancres
   vers la même cible dessert autant les lecteurs d'écran que les moteurs. */
.as-pg-actu-carte .as-pg-actu-titre a { color: var(--as-ink); text-decoration: none; }
.as-pg-actu-carte:hover .as-pg-actu-titre a { color: var(--as-ink); text-decoration: underline; }
.as-pg-actu-titre a::after { content: ""; position: absolute; inset: 0; }
.as-pg-actu-titre a:focus-visible { outline: 2px solid var(--as-pg-teinte); outline-offset: 3px; }

.as-pg-actu-chapo { margin: 0; font-size: 13.3px; line-height: 1.55; color: var(--as-ink-2); }
.as-pg-actu-meta {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: space-between;
	gap: 6px 12px;
	margin: auto 0 0; /* Collée au bas de la carte, quelle que soit la longueur du chapô. */
	padding-top: 4px;
	font-size: 11.7px;
	color: var(--as-muted);
}
.as-pg-actu-lire { color: var(--as-pg-teinte); font-weight: 600; white-space: nowrap; }

/* Grille de la liste complète. */
.as-pg-actu-grille {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(285px, 1fr));
	gap: 12px;
}

/* Bloc « À la une » : une carte principale, puis les suivantes en rang.
   Même composant côté page d'accueil du site. */
.as-pg-actu-une { display: grid; gap: 12px; }
.as-pg-actu-une-suite {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(235px, 1fr));
	gap: 12px;
}
.as-pg-actu-carte--une { background: var(--as-card); border-color: var(--as-line-2); }

/* Cartes de présentation des rubriques : elles annoncent un décompte, pas un
   lien — la navigation se fait par la barre de filtres juste en dessous. */
.as-pg-actu-rubcards { grid-template-columns: repeat(auto-fit, minmax(235px, 1fr)); }

/* ---------- Comparatif crowdfunding / SCPI (/crowdfunding-immobilier-vs-scpi/) ----------
   Une page de comparaison a un besoin qu'aucune autre n'a : distinguer d'un
   coup d'œil ce qui relève d'un univers et ce qui relève de l'autre, SANS
   transformer le tableau en camaïeu illisible. On s'en tient donc à deux
   teintes déjà portées par les tokens du socle — celle de l'immobilier pour la
   pierre-papier, celle de l'accent pour le financement participatif — et on ne
   les emploie QUE sur des pastilles, jamais en fond de cellule. */

/* Mention de source / de méthode sous une valeur : elle doit se lire comme une
   note de bas de tableau, pas comme une donnée de plus. Même traitement que
   `.as-pg-indic-vide` et `.as-pg-rob-vide` — en retrait, sans alarme. */
.as-pg-wrap .as-pg-vs-src {
	display: inline-block;
	margin-top: 2px;
	font-size: 11.6px;
	line-height: 1.3;
	color: var(--as-muted);
}

/* La colonne « ce que ça change pour vous » est la raison d'être du tableau :
   elle se distingue des deux colonnes descriptives, sans crier. */
.as-pg-vs-decide { display: block; color: var(--as-ink-2); font-style: italic; }

/* Rappel de la famille sous l'intitulé du critère : le tableau étant
   filtrable, le lecteur doit savoir sur quoi porte le filtre actif. */
.as-pg-vs-fam {
	display: inline-block;
	margin-top: 3px;
	font-size: 11.2px;
	color: var(--as-muted);
	text-transform: uppercase;
	letter-spacing: .04em;
}

/* Verdict d'une ligne du tableau fiscal. La couleur dit QUEL placement gagne,
   elle ne dit pas « bien » ou « mal » : aucun vert de satisfaction ni rouge de
   sanction ici, le gagnant dépend entièrement de la tranche du lecteur. */
.as-pg-vs-verdict {
	display: inline-block;
	padding: 2px 8px;
	border: 1px solid var(--as-line-2);
	border-radius: 999px;
	font-size: 12px;
	font-weight: 600;
	white-space: nowrap;
}
.as-pg-vs-verdict--cf { color: var(--as-accent); border-color: var(--as-accent); }
.as-pg-vs-verdict--scpi { color: var(--as-immo); border-color: var(--as-immo); }
.as-pg-vs-verdict--egalite { color: var(--as-muted); }

/* La grille comparative a quatre colonnes de texte : sans largeur minimale sur
   la première, l'intitulé du critère se replie sur cinq lignes. */
.as-pg-vs-tab .as-pg-table td:first-child { min-width: 148px; }

/* Le tableau fiscal se lit ligne par ligne : la tranche marginale sert
   d'ancrage, on la garde compacte et on aligne les montants à gauche comme le
   reste des tableaux éditoriaux du plugin. */
.as-pg-vs-fisc .as-pg-table td:first-child { width: 1%; white-space: nowrap; }

/* Orientation d'un profil : une pastille, posée avant l'argumentaire. Elle
   annonce une tendance, jamais un conseil — d'où l'absence de tout vert. */
.as-pg-vs-o {
	display: inline-block;
	padding: 3px 10px;
	border: 1px solid var(--as-line-2);
	border-radius: 999px;
	font-size: 12.4px;
	font-weight: 600;
}
.as-pg-vs-o--cf { color: var(--as-accent); border-color: var(--as-accent); }
.as-pg-vs-o--scpi { color: var(--as-immo); border-color: var(--as-immo); }
.as-pg-vs-o--mixte { color: var(--as-ink-2); }

/* La situation décrite par le profil : un sous-titre, pas un paragraphe. */
.as-pg-vs-situation { margin: 0 0 6px; color: var(--as-muted); font-size: 12.8px; }

/* ⚠️ La réserve est OBLIGATOIRE sur chaque profil (cf. as_pg_vs_profils()) :
   elle est donc mise en évidence par un filet, et non reléguée en petit. Un
   profil dont on ne lirait que la recommandation serait une publicité. */
.as-pg-vs-reserve {
	margin: 8px 0 0;
	padding-left: 10px;
	border-left: 2px solid var(--as-line-2);
	font-size: 13px;
	color: var(--as-ink-2);
}

/* Les deux fiches de repères (une par base) tiennent côte à côte : ce sont
   deux listes de définitions courtes et indépendantes. */
.as-pg-vs-reperes { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }

@media (min-width: 761px) {
	/* La carte principale passe à l'horizontale : la vignette devient une
	   colonne, seul endroit où la teinte de rubrique a la place de s'exprimer. */
	.as-pg-actu-carte--une { flex-direction: row; align-items: stretch; }
	.as-pg-actu-carte--une .as-pg-actu-vignette {
		flex: 0 0 215px;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		gap: 8px;
		padding: 18px 16px;
		border-bottom: 0;
		border-right: 1px solid var(--as-line);
		/* Le panneau de la carte principale est le seul endroit où la teinte a
		   la place de s'exprimer : elle y est deux fois plus soutenue. */
		background:
			radial-gradient(150px 150px at 50% 35%, var(--as-pg-teinte-fort), transparent 72%),
			linear-gradient(150deg, var(--as-pg-teinte-bg), transparent 78%),
			var(--as-card);
	}
	.as-pg-actu-carte--une .as-pg-actu-vignette-icone { font-size: 42px; }
	.as-pg-actu-carte--une .as-pg-actu-vignette-rub { font-size: 11.4px; text-align: center; }
	.as-pg-actu-carte--une .as-pg-actu-corps { padding: 18px 20px 16px; gap: 9px; }
	.as-pg-actu-carte--une .as-pg-actu-titre { font-size: clamp(17px, 2.1vw, 21px); }
	.as-pg-actu-carte--une .as-pg-actu-chapo { font-size: 14.2px; max-width: 74ch; }
}

/* ---------- FAQ mutualisée : cohérence avec le cadre ---------- */
.as-pg-wrap .as-faq { margin: 0 0 18px; }

/* ---------- Bande intermédiaire : tablette paysage, petit portable ----------
   Entre 760 et 1000 px, la grille complète ne tient objectivement pas : à cette
   largeur, une colonne de plateforme tombe sous 70 px et « BIENPRÊTER » déborde
   de sa cellule. Deux mauvaises solutions — écraser la police des en-têtes
   jusqu'à l'illisible, ou dupliquer les 35 lignes du repli en cartes, qui
   dériveraient de la version partagée. On rend donc sa largeur naturelle au
   tableau et on assume un défilement court, le temps d'une bande d'écrans où
   la grille est réellement trop large. Au-dessus, rien ne défile ; en dessous
   de 760 px, le repli en cartes prend le relais.
   ⚠️ La `min-width` se relit à chaque robot ajouté au registre : elle vaut
   200 px d'intitulés + une largeur lisible par plateforme. Elle est passée de
   760 à 820 px à l'entrée du huitième robot. */
@media (max-width: 999px) {
	.as-pg-rob-matrice .as-pg-table { table-layout: auto; min-width: 820px; }
	.as-pg-rob-matrice .as-pg-table th:first-child,
	.as-pg-rob-matrice .as-pg-table td:first-child { width: 200px; }
	/* Les capitales interlettrées sont ce qui coûte le plus cher en largeur :
	   les resserrer suffit à faire tenir la grille entière jusqu'à ~900 px,
	   et ne laisse un défilement que sur les écrans réellement étroits. */
	.as-pg-rob-matrice .as-pg-table thead th { font-size: 10.8px; letter-spacing: .02em; }
}

/* ---------- Mobile ---------- */
@media (max-width: 760px) {
	.as-pg-wrap { padding: 10px 10px 22px; border-radius: 14px; }
	.as-pg-section { padding: 16px 14px; scroll-margin-top: 90px; }
	.as-pg-toc { padding: 8px; gap: 6px; }
	.as-pg-toc-chip { font-size: 11.5px; padding: 4px 10px; }
	.as-pg-dl-row { grid-template-columns: 1fr; gap: 2px; padding: 8px 0; }
	.as-pg-byline { padding: 10px; gap: 10px; }
	.as-pg-byline-photo { width: 46px; height: 46px; }
	.as-pg-kpis { grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 8px; }
	.as-pg-nl { padding: 14px; }
	.as-pg-nl-form { padding: 12px; }
	.as-pg-presse-mur-item { width: 92px; height: 46px; padding: 6px 9px; }
	.as-pg-presse-grid,
	.as-pg-presse-grid--une { grid-template-columns: 1fr; }

	/* Sommaire éditorial : une seule colonne de cartes — sur un téléphone, la
	   place appartient au titre, la bande de rubrique reste une simple ligne. */
	.as-pg-actu-grille,
	.as-pg-actu-une-suite { grid-template-columns: 1fr; }
	.as-pg-actu-vignette { min-height: 46px; padding: 8px 13px; }
	.as-pg-actu-vignette-icone { font-size: 18px; }
	.as-pg-actu-carte--une .as-pg-actu-vignette-icone { font-size: 24px; }
	.as-pg-actu-corps { padding: 12px 13px 13px; }
	.as-pg-actu-meta { font-size: 11.3px; }
	.as-pg-presse-date { width: 100%; }

	/* Tableaux : repli en cartes plutôt qu'en défilement horizontal. Chaque
	   cellule réaffiche son en-tête (`data-th`), l'en-tête de colonne passe en
	   masquage accessible — il reste lu, il n'est plus affiché deux fois. */
	.as-pg-tablewrap { overflow-x: visible; background: transparent; border: 0; border-radius: 0; }
	.as-pg-table thead {
		position: absolute;
		width: 1px;
		height: 1px;
		overflow: hidden;
		clip-path: inset(50%);
		white-space: nowrap;
	}
	.as-pg-table,
	.as-pg-table tbody,
	.as-pg-table tr,
	.as-pg-table td { display: block; width: 100%; }
	.as-pg-table-caption { display: block; padding: 0 0 8px; }
	.as-pg-table tr {
		margin: 0 0 10px;
		padding: 3px 0;
		background: var(--as-bg-2);
		border: 1px solid var(--as-line);
		border-radius: var(--as-radius-sm);
	}
	.as-pg-table tbody tr:last-child { margin-bottom: 0; }
	.as-pg-table td { padding: 8px 13px; border-bottom: 1px dashed var(--as-line); }
	.as-pg-table tbody tr td:last-child { border-bottom: 0; }
	.as-pg-table td[data-th]:not([data-th=""])::before {
		content: attr(data-th);
		display: block;
		margin: 0 0 3px;
		font-size: 10.5px;
		font-weight: 600;
		text-transform: uppercase;
		letter-spacing: .04em;
		color: var(--as-muted);
	}
	/* Cellule vide : en colonnes elle tient la grille, mais repliée en carte
	   elle n'affiche plus qu'un intitulé sans valeur. On la retire — c'est la
	   même règle que partout ailleurs dans le plugin : pas de ligne creuse. */
	.as-pg-table td:empty { display: none; }
	.as-pg-tablewrap--simul .as-pg-table td + td { text-align: left; }
	.as-pg-tablewrap--chiffres .as-pg-table td:first-child,
	.as-pg-tablewrap--sources .as-pg-table td:first-child,
	.as-pg-tablewrap--compare .as-pg-table td:first-child,
	.as-pg-tablewrap--familles .as-pg-table td:first-child { width: 100%; white-space: normal; }
	.as-pg-table-note { margin-top: 0; }

	.as-pg-steps { padding-left: 26px; }
	.as-pg-blacklist { grid-template-columns: 1fr; }
	.as-pg-inv-table { min-width: 700px; }
	.as-pg-inv-table--mini { min-width: 520px; }
	.as-pg-inv-offre { max-width: 26ch; font-size: 12px; }

	/* Blocs titrés : une colonne, et la carte du bloc l'emporte sur celle que
	   le repli mobile pose autour de chaque ligne de tableau — sinon on
	   empilerait deux cadres pour un seul contenu. */
	.as-pg-blocs { grid-template-columns: 1fr; gap: 10px; }
	.as-pg-bloc { padding: 12px 12px 6px; }
	.as-pg-bloc .as-pg-table tr {
		margin: 0;
		padding: 0;
		background: transparent;
		border: 0;
		border-bottom: 1px solid var(--as-line);
		border-radius: 0;
	}
	.as-pg-bloc .as-pg-table tbody tr:last-child { border-bottom: 0; }
	.as-pg-bloc .as-pg-table td { padding: 6px 0; border-bottom: 0; }
	/* Repli en cartes : la colonne de codes redevient une ligne comme les
	   autres, en tête de carte — la contraindre à 1 % la rendrait illisible. */
	.as-pg-tablewrap--codes .as-pg-table tbody td:first-child { width: auto; }
	.as-pg-bloc .as-pg-table th:last-child,
	.as-pg-bloc .as-pg-table td:last-child { text-align: left; }

	/* Repliables et figures : moins de marges, la légende reste lisible. */
	.as-pg-details-summary { padding: 11px 12px; font-size: 12.7px; }
	.as-pg-details-body { padding: 12px 12px 2px; }
	.as-pg-details .as-pg-dl--legende .as-pg-dl-row { grid-template-columns: 1fr; gap: 1px; }
	.as-pg-figure { padding: 7px; }
	.as-pg-figure--haute .as-pg-figure-img { max-height: none; width: 100%; }
	.as-pg-indic-formule { font-size: 12.5px; padding: 10px 11px; }
	.as-pg-tablewrap--versions .as-pg-table td:first-child { min-width: 0; }

	/* Répertoire d'IFU et mémo des cases : les colonnes réservées à leur
	   largeur utile redeviennent pleine largeur une fois le tableau replié. */
	.as-pg-toc--index { max-height: 132px; }
	.as-pg-tablewrap--cases .as-pg-table td:first-child,
	.as-pg-tablewrap--reports .as-pg-table td:first-child { width: 100%; white-space: normal; }
	.as-pg-tablewrap--bareme .as-pg-table td:last-child { text-align: left; }
	.as-pg-details--ifu .as-pg-details-summary { font-size: 12.4px; }

	/* Grille d'analyse : la largeur minimale n'a de sens qu'en colonnes. Une
	   fois le tableau replié en cartes, elle imposerait un défilement
	   latéral — exactement ce que le repli sert à éviter. */
	.as-pg-ana-grille .as-pg-table,
	.as-pg-ana-grille .as-pg-table td:first-child { min-width: 0; }
	.as-pg-ana-bloc { margin-top: 4px; }
	.as-pg-ana-alerte { padding-left: 8px; }

	/* Matrices de robots repliées en cartes : chaque cellule réaffiche son
	   en-tête (`data-th`), donc le nom de la plateforme reste lisible. La coche
	   repasse alors à gauche, dans le flux de la ligne, et le palier revient à
	   côté d'elle plutôt qu'en dessous. */
	/* ⚠️ Annule la largeur minimale de la bande intermédiaire : une fois le
	   tableau replié en cartes, elle imposerait le défilement latéral que le
	   repli sert justement à éviter. */
	.as-pg-rob-matrice .as-pg-table { min-width: 0; }
	.as-pg-rob-matrice .as-pg-table td:first-child { width: auto; }
	.as-pg-rob-matrice .as-pg-table td,
	.as-pg-rob-matrice .as-pg-table th { text-align: left; }
	/* La marque reste un bloc DESSINÉ (ses traits sont positionnés dans une
	   boîte de 16 px) : `inline-block`, jamais `inline`, sinon le tracé
	   s'effondre. Elle revient simplement dans le flux de la ligne, avec le
	   palier à côté d'elle plutôt qu'en dessous. */
	.as-pg-rob-y,
	.as-pg-rob-n { display: inline-block; margin: 0; vertical-align: -3px; }
	.as-pg-rob-c { display: inline; margin: 0 0 0 4px; white-space: normal; }
	/* Le repli en cartes retire la grille : les filets de colonne et le fond
	   de la première cellule n'ont plus de sens, ils dessineraient des blocs
	   au milieu d'une carte. */
	.as-pg-rob-matrice .as-pg-table th:first-child,
	.as-pg-rob-matrice .as-pg-table td:first-child { background: transparent; border-right: 0; }
	.as-pg-rob-matrice .as-pg-table td + td { border-left: 0; }

	/* Comparatif crowdfunding / SCPI : une fois les tableaux repliés en cartes,
	   les largeurs de colonne n'ont plus d'objet — la première cellule doit
	   redevenir pleine largeur, sinon elle impose le défilement latéral que le
	   repli sert précisément à éviter (même correctif que les matrices). */
	.as-pg-vs-tab .as-pg-table td:first-child { min-width: 0; }
	.as-pg-vs-fisc .as-pg-table td:first-child { width: 100%; white-space: normal; }
	/* Le verdict fiscal est le seul contenu qu'on laisse insécable : replié, il
	   dispose de toute la largeur de la carte. */
	.as-pg-vs-verdict { white-space: normal; }
	.as-pg-rob-matrice .as-pg-table tbody tr:nth-child(even) td,
	.as-pg-rob-synthese .as-pg-table tbody tr:nth-child(even) td { background: transparent; }
	.as-pg-rob-figure .as-pg-figure-img { max-height: none; width: 100%; }
	.as-pg-rob-logo { width: 34px; height: 22px; }
}

/* Deux colonnes de fiches dès qu'il y a la place : un répertoire se parcourt
   d'un coup d'œil au lieu de dérouler sur un écran entier.
   ⚠️ Réservé aux RÉPERTOIRES — entrées courtes, homogènes et indépendantes,
   qu'on ouvre à l'unité : les IFU par plateforme et les fiches de garanties.
   Jamais une suite de légendes qu'on lit dans l'ordre. `align-items: start`
   est indispensable : sans lui, ouvrir une fiche étirerait sa voisine. */
@media (min-width: 900px) {
	.as-pg-ifu-liste,
	.as-pg-gar-liste {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 0 12px;
		align-items: start;
	}
}