/*
 * Lasteis – Misure per telefono e tablet piccolo (dalla 0.4.0, richiesta di Sergio del 22/10).
 *
 * Tutte le regole sono qui, in un posto solo. Ogni selettore è quello del widget con "html" davanti:
 * vince sul CSS del widget, ma perde sempre contro le scelte fatte nella scheda "Stile" di Elementor
 * (che hanno più classi). Così il design del telefono cambia, i valori del cliente restano.
 */

@media (max-width: 820px) {

	/* ---------- Scala dei testi ---------- */

	/* Titoli delle pagine (H1) */
	html body.lstz .lstz-titolo-pagina .lstz-titolo-pagina__h1,
	html body.lstz .lstz-scheda-intro .lstz-scheda-intro__h1 { font-size: clamp(32px, 8.6vw, 44px); }

	/* Titoli delle sezioni */
	html body.lstz .lstz-intestazione .lstz-titolo,
	html body.lstz .lstz-distanze .lstz-titolo,
	html body.lstz .lstz-ab__testa .lstz-titolo,
	html body.lstz .lstz-drago .lstz-titolo,
	html body.lstz .lstz-famiglia .lstz-titolo,
	html body.lstz .lstz-tappe .lstz-titolo,
	html body.lstz .lstz-colazione--home :where(.lstz-colazione__intestazione) .lstz-titolo,
	html body.lstz .lstz-confronto__intestazione .lstz-titolo,
	html body.lstz .lstz-case__intestazione .lstz-titolo,
	html body.lstz .lstz-compreso .lstz-titolo,
	html body.lstz .lstz-prenota .lstz-titolo,
	html body.lstz .lstz-recensioni__intestazione .lstz-titolo,
	html body.lstz .lstz-invito .lstz-titolo,
	html body.lstz .lstz-servizi--home :where(.lstz-servizi__intestazione) .lstz-titolo,
	html body.lstz .lstz-stagioni .lstz-stagioni__titolo,
	html body.lstz .lstz-sapere .lstz-sapere__titolo,
	html body.lstz .lstz-cta--foto .lstz-cta__titolo,
	html body.lstz .lstz-cta--riquadro .lstz-cta__titolo,
	html body.lstz .lstz-cta--semplice .lstz-cta__titolo { font-size: clamp(28px, 7.4vw, 36px); }
	html body.lstz .lstz-richiesta .lstz-richiesta__grazie-titolo { font-size: clamp(32px, 8.6vw, 44px); }

	/* Titoli piccoli dentro le sezioni */
	html body.lstz .lstz-card--elenco .lstz-card__nome { font-size: 24px; }
	html body.lstz .lstz-ab .lstz-ab__scheda-titolo { font-size: 24px; }
	html body.lstz .lstz-stagioni .lstz-stagioni__nome { font-size: 24px; }
	html body.lstz .lstz-colazione .lstz-colazione__nome { font-size: 22px; }
	html body.lstz .lstz-compreso .lstz-compreso__titolo { font-size: 24px; }
	html body.lstz .lstz-case .lstz-case__nome { font-size: 22px; }

	/* Numeri grandi */
	html body.lstz .lstz-tappe .lstz-tappe__anno { font-size: 30px; }
	html body.lstz .lstz-prenota .lstz-prenota__numero { font-size: 32px; }
	html body.lstz .lstz-stagioni__numero .lstz-d { font-size: 28px; }
	html body.lstz .lstz-scheda .lstz-scheda__cifra { font-size: 30px; }
	html body.lstz .lstz-scheda .lstz-scheda__diff-numero { font-size: 30px; }
	html body.lstz .lstz-scheda__box-prezzo .lstz-d { font-size: 30px; }
	html body.lstz .lstz-mosaico__riquadro .lstz-d { font-size: 28px; }
	html body.lstz .lstz-prezzi .lstz-prezzi__cifra { font-size: 22px; }
	html body.lstz .lstz-distanze .lstz-distanze__valore { font-size: 20px; }

	/* Etichette e testi di presentazione */
	html body.lstz .lstz-eyebrow { font-size: 12px; letter-spacing: .12em; }
	html body.lstz .lstz-intro p { font-size: 16px; line-height: 1.6; }
	html body.lstz .lstz-titolo-pagina .lstz-intro p { font-size: 16px; }
	html body.lstz .lstz-cta__testo { font-size: 15px; }
	html body.lstz .lstz-cta--foto .lstz-cta__testo { font-size: 15px; }

	/* ---------- Home ---------- */

	/* Punti forti sotto la copertina: si scorrono di lato, come nella prima bozza */
	html body.lstz .lstz-punti__griglia {
		display: flex;
		gap: 10px;
		margin: 0;
		padding: 22px 18px;
		overflow-x: auto;
		scroll-snap-type: x mandatory;
		scroll-padding: 0 18px;
		scrollbar-width: none;
	}
	html body.lstz .lstz-punti__griglia::-webkit-scrollbar { display: none; }
	html body.lstz .lstz-punti__voce { flex: none; align-items: center; width: 230px; padding: 12px 14px; border: 1px solid var(--lstz-linea); border-radius: 16px; scroll-snap-align: start; }
	html body.lstz .lstz-punti__icona { width: 40px; height: 40px; }

	/* Alloggi in home: card da scorrere di lato invece di 8 card una sotto l'altra */
	html body.lstz .lstz-alloggi--home .lstz-alloggi__griglia {
		display: flex;
		gap: 14px;
		margin: 0 -18px;
		padding: 0 18px 6px;
		overflow-x: auto;
		scroll-snap-type: x mandatory;
		scroll-padding: 0 18px;
		scrollbar-width: none;
	}
	html body.lstz .lstz-alloggi--home .lstz-alloggi__griglia::-webkit-scrollbar { display: none; }
	html body.lstz .lstz-alloggi--home .lstz-card { flex: none; width: min(78vw, 300px); scroll-snap-align: start; }
	html body.lstz .lstz-alloggi--home .lstz-card[hidden] { display: none; }

	/* Servizi della casa in home: due colonne più compatte */
	html body.lstz .lstz-servizi--home .lstz-servizi__griglia { grid-template-columns: 1fr 1fr; gap: 10px; }
	html body.lstz .lstz-servizi--home .lstz-servizi__voce { gap: 6px; padding: 14px; border-radius: 14px; }
	html body.lstz .lstz-servizi--home .lstz-servizi__nome { font-size: 14px; }
	html body.lstz .lstz-servizi--home .lstz-servizi__testo { font-size: 12.5px; line-height: 1.45; }

	/* Slideshow: niente etichetta e titolo sopra le foto, restano nome della foto, trattini, autore e pulsanti */
	html body.lstz .lstz-slide .lstz-slide__testa { display: none; }
	html body.lstz .lstz-slide .lstz-slide__in { justify-content: flex-end; }
	html body.lstz .lstz-slide .lstz-slide__nome { font-size: 22px; }
	html body.lstz .lstz-slide .lstz-slide__dida { gap: 10px; }
	html body.lstz .lstz-slide .lstz-slide__fondo { gap: 16px; }

	/* Invito finale con foto: velo più scuro, così il testo bianco si legge anche sopra neve e cielo */
	html body.lstz .lstz-cta--foto { padding: 72px 0; }
	html body.lstz .lstz-cta--foto .lstz-cta__velo { background: linear-gradient(180deg, rgba(0, 23, 56, .78) 0%, rgba(0, 23, 56, .86) 100%); }
	html body.lstz .lstz-cta .lstz-cta__emblema { width: 56px; height: 56px; }
	html body.lstz .lstz-cta--foto .lstz-cta__in { gap: 18px; }

	/* ---------- Altre pagine ---------- */

	/* Riquadro "Verifica date" delle schede: campi data un po' più piccoli, così "Aggiungi data" ci sta */
	html body.lstz .lstz-scheda__campo.lstz-scheda__campo--meta { padding-right: 10px; padding-left: 12px; }
	html body.lstz .lstz-scheda__campo--meta input { font-size: 14px; }

	/* Card dell'elenco alloggi: foto meno alte */
	html body.lstz .lstz-card--elenco .lstz-card__foto { aspect-ratio: 16 / 10; }

	/* Servizi nella pagina Colazione e servizi: icona a sinistra, testo a destra */
	html body.lstz .lstz-servizi--pagina .lstz-servizi__voce { display: grid; grid-template-columns: 44px minmax(0, 1fr); align-content: start; gap: 4px 14px; padding: 16px; }
	html body.lstz .lstz-servizi--pagina .lstz-servizi__icona { grid-row: span 2; width: 44px; height: 44px; border-radius: 12px; }

	/* Contatti: righe compatte (icona a sinistra, etichetta e valore a destra) */
	html body.lstz .lstz-canali .lstz-canali__scheda { display: grid; grid-template-columns: 40px 1fr; align-items: center; gap: 0 14px; padding: 14px 16px; }
	html body.lstz .lstz-canali .lstz-canali__icona { grid-row: span 2; width: 40px; height: 40px; margin: 0; }
	html body.lstz .lstz-canali .lstz-canali__valore { font-size: 16px; }

	/* Loghi dei partner in fondo: più piccoli */
	html body.lstz .lstz-piede ul.lstz-piede__loghi { gap: 16px 26px; }
	html body.lstz .lstz-piede__logo-partner img { height: 32px; }
}