/* V111 — Configuratore: la scelta del modello è una pagina, non un popup.
   Si apre sotto il menu del sito, a tutta larghezza, fondo bianco, niente velo, niente angoli tondi. */
html:not(#a) #selector.modal{position:fixed !important;inset:var(--sel-top,72px) 0 0 0 !important;z-index:190 !important;/* V142: sotto intestazione, menu e mega-menu (200) */display:block;padding:0 !important;
  background:#fff !important;-webkit-backdrop-filter:none !important;backdrop-filter:none !important;overflow-y:auto !important;overscroll-behavior:contain;}
html:not(#a) #selector .mdl-in{width:100% !important;max-width:1480px !important;max-height:none !important;margin:0 auto !important;border-radius:0 !important;
  box-shadow:none !important;background:#fff !important;transform:none !important;overflow:visible !important;
  padding:clamp(40px,5vw,80px) var(--gutter,clamp(24px,4vw,72px)) clamp(60px,6vw,110px) !important;}
html:not(#a) #selector .mdl-list{overflow:visible !important;max-height:none !important;
  grid-template-columns:repeat(auto-fill,minmax(260px,1fr)) !important;gap:clamp(28px,3vw,44px) clamp(20px,2.4vw,40px) !important;margin:0 !important;padding:0 !important;}
/* le card come quelle delle pagine collezione: niente riquadro, una linea sotto */
html:not(#a) #selector .mdl{border-radius:0 !important;background:transparent !important;box-shadow:none !important;padding:0 0 14px !important;
  border:0 !important;border-bottom:1px solid rgba(17,17,17,.14) !important;transform:none !important;}
html:not(#a) #selector .mdl:hover{background:transparent !important;}
html:not(#a) #selector .mdl.cur{border-bottom-color:#aa1e1b !important;outline:0 !important;}
html:not(#a) #selector .mdl-preview{border-radius:0 !important;background:#fff !important;aspect-ratio:4/3 !important;height:auto !important;min-height:0 !important;overflow:hidden !important;}
html:not(#a) #selector .mdl-preview img{position:absolute !important;inset:0 !important;width:100% !important;height:100% !important;max-height:none !important;object-fit:contain !important;object-position:50% 50% !important;transform:none !important;}
html:not(#a) #selector .mdl-copy{position:relative;z-index:2;background:transparent !important;padding-top:14px !important;}
html:not(#a) #selector .mdl strong{font-family:var(--t-serif) !important;font-weight:400 !important;font-size:26px !important;letter-spacing:-.01em !important;}
html:not(#a) #selector .mdl-h{align-items:flex-start;}
html:not(#a) #selector .mdl-h h2{font-size:calc(var(--t1,clamp(42px,4.6vw,68px)) * 1.14) !important;}
/* "Chiudi" diventa "Torna indietro", in alto a destra */
html:not(#a) #selector [data-sel-close]{width:auto !important;height:auto !important;border-radius:999px !important;padding:10px 16px !important;gap:8px;display:inline-flex !important;align-items:center;
  border:1px solid rgba(17,17,17,.2) !important;background:#fff !important;text-transform:uppercase;color:#111 !important;}
html:not(#a) #selector [data-sel-close] svg{width:14px;height:14px;}
html:not(#a) #selector [data-sel-close]::after{content:"Torna indietro";}
html:not(#a) #selector [data-sel-close]:hover{background:#111 !important;color:#fff !important;}
html.modal-open:not(#a) #selector ~ *{visibility:visible;}
@media (max-width:760px){
  :root{--sel-top:62px;}
  html:not(#a) #selector .mdl-in{padding:28px 20px 60px !important;}
  html:not(#a) #selector .mdl-list{grid-template-columns:1fr !important;gap:24px !important;}
  html:not(#a) #selector .mdl strong{font-size:24px !important;}
  html:not(#a) #selector [data-sel-close]::after{content:"Indietro";}
}
html:not(#a) #selector.modal[hidden]{display:none !important;}
html:not(#a) #selector [data-sel-close]::after{font-family:"Futura NAOS",system-ui,sans-serif;font-weight:500;font-size:12.5px;line-height:1;letter-spacing:.12em;}
html:not(#a) #selector [data-sel-close]{font-size:0 !important;letter-spacing:0 !important;}
html:not(#a) #selector .mdl-copy{padding-left:0 !important;padding-right:0 !important;}
@media (max-width:760px){
  html:not(#a) #selector .mdl-list{grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:24px 14px !important;}
  html:not(#a) #selector .mdl strong{font-size:20px !important;}
  html:not(#a) #selector .mdl-h h2{font-size:40px !important;}
}
.cfgl-img{aspect-ratio:16/9 !important;}
html:not(#a) body .cfgl-copy strong{font-family:var(--t-serif) !important;font-weight:400 !important;letter-spacing:-.01em !important;}
/* V143 — come nelle altre pagine: il menu del telefono si apre SOTTO l'intestazione (logo e X restano visibili),
   ma sopra la pagina "Scegli il modello" (190) */
html:not(#a) body .mnav{z-index:195 !important;}
/* V144 — livelli fissi in TUTTA la pagina del configuratore (scelta collezione, scelta modello, configurazione):
   intestazione 200 > menu del telefono 195 > pagina "Scegli il modello" 190 > configuratore.
   Prima l'intestazione tornava a 100 durante la configurazione e il menu aperto copriva logo e X. */
html:not(#a) body .site-header{z-index:200 !important;}
