:root{--bg:#0e1011;--panel:#161a1b;--ink:#ecebe6;--muted:#9ba19e;--line:#ecebe61f;--green:#86c9b0;--coral:#e9694f;--display:'Jost','Futura','Century Gothic',sans-serif;--body:'Hanken Grotesk','Helvetica Neue',Arial,sans-serif;color-scheme:dark;
--i-strega:url(/foto/notte-streghe.jpg)}
*{box-sizing:border-box;margin:0}
html{scroll-behavior:smooth;scroll-padding-top:68px}
body{margin:0;background:var(--bg);color:var(--ink);font:17px/1.6 var(--body)}
a{color:inherit}
.wrap{max-width:1040px;margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
header{position:sticky;top:env(safe-area-inset-top,0px);z-index:5;background:#0e1011ee;backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
header .wrap{display:flex;justify-content:space-between;align-items:center;gap:12px;height:58px}
.mini{display:flex;align-items:center}.mini svg,.mini img{width:36px;height:36px;display:block}
nav{display:flex;gap:26px;align-items:center}
nav a{text-decoration:none;font:500 .86rem var(--display);letter-spacing:.08em;color:var(--muted)}
nav a:hover{color:var(--ink)}
nav a.chiama{color:var(--bg);background:var(--ink);padding:7px 16px;border-radius:999px}
nav a.chiama:hover{background:var(--green)}
.hero{padding-block:48px 72px;background:radial-gradient(ellipse 60% 70% at 25% 40%,#2d6a5655,transparent 70%)}
.hero2{display:grid;grid-template-columns:1.1fr .9fr;gap:56px;align-items:center}
.hero .btns{justify-content:flex-start}
.hero p{margin:12px 0 0}
.facciata{aspect-ratio:4/5;overflow:hidden;border-radius:6px;box-shadow:0 20px 60px #000a}
.facciata img{width:100%;height:100%;object-fit:cover;object-position:center 60%;display:block}
.locale{padding-block:64px 24px;border-top:1px solid var(--line)}
.locale .sub{color:var(--muted);margin:10px 0 28px;max-width:34em}
.mosaico{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:clamp(150px,22vw,250px);gap:10px;grid-auto-flow:dense}
.mosaico figure{overflow:hidden;border-radius:6px;background:var(--panel)}
.mosaico img{width:100%;height:100%;object-fit:cover;display:block}
.m-largo{grid-column:span 2}.m-alto{grid-row:span 2}
@media(max-width:700px){.hero2{grid-template-columns:1fr;gap:32px}.mosaico{grid-template-columns:1fr 1fr}.facciata{max-width:420px}}
.hero .lh{width:min(150px,40vw);height:auto}
.hero h1{margin-top:28px;font:400 clamp(1.8rem,4.6vw,2.9rem)/1.15 var(--display);letter-spacing:.16em;text-transform:uppercase;text-wrap:balance}
.hero p{margin:12px auto 0;color:var(--muted);max-width:30em}
.stato{text-align:left;display:inline-flex;max-width:100%;align-items:center;gap:10px;margin-top:26px;padding:8px 18px;border:1px solid var(--line);border-radius:999px;font:500 .85rem var(--display);letter-spacing:.08em}
.stato::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--muted)}
.stato.on::before{background:var(--green);box-shadow:0 0 10px var(--green)}
.btns{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:28px}
.btn{display:inline-block;padding:13px 28px;border:1px solid var(--ink);border-radius:999px;text-decoration:none;font:500 .92rem var(--display);letter-spacing:.08em}
.btn.p{background:var(--ink);color:var(--bg)}
.btn:hover{border-color:var(--green);color:var(--green)}.btn.p:hover{background:var(--green);color:var(--bg)}
.ph{background-size:cover;background-position:center;background-repeat:no-repeat}
h2{font:400 clamp(2rem,6vw,3.2rem)/1.1 var(--display);letter-spacing:.06em}
.eyebrow{font:500 .85rem var(--display);letter-spacing:.14em;text-transform:uppercase;color:var(--coral);margin-bottom:12px}
.evento{display:grid;grid-template-columns:minmax(0,320px) 1fr;gap:48px;align-items:center;padding-block:64px}
.evento .poster{aspect-ratio:5/8;background-image:var(--i-strega);background-size:auto 100%;box-shadow:0 20px 60px #000a}
.evento h2{margin-bottom:14px}
.evento p{color:var(--muted);max-width:30em}
.evento .btn{margin-top:22px}
/* menù a schede */
#menu{padding-top:24px;border-top:1px solid var(--line)}
.testa{padding-block:40px 8px}
.testa h2{margin-bottom:22px}
.tabs{display:flex;gap:8px;flex-wrap:wrap;position:sticky;top:calc(58px + env(safe-area-inset-top,0px));z-index:4;padding-block:12px;background:linear-gradient(var(--bg) 70%,#0e101100)}
.tab{font:500 .95rem var(--display);letter-spacing:.06em;color:var(--muted);background:none;border:1px solid var(--line);border-radius:999px;padding:10px 24px;cursor:pointer}
.tab:hover{color:var(--ink);border-color:var(--ink)}
.tab[aria-selected=true]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.tab:focus-visible,a:focus-visible{outline:2px solid var(--green);outline-offset:3px}
.js .pannello[hidden]{display:none}
.banner{height:clamp(150px,26vw,260px);margin-block:16px 8px;display:grid;grid-template-columns:repeat(var(--n,1),1fr);gap:4px}
.banner div{background-size:cover;background-position:center}
@media(max-width:700px){.banner[style*="--n:3"] div:nth-child(3){display:none}.banner[style*="--n:3"]{--n:2!important}}
.contenuto{columns:2 360px;column-gap:64px;padding-block:24px 72px}
.gruppo{break-inside:avoid-column;margin-bottom:40px}
.gruppo.largo{column-span:all}
.gruppo h3{font:400 1.55rem/1.2 var(--display);letter-spacing:.04em;color:var(--green);display:flex;align-items:center;gap:14px}
.gruppo h3::after{content:"";flex:1;height:1px;background:var(--line)}
.gruppo>.nota{margin-top:6px}
ul{list-style:none;padding:0}
.voce{display:flex;justify-content:space-between;align-items:baseline;gap:20px;padding:15px 0;border-bottom:1px dotted #ecebe63a}
.voce:last-child{border-bottom:0}
.voce>div{min-width:0}
.voce b{font-weight:600;font-size:1.02rem}
small{display:block;margin-top:2px;color:var(--muted);font-size:.9rem;line-height:1.5}
.prezzo{white-space:nowrap;font:500 1rem var(--display);letter-spacing:.04em;font-variant-numeric:tabular-nums;color:var(--ink)}
.nota{color:var(--muted);font-size:.9rem;margin-top:18px}
.firme{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:14px}
.firma{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:18px 20px;display:flex;flex-direction:column;gap:6px}
.firma .top{display:flex;justify-content:space-between;gap:12px;align-items:baseline}
.firma b{font:500 1.1rem var(--display);letter-spacing:.02em}
.liv{display:flex;gap:16px;flex-wrap:wrap;margin-top:auto;padding-top:10px;font:500 .76rem var(--display);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.liv>span{display:flex;align-items:center;gap:8px}
.pips{display:inline-flex;gap:3px}
.pips i{width:8px;height:8px;border-radius:50%;border:1px solid var(--coral)}
.pips i.on{background:var(--coral)}
/* recensioni */
.rec{display:grid;grid-template-columns:minmax(0,340px) 1fr;gap:56px;padding-block:72px;align-items:start}
.voto .num{font:400 clamp(4rem,12vw,6rem)/1 var(--display);letter-spacing:.02em}.voto .num span{font-size:1.4rem;color:var(--muted);letter-spacing:.06em;margin-left:6px}
.eccellente{font:500 .95rem var(--display);letter-spacing:.1em;text-transform:uppercase;color:var(--green);margin-top:6px}
.sub3{display:flex;gap:28px;margin:22px 0;font:500 .82rem var(--display);letter-spacing:.08em;color:var(--muted)}
.sub3 b{display:block;font-size:1.5rem;letter-spacing:.02em;color:var(--ink);font-weight:500}
.rec .nota{margin-top:10px}.rec .btn{margin-top:4px}
blockquote{padding:22px 0;border-bottom:1px solid var(--line)}
blockquote:first-child{padding-top:0}
blockquote p{font:400 1.2rem/1.45 var(--body)}
cite{display:block;margin-top:8px;font:500 .82rem var(--display);letter-spacing:.06em;font-style:normal;color:var(--muted)}
/* orari e contatti */
.panel{background:var(--panel)}
.orari{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:start;padding-block:72px}
.orari h2{font-size:clamp(1.7rem,5vw,2.4rem);margin-bottom:24px}
table{border-collapse:collapse;width:100%}
td{padding:12px 0;border-bottom:1px solid var(--line);font-variant-numeric:tabular-nums}
td:first-child{font-weight:600}td:last-child{text-align:right}
.chiuso td{color:var(--muted)}
.dove h3{font:500 .85rem var(--display);letter-spacing:.14em;text-transform:uppercase;color:var(--green);margin-top:26px}
.dove h3:first-of-type{margin-top:0}
.dove p{margin-top:6px}
footer{border-top:1px solid var(--line);color:var(--muted);text-align:center;padding-block:40px;font-size:.85rem}
footer svg,footer img{width:54px;height:54px;margin-bottom:14px}
@media(max-width:700px){.evento,.rec,.orari{grid-template-columns:1fr;gap:28px}.evento .poster{max-width:300px}nav{gap:16px}nav a.chiama{display:none}.contenuto{columns:1}.tab{padding:9px 18px}}
@media(max-width:420px){nav a{font-size:.78rem}}

.fotogrid.tre{grid-template-columns:repeat(3,1fr)}
.hero-sala{background:linear-gradient(#0e1011d0,#0e1011f4),url(/foto/sala.jpg) center/cover;text-align:center}
.pagina-feste .hero p{margin-inline:auto}.pagina-feste .btns{justify-content:center}
@media(max-width:700px){.fotogrid.tre{grid-template-columns:1fr 1fr}.fotogrid.tre figure:last-child{display:none}}
.fotogrid{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding-block:8px 64px}
.fotogrid figure{aspect-ratio:4/5;overflow:hidden;background:var(--panel);border-radius:6px}
.fotogrid img{width:100%;height:100%;object-fit:cover;display:block}
@media(max-width:700px){.fotogrid{gap:8px;padding-block:0 40px}}

.pagina-feste .hero{padding-block:64px 72px}
.pagina-feste .hero h1{font-size:clamp(1.9rem,6vw,3.2rem)}
.sez{padding-block:64px;border-top:1px solid var(--line)}
.sez h2{margin-bottom:28px}
.occasioni{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:14px}
.occasioni li{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:22px 20px;font:500 1.1rem var(--display);letter-spacing:.02em}
.occasioni small{font:400 .92rem/1.5 var(--body);letter-spacing:0;margin-top:6px}
.duecol{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:start}
.duecol p{color:var(--muted);max-width:32em}.duecol p+p{margin-top:14px}
.passi{counter-reset:p;display:grid;gap:0}
.passi li{counter-increment:p;display:grid;grid-template-columns:44px 1fr;gap:12px;padding:18px 0;border-bottom:1px solid var(--line)}
.passi li::before{content:counter(p);font:400 1.8rem/1 var(--display);color:var(--green)}
.passi b{display:block;font-weight:600}.passi span{color:var(--muted);font-size:.95rem}
.cta{background:var(--panel);text-align:center;padding-block:72px}
.cta h2{margin-bottom:14px}.cta p{color:var(--muted);max-width:30em;margin:0 auto}
.cta .tel{display:block;margin:26px 0 6px;font:400 clamp(1.8rem,6vw,2.8rem) var(--display);letter-spacing:.04em;text-decoration:none}
@media(max-width:700px){.duecol{grid-template-columns:1fr;gap:28px}}