/* Pantallas anchas (iPad y compu). Se enlaza con media="(min-width: 700px) and (min-height: 500px)":
   el teléfono no lo aplica. */
:root{--top-h:70px}
.top{padding-left:max(24px,calc((100vw - 1180px)/2));padding-right:max(24px,calc((100vw - 1180px)/2))}
.top-logo{height:52px}
main{max-width:1180px;margin:0 auto;padding-left:24px;padding-right:24px}
.saludo{margin-left:10px;font-size:28px}

/* inicio: plancha grande y tarjetas en grilla */
#v-inicio.activa{display:grid;grid-template-columns:1fr 1fr;gap:0 22px;align-items:start}
#v-inicio>.saludo,#v-inicio>.plancha,#v-inicio>.cinta,#v-inicio>.pie-legal{grid-column:1/-1}
.plancha{margin:0}
.pl-cab{min-height:132px;padding-top:26px}
.pl-titulo{font-size:58px}
.pl-escena{height:400px}
.pl-burger{width:46%;max-width:420px}
.rot{font-size:14px;max-width:150px}
.sello{width:122px;height:122px}.se-in b{font-size:26px}
.pl-sello{right:calc(27% - 70px);bottom:18px}
.pl-pie{flex-direction:row;align-items:center;max-width:760px;margin:0 auto;width:100%}
.pl-pie .seg{flex:1}.pl-sumar{flex:1;width:auto}
.pl-nav{max-width:760px;margin:0 auto}
.cinta{margin:30px -24px 0}
.card-smash,.bloque{margin:28px 0 0;width:auto}
.card-smash{min-height:270px}
.newjohn{min-height:100%}
.nj-burger{width:360px}
.locales{display:grid;grid-template-columns:1fr 1fr;gap:16px}
#v-inicio .bloque:has(.locales){grid-column:1/-1}

/* carta en dos y tres columnas */
.carta{display:block;padding:4px 0 0}
.ca-sec{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 14px}
.ca-sec h2{grid-column:1/-1}
.titulo-vista{font-size:60px;margin-left:6px}
.sub-vista{margin-left:8px}
.cats{padding-left:4px;padding-right:4px}

/* pedido: dos columnas */
#v-pedido #pedido{max-width:760px;margin:0 auto}

/* tour */
.pasaporte{margin:8px 0 0;min-height:290px}
.pa-cab h1{font-size:88px}
.pa-logo{width:120px}
#v-tour.activa{display:grid;grid-template-columns:1fr 1fr;gap:0 22px;align-items:start}
#v-tour>.pasaporte,#v-tour>.bloque:nth-of-type(2){grid-column:1/-1}
.ruta{grid-template-columns:repeat(4,1fr)}

/* barra como dock */
.barra{left:50%;right:auto;width:560px;transform:translateX(-50%)}

/* hojas como diálogo */
.hoja{align-items:center}
.hoja-in{border-radius:28px;max-height:88vh}
.ficha-in .fi-top{border-radius:28px 28px 0 0}
.fi-escena{height:330px}
.hoja .fi-pie{border-radius:0 0 28px 28px}

/* juego */
.sm-plancha{max-width:760px;width:100%;margin:0 auto}
.sm-pie,.sm-titulo{max-width:620px;width:100%;margin-left:auto;margin-right:auto}

/* historias: columna 9:16 centrada */
.historias .hi-pista,.historias .hi-barras{left:50%;right:auto;width:min(100vw,calc(100vh*9/16));transform:translateX(-50%)}
.historias .hi-barras{width:calc(min(100vw,calc(100vh*9/16)) - 20px)}

@media (min-width:700px) and (max-width:899px){
  #v-inicio.activa,#v-tour.activa{grid-template-columns:1fr}
  .pl-burger{width:56%}
  .pl-sello{right:calc(22% - 60px)}
  .ruta{grid-template-columns:repeat(3,1fr)}
}