/**
 * AS Home — styles de la page d'accueil (namespace .as-home-*).
 *
 * Dépend des tokens du socle (handle as-core-css : variables --as-*,
 * composants mutualisés .as-table, .as-tag, .as-evo, .as-btn-premium,
 * .as-sticky-tabs, .as-compare-deeper, .as-disclosure-*). Le gabarit
 * AS_Page en layout `full` laisse le body porter son conteneur centré :
 * c'est le rôle de .as-home-wrap (anticipé par as-core.css).
 */

/* ---------- Conteneur ---------- */
.as-home-wrap {
	max-width: 1260px;
	margin: 0 auto;
	padding: 26px 18px 60px;
	background: var(--as-bg);
	color: var(--as-ink);
	font-family: var(--as-font-body);
	border-radius: var(--as-radius);
}

.as-home-wrap a { color: var(--as-accent); }
.as-home-wrap a:hover { color: var(--as-accent-2); }

/* ---------- Sections ---------- */
.as-home-section { margin: 46px 0 0; }
.as-home-h2 {
	font-family: var(--as-font-head);
	font-size: 24px;
	font-weight: 700;
	color: var(--as-ink);
	margin: 0 0 10px;
	line-height: 1.25;
}
.as-home-h3 {
	font-family: var(--as-font-head);
	font-size: 16.5px;
	font-weight: 600;
	color: var(--as-ink);
	margin: 0 0 10px;
	line-height: 1.3;
}
.as-home-section-sub {
	color: var(--as-ink-2);
	font-size: 15px;
	line-height: 1.65;
	margin: 0 0 18px;
	max-width: 980px;
}
.as-home-na { color: var(--as-muted); }
.as-home-yr { color: var(--as-muted); font-size: 11px; margin-left: 4px; }

/* ---------- Hero ---------- */
.as-home-hero {
	background:
		radial-gradient(1200px 380px at 15% -10%, rgba(124, 141, 240, .16), transparent 60%),
		radial-gradient(900px 320px at 95% 0%, rgba(126, 166, 140, .08), transparent 55%),
		var(--as-bg-2);
	border: 1px solid var(--as-line);
	border-radius: var(--as-radius);
	padding: 30px 28px 18px;
}
.as-home-kicker {
	font-family: var(--as-font-head);
	font-size: 12px;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--as-accent);
	margin: 0 0 12px;
}
.as-home-h1 {
	font-family: var(--as-font-head);
	font-size: clamp(24px, 3.4vw, 36px);
	font-weight: 700;
	line-height: 1.22;
	color: var(--as-ink);
	margin: 0 0 14px;
}
.as-home-lead {
	font-size: 15.5px;
	line-height: 1.7;
	color: var(--as-ink-2);
	margin: 0 0 20px;
	max-width: 960px;
}
/* Bandeau A&S Racing (bas du hero) : ratio porté par width/height du HTML. */
.as-home-racing {
	display: block;
	margin: 18px 0 0;
	border: 1px solid var(--as-line);
	border-radius: var(--as-radius-sm);
	overflow: hidden;
	transition: border-color .15s ease, transform .1s ease;
}
.as-home-racing:hover { border-color: var(--as-accent); transform: translateY(-1px); }
.as-home-racing:focus-visible { outline: 2px solid var(--as-accent); outline-offset: 3px; }
.as-home-racing img { display: block; width: 100%; height: auto; }

.as-home-kpis {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
	gap: 12px;
	margin: 0 0 20px;
}
.as-home-kpi {
	background: rgba(14, 21, 37, .55);
	border: 1px solid var(--as-line);
	border-radius: var(--as-radius-sm);
	padding: 12px 14px;
}
.as-home-kpi-val {
	display: block;
	font-family: var(--as-font-head);
	font-size: 21px;
	font-weight: 700;
	color: #f8dfc4;
}
.as-home-kpi-lbl {
	display: block;
	font-size: 12px;
	color: var(--as-muted);
	margin-top: 3px;
	line-height: 1.35;
}

