:root{--brand:#006ba1;--brand-dark:#00507a;--bar:#1b1b1b;--text:#222;--muted:#666;--line:#e3e3e3;--soft:#f4f6f8;--radius:6px}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;min-height:100vh;display:flex;flex-direction:column;font:16px/1.5 system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;color:var(--text);background:#fff;overflow-wrap:anywhere}
a{color:var(--brand);text-decoration:underline;text-underline-offset:.15em;text-decoration-color:#9cc3d9}
a:hover,a:focus-visible{color:var(--brand-dark);text-decoration-color:currentColor}
.pills a,.btn,.brand,footer ul a,.breadcrumb a{text-decoration:none}
.breadcrumb a:hover,footer ul a:hover{text-decoration:underline}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--brand);outline-offset:2px}
img,svg,video{max-width:100%;height:auto;vertical-align:middle}
h1,h2,h3{line-height:1.2;margin:1.2em 0 .4em;font-weight:600}
h1{font-size:clamp(1.6rem,4.5vw,2.2rem);margin-top:.6em}
h2{font-size:1.25rem;padding-bottom:.2em;border-bottom:1px solid var(--line)}
h3{font-size:1.05rem}
h1 small{display:block;font-size:.6em;font-weight:400;color:var(--muted);margin-top:.2em}
p,ul,ol,dl{margin:0 0 1em}
ul,ol{padding-left:1.4em}
li{margin:.15em 0}
hr{border:0;border-top:1px solid var(--line);margin:1.5em 0}
code{font-size:.9em;background:var(--soft);padding:0 .3em;border-radius:3px}
small,.light{font-size:.875em;color:var(--muted)}
dl{display:grid;grid-template-columns:max-content 1fr;gap:.2em 1em}
dt{font-weight:600}
dd{margin:0}

.container{width:min(100% - 2rem,60rem);margin-inline:auto}
.topbar{background:var(--bar);color:#fff}
.topbar .container{display:flex;align-items:center;min-height:48px}
.brand{display:inline-flex;align-items:center;padding:.4rem 0}
main{flex:1;padding-bottom:2rem}

.breadcrumb{list-style:none;padding:0;margin:.8em 0 0;font-size:.9rem;color:var(--muted);display:flex;flex-wrap:wrap;gap:.2em .5em}
.breadcrumb li{display:inline-flex;align-items:center;min-height:24px}
.breadcrumb li+li::before{content:"›";margin-right:.5em;color:#999}
.breadcrumb a{display:inline-block;padding:.25em 0}

.pills{list-style:none;padding:0;margin:0 0 1em;display:grid;grid-template-columns:repeat(auto-fill,minmax(16rem,1fr));gap:.3em}
.pills li{margin:0}
.pills a{display:block;padding:.5em .7em;border-radius:var(--radius);background:var(--soft);line-height:1.3}
.pills a:hover,.pills a:focus-visible{background:#e2eef5;text-decoration:none}
.pills .light{display:block}
.pills.compact{grid-template-columns:repeat(auto-fill,minmax(7rem,1fr))}

.map-box{position:relative;border:1px solid var(--line);border-radius:var(--radius);padding:4px;margin:1em 0;background:#fff}
.map{position:relative;height:300px;background:#dbe9f3;border-radius:4px;overflow:hidden}
.map img{display:block;width:100%;height:300px;object-fit:cover}
.map-box .btn{position:absolute;z-index:1000;top:12px;left:12px}

.btn{display:inline-block;padding:.45em 1em;border:1px solid #c5c5c5;border-radius:var(--radius);background:#f5f5f5;color:var(--text);font:inherit;line-height:1.3;cursor:pointer;text-align:center}
.btn:hover,.btn:focus-visible{background:#e6e6e6;text-decoration:none}
.btn-primary{background:var(--brand);border-color:var(--brand-dark);color:#fff}
.btn-primary:hover,.btn-primary:focus-visible{background:var(--brand-dark);color:#fff}

.meta{display:flex;flex-wrap:wrap;gap:.4em 1em;align-items:center}
.label{display:inline-block;padding:.15em .5em;border-radius:3px;background:#666;color:#fff;font-size:.8rem;font-weight:600;white-space:nowrap}
.alert{padding:.8em 1em;border-radius:var(--radius);background:#fff5f5;border:1px solid #f0c0c0;color:#8a1f1f;margin:1em 0}
.alert-info{background:#eef6fb;border-color:#bcd9ea;color:#17405a}

.recorrido-stats{list-style:none;margin:.5em 0 1em;padding:0;display:flex;flex-wrap:wrap;gap:.4em 1.2em;color:#444}
.recorrido-stats li{display:inline-flex;align-items:center;gap:.3em;white-space:nowrap;margin:0}
.recorrido-stats li.area-destinations{white-space:normal}
.pills .sub{list-style:none;padding:.3em 0 0 .8em;margin:0}
.pills .sub a{padding:.3em .5em;background:none}
.pills .sub a:hover{text-decoration:underline}
.stat-icon{width:18px;height:18px;flex:none;margin-right:.4em;vertical-align:-3px;stroke:#555;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.recorrido-stats .stat-icon{margin-right:0}
h2 .stat-icon{width:22px;height:22px;margin-right:.3em;vertical-align:-4px}

.ad{min-height:280px;margin:1em 0;text-align:center}
.ad ins{display:block}

.form label{display:block;font-weight:600;margin:.8em 0 .2em}
.form input,.form textarea,.form select{font:inherit;padding:.4em .6em;border:1px solid #bbb;border-radius:4px;width:min(100%,24rem)}

footer{background:var(--soft);border-top:1px solid var(--line);margin-top:auto;padding:1.2rem 0;text-align:center;font-size:.9rem;color:var(--muted)}
footer ul{list-style:none;padding:0;margin:.6em 0 0;display:flex;flex-wrap:wrap;justify-content:center;gap:.3em 1em}
footer li{margin:0}
footer ul a{display:inline-block;padding:.3em .2em}