/* ===========================================================================
   Associazione Culturale Quasillus - www.quasillus.it
   Foglio di stile del sito pubblico

   Palette ricavata dal logo ufficiale dell'associazione:
     blu       #1D71B8   (Risorsa 2 - versione blu del marchio)
     bronzo    #936037   (Risorsa 3 - versione bronzo)
     bordeaux  #A3195B   (Risorsa 1 - versione bordeaux)
     grigio    #3C3C3B   (testo del logotipo)
   Accenti SitaFest ripresi dal logo a catena: giallo, rosso, blu.
   =========================================================================== */

/* --------------------------------------------------------------- variabili */
:root{
  --blu:#1D71B8;
  --blu-scuro:#0F2A44;
  --blu-notte:#0A1C2E;
  --blu-chiaro:#E7F0F8;
  --bronzo:#936037;
  --bronzo-chiaro:#C79A63;
  --bordeaux:#A3195B;
  --grigio:#3C3C3B;

  --sabbia:#FAF7F2;
  --sabbia-scura:#F0EAE0;
  --bianco:#FFFFFF;
  --testo:#26313C;
  --testo-tenue:#63707C;
  --bordo:#E3DCD1;

  --sf-giallo:#F2B233;
  --sf-rosso:#E0453C;
  --sf-blu:#2E3192;

  --larghezza:1180px;
  --raggio:14px;
  --raggio-p:8px;
  --ombra:0 1px 2px rgba(15,42,68,.05), 0 8px 28px rgba(15,42,68,.07);
  --ombra-alta:0 18px 48px rgba(15,42,68,.16);
  --transizione:.22s cubic-bezier(.4,0,.2,1);

  --serif:'Marcellus', 'Iowan Old Style', Georgia, 'Times New Roman', serif;
  --sans:'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
}

/* ------------------------------------------------------------------ base */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%; scroll-behavior:smooth}
body{
  margin:0;
  font-family:var(--sans);
  font-size:17px;
  line-height:1.68;
  color:var(--testo);
  background:var(--sabbia);
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%; height:auto; display:block}
a{color:var(--blu); text-decoration:none}
a:hover{text-decoration:underline}
h1,h2,h3,h4{font-family:var(--serif); font-weight:400; line-height:1.15; color:var(--blu-scuro); margin:0 0 .6em}
h1{font-size:clamp(2.1rem,5.2vw,3.5rem); letter-spacing:-.01em}
h2{font-size:clamp(1.6rem,3.4vw,2.4rem)}
h3{font-size:clamp(1.2rem,2.2vw,1.5rem)}
p{margin:0 0 1.1em}
ul,ol{margin:0 0 1.1em; padding-left:1.3em}
hr{border:0; border-top:1px solid var(--bordo); margin:2.5rem 0}
:focus-visible{outline:3px solid var(--bronzo); outline-offset:3px; border-radius:4px}