/* Navigation ancrée : apparence mutualisée par `.as-anchor-nav` (as-core.css),
 * mécanique collante par `.as-sticky-tabs`. Les pastilles portent une icône,
 * d'où le seul ajustement conservé ici. */
.as-home-chip { display: inline-flex; align-items: center; gap: 6px; }
.as-home-chip, .as-home-chip:hover { text-decoration: none !important; }

/* ---------- « La presse en parle » ----------
   Le mur de logos lui-même (.as-pg-presse-mur) est stylé par as-page.css,
   enfilé par le module mutualisé : on ne redéfinit ici que l'enveloppe. */
.as-home-presse { margin: 22px 0 0; text-align: center; }
.as-home-presse-kicker {
	margin: 0 0 12px;
	font-size: 11.5px;
	letter-spacing: .14em;
	text-transform: uppercase;
	font-weight: 600;
	color: var(--as-muted);
}
.as-home-presse-lien { margin: 4px 0 0; font-size: 12.8px; font-weight: 600; }

/* ---------- Encart fondateur (compact) ---------- */
.as-home-fondateur {
	display: flex;
	gap: 16px;
	align-items: flex-start;
	background: var(--as-card);
	border: 1px solid var(--as-line);
	border-radius: var(--as-radius);
	padding: 16px 20px;
	margin: 22px 0 0;
}
.as-home-fondateur-avatar img,
.as-home-fondateur-initiales {
	width: 72px;
	height: 72px;
	border-radius: 50%;
	object-fit: cover;
	border: 2px solid rgba(251, 200, 154, .45);
	background: var(--as-accent-bg);
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: var(--as-font-head);
	font-weight: 700;
	font-size: 22px;
	color: var(--as-accent);
	flex-shrink: 0;
}
.as-home-fondateur-body { flex: 1; min-width: 0; }
.as-home-fondateur-id {
	margin: 0 0 6px;
	font-size: 14.5px;
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 10px;
}
.as-home-fondateur-role {
	color: var(--as-accent);
	font-size: 12px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: .05em;
}
.as-home-fondateur-linkedin { font-size: 12px; white-space: nowrap; }
.as-home-fondateur-txt {
	margin: 0 0 8px;
	font-size: 13.8px;
	line-height: 1.6;
	color: var(--as-ink-2);
}
.as-home-fondateur-ctas {
	margin: 0;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 14px;
	font-size: 13px;
}
.as-home-fondateur-cta { font-weight: 700; }
.as-home-fondateur-mini { color: var(--as-muted); font-size: 12.5px; }

/* Les pastilles de rang viennent du composant mutualisé `.as-rank-badge`
 * d'AS Core : AS Home reste la référence visuelle, mais plus la source CSS. */
.as-home-row-top td { background: rgba(240, 184, 78, .04); }

