/* Header dell'Atelier — proposta A, stesso linguaggio dell'header del blog "Appunti di architettura".
   Gli ID .elementor-element-* sono quelli del template Jet "header" (ID 8):
   a23c530 sezione esterna · 7a12b37 sezione interna · 9c734e3 colonna logo · 6e8fe6d colonna menu
   5083132 logo · 960c55b scritta accanto al logo · df6b367 menu Jet (menu WP 6)
   I font Switzer e il nero del sito sono in site.css. */

:root{--hd-h:80px;--hd-h-sm:56px;--hd-ease:cubic-bezier(.2,.7,.2,1);--hd-line:#62625F;--hd-red:#C33729;--hd-red-hover:#A52C22}

/* ---------- sticky ---------- */
/* overflow:hidden su .site trasforma il contenitore in area di scroll e blocca lo sticky; clip taglia allo stesso modo senza bloccarlo */
.site{overflow:clip}
#masthead{position:sticky;top:0;z-index:2147483647;font-family:"Switzer",Helvetica,Arial,sans-serif}
body.admin-bar #masthead{top:32px}
@media (max-width:782px){body.admin-bar #masthead{top:46px}}
@media (max-width:600px){body.admin-bar #masthead{top:0}}
html{scroll-padding-top:72px}
/* il lightbox delle immagini resta sopra l'header (stesso z-index, ma viene dopo nel DOM) */
.dialog-lightbox-widget,.elementor-lightbox{z-index:2147483647 !important}

/* ---------- barra ---------- */
#masthead .elementor-element-a23c530{padding:0;background:#0E0E0E}
#masthead .elementor-element-7a12b37{background:transparent}
#masthead .elementor-element-a23c530>.elementor-container,
#masthead .elementor-element-7a12b37>.elementor-container{max-width:none;flex-wrap:nowrap}
#masthead .elementor-element-a23c530 .elementor-element-populated{padding:0}
#masthead .elementor-element-9c734e3{width:auto;flex:0 0 auto}
#masthead .elementor-element-6e8fe6d{width:auto;flex:1 1 auto;min-width:0}

/* ---------- marchio: logo + divisore + scritta su due righe ---------- */
#masthead .elementor-element-9c734e3>.elementor-widget-wrap{flex-wrap:nowrap;align-items:center;gap:20px;padding-left:40px}
#masthead .elementor-element-9c734e3 .elementor-widget{width:auto;margin:0}
#masthead .elementor-element-5083132 img{display:block;width:72px;max-width:none;height:auto;transition:width .35s var(--hd-ease)}
#masthead .elementor-element-960c55b .elementor-heading-title{margin:0;padding-left:20px;border-left:1px solid var(--hd-line);font:500 12px/1.35 "Switzer",Helvetica,Arial,sans-serif;letter-spacing:.08em;text-transform:uppercase;text-align:left;color:#FFFFFF;white-space:nowrap}

/* ---------- menu a celle ---------- */
#masthead .elementor-element-6e8fe6d>.elementor-widget-wrap{justify-content:flex-end;align-items:stretch}
#masthead .elementor-element-df6b367{width:auto;margin:0;padding:0}
#masthead .elementor-element-df6b367>.elementor-widget-container,
#masthead .elementor-element-df6b367 .jet-nav-wrap,
#masthead .elementor-element-df6b367 .menu-menu-container{height:100%;margin:0;padding:0}
#masthead .jet-nav--horizontal{height:100%;align-items:stretch;flex-wrap:nowrap}
#masthead .jet-nav--horizontal>.jet-nav__item{display:flex;margin:0}
#masthead .jet-nav--horizontal>.jet-nav__item>.menu-item-link{display:flex;align-items:center;gap:10px;min-height:var(--hd-h);margin:0;padding:0 32px;border-left:1px solid var(--hd-line);background:transparent;font:400 15px/1 "Switzer",Helvetica,Arial,sans-serif;letter-spacing:0;color:#FFFFFF;box-shadow:none;transition:min-height .35s var(--hd-ease),background-color .2s ease,box-shadow .2s ease}
#masthead .jet-nav--horizontal>.jet-nav__item>.menu-item-link .jet-nav-link-text{font:inherit;letter-spacing:inherit;color:inherit}
#masthead .jet-nav--horizontal>.jet-nav__item>.menu-item-link:hover,
#masthead .jet-nav--horizontal>.jet-nav__item.hover-state>.menu-item-link{background:var(--hd-red);color:#FFFFFF}
#masthead .jet-nav--horizontal>.jet-nav__item>.menu-item-link:active{background:var(--hd-red-hover)}
#masthead .jet-nav--horizontal>.jet-nav__item>.menu-item-link:focus-visible{outline:1px solid #FFFFFF;outline-offset:-6px}
/* voce attiva: la decide atelier-header.js (sezione visibile o pagina corrente), non lo stato "current" di Jet */
#masthead .jet-nav--horizontal>.jet-nav__item.is-active>.menu-item-link{box-shadow:inset 0 -2px 0 var(--hd-red)}
/* Contatti: l'unica azione in rosso */
#masthead .jet-nav--horizontal>.jet-nav__item-121>.menu-item-link{background:var(--hd-red)}
#masthead .jet-nav--horizontal>.jet-nav__item-121>.menu-item-link:hover{background:var(--hd-red-hover)}
#masthead .jet-nav--horizontal>.jet-nav__item-121.is-active>.menu-item-link{box-shadow:inset 0 -2px 0 #FFFFFF}

/* Home la fa il logo; il terzo livello (i singoli progetti) è troppo lungo per un menu */
#masthead .jet-nav__item-118,
#masthead .jet-nav--horizontal>.jet-nav__item-118{display:none}
#masthead .jet-nav__sub .jet-nav__sub,
#masthead .jet-nav__sub .jet-nav-arrow{display:none}
#masthead .jet-nav-arrow{margin:0;font-size:12px;color:inherit;opacity:.7}

/* tendina Progetti: le cinque categorie */
#masthead .jet-nav--horizontal .jet-nav__sub.jet-nav-depth-0{min-width:260px;padding:8px 0;margin:0;background:#0E0E0E;border:0;border-top:2px solid var(--hd-red);box-shadow:none}
#masthead .jet-nav__sub .menu-item-link{display:block;padding:12px 24px;background:transparent;font:400 14px/1.35 "Switzer",Helvetica,Arial,sans-serif;color:#FFFFFF;border:0;transition:background-color .2s ease}
#masthead .jet-nav__sub .jet-nav-link-text{font:inherit;letter-spacing:inherit;color:inherit}
#masthead .jet-nav__sub .menu-item-link:hover{background:var(--hd-red);color:#FFFFFF}

/* ---------- compatto allo scroll ---------- */
#masthead.is-compact .elementor-element-5083132 img{width:52px}
#masthead.is-compact .jet-nav--horizontal>.jet-nav__item>.menu-item-link{min-height:var(--hd-h-sm)}

/* ---------- tablet: celle più strette ---------- */
@media (max-width:1180px){
	#masthead .elementor-element-9c734e3>.elementor-widget-wrap{padding-left:24px}
	#masthead .jet-nav--horizontal>.jet-nav__item>.menu-item-link{padding:0 20px}
}
@media (max-width:1024px){
	#masthead .elementor-element-960c55b{display:none}
}

/* ---------- mobile: logo + pulsante "Menu" ---------- */
@media (max-width:767px){
	#masthead .elementor-element-9c734e3>.elementor-widget-wrap{padding-left:16px}
	#masthead .elementor-element-5083132 img,
	#masthead.is-compact .elementor-element-5083132 img{width:52px}
	#masthead .elementor-element-6e8fe6d>.elementor-widget-wrap{align-items:stretch}
	/* sopra il pannello laterale aperto (z-index 9999 di Jet), così "Chiudi" resta intero */
	#masthead .jet-nav__mobile-trigger{position:relative;z-index:10000;display:flex;align-items:center;gap:10px;width:auto;height:var(--hd-h-sm);margin:0;padding:0 16px;border-left:1px solid rgba(255,255,255,.12);background:#0E0E0E;color:#FFFFFF;font:400 15px/1 "Switzer",Helvetica,Arial,sans-serif;cursor:pointer}
	#masthead .jet-nav__mobile-trigger::before{content:"Menu"}
	#masthead .jet-nav__mobile-trigger .jet-blocks-icon{font-size:16px;color:#FFFFFF}

	/* pannello laterale: voci a tutta larghezza separate da filetti, come l'indice del blog */
	#masthead .jet-mobile-menu .jet-nav{height:100%;padding:64px 0 24px;background:#0E0E0E;overflow-y:auto}
	#masthead .jet-mobile-menu .jet-nav>.jet-nav__item{display:block;border-bottom:1px solid rgba(255,255,255,.12)}
	#masthead .jet-mobile-menu .jet-nav>.jet-nav__item:first-child,
	#masthead .jet-mobile-menu .jet-nav>.jet-nav__item-118+.jet-nav__item{border-top:1px solid rgba(255,255,255,.12)}
	#masthead .jet-mobile-menu .jet-nav>.jet-nav__item>.menu-item-link{justify-content:space-between;width:100%;min-height:0;padding:18px 24px;border-left:0;font-size:18px;line-height:1.2}
	#masthead.is-compact .jet-mobile-menu .jet-nav>.jet-nav__item>.menu-item-link{min-height:0}
	#masthead .jet-mobile-menu .jet-nav>.jet-nav__item.is-active>.menu-item-link{box-shadow:inset 2px 0 0 var(--hd-red)}
	#masthead .jet-mobile-menu .jet-nav>.jet-nav__item-121.is-active>.menu-item-link{box-shadow:inset 2px 0 0 #FFFFFF}
	#masthead .jet-mobile-menu .jet-nav__sub.jet-nav-depth-0{position:static;min-width:0;padding:0 0 12px;margin:0;background:transparent;border:0}
	#masthead .jet-mobile-menu .jet-nav__sub .menu-item-link{padding:10px 24px 10px 40px;font-size:15px;color:rgba(255,255,255,.75)}
	#masthead .jet-mobile-menu .jet-nav__sub .menu-item-link:hover{background:transparent;color:#FFFFFF}
	#masthead .jet-mobile-menu .jet-nav>.jet-nav__item-118{display:none}
	/* si chiude dallo stesso pulsante, che diventa "Chiudi": la X dentro il pannello sarebbe un doppione */
	#masthead .jet-nav__mobile-close-btn{display:none}
	#masthead .jet-mobile-menu-active .jet-nav__mobile-trigger::before{content:"Chiudi"}
}

@media (prefers-reduced-motion:reduce){
	#masthead .elementor-element-5083132 img,
	#masthead .jet-nav--horizontal>.jet-nav__item>.menu-item-link{transition:none}
}