/* ============================================================
   mapa.css — mapa interactivo del diagnóstico (derramepleural.com)
   ============================================================ */
.mapa-wrap{margin:1.8rem 0 2.2rem;width:min(62rem,calc(100vw - 2.8rem));margin-left:calc(50% - min(31rem,calc(50vw - 1.4rem)))}
.mapa-barra{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;margin:0 0 .8rem}
.mapa-barra button{font:inherit;font-size:.98rem;padding:.55rem .95rem;border:2px solid #123338;background:#FFF;color:#123338;cursor:pointer;border-radius:2px}
.mapa-barra button:hover,.mapa-barra button:focus-visible{background:#123338;color:#FFF;outline:none}
.mapa-barra .pista{font-size:.95rem;color:#2C3A3D;margin-left:auto}
.mapa{display:grid;gap:1.2rem;grid-template-columns:1fr}
@media(min-width:56rem){.mapa{grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);align-items:start}}
.mapa-svg{background:#FBFAF6;border:1px solid #CFCABD;padding:.5rem}
.mapa-svg svg{display:block;width:100%;height:auto}
.nodo{cursor:pointer}
.nodo rect{fill:#FFF;stroke:#123338;stroke-width:2;transition:fill .15s,stroke-width .15s}
.nodo.salida rect{fill:#F7E8CB;stroke:#B87A1E}
.nodo .t{font:600 17px "Source Sans 3",system-ui,sans-serif;fill:#0A0F11}
.nodo .s{font:400 14px "Source Sans 3",system-ui,sans-serif;fill:#2C3A3D}
.nodo .num{font:700 13px "Source Sans 3",system-ui,sans-serif;fill:#FFF}
.nodo .num-c{fill:#123338}
.nodo:hover rect,.nodo:focus-visible rect{stroke-width:3.5}
.nodo:focus{outline:none}
.nodo:focus-visible rect{stroke:#B87A1E}
.nodo.ruta rect{stroke:#B87A1E;stroke-width:3.5}
.nodo.activo rect{fill:#123338;stroke:#B87A1E;stroke-width:4}
.nodo.activo .t,.nodo.activo .s{fill:#FFF}
.nodo.activo .num-c{fill:#B87A1E}
.flecha{stroke:#7C8D90;stroke-width:2;fill:none}
.flecha.ruta{stroke:#B87A1E;stroke-width:3.5}
.et-flecha{font:italic 600 13px "Source Sans 3",system-ui,sans-serif;fill:#6E4306}
.mapa-panel{background:#F7F4EC;border:1px solid #CFCABD;padding:1.2rem 1.3rem 1.4rem}
@media(min-width:56rem){.mapa-panel{position:sticky;top:calc(var(--alto-barra,4.6rem) + 1rem);max-height:calc(100vh - var(--alto-barra,4.6rem) - 2rem);overflow-y:auto}}
.paso{scroll-margin-top:calc(var(--alto-barra,4.6rem) + 1rem)}
.paso+.paso{margin-top:2rem;padding-top:1.6rem;border-top:1px solid #CFCABD}
.paso .etapa{display:block;font-size:.8rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#6E4306;margin:0 0 .3rem}
.paso h3{font-family:"Newsreader",Georgia,serif;font-weight:400;font-size:1.65rem;line-height:1.15;margin:0 0 .8rem;color:#123338}
.paso p{font-size:1.08rem;line-height:1.55;margin:0 0 .8rem}
.paso figure{margin:1rem 0;background:#FFF;border:1px solid #CFCABD;padding:.6rem}
.paso figure img{display:block;width:100%;height:auto}
.paso figcaption{font-size:.95rem;color:#2C3A3D;margin-top:.5rem;line-height:1.4}
.paso .esquema{margin:1rem 0}
.paso .ir{list-style:none;padding:0;margin:1rem 0 0;border-top:2px solid #123338}
.paso .ir li{border-bottom:1px solid #CFCABD}
.paso .ir a{display:block;padding:.65rem .2rem;text-decoration:none;color:#123338;font-weight:600;font-size:1.02rem}
.paso .ir a::after{content:" \2192";color:#B87A1E}
.paso .ir a:hover{background:#FFF}
.paso .alerta{background:#FFF;border-left:4px solid #7A2418;padding:.7rem .9rem;font-size:1rem}
.paso-nav{display:none}
.mapa-js .paso{display:none}
.mapa-js .paso.visible{display:block;margin:0;padding:0;border:0}
.mapa-js .paso-nav{display:flex;gap:.5rem;margin-top:1.2rem;flex-wrap:wrap}
.paso-nav button{flex:1 1 auto;font:inherit;font-size:.98rem;padding:.65rem .8rem;border:2px solid #123338;background:#FFF;color:#123338;cursor:pointer}
.paso-nav button:hover,.paso-nav button:focus-visible{background:#123338;color:#FFF;outline:none}
.paso-nav button[disabled]{opacity:.35;cursor:default;background:#FFF;color:#123338}
.paso-nav .al-mapa{flex-basis:100%}
@media(min-width:56rem){.paso-nav .al-mapa{display:none}}
.mapa-wrap:fullscreen{background:#F7F4EC;padding:1.2rem;margin:0;width:100%;overflow:auto}
.mapa-wrap:fullscreen .mapa{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.mapa-wrap:fullscreen .mapa-svg svg{max-height:calc(100vh - 6rem);width:auto;margin:0 auto}
.mapa-wrap:fullscreen .mapa-panel{position:static;max-height:calc(100vh - 6rem)}
.mapa-wrap:fullscreen .paso p{font-size:1.2rem}
@media print{.mapa-barra,.paso-nav{display:none}.mapa-js .paso{display:block}}