/* IA Secure – Carte d'implantation. Toutes les règles sont préfixées .iasc- pour ne pas toucher au thème. */

.iasc-carte {
	--iasc-accent: #b436dd;
	--iasc-ink: #120535;
	--iasc-text: #35294d;
	--iasc-muted: #7b7190;
	--iasc-line: #ececf8;
	--iasc-surface: #fff;
	--iasc-radius: 15px;
	--iasc-glow: 0 0 10px 0 rgb(180 54 221 / 32%);
	--iasc-font-title: var(--e-global-typography-secondary-font-family, "Plus Jakarta Sans"), system-ui, sans-serif;
	--iasc-font-text: var(--e-global-typography-text-font-family, "Inter"), system-ui, sans-serif;

	container-type: inline-size;
	width: 100%; /* sans largeur explicite, container-type réduit la carte à 0 dans un conteneur Elementor en ligne */
	color: var(--iasc-text);
	font-family: var(--iasc-font-text);
	padding-block: 4rem;
}

.iasc-carte *,
.iasc-carte *::before,
.iasc-carte *::after {
	box-sizing: border-box;
}

/* En-tête : même rythme que les sections Elementor du site */
.iasc-head {
	max-width: 44rem;
	margin: 0 auto 3rem;
	text-align: center;
}

.iasc-eyebrow {
	margin: 0 0 0.75rem;
	color: var(--iasc-accent);
	font-size: 0.875rem;
	font-weight: 500;
	letter-spacing: 0.02em;
	text-transform: uppercase;
}

.iasc-carte .iasc-title {
	margin: 0 0 1rem;
	color: var(--iasc-ink);
	font-family: var(--iasc-font-title);
	font-size: clamp(1.625rem, 1.2rem + 1.6vw, 2.25rem);
	font-weight: 700;
	line-height: 1.2;
}

.iasc-intro {
	margin: 0;
	font-size: 1.0625rem;
	line-height: 1.6;
}

/* Carte + fiches */
.iasc-body {
	display: grid;
	gap: 2rem;
	align-items: center;
}

@container (min-width: 820px) {
	.iasc-body {
		grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
		gap: 3rem;
	}

	.iasc-map svg {
		max-width: 36rem;
	}
}

.iasc-map svg {
	display: block;
	width: 100%;
	max-width: 30rem;
	height: auto;
	margin-inline: auto;
	overflow: visible;
}

.iasc-region {
	stroke: #fff;
	stroke-width: 1.5;
	stroke-linejoin: round;
	cursor: pointer;
}

.iasc-zone {
	transition: opacity 0.25s ease, transform 0.25s ease, filter 0.25s ease;
	transform-box: fill-box;
	transform-origin: center; /* couleur : attribut fill posé par le gabarit, visible même sans ce CSS */
}

.iasc-labels text {
	fill: #fff;
	font-family: var(--iasc-font-title);
	font-size: 11px;
	font-weight: 700;
	text-anchor: middle;
	dominant-baseline: middle;
	pointer-events: none;
	transition: opacity 0.25s ease;
}

/* Zone mise en avant (survol ou sélection, classe .is-focus posée par carte.js) : les autres s'estompent */
.iasc-carte[data-focus] .iasc-zone,
.iasc-carte[data-focus] .iasc-labels text {
	opacity: 0.28;
}

.iasc-carte[data-focus] .iasc-zone.is-focus {
	opacity: 1;
	transform: scale(1.015);
	filter: drop-shadow(0 6px 14px rgb(18 5 53 / 28%));
}

.iasc-carte[data-focus] .iasc-labels text.is-focus {
	opacity: 1;
}

/* Fiches de zone */
.iasc-carte .iasc-list {
	display: grid;
	gap: 1rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.iasc-card {
	position: relative;
	padding: 1.25rem 1.5rem;
	border: 1px solid var(--iasc-line);
	border-radius: var(--iasc-radius);
	background: var(--iasc-surface);
	transition: border-color 0.25s ease, box-shadow 0.25s ease;
}

/* Les autres fiches ne sont pas estompées : leur texte doit garder un contraste AA */
.iasc-carte[data-focus] .iasc-card.is-focus {
	border-color: var(--iasc-zone-color);
	border-color: color-mix(in srgb, var(--iasc-zone-color) 45%, transparent);
	box-shadow: var(--iasc-glow);
}

.iasc-carte .iasc-card-title {
	margin: 0 0 0.5rem;
	font-family: var(--iasc-font-title);
	font-size: 1.25rem;
	font-weight: 700;
	line-height: 1.3;
}

/* Le bouton couvre toute la fiche (pseudo-élément) : clic n'importe où, un seul arrêt clavier.
   Triple classe + états : passe devant le [type=button]:hover/:focus rose de hello-biz quel que soit l'ordre des CSS. */
.iasc-carte .iasc-card .iasc-card-btn,
.iasc-carte .iasc-card .iasc-card-btn:hover,
.iasc-carte .iasc-card .iasc-card-btn:focus,
.iasc-carte .iasc-card .iasc-card-btn:active {
	all: unset;
	display: inline-flex;
	align-items: center;
	gap: 0.625rem;
	color: var(--iasc-ink);
	cursor: pointer;
}

.iasc-card-btn::after {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: var(--iasc-radius);
}

.iasc-card-btn:focus-visible::after {
	outline: 2px solid var(--iasc-accent);
	outline-offset: 3px;
}

.iasc-dot {
	flex: none;
	width: 0.875rem;
	height: 0.875rem;
	border-radius: 50%;
	background: var(--iasc-zone-color);
}

.iasc-card-regions {
	margin: 0;
	color: var(--iasc-zone-text, var(--iasc-zone-color));
	font-size: 0.9375rem;
	line-height: 1.6;
}

.iasc-card-count {
	margin: 0.5rem 0 0;
	color: var(--iasc-muted);
	font-size: 0.8125rem;
	font-weight: 500;
	letter-spacing: 0.02em;
	text-transform: uppercase;
}

/* Petits écrans : libellés illisibles à cette taille, les fiches prennent le relais */
@container (max-width: 520px) {
	.iasc-labels {
		display: none;
	}

	.iasc-card {
		padding: 1rem 1.25rem;
	}
}

@media (prefers-reduced-motion: reduce) {
	.iasc-zone,
	.iasc-labels text,
	.iasc-card {
		transition: none;
	}

	.iasc-carte[data-focus] .iasc-zone.is-focus {
		transform: none;
	}
}