:root{--green:#06B761;--red:#f01a46;--blue:#2a50d8}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{max-width:1440px;margin:0 auto;-webkit-tap-highlight-color:transparent;background:#fff;color:#000;font-family:Arial,Helvetica,sans-serif}
a{color:inherit;text-decoration:none}
.mono{font-family:'Space Mono',monospace}
/* header */
.site-header{height:131px;display:flex;justify-content:space-between;align-items:flex-start;padding:56px 98px 0 85px}
.logo{font-family:'Sixtyfour',monospace;font-variation-settings:'BLED' 0,'SCAN' 0;color:var(--green);font-size:36px;line-height:58px;letter-spacing:.07px;white-space:nowrap}
.nav{display:flex;gap:37px}
.pill{display:block;width:118px;height:51px;border:2px solid #000;border-radius:30px;background:#fff;font-size:24px;line-height:47px;text-align:center;transition:box-shadow .15s,text-shadow .15s}
.pill{--glow:var(--green)}
a.pill[href="mappa.html"]{--glow:var(--red)}
a.pill[href="cerca.html"]{--glow:var(--blue)}
.pill:hover,.pill:active,.pill:focus-visible,.pill.pressed,.pill.active{outline:0;box-shadow:0 0 15.2px 1px var(--glow),inset 0 0 8px 1px var(--glow);text-shadow:0 0 3.5px var(--glow)}
/* filter bar */
.filter-bar{position:relative;height:76px}
.sort-btn{position:absolute;left:75px;top:10px;padding:10px 7px;background:none;border:0;cursor:pointer;font:700 24px/36px 'Space Mono',monospace;letter-spacing:.07px}
.view-toggle{position:absolute;right:76px;top:24px;display:flex;gap:16px;align-items:center}
.view-toggle button{background:none;border:0;padding:6px;cursor:pointer;opacity:.45}
.view-toggle button.on{opacity:1}
.icon-grid{display:grid;grid-template-columns:11px 11px;gap:2px;width:26px}
.icon-grid i{display:block;height:11px;border:2px solid #000}
.view-toggle svg{display:block}
.dropdown{display:none;position:absolute;left:186px;top:96px;width:280px;z-index:5;background:#fff;border-radius:10px;filter:drop-shadow(0 2px 10px var(--green))}
.dropdown.open{display:block}
.dropdown button{display:block;width:100%;height:56px;text-align:left;background:#fff;border:0;padding:16px 20px;font:400 16px/24px 'Space Mono',monospace;cursor:pointer;white-space:nowrap}
.dropdown button:first-child{border-radius:10px 10px 0 0}.dropdown button:last-child{border-radius:0 0 10px 10px}
.dropdown button:hover,.dropdown button.sel{background:rgba(6,183,97,.12)}
/* grid */
.grid-row{display:flex;justify-content:center;align-items:flex-start;height:388px;padding:30px 80px 15px}
.block{display:block;position:relative;flex:none;overflow:hidden;background:#ddd;transition:box-shadow .15s}
.block img{width:100%;height:100%;object-fit:cover;display:block}
.block{--glow:var(--green)}
.block:nth-child(1) img[src$='grid-01.jpg']{background:#2a50d8}
.block:hover,.block:active,.block:focus-visible{outline:0;box-shadow:0 0 15px 2px var(--glow)}
/* list */
.list{max-width:1313px;margin:0 auto;padding:20px 10px 80px}
.list a{display:flex;justify-content:space-between;gap:20px;padding:5px 10px;font:400 20px/24px 'Space Mono',monospace}
.list a:hover{background:rgba(6,183,97,.12)}
.hidden{display:none!important}
/* pages */
.page{max-width:1133px;margin:0 auto;padding:0 10px 110px}
h1.title{font:700 36px/36px 'Space Mono',monospace;letter-spacing:.07px;margin:100px 0 0;padding:10px}
.green{font-family:'Space Mono',monospace;font-weight:700;color:var(--green)}
.about-row{display:flex;gap:37px;align-items:flex-start;margin-top:90px;font-size:20px;line-height:24px}
.about-row.second{gap:48px}
.about-row .img{flex:none;width:399px;box-shadow:inset 0 0 4px rgba(0,0,0,.25)}
.about-row img{width:100%;display:block;object-fit:cover}
.about-row p{margin:0 0 24px}
.search-box{position:relative;width:977px;max-width:100%;height:73px;margin:90px 10px 40px;border:2px solid #000;border-radius:30px}
.search-box svg{position:absolute;left:16px;top:16px;pointer-events:none}
.search-box input{position:absolute;inset:0;width:100%;height:100%;border:0;background:none;padding:0 20px 0 87px;font:400 20px 'Space Mono',monospace;outline:0}
.search-box input::placeholder{color:#acacac}
.map{display:block;width:1248px;max-width:100%;height:auto;margin:0 auto}
/* evento */
.evento{display:grid;grid-template-columns:488px 1fr;column-gap:183px;padding:76px 95px 0}
.evento .hero{width:488px;height:667px;object-fit:cover}
.meta{font:700 20px/36px 'Space Mono',monospace;margin-top:70px}
.meta b{color:var(--red)}.meta span{font:400 20px Arial}
.desc{font-size:20px;line-height:23px;max-width:458px}.desc a{color:var(--blue)}
.gallery{display:flex;gap:66px;padding:68px 97px 110px}
.gallery img{height:395px;object-fit:cover}

/* glow anche su Ordina, vista griglia/lista e voci del menu a tendina */
.sort-btn{border-radius:0;transition:text-shadow .15s;-webkit-tap-highlight-color:transparent}
.view-toggle button{border-radius:0;transition:filter .15s,opacity .15s;-webkit-tap-highlight-color:transparent}
.sort-btn:hover,.sort-btn:active{outline:0;box-shadow:none;text-shadow:0 0 4px var(--green),0 0 10px var(--green)}
.sort-btn:focus,.sort-btn:focus-visible{outline:0;box-shadow:none}
.view-toggle button:hover,.view-toggle button:active{outline:0;opacity:1;box-shadow:none;filter:drop-shadow(0 0 3px var(--green)) drop-shadow(0 0 6px var(--green))}
.view-toggle button:focus,.view-toggle button:focus-visible{outline:0;box-shadow:none}
.dropdown button:active,.dropdown button:focus-visible{outline:0;background:rgba(6,183,97,.25)}
.gallery img:nth-child(1){width:593px}.gallery img:nth-child(2){width:515px}

/* come nel prototipo Filtri: aprendo la tendina il contenuto scende di 288px */
.dd-space{height:0;transition:height .25s ease}
#home.dd-open .dd-space{height:288px}
