
:root{--bg:#eef3f2;--panel:#fff;--ink:#12302f;--mute:#4f6b69;--line:#cddad8;--accent:#1f6f8b;--accent-ink:#fff;--hi:#ff8a1f;--hi-ink:#2b1200;--bad:#b3261e;--head:#12302f;--head-ink:#fff;--g:#1d7a4a;--y:#b07d00;--r:#b3261e}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--bg:#0f1c1c;--panel:#162827;--ink:#e6f0ef;--mute:#9db7b4;--line:#2b4543;--accent:#5bb4d0;--accent-ink:#06222b;--bad:#ff8a80;--head:#0a1414;--g:#58c98a;--y:#f2b632;--r:#ff8a80}}
:root[data-theme="dark"]{--bg:#0f1c1c;--panel:#162827;--ink:#e6f0ef;--mute:#9db7b4;--line:#2b4543;--accent:#5bb4d0;--accent-ink:#06222b;--bad:#ff8a80;--head:#0a1414;--g:#58c98a;--y:#f2b632;--r:#ff8a80}
:root{box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);background:var(--head);z-index:1999}
#guia .hero-img{display:block;width:100%;height:auto;border-radius:0 0 16px 16px}
#guia .crumb{font-size:.85rem;color:var(--mute);margin:1.2rem 0 .4rem}
#guia #guia .lead{font-size:1.15rem;color:var(--mute);max-width:60ch;margin:0 0 .8rem}
#guia .meta{font-size:.85rem;color:var(--mute)}
#guia .toc{background:var(--panel);border:1.5px solid var(--line);border-radius:14px;padding:1rem 1.3rem;margin:1.5rem 0}
#guia .toc b{display:block;margin-bottom:.3rem}
#guia .toc ol{margin:0;padding-left:1.2rem;columns:2 240px}
#guia .toc a{text-decoration:none}
#guia article section{margin:2.6rem 0}
#guia h2{font-size:1.65rem;line-height:1.2;margin:0 0 .6rem;letter-spacing:-.01em}
#guia h3{font-size:1.1rem;margin:1.4rem 0 .3rem}
#guia p,#guia ul,#guia ol{max-width:68ch}
#guia li{margin:.25rem 0}
#guia .tw{overflow-x:auto;margin:1rem 0;background:var(--panel);border:1.5px solid var(--line);border-radius:12px}
#guia table{border-collapse:collapse;width:100%;min-width:600px;font-size:.92rem;line-height:1.45}
#guia th,#guia td{text-align:left;padding:.6rem .8rem;border-bottom:1px solid var(--line);vertical-align:top}
#guia tr:last-child td{border-bottom:0}
#guia th{background:var(--bg)}
#guia .tip{border-left:4px solid var(--hi);padding:.5rem 1rem;background:var(--panel);border-radius:0 10px 10px 0;margin:1.1rem 0;max-width:68ch}
#guia .types{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:.8rem;margin:1rem 0}
#guia .types figure{margin:0;background:var(--panel);border:1.5px solid var(--line);border-radius:12px;padding:.8rem;text-align:center}
#guia .types svg{width:100%;height:auto;color:var(--accent)}
#guia .types figcaption{font-weight:600;font-size:.92rem}
#guia .types small{display:block;font-weight:400;color:var(--mute);font-size:.8rem;line-height:1.35}
#guia .tool{background:var(--panel);border:1.5px solid var(--line);border-radius:14px;padding:1.2rem;margin:1.2rem 0}
#guia .grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:.8rem 1rem}
#guia label{display:flex;flex-direction:column;gap:.25rem;font-size:.86rem;font-weight:600}
#guia input{font:inherit;padding:.5rem .6rem;border:1.5px solid var(--line);border-radius:8px;background:var(--bg);color:var(--ink);width:100%}
#guia .out{margin-top:1.1rem;background:var(--hi);color:var(--hi-ink);border-radius:10px;padding:1rem 1.1rem}
#guia .out .big{font-size:1.5rem;font-weight:800;line-height:1.2}
#guia .out p{margin:.3rem 0 0;font-size:.92rem}
#guia .tag{display:inline-block;font-weight:700;font-size:.8rem;padding:.1rem .55rem;border-radius:999px;border:1.5px solid currentColor;white-space:nowrap}
#guia .g{color:var(--g)}.y{color:var(--y)}.r{color:var(--r)}
#guia .note{font-size:.84rem;color:var(--mute)}
#guia .cta{display:flex;gap:1rem;align-items:center;justify-content:space-between;flex-wrap:wrap;background:var(--head);color:var(--head-ink);border-radius:14px;padding:1.3rem}
#guia .cta a.b{background:var(--hi);color:var(--hi-ink);text-decoration:none;font-weight:700;padding:.65rem 1.1rem;border-radius:999px}
#guia .src li{font-size:.88rem}
#guia{font-size:17px;line-height:1.7}
#guia a{color:var(--accent)}
#guia .hero-img{margin:0 -1.1rem}

*{box-sizing:border-box}
html{scroll-padding-top:5rem}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.6 "Bricolage Grotesque",system-ui,-apple-system,"Segoe UI",sans-serif}
.wrap{max-width:880px;margin:0 auto;padding:0 1.1rem}
:focus-visible{outline:3px solid var(--hi);outline-offset:2px}
/* cabecera */
.top{background:var(--head);color:var(--head-ink);position:sticky;top:env(safe-area-inset-top,0px);z-index:2000}
.top .wrap{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;padding-top:.7rem;padding-bottom:.7rem}
.logo{display:flex;align-items:center;gap:.6rem;color:inherit;text-decoration:none}
.logo svg{width:46px;height:46px;flex:none}
.logo b{font-size:1.45rem;font-weight:800;letter-spacing:-.02em;line-height:1}
.logo b span{font-weight:400;opacity:.85}
.logo small{display:block;font-size:.72rem;opacity:.7;font-weight:400;letter-spacing:.01em;margin-top:.15rem}
.top nav{display:flex;gap:.3rem}
.top nav a{color:inherit;text-decoration:none;font-weight:600;padding:.45rem .9rem;border-radius:999px;border:1.5px solid transparent}
.top nav a[aria-current=page]{color:var(--hi)}
.top nav a:not([aria-current]):hover{border-color:rgba(255,255,255,.4)}
/* portada */
h1{font-size:clamp(1.8rem,5vw,2.8rem);line-height:1.08;font-weight:800;margin:0 0 .6rem;letter-spacing:-.02em;max-width:20ch}
/* portada */
.home{background:var(--head);color:var(--head-ink);border-radius:18px;margin:1.2rem 0 0;min-height:min(68vh,560px);display:flex;align-items:center;justify-content:center;padding:2rem 1rem;text-align:center}
.sh{font-size:1.6rem;margin:1.6rem 0 0}
#guia{margin-top:1.4rem}
#guia .art-title{font-size:clamp(1.9rem,5vw,2.6rem);line-height:1.1;font-weight:800;margin:0 0 .7rem;letter-spacing:-.02em}
/* secciones */
.sec[hidden]{display:none}
.sub{display:flex;gap:.4rem;flex-wrap:wrap;margin:1.2rem 0 1rem}
.sub button{font:inherit;font-weight:600;padding:.5rem .9rem;border-radius:999px;border:1.5px solid var(--line);background:var(--panel);color:var(--ink);cursor:pointer}
.sub button[aria-selected=true]{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.card{background:var(--panel);border:1.5px solid var(--line);border-radius:14px;padding:1.3rem;margin-bottom:1rem}
.card[hidden]{display:none}
h2{margin:0 0 .3rem;font-size:1.4rem;line-height:1.2}
h3{margin:1.2rem 0 .3rem;font-size:1.05rem}
.lead{margin:0 0 1.1rem;color:var(--mute);font-size:.95rem}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:.8rem 1rem}
label{display:flex;flex-direction:column;gap:.25rem;font-size:.88rem;font-weight:600}
input,select{font:inherit;padding:.55rem .65rem;border:1.5px solid var(--line);border-radius:8px;background:var(--bg);color:var(--ink);width:100%}
.out{margin-top:1.2rem;background:var(--hi);color:var(--hi-ink);border-radius:10px;padding:1rem 1.1rem}
.out .big{font-size:2rem;font-weight:800;line-height:1.1}
.out p{margin:.3rem 0 0;font-size:.92rem}
.bar{height:12px;border-radius:6px;background:rgba(0,0,0,.18);margin-top:.7rem;overflow:hidden}
.bar i{display:block;height:100%;background:var(--hi-ink);width:0;transition:width .25s}
.warn{color:var(--bad);font-weight:600}
.out .warn{color:#7a1410}
.note{font-size:.82rem;color:var(--mute);margin:.9rem 0 0}
/* guías */
.gl{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:.8rem;margin-bottom:1rem}
.gl a{display:block;background:var(--panel);border:1.5px solid var(--line);border-radius:12px;padding:1rem;color:inherit;text-decoration:none}
.gl a:hover{border-color:var(--accent)}
.gl strong{display:block;margin-bottom:.2rem}
.gl span{font-size:.88rem;color:var(--mute)}
.card p{margin:.5rem 0;max-width:68ch}
.card ul{margin:.5rem 0;padding-left:1.2rem;max-width:68ch}
.tw{overflow-x:auto;margin:.8rem 0}
table{border-collapse:collapse;width:100%;min-width:560px;font-size:.9rem}
th,td{text-align:left;padding:.55rem .7rem;border-bottom:1px solid var(--line);vertical-align:top}
th{background:var(--bg)}
.tip{border-left:4px solid var(--hi);padding:.4rem .9rem;background:var(--bg);border-radius:0 8px 8px 0;margin:.9rem 0}
footer{padding:1.6rem 0 2.5rem;color:var(--mute);font-size:.82rem;border-top:1px solid var(--line);margin-top:1.5rem}
@media (prefers-reduced-motion:reduce){.bar i{transition:none}}

/* ajustes v3 */
.top nav{flex-wrap:wrap}
.home h1{margin:0;font-size:clamp(2.3rem,8.5vw,5.4rem);line-height:1.05;font-weight:800;letter-spacing:-.03em;max-width:14ch;text-wrap:balance}
.lead2{margin:.2rem 0 1rem;color:var(--mute);font-size:1.05rem}
.flt{display:flex;gap:1.2rem;flex-wrap:wrap;margin:.2rem 0 1rem}
.flt label{flex-direction:row;align-items:center;gap:.5rem;font-size:.95rem}
.flt input{width:auto}
.mes h3{margin:1.4rem 0 .5rem;font-size:1.15rem}
.evs{list-style:none;margin:0;padding:0;background:var(--panel);border:1.5px solid var(--line);border-radius:12px;overflow:hidden}
.ev{display:grid;grid-template-columns:9.5rem 1fr;gap:.1rem 1rem;padding:.65rem .9rem;border-bottom:1px solid var(--line)}
.ev:last-child{border-bottom:0}
.ev[hidden]{display:none}
.ev .d{font-weight:700;font-variant-numeric:tabular-nums}
.ev .n{font-weight:600}
.ev .p{grid-column:2;color:var(--mute);font-size:.9rem}
.ev.past{opacity:.55}
.ev.past .n::after{content:" (finalizada)";font-weight:400;font-size:.85rem}
.mes[hidden]{display:none}
@media (max-width:520px){.ev{grid-template-columns:1fr}.ev .p{grid-column:1}}
.legal h2{font-size:1.7rem}
.legal h3{font-size:1.05rem;margin:1.3rem 0 .3rem}
.legal p,.legal ul{max-width:70ch}
.legal .back{margin-top:1.4rem}
.ph{background:var(--hi);color:var(--hi-ink);padding:0 .3rem;border-radius:4px;font-weight:600}
.btn{font:inherit;font-weight:700;padding:.6rem 1.1rem;border-radius:999px;border:1.5px solid var(--accent);background:transparent;color:var(--accent);cursor:pointer}
.btn.p{background:var(--accent);color:var(--accent-ink)}
.fl{display:flex;flex-wrap:wrap;gap:.4rem 1.2rem;margin-bottom:.6rem}
.fl a,.lnk{color:var(--ink);font-weight:600;font-size:.88rem}
.lnk{background:none;border:0;padding:0;font-family:inherit;cursor:pointer;text-decoration:underline}
#cb{position:fixed;left:0;right:0;bottom:0;z-index:3000;padding:.8rem .8rem calc(.8rem + env(safe-area-inset-bottom,0px))}
#cb[hidden]{display:none}
.cbi{max-width:880px;margin:0 auto;background:var(--panel);color:var(--ink);border:1.5px solid var(--line);border-radius:14px;padding:1rem 1.2rem;box-shadow:0 8px 30px rgba(0,0,0,.25)}
.cbi b{font-size:1.05rem}
.cbi p{margin:.3rem 0 .8rem;font-size:.9rem;max-width:70ch;line-height:1.5}
.cbi a{color:var(--accent)}
.cbb{display:flex;gap:.5rem;flex-wrap:wrap;justify-content:flex-end}
#cb_cfg{margin:.2rem 0 .8rem;display:grid;gap:.5rem}
#cb_cfg[hidden]{display:none}
#cb_cfg label{flex-direction:row;align-items:flex-start;gap:.6rem;font-weight:400;font-size:.88rem}
#cb_cfg input{width:auto;margin-top:.25rem}

/* v4 */
h2.sec-title,#guia h2.sec-title{font-size:2rem;line-height:1.15;font-weight:800;letter-spacing:-.02em;margin:1.4rem 0 .6rem}
.legal h2.sec-title{margin-top:0}
.rg5{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:.9rem}
.rc{display:block;background:var(--panel);border:1.5px solid var(--line);border-radius:14px;padding:1.1rem;color:inherit;text-decoration:none}
.rc:hover{border-color:var(--accent)}
.rc b{display:block;font-size:1.1rem;line-height:1.25;margin:.15rem 0}
.rc .rg{font-size:.8rem;color:var(--mute);font-weight:600}
.rc em{display:block;font-style:normal;font-size:.85rem;color:var(--accent);font-weight:600}
.rc p{margin:.5rem 0 0;font-size:.9rem;color:var(--mute);line-height:1.5}
.ruta .rt{font-size:1.5rem;margin:.3rem 0}
.ruta h4{margin:1.3rem 0 .4rem;font-size:1.05rem}
.chips{list-style:none;display:flex;flex-wrap:wrap;gap:.4rem;padding:0;margin:.6rem 0}
.chips li{background:var(--bg);border:1.5px solid var(--line);border-radius:999px;padding:.15rem .7rem;font-size:.85rem;font-weight:600}
.map{height:380px;border-radius:12px;border:1.5px solid var(--line);overflow:hidden;background:var(--bg);margin:.8rem 0 .3rem}
.map svg{display:block;width:100%;height:100%}
.leaflet-container{font:inherit}
.mk span{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#ff8a1f;color:#2b1200;font-weight:800;font-size:.85rem;border:2px solid #12302f}
.etapas{padding-left:1.2rem;max-width:70ch}
.etapas>li{margin:.9rem 0}
.etapas p{margin:.2rem 0}
.etapas .km{font-size:.82rem;color:var(--mute);margin-left:.4rem}
.pa{margin:.2rem 0;padding-left:1.1rem;font-size:.92rem;color:var(--mute)}

/* menú móvil */
.burger{display:none;width:44px;height:44px;flex:none;border:1.5px solid rgba(255,255,255,.35);border-radius:10px;background:transparent;cursor:pointer;padding:0;place-content:center;gap:5px}
.burger span{display:block;width:22px;height:2.5px;border-radius:2px;background:#fff;transition:transform .2s,opacity .2s}
.burger[aria-expanded=true] span:nth-child(1){transform:translateY(7.5px) rotate(45deg)}
.burger[aria-expanded=true] span:nth-child(2){opacity:0}
.burger[aria-expanded=true] span:nth-child(3){transform:translateY(-7.5px) rotate(-45deg)}
@media (max-width:760px){
 .top .wrap{flex-wrap:nowrap;justify-content:flex-start;gap:.8rem}
 .burger{display:grid}
 .logo svg{width:40px;height:40px}
 .logo b{font-size:1.3rem}
 .top nav{display:none;position:absolute;left:0;right:0;top:100%;flex-direction:column;gap:.2rem;padding:.6rem 1.1rem 1rem;background:var(--head);border-top:1px solid rgba(255,255,255,.15);box-shadow:0 12px 24px rgba(0,0,0,.3)}
 .top nav.open{display:flex}
 .top nav a{padding:.8rem 1rem;border-radius:10px;font-size:1.05rem}
}
@media (prefers-reduced-motion:reduce){.burger span{transition:none}}
.map{height:420px;position:relative;z-index:0;isolation:isolate}
@media (max-width:760px){.map{height:360px}}
.leaflet-popup-content ul{font-size:.85rem}

/* v5 */
a{color:var(--accent)}
.ev .n a{color:var(--accent);text-underline-offset:2px}
.pais-t{font-size:1.4rem;margin:1.4rem 0 .8rem;padding-bottom:.35rem;border-bottom:2px solid var(--line)}
#guia .types img{display:block;width:100%;max-width:190px;height:auto;margin:0 auto .4rem}
#guia a.btn.p{display:inline-block;text-decoration:none;color:var(--accent-ink)}
.tip ul{margin:.4rem 0}
@media (max-width:760px){.logo{order:1}.burger{order:2;margin-left:auto}}

/* guía ampliada */
#guia details{background:var(--panel);border:1.5px solid var(--line);border-radius:12px;margin:.6rem 0;padding:0 1rem;max-width:760px}
#guia summary{cursor:pointer;font-weight:700;padding:.8rem 0;font-size:1.02rem}
#guia details[open] summary{border-bottom:1px solid var(--line);margin-bottom:.6rem}
#guia details h4{margin:.9rem 0 .2rem;font-size:.95rem}
#guia details p,#guia details ul{margin:.3rem 0 .9rem}
#guia .tip.alert{border-left-color:var(--bad)}
#guia .dic-f{max-width:420px;margin:.8rem 0}
#guia .dic{margin:0;max-width:760px}
#guia .term{padding:.6rem 0;border-bottom:1px solid var(--line)}
#guia .term[hidden]{display:none}
#guia dt{font-weight:700}
#guia dd{margin:.15rem 0 0;color:var(--mute)}

/* ===== páginas separadas ===== */
h1.sec-title,h2.sec-title,#guia h1.sec-title,#guia h2.sec-title{font-size:2rem;line-height:1.15;font-weight:800;letter-spacing:-.02em;margin:1.2rem 0 .6rem}
.legal h1.sec-title{margin-top:0}
.crumbs{font-size:.85rem;color:var(--mute);margin:1.3rem 0 .2rem}
.crumbs a{color:var(--accent)}
#guia h2.sub,.legal h2.sub,.mes h2.sub,.seo h2.sub{font-size:1.1rem;line-height:1.3;font-weight:700;letter-spacing:0;margin:1.4rem 0 .3rem}
.mes h2.sub{font-size:1.15rem;margin:1.4rem 0 .5rem}
#guia h3.h4,.ruta h3.h4{margin:.9rem 0 .2rem;font-size:.95rem}
#guia article section{margin:1rem 0 2rem}
.seo{margin-top:2rem;max-width:68ch}
.seo p,.seo ul{max-width:68ch}
.ruta h2.sub{margin:1.3rem 0 .4rem}
.pais-t a{color:inherit;text-decoration:none}
.pais-t a:hover{text-decoration:underline}
.pnav{display:flex;gap:.8rem;flex-wrap:wrap;justify-content:space-between;margin:2.4rem 0 1rem}
.pn{flex:1 1 200px;display:block;background:var(--panel);border:1.5px solid var(--line);border-radius:12px;padding:.8rem 1rem;color:var(--ink);text-decoration:none;font-weight:600}
.pn small{display:block;color:var(--mute);font-weight:400;font-size:.78rem}
.pn.nx{text-align:right}.pn.mid{text-align:center;align-self:center;flex:0 1 auto}
.pn:hover{border-color:var(--accent)}
