/* ===== TOKEN ===== */
:root{
  --primary:#A8440B;      /* arancio terracotta, 6:1 su bianco (AA+) */
  --sun:#FFB547;          /* ambra: accenti, testo scuro sopra (10:1) */
  --primary-dark:#7A3008;
  --accent:#0B4F8F;       /* blu istituzionale, 8.3:1 su bianco */
  --ink:#1F1F1F; --muted:#4A4A4A;
  --bg:#fff; --soft:#FFF6EE; --line:#F2DCC8;
  --dark:#1F2124; --on-dark:#EDEDED; --link-dark:#FFC58A;
  --font-head:Georgia,"Times New Roman",serif;
  --font-text:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --fs:1.125rem;          /* 18px base */
  --s1:.5rem;--s2:1rem;--s3:1.5rem;--s4:2.5rem;--s5:4rem;
  --radius:12px; --shadow:0 4px 18px rgba(0,0,0,.1); --max:1180px; --card-w:270px;
}
/* ===== BASE ===== */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:90px}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}}
body{font:var(--fs)/1.7 var(--font-text);color:var(--ink);background:var(--bg)}
img{max-width:100%;height:auto;display:block}
a{color:var(--accent)}
:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
.container{width:min(100% - 2.5rem,var(--max));margin-inline:auto}
.skip-link{position:absolute;left:-999px;top:0;background:var(--primary-dark);color:#fff;padding:var(--s2);z-index:3000}
.skip-link:focus{left:0}
h1,h2,h3{font-family:var(--font-head);line-height:1.25;color:var(--primary)}
h1{font-size:clamp(2rem,5vw,2.8rem)} h2{font-size:clamp(1.6rem,3.5vw,2.1rem);margin-bottom:var(--s2)} h3{font-size:1.3rem}
.section{padding-block:var(--s5)} .section--soft{background:var(--soft)}
.section-head{text-align:center;max-width:720px;margin:0 auto var(--s4)}
.page-hero{text-align:center;padding:var(--s4) 0 var(--s2)}
.prose{max-width:760px;margin-inline:auto;padding-block:var(--s3) var(--s5)}
.prose p{margin-bottom:var(--s2)}
/* ===== BOTTONI ===== */
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;min-width:48px;padding:.7rem 1.6rem;border-radius:999px;background:var(--primary);color:#fff;font-weight:700;text-decoration:none;border:2px solid var(--primary);cursor:pointer;font-size:1rem;transition:background .2s}
.btn:hover{background:var(--primary-dark);border-color:var(--primary-dark)}
.btn--outline{background:transparent;color:var(--primary)} .btn--outline:hover{color:#fff}
.btn--light{background:#fff;color:var(--primary-dark);border-color:#fff} .btn--light:hover{background:var(--soft);color:var(--primary-dark)}
.btn-row{display:flex;flex-wrap:wrap;gap:var(--s2);justify-content:center}
/* ===== HEADER ===== */
.site-header{border-top:5px solid var(--sun);position:sticky;top:0;z-index:1000;background:#fff;box-shadow:0 2px 10px rgba(0,0,0,.1)}
.header-inner{display:flex;align-items:center;justify-content:space-between;min-height:80px}
.logo img{max-height:60px;width:auto}
.main-nav ul{list-style:none;display:flex;gap:var(--s1)}
.main-nav a{display:flex;align-items:center;min-height:48px;padding:0 .9rem;color:var(--ink);font-weight:700;font-size:.95rem;letter-spacing:.5px;text-decoration:none;border-bottom:3px solid transparent}
.main-nav a:hover,.main-nav a[aria-current="page"]{color:var(--primary);border-bottom-color:var(--primary)}
.menu-toggle{display:none;min-height:48px;min-width:48px;padding:0 1rem;background:none;border:2px solid var(--primary);border-radius:8px;color:var(--primary);font:700 1rem var(--font-text);cursor:pointer}
/* ===== HERO ===== */
.hero{background:var(--soft)}
.cta-bar{background:var(--dark);color:#fff;padding:var(--s3) 0}
.cta-bar .container{display:flex;flex-wrap:wrap;gap:var(--s2);align-items:center;justify-content:space-between}
.cta-bar p{font-family:var(--font-head);font-size:1.3rem;max-width:560px}
/* ===== CARD EVENTI ===== */
/* Tutte le locandine hanno la stessa larghezza; le righe incomplete (anche una sola card) sono centrate */
.cards{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--s3)}
.cards>.card{flex:0 0 min(100%,var(--card-w))}
.card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}
.thumb{display:block;width:100%;padding:0;border:0;background:var(--soft);cursor:zoom-in}
.thumb img{width:100%;aspect-ratio:4/5;object-fit:cover}
.card-body{display:flex;flex-direction:column;gap:var(--s1);padding:var(--s3);flex:1}
.card-date{display:inline-block;align-self:flex-start;background:var(--sun);color:#1F1F1F;font-weight:700;font-size:.95rem;padding:.2rem .8rem;border-radius:999px}
.card-body p{font-size:1rem;color:var(--muted)}
.card-body .btn{margin-top:auto;align-self:flex-start}
/* ===== DOVE SIAMO / DONA / 5x1000 ===== */
.center{text-align:center} .center p{max-width:800px;margin:0 auto var(--s3)}
.full-img img{width:100%}
.dona-card{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s3);max-width:860px;margin:var(--s4) auto;padding:var(--s4);border-left:6px solid var(--sun);border-radius:var(--radius);box-shadow:var(--shadow)}
.dona-card img{width:150px}.dona-card>div{flex:1 1 300px}.dona-card p{margin-bottom:var(--s2)}
.split{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));gap:var(--s4);align-items:center}
.split img{border-radius:var(--radius);box-shadow:var(--shadow)}
.split p{margin-bottom:var(--s2)}
.cf{background:#fff;border-left:5px solid var(--sun);padding:var(--s2) var(--s3);margin-bottom:var(--s3);border-radius:6px}
.cf strong{color:var(--primary);font-size:1.2rem}
/* ===== CONTATTI ===== */
.map{width:100%;height:360px;border:0;border-radius:var(--radius);box-shadow:var(--shadow)}
.info-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:var(--s3);margin-block:var(--s4)}
.info-card{padding:var(--s3);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}
.info-card ul{list-style:none}.info-card li{margin-bottom:var(--s1)}
.info-card a{display:inline-block;min-height:48px;line-height:48px;font-weight:700}
/* ===== GALLERIA ===== */
.chips{display:flex;flex-wrap:wrap;gap:var(--s1);justify-content:center;margin-bottom:var(--s3)}
.chip{min-height:48px;padding:0 1.2rem;border:2px solid var(--primary);border-radius:999px;background:#fff;color:var(--primary);font:700 1rem var(--font-text);cursor:pointer}
.chip[aria-pressed="true"]{background:var(--primary);color:#fff}
.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,240px),1fr));gap:var(--s2)}
.gallery figure{position:relative}
.gallery .thumb{border-radius:var(--radius);overflow:hidden}
.gallery img{aspect-ratio:1;transition:transform .3s}
.gallery .thumb:hover img{transform:scale(1.04)}
.gallery figcaption{font-size:.9rem;color:var(--muted);padding-top:.3rem}
/* ===== LIGHTBOX (<dialog>) ===== */
#lightbox{border:0;background:transparent;max-width:100vw;max-height:100vh;width:100%;height:100%;margin:0;color:#fff}
#lightbox::backdrop{background:rgba(0,0,0,.88)}
#lightbox[open]{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--s1)}
#lightbox img{max-width:92vw;max-height:80vh;object-fit:contain;border-radius:6px}
.lb-cap{text-align:center;max-width:90vw;font-size:1rem}
#lightbox button{position:absolute;width:56px;height:56px;border:0;border-radius:50%;background:#fff;color:var(--primary-dark);font-size:2rem;line-height:1;cursor:pointer}
.lb-close{top:16px;right:16px}.lb-prev{left:12px;top:50%}.lb-next{right:12px;top:50%}
#lightbox.single .lb-prev,#lightbox.single .lb-next{display:none}
/* ===== FOOTER ===== */
.site-footer{background:var(--dark);color:var(--on-dark);font-size:1rem}
.site-footer h2{color:var(--link-dark);font-size:1.5rem}
.site-footer a{color:var(--link-dark)}
.footer-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:var(--s4);padding-block:var(--s5)}
.footer-grid p,.footer-grid li{margin-bottom:var(--s1)}
.footer-grid ul{list-style:none}
.footer-grid li a{display:inline-block;min-height:32px}
.footer-bottom{background:#000;text-align:center;padding:var(--s2);font-size:.9rem}
/* ===== MOBILE ===== */
@media(max-width:900px){
  .menu-toggle{display:inline-flex;align-items:center}
  .main-nav{position:absolute;top:100%;left:0;right:0;background:#fff;box-shadow:0 10px 15px rgba(0,0,0,.12);border-top:1px solid var(--line)}
  .main-nav ul{flex-direction:column;gap:0}
  .main-nav a{justify-content:center;min-height:56px;border-bottom:1px solid var(--line)}
  .section{padding-block:var(--s4)}
}
.main-nav[hidden]{display:none}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ===== ANIMAZIONI (disattivate con prefers-reduced-motion, vedi regola in cima) ===== */
@keyframes fadeUp{from{opacity:0;transform:translateY(16px)}}
@keyframes fade{from{opacity:0}}
@keyframes pop{from{opacity:0;transform:scale(.96)}}
@keyframes kenburns{from{transform:scale(1.07)}to{transform:scale(1)}}
@keyframes beat{50%{transform:scale(1.07)}}
/* titoli pagina */
.page-hero h1,.section-head h1{animation:fadeUp .8s ease both}
/* comparsa allo scroll (classe .reveal aggiunta da script.js) */
.reveal{opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s ease}
.reveal.in{opacity:1;transform:none}
/* card */
.card{transition:transform .35s ease,box-shadow .35s ease}
.card:hover{transform:translateY(-6px);box-shadow:0 14px 30px rgba(0,0,0,.16)}
.thumb{overflow:hidden}
.thumb img{transition:transform .6s ease}
.card:hover .thumb img{transform:scale(1.05)}
/* bottoni e menu */
.btn{transition:background .25s,color .25s,transform .25s,box-shadow .25s}
.btn:hover{transform:translateY(-2px);box-shadow:0 6px 14px rgba(0,0,0,.18)}
.btn:active{transform:none}
.main-nav a,.chip,.site-footer a{transition:color .25s,border-color .25s,background .25s}
/* galleria e cuore */
.dona-card img{animation:beat 2.8s ease-in-out infinite}
/* lightbox */
#lightbox[open]{animation:fade .25s ease}
#lightbox[open] img{animation:pop .3s ease}
#lightbox[open]::backdrop{animation:fade .25s ease}

@media(max-width:600px){:root{--card-w:340px}}

/* ===== HERO SLIDER (vanilla: dissolvenza incrociata + leggero zoom) ===== */
.hero{position:relative;overflow:hidden;background:var(--soft)}
.hero-track{display:grid}
.hero-slide{grid-area:1/1;opacity:0;visibility:hidden;transition:opacity 1.2s ease,visibility 1.2s}
.hero-slide.active{opacity:1;visibility:visible;z-index:1}
.hero-slide img{width:100%;aspect-ratio:16/6;min-height:220px;object-fit:cover;transform:scale(1.08);transition:transform 9s ease-out}
.hero-slide.active img{transform:none}
.hero-arrow,.hero-pause{position:absolute;z-index:5;width:48px;height:48px;border:0;border-radius:50%;background:rgba(255,255,255,.92);color:var(--primary);cursor:pointer;box-shadow:0 2px 8px rgba(0,0,0,.25);transition:transform .25s,background .25s}
.hero-arrow{top:50%;margin-top:-24px;font-size:2rem;line-height:1}
.hero-prev{left:16px}.hero-next{right:16px}
.hero-arrow:hover,.hero-pause:hover{background:#fff;transform:scale(1.08)}
.hero-bar{position:absolute;z-index:5;left:0;right:0;bottom:8px;display:flex;justify-content:center}
.hero-pause{left:12px;bottom:0;font-size:.9rem}
.hero-dots{display:flex}
.hero-dot{width:48px;height:48px;display:grid;place-items:center;border:0;background:none;cursor:pointer}
.hero-dot::before{content:"";width:12px;height:12px;border-radius:999px;background:#fff;border:2px solid var(--primary);transition:width .35s,background .35s}
.hero-dot[aria-current="true"]::before{width:30px;background:var(--primary)}
@media(max-width:900px){.hero-slide img{aspect-ratio:16/9}.hero-arrow{display:none}}

/* ===== FOTO DI GRUPPO IN EVIDENZA ===== */
.featured{background:var(--soft)}
/* Foto singola: larga e intera, senza ritagli */
.featured-photo{width:min(100%,720px);margin:0 auto var(--s4)}
.featured-photo .thumb{border-radius:var(--radius);box-shadow:12px 12px 0 var(--sun),var(--shadow);overflow:hidden}
.featured-photo img{width:100%;height:auto;aspect-ratio:auto;object-fit:contain}   /* annulla il ritaglio 4/5 delle locandine: i volti restano tutti visibili */
.featured-photo figcaption{margin-top:var(--s3);text-align:center;font-family:var(--font-head);font-size:1.25rem;color:var(--primary)}
@media(max-width:600px){.featured-photo .thumb{box-shadow:8px 8px 0 var(--sun),var(--shadow)}}

/* ===== GALLERIA: titoli sezione + VIDEO ===== */
.gallery-title{text-align:center;margin-bottom:var(--s3)}
.section[hidden]{display:none}                 /* sezione video vuota = nascosta */

.thumb--video{position:relative}
.thumb--video::after{                          /* icona play sopra la copertina */
  content:"\25B6";position:absolute;inset:0;margin:auto;width:64px;height:64px;
  display:grid;place-items:center;border-radius:50%;
  background:rgba(255,255,255,.92);color:var(--primary);font-size:1.6rem;padding-left:4px;
  box-shadow:0 2px 10px rgba(0,0,0,.35);pointer-events:none;transition:transform .25s}
.thumb--video:hover::after,.thumb--video:focus-visible::after{transform:scale(1.1)}

#lightbox video{max-width:92vw;max-height:80vh;border-radius:6px;background:#000}
#lightbox img[hidden],#lightbox video[hidden]{display:none}   /* necessario: img{display:block} annulla [hidden] */

/* ===== GALLERIA: copertina video presa dal primo fotogramma (nessun poster da creare) ===== */
.thumb video{display:block;width:100%;aspect-ratio:1;object-fit:cover;pointer-events:none}

/* ===== GALLERIA: schede Foto / Video ===== */
.tabs{display:flex;justify-content:center;gap:var(--s2);margin-bottom:var(--s4)}
.tab{min-height:56px;min-width:140px;padding:0 2rem;border:3px solid var(--primary);border-radius:999px;background:#fff;color:var(--primary);font:700 1.15rem var(--font-text);cursor:pointer;transition:background .25s,color .25s,box-shadow .25s}
.tab:hover{background:var(--soft)}
/* scheda selezionata: pieno + anello ambra tutto intorno (non affidato al solo colore) */
.tab[aria-selected="true"]{background:var(--primary);color:#fff;box-shadow:0 0 0 4px #fff,0 0 0 8px var(--sun)}
.gallery[hidden]{display:none}                 /* .gallery è display:grid e annullerebbe [hidden] */

/* ===== BADGE "CONCLUSO" sulle locandine (il click apre comunque l'immagine) ===== */
.thumb{position:relative}
.badge-concluso{position:absolute;top:12px;left:12px;padding:.25rem .9rem;border-radius:999px;background:#B3001B;color:#fff;font:700 1rem/1.4 var(--font-text);box-shadow:0 2px 8px rgba(0,0,0,.35);pointer-events:none}   /* bianco su rosso 7:1 */
