:root{
  --antracite:#1f2125; --antracite-2:#2a2d32; --grigio:#3a3e45; --grigio-2:#6b7078;
  --linea:#e4e5e8; --sfondo:#f4f4f5; --bianco:#fff; --rosso:#c8102e; --rosso-2:#a50d26;
  --ombra:0 2px 10px rgba(20,22,26,.07); --ombra-2:0 6px 22px rgba(20,22,26,.11);
  --r:12px; --r-btn:999px;
  font-family:'Poppins','Century Gothic',system-ui,sans-serif; font-weight:300; color:var(--antracite);
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--sfondo)}
body{font-size:15px;line-height:1.55}
a{color:inherit}
h1,h2,h3,h4{font-weight:500;margin:0 0 .4em;letter-spacing:-.01em}
strong,b{font-weight:500}
img{max-width:100%;display:block}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5em;border:0;border-radius:var(--r-btn);
  padding:.7em 1.4em;font:inherit;font-weight:400;cursor:pointer;text-decoration:none;transition:background .15s,box-shadow .15s;
  background:var(--rosso);color:#fff;box-shadow:var(--ombra)}
.btn:hover{background:var(--rosso-2)}
.btn.sec{background:var(--bianco);color:var(--antracite);border:1px solid var(--linea);box-shadow:none}
.btn.sec:hover{background:var(--sfondo)}
.btn.scuro{background:var(--grigio)}
.btn.scuro:hover{background:var(--antracite)}
.btn.piccolo{padding:.4em .9em;font-size:13px}
.btn[disabled]{opacity:.5;cursor:default}

