/* Le pagine degli eventi dei borghi sul sito vetrina (tavole del 21/10/26): stessi colori e caratteri della home
   della vetrina (templates/vetrina/index.html), che ha il suo stile nel file. Il font sta in static/vendor, così si
   carica uguale da ilborgointasca.it e da app.ilborgointasca.it/vetrina/. */
@font-face{font-family:'Fraunces';font-style:normal;font-weight:400 700;font-display:swap;src:url(../vendor/fraunces.woff2) format('woff2')}
:root{
  --notte:#0a1119; --notte2:#13202c; --carta:#f7f3ec; --carta2:#efe8dc;
  --inchiostro:#221a12; --muted:#6f6152; --muted-chiaro:#a9b6c6;
  --oro:#e3a63b; --oro-chiaro:#f0c069; --oro-testo:#9a520a;
  --bordo:#d8c9ab; --linea:#e4dccd;
  --display:'Fraunces',Georgia,serif; --testo:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --maxw:1200px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--testo);background:var(--carta);color:var(--inchiostro);line-height:1.5}
a{color:var(--oro-testo)}
h1,h2,h3{font-family:var(--display);font-weight:600;line-height:1.12;letter-spacing:-.01em;margin:0}
.wrap{max-width:var(--maxw);margin:0 auto;padding-left:18px;padding-right:18px}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
:focus-visible{outline:3px solid var(--oro);outline-offset:2px}
[hidden]{display:none!important}

