/* Contenedor visual del mapa existente: conserva la identidad del sitio. */
.map-page .shade{background:linear-gradient(90deg,rgba(1,11,20,.76),rgba(1,11,20,.43) 58%,rgba(1,11,20,.55)),linear-gradient(0deg,rgba(1,9,15,.66),transparent 45%),linear-gradient(180deg,rgba(1,10,18,.42),transparent 37%)}
.map-main{width:100%;flex:1;padding:clamp(22px,3.5vh,42px) 3.3vw 28px}
.map-intro{display:flex;align-items:flex-end;justify-content:space-between;gap:30px;width:min(100%,760px);margin:0 auto 22px;touch-action:pan-y pinch-zoom}
.map-intro h1{font-size:clamp(52px,5.1vw,82px);font-weight:800;letter-spacing:-.055em;line-height:.95;margin:10px 0 13px}
.map-intro p{font-size:clamp(16px,1.15vw,20px);line-height:1.4;color:#eaf2f5;max-width:930px;margin:0}
.map-frame{position:relative;width:min(100%,760px);margin-inline:auto;border:1px solid rgba(171,219,227,.37);background:#07141b;box-shadow:0 16px 50px rgba(0,0,0,.25);overflow:hidden}
.map-frame iframe{display:block;width:100%;height:clamp(500px,55vh,560px);height:clamp(500px,55svh,560px);border:0;background:#07141b}
.map-status{position:absolute;left:12px;bottom:12px;max-width:calc(100% - 24px);margin:0;padding:9px 12px;border:1px solid rgba(113,237,240,.32);border-radius:6px;background:rgba(6,20,27,.91);color:#dcecef;font-size:12px;line-height:1.35;pointer-events:none}
.map-status[hidden]{display:none}
.map-alternative{width:min(100%,760px);margin:7px auto 0;text-align:right}
.map-alternative a{display:inline-flex;align-items:center;min-height:44px;color:var(--cyan);font-size:12px;text-decoration:underline;text-underline-offset:3px}
.map-footer{display:flex;align-items:center;gap:20px;padding:0 3.3vw calc(25px + env(safe-area-inset-bottom,0px));position:relative;color:#a5bec8;font-size:10px;letter-spacing:.12em}
.map-footer .territory-sign{color:#fff;letter-spacing:0}
.map-footer .scene-counter{color:#fff;letter-spacing:.02em}
.map-footer .footer-legend{margin-left:auto;align-self:flex-end}
@media(min-width:901px){
  .map-frame iframe{height:clamp(440px,50svh,560px)}
}
/* La composición editorial se mantiene estable al variar la altura desktop. */
@media(min-width:901px){
  .map-page .experience{height:100vh;height:100svh}
  @supports(height:100dvh){.map-page .experience{height:100dvh}}
  .map-main{min-height:0;display:grid;grid-template-columns:minmax(300px,1fr) minmax(0,760px);grid-template-rows:minmax(0,1fr) auto;column-gap:clamp(24px,3vw,50px);row-gap:4px;padding-top:22px;padding-bottom:20px}
  .map-intro{grid-column:1;grid-row:1/3;align-self:center;width:100%;margin:0}
  .map-frame{grid-column:2;grid-row:1;width:100%;height:100%;max-height:820px;min-height:0;align-self:end}
  .map-frame iframe{height:100%;min-height:0}
  .map-alternative{grid-column:2;grid-row:2;width:100%;margin:0}
  .map-footer{padding-bottom:calc(18px + env(safe-area-inset-bottom,0px))}
}
@media(min-width:901px) and (max-height:820px){
  .map-page .chrome{padding-top:14px}
  .map-page .journey-rail{margin-top:10px}
  .map-main{padding-top:18px;padding-bottom:16px}
}
/* Acerca el conjunto mapa/enlace al relato sin reducir el ancho del iframe. */
@media(min-width:1200px) and (max-width:1600px){
  .map-main{--map-gap:clamp(24px,3vw,50px);--map-shift:clamp(18px,calc(3vw - 16px),34px);column-gap:calc(var(--map-gap) - var(--map-shift));padding-right:calc(3.3vw + var(--map-shift))}
}
@media(min-width:1601px){
  .map-main{padding-right:calc(3.3vw + clamp(34px,calc(14vw - 190px),60px))}
}
@media(min-width:2001px){
  .map-main{max-width:2000px;margin:0 auto}
}
@media(max-width:1100px){
  .map-main{padding-left:24px;padding-right:24px}
  .map-footer{padding-left:24px;padding-right:24px}
}
@media(max-width:750px){
  .map-main{padding:24px 8px 18px}
  .map-intro{width:auto;margin:0 6px 11px}
  .map-intro h1{font-size:clamp(28px,7.5vw,34px);margin:6px 0 8px}
  .map-intro p{font-size:13px;line-height:1.32}
  .map-frame iframe{height:clamp(450px,calc(100svh - 390px),560px)}
  .map-footer{padding:0 12px calc(18px + env(safe-area-inset-bottom,0px))}
  .map-footer{gap:16px}
  .map-footer .footer-legend{display:none}
}
@media(max-width:950px) and (max-height:500px){
  .map-main{padding:12px 14px 18px}
  .map-intro{margin-bottom:9px}
  .map-intro h1{font-size:34px;margin:4px 0 6px}
  .map-intro p{font-size:12px;line-height:1.3}
  .map-frame iframe{height:420px}
  .map-footer{padding-bottom:calc(14px + env(safe-area-inset-bottom,0px))}
}
