.lieux{
  --night:#15141f; --night-3:#1d1b2b;
  --gold:#c2620e; --teal:#15897b;
  --ink:#2e1a12; --ink-soft:rgba(46,26,18,.62);
  --line:rgba(46,26,18,.12);
}
.places.lieux{
  background:
    radial-gradient(1100px 560px at 82% -12%, rgba(21,137,123,.10), transparent 58%),
    radial-gradient(860px 520px at -4% 110%, rgba(194,98,14,.12), transparent 56%),
    linear-gradient(168deg, #fdf8ee 0%, #f6ecd8 52%, #efe1c6 100%);
  color:var(--ink); padding:130px 36px 0px; position:relative; overflow:hidden;
}
.places.lieux .section-head, .places.lieux .map-wrap{position:relative; z-index:1}
.places.lieux .section-head .eyebrow{color:var(--gold)}
.places.lieux .section-head .eyebrow::before{background:var(--gold)}
.places.lieux .section-head h2{color:var(--ink)}
.places.lieux .section-head h2 .italic{color:var(--gold)}
.places.lieux .section-sub{color:var(--ink-soft)}
/* La carte déborde sur toute la largeur de la fenêtre (annule le padding latéral
   de 36px de la section, qui a overflow:hidden). On neutralise aussi les règles
   génériques .map-wrap / .map de styles.css (max-width, grille, bordure, radius…). */
.places.lieux .map-wrap{
  display:block; position:relative;
  max-width:none; margin:0 -36px;
}
.places.lieux .map{
  width:100%; aspect-ratio:auto; height:clamp(820px,94vh,1300px);
  overflow:hidden; position:relative;
  border:0; border-radius:0; box-shadow:none;
  /* Même crème que le style Google (FDM_MAP_STYLE) → aucune bordure ni limite perceptible. */
  background:#f3e7cf;
}
/* Mentions Google atténuées (logo + CGU) — minimisées sans être masquées, comme l'exigent
   les conditions d'utilisation de Google Maps. Reviennent lisibles au survol. */
.places.lieux .gm-style-cc{opacity:.32; transition:opacity .3s}
.places.lieux .map:hover .gm-style-cc{opacity:.85}
.places.lieux .gm-style img[alt="Google"]{opacity:.5; transition:opacity .3s}
.places.lieux .map:hover .gm-style img[alt="Google"]{opacity:.85}
.places-panel{
  position:absolute; top:24px; left:36px; z-index:6;
  width:350px; max-width:calc(100% - 72px);
  /* Plus opaque + bordure/ombre affirmées : se détache nettement de la carte claire. */
  background:rgba(252,246,233,.93); backdrop-filter:blur(16px) saturate(1.15);
  border:1px solid rgba(46,26,18,.16); border-radius:18px; overflow:hidden;
  box-shadow:0 24px 56px -26px rgba(46,26,18,.5);
}
.places-toggle{
  width:100%; display:flex; align-items:center; gap:12px; cursor:pointer;
  padding:16px 18px; background:transparent; border:0; color:var(--ink);
  font-family:var(--display); font-size:17px; font-weight:500; letter-spacing:-.01em;
}
.places-toggle__ico{flex:none; color:var(--gold)}
.places-toggle__label{flex:1; text-align:left}
.places-toggle__count{
  font-family:var(--mono); font-size:11px; font-weight:500; color:var(--gold);
  background:rgba(194,98,14,.12); padding:3px 9px; border-radius:999px; letter-spacing:.04em;
}
.places-toggle__chev{flex:none; color:var(--ink-soft); transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.places-panel.is-collapsed .places-toggle__chev{transform:rotate(-90deg)}
.places.lieux .places-list{
  gap:12px; padding:0 14px 14px;
  max-height:72vh; overflow-y:auto; overscroll-behavior:contain;
  transition:max-height .42s cubic-bezier(.2,.8,.2,1), opacity .3s, padding .42s;
}
.places-panel.is-collapsed .places-list{max-height:0; opacity:0; padding-top:0; padding-bottom:0; overflow:hidden}
.places.lieux .places-list::-webkit-scrollbar{width:6px}
.places.lieux .places-list::-webkit-scrollbar-thumb{background:rgba(46,26,18,.22); border-radius:999px}
.place-card{
  position:relative; display:grid; grid-template-columns:64px 1fr;
  align-items:center; gap:16px; text-align:left; cursor:pointer;
  padding:12px 16px 12px 12px; border-radius:16px;
  background:#fff; border:1px solid var(--line);
  color:var(--ink); overflow:hidden;
  box-shadow:0 8px 22px -16px rgba(46,26,18,.35);
  transition:transform .35s cubic-bezier(.2,.8,.2,1), background .3s, border-color .3s, box-shadow .35s;
}
.place-card__thumb{
  width:64px; align-self:stretch; height:auto; min-height:64px; border-radius:0;
  margin:-12px 0 -12px -12px; object-fit:cover; display:block;
  filter:grayscale(.3); transition:filter .4s, transform .5s;
}
.place-card__body{min-width:0}
.place-card__body strong{
  display:block; font-family:var(--display); font-size:19px; font-weight:500;
  letter-spacing:-.01em; line-height:1.15; margin-bottom:3px;
}
.place-card__body em{
  font-style:italic; font-size:12.5px; color:var(--ink-soft);
  font-family:var(--display); line-height:1.35; display:block;
}
.place-card:hover{
  border-color:rgba(194,98,14,.4); transform:translateX(5px);
  box-shadow:0 16px 34px -20px rgba(46,26,18,.45);
}
.place-card:hover .place-card__thumb{filter:grayscale(0); transform:scale(1.04)}
.place-card.active{
  background:linear-gradient(100deg, rgba(194,98,14,.10), rgba(21,137,123,.06));
  border-color:rgba(194,98,14,.55);
  box-shadow:0 18px 38px -22px rgba(194,98,14,.5);
}
.place-card.active .place-card__thumb{filter:grayscale(0)}
.photo-pin{
  position:absolute; transform:translate(-50%,-100%); cursor:pointer;
  --c:var(--pin,#f2c14e); will-change:transform; z-index:5;
  animation:pinDrop .6s cubic-bezier(.2,1.2,.4,1) backwards;
}
.photo-pin__img{
  display:block; width:46px; height:46px; border-radius:50%;
  background-size:cover; background-position:center;
  border:3px solid var(--c);
  box-shadow:0 6px 16px -4px rgba(0,0,0,.7), 0 0 0 2px rgba(13,12,22,.9);
  transition:transform .3s cubic-bezier(.2,1.4,.4,1), box-shadow .3s, width .3s, height .3s;
}
.photo-pin::after{
  content:""; position:absolute; left:50%; bottom:-7px; transform:translateX(-50%);
  width:0; height:0; border-left:7px solid transparent; border-right:7px solid transparent;
  border-top:9px solid var(--c); filter:drop-shadow(0 3px 2px rgba(0,0,0,.5));
}
.photo-pin:hover .photo-pin__img{transform:scale(1.08)}
.photo-pin.is-active{z-index:20}
.photo-pin.is-active .photo-pin__img{
  width:58px; height:58px;
  box-shadow:0 8px 22px -4px rgba(0,0,0,.75), 0 0 0 3px rgba(13,12,22,.95), 0 0 26px 2px var(--c);
}
@keyframes pinDrop{
  0%{opacity:0; transform:translate(-50%,-160%)}
  60%{opacity:1}
  100%{opacity:1; transform:translate(-50%,-100%)}
}
/* InfoWindow : bulle entièrement sombre, sans la barre claire d'en-tête.
   Le bouton X (en-tête .gm-style-iw-chr des versions récentes) est sorti du flux
   et posé en overlay rond sur l'image, pour que le contenu démarre tout en haut. */
.gm-style .gm-style-iw-c{
  background:#15141f !important; padding:0 !important; border-radius:16px !important;
  box-shadow:0 24px 60px -20px rgba(0,0,0,.8) !important; border:1px solid rgba(46,26,18,.5) !important;
  overflow:hidden !important; max-width:88vw !important;
}
.gm-style .gm-style-iw-d{overflow:hidden !important; background:#15141f; max-width:none !important; padding:0 !important}
.gm-style .gm-style-iw-chr{position:absolute; top:0; right:0; height:0 !important; min-height:0 !important; z-index:5; background:transparent !important}
.gm-style .gm-style-iw-chr button{
  width:30px !important; height:30px !important; min-width:0 !important; min-height:0 !important;
  margin:8px !important; padding:0 !important; background:rgba(0,0,0,.5) !important; border-radius:50% !important;
}
.gm-style .gm-style-iw-chr button span{margin:7px auto !important; filter:invert(1) brightness(2)}
.gm-style .gm-style-iw-tc::after{background:#15141f !important}
@media (max-width:920px){
  /* Carte agrandie : occupe l'essentiel de l'écran ; le panneau (replié par défaut)
     ne masque qu'un petit bandeau en haut. */
  .places.lieux{padding-top:96px}
  .places.lieux .map{height:clamp(640px,90vh,1000px)}
  .places-panel{width:auto; top:16px; left:16px; right:16px; max-width:none}
  .places-toggle{padding:14px 16px; font-size:16px}
}
