/* ═══════════════════════════════════════════════════════════════
   LISTING EDITORIAL (v2) — Direction "Editorial Confiance"
   Polices : Instrument Serif (titres) + Inter (corps) + Geist Mono (eyebrows)
   Reference : design fiche/accueil et recherche/components/dirA-liste.jsx
   Scope : <main class="ed-list listing-page">
   ═══════════════════════════════════════════════════════════════ */

.ed-list {
  --ed-paper:        #FBFAF6;
  --ed-paper2:       #F6F4EF;
  --ed-paper-card:   #FFFFFF;
  --ed-ink:          #0D1220;
  --ed-ink2:         #3A4055;
  --ed-ink-muted:    #9AA0B0;
  --ed-line:         #E6E2D7;
  --ed-line-soft:    #F0EDE3;
  /* Accent cyan du logo (debut du degrade) — harmonise avec --brand-gradient */
  --ed-accent:       #0EA5E9;
  --ed-accent-deep:  #0284C7;
  --ed-accent-tint:  rgba(14, 165, 233, 0.08);
  --ed-red:          #E5384A;
  --ed-red-soft:     #FFF1EA;
  --ed-gold:         #F5C84B;
  /* Vert « bonne affaire » (badge sous la moyenne du secteur) */
  --ed-green:        #0F9D6B;
  --ed-green-soft:   rgba(15, 157, 107, 0.10);
  --ed-shadow-soft:  0 8px 24px -16px rgba(13, 18, 32, 0.18);
  --ed-shadow-card:  0 18px 40px -22px rgba(13, 18, 32, 0.20);
  --ed-shadow-glow:  0 12px 32px -16px rgba(244, 114, 182, 0.40), 0 6px 18px -10px rgba(14, 165, 233, 0.30);

  --ed-font-display: 'Instrument Serif', 'Iowan Old Style', Georgia, serif;
  --ed-font-body:    'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --ed-font-mono:    'Geist Mono', 'JetBrains Mono', ui-monospace, monospace;

  background: var(--ed-paper);
  color: var(--ed-ink);
  font-family: var(--ed-font-body);
  font-weight: 400;
  font-size: 16px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

body:has(.ed-list) {
  background: var(--ed-paper, #FBFAF6) !important;
}

.ed-list a { color: inherit; text-decoration: none; }
.ed-list img { display: block; max-width: 100%; }
.ed-list *,
.ed-list *::before,
.ed-list *::after { box-sizing: border-box; }

.ed-list .container,
.ed-list__container {
  width: 100%;
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 32px;
}

.ed-list h1, .ed-list h2, .ed-list h3 {
  font-family: var(--ed-font-display);
  font-weight: 400;
  letter-spacing: -0.01em;
  color: var(--ed-ink);
  line-height: 1.1;
  margin: 0;
}
.ed-list h1 em, .ed-list h2 em, .ed-list h3 em {
  font-style: italic;
  font-weight: 400;
  background: var(--brand-gradient);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}

.ed-eyebrow {
  display: inline-block;
  font-family: var(--ed-font-mono);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--ed-ink2);
}

/* ─── Boutons ─── */
.ed-list .ed-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 14px 22px;
  border-radius: 999px;
  font-family: var(--ed-font-body);
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  border: 0;
  transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease, color 0.2s ease;
  text-decoration: none;
  white-space: nowrap;
}
.ed-list .ed-btn svg { width: 18px; height: 18px; flex-shrink: 0; }
.ed-list .ed-btn:hover { transform: translateY(-1px); }
.ed-list .ed-btn--primary {
  background: var(--brand-gradient);
  color: #fff;
  box-shadow: var(--ed-shadow-glow);
}
.ed-list .ed-btn--primary:hover {
  background: var(--brand-gradient-deep);
  filter: brightness(1.03);
}
.ed-list .ed-btn--light {
  background: #fff;
  color: var(--ed-ink);
  box-shadow: 0 1px 0 rgba(13,18,32,.04), 0 8px 24px -12px rgba(13,18,32,.12);
}

