/* Ficha "Dónde estamos" — sustituye al iframe de Google Maps (13-ago-2026).
   El embed cargaba maps.google.com al abrir la página, enviando la IP del visitante a
   Google antes de que el banner de cookies preguntara nada. Aquí el mapa es una imagen
   de OpenStreetMap guardada en el repo, así que al cargar no se pide nada a ningún
   tercero: solo se sale fuera cuando el visitante pulsa, y en móvil eso abre la app de
   mapas con la ruta ya puesta.

   img/mapa/santa-cruz-santiago-109.png son doce teselas de zoom 16 compuestas en una
   sola imagen de 976x666 CENTRADA EXACTAMENTE en la tienda (28.474976, -16.248267).
   Ese centrado es lo que permite usar background-size:cover con position:center y que
   la chincheta caiga siempre en el centro, sea cual sea el ancho del contenedor: por
   eso el pin va en 50%/50% y no en coordenadas fijas. Si se regenera la imagen, hay
   que mantener el punto en el centro.

   Atribución a OpenStreetMap obligatoria (ODbL): no quitar .bm-mapa-attr.
   La usan index.html y contacto.html. */

.bm-mapa{
  position:relative;overflow:hidden;height:100%;min-height:340px;
  background:#e8e2dc url("../img/mapa/santa-cruz-santiago-109.png") center/cover no-repeat;
  font-family:'DM Sans',-apple-system,sans-serif;color:#1f3d87;
}
/* Velo claro para que el texto de la ficha se lea sobre el callejero. */
.bm-mapa::after{
  content:'';position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(100deg,rgba(235,244,255,.94) 0%,rgba(235,244,255,.86) 38%,rgba(211,233,248,.34) 66%,rgba(211,233,248,.12) 100%);
}
@media(max-width:800px){
  .bm-mapa::after{background:linear-gradient(180deg,rgba(235,244,255,.93) 0%,rgba(235,244,255,.8) 55%,rgba(211,233,248,.28) 100%)}
}
/* Chincheta: centro exacto del contenedor, que es donde cae la tienda (ver cabecera).
   El margen la sube para que la punta, y no el centro del icono, marque el sitio. */
.bm-mapa-pin{
  position:absolute;top:50%;left:50%;margin:-34px 0 0 -14px;
  width:28px;height:34px;color:#c0392b;z-index:2;
  filter:drop-shadow(0 4px 8px rgba(31,61,135,.4));
}
.bm-mapa-ficha{
  position:relative;z-index:3;height:100%;
  display:flex;flex-direction:column;justify-content:center;
  gap:14px;padding:44px 46px;max-width:430px;
}
.bm-mapa-ficha h3{
  font-family:'DM Sans',sans-serif;font-weight:500;font-size:25px;line-height:1.15;margin:0;color:#1f3d87;
}
.bm-mapa-datos{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:11px}
.bm-mapa-datos li{display:flex;gap:11px;align-items:flex-start;font-size:15px;line-height:1.5;color:#1f3d87}
.bm-mapa-datos svg{width:17px;height:17px;flex-shrink:0;margin-top:3px;color:#417bbe}
.bm-mapa-datos a{color:#1f3d87;text-decoration:none;border-bottom:1px solid rgba(65,123,190,.45)}
.bm-mapa-datos a:hover{color:#417bbe;border-bottom-color:#417bbe}
.bm-mapa-datos small{display:block;font-size:13.5px;font-weight:300;opacity:.75}
.bm-mapa-btn{
  align-self:flex-start;display:inline-flex;align-items:center;gap:9px;
  margin-top:4px;padding:13px 30px;border-radius:60px;
  background:#417bbe;color:#fff;text-decoration:none;
  font-size:14.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
  transition:background .2s;
}
.bm-mapa-btn:hover,.bm-mapa-btn:focus-visible{background:#1f3d87;color:#fff}
.bm-mapa-btn svg{width:15px;height:15px;flex-shrink:0}
/* Atribución ODbL: obligatoria mientras se muestre el mapa. */
.bm-mapa-attr{
  position:absolute;right:0;bottom:0;z-index:4;margin:0;
  padding:3px 8px;background:rgba(255,255,255,.82);
  font-size:10.5px;line-height:1.4;color:#5f7a96;
}
.bm-mapa-attr a{color:#417bbe;text-decoration:none}
.bm-mapa-attr a:hover{text-decoration:underline}
.bm-mapa-alt{
  text-align:center;padding:12px 16px;
  font-family:'DM Sans',-apple-system,sans-serif;font-size:13.5px;color:#687686;
}
.bm-mapa-alt a{color:#417bbe;text-decoration:underline;text-underline-offset:2px}
.bm-mapa-alt a:hover{color:#1f3d87}
@media(max-width:600px){
  .bm-mapa{min-height:390px}
  .bm-mapa-ficha{padding:30px 20px;gap:12px;max-width:none}
  .bm-mapa-ficha h3{font-size:21px}
  .bm-mapa-datos li{font-size:14.5px}
}