/* Mapa embutido — unidades / página Onde estamos */

.locations-map-block{
  margin-top:42px;
}

.locations-map{
  width:100%;
  height:min(460px,68vw);
  border:1px solid rgba(255,255,255,.18);
  background:#054d70;
  overflow:hidden;
}

.locations-map--page{
  height:min(640px,78vh);
  border:1px solid var(--line,#dce2e1);
  background:#e8f2f6;
}

.jarjour-map-fallback{
  margin:0;
  padding:40px 28px;
  color:#dff4fc;
  font-size:15px;
  line-height:1.55;
  max-width:42ch;
}

.locations-map--page .jarjour-map-fallback{
  color:var(--muted,#64727a);
}

.jarjour-map-pin{
  width:54px;
  height:54px;
  padding:0;
  border:0;
  background:transparent;
  cursor:pointer;
  filter:drop-shadow(0 8px 14px rgba(0,20,30,.35));
  transform:translateY(-6px);
}

.jarjour-map-pin-face{
  display:grid;
  place-items:center;
  width:54px;
  height:54px;
  border-radius:50% 50% 50% 4px;
  transform:rotate(-45deg);
  background:#fff;
  border:3px solid var(--red,#ec273d);
  box-sizing:border-box;
}

.jarjour-map-pin-face img{
  display:block;
  width:34px;
  height:auto;
  transform:rotate(45deg);
  pointer-events:none;
}

.jarjour-map-pin:focus-visible{
  outline:2px solid #78d1ed;
  outline-offset:4px;
}

.jarjour-map-info{
  display:grid;
  gap:4px;
  min-width:160px;
  font-family:"DM Sans",sans-serif;
  color:#18262e;
}

.jarjour-map-info strong{
  font:700 15px/1.2 Outfit,sans-serif;
}

.jarjour-map-info span{
  font-size:12px;
  color:#64727a;
}

.jarjour-map-info a{
  margin-top:6px;
  color:#0875a9;
  font-size:13px;
  font-weight:600;
  text-decoration:none;
}

.location-list article[data-map-branch]{
  cursor:pointer;
}

/* Página Onde estamos */
.map-page .map-hero{
  background:linear-gradient(105deg,#075273 0%,#0875a9 55%,#0a6a98 100%);
  color:#fff;
  padding:110px 0 72px;
}

.map-page .map-hero h1{
  font:700 58px/.96 Outfit,sans-serif;
  margin:0;
  letter-spacing:-2.2px;
}

.map-page .map-hero h1 em{
  color:#78d1ed;
  font-style:normal;
}

.map-page .map-hero > .wrap > p:not(.eyebrow){
  margin:20px 0 0;
  max-width:46ch;
  font-size:17px;
  line-height:1.55;
  color:#dff4fc;
}

.map-page-body{
  padding-top:64px;
  padding-bottom:96px;
  background:var(--cream,#f7f6f1);
}

.map-page-layout{
  display:grid;
  grid-template-columns:minmax(260px,.85fr) 1.35fr;
  gap:36px;
  align-items:start;
}

.map-branches h2{
  font:700 42px/.98 Outfit,sans-serif;
  margin:0 0 28px;
  letter-spacing:-1.6px;
}

.map-branches h2 em{
  color:var(--red);
  font-style:normal;
}

.map-branches .location-list{
  margin-bottom:28px;
}

.map-branches .location-list article{
  border-bottom:1px solid var(--line,#dce2e1);
  background:transparent;
  grid-template-columns:1fr 30px;
  min-height:88px;
  padding:16px 12px 16px 20px;
  color:var(--ink,#18262e);
  box-sizing:border-box;
}

.map-branches .location-list h3{
  color:var(--ink,#18262e);
}

.map-branches .location-list p{
  color:var(--muted,#64727a);
}

.map-branches .location-list a{
  color:var(--blue,#0875a9);
}

.map-branches .location-list article.is-active{
  background:#fff;
  box-shadow:inset 3px 0 0 var(--red);
  padding-left:22px;
}

.map-branches-actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  align-items:center;
}

.map-branches .button{
  display:inline-flex;
  align-items:center;
  gap:8px;
  background:var(--red);
  color:#fff;
  text-decoration:none;
  border:0;
  cursor:pointer;
  padding:15px 19px;
  border-radius:3px;
  font:700 11px/1.25 "DM Sans",sans-serif;
  letter-spacing:1.2px;
  text-transform:uppercase;
}

.map-branches .button.outline-map{
  background:transparent;
  color:var(--blue,#0875a9);
  border:2px solid var(--blue,#0875a9);
}

.map-branches .button.outline-map:hover,
.map-branches .button.outline-map:focus-visible{
  background:var(--blue,#0875a9);
  color:#fff;
}

.map-stage .map-hint{
  margin:12px 0 0;
  font-size:13px;
  color:var(--muted,#64727a);
}

@media (max-width:800px){
  .locations-map-block{margin-top:28px}
  .locations-map{height:320px}
  .locations-map--page{height:380px}

  .map-page .map-hero{
    padding:92px 0 52px;
  }
  .map-page .map-hero h1{font-size:42px;letter-spacing:-1.6px}
  .map-page-body{padding:48px 0 72px}
  .map-page-layout{
    grid-template-columns:1fr;
    gap:28px;
  }
  .map-branches h2{font-size:34px;margin-bottom:20px}
  .map-stage{order:-1}
}