/* ---------- Layout 3 colonne ---------- */
.app{display:grid;grid-template-columns:230px 270px 1fr;min-height:100vh}
.menu{background:var(--antracite);color:#fff;position:sticky;top:0;height:100vh;padding:28px 22px;display:flex;flex-direction:column;gap:26px}
.logo{display:block;text-decoration:none;line-height:1.1}
.logo .nome{font-size:24px;font-weight:500;letter-spacing:.06em}
.logo .nome span{color:var(--rosso)}
.logo .sub{font-size:11px;letter-spacing:.25em;color:#9a9ea6;text-transform:uppercase;margin-top:4px}
.menu nav{display:flex;flex-direction:column;gap:4px}
.menu nav a{text-decoration:none;color:#c9ccd1;padding:.6em .9em;border-radius:10px;font-weight:300}
.menu nav a:hover{background:var(--antracite-2);color:#fff}
.menu nav a.attivo{background:var(--grigio);color:#fff;font-weight:400}
.menu .contatti-mini{margin-top:auto;font-size:13px;color:#9a9ea6}
.menu .contatti-mini a{color:#fff;text-decoration:none}

.filtri{background:var(--bianco);border-right:1px solid var(--linea);position:sticky;top:0;height:100vh;overflow:auto;padding:28px 22px}
.filtri h3{font-size:13px;text-transform:uppercase;letter-spacing:.12em;color:var(--grigio-2);margin:22px 0 10px;font-weight:400}
.filtri h3:first-child{margin-top:0}
.campo{width:100%;padding:.6em .9em;border:1px solid var(--linea);border-radius:10px;font:inherit;background:#fff;color:var(--antracite)}
.campo:focus{outline:2px solid rgba(200,16,46,.25);border-color:var(--rosso)}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chip{border:1px solid var(--linea);background:#fff;border-radius:var(--r-btn);padding:.35em .85em;font:inherit;font-size:13px;cursor:pointer;color:var(--antracite)}
.chip:hover{border-color:var(--grigio-2)}
.chip.on{background:var(--antracite);color:#fff;border-color:var(--antracite)}
.lista-marche{display:flex;flex-direction:column;gap:2px;max-height:260px;overflow:auto}
.lista-marche label{display:flex;align-items:center;gap:8px;padding:4px 6px;border-radius:8px;cursor:pointer;font-size:14px}
.lista-marche label:hover{background:var(--sfondo)}
.lista-marche input{accent-color:var(--rosso)}
.lista-marche .n{margin-left:auto;color:var(--grigio-2);font-size:12px}
.range-val{font-size:13px;color:var(--grigio-2);float:right;font-weight:400}
input[type=range]{width:100%;accent-color:var(--rosso)}
.azzera{margin-top:22px;width:100%}

.contenuto{padding:28px 32px;min-width:0}
.testa{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:20px;flex-wrap:wrap}
.testa h1{font-size:26px;margin:0}
.testa .conta{color:var(--grigio-2);font-size:14px}
.ordina{display:flex;gap:10px;align-items:center}
.ordina .campo{width:auto}

.griglia{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:20px}
.card{background:#fff;border-radius:var(--r);overflow:hidden;box-shadow:var(--ombra);text-decoration:none;display:flex;flex-direction:column;transition:box-shadow .2s,transform .2s}
.card:hover{box-shadow:var(--ombra-2);transform:translateY(-2px)}
.card .foto{aspect-ratio:4/3;background:#e9eaec center/cover no-repeat;position:relative}
.badge{position:absolute;top:10px;left:10px;background:var(--rosso);color:#fff;font-size:11px;padding:.25em .75em;border-radius:var(--r-btn);font-weight:400;letter-spacing:.04em}
.badge.venduta{background:var(--antracite)}
.card .corpo{padding:14px 16px 16px;display:flex;flex-direction:column;gap:6px;flex:1}
.card .titolo{font-weight:500;font-size:16px;line-height:1.3}
.card .versione{color:var(--grigio-2);font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.card .dati{display:flex;flex-wrap:wrap;gap:6px 12px;font-size:13px;color:var(--grigio);margin-top:4px}
.card .prezzo{margin-top:auto;padding-top:10px;font-size:20px;font-weight:500;color:var(--rosso)}
.sentinella{height:60px;display:flex;align-items:center;justify-content:center;color:var(--grigio-2);font-size:14px}
.vuoto{background:#fff;border-radius:var(--r);padding:40px;text-align:center;color:var(--grigio-2);box-shadow:var(--ombra)}

.mobile-bar{display:none}

/* ---------- Pagine testo ---------- */
.pagina{max-width:880px}
.blocco{background:#fff;border-radius:var(--r);box-shadow:var(--ombra);padding:28px 30px;margin-bottom:20px}
.hero{background:linear-gradient(120deg,var(--antracite),var(--grigio));color:#fff;border-radius:var(--r);padding:40px 34px;margin-bottom:20px}
.hero .kicker{color:#ff8a9a;font-size:12px;letter-spacing:.25em;text-transform:uppercase}
.hero h1{font-size:32px;margin:.2em 0 .3em}
.hero p{color:#d6d8dc;max-width:620px;margin:0}
.info-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}
.info-grid .voce{font-size:13px;color:var(--grigio-2)}
.info-grid .val{font-size:16px;font-weight:400}
table.orari{border-collapse:collapse;width:100%}
table.orari td{padding:8px 0;border-bottom:1px solid var(--linea)}
table.orari td:last-child{text-align:right}

/* ---------- Dettaglio ---------- */
.dettaglio{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(280px,1fr);gap:24px;align-items:start}
.galleria .principale{aspect-ratio:4/3;background:#e9eaec center/contain no-repeat;border-radius:var(--r);box-shadow:var(--ombra);background-color:#fff}
.miniature{display:flex;gap:8px;margin-top:10px;overflow-x:auto;padding-bottom:4px}
.miniature button{flex:0 0 86px;aspect-ratio:4/3;border:2px solid transparent;border-radius:8px;background:#e9eaec center/cover;cursor:pointer;padding:0}
.miniature button.on{border-color:var(--rosso)}
.scheda{position:sticky;top:28px}
.scheda .prezzo{font-size:30px;color:var(--rosso);font-weight:500;margin:6px 0 16px}
.scheda .azioni{display:flex;flex-direction:column;gap:10px}
.specifiche{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:14px}
.specifiche div{background:var(--sfondo);border-radius:10px;padding:10px 14px}
.specifiche .voce{font-size:12px;color:var(--grigio-2)}
.specifiche .val{font-weight:400}
.indietro{display:inline-block;margin-bottom:16px;text-decoration:none;color:var(--grigio-2);font-size:14px}
.indietro:hover{color:var(--rosso)}

/* ---------- Responsive ---------- */
@media (max-width:1100px){
  .app{grid-template-columns:200px 1fr}
  .filtri{position:fixed;inset:0 auto 0 0;width:300px;z-index:30;transform:translateX(-100%);transition:transform .25s;box-shadow:var(--ombra-2)}
  .filtri.aperti{transform:none}
  .btn-filtri{display:inline-flex!important}
  .dettaglio{grid-template-columns:1fr}
  .scheda{position:static}
}
@media (max-width:760px){
  .app{grid-template-columns:1fr}
  .menu{display:none}
  .mobile-bar{display:flex;align-items:center;justify-content:space-between;background:var(--antracite);color:#fff;padding:12px 16px;position:sticky;top:0;z-index:20}
  .mobile-bar .logo .nome{font-size:19px}
  .mobile-bar .logo .sub{display:none}
  .mobile-bar nav{display:flex;gap:4px}
  .mobile-bar nav a{color:#c9ccd1;text-decoration:none;font-size:13px;padding:.4em .6em;border-radius:8px}
  .mobile-bar nav a.attivo{background:var(--grigio);color:#fff}
  .contenuto{padding:18px 16px}
  .griglia{grid-template-columns:1fr}
  .hero{padding:28px 22px}
  .hero h1{font-size:26px}
  .blocco{padding:22px 18px}
}
.btn-filtri{display:none!important}
.velo{display:none;position:fixed;inset:0;background:rgba(0,0,0,.35);z-index:25}
.velo.on{display:block}
.footer{color:var(--grigio-2);font-size:12px;margin-top:40px}
.app.due{grid-template-columns:230px 1fr}
@media (max-width:1100px){.app.due{grid-template-columns:200px 1fr}}
@media (max-width:760px){.app.due{grid-template-columns:1fr}}