/**
 * AeCI — Off-canvas mobile: il blu deve arrivare fino in cima.
 *
 * Il pannello dell'off-canvas parte 80px sotto il bordo superiore, per lasciare
 * scoperta la riga con logo e X. Sulla home però l'header è trasparente sopra
 * l'hero, quindi in quella striscia si vedeva la foto invece del blu.
 * Quando l'off-canvas è aperto (e mentre si richiude) la riga dell'header prende
 * lo stesso blu del pannello.
 *
 * OverPress Media — 05/08/2026
 */
/* 🚨 Agganciarsi anche a `.brx-closing` NON si può: al caricamento della pagina
   Bricks marca l'off-canvas come `brx-closing` per ~200ms mentre lo inizializza,
   e sulla home si vedeva un lampo blu in cima che poi spariva.
   Quindi si guarda solo `.brx-open`, e il ritorno al trasparente lo si ritarda
   di 0.2s (il tempo dello slide) così la chiusura non scopre l'hero in anticipo. */
@media (max-width: 767px) {
	.brxe-container:has(.brxe-offcanvas) {
		transition: background-color 0s linear 0.2s;
	}

	.brxe-container:has(.brxe-offcanvas.brx-open) {
		background-color: var(--bricks-color-lugclv, #1d3856);
		transition-delay: 0s;
	}
}

/**
 * Geometria del pannello.
 *
 * 🚨 `flex-wrap: nowrap` è obbligatorio: il pannello è una colonna flex che di
 * default ha `flex-wrap: wrap` e altezza vincolata, quindi appena il contenuto
 * supera l'altezza disponibile il menu azzurro **forma una seconda colonna a
 * destra** invece di scorrere. Capitava già da solo sugli schermi corti
 * (~667px di viewport).
 *
 * `max-height`: il pannello è fixed con top:0 e height:100%, spinto giù di 80px
 * dal margine, quindi arrivava 80px sotto il bordo dello schermo e le ultime
 * voci non si raggiungevano nemmeno scrollando. `max-height` e non `height`
 * perché l'altezza arriva dalle impostazioni dell'elemento con un selettore per
 * ID, che vincerebbe. `--bricks-vh` lo tiene aggiornato Bricks su `innerHeight`:
 * su iOS è la misura giusta (lì `100vh` è tutto lo schermo, barre comprese).
 */
@media (max-width: 767px) {
	.brxe-offcanvas .brx-offcanvas-inner {
		flex-wrap: nowrap;
		overflow-y: auto;
		max-height: calc(var(--bricks-vh, 1vh) * 100 - 80px);
	}

	/* niente schiacciamento: se non ci sta, si scorre */
	.brxe-offcanvas .brx-offcanvas-inner > * {
		flex-shrink: 0;
	}
}