/* ============================================================
 * AS Classement Investisseurs — /comparatif-plateforme-crowdfunding/{a}-vs-{b}/
 * Duels de plateformes, page à COLONNE DE DROITE (layout AS_Page `sidebar`,
 * thème SOMBRE). Le cadre garde son `max-width` : il sert quand aucune zone de
 * widgets n'est active (le socle retombe alors sur une page sans colonne), et il
 * est neutralisé par `.as-page--with-aside .as-page-main > *` dès que la colonne
 * est là. Les adaptations « colonne étroite » sont regroupées en fin de fichier.
 *
 * DÉPEND DU SOCLE AS Core : les tokens --as-* (couleurs, polices, rayons)
 * viennent de as-core.css (chargé en dépendance), ainsi que les composants
 * mutualisés (.as-chapter, .as-btn-premium, .as-tag, .as-tab / .as-pane,
 * .as-partner-*, .as-compare-deeper, .as-disclosure-*). Ce fichier ne
 * contient que le SPÉCIFIQUE du module (préfixe as-cvs-).
 *
 * Code couleur du duel, tenu de bout en bout : la plateforme A porte l'AMBRE,
 * la plateforme B le BLEU. Les mêmes couleurs sont reprises par les courbes
 * Chart.js (as-classement-versus.js) : un lecteur qui a repéré « A = violet »
 * dans le hero le retrouve dans les graphiques ET dans les cellules gagnantes.
 * Le vert de victoire a été retiré des tableaux : il entrait en collision avec
 * la couleur d'équipe et brouillait la lecture.
 * ============================================================ */

.as-cvs-wrap {
	font-family: var(--as-font-body, 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif);
	color: var(--as-ink);
	background: var(--as-bg);
	line-height: 1.55;
	max-width: 1180px;
	margin: 0 auto;
	padding: 14px 16px 30px;
	border-radius: 18px;

	/* Couleurs d'équipe de la nouvelle charte : A en ambre et B en bleu. Le vert
	 * disparaît complètement des tableaux : une cellule gagnante s'habille de la
	 * couleur de SA plateforme. On lit « qui » gagne, pas seulement « que
	 * quelqu'un » gagne. */
	--as-cvs-a: #f4b91f;
	--as-cvs-b: #28a5ff;
	--as-cvs-a-bg: rgba(244, 185, 31, 0.11);
	--as-cvs-b-bg: rgba(40, 165, 255, 0.11);
	--as-cvs-a-line: rgba(244, 185, 31, 0.42);
	--as-cvs-b-line: rgba(40, 165, 255, 0.42);
	--as-cvs-gold: #f4b91f;

	/* Fonds relevés : le reproche « tout est très sombre » vient d'un aplat
	 * unique du hero au pied de page. On échelonne trois niveaux nettement
	 * distincts (page < carte < carte interne). */
	--as-cvs-surface: #0e1216;
	--as-cvs-surface-2: #151a20;
	--as-cvs-line-fort: #252d35;

	/* Fond de la barre d'ancres collée (composant mutualisé `.as-sticky-tabs`) :
	 * translucide pour laisser deviner le contenu qui défile dessous, mais assez
	 * opaque pour que les libellés restent lisibles par-dessus un tableau. */
	--as-sticky-bg: rgba(10, 13, 16, 0.94);
}
.as-cvs-wrap * { box-sizing: border-box; }
.as-cvs-wrap a { color: var(--as-accent); }
.as-cvs-wrap a:hover { color: var(--as-accent-2); }

/* ---------- Titres & blocs ---------- */
.as-cvs-h1 {
	font-family: var(--as-font-head);
	font-weight: 700;
	font-size: clamp(28px, 4vw, 46px);
	margin: 0 0 16px;
	letter-spacing: -.055em;
	background: linear-gradient(100deg, #ffffff, #d7dde2 70%);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	line-height: 1.15;
}
.as-cvs-lead { max-width: 720px; margin: -5px 0 22px; color: var(--as-muted); font-size: 15px; }
.as-cvs-h2 {
	font-family: var(--as-font-head);
	font-size: clamp(20px, 3vw, 27px);
	font-weight: 700;
	color: #ffffff;
	margin: 0 0 18px;
	line-height: 1.25;
}
.as-cvs-h3 { font-family: var(--as-font-head); font-size: 16.5px; font-weight: 600; margin: 0 0 8px; color: var(--as-ink); }
.as-cvs-h3 a { text-decoration: none; }
.as-cvs-h4 { font-family: var(--as-font-body); font-size: 13.5px; font-weight: 700; margin: 14px 0 6px; color: var(--as-ink-2); text-transform: uppercase; letter-spacing: .05em; }
.as-cvs-kicker {
	font-size: 11.5px;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--as-accent);
	font-weight: 600;
	margin: 0 0 8px;
}
.as-cvs-block {
	background: var(--as-cvs-surface);
	border: 1px solid var(--as-cvs-line-fort);
	border-radius: var(--as-radius);
	padding: 26px;
	margin: 0 0 26px;
}
/* Marquage visuel entre chapitres : un filet dégradé en tête de chaque bloc.
 * Sans lui, la page défile comme un seul long aplat de texte. */
.as-cvs-block > .as-chapter::before,
.as-cvs-block > h2.as-cvs-h2::before {
	content: '';
	display: block;
	width: 58px;
	height: 4px;
	border-radius: 3px;
	margin: 0 0 14px;
	background: linear-gradient(90deg, var(--as-cvs-a), var(--as-cvs-b));
}
.as-cvs-block p { color: var(--as-ink-2); font-size: 15px; line-height: 1.7; }
.as-cvs-block-intro { color: var(--as-ink-2); font-size: 14px; margin: -4px 0 18px; max-width: 940px; }
.as-cvs-empty { color: var(--as-muted); font-size: 14px; font-style: italic; }
.as-cvs-404 { padding: 60px 16px; text-align: center; }

/* ============================================================
 * HERO — la réponse dès le premier écran
 * ============================================================ */
.as-cvs-hero {
	position: relative;
	background:
		radial-gradient(900px 300px at 12% -10%, rgba(244, 185, 31, 0.12), transparent 60%),
		radial-gradient(900px 300px at 88% -10%, rgba(40, 165, 255, 0.11), transparent 60%),
		linear-gradient(160deg, var(--as-cvs-surface-2) 0%, var(--as-bg-2) 100%);
	border: 1px solid var(--as-cvs-line-fort);
	border-radius: var(--as-radius);
	padding: 28px 24px 24px;
	margin: 0 0 26px;
	overflow: hidden;
}
/* Bandeau bicolore : on annonce le match dès le premier pixel. */
.as-cvs-hero::before {
	content: '';
	position: absolute;
	inset: 0 0 auto 0;
	height: 4px;
	background: linear-gradient(90deg, var(--as-cvs-a) 0%, var(--as-cvs-a) 48%, var(--as-cvs-b) 52%, var(--as-cvs-b) 100%);
}

