/* Carte des offres : chargée par cette seule page, hors du budget des pages publiques. */
:root { --carte-n0: #e4e7e0; --carte-n1: #c3e3d2; --carte-n2: #87c6a7; --carte-n3: #459674; --carte-n4: #145c43; }
@media (prefers-color-scheme: dark) {
  :root { --carte-n0: #2c332f; --carte-n1: #2f5243; --carte-n2: #3f7a60; --carte-n3: #62ab8a; --carte-n4: #b5e8cf; }
}
.carte-bloc { position: relative; }
.carte { display: block; width: 100%; height: auto; max-height: 78vh; }
.carte path, .carte circle { stroke: var(--surface); stroke-width: .8; }
.carte circle { stroke-width: 1.4; }
.carte .n0, .pastille.n0 { fill: var(--carte-n0); background: var(--carte-n0); }
.carte .n1, .pastille.n1 { fill: var(--carte-n1); background: var(--carte-n1); }
.carte .n2, .pastille.n2 { fill: var(--carte-n2); background: var(--carte-n2); }
.carte .n3, .pastille.n3 { fill: var(--carte-n3); background: var(--carte-n3); }
.carte .n4, .pastille.n4 { fill: var(--carte-n4); background: var(--carte-n4); }
.carte .hors { fill: var(--carte-n0); opacity: .55; }
.carte a { outline: none; }
.carte a:hover path, .carte a:hover circle { stroke: var(--text); stroke-width: 1.6; }
.carte a:focus-visible path, .carte a:focus-visible circle { stroke: var(--focus); stroke-width: 3; }
.carte-info { position: absolute; inset-block-start: 12px; inset-inline-start: 12px; margin: 0; padding: 4px 10px; font-weight: 600;
  background: var(--surface); border: 1px solid var(--border); border-radius: 6px; }
.carte-legende { display: flex; flex-wrap: wrap; gap: 6px 16px; margin: 10px 0 0; padding: 0; list-style: none; }
.carte-legende li { display: inline-flex; align-items: center; gap: 6px; }
.pastille { width: 14px; height: 14px; border-radius: 3px; border: 1px solid var(--border); }
.carte-regions { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px 28px; }
.carte-regions h3 { margin: 8px 0 4px; font-size: 15px; }
.carte-pays { margin: 0; padding: 0; list-style: none; }
.carte-pays li { display: flex; justify-content: space-between; gap: 8px; min-height: 28px; align-items: center; }
