/* Comportamento su tablet e mobile, uguale per tutti i siti. */

/* Titoli: una parola lunga non esce mai dallo schermo (su mobile va a capo con il trattino, lasciando almeno 4 lettere) */
:is(h1, h2, h3, h4, h5, h6) {
	overflow-wrap: break-word;
}
@media (max-width: 599px) {
	:is(h1, h2) {
		-webkit-hyphens: auto;
		hyphens: auto;
		-webkit-hyphenate-limit-before: 5;
		-webkit-hyphenate-limit-after: 4;
		hyphenate-limit-chars: 12 5 4;
	}
}

/* Header: le voci del menu non si spezzano; il pulsante sta su una riga, su mobile al massimo su due righe equilibrate */
header.wp-block-template-part .wp-block-button__link,
header.wp-block-template-part .wp-block-navigation-item__label {
	white-space: nowrap;
}
@media (max-width: 599px) {
	header.wp-block-template-part .wp-block-button__link {
		padding: 0.55em 1.1em;
		font-size: var(--wp--preset--font-size--x-small);
		line-height: 1.2;
		white-space: normal;
		text-wrap: balance;
		text-align: center;
	}
}

/* Header: menu a tendina (icona) anche sul tablet, fino a 1023px; con 7 o più voci fino a 1279px.
   WordPress da solo apre il menu già a 600px e con molte voci andava su due righe */
@media (min-width: 600px) and (max-width: 1023px) {
	header.wp-block-template-part .wp-block-navigation__responsive-container:not(.is-menu-open) {
		display: none;
	}
	header.wp-block-template-part .wp-block-navigation__responsive-container-open:not(.always-shown) {
		display: flex;
	}
}
@media (min-width: 1024px) and (max-width: 1279px) {
	header.wp-block-template-part .wp-block-navigation:has(.wp-block-navigation__container > li:nth-child(7)) .wp-block-navigation__responsive-container:not(.is-menu-open) {
		display: none;
	}
	header.wp-block-template-part .wp-block-navigation:has(.wp-block-navigation__container > li:nth-child(7)) .wp-block-navigation__responsive-container-open:not(.always-shown) {
		display: flex;
	}
}

/* Menu a tendina aperto: colori del sito, margini e voci grandi, a ogni larghezza */
header.wp-block-template-part .wp-block-navigation__responsive-container.is-menu-open {
	padding: var(--wp--preset--spacing--40) var(--wp--preset--spacing--50);
	background-color: var(--wp--preset--color--base) !important;   /* WordPress qui impone bianco e nero */
	color: var(--wp--preset--color--contrast) !important;
}
header.wp-block-template-part .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
	gap: var(--wp--preset--spacing--40);
	font-size: var(--wp--preset--font-size--large);
}

/* Griglie di 4 elementi sul tablet: due per riga invece di tre più uno da solo */
@media (min-width: 600px) and (max-width: 1023px) {
	.wp-block-group.is-layout-grid:has(> :nth-child(4):last-child) {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}