/* Le face-à-face */
.as-cvs-duel {
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	align-items: center;
	gap: 14px;
	margin: 4px 0 14px;
}
.as-cvs-duel-side {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 7px;
	text-align: center;
	background: var(--as-cvs-surface);
	border: 1px solid var(--as-line);
	border-radius: var(--as-radius-sm);
	padding: 18px 14px;
}
.as-cvs-side-a { border-color: var(--as-cvs-a-line); box-shadow: inset 0 0 0 1px rgba(244, 185, 31, 0.10); }
.as-cvs-side-b { border-color: var(--as-cvs-b-line); box-shadow: inset 0 0 0 1px rgba(40, 165, 255, 0.10); }
/* Le nom de chaque camp EST une liste déroulante : on rejoue le duel avec une
 * autre plateforme sans repasser par le hub. Elle doit se lire comme le nom
 * qu'elle remplace — même police, même taille, même graisse —, d'où ce bloc
 * PARTAGÉ avec `.as-cvs-duel-nom` (le repli sans liste, cf.
 * as_cvs_duel_selecteur()) : dissocier les deux les laisserait diverger et
 * l'un des deux camps s'afficherait dans une autre taille que l'autre. */
.as-cvs-duel-nom,
.as-cvs-duel-select {
	font-family: var(--as-font-head);
	font-size: clamp(15px, 2.2vw, 19px);
	font-weight: 700;
	text-decoration: none;
	color: var(--as-ink) !important;
}
.as-cvs-duel-nom:hover { color: var(--as-accent) !important; }
.as-cvs-duel-pick { position: relative; display: inline-flex; align-items: center; max-width: 100%; min-width: 0; }
.as-cvs-duel-select {
	appearance: none;
	-webkit-appearance: none;
	max-width: 100%;
	margin: 0;
	padding: 4px 28px 4px 12px;
	line-height: 1.3;
	text-align: center;
	text-overflow: ellipsis;
	background: var(--as-card-2);
	border: 1px solid var(--as-line-2);
	border-radius: var(--as-radius-pill);
	cursor: pointer;
	transition: border-color .15s ease, background .15s ease;
}
.as-cvs-duel-select:hover { background: var(--as-cvs-surface-2); }
.as-cvs-duel-select:focus-visible { outline: 2px solid var(--as-accent); outline-offset: 2px; }
.as-cvs-side-a .as-cvs-duel-select { border-color: var(--as-cvs-a-line); }
.as-cvs-side-b .as-cvs-duel-select { border-color: var(--as-cvs-b-line); }
/* Le temps que la page du nouveau duel arrive (tableau + courbes), la liste dit
 * que le clic a été pris en compte — sans ça, l'attente se lit comme un bug. */
.as-cvs-duel-select[data-cvs-loading] { opacity: .55; cursor: progress; }
/* Le menu natif hérite du fond sombre du select : sans couleurs explicites sur
 * les <option>, le texte sortirait sombre sur sombre (même correctif que
 * `.as-eval-select` du socle). La police de titre, elle, reste au contrôle
 * fermé : sur une liste de ~40 plateformes elle serait illisible. */
.as-cvs-duel-select option {
	background-color: #161f33;
	color: #e8edf7;
	font-family: var(--as-font-body);
	font-weight: 600;
}
.as-cvs-duel-pick-ico {
	position: absolute;
	right: 11px;
	font-size: 11px;
	line-height: 1;
	color: var(--as-muted);
	pointer-events: none;
}
/* Repli sans JavaScript : la liste est alors inerte, ce lien remet le chemin de
 * la fiche que portait le nom avant qu'il ne devienne un sélecteur. */
.as-cvs-duel-lien { font-size: 12.5px; font-weight: 600; }
/* Score du duel : un bloc à part, pour que le chiffre et sa légende restent
 * solidaires quelle que soit la largeur de la carte. Le nombre est centré et
 * dominant — c'est la réponse que le lecteur vient chercher —, le libellé tient
 * dessous en petit. Les deux ne sont jamais posés côte à côte : le nombre y
 * serait plafonné par la hauteur de ligne du texte qui l'accompagne. */
.as-cvs-duel-scorebox {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	margin-top: 2px;
}
.as-cvs-duel-score {
	font-family: var(--as-font-head);
	font-size: 38px;
	font-weight: 700;
	line-height: 1;
}
.as-cvs-side-a .as-cvs-duel-score { color: var(--as-cvs-a); }
.as-cvs-side-b .as-cvs-duel-score { color: var(--as-cvs-b); }
.as-cvs-side-a .as-cvs-duel-nom:hover { color: var(--as-cvs-a) !important; }
.as-cvs-side-b .as-cvs-duel-nom:hover { color: var(--as-cvs-b) !important; }
.as-cvs-duel-score-lbl { font-size: 11px; color: var(--as-muted); text-transform: uppercase; letter-spacing: .05em; margin-top: 4px; }
/* L'offre appartient visuellement à sa carte : séparée par un filet, pleine
 * largeur, avec une hauteur réservée même sans offre pour que les deux cartes
 * restent alignées. */
.as-cvs-duel-offre {
	width: 100%;
	margin-top: 12px;
	padding-top: 12px;
	border-top: 1px dashed var(--as-line-2);
	display: flex;
	justify-content: center;
	min-height: 46px;
	align-items: center;
}
.as-cvs-duel-offre .as-cvs-offre-btn { max-width: 100%; }
.as-cvs-offre-vide { font-size: 12px; color: var(--as-muted); font-style: italic; }
.as-cvs-duel-vs {
	font-family: var(--as-font-head);
	font-size: 15px;
	font-weight: 700;
	letter-spacing: .1em;
	color: var(--as-muted);
	background: var(--as-card-2);
	border: 1px solid var(--as-line-2);
	border-radius: var(--as-radius-pill);
	padding: 8px 12px;
}

/* Logos */
.as-cvs-logo {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 54px;
	height: 54px;
	border-radius: 12px;
	background: #fff;
	overflow: hidden;
	flex: 0 0 auto;
}
.as-cvs-logo img { max-width: 88%; max-height: 88%; object-fit: contain; display: block; }
.as-cvs-logo-sm { width: 42px; height: 42px; border-radius: 10px; }
.as-cvs-logo-fb {
	font-family: var(--as-font-head);
	font-weight: 700;
	font-size: 15px;
	color: #1a2438;
	text-transform: uppercase;
}

/* Barre de score */
.as-cvs-scorebar {
	display: flex;
	height: 12px;
	border-radius: var(--as-radius-pill);
	overflow: hidden;
	background: var(--as-card-2);
	border: 1px solid var(--as-line);
	margin: 0 0 14px;
}
.as-cvs-scorebar-a { background: var(--as-cvs-a); flex: 0 0 auto; }
.as-cvs-scorebar-b { background: var(--as-cvs-b); flex: 0 0 auto; margin-left: auto; }
.as-cvs-scorebar-nul { flex: 1 1 auto; min-width: 0; } /* Les ex æquo, en creux entre les deux barres. */

.as-cvs-verdict {
	font-size: 15.5px;
	color: var(--as-ink-2);
	margin: 0 0 16px;
	max-width: 980px;
}
.as-cvs-verdict strong { color: var(--as-ink); }

.as-cvs-hero-actions { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }

/* Bouton d'offre d'une plateforme (lien partenaire). Il porte TOUJOURS le nom de
 * la plateforme : ces boutons vont par paire sur la page, et rien ne doit
 * laisser croire que l'offre de l'une vaut pour l'autre. */
