/**
 * Arreglos del móvil para lo 2027 — welcometoibiza.com
 * Archivo: assets/css/wti-movil-2027-1.0.3.css
 * Creado: 2026-09-26 (tema 5.4.6) · Mini-Spec docs/specs/2026-09-26_cabecera-movil-2027.md
 * El nombre lleva la versión porque WP Rocket borra el ?ver= de los estáticos.
 *
 * Se carga en todas las páginas de la web (functions.php, prioridad 100, detrás
 * de las hojas de cada bloque). Solo corrige tamaños y cortes; no cambia colores,
 * tipos ni textos. Lleva `body` delante para ganar a las hojas que se imprimen
 * más tarde en el pie (las que pide un bloque al pintarse).
 *
 *   1. Títulos que no se partían y se cortaban por la derecha (inventario
 *      2026-09-26 §5): «V.I.P EN LAS MEJORES DISCOTECAS…», «NOTICIAS DE DUNES…»
 *   2. Ficha y noticia: la columna principal crecía con lo que llevaba dentro
 *      (1.532 px en Can Limo por el carrusel de opiniones de Google; 712 px en
 *      las noticias con fotos [caption] de ancho fijo)
 *   3. Tira de planes de «Qué hacer hoy»: 13 px de más a cada lado en el móvil
 *   4. (1.0.1, tema 5.5.1) Pie: el escudo con su texto no encogía y en 320 px se
 *      salía 15 px. Opiniones de Google: el botón «Opinar» baja de línea en vez de
 *      quedar cortado por la caja.
 *   5. (1.0.2, tema 5.5.2) Guiones solo en palabras de 12 letras o más: con 10
 *      partía «DISCO-TECAS» en vez de bajar la palabra entera a la otra línea.
 *   6. (1.0.3, tema 5.7.7) Menú del día (portadas de sección): la flecha de la derecha de la
 *      tira salía 14 px fuera de la pantalla en la tableta (scroll de lado en Restaurantes a
 *      768, 1024 y 1194 px). Hasta 1280 px las flechas van dentro del borde.
 */

/* ---------- 1. Títulos: se parten en vez de salirse ----------
   El título de bloque era `flex:none` (no encoge) y medía lo que su texto en una
   línea: 474 px en una pantalla de 390. Ahora puede encoger hasta el ancho de su
   caja y parte por palabras; en el escritorio, si cabe, no cambia nada. */
body .wti-cabeza .wti-titulo,
body .t27-barra .wti-titulo,
body .q27 .q27-titulo,
body .t27 .t27-titulo,
body .n27 .n27-titulo,
body .n27b .n27b-titulo,
body .w27 .w27-titulo{
	flex-shrink:1;
	min-width:0;
	max-width:100%;
	overflow-wrap:break-word;
}
body .hs27 .hs27-titulo,
body .wti-ficha-titular h1,
body .wti-ficha h1,
body .wti-ficha h2,
body .wti-ficha h3{
	overflow-wrap:break-word;
}

/* En el móvil: un punto más pequeños y con guiones solo en las palabras largas
   (la web va con lang="es"). Con guiones libres el navegador parte cualquier
   palabra que no quepa al final de la línea («DISCO-TECAS»); con 6 letras como
   mínimo a cada lado solo se parten las de 12 o más (Chrome y Safari), que son
   las que de verdad pueden no caber. */
@media (max-width:767px){
	body .wti-cabeza .wti-titulo,
	body .t27-barra .wti-titulo{
		font-size:clamp(22px,6.6vw,30px);
		line-height:1.18;
	}
	body .wti-cabeza .wti-titulo,
	body .t27-barra .wti-titulo,
	body .q27 .q27-titulo,
	body .t27 .t27-titulo,
	body .n27 .n27-titulo,
	body .n27b .n27b-titulo,
	body .w27 .w27-titulo,
	body .hs27 .hs27-titulo,
	body .wti-ficha-titular h1,
	body .wti-ficha h2{
		-webkit-hyphens:auto;
		hyphens:auto;
		-webkit-hyphenate-limit-before:6;
		-webkit-hyphenate-limit-after:6;
		hyphenate-limit-chars:12 6 6;
	}
	body .wti-ficha-titular h1{font-size:clamp(22px,7vw,28px)}
}

/* ---------- 2. Ficha y noticia: la columna no crece con lo de dentro ----------
   En el móvil la ficha va a una columna (`1fr`), y una columna `1fr` crece hasta
   lo más ancho que lleve dentro. */
@media (max-width:1023px){
	body .wti-ficha-cuerpo{grid-template-columns:minmax(0,1fr)}
}
body .wti-ficha-cuerpo > main,
body .wti-ficha-cuerpo > aside{min-width:0}

/* Opiniones de Google (wti-google-places): el carrusel se desliza dentro de su
   caja en vez de ensancharla. */
body .wti-ficha .wti-gp-reviews{max-width:100%;min-width:0;overflow:hidden}
body .wti-ficha .wti-gp-reviews__carousel,
body .wti-ficha .wti-gp-reviews__carousel-track{max-width:100%}
body .wti-ficha .wti-gp-reviews__header{flex-wrap:wrap}
body .wti-ficha .wti-gp-reviews__rating-info{min-width:0}

/* Fotos con pie de las noticias viejas ([caption] de WordPress): traen el ancho
   escrito a mano (style="width:666px"). */
body .wti-ficha-texto .wp-caption,
body .s27-pagina .wp-caption,
body .entry-content .wp-caption{
	max-width:100% !important;
	width:auto !important;
	box-sizing:border-box;
}
body .wti-ficha-texto .wp-caption img,
body .s27-pagina .wp-caption img,
body .entry-content .wp-caption img{max-width:100%;height:auto}

/* ---------- 3. Tira de planes de «Qué hacer hoy» en el móvil ----------
   La tira sale a todo lo ancho (margen -16 px) y además llevaba -13 px a cada lado
   para cuadrar el texto de la primera ficha con el título: 13 px de scroll de
   lado. Se deja donde estaba, pero con relleno en vez de margen. */
@media (max-width:640px){
	body .t27 .q27-tira{
		margin-left:0;
		margin-right:0;
		padding-left:3px;
		padding-right:3px;
		scroll-padding-left:3px;
	}
}

/* ---------- 4. Pie: el escudo y su texto encogen en pantallas muy estrechas ---------- */
body .f27 .f27-marca{flex:0 1 auto;min-width:0;max-width:100%}
body .f27 .f27-marca-texto{min-width:0}

/* ---------- 6. Menú del día: flechas dentro de la pantalla (1.0.3) ---------- */
@media (max-width:1280px){
	body .q27.q27-menudia .q27-atras{left:0}
	body .q27.q27-menudia .q27-alante{right:0}
}