/* Regole al posto di quelle date dagli script rimossi del tema e del plugin della gallery. Classi del tema emmedue. */

/* Menu: senza JS è sempre intero e visibile, anche sotto i 767 px del tema. */
.menu-toggle { -webkit-appearance: none; appearance: none; font: inherit; }
.menu-toggle span { display: block; }
.no-js .menu-toggle { display: none !important; }
.no-js .main-navigation ul.menu { display: block; }
.no-js .sub-menu,
.main-navigation > ul > li.m2s-open > .sub-menu { display: block; opacity: 1; visibility: visible; }
@media only screen and (min-width: 768px) {
	.main-navigation > ul > li.m2s-open > .sub-menu { top: 80px; }
	/* chiuso dal pulsante o con Esc: resta chiuso anche sotto il puntatore */
	.main-navigation > ul > li.m2s-chiuso > .sub-menu { opacity: 0; visibility: hidden; }
}
.main-navigation .menu-item-has-children > a:not([href]) { cursor: pointer; }
.menu-toggle:focus-visible, .main-navigation a:focus-visible, .go-to-top:focus-visible,
.main-slider .flex-direction-nav a:focus-visible, .main-slider .flex-control-nav a:focus-visible {
	outline: 2px solid #dc143c; outline-offset: 2px;
}

/* Header sticky (.is-sticky sul wrapper, come lo script sticky del tema). Sotto i 767 px il tema lo tiene relative !important. */
.is-sticky #sticky-header { position: fixed; top: 0; left: 0; right: 0; }

/* «Torna su»: compare dopo 900 px di scorrimento, come event-main.js. */
.go-to-top { display: none; }
.go-to-top.is-visible { display: block; }
.no-js .go-to-top { display: block; }

/* Slider della home: una slide alla volta; i controlli hanno le classi flex-* del vecchio slider, stilate dal tema. */
.main-slider ul.slides > li[hidden] { display: none; }
.main-slider ul.slides > li:not([hidden]) { display: block; }
.main-slider .flex-control-nav, .main-slider .flex-direction-nav { list-style: none; margin: 0; padding: 0; }
.main-slider .flex-control-nav li a { min-width: 14px; }
.main-slider:focus-within a.flex-prev { left: 20px; }
.main-slider:focus-within a.flex-next { right: 20px; }

/* Gallery (vista popup di Huge-IT, regole del plugin per l'elemento 3). */
/* misure della vista di oggi a 1280 e 375 px: passo 292×215 px, griglia 18 px sotto il titolo */
#huge_it_portfolio_content_3 { padding-top: 18px; }
.huge_it_portfolio_container { display: flex; flex-wrap: wrap; column-gap: 15px; row-gap: 0; position: relative; }
.portelement_3 { max-width: 277px !important; width: 100%; margin: 0 0 10px 0; background: #f9f9f9;
	border: 1px solid #dedede; outline: none; box-sizing: border-box; }
.portelement_3 .image-block_3 { position: relative; width: 100%; height: 160px !important; }
.portelement_3 .image-block_3 img { margin: 0 !important; padding: 0 !important; width: 100% !important;
	height: 160px !important; display: block; border-radius: 0 !important; box-shadow: none !important; }
/* Overlay sempre nel flusso (il suo link è l'unico punto di apertura e deve ricevere il focus): solo l'aspetto cambia. */
.portelement_3 .image-block_3 .image-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%;
	background: rgba(255,255,255,0.7) !important; display: block; opacity: 0; }
.portelement_3:hover .image-block_3 .image-overlay,
.portelement_3:focus-within .image-block_3 .image-overlay { opacity: 1; }
.portelement_3 .image-block_3 .image-overlay a:focus-visible { outline: 2px solid #dc143c; outline-offset: -4px; }
.portelement_3 .image-block_3 .image-overlay a { border: none; position: absolute; top: 0; left: 0; display: block;
	width: 100%; height: 100%; }
.portelement_3 .image-block_3 .image-overlay a::before { content: "\f00e"; font-family: "FontAwesome"; font-size: 32px;
	color: #333; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
.no-js .portelement_3 .image-block_3 .image-overlay { background: transparent !important; }
.no-js .portelement_3 .image-block_3 .image-overlay a::before { content: none; }
.portelement_3 .title-block_3 { position: relative; height: 42px; margin: 0; border-top: 1px solid #dedede; box-sizing: content-box; }
.portelement_3 .title-block_3 h3 { position: relative; margin: 0 !important; padding: 0 1% !important; width: 90%;
	text-overflow: ellipsis; overflow: hidden; white-space: nowrap; font-weight: normal; top: 50%;
	transform: translateY(-50%); font-size: 18px !important; line-height: 22px !important; color: #222222; }
.no-js .m2s-lb-elenco[hidden] { display: block; }
.m2s-lb-elenco { margin: 4px 8px 8px; padding-left: 16px; font-size: 14px; }

/* Lightbox. */
.m2s-lightbox { position: fixed; inset: 0; background: rgba(0,0,0,.9); display: flex; align-items: center;
	justify-content: center; z-index: 10000; }
.m2s-lightbox[hidden] { display: none; }
.m2s-lightbox img { max-width: 92vw; max-height: 88vh; }
.m2s-lightbox button { position: absolute; min-width: 44px; min-height: 44px; background: rgba(0,0,0,.5); color: #fff;
	border: 1px solid #fff; font-size: 28px; line-height: 1; cursor: pointer; }
.m2s-lightbox button:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
.m2s-lb-chiudi { top: 16px; right: 16px; }
.m2s-lb-prev { left: 16px; top: 50%; transform: translateY(-50%); }
.m2s-lb-next { right: 16px; top: 50%; transform: translateY(-50%); }

@media (prefers-reduced-motion: reduce) { * { scroll-behavior: auto !important; } }