.as-cvs-offre-btn {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	font-family: var(--as-font-body);
	color: #1a1405 !important;
	background: linear-gradient(100deg, #f4d089, var(--as-cvs-gold));
	border: 1px solid rgba(240, 196, 106, 0.6);
	border-radius: var(--as-radius-pill);
	padding: 8px 16px;
	text-decoration: none;
	transition: filter .15s ease, transform .15s ease;
	max-width: 100%;
	text-align: left;
}
.as-cvs-offre-btn:hover { filter: brightness(1.08); transform: translateY(-1px); color: #1a1405 !important; }
.as-cvs-offre-ico { flex: 0 0 auto; font-size: 15px; line-height: 1; }
.as-cvs-offre-txt { display: flex; flex-direction: column; min-width: 0; }
.as-cvs-offre-nom { font-size: 12.5px; font-weight: 700; line-height: 1.25; white-space: nowrap; }
.as-cvs-offre-montant {
	font-style: normal;
	font-size: 11.5px;
	font-weight: 500;
	line-height: 1.3;
	opacity: .85;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* ============================================================
 * SYNTHÈSE — l'essentiel en un coup d'œil
 * ============================================================ */
.as-cvs-synthese {
	background: var(--as-cvs-surface);
	border: 1px solid var(--as-cvs-line-fort);
	border-radius: var(--as-radius);
	padding: 20px 22px;
	margin: 0 0 26px;
}
.as-cvs-synthese-title {
	font-family: var(--as-font-head);
	font-size: 14px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .08em;
	color: var(--as-muted);
	margin: 0 0 14px;
}
.as-cvs-synthese-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
	gap: 12px;
}
.as-cvs-tuile {
	background: var(--as-cvs-surface-2);
	border: 1px solid var(--as-line-2);
	border-radius: var(--as-radius-sm);
	padding: 14px 15px;
}
.as-cvs-tuile-lbl { display: block; font-size: 11.5px; text-transform: uppercase; letter-spacing: .06em; color: var(--as-muted); font-weight: 600; margin-bottom: 9px; }
.as-cvs-tuile-duo { display: flex; flex-direction: column; gap: 6px; }
.as-cvs-tuile-val {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 10px;
	padding: 4px 8px;
	border-radius: 8px;
	border-left: 3px solid transparent;
}
.as-cvs-tuile-val em { font-style: normal; font-size: 12.5px; color: var(--as-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.as-cvs-tuile-val strong { font-family: var(--as-font-head); font-size: 15px; color: var(--as-ink-2); white-space: nowrap; }
.as-cvs-tuile-val:first-child { border-left-color: var(--as-cvs-a); }
.as-cvs-tuile-val:last-child { border-left-color: var(--as-cvs-b); }
.as-cvs-tuile-val:first-child.is-win { background: var(--as-cvs-a-bg); }
.as-cvs-tuile-val:first-child.is-win strong,
.as-cvs-tuile-val:first-child.is-win em { color: var(--as-cvs-a); }
.as-cvs-tuile-val:last-child.is-win { background: var(--as-cvs-b-bg); }
.as-cvs-tuile-val:last-child.is-win strong,
.as-cvs-tuile-val:last-child.is-win em { color: var(--as-cvs-b); }

/* ============================================================
 * SOMMAIRE — barre d'ancres « sticky »
 *
 * MÊME COMPOSANT que la nav des fiches Tests & Avis (`.as-avis-nav`) : cadre
 * léger, pastilles discrètes, et pastille accentuée sur la section en cours de
 * lecture (`is-active`, posée par le scroll-spy d'as-classement-versus.js).
 * L'internaute qui passe d'un avis à un duel retrouve la même barre au même
 * endroit — c'est le but, ne pas la redécorer ici.
 *
 * La MÉCANIQUE du collage (position, décalage sous le header fixe de Divi via
 * --as-sticky-top, fond translucide, flou) vient de la classe mutualisée
 * `.as-sticky-tabs` du socle, posée sur le <nav> à côté de celle-ci : rien
 * n'est réécrit ici, seul --as-sticky-bg est teinté sur `.as-cvs-wrap` pour
 * coller au fond de la page.
 * ============================================================ */
.as-cvs-sommaire {
	display: flex;
	gap: 6px;
	flex-wrap: wrap;
	padding: 9px 10px;
	border: 1px solid var(--as-line);
	border-radius: var(--as-radius-sm);
	margin: 0 0 18px;
}
.as-cvs-sommaire a {
	font-size: 12.5px;
	font-weight: 600;
	color: var(--as-muted) !important;
	text-decoration: none;
	padding: 6px 12px;
	border-radius: var(--as-radius-pill);
	border: 1px solid transparent;
	transition: all .15s ease;
}
.as-cvs-sommaire a:hover { color: var(--as-ink) !important; border-color: var(--as-line-2); }
.as-cvs-sommaire a.is-active { color: var(--as-ink) !important; background: var(--as-accent-bg); border-color: var(--as-accent); }

/* ============================================================
 * ÉCARTS — l'analyse textuelle
 * ============================================================ */
.as-cvs-ecarts { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.as-cvs-ecart {
	background: var(--as-cvs-surface);
	border: 1px solid var(--as-cvs-line-fort);
	border-left: 4px solid var(--as-line-2);
	border-radius: var(--as-radius-sm);
	padding: 16px 18px;
	font-size: 15px;
	line-height: 1.65;
	color: var(--as-ink-2);
}
.as-cvs-ecart.is-win-a { border-left-color: var(--as-cvs-a); background: linear-gradient(90deg, var(--as-cvs-a-bg), transparent 40%), var(--as-cvs-surface); }
.as-cvs-ecart.is-win-b { border-left-color: var(--as-cvs-b); background: linear-gradient(90deg, var(--as-cvs-b-bg), transparent 40%), var(--as-cvs-surface); }
.as-cvs-ecart strong { color: var(--as-ink); }
.as-cvs-ecart em { font-style: normal; font-weight: 700; color: var(--as-ink); }

.as-cvs-callout {
	display: flex;
	gap: 12px;
	align-items: flex-start;
	background: rgba(240, 196, 106, 0.08);
	border: 1px solid rgba(240, 196, 106, 0.35);
	border-radius: var(--as-radius-sm);
	padding: 14px 16px;
	margin: 16px 0 0;
	font-size: 14px;
	color: var(--as-ink-2);
}
.as-cvs-callout-ico { flex: 0 0 auto; font-size: 17px; line-height: 1.3; }

/* ============================================================
 * TABLEAU COMPARATIF
 * ============================================================ */
/* ---------- Une famille de critères = une MANCHE du match ----------
 * Chaque groupe est une carte à part entière, avec son propre fond, son liseré
 * de vainqueur et son tableau de score en tête. C'est ce qui découpe la page :
 * avant, les familles s'enchaînaient dans un aplat continu et le score se
 * lisait en petit à droite du titre. */
.as-cvs-groupe {
	position: relative;
	background: var(--as-bg-2);
	border: 1px solid var(--as-cvs-line-fort);
	border-radius: var(--as-radius);
	padding: 20px;
	margin: 0 0 22px;
	overflow: hidden;
}
.as-cvs-groupe:last-child { margin-bottom: 0; }
/* Liseré latéral aux couleurs du vainqueur de la manche. */
.as-cvs-groupe::before {
	content: '';
	position: absolute;
	inset: 0 auto 0 0;
	width: 4px;
	background: var(--as-line-2);
}
.as-cvs-groupe--duel.is-win-a::before { background: var(--as-cvs-a); }
.as-cvs-groupe--duel.is-win-b::before { background: var(--as-cvs-b); }
.as-cvs-groupe--duel.is-win-nul::before { background: linear-gradient(180deg, var(--as-cvs-a), var(--as-cvs-b)); }

.as-cvs-manche {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	padding: 0 0 14px;
	margin: 0 0 14px;
	border-bottom: 1px solid var(--as-line);
}
.as-cvs-manche-id { min-width: 0; }
.as-cvs-manche-num {
	display: inline-block;
	font-family: var(--as-font-head);
	font-size: 10.5px;
	font-weight: 700;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--as-cvs-a);
	background: var(--as-cvs-a-bg);
	border-radius: var(--as-radius-pill);
	padding: 3px 11px;
	margin: 0 0 7px;
}
.as-cvs-groupe--repere .as-cvs-manche-num { color: var(--as-muted); background: var(--as-card-2); }
.as-cvs-manche .as-cvs-h3 { font-size: clamp(16px, 2.2vw, 20px); font-weight: 700; color: #fff; margin: 0; }
.as-cvs-manche-neutre { font-size: 12px; font-style: italic; color: var(--as-muted); }

/* Le tableau de score : gros, lisible, aux couleurs des deux plateformes. */
.as-cvs-sb {
	display: flex;
	align-items: center;
	gap: 12px;
	background: var(--as-cvs-surface-2);
	border: 1px solid var(--as-line-2);
	border-radius: var(--as-radius-pill);
	padding: 8px 16px;
	flex: 0 0 auto;
}
.as-cvs-sb-side { display: inline-flex; align-items: center; gap: 9px; min-width: 0; }
.as-cvs-sb-nom {
	font-size: 12.5px;
	font-weight: 600;
	color: var(--as-muted);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	max-width: 190px;
}
.as-cvs-sb-pts {
	font-family: var(--as-font-head);
	font-size: 24px;
	font-weight: 700;
	line-height: 1;
	color: var(--as-muted);
}
.as-cvs-sb-a .as-cvs-sb-pts { color: var(--as-cvs-a); }
.as-cvs-sb-b .as-cvs-sb-pts { color: var(--as-cvs-b); }
.as-cvs-sb-side.is-lead .as-cvs-sb-nom { color: var(--as-ink); }
.as-cvs-sb-a.is-lead .as-cvs-sb-nom { color: var(--as-cvs-a); }
.as-cvs-sb-b.is-lead .as-cvs-sb-nom { color: var(--as-cvs-b); }
.as-cvs-sb-sep { font-family: var(--as-font-head); font-size: 17px; color: var(--as-line-2); }

.as-cvs-groupe-intro { color: var(--as-ink-2); font-size: 14px; margin: 0 0 12px; max-width: 940px; }
.as-cvs-groupe-note {
	font-size: 12.5px;
	color: var(--as-muted);
	background: var(--as-card-2);
	border-left: 3px solid var(--as-line-2);
	border-radius: 0 8px 8px 0;
	padding: 7px 12px;
	margin: 0 0 12px;
}

/* Le tableau doit défiler DANS son conteneur, jamais la page — et sur desktop
 * il ne doit pas défiler du tout : `table-layout: fixed` + le colgroup bornent
 * les colonnes, sans quoi une seule valeur longue (forme juridique rédigée,
 * condition d'offre) élargit sa colonne et pousse tout le reste hors écran. */
.as-cvs-table-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; border-radius: var(--as-radius-sm); border: 1px solid var(--as-line-2); }
.as-cvs-table { width: 100%; border-collapse: collapse; table-layout: fixed; min-width: 520px; background: var(--as-cvs-surface); }
.as-cvs-col-crit { width: 34%; }
.as-cvs-col-plat { width: 33%; }
.as-cvs-table-caption { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.as-cvs-table thead th {
	background: var(--as-cvs-surface-2);
	font-family: var(--as-font-head);
	font-size: 13.5px;
	font-weight: 700;
	color: var(--as-ink);
	text-align: left;
	padding: 13px 14px;
	border-bottom: 2px solid var(--as-line-2);
}
.as-cvs-th-plat { text-align: right !important; }
/* Les en-têtes portent la couleur d'équipe, avec un soulignement franc : c'est
 * le repère qui permet de lire n'importe quelle ligne sans remonter au titre. */
.as-cvs-table thead .as-cvs-th-plat:nth-child(2) { color: var(--as-cvs-a); box-shadow: inset 0 -3px 0 var(--as-cvs-a); }
.as-cvs-table thead .as-cvs-th-plat:nth-child(3) { color: var(--as-cvs-b); box-shadow: inset 0 -3px 0 var(--as-cvs-b); }
.as-cvs-table tbody tr { border-bottom: 1px solid var(--as-line); }
.as-cvs-table tbody tr:last-child { border-bottom: 0; }
/* Zébrure : indispensable sur des lignes hautes à deux colonnes de valeurs. */
.as-cvs-table tbody tr:nth-child(even) { background: rgba(255, 255, 255, 0.022); }
.as-cvs-table tbody tr:hover { background: rgba(244, 185, 31, 0.05); }

.as-cvs-crit {
	text-align: left;
	font-weight: 500;
	padding: 11px 14px;
	vertical-align: top;
	overflow-wrap: anywhere;
}
.as-cvs-crit-lbl { display: block; font-size: 14px; color: var(--as-ink); font-weight: 600; }
.as-cvs-info {
	position: relative; display: inline-grid; place-items: center; width: 18px; height: 18px;
	margin-left: 6px; border: 1px solid var(--as-line-2); border-radius: 50%; color: var(--as-muted);
	font-size: 11px; font-weight: 800; line-height: 1; cursor: help; vertical-align: 1px;
}
.as-cvs-info-bubble {
	position: absolute; z-index: 20; left: 50%; bottom: calc(100% + 9px); width: min(280px, 70vw);
	padding: 10px 12px; border: 1px solid var(--as-line-2); border-radius: 10px;
	background: #090d11; color: var(--as-ink-2); box-shadow: 0 12px 32px rgba(0,0,0,.45);
	font-size: 12px; font-weight: 400; line-height: 1.45; letter-spacing: 0;
	opacity: 0; visibility: hidden; transform: translate(-50%, 4px); pointer-events: none;
	transition: opacity .15s ease, transform .15s ease, visibility .15s ease;
}
.as-cvs-info:hover .as-cvs-info-bubble,
.as-cvs-info:focus .as-cvs-info-bubble,
.as-cvs-info:focus-visible .as-cvs-info-bubble { opacity: 1; visibility: visible; transform: translate(-50%, 0); }
.as-cvs-crit-sens {
	display: inline-block;
	font-size: 10px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .05em;
	color: var(--as-muted);
	background: var(--as-card-2);
	border-radius: var(--as-radius-pill);
	padding: 2px 8px;
	margin-top: 5px;
}

.as-cvs-cell {
	padding: 11px 14px;
	vertical-align: top;
	font-size: 14px;
	color: var(--as-ink-2);
}
/* Valeurs chiffrées : alignées à droite, jamais coupées (« 8,67 % » sur deux
 * lignes serait illisible). */
.as-cvs-cell--num { text-align: right; white-space: nowrap; }
/* Valeurs texte : la base y stocke parfois de vraies phrases (forme juridique,
 * condition d'offre) — elles reviennent à la ligne et s'alignent à gauche. */
.as-cvs-cell--texte {
	text-align: left;
	white-space: normal;
	overflow-wrap: anywhere;
	font-size: 13.5px;
	line-height: 1.5;
}
.as-cvs-cell--texte .as-cvs-cell-val { font-family: var(--as-font-body); }
.as-cvs-cell-val { font-family: var(--as-font-head); font-size: 14px; }
/* Cellule gagnante : aux couleurs de SA plateforme, avec un liseré latéral.
 * Plus aucun vert ici — il désignait « gagnant » ET « Bricks.co ». */
.as-cvs-cell.is-win { font-weight: 700; }
.as-cvs-cell.is-win-a { color: var(--as-cvs-a); background: var(--as-cvs-a-bg); box-shadow: inset 3px 0 0 var(--as-cvs-a); }
.as-cvs-cell.is-win-b { color: var(--as-cvs-b); background: var(--as-cvs-b-bg); box-shadow: inset 3px 0 0 var(--as-cvs-b); }
.as-cvs-cell.is-lose { color: var(--as-muted); }
.as-cvs-cell.is-nd { color: var(--as-muted); font-style: italic; font-weight: 400; }
.as-cvs-win-flag { display: inline-block; margin-left: 6px; font-size: 12px; }
.as-cvs-cell.is-win-a .as-cvs-win-flag { color: var(--as-cvs-a); }
.as-cvs-cell.is-win-b .as-cvs-win-flag { color: var(--as-cvs-b); }
/* Ex æquo PAR LE HAUT : les deux cellules sont gagnantes — un liseré plus
 * discret les distingue d'une victoire franche. */
.as-cvs-tr.is-exaequo .as-cvs-cell.is-win-a { box-shadow: inset 3px 0 0 var(--as-cvs-a-line); }
.as-cvs-tr.is-exaequo .as-cvs-cell.is-win-b { box-shadow: inset 3px 0 0 var(--as-cvs-b-line); }

/* Égalité PAR LE BAS : aucune des deux ne propose ce que le critère mesure.
 * Ni coche, ni couleur d'équipe, ni marquage « perdant » — la ligne s'efface,
 * ce qui est exactement l'information : il n'y a rien à départager ici. */
.as-cvs-tr.is-sans-point { opacity: .82; }
.as-cvs-cell.is-sans-point { color: var(--as-muted); font-weight: 500; }
.as-cvs-nopoint-flag { display: inline-block; margin-left: 6px; font-size: 12px; color: var(--as-line-2); }

/* POINT DE TRANSPARENCE : une seule des deux publie la donnée.
 * La cellule gagnante garde la couleur de son équipe — c'est bien elle qui
 * marque — mais son liseré est pointillé et sa coche devient un œil : le point
 * n'a pas été gagné sur un chiffre, il a été gagné sur la publication. En face,
 * la cellule vide ne dit pas « — » tout court : un micro-badge « non publié »
 * explique où est parti le point, sans quoi le lecteur croirait à un bug. */
.as-cvs-cell.is-win-transparence { box-shadow: none; border-left: 3px dashed currentColor; }
.as-cvs-cell.is-win-transparence .as-cvs-win-flag { font-size: 11.5px; opacity: .9; }
.as-cvs-cell.is-non-publie { color: var(--as-muted); }
.as-cvs-nopub-flag {
	display: inline-block;
	margin-left: 6px;
	padding: 1px 7px;
	border: 1px dashed var(--as-line-2);
	border-radius: var(--as-radius-pill);
	font-family: var(--as-font-head);
	font-size: 9.5px;
	font-weight: 600;
	font-style: normal;
	text-transform: uppercase;
	letter-spacing: .05em;
	white-space: nowrap;
	color: var(--as-muted);
	vertical-align: middle;
}

/* ============================================================
 * COURBES
 * ============================================================ */
.as-cvs-tabs { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 12px; }
.as-cvs-legend { display: flex; flex-wrap: wrap; gap: 16px; margin: 0 0 10px; }
.as-cvs-legend-item { display: inline-flex; align-items: center; gap: 7px; font-size: 12.5px; font-weight: 600; color: var(--as-ink-2); }
.as-cvs-legend-item::before { content: ''; width: 14px; height: 3px; border-radius: 2px; display: inline-block; }
.as-cvs-legend-a::before { background: var(--as-cvs-a); }
.as-cvs-legend-b::before { background: var(--as-cvs-b); }
.as-cvs-legend-a { color: var(--as-cvs-a); }
.as-cvs-legend-b { color: var(--as-cvs-b); }

.as-cvs-pane { display: none; }
.as-cvs-pane.is-active { display: block; }
.as-cvs-chart-box {
	position: relative;
	height: 340px;
	background: var(--as-bg-2);
	border: 1px solid var(--as-line);
	border-radius: var(--as-radius-sm);
	padding: 12px;
}
.as-cvs-chart-radar { height: 400px; }
.as-cvs-chart-box canvas { max-width: 100%; }

/* ============================================================
 * PORTRAITS
 * ============================================================ */
.as-cvs-portraits { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 16px; }
.as-cvs-portrait {
	background: var(--as-cvs-surface);
	border: 1px solid var(--as-cvs-line-fort);
	border-top: 4px solid var(--as-line-2);
	border-radius: var(--as-radius-sm);
	padding: 18px;
}
.as-cvs-portrait-a { border-top-color: var(--as-cvs-a); }
.as-cvs-portrait-b { border-top-color: var(--as-cvs-b); }
.as-cvs-portrait-a .as-cvs-h3 a { color: var(--as-cvs-a); }
.as-cvs-portrait-b .as-cvs-h3 a { color: var(--as-cvs-b); }
.as-cvs-portrait-head { display: flex; align-items: center; gap: 12px; margin: 0 0 14px; }
.as-cvs-portrait-txt { font-size: 14px; color: var(--as-ink-2); }
.as-cvs-portrait-txt p { margin: 0 0 10px; }
.as-cvs-pf-body { font-size: 13.5px; color: var(--as-ink-2); }
.as-cvs-pf-body ul, .as-cvs-pf-body ol { margin: 0; padding-left: 20px; }
.as-cvs-pf-body li { margin-bottom: 5px; }
.as-cvs-pf-plus li::marker { color: var(--as-pos); }
.as-cvs-pf-moins li::marker { color: var(--as-neg); }
/* Bloc points forts / vigilance mutualisé (AS Core) : dans un portrait, les deux
 * cartes s'empilent — la colonne est déjà étroite. Le reste (puces ✓ / ⚠,
 * couleurs, titres) vient d'as-core.css et n'est PAS redéfini ici. */
.as-cvs-proscons { grid-template-columns: 1fr; margin-top: 14px; }
.as-cvs-portrait-liens { list-style: none; margin: 16px 0 0; padding: 14px 0 0; border-top: 1px solid var(--as-line); display: flex; flex-direction: column; gap: 6px; }
.as-cvs-portrait-liens a { font-size: 13px; font-weight: 600; text-decoration: none; }
.as-cvs-portrait-liens a:hover { text-decoration: underline; }

/* ============================================================
 * PROFILS
 * ============================================================ */
.as-cvs-profils { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 16px; }
.as-cvs-profil {
	background: var(--as-cvs-surface);
	border: 1px solid var(--as-cvs-line-fort);
	border-left: 4px solid var(--as-line-2);
	border-radius: var(--as-radius-sm);
	padding: 18px;
}
.as-cvs-profil-a { border-left-color: var(--as-cvs-a); }
.as-cvs-profil-b { border-left-color: var(--as-cvs-b); }
.as-cvs-profil-a .as-cvs-h3 { color: var(--as-cvs-a); }
.as-cvs-profil-b .as-cvs-h3 { color: var(--as-cvs-b); }
.as-cvs-profil-list { list-style: none; margin: 0 0 14px; padding: 0; display: flex; flex-direction: column; gap: 9px; }
.as-cvs-profil-list li {
	position: relative;
	padding-left: 22px;
	font-size: 14px;
	color: var(--as-ink-2);
}
.as-cvs-profil-list li::before {
	content: '➤';
	position: absolute;
	left: 0;
	top: 0;
	color: var(--as-cvs-gold);
	font-size: 11px;
	line-height: 1.7;
}
.as-cvs-profil-list strong { color: var(--as-ink); }

/* ============================================================
 * OFFRES
 * ============================================================ */
.as-cvs-offres-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 16px; }
.as-cvs-offres-grid .as-partner-offer { margin: 0; height: 100%; }
.as-cvs-offres-note {
	font-size: 13px;
	color: var(--as-muted);
	margin: 16px 0 0;
	padding-top: 14px;
	border-top: 1px solid var(--as-line);
}

/* ============================================================
 * MÉTHODE
 * ============================================================ */
.as-cvs-methode-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.as-cvs-methode-list li {
	background: var(--as-bg-2);
	border: 1px solid var(--as-line);
	border-radius: var(--as-radius-sm);
	padding: 13px 15px;
	font-size: 14px;
	color: var(--as-ink-2);
}
.as-cvs-methode-list strong { color: var(--as-ink); }

/* ============================================================
 * AUTRES DUELS (maillage)
 * ============================================================ */
.as-cvs-duels-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 18px; }
.as-cvs-duels-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.as-cvs-duels-list li {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	background: var(--as-bg-2);
	border: 1px solid var(--as-line);
	border-radius: var(--as-radius-sm);
	padding: 9px 13px;
	transition: border-color .15s ease;
}
.as-cvs-duels-list li:hover { border-color: var(--as-accent); }
.as-cvs-duels-list a { font-size: 13.5px; font-weight: 600; text-decoration: none; color: var(--as-ink-2) !important; }
.as-cvs-duels-list a:hover { color: var(--as-ink) !important; }
.as-cvs-duels-list a strong { color: var(--as-accent); }
.as-cvs-duels-more { margin: 18px 0 0; }

/* ============================================================
 * PIED DE PAGE
 * ============================================================ */
.as-cvs-footer { margin-top: 8px; }
.as-cvs-risque, .as-cvs-sources { margin-bottom: 12px; }

/* ============================================================
 * MODULE MUTUALISÉ « duels » (pages hôtes — .as-cvs-embed)
 * Racine allégée : elle expose le nécessaire sans le fond de page.
 * ============================================================ */
.as-cvs-embed { font-family: var(--as-font-body); color: var(--as-ink); }
.as-cvs-embed .as-cvs-embed-title { font-family: var(--as-font-head); font-size: 17px; font-weight: 600; margin: 0 0 6px; color: var(--as-ink); }
.as-cvs-embed .as-cvs-embed-hint { font-size: 13.5px; color: var(--as-muted); margin: 0 0 14px; max-width: 900px; }
.as-cvs-embed-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 10px; }
.as-cvs-embed-card {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	background: var(--as-card);
	border: 1px solid var(--as-line);
	border-radius: var(--as-radius-sm);
	padding: 11px 14px;
	text-decoration: none;
	transition: border-color .15s ease, transform .15s ease;
}
.as-cvs-embed-card:hover { border-color: var(--as-accent); transform: translateY(-1px); }
.as-cvs-embed-duel { font-size: 13.5px; font-weight: 600; color: var(--as-ink-2); }
.as-cvs-embed-duel .as-cvs-embed-vs { color: var(--as-muted); font-size: 11.5px; padding: 0 5px; font-family: var(--as-font-head); }
.as-cvs-embed-go { color: var(--as-accent); font-size: 15px; flex: 0 0 auto; }

/* ============================================================
 * RESPONSIVE
 * ============================================================ */
@media (max-width: 860px) {
	.as-cvs-wrap { padding: 10px 12px 24px; border-radius: 0; }
	.as-cvs-manche { flex-direction: column; align-items: flex-start; }
	.as-cvs-sb { width: 100%; justify-content: space-between; }
	.as-cvs-sb-nom { max-width: 34vw; }
	.as-cvs-groupe { padding: 16px 14px; }
	.as-cvs-hero { padding: 20px 16px 18px; }
	.as-cvs-block, .as-cvs-synthese { padding: 16px 14px; }
	.as-cvs-chart-box { height: 300px; }
	.as-cvs-chart-radar { height: 340px; }
}
@media (max-width: 620px) {
	.as-cvs-duel { grid-template-columns: 1fr; gap: 8px; }
	.as-cvs-duel-vs { justify-self: center; padding: 4px 14px; }
	.as-cvs-duel-side { flex-direction: row; justify-content: flex-start; text-align: left; padding: 12px; }
	/* Carte en ligne : la liste des plateformes s'aligne à gauche comme le
	 * reste et accepte de rétrécir (un nom long ne doit pas pousser le score
	 * hors de la carte). */
	.as-cvs-duel-pick { flex: 0 1 auto; }
	.as-cvs-duel-select { text-align: left; padding: 4px 26px 4px 10px; }
	.as-cvs-duel-scorebox { margin-left: auto; }
	.as-cvs-col-crit { width: 38%; }
	.as-cvs-col-plat { width: 31%; }
	.as-cvs-crit { padding: 10px 10px; }
	.as-cvs-cell { padding: 10px 10px; }
	.as-cvs-cell--texte { font-size: 13px; }
	.as-cvs-hero-actions .as-btn-premium { width: 100%; justify-content: center; }
}

/* ============================================================
 * COLONNE DE DROITE — adaptations de la colonne étroite
 *
 * Avec la colonne de widgets, le contenu ne dispose plus de ~1150 px mais au
 * mieux de ~930 px, et de 500 à 700 px seulement quand la fenêtre approche du
 * point de bascule du socle (880 px, où la grille repasse en une colonne et où
 * les règles responsives ci-dessus reprennent la main).
 *
 * Les media queries portent donc sur la FENÊTRE alors que la contrainte réelle
 * est la largeur de la COLONNE : c'est le prix à payer, le socle n'exposant pas
 * de conteneur requêtable (`@container`) et aucune page de l'écosystème n'en
 * utilisant. Les bornes sont dérivées de la grille du socle : 881 px = juste
 * au-dessus de sa bascule, 1180 px = largeur au-delà de laquelle la colonne de
 * contenu est assez large pour la présentation de référence.
 * ============================================================ */
@media (min-width: 881px) and (max-width: 1180px) {
	.as-page--with-aside .as-cvs-manche { flex-direction: column; align-items: flex-start; }
	.as-page--with-aside .as-cvs-sb { width: 100%; justify-content: space-between; }
	.as-page--with-aside .as-cvs-groupe { padding: 16px 14px; }
	.as-page--with-aside .as-cvs-hero { padding: 20px 16px 18px; }
	.as-page--with-aside .as-cvs-block,
	.as-page--with-aside .as-cvs-synthese { padding: 16px 14px; }
	.as-page--with-aside .as-cvs-chart-box { height: 300px; }
	.as-page--with-aside .as-cvs-chart-radar { height: 340px; }
}
/* Sous ~1000 px de fenêtre, la colonne tombe vers 600 px : le face-à-face à
 * trois colonnes (carte A · VS · carte B) s'empile, chaque carte gardant sa
 * présentation centrée — logo, nom, catégorie, score, offre — au lieu d'écraser
 * les deux côtés sur une demi-largeur. */
@media (min-width: 881px) and (max-width: 1000px) {
	.as-page--with-aside .as-cvs-duel { grid-template-columns: 1fr; gap: 10px; }
	.as-page--with-aside .as-cvs-duel-vs { justify-self: center; padding: 4px 14px; }
}

/* ============================================================
 * CHARTE 2026 — composition éditoriale de la maquette
 * Remplace le langage « dashboard » historique. Le module de courbes n'est
 * volontairement pas ciblé : ses boutons et graphiques restent inchangés.
 * ============================================================ */
.as-cvs-wrap{max-width:1080px;padding:0 22px 52px;border-radius:0;background:var(--as-bg)}
.as-cvs-hero{padding:52px 0 32px;margin:0;border:0;border-radius:0;background:transparent;overflow:visible}.as-cvs-hero::before{display:none}
.as-cvs-kicker{margin-bottom:12px;color:var(--as-cvs-a);font-size:11px;font-weight:850;letter-spacing:.13em}
.as-cvs-h1{max-width:830px;margin-bottom:14px;font-size:clamp(34px,5.2vw,58px);font-weight:850;line-height:1.02;background:none;-webkit-text-fill-color:currentColor;color:var(--as-ink)}
.as-cvs-lead{max-width:760px;margin:0 0 34px;font-size:16px;line-height:1.65;color:#adb6bf}
.as-cvs-duel{grid-template-columns:minmax(0,1fr) 62px minmax(0,1fr);gap:14px;margin:0 0 20px}
.as-cvs-duel-side{position:relative;align-items:stretch;gap:8px;min-width:0;padding:22px;text-align:left;border:1px solid var(--as-line);border-radius:19px;background:linear-gradient(145deg,#151a20,#0e1216);box-shadow:none;overflow:hidden}
.as-cvs-duel-side::before{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(105deg,rgba(244,185,31,.08),transparent 40%)}.as-cvs-side-b::before{background:linear-gradient(255deg,rgba(40,165,255,.10),transparent 42%)}
.as-cvs-side-a,.as-cvs-side-b{border-color:var(--as-line);box-shadow:none}.as-cvs-duel-side>*{position:relative}.as-cvs-duel-side>.as-cvs-logo{display:none}
.as-cvs-duel-pick{display:flex;width:100%}.as-cvs-duel-select{width:100%;padding:12px 40px 12px 13px;text-align:left;font-size:18px;border-radius:11px;background:#090d11}.as-cvs-duel-pick-ico{right:15px;color:var(--as-cvs-a)}.as-cvs-side-b .as-cvs-duel-pick-ico{color:var(--as-cvs-b)}
.as-cvs-duel-side .as-tag{order:-1;align-self:flex-start;padding:0;background:none;color:var(--as-muted)}
/* Score du duel : le CHIFFRE est ce qu'on vient chercher, il est donc gros et
 * centré dans sa carte ; le libellé passe DESSOUS, petit et discret — posé à
 * droite du nombre il bornait sa taille et se lisait comme une légende d'axe. */
.as-cvs-duel-scorebox{margin:6px 0 0}.as-cvs-duel-score{font-size:clamp(40px,5.4vw,54px);line-height:.95}.as-cvs-duel-score-lbl{margin-top:5px;font-size:11.5px;text-transform:none;letter-spacing:0;color:var(--as-ink-2)}
.as-cvs-duel-vs{justify-self:center;padding:0;display:grid;place-items:center;width:52px;height:52px;border-radius:50%;background:#101419;font-size:12px}
.as-cvs-duel-offre{justify-content:stretch;min-height:0;margin-top:10px;padding-top:12px}.as-cvs-duel-offre .as-cvs-offre-btn{width:100%;justify-content:space-between;border-radius:10px;padding:9px 12px}.as-cvs-offre-txt{flex-direction:row;align-items:center;justify-content:space-between;width:100%;gap:8px}.as-cvs-offre-montant{font-size:17px;font-weight:850;opacity:1}
.as-cvs-scorebar{height:4px;margin:0;border:0;background:var(--as-card-2)}.as-cvs-verdict{max-width:none;margin:0 0 16px;padding:15px 17px;border-left:3px solid var(--as-cvs-a);border-radius:0 11px 11px 0;background:rgba(244,185,31,.055);font-size:13.5px;line-height:1.6}.as-cvs-hero-actions .as-btn-premium{min-height:36px;border-radius:10px}
.as-cvs-synthese{padding:0 0 36px;margin:0;border:0;border-radius:0;background:transparent}.as-cvs-synthese-title{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}.as-cvs-synthese-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.as-cvs-tuile{padding:15px;border-color:var(--as-line);border-radius:14px;background:var(--as-card)}.as-cvs-tuile-duo{flex-direction:row;justify-content:space-between;gap:8px}.as-cvs-tuile-val{display:block;padding:0;border:0!important;background:none!important}.as-cvs-tuile-val em{display:none}.as-cvs-tuile-val strong{font-size:14px}.as-cvs-tuile-val:last-child strong{color:#b6c5d1}
/* Le sommaire n'est plus repris ici : il suit désormais la présentation
 * mutualisée définie plus haut (celle de `.as-avis-nav`), et son collage vient
 * de `.as-sticky-tabs`. Le rhabiller en barre pleine largeur le ferait
 * diverger de la même barre servie sur les fiches Tests & Avis. */
.as-cvs-block{padding:40px 0;margin:0;border:0;border-radius:0;background:transparent}.as-cvs-block+.as-cvs-block{border-top:1px solid rgba(255,255,255,.045)}
.as-cvs-block>.as-chapter::before,.as-cvs-block>h2.as-cvs-h2::before{width:auto;height:auto;margin:0 0 7px;background:none;content:'À RETENIR';color:var(--as-cvs-a);font-size:10px;font-weight:850;letter-spacing:.13em}.as-cvs-h2{max-width:720px;margin-bottom:12px;font-size:clamp(25px,3.4vw,38px);line-height:1.08;letter-spacing:-.045em}.as-cvs-block-intro{max-width:780px;margin:0 0 24px;color:var(--as-muted);line-height:1.65}
.as-cvs-block>.as-chapter{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:start;column-gap:11px;row-gap:7px}.as-cvs-block>.as-chapter::before{grid-column:1/-1;margin-bottom:0}.as-cvs-block>.as-chapter .as-chapter-num{grid-column:1;align-self:start}.as-cvs-chapter-title{grid-column:2;min-width:0}
.as-cvs-ecarts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.as-cvs-ecart{min-height:112px;padding:18px;border:1px solid var(--as-line);border-radius:15px;background:var(--as-card)!important;font-size:14px;line-height:1.55}.as-cvs-callout{margin-top:14px;border-color:rgba(255,104,104,.22);background:rgba(255,104,104,.05)}
.as-cvs-groupe{padding:0;margin:0 0 18px;border-color:var(--as-line);border-radius:19px;background:radial-gradient(circle at 100% 0,rgba(40,165,255,.055),transparent 32%),#0d1115}.as-cvs-groupe::before{display:none}.as-cvs-manche{padding:22px 24px 18px;margin:0;border-bottom-color:var(--as-line)}.as-cvs-manche-num{padding:0;margin-bottom:5px;background:none;color:var(--as-cvs-a);font-size:10px}.as-cvs-manche .as-cvs-h3{font-size:21px;letter-spacing:-.035em}.as-cvs-sb{padding:9px 12px;border-radius:12px;background:var(--as-card-2)}.as-cvs-sb-nom{display:none}.as-cvs-sb-pts{font-size:20px}.as-cvs-groupe-intro{padding:14px 24px 0;margin-bottom:5px;color:var(--as-muted);font-size:13px}.as-cvs-groupe-note{margin:10px 24px;background:rgba(255,255,255,.025)}
.as-cvs-table-scroll{margin:8px 16px 18px;border:0;border-radius:0}.as-cvs-table{background:transparent}.as-cvs-table thead th{padding:11px 12px;border-bottom:1px solid var(--as-line);background:transparent;color:var(--as-muted);font-family:var(--as-font-body);font-size:10px;letter-spacing:.09em;text-transform:uppercase}.as-cvs-table thead .as-cvs-th-plat:nth-child(2),.as-cvs-table thead .as-cvs-th-plat:nth-child(3){color:var(--as-muted);box-shadow:none}.as-cvs-table tbody tr:nth-child(even),.as-cvs-table tbody tr:hover{background:transparent}.as-cvs-crit,.as-cvs-cell{padding:10px 12px;vertical-align:middle}.as-cvs-cell{border:1px solid #283039;border-radius:10px;background:var(--as-card-2);text-align:center}.as-cvs-cell.is-win-a{border-color:var(--as-cvs-a-line);background:var(--as-cvs-a-bg);box-shadow:none;color:var(--as-cvs-a)}.as-cvs-cell.is-win-b{border-color:var(--as-cvs-b-line);background:var(--as-cvs-b-bg);box-shadow:none;color:var(--as-cvs-b)}.as-cvs-cell--num,.as-cvs-cell--texte{text-align:center}
.as-cvs-portrait,.as-cvs-profil{padding:22px;border:1px solid var(--as-line);border-radius:17px;background:var(--as-card)}.as-cvs-portrait-a,.as-cvs-portrait-b,.as-cvs-profil-a,.as-cvs-profil-b{border-top:1px solid var(--as-line);border-left:1px solid var(--as-line)}.as-cvs-portrait-a .as-cvs-h3 a,.as-cvs-portrait-b .as-cvs-h3 a,.as-cvs-profil-a .as-cvs-h3,.as-cvs-profil-b .as-cvs-h3{color:var(--as-ink)}
.as-cvs-side-b .as-cvs-offre-btn{border-color:rgba(40,165,255,.30);background:rgba(40,165,255,.075);color:var(--as-ink)!important}.as-cvs-side-b .as-cvs-offre-montant{color:var(--as-cvs-b)}
.as-cvs-offre-btn{border-color:rgba(244,185,31,.38);background:rgba(244,185,31,.07);color:var(--as-ink)!important}.as-cvs-offre-btn:hover{border-color:rgba(244,185,31,.62);background:rgba(244,185,31,.12);color:var(--as-ink)!important}.as-cvs-offre-montant{color:var(--as-cvs-a)}
.as-cvs-side-b .as-cvs-offre-btn,.as-cvs-profil-b .as-cvs-offre-btn{border-color:rgba(40,165,255,.30);background:rgba(40,165,255,.075)}.as-cvs-side-b .as-cvs-offre-btn:hover,.as-cvs-profil-b .as-cvs-offre-btn:hover{border-color:rgba(40,165,255,.55);background:rgba(40,165,255,.12)}.as-cvs-side-b .as-cvs-offre-montant,.as-cvs-profil-b .as-cvs-offre-montant{color:var(--as-cvs-b)}
.as-cvs-tuile-duo{flex-direction:column;justify-content:flex-start}.as-cvs-tuile-val{display:flex;align-items:baseline;justify-content:space-between;gap:12px}.as-cvs-tuile-val em{display:block;min-width:0}.as-cvs-tuile-val:first-child em,.as-cvs-tuile-val:first-child strong{color:var(--as-cvs-a)!important}.as-cvs-tuile-val:last-child em,.as-cvs-tuile-val:last-child strong{color:var(--as-cvs-b)!important}
.as-cvs-ecart-head{display:flex;align-items:center;gap:10px;margin-bottom:12px}.as-cvs-ecart-ico{display:grid;place-items:center;flex:0 0 34px;width:34px;height:34px;border-radius:9px;background:rgba(244,185,31,.10);color:var(--as-cvs-a);font-weight:900}.as-cvs-ecart-avantage{color:var(--as-ink-2);font-size:12px;font-weight:700}.as-cvs-ecart.is-win-a .as-cvs-ecart-avantage strong{color:var(--as-cvs-a)}.as-cvs-ecart.is-win-b .as-cvs-ecart-ico{background:rgba(40,165,255,.10);color:var(--as-cvs-b)}.as-cvs-ecart.is-win-b .as-cvs-ecart-avantage strong{color:var(--as-cvs-b)}
.as-cvs-table{border-collapse:separate;border-spacing:8px 7px}.as-cvs-table-scroll{overflow:visible}.as-cvs-table tbody tr{border:0}.as-cvs-table thead th{border-bottom:0}
#as-cvs-tableau>.as-chapter::before{content:'COMPARATIF DÉTAILLÉ'}.as-cvs-block[id="as-cvs-courbes"]>.as-chapter::before{content:'HISTORIQUE'}.as-cvs-block[id="as-cvs-portraits"]>.as-chapter::before{content:'LES PLATEFORMES'}.as-cvs-block[id="as-cvs-profils"]>.as-chapter::before{content:'AIDE AU CHOIX'}.as-cvs-block[id="as-cvs-offres"]>.as-chapter::before{content:'OFFRES EN COURS'}
@media(max-width:760px){.as-cvs-wrap{padding-inline:14px}.as-cvs-hero{padding-top:36px}.as-cvs-h1{font-size:36px}.as-cvs-duel{grid-template-columns:1fr}.as-cvs-duel-vs{width:42px;height:42px}.as-cvs-synthese-grid,.as-cvs-ecarts{grid-template-columns:repeat(2,minmax(0,1fr))}.as-cvs-sommaire{overflow-x:auto;flex-wrap:nowrap}.as-cvs-sommaire a{white-space:nowrap}.as-cvs-table-scroll{overflow-x:auto}.as-cvs-table{border-spacing:5px}}
@media(max-width:480px){.as-cvs-synthese-grid,.as-cvs-ecarts{grid-template-columns:1fr}.as-cvs-block{padding-block:44px}.as-cvs-manche{align-items:flex-start}}

@media (min-width:881px) and (max-width:1180px) {
	.as-page--with-aside .as-cvs-hero { padding:42px 0 28px; }
	.as-page--with-aside .as-cvs-block { padding:36px 0; }
	.as-page--with-aside .as-cvs-synthese { padding:0 0 32px; }
	.as-page--with-aside .as-cvs-groupe { padding:0; }
	.as-page--with-aside .as-cvs-manche { padding:20px; }
}