/* ════════════════════════ BREADCRUMB ════════════════════════ */
.ed-list .breadcrumb,
.ed-list .ed-breadcrumb {
  padding: 24px 0 0;
  font-family: var(--ed-font-mono);
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ed-ink-muted);
}
.ed-list .breadcrumb a,
.ed-list .ed-breadcrumb a { color: var(--ed-ink2); }
.ed-list .breadcrumb a:hover,
.ed-list .ed-breadcrumb a:hover { color: var(--ed-accent); }
.ed-list .breadcrumb ol,
.ed-list .ed-breadcrumb ol {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.ed-list .breadcrumb li,
.ed-list .ed-breadcrumb li {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.ed-list .breadcrumb li + li::before,
.ed-list .ed-breadcrumb li + li::before {
  content: "/";
  color: var(--ed-ink-muted);
  margin-right: 4px;
}

/* ════════════════════════ HERO RECHERCHE ════════════════════════ */
.ed-list__hero {
  padding: 56px 0 48px;
  text-align: center;
}
.ed-list__hero .ed-eyebrow {
  margin-bottom: 18px;
}
.ed-list__hero h1 {
  font-size: clamp(2.5rem, 7vw, 5.25rem);
  font-weight: 400;
  letter-spacing: -0.02em;
  line-height: 1.02;
  margin: 0 0 24px;
  text-wrap: balance;
}
.ed-list__hero p {
  font-size: 1.0625rem;
  color: var(--ed-ink2);
  line-height: 1.55;
  max-width: 560px;
  margin: 0 auto 36px;
}

/* Search bar */
/* Barre de recherche — reprend le design "pilule" de l'accueil :
   bord encre 2px + ombre portée nette (6px 6px 0) + bouton sombre.
   Le filtre permis est conservé (utile sur la page listing). */
.ed-search-bar {
  display: flex;
  align-items: center;
  gap: 10px;
  background: #fff;
  border-radius: 999px;
  border: 2px solid var(--ed-ink);
  box-shadow: 6px 6px 0 var(--ed-ink);
  max-width: 760px;
  margin: 0 auto;
  padding: 9px 9px 9px 26px;
}
.ed-search-field {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}
.ed-search-field--small {
  flex: 0 0 auto;
  min-width: 196px;
  border-left: 1px solid var(--ed-line);
  padding-left: 16px;
}
.ed-search-field svg {
  width: 17px;
  height: 17px;
  flex-shrink: 0;
  color: var(--ed-ink2);
}
.ed-search-field input,
.ed-search-field select {
  border: 0;
  outline: none;
  font-size: 1.0625rem;
  padding: 12px 0;
  background: transparent;
  flex: 1;
  font-family: 'Hanken Grotesk', var(--ed-font-body);
  font-weight: 500;
  color: var(--ed-ink);
  appearance: none;
  -webkit-appearance: none;
  cursor: pointer;
  min-width: 0;
}
.ed-search-field input::placeholder { color: var(--ed-ink-muted); }
.ed-search-field select { padding-right: 18px; }
/* Neutralise le focus-ring bleu GLOBAL (base.css : input:focus) sur la barre de recherche */
.ed-search-field input:focus,
.ed-search-field select:focus { box-shadow: none; }
.ed-search-btn {
  flex: 0 0 auto;
  background: var(--ed-ink);
  color: #fff;
  border: 0;
  border-radius: 999px;
  min-height: 56px;
  padding: 14px 26px;
  font-family: 'Hanken Grotesk', var(--ed-font-body);
  font-size: 1rem;
  font-weight: 800;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  white-space: nowrap;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.ed-search-btn:hover { transform: translateY(-1px); box-shadow: 0 10px 22px rgba(13, 18, 32, 0.18); }
.ed-search-btn:active { transform: translateY(0); }
.ed-search-btn svg { width: 16px; height: 16px; }

/* Autocomplete villes (suggestions issues de la base) */
.ed-search-bar { position: relative; }
.ed-search-ac {
  position: absolute;
  top: calc(100% + 10px);
  left: 0;
  right: 0;
  z-index: 40;
  background: #fff;
  border: 1px solid var(--ed-line);
  border-radius: 18px;
  box-shadow: 0 18px 44px -18px rgba(13, 18, 32, 0.28), 0 2px 8px rgba(13, 18, 32, 0.06);
  padding: 6px;
  max-height: 320px;
  overflow-y: auto;
}
.ed-search-ac[hidden] { display: none; }
.ed-search-ac__item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 14px;
  border-radius: 12px;
  cursor: pointer;
}
.ed-search-ac__item:hover,
.ed-search-ac__item.is-active { background: rgba(13, 18, 32, 0.05); }
.ed-search-ac__name { font-weight: 600; color: var(--ed-ink); }
.ed-search-ac__cp { font-size: 13px; color: var(--ed-ink-muted); margin-left: 8px; font-weight: 500; }
.ed-search-ac__nb { font-size: 12px; color: var(--ed-ink-muted); white-space: nowrap; }
.ed-search-ac__empty { padding: 14px; color: var(--ed-ink-muted); font-size: 14px; text-align: center; }

/* Trust chips */
.ed-trust-chips {
  display: flex;
  justify-content: center;
  gap: 28px;
  margin-top: 32px;
  flex-wrap: wrap;
  list-style: none;
  padding: 0;
}
.ed-trust-chips li {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 13px;
  color: var(--ed-ink);
}
.ed-trust-chips li svg {
  width: 14px;
  height: 14px;
  color: var(--ed-ink2);
  flex-shrink: 0;
}
.ed-trust-chips strong {
  font-weight: 600;
  color: var(--ed-ink);
}
.ed-trust-chips span.muted {
  color: var(--ed-ink-muted);
}

/* ════════════════════════ GÉOLOC — slot CP inline ════════════════════════ */
/* Session 4 tri-completude (2026-05-11) */
.ed-geo {
  margin-top: 22px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
}
.ed-geo__edit {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: #fff;
  border: 1px solid var(--ed-line);
  border-radius: 999px;
  padding: 9px 18px;
  font-size: 13px;
  font-weight: 500;
  color: var(--ed-ink);
  font-family: inherit;
  cursor: pointer;
  transition: border-color 0.15s ease, color 0.15s ease, background 0.15s ease;
}
.ed-geo__edit:hover {
  border-color: var(--ed-accent);
  color: var(--ed-accent);
  background: var(--ed-accent-tint);
}
.ed-geo__edit svg {
  width: 14px;
  height: 14px;
  color: var(--ed-ink2);
}
.ed-geo__edit:hover svg { color: var(--ed-accent); }

.ed-geo__slot {
  width: 100%;
  max-width: 440px;
  background: #fff;
  border: 1px solid var(--ed-line);
  border-radius: 20px;
  padding: 18px 20px 16px;
  box-shadow: 0 8px 22px -12px rgba(13, 18, 32, 0.12);
  text-align: left;
}
.ed-geo__slot[hidden] { display: none; }
.ed-geo__slot-help {
  font-size: 13px;
  color: var(--ed-ink2);
  margin: 0 0 12px;
  text-align: center;
}
.ed-geo__form {
  display: flex;
  align-items: stretch;
  gap: 8px;
}
.ed-geo__field {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0 14px;
  background: var(--ed-line-soft);
  border-radius: 999px;
  min-width: 0;
}
.ed-geo__field svg {
  width: 14px;
  height: 14px;
  color: var(--ed-ink2);
  flex-shrink: 0;
}
.ed-geo__field input {
  border: 0;
  outline: none;
  background: transparent;
  font: inherit;
  font-size: 14px;
  padding: 10px 0;
  width: 100%;
  min-width: 0;
  color: var(--ed-ink);
  letter-spacing: 0.04em;
}
.ed-geo__field input::placeholder { color: var(--ed-ink-muted); letter-spacing: 0; }
.ed-geo__submit {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: var(--brand-gradient);
  color: #fff;
  border: 0;
  border-radius: 999px;
  padding: 0 18px;
  font: inherit;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
  transition: filter 0.15s ease, opacity 0.15s ease;
}
.ed-geo__submit:hover:not(:disabled) { filter: brightness(1.05); }
.ed-geo__submit:disabled { opacity: 0.6; cursor: progress; }
.ed-geo__spinner {
  width: 14px;
  height: 14px;
  animation: ed-geo-spin 0.9s linear infinite;
}
.ed-geo__spinner[hidden] { display: none; }
@keyframes ed-geo-spin {
  from { transform: rotate(0deg); }
  to   { transform: rotate(360deg); }
}
.ed-geo__error {
  font-size: 12px;
  color: #c0392b;
  margin: 10px 0 0;
  text-align: center;
}
.ed-geo__error[hidden] { display: none; }

/* Bandeau "Affichage national" au-dessus de la liste de résultats */
.ed-geo-banner {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 24px;
  padding: 12px 16px;
  background: var(--ed-accent-tint);
  border: 1px solid rgba(14, 165, 233, 0.18);
  border-radius: 14px;
  font-size: 13px;
  color: var(--ed-ink);
}
.ed-geo-banner[hidden] { display: none; }
.ed-geo-banner svg {
  width: 16px;
  height: 16px;
  color: var(--ed-accent);
  flex-shrink: 0;
}
.ed-geo-banner__link {
  background: none;
  border: 0;
  padding: 0;
  font: inherit;
  color: var(--ed-accent);
  font-weight: 600;
  cursor: pointer;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.ed-geo-banner__link:hover { color: var(--ed-accent-deep); }

/* ════════════════════════ TOP 3 AE VILLE (M4) ════════════════════════ */
.ed-list__top-ville {
  padding: 56px 0 32px;
  border-top: 1px solid var(--ed-border, #e5e7eb);
}
.ed-list__top-head {
  text-align: center;
  margin-bottom: 32px;
}
.ed-list__top-head h2 {
  font-family: 'Instrument Serif', Georgia, serif;
  font-size: clamp(1.75rem, 3.5vw, 2.5rem);
  font-weight: 400;
  margin: 0 0 8px;
  color: var(--ed-text-strong, #0f172a);
}
.ed-list__top-head h2 em {
  font-style: italic;
  background: linear-gradient(90deg, #4f6bf6, #b95cf4 50%, #f0708a);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.ed-list__top-head p {
  color: var(--ed-text-soft, #6b7280);
  font-size: 0.95rem;
  margin: 0;
}
.ed-list__top-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 20px;
  max-width: 980px;
  margin: 0 auto;
}
.ed-list__top-card {
  display: block;
  border-radius: 16px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.08);
  border: 1px solid var(--ed-border, #e5e7eb);
  text-decoration: none;
  color: inherit;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.ed-list__top-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(15, 23, 42, 0.1);
}
.ed-list__top-card-img {
  aspect-ratio: 16 / 10;
  background-size: cover;
  background-position: center;
  background-color: #f1f5f9;
}
.ed-list__top-card-img--ph {
  background: linear-gradient(135deg, #e0e7ff, #fce7f3);
}
.ed-list__top-card-body {
  padding: 16px 18px 18px;
}
.ed-list__top-card-body h3 {
  font-size: 1.05rem;
  font-weight: 600;
  margin: 0 0 6px;
  color: var(--ed-text-strong, #0f172a);
}
.ed-list__top-card-rating {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 0.9rem;
  color: var(--ed-text-soft, #6b7280);
}
.ed-list__top-card-rating strong {
  color: var(--ed-text-strong, #0f172a);
  font-weight: 600;
}

/* ════════════════════════ COMMUNES VOISINES (M7) ════════════════════════ */
.ed-list__voisines {
  padding: 40px 0 64px;
}
.ed-list__voisines h2 {
  text-align: center;
  font-family: 'Instrument Serif', Georgia, serif;
  font-size: clamp(1.5rem, 3vw, 2rem);
  font-weight: 400;
  margin: 0 0 24px;
  color: var(--ed-text-strong, #0f172a);
}
.ed-list__voisines h2 em {
  font-style: italic;
  background: linear-gradient(90deg, #4f6bf6, #b95cf4 50%, #f0708a);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.ed-list__voisines-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 12px;
  max-width: 980px;
  margin: 0 auto;
  list-style: none;
  padding: 0;
}
.ed-list__voisines-grid li {
  margin: 0;
}
.ed-list__voisines-grid a {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 14px 16px;
  border: 1px solid var(--ed-border, #e5e7eb);
  border-radius: 12px;
  background: #fff;
  text-decoration: none;
  color: inherit;
  transition: border-color 0.2s ease, transform 0.2s ease;
}
.ed-list__voisines-grid a:hover {
  border-color: var(--ed-accent, #4f6bf6);
  transform: translateY(-1px);
}
.ed-list__voisines-grid strong {
  font-weight: 600;
  color: var(--ed-text-strong, #0f172a);
  font-size: 0.95rem;
}
.ed-list__voisines-grid span {
  font-size: 0.85rem;
  color: var(--ed-text-soft, #6b7280);
}

/* ════════════════ PRIX & RÉUSSITE : comparatif ville/département (Sprint 2 SEO) ════════════════ */
.ed-list__stats {
  padding: 40px 0 0;
}
.ed-list__stats-title {
  text-align: center;
  font-family: 'Instrument Serif', Georgia, serif;
  font-size: clamp(1.5rem, 3vw, 2rem);
  font-weight: 400;
  margin: 0 0 24px;
  color: var(--ed-text-strong, #0f172a);
}
.ed-list__stats-title em {
  font-style: italic;
  background: linear-gradient(90deg, #4f6bf6, #b95cf4 50%, #f0708a);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
/* Barres comparatives ville vs departement (prix + taux de reussite).
   Ville = degrade de marque, departement = gris : lecture immediate. La
   largeur de chaque barre est portee par la variable --w (donnee, pas de
   style decoratif inline) : width: var(--w) sur .ed-stats-fill. */
.ed-stats-bars {
  max-width: 620px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 28px;
}
.ed-stats-group {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.ed-stats-group-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}
.ed-stats-group-title {
  font-size: 0.92rem;
  font-weight: 600;
  color: var(--ed-text-strong, #0f172a);
}
.ed-stats-delta {
  font-size: 0.8rem;
  font-weight: 500;
  color: var(--ed-text-soft, #6b7280);
}
.ed-stats-row {
  display: grid;
  grid-template-columns: 118px 1fr auto;
  align-items: center;
  gap: 12px;
}
.ed-stats-row-label {
  font-size: 0.85rem;
  color: var(--ed-text-soft, #6b7280);
  text-align: right;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ed-stats-track {
  position: relative;
  height: 12px;
  border-radius: 999px;
  background: var(--ed-border, #e5e7eb);
  overflow: hidden;
}
.ed-stats-fill {
  position: absolute;
  inset: 0 auto 0 0;
  width: var(--w, 0%);
  min-width: 4px;
  border-radius: 999px;
  background: var(--ed-text-soft, #94a3b8);
}
.ed-stats-fill--city {
  background: linear-gradient(90deg, #4f6bf6, #b95cf4 60%, #f0708a);
}
.ed-stats-row-value {
  font-size: 0.98rem;
  font-weight: 700;
  color: var(--ed-text-strong, #0f172a);
  white-space: nowrap;
}
.ed-stats-note {
  margin: 2px 0 0;
  font-size: 0.8rem;
  color: var(--ed-text-soft, #6b7280);
}
@media (max-width: 560px) {
  .ed-stats-row { grid-template-columns: 82px 1fr auto; gap: 8px; }
  .ed-stats-row-label { font-size: 0.78rem; }
}

/* ════════════════ INTRO ÉDITORIALE LOCALE (pages ville) ════════════════ */
.ed-list__about {
  padding: 48px 0 72px;
  border-top: 1px solid var(--ed-border, #e5e7eb);
}
.ed-list__about-title {
  text-align: center;
  font-family: 'Instrument Serif', Georgia, serif;
  font-size: clamp(1.5rem, 3vw, 2rem);
  font-weight: 400;
  margin: 0 0 20px;
  color: var(--ed-text-strong, #0f172a);
}
.ed-list__about-title em {
  font-style: italic;
}
.ed-list__about-text {
  max-width: 760px;
  margin: 0 auto;
  font-size: 1rem;
  line-height: 1.7;
  color: var(--ed-text-soft, #475569);
  text-align: center;
}
@media (max-width: 640px) {
  .ed-list__about { padding: 36px 0 56px; }
  .ed-list__about-text { font-size: 0.95rem; line-height: 1.65; }
}

/* ════════════════ FAQ LOCALE (pages ville) ════════════════ */
.ed-list__faq {
  padding: 40px 0 72px;
  border-top: 1px solid var(--ed-border, #e5e7eb);
}
.ed-list__faq h2 {
  text-align: center;
  font-family: 'Instrument Serif', Georgia, serif;
  font-size: clamp(1.5rem, 3vw, 2rem);
  font-weight: 400;
  margin: 0 0 28px;
  color: var(--ed-text-strong, #0f172a);
}
.ed-list__faq h2 em {
  font-style: italic;
  background: linear-gradient(90deg, #4f6bf6, #b95cf4 50%, #f0708a);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}
.ed-list__faq-list {
  max-width: 760px;
  margin: 0 auto;
}
.ed-list__faq-item {
  border: 1px solid var(--ed-border, #e5e7eb);
  border-radius: 12px;
  background: #fff;
  margin-bottom: 10px;
  overflow: hidden;
}
.ed-list__faq-q {
  cursor: pointer;
  padding: 16px 18px;
  font-weight: 600;
  font-size: 0.98rem;
  color: var(--ed-text-strong, #0f172a);
  list-style: none;
}
.ed-list__faq-q::-webkit-details-marker {
  display: none;
}
.ed-list__faq-q::after {
  content: '+';
  float: right;
  color: var(--ed-text-soft, #6b7280);
  font-weight: 400;
}
.ed-list__faq-item[open] .ed-list__faq-q::after {
  content: '\2212';
}
.ed-list__faq-a {
  padding: 0 18px 16px;
}
.ed-list__faq-a p {
  margin: 0;
  font-size: 0.95rem;
  line-height: 1.65;
  color: var(--ed-text-soft, #475569);
}
.ed-list__faq-a a {
  color: var(--ed-accent, #4f6bf6);
}

/* ════════════════════════ FLASH DEALS ════════════════════════ */
.ed-list__flash {
  padding: 48px 0 24px;
}
.ed-flash-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 24px;
  margin-bottom: 28px;
  flex-wrap: wrap;
}
.ed-flash-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: var(--ed-red-soft);
  color: var(--ed-red);
  padding: 6px 12px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin-bottom: 14px;
}
.ed-flash-pill svg { width: 12px; height: 12px; }
.ed-flash-head h2 {
  font-size: clamp(1.75rem, 3.5vw, 2.75rem);
  line-height: 1.05;
  margin: 0 0 8px;
}
.ed-flash-head p {
  font-size: 14px;
  color: var(--ed-ink2);
  margin: 0;
}
.ed-flash-live {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border: 1px solid var(--ed-line);
  border-radius: 999px;
  padding: 8px 14px;
  font-size: 12px;
  color: var(--ed-ink2);
  background: #fff;
  font-weight: 500;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.ed-flash-live::before {
  content: "";
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--ed-red);
  animation: edPulseDot 1.4s ease-in-out infinite;
}
@keyframes edPulseDot {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.4; transform: scale(1.3); }
}

/* Carrousel marquee */
.ed-flash-track-wrapper {
  overflow: hidden;
  -webkit-mask-image: linear-gradient(to right, transparent 0, black 40px, black calc(100% - 40px), transparent 100%);
  mask-image: linear-gradient(to right, transparent 0, black 40px, black calc(100% - 40px), transparent 100%);
}
.ed-flash-track {
  display: flex;
  gap: 20px;
  width: max-content;
  animation: edMarquee 60s linear infinite;
}
.ed-flash-track:hover { animation-play-state: paused; }
@keyframes edMarquee {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}

.ed-flash-card {
  flex: 0 0 280px;
  background: #fff;
  border-radius: 16px;
  border: 1px solid var(--ed-line);
  overflow: hidden;
  transition: transform 0.25s ease, box-shadow 0.25s ease;
  display: block;
}
.ed-flash-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--ed-shadow-card);
}
.ed-flash-card__photo {
  position: relative;
  height: 150px;
  background: linear-gradient(135deg, #d6dbe6 0%, #aab8d4 100%);
  overflow: hidden;
}
.ed-flash-card__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  position: relative;
  z-index: 0;
}
.ed-flash-card__photo .ed-flash-discount {
  position: absolute;
  top: 12px; left: 12px;
  background: var(--ed-red);
  color: #fff;
  padding: 4px 10px;
  border-radius: 6px;
  font-size: 11px;
  font-weight: 700;
  z-index: 2;
}
.ed-flash-card__photo .ed-flash-countdown {
  position: absolute;
  top: 12px; right: 12px;
  background: rgba(13, 18, 32, 0.7);
  color: #fff;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 600;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.ed-flash-card__body { padding: 16px 18px 20px; }
.ed-flash-card__tag {
  display: inline-block;
  font-size: 9px;
  font-weight: 700;
  color: var(--ed-accent);
  letter-spacing: 0.06em;
  margin-bottom: 10px;
  font-family: var(--ed-font-mono);
  text-transform: uppercase;
}
.ed-flash-card__name {
  font-family: var(--ed-font-body);
  font-size: 14px;
  font-weight: 600;
  margin: 0 0 4px;
  line-height: 1.3;
  color: var(--ed-ink);
  letter-spacing: 0;
}
.ed-flash-card__city {
  font-size: 12px;
  color: var(--ed-ink-muted);
  display: flex;
  align-items: center;
  gap: 4px;
  margin-bottom: 12px;
}
.ed-flash-card__city svg { width: 11px; height: 11px; }
.ed-flash-card__rating {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  gap: 3px;
  color: var(--ed-ink2);
}
.ed-flash-card__rating svg { width: 11px; height: 11px; color: var(--ed-gold); fill: var(--ed-gold); }
.ed-flash-card__prices {
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin-bottom: 12px;
}
.ed-flash-card__price-old {
  font-size: 12px;
  color: var(--ed-ink-muted);
  text-decoration: line-through;
}
.ed-flash-card__price-new {
  font-family: var(--ed-font-display);
  font-size: 26px;
  font-weight: 400;
  color: var(--ed-red);
  line-height: 1;
}
.ed-flash-card__cta {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 13px;
  font-weight: 600;
  color: var(--ed-accent);
}
.ed-flash-card__cta svg { width: 13px; height: 13px; }

/* ════════════════════════ TOOLBAR ════════════════════════ */
.ed-list__results { padding: 48px 0 96px; }

.ed-toolbar {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 24px;
  margin-bottom: 36px;
  padding-bottom: 24px;
  border-bottom: 1px solid var(--ed-line);
  flex-wrap: wrap;
}
.ed-toolbar__lead h2 {
  font-size: clamp(1.75rem, 3.5vw, 2.5rem);
  line-height: 1;
  margin: 0 0 6px;
}
.ed-toolbar__lead h2 strong {
  color: var(--ed-accent);
  font-weight: 400;
}
.ed-toolbar__lead p {
  font-size: 14px;
  color: var(--ed-ink2);
  margin: 0;
}
.ed-toolbar__actions {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}
.ed-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: #fff;
  border: 1px solid var(--ed-line);
  padding: 10px 16px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  font-family: inherit;
  color: var(--ed-ink);
  transition: border-color 0.2s ease, background 0.2s ease, color 0.2s ease;
}
.ed-pill:hover { border-color: var(--ed-ink); }
.ed-pill svg { width: 13px; height: 13px; }
.ed-pill--dark {
  background: var(--ed-ink);
  color: #fff;
  border-color: var(--ed-ink);
}
.ed-pill--dark:hover { background: var(--ed-ink); color: #fff; }
.ed-pill--active {
  background: var(--ed-ink);
  color: #fff;
  border-color: var(--ed-ink);
}

/* ─── Switch de vue flottant (Liste / Carte) ───────────────────────────────
   Deux pills autonomes, fixées au milieu-gauche du viewport, qui suivent le
   scroll. Aucun cadre derrière (juste une ombre légère par pill). Masqué quand
   la carte plein écran est ouverte (body.bd-map-open) : elle a son « Retour ». */
.ed-viewswitch {
  position: fixed;
  left: 18px;
  top: 50%;
  transform: translateY(-50%);
  z-index: 60;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.ed-viewswitch .ed-pill {
  box-shadow: 0 8px 22px -10px rgba(13, 18, 32, 0.28);
}
body.bd-map-open .ed-viewswitch { display: none; }

.ed-sort-form {
  position: relative;
  display: inline-flex;
  align-items: center;
}
.ed-sort-wrap {
  position: relative;
  display: inline-flex;
  align-items: center;
  background: #fff;
  border: 1px solid var(--ed-line);
  border-radius: 999px;
  padding: 0 16px;
  height: 38px;
  cursor: pointer;
  transition: border-color 0.2s ease;
}
.ed-sort-wrap:hover { border-color: var(--ed-ink); }
.ed-sort-icon {
  display: inline-flex;
  margin-right: 8px;
  color: var(--ed-ink2);
}
.ed-sort-icon svg { width: 13px; height: 13px; }
.ed-sort-select {
  border: 0;
  background: transparent;
  font-family: inherit;
  font-size: 13px;
  font-weight: 500;
  color: var(--ed-ink);
  padding-right: 8px;
  outline: none;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
}

/* ════════════════════════ LISTING CARDS ════════════════════════ */
.ed-cards-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

.ed-list .school-card,
.ed-card {
  background: #fff;
  border-radius: 18px;
  border: 1px solid var(--ed-line);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
  cursor: pointer;
  text-decoration: none;
  color: inherit;
}
.ed-list .school-card:hover,
.ed-card:hover {
  transform: translateY(-3px);
  box-shadow: var(--ed-shadow-card);
  border-color: var(--ed-ink);
}

.ed-card__photo {
  position: relative;
  height: 200px;
  background: linear-gradient(135deg, #d6dbe6 0%, #aab8d4 100%);
  overflow: hidden;
}
.ed-card__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  position: relative;
  z-index: 0;
}
.ed-card__photo-empty {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  color: rgba(13, 18, 32, 0.35);
  position: relative;
  z-index: 1;
}
.ed-card__photo-empty svg { width: 56px; height: 56px; }

.ed-card__badge {
  position: absolute;
  top: 14px;
  padding: 5px 12px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  z-index: 2;
}
.ed-card__badge--flash {
  left: 14px;
  background: var(--ed-red);
  color: #fff;
}
.ed-card__badge--flash svg { width: 11px; height: 11px; }
.ed-card__badge--online {
  left: 14px;
  background: var(--ed-accent);
  color: #fff;
}
.ed-card__badge--online svg { width: 12px; height: 12px; }
.ed-card__badge--views {
  right: 14px;
  background: rgba(13, 18, 32, 0.7);
  color: #fff;
  font-weight: 600;
}
.ed-card__badge--views svg { width: 11px; height: 11px; }
.ed-card__badge--new {
  right: 14px;
  background: var(--ed-accent);
  color: #fff;
}
.ed-card__badge--new svg { width: 11px; height: 11px; }

.ed-card__body {
  padding: 20px 22px 16px;
  flex: 1;
  display: flex;
  flex-direction: column;
}
.ed-card__top {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 10px;
  margin-bottom: 6px;
}
.ed-card__name {
  font-family: var(--ed-font-body);
  font-size: 17px;
  font-weight: 600;
  letter-spacing: -0.01em;
  margin: 0 0 4px;
  line-height: 1.3;
  color: var(--ed-ink);
}
.ed-card__city {
  display: flex;
  align-items: center;
  gap: 4px;
  color: var(--ed-ink-muted);
  font-size: 12px;
  margin: 0 0 12px;
}
.ed-card__city svg { width: 11px; height: 11px; }
.ed-card__rating {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 13px;
  font-weight: 600;
  flex-shrink: 0;
}
.ed-card__rating svg { width: 12px; height: 12px; color: var(--ed-gold); fill: var(--ed-gold); }
.ed-card__rating-count { color: var(--ed-ink-muted); font-weight: 400; font-size: 11px; }
.ed-card__distance {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  background: var(--ed-accent-tint);
  color: var(--ed-accent);
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 600;
  margin-bottom: 6px;
}
.ed-card__distance svg { width: 10px; height: 10px; }

.ed-card__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 8px 0 16px;
  list-style: none;
  padding: 0;
}
.ed-card__tag {
  font-size: 11px;
  font-weight: 500;
  background: #F1F2F6;
  color: var(--ed-ink2);
  padding: 3px 10px;
  border-radius: 999px;
}
.ed-card__tag--accent {
  background: #FFF4E0;
  color: #B8860B;
}

.ed-card__footer {
  margin-top: auto;
  border-top: 1px solid var(--ed-line);
  padding: 14px 22px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  background: #fff;
}
.ed-card__price-block { display: flex; flex-direction: column; }
.ed-card__price-label {
  font-size: 10px;
  color: var(--ed-ink-muted);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin-bottom: 2px;
  font-family: var(--ed-font-mono);
}
.ed-card__price {
  font-family: var(--ed-font-display);
  font-size: 22px;
  font-weight: 400;
  color: var(--ed-ink);
  line-height: 1;
}
.ed-card__price--promo { color: var(--ed-red); }
.ed-card__price--ask {
  font-family: var(--ed-font-body);
  font-size: 13px;
  color: var(--ed-ink-muted);
  font-weight: 500;
}
/* Promo comparable (meme referentiel que le prix de reference) : prix barre +
   prix reduit + badge compact, cf. _carte-ae.php et buildSplitCard() (JS). */
.ed-card__price-row {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 6px;
}
.ed-card__price--old {
  font-family: var(--ed-font-body);
  font-size: 13px;
  font-weight: 500;
  color: var(--ed-ink-muted);
  text-decoration: line-through;
}
.ed-card__badge-discount {
  display: inline-block;
  align-self: center;
  background: var(--ed-red);
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  padding: 2px 7px;
  border-radius: 6px;
  font-family: var(--ed-font-mono);
  letter-spacing: 0.02em;
  white-space: nowrap;
}
.ed-card__actions {
  /* display: contents → prix, comparer et voir la fiche participent directement au
     flex du footer pour une répartition en 3 colonnes (space-between).
     Le mobile rétablit un vrai conteneur flex (voir media query 480px). */
  display: contents;
}
.ed-card__compare {
  font-size: 12px;
  font-weight: 500;
  color: var(--ed-ink2);
  display: inline-flex;
  align-items: center;
  gap: 4px;
  cursor: pointer;
  transition: color 0.2s ease;
  border: 0;
  background: transparent;
  padding: 0;
  font-family: inherit;
}
.ed-card__compare:hover { color: var(--ed-accent); }
.ed-card__compare svg { width: 12px; height: 12px; }
.ed-card__compare--active { color: var(--ed-accent); font-weight: 600; }
.ed-card__compare-label--active { display: none; }
.ed-card__compare--active .ed-card__compare-label--active { display: inline; }
.ed-card__compare--active .ed-card__compare-label { display: none; }
.ed-card__cta {
  font-size: 13px;
  font-weight: 600;
  color: var(--ed-accent);
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.ed-card__cta svg { width: 12px; height: 12px; }

/* ════════════════════════ EMPTY STATE ════════════════════════ */
.ed-empty {
  text-align: center;
  padding: 80px 24px;
  background: #fff;
  border: 1px solid var(--ed-line);
  border-radius: 18px;
}
.ed-empty svg {
  width: 56px; height: 56px;
  color: var(--ed-ink-muted);
  margin: 0 auto 16px;
  display: block;
}
.ed-empty h3 {
  font-size: 1.625rem;
  margin: 0 0 8px;
}
.ed-empty p {
  color: var(--ed-ink2);
  margin: 0 0 24px;
}

/* ════════════════════════ SIM BANNER ════════════════════════ */
.ed-sim-banner {
  margin-top: 56px;
  border-radius: 18px;
  overflow: hidden;
  background: var(--brand-gradient);
  padding: 36px 44px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 24px;
  color: #fff;
  position: relative;
  flex-wrap: wrap;
  box-shadow: 0 30px 60px -30px rgba(244, 114, 182, 0.45), 0 14px 32px -16px rgba(14, 165, 233, 0.35);
}
.ed-sim-banner__lead {
  display: flex;
  gap: 22px;
  align-items: center;
  flex: 1;
  min-width: 280px;
}
.ed-sim-banner__icon {
  width: 56px; height: 56px;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.18);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.ed-sim-banner__icon svg { width: 26px; height: 26px; }
.ed-sim-banner h3 {
  font-size: 1.75rem;
  line-height: 1.1;
  margin: 0 0 4px;
  color: #fff;
}
.ed-sim-banner p {
  font-size: 14px;
  opacity: 0.9;
  margin: 0;
  line-height: 1.45;
}
.ed-sim-banner p u { text-decoration: underline; opacity: 1; }
.ed-sim-banner .ed-btn--light {
  flex-shrink: 0;
}

/* ════════════════════════ PAGINATION ════════════════════════ */
.ed-pagination {
  display: flex;
  justify-content: center;
  gap: 8px;
  margin-top: 48px;
  flex-wrap: wrap;
}
.ed-page-btn {
  width: 40px;
  height: 40px;
  border-radius: 999px;
  border: 1px solid var(--ed-line);
  background: #fff;
  color: var(--ed-ink);
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  font-family: inherit;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  transition: border-color 0.2s ease, background 0.2s ease, color 0.2s ease;
}
.ed-page-btn:hover { border-color: var(--ed-ink); }
.ed-page-btn--active {
  background: var(--ed-accent);
  border-color: var(--ed-accent);
  color: #fff;
}
.ed-page-btn--disabled {
  opacity: 0.4;
  cursor: not-allowed;
  pointer-events: none;
}
.ed-page-ellipsis {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 24px;
  color: var(--ed-ink-muted);
  font-size: 14px;
}

/* ════════════════════════ COMPARE FLOATING BAR ════════════════════════ */
/* La barre est rendue OUTSIDE de .ed-list (apres le footer) — selecteurs globaux. */
/* CSS ne charge que sur la page listing donc pas de pollution ailleurs. */
.compare-floating-bar {
  position: fixed;
  left: 50%;
  bottom: 24px;
  transform: translate(-50%, 200%);
  background: #0D1220;
  color: #fff;
  padding: 14px 20px;
  border-radius: 999px;
  display: flex;
  align-items: center;
  gap: 18px;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 14px;
  box-shadow: 0 24px 48px -16px rgba(13, 18, 32, 0.4);
  z-index: 999;
  transition: transform 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
  width: max-content;
  max-width: calc(100vw - 32px);
}
.compare-floating-bar--visible {
  transform: translate(-50%, 0);
}
.compare-floating-bar__text { font-size: 14px; color: #fff; }
.compare-floating-bar__text strong { color: #38BDF8; font-weight: 600; }
.compare-floating-bar__btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: var(--brand-gradient);
  color: #fff;
  padding: 9px 18px;
  border-radius: 999px;
  font-weight: 600;
  font-size: 13px;
  text-decoration: none;
}
.compare-floating-bar__btn:hover { background: var(--brand-gradient-deep); filter: brightness(1.03); }
.compare-floating-bar__btn svg { width: 14px; height: 14px; flex-shrink: 0; }
.compare-floating-bar__clear {
  background: transparent;
  border: 0;
  color: rgba(255,255,255,0.6);
  font-size: 12px;
  cursor: pointer;
  font-family: inherit;
}
.compare-floating-bar__clear:hover { color: #fff; }

/* ════════════════════════ MAP / VUE SCINDEE PLEIN ECRAN ════════════════════════ */
/* Vue Carte facon PermiFast : overlay plein ecran. Desktop = liste + carte ;
   mobile = carte seule. Ouvert via display:flex pose par le JS. */
.ed-list #mapView {
  position: fixed;
  inset: 0;
  z-index: 1200;
  background: var(--ed-paper);
  flex-direction: column;
}
/* Page derriere figee + chrome du site masque pendant l'ouverture */
body.bd-map-open { overflow: hidden; }
body.bd-map-open .main-nav { display: none; }
body.bd-map-open .compare-floating-bar { display: none !important; }

/* Barre fine en haut de l'overlay (Retour + compteur) */
.ed-list .listing-fs__bar {
  flex: 0 0 auto;
  height: 56px;
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 0 16px;
  background: var(--ed-paper-card);
  border-bottom: 1px solid var(--ed-line);
}
.ed-list .listing-fs__back {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 8px 14px;
  border-radius: 999px;
  border: 1px solid var(--ed-line);
  background: var(--ed-paper-card);
  color: var(--ed-ink);
  font-family: var(--ed-font-body);
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  transition: border-color .15s ease, background .15s ease;
}
.ed-list .listing-fs__back:hover { border-color: var(--ed-ink); background: var(--ed-line-soft); }
.ed-list .listing-fs__back svg { width: 15px; height: 15px; }
.ed-list .listing-fs__count { font-size: 13px; color: var(--ed-ink2); }
.ed-list .listing-fs__count strong { color: var(--ed-ink); font-weight: 700; }

/* Zone scindee : remplit le reste de la hauteur */
.ed-list .listing-split {
  flex: 1 1 auto;
  min-height: 0;
  display: grid;
  grid-template-columns: minmax(0, 420px) 1fr;
}

/* Colonne gauche : liste defilante */
.ed-list .listing-split__list {
  min-height: 0;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 16px;
  border-right: 1px solid var(--ed-line);
}
.ed-list .listing-split__empty {
  padding: 28px 18px;
  text-align: center;
  color: var(--ed-ink-muted);
  font-size: 14px;
}
.ed-list .listing-split__sentinel { height: 1px; flex: 0 0 auto; }

/* Colonne droite : carte plein cadre */
.ed-list .listing-split__panel {
  min-height: 0;
  height: 100%;
}
.ed-list #mapContainer,
.ed-list .listing-map__container {
  width: 100%;
  height: 100%;
  background: var(--ed-line-soft);
  z-index: 0;
}

/* ─── Carte verticale facon PermiFast (colonne gauche) ─── */
.ed-list .listing-split-card {
  display: block;
  flex: 0 0 auto; /* enfant flex de la colonne : garde sa hauteur, la liste defile */
  background: var(--ed-paper-card);
  border: 1px solid var(--ed-line);
  border-radius: 16px;
  overflow: hidden;
  cursor: pointer;
  text-decoration: none;
  color: inherit;
  transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.ed-list .listing-split-card:hover {
  border-color: var(--ed-ink);
  box-shadow: var(--ed-shadow-soft);
  transform: translateY(-2px);
}
.ed-list .listing-split-card.is-active {
  border-color: var(--ed-accent);
  box-shadow: 0 0 0 2px var(--ed-accent), var(--ed-shadow-soft);
  transform: translateY(-2px);
}
.ed-list .listing-split-card.is-active:hover {
  border-color: var(--ed-accent);
  box-shadow: 0 0 0 2px var(--ed-accent), var(--ed-shadow-soft);
}
.ed-list .listing-split-card__photo {
  position: relative;
  height: 158px;
  background: linear-gradient(135deg, #d6dbe6 0%, #aab8d4 100%);
  display: flex;
  align-items: center;
  justify-content: center;
}
.ed-list .listing-split-card__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.ed-list .listing-split-card__photo svg {
  width: 40px;
  height: 40px;
  color: rgba(255, 255, 255, 0.85);
}
.ed-list .listing-split-card__dist {
  position: absolute;
  top: 12px;
  left: 12px;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  font-weight: 600;
  color: var(--ed-ink);
  background: rgba(255, 255, 255, 0.94);
  padding: 5px 10px;
  border-radius: 999px;
  box-shadow: 0 2px 6px rgba(13, 18, 32, 0.18);
}
.ed-list .listing-split-card__dist svg { width: 12px; height: 12px; color: var(--ed-accent-deep); }
.ed-list .listing-split-card__body { padding: 14px 16px 16px; }
.ed-list .listing-split-card__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
}
.ed-list .listing-split-card__name {
  font-family: var(--ed-font-body);
  font-size: 16px;
  font-weight: 600;
  line-height: 1.25;
  color: var(--ed-ink);
  margin: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.ed-list .listing-split-card__rating {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  flex-shrink: 0;
  font-size: 13px;
  font-weight: 600;
  color: var(--ed-ink);
}
.ed-list .listing-split-card__rating svg { width: 14px; height: 14px; color: var(--ed-gold); }
.ed-list .listing-split-card__rating span { color: var(--ed-ink-muted); font-weight: 400; font-size: 12px; }
.ed-list .listing-split-card__addr {
  display: flex;
  align-items: center;
  gap: 5px;
  font-size: 13px;
  color: var(--ed-ink2);
  margin: 6px 0 0;
  min-width: 0;
}
.ed-list .listing-split-card__addr svg { width: 13px; height: 13px; flex-shrink: 0; color: var(--ed-ink-muted); }
.ed-list .listing-split-card__addr span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.ed-list .listing-split-card__foot {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 10px;
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid var(--ed-line-soft);
}
.ed-list .listing-split-card__price-label {
  display: block;
  font-family: var(--ed-font-mono);
  font-size: 10px;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--ed-ink-muted);
  margin-bottom: 2px;
}
.ed-list .listing-split-card__price {
  font-family: var(--ed-font-display);
  font-size: 22px;
  line-height: 1;
  color: var(--ed-ink);
}
.ed-list .listing-split-card__price--promo { color: var(--ed-red); }
.ed-list .listing-split-card__price--ask {
  font-family: var(--ed-font-body);
  font-size: 14px;
  font-weight: 500;
  color: var(--ed-ink-muted);
}
/* Promo comparable (fiches geolocalisees, colonne carte) : meme rendu barre +
   reduit + badge que .ed-card__price-row, prefixe listing-split-card__. */
.ed-list .listing-split-card__price-row {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 6px;
}
.ed-list .listing-split-card__price--old {
  font-family: var(--ed-font-body);
  font-size: 13px;
  font-weight: 500;
  color: var(--ed-ink-muted);
  text-decoration: line-through;
}
.ed-list .listing-split-card__badge-discount {
  display: inline-block;
  align-self: center;
  background: var(--ed-red);
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  padding: 2px 7px;
  border-radius: 6px;
  font-family: var(--ed-font-mono);
  letter-spacing: 0.02em;
  white-space: nowrap;
}
.ed-list .listing-split-card__btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  flex-shrink: 0;
  padding: 9px 16px;
  border-radius: 999px;
  background: var(--ed-ink);
  color: #fff;
  font-size: 13px;
  font-weight: 600;
  transition: background .15s ease;
}
.ed-list .listing-split-card:hover .listing-split-card__btn { background: var(--ed-accent-deep); }
.ed-list .listing-split-card__btn svg { width: 13px; height: 13px; }

/* ─── Offre sur la carte : specs formule + puce « sous la moyenne » ───
   Partagé entre la carte liste (colonne gauche) et le popup du marqueur, pour
   afficher la même formule que les cartes de la grille (prix + heures + code + deal). */
.ed-list .bd-spec {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  white-space: nowrap;
}
.ed-list .bd-spec svg { width: 13px; height: 13px; flex-shrink: 0; color: var(--ed-ink-muted); }
.ed-list .bd-spec b { font-weight: 700; color: var(--ed-ink); }
.ed-list .bd-spec--code { color: var(--ed-green); font-weight: 600; }
.ed-list .bd-spec--code svg { color: var(--ed-green); }

.ed-list .listing-split-card__specs {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 4px 10px;
  margin-top: 8px;
  font-size: 12.5px;
  color: var(--ed-ink2);
}
.ed-list .listing-split-card__deal,
.ed-list .listing-popup__deal {
  display: inline-block;      /* chip qui enveloppe le texte et wrappe naturellement */
  padding: 5px 10px;
  border-radius: 8px;
  background: var(--ed-green-soft);
  color: var(--ed-green);
  font-size: 12px;
  line-height: 1.35;
}
.ed-list .listing-split-card__deal { margin-top: 10px; }
.ed-list .listing-split-card__deal strong,
.ed-list .listing-popup__deal strong { font-weight: 800; white-space: nowrap; }

/* Popup : bloc prix (libellé + montant) et specs compactes */
.ed-list .listing-popup__price {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
  margin: 8px 0 0;
}
.ed-list .listing-popup__price-label {
  font-family: var(--ed-font-mono);
  font-size: 9.5px;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--ed-ink-muted);
}
.ed-list .listing-popup__price-num {
  font-family: var(--ed-font-display);
  font-size: 20px;
  line-height: 1;
  color: var(--ed-ink);
}
.ed-list .listing-popup__price-num--ask {
  font-family: var(--ed-font-body);
  font-size: 13px;
  font-weight: 500;
  color: var(--ed-ink-muted);
}
.ed-list .listing-popup__deal { margin-top: 8px; }
.ed-list .listing-popup__specs {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 4px 10px;
  margin-top: 8px;
  font-size: 12px;
  color: var(--ed-ink2);
}

/* ─── Marqueurs custom (couleurs marque) ─── */
.ed-list .listing-pin-wrap {
  background: transparent;
  border: 0;
}
/* Pin de localisation : goutte d'eau, pointe ancree en bas */
.ed-list .listing-pin {
  display: block;
  width: 26px;
  height: 38px;
  color: var(--ed-accent);
  filter: drop-shadow(0 2px 3px rgba(13, 18, 32, 0.4));
  transform-origin: 50% 100%;
  transition: transform .15s ease, color .15s ease;
}
.ed-list .listing-pin svg {
  display: block;
  width: 100%;
  height: 100%;
}
.ed-list .listing-pin--active {
  color: var(--ed-accent-deep);
  transform: scale(1.35);
  filter: drop-shadow(0 3px 6px rgba(13, 18, 32, 0.55));
}
/* Marqueur "Votre position" : point centre, pas un pin */
.ed-list .listing-pin--user {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #fff;
  border: 4px solid var(--ed-accent);
  box-shadow: 0 2px 5px rgba(13, 18, 32, 0.35);
  box-sizing: border-box;
  color: inherit;
  filter: none;
  transform: none;
}

/* ─── Amas de marqueurs (clustering carte, facon Dott) ─── */
/* Pastille ronde chiffree sur le bleu de marque : anneau blanc + halo translucide
   pour se detacher des tuiles. Taille et intensite du bleu croissent avec la densite. */
.ed-list .listing-cluster {
  background: transparent;
  border: 0;
}
.ed-list .listing-cluster span {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  color: #fff;
  font-family: var(--ed-font-body);
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.01em;
  background: var(--ed-accent);
  border: 2px solid #fff;
  box-shadow:
    0 3px 10px -2px rgba(13, 18, 32, 0.38),
    0 0 0 6px rgba(14, 165, 233, 0.16);
  transition: transform .15s ease, box-shadow .15s ease;
}
.ed-list .listing-cluster:hover span {
  transform: scale(1.08);
  box-shadow:
    0 6px 16px -3px rgba(13, 18, 32, 0.45),
    0 0 0 8px rgba(14, 165, 233, 0.22);
}
/* Petit amas (< 10) */
.ed-list .listing-cluster--sm span { font-size: 13px; }
/* Amas moyen (10-49) : bleu plus profond */
.ed-list .listing-cluster--md span {
  font-size: 14px;
  background: var(--ed-accent-deep);
  box-shadow:
    0 3px 10px -2px rgba(13, 18, 32, 0.40),
    0 0 0 7px rgba(2, 132, 199, 0.16);
}
/* Gros amas (>= 50) : bleu le plus profond de la marque (--color-primary-active) */
.ed-list .listing-cluster--lg span {
  font-size: 15px;
  background: #0369A1;
  box-shadow:
    0 4px 12px -2px rgba(13, 18, 32, 0.44),
    0 0 0 8px rgba(3, 105, 161, 0.18);
}

/* ─── Popup carte (zero style inline) ─── */
.ed-list .leaflet-popup-content-wrapper {
  border-radius: 14px;
  box-shadow: var(--ed-shadow-card);
}
.ed-list .leaflet-popup-content {
  margin: 0;
  font-family: var(--ed-font-body);
}
.ed-list .listing-popup {
  width: 210px;
  overflow: hidden;
  border-radius: 14px;
}
.ed-list .listing-popup__media {
  width: 100%;
  height: 92px;
  object-fit: cover;
  display: block;
}
.ed-list .listing-popup__body { padding: 10px 12px 12px; }
.ed-list .listing-popup__name {
  font-size: 14px;
  font-weight: 600;
  color: var(--ed-ink);
  margin: 0 0 2px;
}
.ed-list .listing-popup__addr {
  font-size: 12px;
  color: var(--ed-ink2);
  margin: 0;
}
.ed-list .listing-popup__rating {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin: 6px 0 0;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--ed-ink);
}
.ed-list .listing-popup__rating svg { width: 13px; height: 13px; color: var(--ed-gold); }
.ed-list .listing-popup__rating span { color: var(--ed-ink-muted); font-weight: 400; }
.ed-list .listing-popup__actions {
  display: flex;
  gap: 6px;
  margin-top: 10px;
}
.ed-list .listing-popup__btn {
  flex: 1;
  text-align: center;
  padding: 7px 8px;
  border-radius: 9px;
  font-size: 12px;
  font-weight: 600;
  text-decoration: none;
  background: var(--ed-accent);
  color: #fff;
  transition: filter .15s ease;
}
.ed-list .listing-popup__btn:hover { filter: brightness(1.05); }
.ed-list .listing-popup__btn--ghost {
  background: var(--ed-line-soft);
  color: var(--ed-ink);
}

/* ─── Bottom sheet mobile (equivalent du popup Leaflet, hors mobile = invisible) ─── */
.listing-sheet { display: none; }

/* ─── Mobile (<=900px) : Carte = uniquement la carte plein ecran (pas de liste) ─── */
@media (max-width: 900px) {
  .ed-list .listing-split { grid-template-columns: 1fr; }
  .ed-list .listing-split__list { display: none; }
  .ed-list .listing-split__panel { height: 100%; }
}

/* ════════════════════════ MAP (FIN) ════════════════════════ */

/* ════════════════════════ RESPONSIVE ════════════════════════ */

@media (max-width: 1100px) {
  .ed-cards-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 1024px) {
  .ed-list .container,
  .ed-list__container { padding: 0 28px; }
  .ed-toolbar { align-items: flex-start; }
}

@media (max-width: 768px) {
  .ed-list .container,
  .ed-list__container { padding: 0 18px; }
  .ed-list__hero { padding: 36px 0 32px; }
  .ed-list__hero h1 { font-size: clamp(2.25rem, 9vw, 3.5rem); margin-bottom: 18px; }
  .ed-list__hero p { font-size: 1rem; margin-bottom: 24px; }
  .ed-search-bar {
    flex-direction: column;
    align-items: stretch;
    gap: 4px;
    border-radius: 22px;
    padding: 10px;
    box-shadow: 5px 5px 0 var(--ed-ink);
  }
  .ed-search-field { padding: 4px 14px; }
  .ed-search-field--small {
    border-left: 0;
    border-top: 1px solid var(--ed-line);
    padding-left: 14px;
    min-width: 0;
    width: 100%;
  }
  .ed-search-btn {
    width: 100%;
    justify-content: center;
    padding: 14px;
    border-radius: 999px;
    min-height: 0;
  }
  .ed-trust-chips {
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
    margin-top: 24px;
  }
  .ed-geo { margin-top: 18px; }
  .ed-geo__slot { padding: 16px; border-radius: 16px; }
  .ed-geo__form { flex-direction: column; }
  .ed-geo__submit { padding: 12px 18px; justify-content: center; }
  .ed-geo-banner { align-items: flex-start; }
  .ed-flash-head { flex-direction: column; align-items: flex-start; }
  .ed-flash-card { flex: 0 0 220px; }
  .ed-toolbar {
    flex-direction: column;
    align-items: stretch;
    gap: 16px;
  }
  .ed-toolbar__actions { justify-content: flex-start; }
  /* Sur mobile : barre d'onglets fixee en bas du viewport (façon barre d'app),
     toujours visible pendant le scroll, dans les deux vues (liste et carte).
     z-index 1300 : au-dessus de la vue carte plein ecran (#mapView, 1200) et
     de la barre de comparaison (999), pour rester cliquable partout. */
  .ed-viewswitch {
    position: fixed;
    left: 0;
    right: 0;
    top: auto;
    bottom: 0;
    transform: none;
    z-index: 1300;
    flex-direction: row;
    gap: 6px;
    margin: 0;
    width: 100%;
    background: var(--ed-paper-card);
    border-top: 1px solid var(--ed-line);
    box-shadow: 0 -8px 20px -16px rgba(13, 18, 32, 0.35);
    padding: 8px 12px calc(8px + env(safe-area-inset-bottom));
  }
  /* Contrairement au desktop (masquee en vue carte au profit du bouton
     « Retour » de la barre haute), la barre reste visible sur mobile : c'est
     elle qui permet de revenir a la liste. */
  body.bd-map-open .ed-viewswitch { display: flex; }
  /* Le sheet mobile (#aeSheet) remplace la barre Liste/Carte pendant qu'il est ouvert (a la
     Google Maps) : #mapView cree son propre contexte d'empilement (z-index:1200), le
     z-index:1350 du sheet ne peut donc jamais depasser cette barre par simple z-index (elle
     vit hors de ce contexte) ; on la masque par classe plutot (cf. openAeSheet/hideAeSheet
     dans auto-ecoles/index.php, seul point de sortie qui retire bd-sheet-open). */
  body.bd-sheet-open .ed-viewswitch { display: none; }
  /* Deja masquee via body.bd-map-open (regle globale, !important, cf. plus haut) des que la
     vue carte est ouverte : le sheet ne peut jamais s'ouvrir sans elle. Regle explicite
     conservee par prudence (defense en profondeur), sans effet visuel supplementaire. */
  body.bd-sheet-open .compare-floating-bar { display: none; }
  .ed-viewswitch .ed-pill {
    flex: 1 1 0;
    justify-content: center;
    min-height: 44px;
    box-shadow: none;
    background: transparent;
    border-color: transparent;
  }
  .ed-viewswitch .ed-pill--active {
    background: var(--ed-ink);
    border-color: var(--ed-ink);
  }
  /* Vue carte : le panneau carte s'arrete au-dessus de la barre d'onglets
     pour que l'attribution Leaflet et les controles de zoom restent visibles
     et cliquables (padding dans le content-box, cf. box-sizing: border-box). */
  .ed-list .listing-split__panel { padding-bottom: calc(64px + env(safe-area-inset-bottom)); }
  /* Vue liste : espace en bas de page pour que le dernier element de la
     grille et le footer restent entierement atteignables au-dessus de la
     barre d'onglets fixee. */
  body:has(.ed-list) { padding-bottom: calc(76px + env(safe-area-inset-bottom)); }
  .ed-cards-grid { grid-template-columns: 1fr; gap: 18px; }
  .ed-card__photo { height: 180px; }
  .ed-sim-banner {
    padding: 28px 24px;
    flex-direction: column;
    align-items: flex-start;
    text-align: left;
  }
  .ed-sim-banner h3 { font-size: 1.5rem; }
  .ed-sim-banner .ed-btn--light { width: 100%; justify-content: center; }
  /* Selecteur sans prefixe .ed-list : la barre de comparaison est rendue
     hors de <main class="ed-list"> (juste apres le footer, cf. commentaire
     plus haut), un prefixe .ed-list ne matcherait jamais. */
  .compare-floating-bar {
    width: calc(100% - 32px);
    /* Se pose au-dessus de la barre d'onglets fixee (60px + zone tactile
       encoche) au lieu de la chevaucher. */
    bottom: calc(76px + env(safe-area-inset-bottom));
    border-radius: 18px;
    flex-wrap: wrap;
    justify-content: space-between;
  }

  /* Filet de securite : sur mobile la fiche s'affiche via le bottom sheet
     (#aeSheet), jamais via le popup Leaflet (trop petit au doigt, chevauche
     la barre d'onglets fixee). */
  .listing-map__container .leaflet-popup { display: none; }

  /* ─── Bottom sheet mobile : 3 etats pilotes par classe sur #aeSheet.
     Aucun modificateur = cache (hors ecran, sous la barre d'onglets).
     --peek = aperçu bas (poignee + nom + note + prix, ~156px : la photo
     est a height:0 en peek, elle ne decale donc rien).
     --expanded = etendu, hauteur FIXE 90dvh (fallback 90vh pour les
     navigateurs sans dvh) : photo revelee en haut (height:170px), en-tete
     texte fixe, onglets Tarifs/Horaires, volets scrollables
     (.listing-sheet__panels) qui se partagent l'espace restant, actions
     ancrees en bas hors zone de scroll. Passe au-dessus de la barre
     d'onglets (z-index 1350 > 1300) comme un bottom sheet Google Maps.
     translateY(100%) / translateY(calc(100% - 156px)) restent corrects en
     hauteur fixe : ces pourcentages se resolvent contre la hauteur propre
     de l'element, identique quel que soit l'etat (le contenu ne change
     pas entre peek/expanded, seul le transform revele plus ou moins haut).
     PEEK_PX (156) est duplique en JS (drag), a garder synchronise. ─── */
  .listing-sheet {
    display: flex;
    flex-direction: column;
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1350;
    width: 100%;
    height: 90vh;
    height: 90dvh;
    background: var(--ed-paper-card);
    border-top: 1px solid var(--ed-line);
    border-radius: 18px 18px 0 0;
    box-shadow: 0 -12px 32px -16px rgba(13, 18, 32, 0.45);
    transform: translateY(100%);
    transition: transform 0.28s ease-out;
    overflow: hidden;
  }
  .listing-sheet--peek {
    transform: translateY(calc(100% - 156px));
  }
  .listing-sheet--expanded {
    transform: translateY(0);
  }
  .listing-sheet__handle {
    flex: 0 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 5px;
    min-height: 32px;
    padding-top: 6px;
    touch-action: none;
  }
  .listing-sheet__handle-bar {
    width: 40px;
    height: 4px;
    border-radius: 999px;
    background: var(--ed-line);
  }
  /* Indice de swipe : deux chevrons pointant vers le haut, empiles, qui
     "montent" en boucle avec un fondu pour inviter a pousser le sheet vers
     le haut. Affiche uniquement en peek (invitation) ; masque une fois le
     sheet ouvert (--expanded) ou ferme. Purement decoratif (aria-hidden). */
  .listing-sheet__nudge {
    display: none;
    flex-direction: column;
    align-items: center;
    height: 16px;
  }
  .listing-sheet--peek .listing-sheet__nudge {
    display: flex;
  }
  .listing-sheet__chevron {
    width: 10px;
    height: 10px;
    margin-bottom: -6px;
    border-top: 2px solid var(--ed-accent);
    border-left: 2px solid var(--ed-accent);
    transform: rotate(45deg);
    opacity: 0;
    animation: listing-sheet-nudge 1.6s ease-in-out infinite;
  }
  .listing-sheet__chevron:nth-child(2) {
    animation-delay: 0.18s;
  }
  @keyframes listing-sheet-nudge {
    0%   { opacity: 0;    transform: translateY(4px) rotate(45deg); }
    45%  { opacity: 0.95; transform: translateY(-2px) rotate(45deg); }
    100% { opacity: 0;    transform: translateY(-4px) rotate(45deg); }
  }
  @media (prefers-reduced-motion: reduce) {
    .listing-sheet__chevron {
      animation: none;
      opacity: 0.6;
      transform: translateY(0) rotate(45deg);
    }
  }
  /* Masquee (height:0) en peek et par defaut ; revelee uniquement en
     --expanded, animee via transition sur height plutot que display pour
     accompagner l'ouverture du sheet. */
  .listing-sheet__media {
    flex: 0 0 auto;
    height: 0;
    overflow: hidden;
    transition: height 0.28s ease-out;
  }
  .listing-sheet--expanded .listing-sheet__media {
    /* Hauteur adaptative : rend ~30-70px aux tarifs selon la taille d'ecran
       (petits telephones = photo plus courte), tout en restant assez haute
       pour donner le contexte visuel de l'auto-ecole. La transition height
       depuis 0 (peek) interpole vers la valeur calculee sans souci. */
    height: clamp(96px, 17vh, 140px);
  }
  .listing-sheet__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }
  /* En-tete texte fixe (ne scrolle plus) : c'est le contenu revele par
     l'etat peek (avec la poignee), au-dessus des onglets. */
  .listing-sheet__body {
    flex: 0 0 auto;
    padding: 4px 16px 8px;
  }
  /* Variante B du peek : nom + pastille de statut sur une meme ligne (headline),
     note juste dessous, PUIS le prix (avant l'adresse : c'est ce qui doit rester
     visible dans les ~156px du peek, l'ordre reel est pose dans le markup du
     body). L'adresse reste dans le DOM mais n'est reveleee qu'a l'expansion. */
  .listing-sheet__headline {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
    margin: 0 0 4px;
  }
  #aeSheetName {
    font-family: var(--ed-font-body);
    font-size: 16px;
    font-weight: 700;
    color: var(--ed-ink);
    margin: 0;
  }
  /* Pastille "Ouvert"/"Fermé" (cf. updateAeSheetStatus). Masquee par defaut
     (attribut hidden en markup) : jamais affichee si le statut est 'unknown'. */
  .listing-sheet__status {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    flex: 0 0 auto;
    margin-top: 2px;
    font-size: 12px;
    font-weight: 600;
    padding: 3px 10px;
    border-radius: 999px;
    white-space: nowrap;
  }
  .listing-sheet__status::before {
    content: "";
    width: 7px;
    height: 7px;
    border-radius: 50%;
  }
  .listing-sheet__status--open {
    background: var(--ed-green-soft);
    color: #0b7d55;
  }
  .listing-sheet__status--open::before { background: var(--ed-green); }
  .listing-sheet__status--closed {
    background: #f1f0ec;
    color: var(--ed-ink2);
  }
  .listing-sheet__status--closed::before { background: var(--ed-ink-muted); }
  .listing-sheet__rating {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 13px;
    font-weight: 600;
    color: var(--ed-ink);
    margin: 0 0 4px;
    white-space: nowrap;
  }
  .listing-sheet__rating svg { width: 13px; height: 13px; color: var(--ed-gold); flex: 0 0 auto; }
  /* Ligne prix "libelle a gauche / valeur forte a droite" : le libelle n'est
     ajoute (JS, openAeSheet) que lorsqu'un prix existe reellement, "Prix à
     demander" reste seul (donc aligne a gauche, space-between sans 2e item). */
  .listing-sheet__price {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    margin: 0 0 4px;
  }
  .listing-sheet__price-label {
    font-size: 13.5px;
    font-weight: 500;
    color: var(--ed-ink2);
  }
  .listing-sheet__price-value {
    font-size: 18px;
    font-weight: 700;
    color: var(--ed-ink);
    white-space: nowrap;
  }
  .listing-sheet__address {
    font-size: 13px;
    color: var(--ed-ink2);
    margin: 0;
  }
  /* Promo comparable dans le bottom sheet mobile : meme rendu barre + reduit +
     badge que .ed-card__price-row / .listing-split-card__price-row (openAeSheet),
     desormais imbrique dans .listing-sheet__price-value. */
  .listing-sheet__price-old {
    font-weight: 400;
    color: var(--ed-ink-muted);
    text-decoration: line-through;
    margin-right: 4px;
  }
  .listing-sheet__price-promo { color: var(--ed-red); }
  .listing-sheet__price-badge {
    display: inline-block;
    margin-left: 6px;
    background: var(--ed-red);
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    padding: 2px 7px;
    border-radius: 6px;
    letter-spacing: 0.02em;
    vertical-align: middle;
  }
  /* Segmented control Tarifs / Horaires, sobre, aligne sur les pills et
     boutons ghost existants du fichier (fond carte + bordure au repos,
     fond accent + texte blanc pour l'onglet actif). */
  .listing-sheet__tabs {
    flex: 0 0 auto;
    display: flex;
    gap: 6px;
    margin: 2px 16px 6px;
    padding: 3px;
    background: var(--ed-line-soft);
    border: 1px solid var(--ed-line);
    border-radius: 12px;
  }
  /* En peek, seul l'en-tete texte doit affleurer : selon la longueur du nom,
     le haut du segmented control peut sinon depasser au bord bas de l'ecran.
     Comme la photo (height:0), tabs et volets ne sont reveles qu'en --expanded ;
     visibility empeche aussi tout tap sur la bande affleurante invisible. */
  .listing-sheet__tabs,
  .listing-sheet__panels {
    visibility: hidden;
    opacity: 0;
    transition: opacity 0.2s ease-out, visibility 0.2s ease-out;
  }
  .listing-sheet--expanded .listing-sheet__tabs,
  .listing-sheet--expanded .listing-sheet__panels {
    visibility: visible;
    opacity: 1;
  }
  .listing-sheet__tab {
    flex: 1;
    min-height: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: none;
    border-radius: 9px;
    background: transparent;
    color: var(--ed-ink2);
    font-family: var(--ed-font-body);
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    transition: background-color 0.15s ease, color 0.15s ease;
  }
  .listing-sheet__tab.is-active {
    background: var(--ed-accent);
    color: #fff;
  }
  /* Zone scrollable : seule partie du sheet qui defile, entre l'en-tete
     fixe (au-dessus) et les actions ancrees (en dessous). */
  .listing-sheet__panels {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    padding: 2px 16px 12px;
  }
  .listing-sheet__permis-group + .listing-sheet__permis-group {
    margin-top: 16px;
  }
  .listing-sheet__permis-title {
    font-size: 12.5px;
    font-weight: 700;
    color: var(--ed-ink);
    margin: 0 0 8px;
  }
  .listing-sheet__formule {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    background: var(--ed-paper);
    border: 1px solid var(--ed-line);
    border-radius: 12px;
    padding: 11px 13px;
  }
  .listing-sheet__formule + .listing-sheet__formule {
    margin-top: 8px;
  }
  .listing-sheet__formule-label {
    font-size: 13.5px;
    font-weight: 600;
    color: var(--ed-ink);
    line-height: 1.3;
  }
  .listing-sheet__formule-meta {
    display: block;
    font-size: 12px;
    color: var(--ed-ink-muted);
    font-weight: 400;
    margin-top: 3px;
  }
  .listing-sheet__formule-price {
    font-size: 17px;
    font-weight: 800;
    color: var(--ed-ink);
    white-space: nowrap;
    text-align: right;
  }
  .listing-sheet__formule-price--old {
    display: block;
    font-size: 12px;
    font-weight: 400;
    color: var(--ed-ink-muted);
    text-decoration: line-through;
    text-align: right;
    margin: 0 0 1px;
  }
  /* En-tete "statut du jour" du volet Horaires : pastille (memes classes que le
     peek) + detail horaire attenue ("ferme à 19h" / "ouvre à 14h"). */
  .listing-sheet__hours-head {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 2px 0 12px;
  }
  .listing-sheet__hours-head-detail {
    font-size: 13px;
    color: var(--ed-ink-muted);
  }
  .listing-sheet__hours-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 8px 10px;
    border-radius: 9px;
    font-size: 13px;
  }
  .listing-sheet__hours-row + .listing-sheet__hours-row {
    margin-top: 2px;
  }
  /* Jour courant surligne (accent leger) + libelle en accent. */
  .listing-sheet__hours-row--today {
    background: var(--ed-accent-tint);
  }
  .listing-sheet__hours-day {
    color: var(--ed-ink);
    display: inline-flex;
    align-items: center;
  }
  .listing-sheet__hours-row--today .listing-sheet__hours-day {
    color: var(--ed-accent-deep);
    font-weight: 700;
  }
  /* Tag "Aujourd'hui" a cote du jour courant. */
  .listing-sheet__hours-today-tag {
    font-family: var(--ed-font-mono);
    font-size: 10px;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    color: var(--ed-accent-deep);
    border: 1px solid var(--ed-accent);
    border-radius: 5px;
    padding: 1px 5px;
    margin-left: 7px;
  }
  .listing-sheet__hours-slots {
    color: var(--ed-ink2);
    text-align: right;
    font-variant-numeric: tabular-nums;
  }
  /* Jours fermes attenues. */
  .listing-sheet__hours-slots--closed {
    color: var(--ed-ink-muted);
  }
  .listing-sheet__hours-row--today .listing-sheet__hours-slots {
    color: var(--ed-ink);
    font-weight: 600;
  }
  .listing-sheet__panel-msg {
    padding: 18px 0;
    font-size: 13px;
    color: var(--ed-ink2);
    text-align: center;
  }
  /* Actions ancrees en bas, hors de la zone scrollable, toujours
     visibles : padding-bottom + safe-area deplaces ici depuis
     .listing-sheet (l'ancien conteneur global), plus pertinent maintenant
     que .listing-sheet ne borde plus le bas visuel du contenu. Separateur
     leger pour detacher la barre d'actions du scroll au-dessus. */
  .listing-sheet__actions {
    flex: 0 0 auto;
    display: flex;
    gap: 8px;
    padding: 7px 16px calc(7px + env(safe-area-inset-bottom));
    border-top: 1px solid var(--ed-line-soft);
  }
  .listing-sheet__btn {
    flex: 1;
    text-align: center;
    padding: 10px 10px;
    border-radius: 10px;
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    background: var(--ed-accent);
    color: #fff;
    min-height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: filter 0.15s ease;
  }
  .listing-sheet__btn:hover { filter: brightness(1.05); }
  .listing-sheet__btn--ghost {
    background: var(--ed-line-soft);
    color: var(--ed-ink);
  }
}

@media (max-width: 480px) {
  .ed-list .container,
  .ed-list__container { padding: 0 14px; }
  .ed-card__footer {
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }
  .ed-card__actions {
    display: flex;
    align-items: center;
    gap: 14px;
    width: 100%;
    justify-content: space-between;
  }

  /* ─── Carrousel "Offres en cours" : 2 cartes visibles sur mobile ─── */
  .ed-flash-track { gap: 14px; }
  .ed-flash-track-wrapper {
    -webkit-mask-image: linear-gradient(to right, transparent 0, black 20px, black calc(100% - 20px), transparent 100%);
    mask-image: linear-gradient(to right, transparent 0, black 20px, black calc(100% - 20px), transparent 100%);
  }
  .ed-flash-card { flex: 0 0 165px; border-radius: 14px; }
  .ed-flash-card__photo { height: 100px; }
  .ed-flash-card__photo .ed-flash-discount {
    top: 8px; left: 8px; padding: 3px 7px; font-size: 10px;
  }
  .ed-flash-card__photo .ed-flash-countdown {
    top: 8px; right: 8px; padding: 3px 7px; font-size: 9px;
  }
  .ed-flash-card__body { padding: 10px 12px 12px; }
  .ed-flash-card__tag { font-size: 8px; margin-bottom: 6px; }
  .ed-flash-card__name { font-size: 13px; line-height: 1.25; margin-bottom: 2px; }
  .ed-flash-card__city { font-size: 10px; margin-bottom: 8px; gap: 3px; }
  .ed-flash-card__city svg { width: 10px; height: 10px; }
  .ed-flash-card__rating svg { width: 10px; height: 10px; }
  .ed-flash-card__prices { gap: 6px; margin-bottom: 8px; }
  .ed-flash-card__price-old { font-size: 10px; }
  .ed-flash-card__price-new { font-size: 19px; }
  .ed-flash-card__cta { font-size: 11px; }
  .ed-flash-card__cta svg { width: 11px; height: 11px; }
}

/* Ancien bloc « intro contextuelle ville » retiré : le descriptif est désormais
   rendu en bas de page via .ed-list__about (voir plus haut dans ce fichier). */

/* Lien de maillage vers le comparateur ville (hero) */
.ed-hero-compare { margin: 10px 0 0; }
.ed-hero-compare a {
  display: inline-flex; align-items: center; gap: 6px;
  font-weight: 600; font-size: .95rem;
  color: var(--ed-accent-deep);
  text-decoration: none;
  border-bottom: 1px solid transparent;
  transition: border-color .15s;
}
.ed-hero-compare a:hover { border-color: var(--ed-accent-deep); }
.ed-hero-compare svg { transition: transform .15s; }
.ed-hero-compare a:hover svg { transform: translateX(3px); }

/* ─── Bandeau de neutralite au-dessus de la grille (toutes les ecoles, pas de tri paye) ─── */
.ed-neutral-note {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin: 0 0 20px;
  padding: 12px 16px;
  background: var(--ed-accent-tint, rgba(14, 165, 233, 0.08));
  border: 1px solid var(--ed-line, #E6E2D7);
  border-radius: 12px;
  font-size: 0.875rem;
  line-height: 1.45;
  color: var(--ed-ink2, #3A4055);
}
.ed-neutral-note svg {
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
  color: var(--ed-accent-deep, #0284C7);
  margin-top: 1px;
}

/* ════════════════════════════════════════════════════════════
   SCROLL INFINI — sentinelle, loader, fin de liste, pagination sr-only
   (page /auto-ecoles/ ; classes nouvelles, aucun impact sur les autres
   pages qui chargent listing.css)
   ════════════════════════════════════════════════════════════ */
#aeSentinel { width: 100%; height: 1px; }

.ae-loader {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-3);
  padding: var(--space-8) var(--space-4);
  color: var(--gray-500);
  font-size: var(--text-sm);
  font-weight: var(--font-medium);
}
.ae-loader[hidden] { display: none; }
.ae-loader__spin {
  width: 22px;
  height: 22px;
  flex: none;
  border-radius: var(--radius-full);
  border: 2.5px solid var(--border-default);
  border-top-color: var(--color-primary);
  animation: ae-spin .7s linear infinite;
}
@keyframes ae-spin { to { transform: rotate(360deg); } }

.ae-end {
  padding: var(--space-8) var(--space-4) var(--space-4);
  text-align: center;
  color: var(--gray-400);
  font-size: var(--text-sm);
  font-weight: var(--font-medium);
}
.ae-end[hidden] { display: none; }

/* Pagination « fantôme » : conservée dans le DOM et explorable par Google, mais
   sortie du champ visuel quand le scroll infini prend le relais (classe ajoutée par
   le JS). Technique sr-only volontaire : pas de display:none, qui retirerait la nav
   du rendu. Scopée sous .ed-list pour battre `.ed-list .ed-pagination` en spécificité. */
.ed-list .ed-pagination--ghost {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

/* ════════════════════════ TOUTES LES VILLES (hub /auto-ecoles/villes/) ════════════════════════ */
/* Navigation rapide vers chaque departement, sous le H1 (acces direct, haut = action). */
.ed-list__villes-quicknav {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.ed-list__villes-quicknav a {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 16px;
  border-radius: 999px;
  border: 1px solid var(--ed-line, #E6E2D7);
  background: #fff;
  font-size: 13px;
  font-weight: 600;
  color: var(--ed-ink, #0D1220);
  text-decoration: none;
  transition: border-color 0.2s ease, transform 0.2s ease;
}
.ed-list__villes-quicknav a:hover {
  border-color: var(--ed-accent, #0EA5E9);
  transform: translateY(-1px);
}
.ed-list__villes-quicknav span {
  font-family: var(--ed-font-mono, 'Geist Mono', monospace);
  font-size: 11px;
  color: var(--ed-ink-muted, #9AA0B0);
}

.ed-list__villes-index {
  padding: 8px 0 64px;
}
.ed-list__villes-dept {
  margin-bottom: 44px;
}
.ed-list__villes-dept:last-child {
  margin-bottom: 0;
}
.ed-list__villes-dept h2 {
  font-size: clamp(1.35rem, 2.6vw, 1.75rem);
  font-weight: 400;
  margin: 0 0 18px;
  color: var(--ed-text-strong, #0f172a);
  display: flex;
  align-items: baseline;
  gap: 10px;
  flex-wrap: wrap;
}
.ed-list__villes-dept-count {
  font-family: var(--ed-font-mono, 'Geist Mono', monospace);
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.04em;
  color: var(--ed-ink-muted, #9AA0B0);
}
.ed-list__villes-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 10px;
  list-style: none;
  margin: 0;
  padding: 0;
}
.ed-list__villes-grid li {
  margin: 0;
}
.ed-list__villes-grid a {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 8px;
  padding: 13px 16px;
  border: 1px solid var(--ed-border, #e5e7eb);
  border-radius: 12px;
  background: #fff;
  text-decoration: none;
  color: inherit;
  transition: border-color 0.2s ease, transform 0.2s ease;
}
.ed-list__villes-grid a:hover {
  border-color: var(--ed-accent, #4f6bf6);
  transform: translateY(-1px);
}
.ed-list__villes-grid strong {
  font-weight: 600;
  color: var(--ed-text-strong, #0f172a);
  font-size: 0.95rem;
}
.ed-list__villes-grid span {
  font-size: 0.82rem;
  color: var(--ed-text-soft, #6b7280);
  white-space: nowrap;
}