.mapa-demo { padding: 60px clamp(20px,4vw,64px); max-width: 1600px; margin-inline: auto; color: #5b5a5b; }
.mapa-demo__composicion { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:32px; align-items:center; }
.mapa-demo__texto,.mapa-demo__columna { min-width:0; }
.mapa-demo__texto { padding:clamp(0px,2vw,30px); }
.mapa-demo__texto .mapa-demo__titulo { font:300 clamp(30px,3vw,48px)/1.15 'Hanken Grotesk',sans-serif; margin:0 0 28px; overflow-wrap:break-word; }
.mapa-demo__texto p { font:400 18px/1.65 Roboto,sans-serif; margin:0 0 22px; }
.mapa-demo__texto .mapa-demo__invitacion { font:500 16px/1.5 'Hanken Grotesk',sans-serif; }
.mapa-demo__contenedor { position:relative; isolation:isolate; }
.mapa-demo__lienzo { height:clamp(460px,65vh,620px); border-radius:8px; background:#e9e6df; z-index:0; font-family:Roboto,sans-serif; }
.mapa-demo button { min-height:44px; border:1px solid #ddd5ce; background:white; border-radius:6px; padding:8px 12px; color:#5b5a5b; font:500 13px/1.3 'Hanken Grotesk',sans-serif; cursor:pointer; }
.mapa-demo button:hover:not(:disabled),.mapa-demo button[aria-pressed=true] { color:#9d4800; border-color:#f77900; background:#fff4e9; }
.mapa-demo button:focus-visible,.mapa-demo__marcador:focus-visible,.mapa-demo__grupo:focus-visible,.mapa-demo__lienzo:focus-visible { outline:3px solid #f77900; outline-offset:3px; }
.mapa-demo button:disabled { opacity:.65; cursor:wait; }
.mapa-demo__barra { position:absolute; z-index:600; top:12px; left:12px; right:12px; display:flex; flex-wrap:wrap; gap:6px; pointer-events:none; }
.mapa-demo__barra button { pointer-events:auto; box-shadow:0 1px 5px #5b5a5b20; }
.mapa-demo__regiones { display:flex; gap:6px; }
.mapa-demo .mapa-demo__reproduccion { font-size:12px; }
.mapa-demo__tarjeta { position:absolute; z-index:610; bottom:28px; right:12px; width:min(280px,calc(100% - 24px)); padding:16px; border:1px solid #e8e1db; border-radius:8px; background:#fff; box-shadow:0 3px 14px #30272020; box-sizing:border-box; max-height:calc(100% - 130px); overflow-y:auto; }
.mapa-demo__tarjeta[data-lado=izquierda] { right:auto; left:12px; bottom:90px; }
.mapa-demo__tarjeta[hidden],.mapa-demo__portada[hidden],.mapa-demo__enlace[hidden],.mapa-demo__lista[hidden] { display:none; }
.mapa-demo .mapa-demo__cerrar { position:absolute; top:4px; right:4px; width:44px; font:300 26px/1 'Hanken Grotesk',sans-serif; z-index:1; border:0; background:#ffffffed; }
.mapa-demo__tarjeta h2 { font:500 21px/1.25 'Hanken Grotesk',sans-serif; margin:8px 28px 8px 0; overflow-wrap:break-word; }
.mapa-demo__tarjeta p { font:400 14px/1.5 Roboto,sans-serif; margin:0; }
.mapa-demo__tarjeta p:empty { display:none; }
.mapa-demo__portada { margin:0 0 12px; }
.mapa-demo__portada img { display:block; width:100%; height:140px; object-fit:contain; background:#f4eee9; border-radius:4px; }
.mapa-demo__enlace { display:inline-flex; align-items:center; min-height:44px; color:#9d4800; font:600 14px 'Hanken Grotesk',sans-serif; }
.mapa-demo__lista { display:flex; flex-direction:column; gap:6px; margin-top:12px; max-height:180px; overflow-y:auto; }
.mapa-demo__marcador { background:transparent; border:0; filter:drop-shadow(0 1px 3px #30272080); }
.mapa-demo__marcador img { display:block; width:100%; height:100%; }
.mapa-demo__marcador.is-seleccionado { border-radius:50%; outline:2px solid #5b5a5b; outline-offset:2px; }
.mapa-demo__grupo { display:grid; place-items:center; border-radius:50%; border:3px solid white; background:#f77900; color:#331900; box-shadow:0 1px 5px #5b5a5b66; font:700 15px/1 Roboto,sans-serif; }
.mapa-demo__grupo.is-seleccionado { outline:3px solid #5b5a5b; outline-offset:2px; }
.mapa-demo .mapa-demo__etiqueta-marcador { width:max-content; max-width:190px; white-space:normal; text-align:center; padding:6px 10px; color:#5b5a5b; border:1px solid #e1d8cf; border-radius:5px; background:white; font:600 13px/1.4 'Hanken Grotesk',sans-serif; box-shadow:0 2px 6px #5b5a5b26; pointer-events:none; }
.mapa-demo__congelado { position:absolute; inset:0; z-index:500; pointer-events:none; background:#e9e6df; opacity:1; transition:opacity .18s ease-out; }
.mapa-demo__congelado.is-listo { opacity:0; }
.mapa-demo__lienzo .leaflet-control-zoom a { color:#f77900; }
.mapa-demo__lienzo .leaflet-control-attribution { max-width:100%; font:400 11px/1.5 Roboto,sans-serif; }
.mapa-demo__lienzo .leaflet-control-attribution a { color:#5b5a5b; text-decoration:underline; }
.mapa-demo__sr { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.mapa-demo .mapa-demo__explorar { display:none; width:100%; margin-bottom:10px; }
.mapa-demo__error { padding:12px; border-left:3px solid #f77900; background:#fff4e9; }
@media(max-width:767px) {
 .mapa-demo { padding-block:30px; }
 .mapa-demo__composicion { grid-template-columns:minmax(0,1fr); gap:20px; }
 .mapa-demo__texto { padding:0; }
 .mapa-demo__texto p { font-size:16px; }
 .mapa-demo__lienzo { height:480px; touch-action:pan-y; }
 .mapa-demo__lienzo.is-interactivo { touch-action:none; }
 .mapa-demo .mapa-demo__explorar { display:block; }
 .mapa-demo__barra { top:8px; left:8px; right:8px; }
 .mapa-demo__regiones { width:100%; }
 .mapa-demo__regiones button { flex:1; padding:6px; font-size:12px; }
 .mapa-demo__tarjeta,.mapa-demo__tarjeta[data-lado=izquierda] { bottom:28px; left:auto; right:8px; width:min(280px,calc(100% - 56px)); padding:12px; max-height:calc(100% - 140px); }
 .mapa-demo__portada img { height:100px; }
}
@media(prefers-reduced-motion:reduce) { .mapa-demo__congelado,.mapa-demo .leaflet-tile,.mapa-demo .leaflet-zoom-animated { transition:none!important; animation:none!important; } }