/* Carte de France de la carte « Une agence locale, ancrée dans le Var » (accueil, section 02).
   Région Sud (Provence-Alpes-Côte d'Azur) : déplacements sur place, villes pointées ; Var en surbrillance.
   Autres régions : accompagnement à distance, reliées à Draguignan par un tracé.
   Sans JavaScript ou avec « réduire les animations » : carte complète, sans animation ni infobulle.
   Avec JavaScript (assets/carte.js) : .is-prete masque les tracés, .is-visible les dessine. */

.bento__item--local { isolation: isolate; }
.bento__item--local > :not(.carte-fr):not(.carte-fr__bulle) { position: relative; z-index: 1; }

.carte-fr { display: block; height: auto; overflow: visible; }
.bento__item--local .carte-fr {
	position: absolute; z-index: 0; top: 50%; right: clamp(.5rem, 3%, 2.5rem);
	width: min(50%, 31rem); translate: 0 -50%;
}
.carte-fr__deps { fill: none; stroke: rgba(185, 195, 230, .1); stroke-width: .5; stroke-linejoin: round; pointer-events: none; }
.carte-fr__region {
	fill: rgba(241, 240, 255, .045); stroke: rgba(185, 195, 230, .4); stroke-width: 1; stroke-linejoin: round;
	transition: fill .25s, stroke .25s;
}
.carte-fr__region.is-survol { fill: rgba(78, 108, 255, .28); stroke: #9AA8FF; }
.carte-fr__region.is-paca { fill: rgba(48, 213, 200, .16); stroke: #30D5C8; stroke-width: 1.4; }
.carte-fr__region.is-paca.is-survol { fill: rgba(48, 213, 200, .3); }
.carte-fr__var {
	fill: url(#carte-fr-grad); stroke: #8FF5EC; stroke-width: 1.4; stroke-linejoin: round; pointer-events: none;
	filter: drop-shadow(0 0 12px rgba(48, 213, 200, .7));
}
.carte-fr__traces, .carte-fr__halo, .carte-fr__onde, .carte-fr__etiquette { pointer-events: none; }
.carte-fr__trace { fill: none; stroke: #9AA8FF; stroke-width: 1.3; stroke-linecap: round; stroke-opacity: .7; stroke-dasharray: .012 .016; }
.carte-fr__cible { fill: #fff; stroke: #4E6CFF; stroke-width: 2; transform-box: fill-box; transform-origin: center; }
.carte-fr__villes circle { fill: #30D5C8; transform-box: fill-box; transform-origin: center; transition: transform .2s var(--ease-out), fill .2s; }
.carte-fr__villes circle.is-survol { fill: #fff; transform: scale(2.4); filter: drop-shadow(0 0 6px #30D5C8); }
.carte-fr__origine { fill: #fff; stroke: #30D5C8; stroke-width: 3; }
.carte-fr__onde { fill: none; stroke: #30D5C8; stroke-width: 2; transform-box: fill-box; transform-origin: center; opacity: 0; }
.carte-fr__etiquette rect { fill: rgba(6, 18, 53, .88); stroke: rgba(48, 213, 200, .55); stroke-width: 1; }
.carte-fr__etiquette text { fill: #fff; font: 600 13px/1 var(--f-sans); letter-spacing: .01em; }

/* Animation (activée par assets/carte.js) : région Sud et Var, puis tracés vers chaque région. */
.carte-fr.is-prete .carte-fr__trace { stroke-dasharray: 1; stroke-dashoffset: 1; }
.carte-fr.is-prete .carte-fr__cible { opacity: 0; }
.carte-fr.is-prete .carte-fr__villes circle { opacity: 0; }
.carte-fr.is-prete .carte-fr__var { fill-opacity: 0; }
.carte-fr.is-prete .carte-fr__region.is-paca { fill-opacity: 0; }
.carte-fr.is-visible .carte-fr__region.is-paca { animation: carte-apparait .8s var(--ease-out) forwards; }
.carte-fr.is-visible .carte-fr__var { animation: carte-var .9s .2s var(--ease-out) forwards; }
.carte-fr.is-visible .carte-fr__villes circle { animation: carte-apparait .6s .5s var(--ease-out) forwards; }
.carte-fr.is-visible .carte-fr__trace { animation: carte-trace 1.1s calc(.8s + var(--i) * .16s) var(--ease-out) forwards; }
.carte-fr.is-visible .carte-fr__cible { animation: carte-cible .6s calc(1.8s + var(--i) * .16s) var(--ease-out) forwards; }
.carte-fr.is-visible .carte-fr__region:not(.is-paca) { animation: carte-region 1.2s calc(1.8s + var(--i) * .16s) ease-out; }
.carte-fr.is-visible .carte-fr__onde { animation: carte-onde 2.4s 1s ease-out infinite; }
/* Une fois dessinés, les tracés redeviennent pointillés (accompagnement à distance). */
.carte-fr.is-dessinee .carte-fr__trace { animation: none; stroke-dasharray: .012 .016; stroke-dashoffset: 0; }

@keyframes carte-apparait { to { opacity: 1; fill-opacity: 1; } }
@keyframes carte-var { to { fill-opacity: 1; } }
@keyframes carte-trace { to { stroke-dashoffset: 0; } }
@keyframes carte-cible { 0% { opacity: 0; transform: scale(0); } 60% { opacity: 1; transform: scale(1.6); } 100% { opacity: 1; transform: scale(1); } }
@keyframes carte-region { 0%, 100% { fill: rgba(241, 240, 255, .045); } 35% { fill: rgba(78, 108, 255, .3); } }
@keyframes carte-onde { 0% { opacity: .9; transform: scale(1); } 100% { opacity: 0; transform: scale(5); } }

/* Texte à gauche, carte à droite : le texte garde sa colonne. */
@media (min-width: 1024px) {
	.bento__item--local > p { max-width: 44%; }
	.bento__item--local .h3 { max-width: 11ch; }
}

/* Tablette et mobile : la carte passe au-dessus du texte, en pleine largeur. */
@media (max-width: 1023px) {
	.bento__item--local .carte-fr { position: relative; top: auto; right: auto; translate: none; width: min(100%, 26rem); margin: 0 auto var(--s-2); }
	.bento__item--local .bento__icon { margin-bottom: 0; }
}

@media (prefers-reduced-motion: reduce) {
	.carte-fr.is-visible .carte-fr__onde { animation: none; }
}

/* Infobulle (assets/carte.js) */
.carte-fr__bulle {
	position: absolute; z-index: 3; left: 0; top: 0; pointer-events: none;
	display: grid; gap: .15rem; width: max-content; max-width: 16rem; margin: 0; padding: .55rem .8rem; border-radius: .75rem;
	background: rgba(6, 18, 53, .94); border: 1px solid rgba(48, 213, 200, .45); box-shadow: 0 12px 30px -12px rgba(0, 0, 0, .6);
	color: #fff; font-size: .82rem; line-height: 1.35; opacity: 0; translate: -50% calc(-100% - 12px); transition: opacity .15s;
}
.carte-fr__bulle.is-visible { opacity: 1; }
.carte-fr__bulle strong { font-size: .92rem; }
.carte-fr__bulle span { color: var(--on-dark-soft); }
.carte-fr__bulle .is-sur-place { color: #30D5C8; font-weight: 600; }
.carte-fr.is-pointe { cursor: pointer; }

/* Carte « Des clients qui en parlent » : logo Google à gauche de la note */
.bento__google { display: inline-flex; align-items: center; gap: .55rem; }
.bento__google .google-g { flex: none; }
.bento__lien { font-weight: 600; color: var(--galactic-ink); white-space: nowrap; }

/* ==========================================================================
   Carte de la région Sud (page Contact, bloc « Zone d'intervention ») :
   Var en surbrillance, une ligne de Draguignan vers chaque ville de plus de 10 000 habitants.
   ========================================================================== */
.zone-map { position: relative; }
.carte-fr--paca { width: 100%; border-radius: var(--r-m); }
.carte-fr__fond { fill: #061235; }
.carte-fr--paca .carte-fr__region.is-paca { fill: rgba(48, 213, 200, .08); stroke: #30D5C8; stroke-width: 1.6; }
.carte-fr--paca .carte-fr__region.is-paca.is-survol { fill: rgba(48, 213, 200, .16); }
.carte-fr--paca .carte-fr__deps { stroke: rgba(185, 195, 230, .28); stroke-width: .8; stroke-dasharray: 3 3; }
.carte-fr--paca .carte-fr__trace { stroke: #30D5C8; stroke-width: .9; stroke-opacity: .3; stroke-dasharray: none; }
.carte-fr--paca .carte-fr__mer { fill: rgba(185, 195, 230, .5); font: 600 14px/1 var(--f-sans); letter-spacing: .12em; text-transform: uppercase; pointer-events: none; }
.carte-fr--paca .carte-fr__etiquette text { font-size: 14px; }
.carte-fr--paca.is-dessinee .carte-fr__trace { stroke-dasharray: none; }
/* Animation : 95 tracés, donc un pas plus court, et chaque ville s'allume à l'arrivée de son tracé. */
.carte-fr--paca.is-prete .carte-fr__trace { stroke-dasharray: 1; }
.carte-fr--paca.is-visible .carte-fr__trace { animation: carte-trace .9s calc(.6s + var(--i) * .025s) var(--ease-out) forwards; }
.carte-fr--paca.is-visible .carte-fr__villes circle { animation: carte-ville-paca .6s calc(1.3s + var(--i) * .025s) var(--ease-out) forwards; }
@keyframes carte-ville-paca { 0% { opacity: 0; transform: scale(0); } 60% { opacity: 1; transform: scale(1.8); } 100% { opacity: 1; transform: scale(1); } }