/* ---------- barra, fascia, piede ---------- */
.tb{background:var(--notte)}
.tb .wrap{display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:60px}
.logo{font-family:var(--display);font-size:1.2rem;font-weight:700;color:#fff;text-decoration:none;white-space:nowrap}
.logo em{font-style:normal;color:var(--oro)}
.nav{display:flex;align-items:center;gap:20px;font-size:.95rem}
.nav a{color:#c9d3de;text-decoration:none;padding:12px 0;white-space:nowrap}
.nav a:hover{color:var(--oro-chiaro)}
.nav a[aria-current]{color:#fff;font-weight:700;box-shadow:inset 0 -2px 0 var(--oro)}
.nav a.btn-oro{color:#241708;padding:10px 20px}
.solo-pc{display:none!important}
@media(min-width:760px){.solo-pc{display:inline-block!important}}
@media(max-width:350px){.nav .comune{display:none}}  /* sui telefoni più stretti accanto al logo resta solo Eventi */
.fascia-demo{margin:0;background:var(--notte2);color:#c9d3de;font-size:.8rem;line-height:1.45}
.fascia-demo .wrap{display:block;padding-top:9px;padding-bottom:9px}
.piede{background:var(--notte);color:#9aa8b8;font-size:.88rem}
.piede .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px;padding-top:24px;padding-bottom:24px}
.piede a{color:#c9d3de}
.piede b{color:#e9eef5}

/* ---------- bottoni ---------- */
.btn-oro{display:inline-block;background:var(--oro);color:#241708;font-weight:700;text-decoration:none;border-radius:999px;padding:13px 22px;text-align:center}
.btn-oro:hover{background:var(--oro-chiaro)}
.btn-linea{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:0 20px;border-radius:999px;border:1px solid var(--inchiostro);background:transparent;color:var(--inchiostro);font:inherit;font-weight:700;text-decoration:none;cursor:pointer}
.btn-linea:hover{background:#fff}
.kicker{margin:0;font-size:.72rem;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--oro)}

/* ---------- testa della lista ---------- */
.hero-ev{background:var(--notte);color:#e9eef5}
.hero-ev .wrap{padding-top:26px;padding-bottom:28px;display:flex;flex-direction:column;gap:10px}
.hero-ev h1{font-size:clamp(2rem,5vw,3.4rem);color:#fff}
.hero-ev .sub{margin:0;color:var(--muted-chiaro);max-width:40rem;font-size:1.02rem}
.vista{display:grid;grid-template-columns:1fr 1fr;border:1px solid rgba(255,255,255,.22);border-radius:999px;padding:3px;margin-top:8px;max-width:360px}
.vista a{display:flex;align-items:center;justify-content:center;min-height:40px;border-radius:999px;color:#e9eef5;font-weight:700;text-decoration:none}
.vista a[aria-current]{background:var(--oro);color:#241708}
@media(min-width:1000px){.vista{display:none}}

/* ---------- Dove, Quando, Cosa, Cerca ---------- */
.filtri{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding-top:16px;padding-bottom:4px}
.filtro{display:flex;align-items:center;gap:6px;min-height:48px;min-width:0;padding:0 10px 0 14px;border-radius:999px;border:1px solid var(--bordo);background:#fff;color:var(--inchiostro);font:inherit;font-size:.88rem;text-align:left;cursor:pointer}
.filtro>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.filtro svg{flex:none;color:var(--oro-testo)}
.filtro .giu{margin-left:auto;color:var(--inchiostro)}
.filtro.attivo{border-color:var(--inchiostro);box-shadow:inset 0 0 0 1px var(--inchiostro)}
.filtro.dove,.cerca{grid-column:1/-1}
.cerca{display:flex;gap:8px}
.cerca input{flex:1;min-width:0;min-height:48px;padding:0 18px;border-radius:999px;border:1px solid var(--bordo);background:#fff;font:inherit;font-size:16px;color:var(--inchiostro)}
.cerca button{min-height:48px;padding:0 20px;border-radius:999px;border:0;background:var(--inchiostro);color:#fff;font:inherit;font-weight:700;cursor:pointer}
@media(min-width:1000px){
  .filtri{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1.7fr)}
  .filtro.dove,.cerca{grid-column:auto}
  .filtro{font-size:.92rem}
}
.esito{margin:0;color:var(--muted);font-size:.95rem}

/* ---------- elenco e mappa ---------- */
.corpo{display:flex;flex-wrap:wrap;gap:36px;align-items:flex-start;padding-top:16px;padding-bottom:56px}
.col-elenco{flex:999 1 560px;min-width:0;display:flex;flex-direction:column;gap:14px}
.col-mappa{flex:1 1 340px;min-width:0;display:flex;flex-direction:column;gap:18px}
@media(max-width:999px){
  .vista-elenco .col-mappa{display:none}
  .vista-mappa .col-elenco,.vista-mappa .riquadro-comuni{display:none}
}
.titolo-gruppo{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:4px 12px;margin-top:6px}
.titolo-gruppo h2,.mese{font-size:1.45rem}
.titolo-gruppo span{color:var(--muted);font-size:.9rem}
.mese{margin-top:16px}
.griglia{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:14px}

.ev{display:flex;gap:14px;background:#fff;border-radius:16px;padding:14px;box-shadow:0 6px 18px rgba(60,40,10,.07);color:var(--inchiostro);text-decoration:none}
.ev:hover{box-shadow:0 10px 26px rgba(60,40,10,.15)}
.ev-data{flex:0 0 76px;display:flex;flex-direction:column;align-items:center;justify-content:center;border-right:1px solid var(--carta2);padding-right:12px;text-align:center}
.ev-data .g{font-family:var(--display);font-size:1.25rem;font-weight:700;line-height:1;white-space:nowrap}
.ev-data .m{font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--oro-testo);margin-top:4px}
.ev-data .d{font-size:.75rem;color:var(--muted)}
.ev-corpo{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}
.ev-tag{display:flex;flex-wrap:wrap;gap:6px}
.tag{font-size:.75rem;font-weight:700;color:#4a3f31;background:var(--carta2);border-radius:999px;padding:3px 9px}
.tag-conferma{color:#7a4a06;background:#fbefd9}
.tag-demo{color:#33414f;background:#e3e9ef}
.ev-titolo{font-family:var(--display);font-size:1.08rem;font-weight:600;line-height:1.25}
.ev-dove{font-size:.85rem;color:var(--muted)}

.ev-grande{display:flex;flex-wrap:wrap;gap:12px 26px;align-items:center;background:var(--notte);color:#e9eef5;border-radius:20px;padding:20px;text-decoration:none;box-shadow:0 12px 30px rgba(10,17,25,.25)}
.ev-grande .data{display:flex;flex-direction:column;gap:4px}
.ev-grande .data b{font-family:var(--display);font-size:2.1rem;line-height:1;color:var(--oro-chiaro)}
.ev-grande .data span{font-size:.85rem;color:var(--muted-chiaro)}
.ev-grande .testo{flex:1 1 260px;min-width:0;display:flex;flex-direction:column;gap:6px}
.ev-grande .titolo{font-family:var(--display);font-size:1.35rem;font-weight:600;color:#fff;line-height:1.2}
.ev-grande .dove{display:flex;align-items:center;gap:6px;font-size:.9rem;color:#c9d3de}
.ev-grande .prezzo{font-size:.85rem;color:var(--muted-chiaro)}
.ev-grande .tag{background:transparent;border:1px solid rgba(227,166,59,.55);color:var(--oro-chiaro)}
.ev-grande .tag-conferma{background:#fbefd9;border-color:#fbefd9;color:#7a4a06}
.ev-grande .vai{background:var(--oro);color:#241708;font-weight:700;border-radius:999px;padding:12px 20px}
.altri{align-self:center;margin-top:12px}
.vuoto{background:#fff;border-radius:16px;padding:22px;display:flex;flex-direction:column;align-items:flex-start;gap:12px}
.vuoto p{margin:0}

.riquadro{background:#fff;border-radius:20px;padding:18px;box-shadow:0 6px 18px rgba(60,40,10,.07);display:flex;flex-direction:column;gap:10px}
.riquadro h2{font-size:1.35rem}
.mappa{height:320px;border-radius:14px;overflow:hidden;background:#e9e2d3}
@media(max-width:999px){.vista-mappa .mappa{height:58vh}}
.pin-ev{display:flex!important;align-items:center;justify-content:center;background:var(--notte);color:#fff;border:2.5px solid #fff;border-radius:50%;font:700 13px/1 var(--testo);box-shadow:0 2px 8px rgba(0,0,0,.35)}
.pin-ev.scelto{background:var(--oro);color:#241708;border-color:var(--notte)}
.pin-ev.pin-gruppo{background:#fff;color:var(--inchiostro);border:3px solid var(--oro);font-size:14px}
.pannello{display:flex;flex-direction:column;gap:8px;border-top:1px solid var(--linea);padding-top:12px}
.pannello h3{font-size:1.3rem}
.pannello .n{color:var(--muted);font-size:.88rem}
.pannello .prossimo{display:flex;gap:12px;align-items:baseline;color:var(--inchiostro);text-decoration:none}
.pannello .prossimo b{flex:0 0 64px;font-family:var(--display);color:var(--oro-testo)}
.pannello .bottoni{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:4px}
.pannello .bottoni a{display:flex;align-items:center;justify-content:center;min-height:44px;padding:0 10px;font-size:.92rem}
.gruppo{margin:12px 0 4px;font-size:.72rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.riga{display:flex;justify-content:space-between;gap:12px;align-items:center;min-height:48px;padding:0 4px;border-top:1px solid var(--linea);color:var(--inchiostro);text-decoration:none;font-size:1rem}
.riga .n,.riga .km{color:var(--muted);font-size:.86rem;text-align:right}
.riga.scelta{font-weight:700}
.riga.scelta>span:first-child::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--oro);margin-right:8px;vertical-align:middle}
.riquadro-comuni{background:var(--notte);color:#e9eef5;border-radius:20px;padding:22px;display:flex;flex-direction:column;gap:10px}
.riquadro-comuni h2{font-size:1.35rem;color:#fff}
.riquadro-comuni p{margin:0;color:var(--muted-chiaro);font-size:.93rem}
.riquadro-comuni a{color:var(--oro-chiaro);font-weight:700}

/* ---------- i fogli Dove, Quando, Cosa ---------- */
dialog.foglio{border:0;padding:0;background:var(--carta);color:var(--inchiostro);width:100%;max-width:100%;max-height:88vh;margin:auto 0 0;border-radius:22px 22px 0 0}
dialog.foglio::backdrop{background:rgba(5,9,14,.62)}
@media(min-width:700px){dialog.foglio{max-width:480px;margin:auto;border-radius:22px}}
.foglio-dentro{padding:12px 18px 22px;display:flex;flex-direction:column;gap:12px;max-height:88vh}
.foglio-testa{display:flex;justify-content:space-between;align-items:center}
.foglio-testa h2{font-size:1.4rem}
.chiudi{width:44px;height:44px;display:flex;align-items:center;justify-content:center;border:0;background:transparent;color:var(--inchiostro);cursor:pointer;border-radius:50%}
.foglio-lista{overflow-y:auto;display:flex;flex-direction:column;min-height:0}
.campo{display:flex;flex-direction:column;gap:6px;font-size:.82rem;font-weight:700;color:var(--muted)}
.campo input{min-height:48px;padding:0 16px;border-radius:999px;border:1px solid var(--bordo);background:#fff;font:inherit;font-size:16px;font-weight:400;color:var(--inchiostro)}
.nota-geo{margin:0;font-size:.88rem;color:var(--muted)}

/* ---------- la pagina dell'evento ---------- */
.evento{max-width:760px;padding-top:6px;padding-bottom:56px;display:flex;flex-direction:column;gap:16px}
.indietro{display:inline-flex;align-items:center;gap:4px;font-weight:700;text-decoration:none;padding:12px 0 0;align-self:flex-start}
.evento h1{font-size:clamp(1.8rem,4.5vw,2.6rem)}
.avviso{margin:0;background:#fbefd9;color:#5c3804;border-radius:12px;padding:12px 14px}
.info{background:#fff;border-radius:16px;padding:4px 16px;box-shadow:0 6px 18px rgba(60,40,10,.07)}
.info-riga{display:flex;gap:12px;padding:12px 0;border-top:1px solid var(--carta2)}
.info-riga:first-child{border-top:0}
.info-riga svg{flex:none;color:var(--oro-testo);margin-top:1px}
.info-riga div{display:flex;flex-direction:column;gap:2px}
.info-riga span{font-size:.9rem;color:var(--muted)}
.info-riga .nota-conferma{color:#7a4a06}
.azioni{display:grid;grid-template-columns:1fr 1fr;gap:10px;max-width:420px}
.evento-griglia,.evento-dati{display:flex;flex-direction:column;gap:16px}
.locandina{display:block;align-self:center}
.locandina img{display:block;max-width:100%;max-height:75vh;border-radius:14px;box-shadow:0 8px 24px rgba(30,20,5,.18)}
@media(min-width:760px){
  .evento-griglia.con-locandina{display:grid;grid-template-columns:minmax(0,1fr) 250px;gap:22px;align-items:start}
  .locandina{align-self:start}
}
.cta-app{background:var(--notte);color:#e9eef5;border-radius:18px;padding:20px;display:flex;flex-direction:column;gap:10px;box-shadow:0 10px 26px rgba(10,17,25,.25)}
.cta-app h2{font-size:1.45rem;color:#fff}
.cta-app p{margin:0;color:var(--muted-chiaro)}
.cta-app .btn-oro{margin-top:4px}
@media(min-width:700px){.cta-app .btn-oro{align-self:flex-start}}
.testo h2,.correlati h2{font-size:1.3rem;margin:8px 0 8px}
.testo p{margin:0 0 12px;line-height:1.6;color:#3d342a}
.correlati{display:flex;flex-direction:column;gap:10px}
.ev-riga{display:flex;gap:14px;align-items:baseline;background:#fff;border-radius:14px;padding:12px 14px;color:var(--inchiostro);text-decoration:none}
.ev-riga .quando{flex:0 0 64px;font-family:var(--display);font-weight:700;color:var(--oro-testo)}
.ev-riga .cosa{display:flex;flex-direction:column;gap:2px;min-width:0}
.ev-riga .cosa span{font-size:.86rem;color:var(--muted)}
