/* JD & Santi On Tour · interfaz: rutas del día, análisis, práctica de inglés y adaptación a cualquier pantalla */

/* ---------- detalles generales ---------- */
.top{box-shadow:0 8px 20px -18px rgba(18,52,77,.55)}
.tabs button{position:relative;transition:background .2s,color .2s}
.tabs button.on::after{content:"";position:absolute;top:2px;left:30%;right:30%;height:3px;border-radius:3px;background:var(--orange)}
.card,.day{transition:box-shadow .2s}
.chip{transition:background .15s,border-color .15s}
.btn{transition:transform .1s,background .15s}
.btn:active,.chip:active,.say:active{transform:scale(.96)}
.btn.sm{padding:7px 12px;font-size:13px}
.row.spread{justify-content:space-between}
.toggle2.full{display:flex;width:100%}
.toggle2.full button{flex:1}
.pill.sm,.stat .sm{font-size:12px;font-weight:700;color:inherit;opacity:.75}
.box.g{background:var(--green-2);color:var(--green)}
.pill.r{background:#FBE4E4;color:#9B2C2C}

/* ---------- mapa ---------- */
.mapwrap{height:auto}
.layers{flex-wrap:wrap;justify-content:flex-end;max-width:calc(100% - 24px)}
.layers button{min-width:38px;min-height:36px;font-family:inherit}
.daychips{align-items:center;padding-top:0}
.chiplbl{flex:none;font-size:12px;font-weight:800;color:var(--ink-2);padding-right:2px}
.daychips .chip small{font-size:12px}
.route.dia{stroke-dasharray:none!important;animation:none;opacity:.95}
.leglbl{background:none;border:0}
.leglbl span{display:inline-block;transform:translate(-50%,-50%);white-space:nowrap;background:#fff;color:var(--ink);border-radius:999px;padding:2px 8px;font-size:11px;font-weight:800;box-shadow:0 3px 10px -3px rgba(18,52,77,.55);border:2px solid var(--orange)}
.leglbl span.tr{border-color:var(--snow)}
.diasgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:8px;margin:0 0 12px}
.diabtn{border:2px solid var(--sky-2);background:var(--paper);border-radius:16px;padding:10px 12px;text-align:left;cursor:pointer;font:inherit;color:inherit;display:flex;flex-direction:column;gap:2px}
.diabtn:hover{border-color:var(--orange)}
.diabtn b{font-size:15px}
.diabtn small{font-size:12px;color:var(--ink-2);line-height:1.3}
.diabtn span{font-size:12px;font-weight:800;color:var(--orange-deep)}
.buscar{display:flex;gap:8px;margin:0 0 10px}
.buscar input{flex:1;min-width:0;font:inherit;font-size:16px;border:2px solid var(--sky-2);background:var(--sky-2);border-radius:999px;padding:9px 14px;color:var(--ink)}
.buscar input:focus{outline:none;border-color:var(--orange);background:#fff}
.buscar .btn{flex:none}
.places li.vacio{padding:14px;color:var(--ink-2);font-size:14px}
ol.ruta{list-style:none;margin:12px 0 0;padding:0;display:grid;gap:0}
.ruta .parada button{width:100%;text-align:left;border:2px solid var(--sky-2);background:var(--paper);border-radius:16px;padding:10px 12px;cursor:pointer;display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:12px;align-items:center;font:inherit;color:inherit}
.ruta .parada button:hover{border-color:var(--orange)}
.ruta .parada b{display:block;font-size:15px}
.ruta .parada small{font-size:12px;color:var(--ink-2)}
.ruta .num{width:44px;height:44px}
.ruta .tramo{margin:0 0 0 21px;padding:7px 0 7px 22px;border-left:3px dotted var(--orange);font-size:12px;font-weight:700;color:var(--ink-2)}
.ruta .tramo.trans{border-left-color:var(--snow)}

/* pantalla completa del mapa */
body.mapa-full{overflow:hidden}
body.mapa-full .mapwrap{position:fixed;inset:0;z-index:980;border-radius:0;height:auto!important}
body.mapa-full .mode{top:calc(12px + env(safe-area-inset-top,0px));left:calc(12px + env(safe-area-inset-left,0px))}
body.mapa-full .layers{top:calc(12px + env(safe-area-inset-top,0px));right:calc(12px + env(safe-area-inset-right,0px))}
@media (max-width:640px){body.mapa-full .layers{top:calc(54px + env(safe-area-inset-top,0px))}}

/* ---------- días ---------- */
.dtools{margin-bottom:12px}
.dtags{display:flex;flex-wrap:wrap;gap:4px;margin-top:6px}
.dtags .pill{font-size:11px;padding:3px 9px}
.rutadia h4{color:var(--orange-deep)}
ol.mini{list-style:none;margin:6px 0 8px;padding:0;display:flex;flex-wrap:wrap;gap:6px}
ol.mini button{border:0;background:var(--paper);border-radius:999px;padding:5px 10px 5px 5px;font:inherit;font-size:13px;font-weight:700;color:var(--ink);cursor:pointer;display:inline-flex;align-items:center;gap:6px}
ol.mini button i{font-style:normal;width:22px;height:22px;border-radius:50%;background:var(--orange);color:#fff;display:grid;place-items:center;font-size:11px}
ol.mini small{color:var(--orange-deep)}
.rnota{font-size:13px;color:var(--ink-2);margin:0 0 8px}
.anastats b .sm{font-size:13px}
ul.insights{list-style:none;margin:0;padding:0;display:grid;gap:8px}
ul.insights li{background:var(--sky-2);border-radius:14px;padding:10px 12px;font-size:14px;line-height:1.45}
table.ana td,table.ana th{text-align:left;white-space:normal;vertical-align:top}
table.ana td:first-child{min-width:96px}
table.ana tr.clic{cursor:pointer}
table.ana tr.clic:hover td{background:#FFF8F2}
.ciudades .box b{font-size:15px}

/* ---------- inglés ---------- */
.ingtop .row{justify-content:space-between}
.ingprog{font-size:14px;margin-bottom:10px;display:grid;gap:6px}
.ingprog b{font-size:20px;color:var(--orange-deep)}
.ingfil{position:sticky;top:64px;z-index:400;background:var(--sky-2);padding:6px 0 0;margin:0 -2px}
.ingfil input{width:100%;font:inherit;font-size:16px;border:2px solid transparent;background:var(--paper);border-radius:999px;padding:10px 16px;color:var(--ink)}
.ingfil input:focus{outline:none;border-color:var(--orange)}
.ingfil .chips{padding:8px 0}
.phr2{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:start;padding:12px 0;border-top:1px solid var(--sky-2)}
.card .phr2:first-of-type{border-top:0}
.phr2 b{display:block;font-size:16px;line-height:1.35}
.phr2 small{display:block;color:var(--ink-2);font-size:13px;margin-top:2px}
.phr2 small.tip,.carta .tip{color:var(--orange-deep);font-weight:700}
.phr2.hecha b{color:var(--green)}
.pbtn{display:flex;gap:6px}
.say.mic{background:var(--ink)}
.say.mic.on{background:#C53030;animation:pulse .8s ease infinite}
.say.chk{background:var(--sky-2);color:var(--ink);font-weight:800}
.phr2.hecha .say.chk{background:var(--green);color:#fff}
.psal:empty{display:none}
.psal{margin-top:8px}
.psal .esc{font-size:13px;font-weight:700;color:#C53030}
.nota{border-radius:12px;padding:8px 10px;font-size:13px;line-height:1.45;background:var(--sky-2)}
.nota.g{background:var(--green-2);color:var(--green)}
.nota.o{background:var(--orange-2);color:var(--orange-deep)}
.nota small{display:block;margin-top:4px;color:var(--ink-2)}
.palabras{margin-top:6px;display:flex;flex-wrap:wrap;gap:4px}
.palabras span{border-radius:6px;padding:1px 6px;font-weight:800}
.palabras .ok{background:#CDEFD8;color:var(--green)}
.palabras .mal{background:#FFD9BF;color:var(--orange-deep)}
.simul summary{list-style:none;cursor:pointer;display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.simul summary::-webkit-details-marker{display:none}
.simul summary .gh3{margin:0}
.simul summary::after{content:"▾";margin-left:auto;font-weight:800;color:var(--ink-2)}
.simul[open] summary::after{content:"▴"}
ol.dialogo{list-style:none;margin:10px 0 0;padding:0;display:grid;gap:12px}
.dialogo li{display:grid;gap:6px}
.dialogo .q,.dialogo .a{display:grid;grid-template-columns:28px minmax(0,1fr) auto auto;gap:8px;align-items:center;border-radius:16px;padding:8px 10px}
.dialogo .q{background:var(--sky-2);margin-right:12%}
.dialogo .a{background:var(--orange-2);margin-left:12%}
.dialogo span{font-size:20px}
.dialogo b{display:block;font-size:15px}
.dialogo small{display:block;font-size:12px;color:var(--ink-2)}
.sonidos{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:10px}
.sonidos .chip{background:var(--paper)}
.sonidos .chip small{color:var(--ink-2);font-weight:600}
.carta{margin-top:12px;background:var(--ink);color:#fff;border-radius:20px;padding:16px 18px;animation:fade .3s ease}
.carta small{color:var(--sky)}
.carta .es{font-size:22px;font-weight:800;margin:6px 0}
.carta .en{font-size:20px;font-weight:800;color:var(--orange);margin:0 0 4px}
.carta .tip{color:var(--orange-2)}
.carta .btn{background:rgba(255,255,255,.12);color:#fff}
.carta .btn.pri{background:var(--orange)}
.carta .row{margin-top:10px}

/* ---------- celular vertical ---------- */
@media (max-width:860px){.mapwrap{height:52vh;height:52dvh}}
@media (max-width:520px){
  .view{padding:6px 14px 20px}
  h2.big{font-size:32px}
  .lead{font-size:15px}
  .card{padding:16px}
  .layers .lbl{display:none}
  .phr2{grid-template-columns:1fr}
  .pbtn{justify-content:flex-end}
  .dialogo .q{margin-right:0}.dialogo .a{margin-left:0}
  .dialogo .q,.dialogo .a{grid-template-columns:24px minmax(0,1fr) auto}
  .dialogo .a .mic{grid-column:3}
  .buscar{flex-wrap:wrap}
  .buscar .btn{width:100%;justify-content:center}
  .ingfil{top:58px}
  table.ana{font-size:13px}
}

/* ---------- celular horizontal: pestañas a un lado y mapa junto al panel ---------- */
@media (orientation:landscape) and (max-height:540px){
  body{padding:0 env(safe-area-inset-right,0px) 0 calc(74px + env(safe-area-inset-left,0px))}
  .top{position:static;padding:8px 14px 4px;gap:8px}
  .brand p{display:none}
  .logo{width:30px;height:30px;font-size:15px;border-radius:10px}
  .brand h1{font-size:16px}
  .seg button{height:28px}
  .tabs{top:0;bottom:0;left:0;right:auto;width:calc(70px + env(safe-area-inset-left,0px));flex-direction:column;justify-content:flex-start;gap:1px;padding:6px 5px 6px calc(5px + env(safe-area-inset-left,0px));overflow-y:auto}
  .tabs button{flex:0 0 auto;max-width:none;width:100%;padding:4px 0;font-size:10px;min-height:42px}
  .tabs button .ic{font-size:17px}
  .tabs button.on::after{top:20%;bottom:20%;left:auto;right:-5px;width:3px;height:auto}
  .view{padding:4px 12px 14px}
  h2.big{font-size:26px;margin:2px 0 6px}
  .hero{padding:18px 20px}
  .hero h2{font-size:32px}
  .chips{padding-bottom:6px}
  .chip{padding:6px 12px;font-size:13px}
  .layout{grid-template-columns:minmax(0,1.35fr) minmax(250px,1fr);height:calc(100vh - 24px);height:calc(100dvh - 24px);min-height:230px}
  .mapwrap{height:auto}
  .panel{max-height:none}
  .tot{bottom:8px}
  .toast{bottom:16px}
  .offbanner{bottom:12px;left:calc(84px + env(safe-area-inset-left,0px))}
  .gacciones{bottom:0}
  .gtabs,.ingfil{top:0}
  .grid4{grid-template-columns:repeat(4,minmax(0,1fr))}
  .grid2{grid-template-columns:repeat(2,minmax(0,1fr))}
  .layers{top:12px}
  .layers .lbl{display:none}
  .ph{height:150px}
  body[data-tab="mapa"] .top{display:none}
  body[data-tab="mapa"] .view{padding-top:8px}
}
@media (orientation:landscape) and (max-height:540px) and (max-width:700px){
  .layout{grid-template-columns:1fr;height:auto}
  .mapwrap{height:calc(100dvh - 40px)}
}

/* ---------- ubicación, navegación y transporte ---------- */
.fabs{position:absolute;right:12px;bottom:48px;z-index:760;display:flex;flex-direction:column;gap:8px}
.fabs button{width:46px;height:46px;border-radius:50%;border:0;background:#fff;color:var(--ink);font-size:20px;font-weight:800;cursor:pointer;box-shadow:0 8px 20px -8px rgba(18,52,77,.6);display:grid;place-items:center;font-family:inherit}
.fabs button.on{background:#1A73E8;color:#fff}
.yo{position:relative;width:26px;height:26px}
.yo b{position:absolute;inset:5px;border-radius:50%;background:#1A73E8;border:3px solid #fff;box-shadow:0 0 0 0 rgba(26,115,232,.6);animation:yopulso 2s ease-out infinite}
.yo .cono{position:absolute;left:50%;top:50%;width:0;height:0;margin:-30px 0 0 -14px;border-left:14px solid transparent;border-right:14px solid transparent;border-bottom:30px solid rgba(26,115,232,.35);transform-origin:50% 100%}
@keyframes yopulso{70%{box-shadow:0 0 0 14px rgba(26,115,232,0)}100%{box-shadow:0 0 0 0 rgba(26,115,232,0)}}
.casapin,.destpin{width:34px;height:34px;border-radius:50%;background:#fff;border:3px solid var(--orange);display:grid;place-items:center;font-size:17px;line-height:1;box-shadow:0 6px 14px -4px rgba(18,52,77,.55)}
.casapin{border-color:var(--green)}
.lchip{display:inline-block;border-radius:999px;padding:2px 9px;margin:2px 3px 2px 0;font-size:12px;font-weight:800;color:#fff;line-height:1.5;vertical-align:middle}
.opciones{display:grid;gap:8px;margin:10px 0}
.opcion{position:relative;text-align:left;border:2px solid var(--sky-2);background:var(--paper);border-radius:18px;padding:12px 14px;cursor:pointer;font:inherit;color:inherit;display:grid;gap:4px}
.opcion b{font-size:16px}
.opcion small{font-size:13px;color:var(--ink-2);line-height:1.5}
.opcion .pill{position:absolute;top:10px;right:10px}
.opcion.rec{border-color:var(--green-2)}
.opcion.on{border-color:var(--orange);background:#FFF8F2}
form.opcion{cursor:default}
ol.pasos{list-style:none;margin:10px 0;padding:0;display:grid;gap:0}
ol.pasos li{display:grid;grid-template-columns:34px minmax(0,1fr) auto;gap:10px;align-items:start;padding:9px 0;border-top:1px solid var(--sky-2);font-size:14px;line-height:1.45}
ol.pasos li:first-child{border-top:0}
ol.pasos i{font-style:normal;width:34px;height:34px;border-radius:50%;background:var(--sky-2);display:grid;place-items:center;font-size:17px;font-weight:800}
ol.pasos li.viaje i{background:var(--ink);color:#fff}
ol.pasos small{color:var(--ink-2);font-weight:700;white-space:nowrap}
.cargador{display:flex;align-items:center;gap:10px;color:var(--ink-2);font-weight:700;margin:12px 0}
.cargador i{width:20px;height:20px;border-radius:50%;border:3px solid var(--sky-2);border-top-color:var(--orange);animation:giro .8s linear infinite}
@keyframes giro{to{transform:rotate(360deg)}}
.navbanner{position:absolute;left:12px;right:12px;top:12px;z-index:800;background:var(--ink);color:#fff;border-radius:20px;padding:12px;display:grid;grid-template-columns:44px minmax(0,1fr) 40px auto;gap:10px;align-items:center;box-shadow:0 14px 30px -12px rgba(18,52,77,.7);animation:fade .25s ease}
.navbanner[hidden]{display:none}
.nb-ic{width:44px;height:44px;border-radius:14px;background:var(--orange);display:grid;place-items:center;font-size:22px;font-weight:800}
.nb-tx b{display:block;font-size:16px;line-height:1.25}
.nb-tx small{display:block;font-size:12px;color:var(--sky);margin-top:3px}
.nb-arrow{width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.12);display:grid;place-items:center;font-size:20px;color:var(--orange);transition:transform .3s}
.nb-btns{display:flex;gap:4px}
.nb-btns button{width:36px;height:36px;border-radius:50%;border:0;background:rgba(255,255,255,.14);color:#fff;font-size:16px;font-weight:800;cursor:pointer}
body.navegando .mode,body.navegando .layers{display:none}
body.eligiendo #lmap{cursor:crosshair}
#map.cargando::after,#lmap.cargando::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 30%,rgba(255,255,255,.55) 50%,transparent 70%);background-size:200% 100%;animation:brillo 1.2s linear infinite;pointer-events:none}
@keyframes brillo{from{background-position:120% 0}to{background-position:-80% 0}}
.paraTi{background:linear-gradient(135deg,#12344D,#1d4a6b);color:#fff}
.paraTi .paratit{display:flex;gap:12px;align-items:flex-start;margin-bottom:10px}
.paraTi .paratit>span{font-size:30px;line-height:1}
.paraTi h3{margin:0 0 2px;font-size:20px}
.paraTi p{margin:0;color:var(--sky);font-size:14px;line-height:1.45}
.paraTi .gh4{color:var(--sky)}
.paraTi .places button{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.12);color:#fff}
.paraTi .places small{color:var(--sky)}
.paraTi .price{color:var(--orange)}
.paraTi .btn{background:rgba(255,255,255,.12);color:#fff}
.paraTi .btn.or{background:var(--orange)}
.paraTi .btn.pri{background:#fff;color:var(--ink)}
.estbtn{width:100%;display:grid;grid-template-columns:34px minmax(0,1fr) auto;gap:10px;align-items:center;text-align:left;border:2px solid var(--sky-2);background:var(--paper);border-radius:16px;padding:10px 12px;margin:0 0 8px;cursor:pointer;font:inherit;color:inherit}
.estbtn>span:first-child{font-size:20px}
.estbtn b{display:block;font-size:15px}
.estbtn small{font-size:12px;color:var(--ink-2)}
.paraTi .estbtn{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.14);color:#fff}
.paraTi .estbtn small{color:var(--sky)}
.leaflet-popup-content .btn{margin-top:6px}
@media (max-width:520px){.navbanner{grid-template-columns:40px minmax(0,1fr) auto;padding:10px}.nb-arrow{display:none}.nb-tx b{font-size:15px}.fabs{bottom:44px}}
@media (orientation:landscape) and (max-height:540px){.fabs{bottom:40px}.navbanner{right:auto;width:min(520px,calc(100% - 24px))}}
@media (max-width:520px){.estbtn{grid-template-columns:34px minmax(0,1fr)}.estbtn>span:last-child{grid-column:2}}
.estcerca:empty{display:none}
.estcerca{font-size:14px;line-height:1.7;background:var(--sky-2);border-radius:14px;padding:8px 12px;margin:0 0 10px}

/* navegación: barra inferior y lista de pasos */
.navpie{position:absolute;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom,0px));z-index:800;background:#fff;border-radius:20px;padding:12px 14px 10px;box-shadow:0 14px 30px -12px rgba(18,52,77,.55);display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px 12px;align-items:center;animation:fade .25s ease}
.np-tx b{font-size:22px;font-weight:800;color:var(--green);margin-right:8px}
.np-tx span{font-size:14px;color:var(--ink-2);font-weight:700}
.np-barra{grid-column:1/-1;height:6px;border-radius:99px;background:var(--sky-2);overflow:hidden}
.np-barra i{display:block;height:100%;background:linear-gradient(90deg,#1A73E8,var(--green));border-radius:99px;transition:width .6s}
.np-btns{display:flex;gap:6px;grid-row:1;grid-column:2}
.np-btns button{border:0;border-radius:999px;padding:9px 14px;font:inherit;font-weight:800;font-size:14px;background:var(--sky-2);color:var(--ink);cursor:pointer}
.np-btns .fin{background:#FBE4E4;color:#9B2C2C}
.navhoja{position:absolute;left:12px;right:12px;bottom:calc(96px + env(safe-area-inset-bottom,0px));max-height:55%;overflow:auto;z-index:810;background:#fff;border-radius:20px;padding:12px 14px;box-shadow:0 14px 30px -12px rgba(18,52,77,.55)}
.navhoja li.hecho{opacity:.45}
.navhoja li.actual i{background:var(--orange);color:#fff}
body.navegando .fabs{bottom:calc(110px + env(safe-area-inset-bottom,0px))}
body.navegando .leaflet-control-scale,body.navegando .leaflet-control-layers{display:none}
.buscando{color:var(--orange-deep);animation:pulse 1.2s ease infinite;display:inline-block}
.tips{position:absolute;left:12px;bottom:56px;z-index:790;max-width:300px;background:#fff;border-radius:18px;padding:12px 14px;box-shadow:0 14px 30px -12px rgba(18,52,77,.55);font-size:13px;animation:fade .3s ease}
.tips ul{margin:6px 0 10px;padding-left:2px;list-style:none;display:grid;gap:4px}
.tips b{font-size:14px}

/* cronograma */
.cronores{margin:12px 0 0;font-size:13px;font-weight:700;color:var(--ink-2);background:var(--sky-2);border-radius:12px;padding:8px 12px}
.av,small.av{color:#C53030!important;font-weight:800}
.hora{display:inline-block;background:var(--ink);color:#fff;border-radius:6px;padding:0 6px;margin-right:4px;font-weight:800;font-variant-numeric:tabular-nums}
.ruta .parada small{display:block}
ol.crono{list-style:none;margin:6px 0 8px;padding:0}
.crono li{display:grid;grid-template-columns:58px minmax(0,1fr);gap:10px;align-items:start}
.crono .cv{padding:6px 0}
.crono .ch{font-weight:800;font-variant-numeric:tabular-nums;color:var(--orange-deep);line-height:1.2}
.crono .ch small{display:block;color:var(--ink-2);font-weight:700;font-size:11px}
.crono b{display:block;font-size:14px}
.crono small{display:block;font-size:12px;color:var(--ink-2)}
.crono .ct small{border-left:3px dotted var(--sky-3);padding:2px 0 2px 10px;margin-left:-38px;padding-left:48px;font-weight:700}
.crono .alerta b{color:#C53030}
.box.horario{margin:0 0 10px;font-size:14px;line-height:1.55}

/* reservas e inicio de hoy */
ul.reservas{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.reservas li{display:grid;grid-template-columns:30px minmax(0,1fr) auto;gap:10px;align-items:center;border:2px solid var(--sky-2);border-radius:16px;padding:10px 12px}
.reservas li.urge{border-color:#F5B5B5;background:#FFF5F5}
.reservas li.ok{opacity:.6}
.reservas b{display:block;font-size:15px}
.reservas small{display:block;font-size:12px;color:var(--ink-2);line-height:1.4}
.rchk{width:28px;height:28px;border-radius:50%;border:2px solid var(--green);background:#fff;color:#fff;font-weight:900;cursor:pointer}
.reservas li.ok .rchk{background:var(--green)}
.rcu{display:grid;gap:4px;justify-items:end}
.rcu a{font-size:12px;font-weight:800}
.hoy .prox{background:rgba(255,255,255,.1);border-radius:14px;padding:10px 12px;margin:0 0 8px}
.hoy .prox small{color:var(--sky);font-size:12px;display:block}
.hoy .prox b{font-size:18px}
.hoy .crono b{color:#fff}.hoy .crono small{color:var(--sky)}.hoy .crono .ch{color:var(--orange)}
.hoy .tl li{border-color:rgba(255,255,255,.12)}
@media (max-width:520px){.reservas li{grid-template-columns:28px minmax(0,1fr)}.rcu{grid-column:2;justify-items:start;grid-auto-flow:column;justify-content:start;gap:10px}}
body.navegando .tips{display:none}
body.navegando .toast{bottom:calc(140px + env(safe-area-inset-bottom,0px))}

/* ====================================================================
   JD & Santi On Tour · marca, plan dinámico, restaurantes y pantallas grandes
   ==================================================================== */
.logo{transform:none;width:42px;height:42px;border-radius:14px;background:linear-gradient(135deg,var(--orange) 0%,#FF6B3D 55%,var(--ink) 140%);font-size:12px;letter-spacing:-.02em;line-height:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;box-shadow:0 8px 18px -10px rgba(194,83,26,.9)}
.logo span:last-child{font-size:10px;opacity:.85}
.brand h1 em{font-style:normal;color:var(--orange-deep)}
.topbtn{border:0;background:var(--paper);border-radius:999px;width:38px;height:38px;font-size:17px;cursor:pointer;margin-left:auto;box-shadow:0 4px 12px -8px rgba(18,52,77,.5)}
.topbtn+.seg{margin-left:0}
.hero{background:radial-gradient(120% 140% at 100% 0%,#1F5378 0%,var(--ink) 55%,#0B2335 100%)}
.hero h2{letter-spacing:-.03em}

/* ---------- plan ---------- */
.planbar{border:2px solid var(--orange-2)}
.planbar .gh3{margin:0}
.planbar small{color:var(--ink-2);font-size:13px}
.planbar .rdet{margin-top:10px}
.pendientes{margin-top:12px;background:#FFF7F0;border-radius:16px;padding:10px 12px}
.pendientes h4{margin:0 0 8px;font-size:14px}
.pendientes ul{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.pendientes li{display:flex;align-items:center;justify-content:space-between;gap:10px;background:#fff;border-radius:12px;padding:8px 10px}
.pendientes li small{display:block;color:var(--ink-2);font-size:12px}
.dn{gap:1px}
.dn small{font-size:11px;text-transform:uppercase;letter-spacing:.04em;font-weight:800}
.dn b{font-size:28px}
.day.hoy{box-shadow:0 0 0 3px var(--orange),0 14px 30px -24px rgba(18,52,77,.5)}
.day.hecho .dh{opacity:.72}
.day.hecho .dn{background:var(--green-2)}.day.hecho .dn b{color:var(--green)}
.day.saltado .dh h3{text-decoration:line-through;text-decoration-color:rgba(197,48,48,.6)}
.planacc{margin:0 0 12px}
.planacc .btn.on{background:var(--ink);color:#fff}
.box.avisos{background:#FFF5F5;color:#9B2C2C;margin:0 0 10px}
.box.avisos p{margin:2px 0;font-size:14px;color:inherit}
.box.nota{margin:0 0 8px;background:var(--sky-2)}
.hoy .box.nota{background:rgba(255,255,255,.1);color:#fff}
ol.mini li{display:inline-flex;align-items:center;gap:2px}
.mvbtn{border:0;background:transparent;color:var(--ink-2);font-weight:900;cursor:pointer;border-radius:999px;width:26px;height:26px;font-size:13px}
.mvbtn:hover,.mvbtn:focus-visible{background:var(--orange-2);color:var(--orange-deep)}
details.rdet summary{cursor:pointer;font-weight:800;font-size:13px;color:var(--orange-deep);list-style:none;padding:4px 0}
details.rdet summary::-webkit-details-marker{display:none}
details.rdet summary::before{content:"▸ ";display:inline-block;transition:transform .15s}
details.rdet[open] summary::before{transform:rotate(90deg)}
.rdet dl{margin:6px 0 2px;display:grid;gap:4px}
.rdet dt{font-size:12px;font-weight:800;color:var(--ink)}
.rdet dd{margin:0 0 4px;font-size:12px;color:var(--ink-2);line-height:1.45}
.faq{margin-top:12px}
small.av{color:#C53030}

/* ---------- hoja para elegir ---------- */
.hojafondo{position:fixed;inset:0;z-index:1200;background:rgba(10,30,45,.45);display:flex;align-items:flex-end;justify-content:center;opacity:0;transition:opacity .2s;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
.hojafondo.on{opacity:1}
.hoja{background:var(--paper);width:100%;max-width:640px;max-height:86vh;max-height:86dvh;border-radius:24px 24px 0 0;display:flex;flex-direction:column;transform:translateY(24px);transition:transform .25s cubic-bezier(.2,.8,.2,1);padding-bottom:env(safe-area-inset-bottom,0px)}
.hojafondo.on .hoja{transform:none}
.hojah{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:16px 18px 10px;border-bottom:1px solid var(--sky-2)}
.hojah b{font-size:17px}
.hojab{overflow-y:auto;-webkit-overflow-scrolling:touch;padding:6px 18px 18px;display:grid;gap:8px}
.hojab .gh4{margin:10px 0 0}
.opdia{display:grid;grid-template-columns:96px minmax(0,1fr);gap:12px;align-items:center;text-align:left;width:100%;border:2px solid var(--sky-2);background:var(--paper);border-radius:16px;padding:10px 12px;font:inherit;color:var(--ink);cursor:pointer}
.opdia:hover,.opdia:focus-visible{border-color:var(--orange)}
.opdia.ok{border-color:#BFE6CB;background:#F6FCF8}
.opf b{display:block;font-size:15px}.opf small{color:var(--ink-2);font-size:12px}
.opt b{display:block;font-size:14px}
.opt small{display:block;font-size:12px;color:var(--ink-2);line-height:1.4}
.opt small.okt{color:var(--green);font-weight:700}
.opt small.av{color:#C53030}
@media (min-width:700px){.hojafondo{align-items:center}.hoja{border-radius:24px;max-height:80vh}}

/* ---------- comer ---------- */
.comerchips{margin:0 0 6px}
.comerg{display:flex;align-items:baseline;gap:8px;margin:18px 0 10px}
.comerg small{font-size:13px;color:var(--ink-2)}
.restgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(300px,100%),1fr));gap:12px;margin-bottom:14px}
.rest{background:var(--paper);border-radius:20px;padding:14px;display:grid;grid-template-columns:48px minmax(0,1fr);gap:12px;box-shadow:0 14px 30px -26px rgba(18,52,77,.6)}
.rest-e{width:48px;height:48px;border-radius:14px;background:var(--orange-2);display:grid;place-items:center;font-size:24px}
.rest-h{display:flex;flex-wrap:wrap;align-items:center;gap:6px}
.rest-h b{font-size:16px;margin-right:2px}
.rest p{margin:6px 0 0;font-size:14px;line-height:1.45}
.rest .rest-por{color:var(--ink-2)}
.rest small{display:block;font-size:12px;color:var(--ink-2);margin-top:6px;line-height:1.4}
.rest .row{margin-top:10px}
.restmini{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(200px,100%),1fr));gap:8px}
.restmini button{display:grid;grid-template-columns:30px minmax(0,1fr);column-gap:8px;text-align:left;border:0;background:var(--paper);border-radius:14px;padding:8px 10px;font:inherit;color:var(--ink);cursor:pointer}
.restmini button span{grid-row:span 2;font-size:22px;align-self:center}
.restmini button b{font-size:14px}
.restmini button small{font-size:12px;color:var(--ink-2)}
.paraTi .restmini button{background:rgba(255,255,255,.95)}
.box .restmini button{background:#fff}
@media (max-width:520px){.rest{grid-template-columns:40px minmax(0,1fr);padding:12px}.rest-e{width:40px;height:40px;font-size:20px}.opdia{grid-template-columns:78px minmax(0,1fr)}}

/* ---------- pantallas grandes: todo el ancho, pestañas a un lado y mapa a pantalla completa ---------- */
@media (min-width:1100px) and (min-height:541px){
  body{padding-left:96px}
  .tabs{top:0;bottom:0;left:0;right:auto;width:96px;flex-direction:column;justify-content:center;gap:6px;padding:12px 10px}
  .tabs button{flex:0 0 auto;max-width:none;width:100%;min-height:62px;font-size:12px;border-radius:16px}
  .tabs button .ic{font-size:22px}
  .tabs button:hover{background:rgba(255,255,255,.08)}
  .tabs button.on{background:rgba(255,138,61,.16);color:#fff}
  .tabs button.on::after{top:22%;bottom:22%;left:auto;right:-10px;width:4px;height:auto}
  .top{padding:14px 32px 12px}
  .view{max-width:1560px;padding:10px 32px 32px}
  .tot{bottom:16px}
  .toast{bottom:28px}
  .offbanner{left:112px}
  #v-inicio.on{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 18px;align-items:start}
  #v-inicio>.hero,#v-inicio>.grid4,#v-inicio>#hoyCard,#v-inicio>#reservasCard{grid-column:1/-1}
  #v-dias .dias{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 16px;align-items:start}
  #v-dias .day.open{grid-column:1/-1}
  #v-gratis.on{column-count:2;column-gap:18px}
  #v-gratis.on>*{break-inside:avoid}
  #v-gratis.on>h2,#v-gratis.on>.lead{column-span:all}
  body[data-tab="mapa"] #v-mapa.on{display:flex;flex-direction:column;max-width:none;height:calc(100vh - var(--toph,66px));height:calc(100dvh - var(--toph,66px));padding:8px 20px 16px}
  body[data-tab="mapa"] #v-mapa .chips{flex:none}
  body[data-tab="mapa"] .layout{flex:1;min-height:0;height:auto;grid-template-columns:minmax(0,1fr) 420px}
}
@media (min-width:1500px) and (min-height:541px){
  body[data-tab="mapa"] .layout{grid-template-columns:minmax(0,1fr) 460px}
}
/* tabletas en horizontal y portátiles pequeños: mapa alto */
@media (min-width:861px) and (max-width:1099px) and (min-height:541px){
  body[data-tab="mapa"] .layout{height:calc(100vh - var(--toph,66px) - 150px);height:calc(100dvh - var(--toph,66px) - 150px);min-height:480px}
}

.reservas small b{display:inline;font-size:inherit}
@media (max-width:600px){#pcBtn{display:none}.sosbtn{width:34px;height:34px;font-size:15px}}
@media (min-width:1100px) and (min-height:541px){#v-inicio>#paraTi{grid-column:1/-1}ul.reservas{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* ---------- planes extra ---------- */
.extras .row.spread small{color:var(--ink-2);font-size:13px}
.extras .gh4{margin:14px 0 8px}
.extragrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(300px,100%),1fr));gap:10px}
.extra{border:2px solid var(--sky-2);border-radius:18px;padding:12px 14px;display:flex;flex-direction:column;gap:6px}
.extra.en{border-color:#BFE6CB;background:#F6FCF8}
.extra-h{display:flex;gap:10px;align-items:center}
.extra-e{width:40px;height:40px;border-radius:12px;background:var(--orange-2);display:grid;place-items:center;font-size:20px;flex:none}
.extra-h b{display:block;font-size:15px;line-height:1.25}
.extra-h small,.extra small{display:block;font-size:12px;color:var(--ink-2);line-height:1.4}
.extra small.okt{color:var(--green);font-weight:700}
.extra-p{display:flex;flex-wrap:wrap;gap:4px}
.extra p{margin:0;font-size:14px;line-height:1.45}
.extra .row{margin-top:4px}

/* ---------- antes de viajar, guía práctica y emergencia ---------- */
.sosbtn{background:#FBE4E4;margin-left:auto}
.sosbtn+.topbtn{margin-left:0}
.prog{height:8px;border-radius:99px;background:var(--sky-2);overflow:hidden;margin:6px 0 4px}
.prog i{display:block;height:100%;background:linear-gradient(90deg,var(--orange),var(--green));border-radius:99px;transition:width .3s}
.prepg>summary{cursor:pointer;font-weight:800;font-size:13px;color:var(--orange-deep);padding:6px 0}
.prepg .gh4 small{font-weight:700;color:var(--ink-2)}
ul.prep{list-style:none;margin:0 0 6px;padding:0;display:grid;gap:6px}
.prep li{display:grid;grid-template-columns:30px minmax(0,1fr);gap:10px;align-items:start;border:2px solid var(--sky-2);border-radius:14px;padding:8px 10px}
.prep li.ok{opacity:.6}.prep li.ok .rchk{background:var(--green)}
.prep li.urge{border-color:#F5B5B5;background:#FFF5F5}
.prep summary{cursor:pointer;list-style:none}.prep summary::-webkit-details-marker{display:none}
.prep summary b{display:block;font-size:14px}.prep summary small{display:block;font-size:12px;color:var(--ink-2)}
.prep p{margin:6px 0;font-size:13px;line-height:1.5;color:var(--ink-2)}
.prep a{font-size:12px;font-weight:800}
.guia{display:grid;gap:6px}
.guia details{background:var(--sky-2);border-radius:14px;padding:10px 12px}
.guia summary{cursor:pointer;display:flex;gap:10px;align-items:center;list-style:none}
.guia summary::-webkit-details-marker{display:none}
.guia summary span{font-size:20px}.guia summary b{font-size:15px}
.guia ul{margin:8px 0;padding-left:18px;display:grid;gap:5px;font-size:14px;line-height:1.5}
.sos{display:grid;gap:10px}
.sosbig{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}
.sos a.btn{flex-direction:column;align-items:flex-start;border-radius:16px;padding:10px 14px;gap:0}
.sos a.btn b{font-size:18px}.sos a.btn small{font-size:12px;font-weight:600;line-height:1.3}
.btn.sosr{background:#C53030;color:#fff}
.sosf{display:grid;gap:6px}
.sosf input{font:inherit;font-size:15px;border:2px solid var(--sky-2);border-radius:12px;padding:9px 11px;width:100%;box-sizing:border-box}
.sosdir{font-size:20px;font-weight:800;margin:4px 0;color:var(--ink)}
.sos details summary{cursor:pointer}
.sos ul{margin:6px 0;padding-left:18px;font-size:14px;line-height:1.5;display:grid;gap:4px}
@media (min-width:1100px) and (min-height:541px){#v-inicio>#prepCard{grid-column:1}#v-inicio>#guiaCard{grid-column:2}}
.prep .rchk,.reservas .rchk{width:28px!important;height:28px!important;min-width:28px!important;min-height:28px!important;padding:0;align-self:start;margin-top:2px}