.public-offers-map { position: relative; margin-block: var(--space-6); }
.public-offers-map__heading h2 { font-size: clamp(1.75rem, 4vw, 3rem); line-height: 1.15; margin-block: var(--space-2); }
.public-offers-map__heading p { max-width: 46rem; }
.public-offers-map__toolbar { display: flex; align-items: end; gap: var(--space-2); margin-block: var(--space-4) var(--space-2); }
.public-city-search { display: flex; flex: 1; align-items: end; gap: var(--space-2); margin: 0; }
.public-city-search__field { display: grid; flex: 1; gap: var(--space-1); font-weight: 700; min-width: 0; }
.public-city-search input { width: 100%; min-height: var(--control-height); padding: var(--space-2) var(--space-3); border: 1px solid var(--color-line); border-radius: 0; background: var(--color-surface); color: var(--color-ink); font: inherit; }
.public-city-search button { min-height: var(--control-height); }
.public-city-results { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.public-city-results button { padding: var(--space-2) var(--space-3); min-height: var(--touch-target); background: var(--color-surface); border: 1px solid var(--color-line); border-radius: 0; font: inherit; cursor: pointer; }
.public-map-message { color: var(--color-ink-soft); margin-block: var(--space-2); }
.public-map-message:empty { display: none; }
.public-offers-map__canvas { height: clamp(23rem, 60vh, 38rem); width: 100%; border: 1px solid var(--color-line); background: var(--color-neutral-surface); z-index: 0; }
.public-offers-map__caption { color: var(--color-ink); font-size: 0.92rem; line-height: 1.45; }
.public-offer-pin { display: grid; place-items: center; color: var(--color-on-dark); background: var(--color-signal-dark); border: 2px solid var(--color-surface); border-radius: 50%; font: 700 1rem/1 sans-serif; box-shadow: var(--shadow-soft); }
.public-offer-pin--instructors { background: var(--color-success); border-radius: 0.4rem; }
.public-map-legend { display: flex; flex-wrap: wrap; gap: var(--space-3); margin-block: var(--space-3); }
.public-map-legend span { display: inline-flex; align-items: center; gap: var(--space-2); font-weight: 700; }
.public-map-key { display: inline-block; width: 1rem; height: 1rem; background: var(--color-signal-dark); border-radius: 50%; }
.public-map-key--instructors { background: var(--color-success); border-radius: 0.2rem; }
.public-offers-map .public-map-reset { width: auto; padding-inline: var(--space-2); font: 700 0.85rem/2.5rem sans-serif; color: var(--color-ink); background: var(--color-surface); border: 0; cursor: pointer; }

/* MARK: - Carte en fond de l'accueil */

.public-offers-map--home { position: absolute; z-index: 0; inset: 0; min-height: 100%; margin: 0; overflow: hidden; }
.public-offers-map--home::after { content: ""; position: absolute; z-index: 1; inset: 0; background: linear-gradient(90deg, var(--color-paper) 0%, var(--color-paper) 38%, transparent 92%); opacity: 0.88; pointer-events: none; transition: opacity var(--duration-fast) ease; }
.public-offers-map--home .public-offers-map__toolbar { position: absolute; z-index: 650; top: var(--space-4); left: 50%; width: min(100% - 2rem, var(--content-width)); display: grid; grid-template-columns: minmax(20rem, 36rem) auto; justify-content: space-between; margin: 0; transform: translateX(-50%); }
.public-offers-map--home .public-city-search { width: 100%; max-width: 36rem; }
.public-offers-map--home .public-map-focus { flex: none; min-height: var(--control-height); background: var(--color-surface); }
.public-offers-map--home .public-map-focus:hover { color: var(--color-on-dark); }
.public-offers-map--home .public-map-search-feedback { position: absolute; z-index: 650; top: 6.6rem; left: max(var(--space-4), calc((100% - var(--content-width)) / 2)); width: min(36rem, calc(100% - 2 * var(--space-4))); }
.public-offers-map--home .public-map-search-feedback .public-map-message:not(:empty) { width: fit-content; padding: var(--space-2); background: var(--color-surface); box-shadow: var(--shadow-soft); }
.public-offers-map--home .public-offers-map__canvas { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; filter: blur(7px) saturate(0.8); transform: scale(1.03); transform-origin: center; pointer-events: none; transition: filter var(--duration-fast) ease, transform var(--duration-fast) ease; }
.public-offers-map--home .public-map-meta { position: absolute; z-index: 600; right: max(var(--space-3), calc((100% - var(--content-width)) / 2)); bottom: 5.5rem; display: grid; width: min(25rem, calc(100% - 2 * var(--space-3))); gap: var(--space-1); transition: filter var(--duration-fast) ease, opacity var(--duration-fast) ease; }
.public-offers-map--home .public-map-meta > * { width: 100%; margin: 0; padding: var(--space-1) var(--space-2); background: var(--color-surface); box-shadow: var(--shadow-soft); font-size: 0.72rem; }
.public-offers-map--home .public-map-legend { gap: var(--space-2); }
.public-offers-map--home .public-map-legend span { gap: var(--space-1); }
.public-offers-map--home .public-map-key { width: 0.65rem; height: 0.65rem; }
.home-explorer:not([data-home-state="map"]) .public-offers-map--home .public-map-meta { filter: blur(4px); opacity: 0.38; }
.home-explorer[data-home-state="map"] .public-offers-map--home::after { opacity: 0; }
.home-explorer[data-home-state="map"] .public-offers-map--home .public-offers-map__canvas { filter: none; transform: none; pointer-events: auto; }
.home-explorer[data-home-state="map"] .public-offers-map--home .public-map-focus { color: var(--color-on-dark); background: var(--color-signal-dark); }

@media (max-width: 35rem) {
    .public-offers-map__toolbar, .public-city-search { flex-wrap: wrap; }
    .public-city-search__field { flex-basis: 100%; }
    .public-offers-map--home .public-offers-map__toolbar { left: 50%; width: calc(100% - 2 * var(--space-2)); display: flex; }
    .public-offers-map--home .public-city-search { flex-basis: 100%; }
    .public-offers-map--home .public-map-focus { margin-left: auto; }
    .public-offers-map--home .public-map-search-feedback { top: 10rem; right: var(--space-2); left: var(--space-2); width: auto; }
    .public-offers-map--home .public-map-meta { right: var(--space-2); bottom: 5.5rem; width: min(20rem, calc(100% - 2 * var(--space-2))); }
}