.contenitore{width:100%; max-width:var(--larghezza); margin:0 auto; padding:0 24px}
.salta{position:absolute; left:-9999px; top:0; background:var(--blu-scuro); color:#fff; padding:12px 20px; z-index:200}
.salta:focus{left:0}

/* ---------------------------------------------------------------- testata */
.testata{
  position:sticky; top:0; z-index:100;
  background:rgba(255,255,255,.94);
  backdrop-filter:saturate(160%) blur(12px);
  border-bottom:1px solid var(--bordo);
}
.testata__riga{display:flex; align-items:center; justify-content:space-between; gap:20px; min-height:82px}
.marchio img{height:52px; width:auto}
.marchio:hover{text-decoration:none}

.testata__destra{display:flex; align-items:center; gap:10px}

.menu ul{display:flex; align-items:center; gap:4px; list-style:none; margin:0; padding:0}
.menu a{
  display:block; padding:9px 12px; border-radius:var(--raggio-p);
  font-size:.94rem; font-weight:500; color:var(--grigio);
  transition:background var(--transizione), color var(--transizione);
}
.menu a:hover{background:var(--blu-chiaro); color:var(--blu-scuro); text-decoration:none}
.menu a[aria-current="page"]{color:var(--blu); font-weight:600}
.testata__cta:hover{background:var(--bronzo)}

.menu-tasto{
  display:none; align-items:center; gap:9px;
  background:none; border:1px solid var(--bordo); border-radius:var(--raggio-p);
  padding:9px 14px; font:inherit; font-size:.9rem; font-weight:600; color:var(--blu-scuro); cursor:pointer;
}
.menu-tasto__barre{display:inline-flex; flex-direction:column; gap:4px; width:18px}
.menu-tasto__barre i{display:block; height:2px; background:currentColor; border-radius:2px; transition:var(--transizione)}
.menu-tasto[aria-expanded="true"] .menu-tasto__barre i:nth-child(1){transform:translateY(6px) rotate(45deg)}
.menu-tasto[aria-expanded="true"] .menu-tasto__barre i:nth-child(2){opacity:0}
.menu-tasto[aria-expanded="true"] .menu-tasto__barre i:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

/* --------------------------------------------------- striscia sponsor (SitaFest) */
.striscia-sponsor{background:var(--bianco); border-bottom:1px solid var(--bordo); overflow:hidden; padding:14px 0}
.striscia-sponsor__pista{display:flex; align-items:center; gap:52px; width:max-content; animation:scorri-sponsor 34s linear infinite}
.striscia-sponsor:hover .striscia-sponsor__pista{animation-play-state:paused}
.striscia-sponsor__voce{display:flex; align-items:center; justify-content:center; height:46px; flex:0 0 auto}
.striscia-sponsor__voce img{height:100%; width:auto; max-width:150px; object-fit:contain}
.striscia-sponsor__voce .loghi__nome{font-family:var(--serif); font-size:.92rem; color:var(--blu-scuro); white-space:nowrap}
@keyframes scorri-sponsor{from{transform:translateX(0)} to{transform:translateX(-50%)}}
@media (max-width:640px){
  .striscia-sponsor{padding:10px 0}
  .striscia-sponsor__pista{gap:34px; animation-duration:24s}
  .striscia-sponsor__voce{height:34px}
  .striscia-sponsor__voce img{max-width:104px}
}

/* ----------------------------------------------------------------- bottoni */
.bottone{
  display:inline-flex; align-items:center; gap:9px;
  padding:14px 26px; border:0; border-radius:999px;
  background:var(--blu); color:#fff; font:inherit; font-size:.98rem; font-weight:600;
  cursor:pointer; text-align:center;
  transition:transform var(--transizione), background var(--transizione), box-shadow var(--transizione);
  box-shadow:0 4px 14px rgba(29,113,184,.24);
}
.bottone:hover{background:#175d99; color:#fff; text-decoration:none; transform:translateY(-2px); box-shadow:0 8px 22px rgba(29,113,184,.3)}
.bottone--piccolo{padding:9px 18px; font-size:.9rem; box-shadow:none}
.bottone--bronzo{background:var(--bronzo); box-shadow:0 4px 14px rgba(147,96,55,.26)}
.bottone--bronzo:hover{background:#7c4f2c}
.bottone--chiaro{background:rgba(255,255,255,.14); border:1px solid rgba(255,255,255,.4); color:#fff; box-shadow:none}
.bottone--chiaro:hover{background:rgba(255,255,255,.24)}
.bottone--vuoto{background:transparent; color:var(--blu); border:1.5px solid var(--blu); box-shadow:none}
.bottone--vuoto:hover{background:var(--blu); color:#fff}

/* ---------------------------------------------------------------- sezioni */
.sezione{padding:clamp(56px,7vw,96px) 0}
.sezione--chiara{background:var(--bianco)}
.sezione--sabbia{background:var(--sabbia-scura)}
.sezione--scura{background:var(--blu-scuro); color:#DCE6EF}
.sezione--scura h2,.sezione--scura h3{color:#fff}
.sezione--scura a{color:#9FD0F5}

.occhiello{
  display:inline-block; font-family:var(--sans); font-size:.76rem; font-weight:700;
  letter-spacing:.14em; text-transform:uppercase; color:var(--bronzo); margin-bottom:14px;
}
.sezione--scura .occhiello{color:var(--bronzo-chiaro)}
.intestazione-sezione{max-width:720px; margin-bottom:44px}
.intestazione-sezione p{color:var(--testo-tenue); font-size:1.06rem; margin:0}
.sezione--scura .intestazione-sezione p{color:#B9C9D8}

.riga-titolo{display:flex; align-items:flex-end; justify-content:space-between; gap:24px; flex-wrap:wrap; margin-bottom:40px}
.riga-titolo h2{margin:0}
.link-oltre{font-weight:600; font-size:.95rem; white-space:nowrap}
.link-oltre::after{content:" →"}

/* -------------------------------------------------------------------- hero */
.hero{
  position:relative; overflow:hidden;
  background:linear-gradient(150deg,#0A1C2E 0%,#123A5E 48%,#1D71B8 120%);
  color:#fff;
}
.hero::before{
  content:""; position:absolute; inset:0;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120' viewBox='0 0 120 120'%3E%3Cg fill='none' stroke='%23ffffff' stroke-opacity='.075' stroke-width='1.4'%3E%3Cpath d='M60 0 120 60 60 120 0 60z'/%3E%3Ccircle cx='60' cy='60' r='26'/%3E%3Cpath d='M0 0h120v120H0z'/%3E%3C/g%3E%3C/svg%3E");
  background-size:120px 120px; opacity:.9;
}
.hero::after{
  content:""; position:absolute; left:0; right:0; bottom:-1px; height:90px;
  background:linear-gradient(to bottom, transparent, rgba(250,247,242,.0) 40%, var(--sabbia) 100%);
  pointer-events:none;
}
/* filigrana del marchio dell'associazione, visibile quando non c'è una fotografia */
.hero__filigrana{
  position:absolute; z-index:1; right:-6%; top:50%; transform:translateY(-50%);
  width:min(520px,46vw); opacity:.09; pointer-events:none;
}
.hero__filigrana img{width:100%; height:auto}
.hero__bagliore{
  position:absolute; z-index:0; right:-8%; top:-18%; width:min(720px,80vw); aspect-ratio:1;
  background:radial-gradient(circle at 50% 50%, rgba(147,96,55,.42), rgba(147,96,55,0) 62%);
  pointer-events:none;
}
.hero__foto{position:absolute; inset:0; z-index:0}
.hero__foto img{width:100%; height:100%; object-fit:cover}
.hero__velo{position:absolute; inset:0; background:linear-gradient(150deg,rgba(10,28,46,.9) 0%,rgba(18,58,94,.78) 55%,rgba(29,113,184,.62) 100%)}
.hero__dentro{position:relative; z-index:2; padding:clamp(72px,11vw,140px) 0 clamp(64px,9vw,120px); max-width:760px}
.hero h1{color:#fff; margin-bottom:.5em; text-shadow:0 2px 22px rgba(0,0,0,.22)}
.hero__testo{font-size:clamp(1.04rem,1.9vw,1.22rem); color:#D5E3F0; max-width:60ch; margin-bottom:2rem}
.hero__azioni{display:flex; flex-wrap:wrap; gap:14px}
.hero .occhiello{color:var(--bronzo-chiaro)}

/* --------------------------------------------------------- numeri / dati */
.numeri{display:grid; grid-template-columns:repeat(auto-fit,minmax(170px,1fr)); gap:2px; background:var(--bordo); border-radius:var(--raggio); overflow:hidden; margin-top:3rem}
.numeri__voce{background:var(--bianco); padding:28px 24px; text-align:center}
.numeri__valore{font-family:var(--serif); font-size:clamp(2rem,4vw,2.8rem); color:var(--blu); line-height:1; display:block}
.numeri__testo{font-size:.9rem; color:var(--testo-tenue); margin:.6rem 0 0; display:block}

/* ------------------------------------------------------ blocco SitaFest */
.sitafest-vetrina{
  position:relative; overflow:hidden; border-radius:22px;
  background:linear-gradient(135deg,#1B1B6B 0%,#2E3192 42%,#4243B8 100%);
  color:#fff; box-shadow:var(--ombra-alta);
}
.sitafest-vetrina::before{
  content:""; position:absolute; right:-90px; top:-90px; width:420px; height:420px; border-radius:50%;
  background:radial-gradient(circle at 35% 35%, rgba(242,178,51,.5), transparent 62%);
}
.sitafest-vetrina::after{
  content:""; position:absolute; left:-70px; bottom:-120px; width:340px; height:340px; border-radius:50%;
  background:radial-gradient(circle at 60% 40%, rgba(224,69,60,.42), transparent 62%);
}
.sitafest-vetrina__dentro{position:relative; z-index:2; display:grid; grid-template-columns:1.25fr .85fr; gap:clamp(28px,4vw,56px); align-items:center; padding:clamp(32px,4.4vw,58px)}
.sitafest-vetrina h2{color:#fff; font-size:clamp(1.8rem,3.6vw,2.7rem); margin-bottom:.35em}
.sitafest-vetrina .occhiello{color:var(--sf-giallo)}
.sitafest-vetrina__meta{display:flex; flex-wrap:wrap; gap:10px; margin:0 0 22px}
.pillola{
  display:inline-flex; align-items:center; gap:7px;
  background:rgba(255,255,255,.14); border:1px solid rgba(255,255,255,.24);
  border-radius:999px; padding:7px 15px; font-size:.87rem; font-weight:500;
}
.sitafest-vetrina p{color:#DBDCF5}
.sitafest-vetrina__azioni{display:flex; flex-wrap:wrap; gap:12px; margin-top:26px}
.sitafest-vetrina__media{display:flex; justify-content:center; align-items:center}
.sitafest-vetrina__media img{max-height:340px; width:auto; border-radius:12px; box-shadow:0 20px 50px rgba(0,0,0,.32)}
.sitafest-marchio{
  width:min(280px,84%); padding:22px; border-radius:20px;
  background:radial-gradient(circle at 50% 40%, #FFFFFF 0%, #F6F1E8 100%);
  box-shadow:0 18px 44px rgba(0,0,0,.3);
}

/* ------------------------------------------------------------- programma */
.programma{border-left:2px solid var(--bordo); margin-left:6px; padding-left:0}
.programma__giorno{position:relative; padding:0 0 34px 30px}
.programma__giorno::before{
  content:""; position:absolute; left:-9px; top:6px; width:16px; height:16px; border-radius:50%;
  background:var(--bronzo); border:3px solid var(--sabbia);
}
.sezione--chiara .programma__giorno::before{border-color:var(--bianco)}
.programma__data{font-family:var(--serif); font-size:1.3rem; color:var(--blu-scuro); margin:0 0 14px}
.programma__data::first-letter{text-transform:uppercase}
.programma__voce{display:grid; grid-template-columns:76px 1fr; gap:16px; padding:14px 0; border-top:1px solid var(--bordo)}
.programma__voce:first-of-type{border-top:0; padding-top:4px}
.programma__ora{font-weight:700; color:var(--bronzo); font-size:.95rem; font-variant-numeric:tabular-nums; padding-top:2px}
.programma__titolo{font-weight:600; color:var(--blu-scuro); display:block; margin-bottom:3px}
.programma__descr{font-size:.94rem; color:var(--testo-tenue); margin:0}
.programma__luogo{font-size:.86rem; color:var(--testo-tenue); margin:5px 0 0; display:flex; align-items:center; gap:6px}
.programma__locandina{margin:10px 0 0}
.programma__locandina a{display:inline-block}
.programma__locandina img{width:130px; border-radius:10px; border:1px solid var(--bordo); box-shadow:var(--ombra); transition:transform var(--transizione)}
.programma__locandina a:hover img{transform:translateY(-2px); box-shadow:var(--ombra-alta)}

/* ----------------------------------------------------------------- schede */
.griglia{display:grid; gap:28px}
.griglia--3{grid-template-columns:repeat(auto-fit,minmax(290px,1fr))}
.griglia--2{grid-template-columns:repeat(auto-fit,minmax(340px,1fr))}
.griglia--4{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}

.scheda{
  background:var(--bianco); border:1px solid var(--bordo); border-radius:var(--raggio);
  overflow:hidden; display:flex; flex-direction:column;
  transition:transform var(--transizione), box-shadow var(--transizione), border-color var(--transizione);
}
.scheda:hover{transform:translateY(-4px); box-shadow:var(--ombra); border-color:#D3C9B8}
.scheda__figura{position:relative; aspect-ratio:16/10; background:var(--sabbia-scura); overflow:hidden}
.scheda__figura img{width:100%; height:100%; object-fit:cover; transition:transform .5s ease}
.scheda:hover .scheda__figura img{transform:scale(1.045)}
.scheda__corpo{padding:24px; display:flex; flex-direction:column; flex:1}
.scheda__data{font-size:.82rem; font-weight:600; letter-spacing:.05em; text-transform:uppercase; color:var(--bronzo); margin:0 0 9px}
.scheda h3{font-size:1.24rem; margin:0 0 10px; line-height:1.28}
.scheda h3 a{color:inherit}
.scheda h3 a:hover{color:var(--blu); text-decoration:none}
.scheda p{color:var(--testo-tenue); font-size:.96rem; margin:0 0 14px}
.scheda__coda{margin-top:auto; font-weight:600; font-size:.92rem}
.scheda__coda::after{content:" →"}

/* segnaposto immagine mancante */
.segnaposto{
  display:flex; align-items:center; justify-content:center; width:100%; height:100%;
  background:
    linear-gradient(135deg, rgba(29,113,184,.07), rgba(147,96,55,.09)),
    repeating-linear-gradient(45deg, transparent, transparent 12px, rgba(60,60,59,.035) 12px, rgba(60,60,59,.035) 24px);
  color:var(--blu); opacity:.5;
}
.segnaposto svg{width:46px; height:46px}

/* ---------------------------------------------------------------- gallery */
.mosaico{display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:14px}
.mosaico a{display:block; position:relative; aspect-ratio:1/1; overflow:hidden; border-radius:var(--raggio-p); background:var(--sabbia-scura)}
.mosaico img{width:100%; height:100%; object-fit:cover; transition:transform .45s ease}
.mosaico a:hover img{transform:scale(1.06)}
.mosaico figcaption{
  position:absolute; left:0; right:0; bottom:0; padding:26px 12px 10px;
  background:linear-gradient(transparent, rgba(10,28,46,.82));
  color:#fff; font-size:.84rem; opacity:0; transition:opacity var(--transizione);
}
.mosaico a:hover figcaption{opacity:1}

/* variante a nastro scorrevole orizzontale (locandine SitaFest) */
.mosaico--nastro{display:flex; flex-wrap:nowrap; overflow-x:auto; scroll-snap-type:x proximity; gap:16px; padding-bottom:12px; -webkit-overflow-scrolling:touch}
.mosaico--nastro a{flex:0 0 auto; width:min(210px,64vw); aspect-ratio:3/4; scroll-snap-align:start}
.mosaico--nastro::-webkit-scrollbar{height:8px}
.mosaico--nastro::-webkit-scrollbar-thumb{background:var(--bordo); border-radius:8px}

/* visore fotografie */
.locandina-clic{display:block; cursor:zoom-in}
.visore{position:fixed; inset:0; z-index:300; background:rgba(8,18,30,.95); display:none; align-items:center; justify-content:center; padding:20px}
.visore.aperto{display:flex}
.visore img{max-width:min(1400px,94vw); max-height:86vh; width:auto; border-radius:6px}
.visore__didascalia{position:absolute; left:0; right:0; bottom:18px; text-align:center; color:#D5E3F0; font-size:.92rem; padding:0 60px}
.visore__chiudi,.visore__prec,.visore__succ{
  position:absolute; background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.26); color:#fff;
  width:46px; height:46px; border-radius:50%; font-size:1.3rem; line-height:1; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
}
.visore__chiudi{top:18px; right:18px}
.visore__prec{left:18px; top:50%; transform:translateY(-50%)}
.visore__succ{right:18px; top:50%; transform:translateY(-50%)}
.visore button:hover{background:rgba(255,255,255,.24)}

/* ---------------------------------------------------------------- archivio */
.anno-blocco{padding:34px 0; border-top:1px solid var(--bordo)}
.anno-blocco:first-child{border-top:0; padding-top:0}
.anno-blocco__testata{display:flex; align-items:baseline; gap:18px; margin-bottom:22px}
.anno-blocco__anno{font-family:var(--serif); font-size:clamp(2rem,4.4vw,3rem); color:var(--bronzo); line-height:1}
.anno-blocco__conta{font-size:.9rem; color:var(--testo-tenue)}
.elenco-eventi{list-style:none; margin:0; padding:0; display:grid; gap:2px}
.elenco-eventi li{background:var(--bianco); border:1px solid var(--bordo); border-radius:var(--raggio-p); padding:18px 22px; display:flex; flex-wrap:wrap; align-items:baseline; gap:8px 16px}
.elenco-eventi h3{font-size:1.1rem; margin:0; flex:1 1 260px}
.elenco-eventi .meta{font-size:.88rem; color:var(--testo-tenue)}

/* ---------------------------------------------------------------- partner */
.loghi{display:grid; grid-template-columns:repeat(auto-fill,minmax(160px,1fr)); gap:16px}
.loghi__voce{
  background:var(--bianco); border:1px solid var(--bordo); border-radius:var(--raggio-p);
  aspect-ratio:3/2; display:flex; align-items:center; justify-content:center; padding:18px;
  transition:border-color var(--transizione), box-shadow var(--transizione);
}
.loghi__voce:hover{border-color:var(--blu); box-shadow:var(--ombra)}
.loghi__voce img{max-height:100%; max-width:100%; width:auto; object-fit:contain}
.loghi__nome{font-family:var(--serif); font-size:.98rem; font-weight:400; color:var(--blu-scuro); text-align:center; line-height:1.32}
.loghi__voce:has(.loghi__nome){background:linear-gradient(160deg,var(--bianco),#FCFAF6); border-color:#E9E1D4}

/* ---------------------------------------------------------- fasce sponsor */
.fascia-sponsor{margin-top:36px}
.fascia-sponsor:first-of-type{margin-top:28px}
.fascia-sponsor__titolo{
  font-family:var(--sans); font-size:.82rem; font-weight:700; text-transform:uppercase;
  letter-spacing:.09em; color:var(--bronzo); margin:0 0 16px;
}

.loghi--main{grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); max-width:760px; gap:22px}
.loghi--main .loghi__voce{
  aspect-ratio:16/9; padding:26px; border:2px solid var(--bronzo-chiaro);
  background:linear-gradient(160deg,var(--bianco),#FCF6EC); box-shadow:var(--ombra);
}
.loghi--main .loghi__nome{font-size:1.15rem}

.loghi--oro .loghi__voce{border-color:#E4C77A}

.loghi--sostenitore{grid-template-columns:repeat(auto-fill,minmax(128px,1fr)); gap:10px}
.loghi--sostenitore .loghi__voce{aspect-ratio:2/1; padding:10px}
.loghi--sostenitore .loghi__nome{font-size:.82rem}

.partner-lista{display:grid; gap:18px; grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.partner-voce{background:var(--bianco); border:1px solid var(--bordo); border-radius:var(--raggio); padding:24px; display:flex; gap:18px; align-items:flex-start}
.partner-voce__logo{flex:0 0 76px; height:76px; display:flex; align-items:center; justify-content:center; background:var(--sabbia); border-radius:var(--raggio-p); overflow:hidden}
.partner-voce__logo img{max-width:100%; max-height:100%; object-fit:contain}
.partner-voce h3{font-size:1.06rem; margin:0 0 7px; line-height:1.3}
.partner-voce p{font-size:.92rem; color:var(--testo-tenue); margin:0}

/* ------------------------------------------------------- pagina interna */
.pagina-testata{background:var(--blu-scuro); color:#fff; padding:clamp(50px,7vw,86px) 0 clamp(44px,6vw,72px); position:relative; overflow:hidden}
.pagina-testata::before{
  content:""; position:absolute; inset:0; opacity:.5;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='90' height='90'%3E%3Cg fill='none' stroke='%23ffffff' stroke-opacity='.08'%3E%3Cpath d='M45 0 90 45 45 90 0 45z'/%3E%3C/g%3E%3C/svg%3E");
}
.pagina-testata__dentro{position:relative; z-index:2; max-width:780px}
.pagina-testata h1{color:#fff; margin-bottom:.25em}
.pagina-testata p{color:#B9C9D8; font-size:1.1rem; margin:0}
.pagina-testata .occhiello{color:var(--bronzo-chiaro)}
.pagina-testata__azioni{margin-top:24px}

.briciole{font-size:.86rem; color:#8FA6BB; margin-bottom:18px}
.briciole a{color:#B9C9D8}
.briciole span{opacity:.6; margin:0 7px}

.testo{max-width:74ch; font-size:1.05rem}
.testo h2{margin-top:2.2em; font-size:clamp(1.4rem,2.6vw,1.85rem)}
.testo h2:first-child{margin-top:0}
.testo h3{margin-top:1.8em}
.testo img{border-radius:var(--raggio); margin:1.6em 0}
.testo ul li,.testo ol li{margin-bottom:.5em}
.testo blockquote{
  margin:1.8em 0; padding:4px 0 4px 26px; border-left:3px solid var(--bronzo);
  font-family:var(--serif); font-size:1.16rem; color:var(--blu-scuro);
}
.testo table{width:100%; border-collapse:collapse; margin:1.6em 0; font-size:.95rem}
.testo th,.testo td{border:1px solid var(--bordo); padding:10px 14px; text-align:left}
.testo th{background:var(--sabbia-scura); font-weight:600}
.tabella-scorrevole{overflow-x:auto; -webkit-overflow-scrolling:touch}

.con-lato{display:grid; grid-template-columns:minmax(0,1fr) 320px; gap:clamp(32px,5vw,64px); align-items:start}
.lato{position:sticky; top:110px}
.riquadro{background:var(--bianco); border:1px solid var(--bordo); border-radius:var(--raggio); padding:26px; margin-bottom:22px}
.riquadro h3{font-size:1.1rem; margin:0 0 14px}
.riquadro p:last-child{margin-bottom:0}
.riquadro--evidenza{background:var(--blu-chiaro); border-color:#C6DDF1}
.riquadro dl{margin:0; font-size:.94rem}
.riquadro dt{font-weight:600; color:var(--blu-scuro); margin-top:12px}
.riquadro dt:first-child{margin-top:0}
.riquadro dd{margin:2px 0 0; color:var(--testo-tenue); word-break:break-word}

/* ------------------------------------------------------------- richiamo */
.richiamo{
  background:linear-gradient(135deg,var(--bronzo) 0%,#B07C46 100%);
  color:#fff; border-radius:var(--raggio); padding:clamp(30px,4vw,52px); text-align:center;
}
.richiamo h2{color:#fff}
.richiamo p{color:#F6EADD; max-width:62ch; margin-left:auto; margin-right:auto}
.richiamo .bottone{background:#fff; color:var(--bronzo); box-shadow:none}
.richiamo .bottone:hover{background:#F6EADD; color:#7c4f2c}

/* ---------------------------------------------------------------- avvisi */
.avviso{border-radius:var(--raggio-p); padding:16px 20px; margin:0 0 22px; font-size:.95rem; border:1px solid}
.avviso--info{background:var(--blu-chiaro); border-color:#C6DDF1; color:#14456F}
.avviso--vuoto{background:var(--sabbia-scura); border-color:var(--bordo); color:var(--testo-tenue); text-align:center; padding:44px 24px}

/* ------------------------------------------------------------- paginazione */
.paginazione{display:flex; gap:8px; justify-content:center; margin-top:46px; flex-wrap:wrap}
.paginazione a,.paginazione span{
  min-width:42px; height:42px; display:inline-flex; align-items:center; justify-content:center;
  padding:0 12px; border:1px solid var(--bordo); border-radius:var(--raggio-p);
  background:var(--bianco); font-size:.94rem; font-weight:500; color:var(--grigio);
}
.paginazione a:hover{border-color:var(--blu); color:var(--blu); text-decoration:none}
.paginazione .corrente{background:var(--blu); border-color:var(--blu); color:#fff}

/* ------------------------------------------------------------------ piede */
.piede{background:var(--blu-notte); color:#9FB2C4; padding:clamp(48px,6vw,72px) 0 0; font-size:.94rem}
.piede__griglia{display:grid; grid-template-columns:1.5fr 1fr 1.2fr; gap:44px; padding-bottom:44px}
.piede h2{color:#fff; font-family:var(--sans); font-size:.8rem; font-weight:700; letter-spacing:.13em; text-transform:uppercase; margin:0 0 18px}
.piede a{color:#9FB2C4}
.piede a:hover{color:#fff}
.piede img{height:48px; width:auto; margin-bottom:16px}
.piede__claim{max-width:34ch; color:#8399AC}
.piede__lista{list-style:none; margin:0; padding:0; display:grid; gap:9px}
.piede__contatti{font-style:normal; line-height:1.75}
.piede__social{display:flex; gap:10px; margin-top:18px}
.piede__social a{
  width:38px; height:38px; border-radius:50%; border:1px solid rgba(255,255,255,.18);
  display:flex; align-items:center; justify-content:center; color:#9FB2C4;
}
.piede__social a:hover{background:rgba(255,255,255,.1); color:#fff}
.piede__coda{
  border-top:1px solid rgba(255,255,255,.1); padding:20px 24px; display:flex; flex-wrap:wrap;
  justify-content:space-between; gap:12px; font-size:.86rem; color:#7E93A6;
}
.piede__coda p{margin:0}

/* ------------------------------------------------------------ errore 404 */
.errore{text-align:center; padding:clamp(70px,10vw,130px) 0}
.errore__numero{font-family:var(--serif); font-size:clamp(5rem,16vw,10rem); line-height:1; color:var(--blu-chiaro); margin:0}

/* ------------------------------------------------------------- responsive */
@media (max-width:1024px){
  .con-lato{grid-template-columns:1fr}
  .lato{position:static}
  .sitafest-vetrina__dentro{grid-template-columns:1fr; text-align:left}
  .sitafest-vetrina__media{order:-1}
  .sitafest-marchio{width:min(190px,50%)}
  .piede__griglia{grid-template-columns:1fr 1fr; gap:34px}
}

@media (max-width:900px){
  .menu-tasto{display:inline-flex}
  .menu{
    position:absolute; left:0; right:0; top:100%;
    background:var(--bianco); border-bottom:1px solid var(--bordo);
    box-shadow:var(--ombra); padding:10px 0 18px;
    display:none;
  }
  .menu.aperto{display:block}
  .menu ul{flex-direction:column; align-items:stretch; gap:0; padding:0 16px}
  .menu a{padding:14px 12px; border-bottom:1px solid var(--sabbia-scura); border-radius:0; font-size:1rem}
  .menu li:last-child a{border-bottom:0}
  .testata__destra{gap:8px}
  .testata__cta{padding:9px 14px; font-size:.86rem; white-space:nowrap}
}

@media (max-width:640px){
  body{font-size:16px}
  .contenitore{padding:0 18px}
  .marchio img{height:44px}
  .testata__riga{min-height:70px}
  .programma__voce{grid-template-columns:1fr; gap:4px}
  .programma__ora{padding-top:0}
  .piede__griglia{grid-template-columns:1fr}
  .piede__coda{flex-direction:column; text-align:center; align-items:center}
  .hero__azioni .bottone{width:100%; justify-content:center}
  .mosaico{grid-template-columns:repeat(auto-fill,minmax(140px,1fr)); gap:10px}
  .visore__didascalia{padding:0 20px}
  .loghi{grid-template-columns:repeat(auto-fill,minmax(112px,1fr)); gap:10px}
  .loghi__voce{padding:10px}
  .loghi--main{grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:12px}
  .loghi--main .loghi__voce{padding:16px}
  .loghi--sostenitore{grid-template-columns:repeat(auto-fill,minmax(92px,1fr)); gap:8px}
}

@media (prefers-reduced-motion:reduce){
  *{animation:none!important; transition:none!important; scroll-behavior:auto!important}
}

@media print{
  .testata,.piede,.hero__azioni,.menu-tasto,.richiamo{display:none}
  body{background:#fff; font-size:12pt}
  .sezione{padding:12pt 0}
}