/* ---------- Tableaux ---------- */
.as-home-table { min-width: 860px; }
.as-home-minitable .as-table { min-width: 520px; font-size: 13px; }
.as-home-minitable .as-table thead th,
.as-home-minitable .as-table tbody td { padding: 9px 10px; }
.as-home-plat-id {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 3px;
	min-width: 0;
}
.as-home-plat-id .as-tag { align-self: flex-start; width: max-content; max-width: 100%; }
.as-home-wrap .as-home-plat-link { font-weight: 700; color: #fff !important; text-decoration: none; }
.as-home-wrap .as-home-plat-link:hover { color: #f8dfc4 !important; }
.as-home-wrap .as-home-plat-nom { font-weight: 700; color: #fff !important; }
.as-home-asof { color: var(--as-muted); font-weight: 400; }
.as-home-minilink { font-size: 12.5px; white-space: nowrap; }
.as-home-flag { margin-right: 6px; }

/* Note /5 avec anneau + étoiles fractionnaires, alignée sur AS Meilleure Plateforme. */
.as-home-notewrap { display: inline-flex; align-items: center; gap: 12px; flex-wrap: nowrap; }
.as-home-note-ring {
	--pct: 0;
	--ring-c: #34d39a;
	position: relative;
	display: grid;
	place-items: center;
	width: 58px;
	height: 58px;
	flex: none;
	border-radius: 50%;
	background: conic-gradient(var(--ring-c) calc(var(--pct) * 1%), var(--as-line) 0);
}
.as-home-note-ring::before { content: ""; position: absolute; inset: 5px; border-radius: 50%; background: var(--as-card); }
.as-home-note-ring__val {
	position: relative;
	z-index: 1;
	font-family: var(--as-font-head);
	font-weight: 700;
	font-size: 15px;
	line-height: 1;
	color: var(--as-ink);
	text-align: center;
}
.as-home-note-ring__val small { display: block; margin-top: 2px; font-size: 9px; font-weight: 600; color: var(--as-muted); }
.as-home-note-ring--green { --ring-c: #34d39a; }
.as-home-note-ring--orange { --ring-c: #f0a24a; }
.as-home-note-ring--red { --ring-c: #ef5f74; }
.as-home-note-meta { display: inline-flex; flex-direction: column; gap: 5px; min-width: 0; }
.as-home-stars { position: relative; display: inline-block; width: max-content; font-size: 15px; line-height: 1; letter-spacing: 2px; white-space: nowrap; }
.as-home-stars__bg { color: var(--as-line-2); }
.as-home-stars__fg { position: absolute; top: 0; left: 0; width: var(--fill, 0%); overflow: hidden; color: #f5b638; white-space: nowrap; }
.as-home-note-nb { font-size: 12px; color: var(--as-muted); white-space: nowrap; }

/* Cellule offre partenaire : contenir le HTML libre de code_bonus. */
.as-home-offer-cell { max-width: 260px; }
.as-home-offer { font-size: 12px; line-height: 1.45; color: #fff !important; }
.as-home-offer * { color: #fff !important; }
.as-home-offer strong,
.as-home-offer b { color: #f4b91f !important; }
.as-home-offer p { margin: 0 0 4px; }
.as-home-offer img { max-width: 100%; height: auto; }
.as-home-offer a { color: #fff !important; font-weight: 700; }
.as-home-offer a:hover { color: #f8dfc4 !important; }

/* ---------- CTAs de section ---------- */
.as-home-ctas {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin: 18px 0 0;
}

/* ---------- Outils communautaires ---------- */
.as-home-outils {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));
	gap: 18px;
	align-items: start;
}
.as-home-outil { min-width: 0; }

/* ---------- Grille des 4 baromètres ---------- */
.as-home-baros {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(420px, 1fr));
	gap: 18px;
}
.as-home-baro { margin-bottom: 0; min-width: 0; }
.as-home-baro-kpi {
	font-size: 13.5px;
	color: var(--as-ink-2);
	margin: 0 0 12px;
	line-height: 1.55;
}
.as-home-baro-kpi strong { color: #f8dfc4; font-family: var(--as-font-head); }
.as-home-baro-note { font-size: 11.5px; color: var(--as-muted); margin: 10px 0 0; line-height: 1.5; }
.as-home-baro-cta { margin: 14px 0 0; }

/* ---------- Comparatif à onglets ---------- */
.as-home-comp-tabs { margin: 0 0 6px; }
.as-home-comp-panes { position: relative; }
.as-home-comp-pane { min-width: 0; }
/* Masquage préservant la géométrie : les canvases Chart.js s'initialisent
 * au DOMContentLoaded — un display:none donnerait un graphe 0×0. */
.as-home-comp-pane:not(.is-active) {
	visibility: hidden;
	position: absolute;
	inset: 0;
	overflow: hidden;
	pointer-events: none;
}

/* ---------- SCPI ---------- */
.as-home-cash { font-weight: 700; white-space: nowrap; }

/* ---------- Projets en financement ---------- */
.as-home-projets {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(330px, 1fr));
	gap: 10px;
}
.as-home-projet {
	display: flex;
	flex-direction: column;
	gap: 6px;
	background: var(--as-card);
	border: 1px solid var(--as-line);
	border-radius: var(--as-radius-sm);
	padding: 12px 14px;
}
.as-home-projet-badges { display: flex; flex-wrap: wrap; gap: 6px; }
.as-home-badge {
	display: inline-flex;
	align-items: center;
	padding: 2px 9px;
	border-radius: var(--as-radius-pill);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .03em;
	text-transform: uppercase;
}
.as-home-badge--jaune { background: rgba(240, 196, 106, .18); color: #f0c46a; border: 1px solid rgba(240, 196, 106, .5); }
.as-home-badge--bleu { background: rgba(127, 178, 229, .16); color: #7fb2e5; border: 1px solid rgba(127, 178, 229, .5); }
.as-home-badge--nouveau { background: rgba(126, 166, 140, .16); color: #7EA68C; border: 1px solid rgba(126, 166, 140, .5); }
.as-home-badge--date { background: var(--as-card-2); color: var(--as-muted); border: 1px solid var(--as-line-2); text-transform: none; }
.as-home-projet-id { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.as-home-projet-nom { font-weight: 700; font-size: 14px; text-decoration: none; overflow-wrap: anywhere; }
.as-home-projet-plat { color: var(--as-muted); font-size: 12px; }
.as-home-projet-meta {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	font-family: var(--as-font-head);
	font-size: 13px;
	color: var(--as-ink);
}
.as-home-projet-duree { color: var(--as-ink-2); }

/* ---------- « À la une » (dossiers d'AS Page) ----------
   Les cartes elles-mêmes sont stylées par AS Page (`.as-pg-actu-*`, feuille
   `as-pg-css` enfilée par le composant exportable) : une seule définition
   visuelle sert la home et le sommaire /actu-dossier/. On ne borne ici que la
   respiration du bloc dans la page d'accueil. */
.as-home-actu .as-pg-actu-une { margin: 4px 0 0; }

/* ---------- Guides ---------- */
.as-home-guides {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
	gap: 14px;
}
.as-home-guide {
	display: flex;
	gap: 12px;
	align-items: flex-start;
	background: var(--as-card);
	border: 1px solid var(--as-line);
	border-radius: var(--as-radius-sm);
	padding: 14px 16px;
	text-decoration: none !important;
	transition: border-color .15s ease, transform .15s ease;
}
.as-home-guide:hover { border-color: var(--as-accent); transform: translateY(-2px); }
.as-home-guide-icon { font-size: 22px; line-height: 1; flex-shrink: 0; }
.as-home-guide-body { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.as-home-guide-title { color: var(--as-ink); font-size: 14px; line-height: 1.35; }
.as-home-guide-excerpt { color: var(--as-muted); font-size: 12.5px; line-height: 1.5; }
.as-home-guide-time { color: var(--as-accent); font-size: 11px; }

/* ---------- Texte SEO chapitré ---------- */
.as-home-seo .as-home-chap { margin: 0 0 26px; }
.as-home-seo .as-chapter {
	font-family: var(--as-font-head);
	font-size: 17px;
	font-weight: 600;
	color: var(--as-ink);
	margin: 0 0 10px;
}
.as-home-seo p {
	font-size: 14.5px;
	line-height: 1.75;
	color: var(--as-ink-2);
	margin: 0 0 12px;
	max-width: 980px;
}

/* Le sélecteur de duel est rendu et stylé par AS Classement. */

/* ---------- Blocs de fin ---------- */
.as-home-risques,
.as-home-sources { margin-top: 22px; }

/* ---------- Responsive ---------- */
@media (max-width: 980px) {
	.as-home-baros { grid-template-columns: 1fr; }
	.as-home-outils { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
	.as-home-wrap { padding: 16px 10px 40px; }
	.as-home-hero { padding: 20px 16px 12px; }
	.as-home-fondateur { flex-direction: column; }
	.as-home-h2 { font-size: 20px; }
	.as-home-table { min-width: 720px; }
	.as-home-offer-cell { max-width: 200px; }
}
