:root{
  --blu:#2e6f8e; --blu-scuro:#1d4b61; --azzurro:#cfe4ee;
  --verde:#2f9a4a; --verde-scuro:#1f6a33; --verde-chiaro:#d9efd6;
  --arancio:#ef8a1f; --arancio-scuro:#b9580c; --crema:#fbf3e2;
  --rosa:#e58bb6; --rosa-scuro:#a83a6c; --rosa-chiaro:#f8e1ec; --petrolio:#4f7f8f;
  --giallo:#e3e436; --rosso:#c8283a;
  --inchiostro:#24282a; --grigio:#5b6366; --carta:#fffdf8; --bordo:#e8e0cf;
  --r:22px; --max:1160px;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:72px}
body{margin:0;background:var(--carta);color:var(--inchiostro);font:17px/1.65 "Nunito Sans",system-ui,sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
h1,h2,h3{font-family:"Baloo 2",system-ui,sans-serif;line-height:1.08;margin:0 0 .45em}
h2{font-size:clamp(2rem,4.6vw,3.1rem)}
h3{font-size:1.5rem}
p{margin:0 0 1em}
.wrap{max-width:var(--max);margin:0 auto;padding:0 20px}
.label{font:600 .8rem/1 Oswald,sans-serif;letter-spacing:.16em;text-transform:uppercase}

/* ---- nav ---- */
header.nav{position:sticky;top:0;z-index:30;background:rgba(255,253,248,.93);backdrop-filter:blur(10px);border-bottom:1px solid var(--bordo)}
.nav .wrap{display:flex;align-items:center;gap:14px;height:64px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;font:800 1.15rem/1 "Baloo 2",sans-serif;color:var(--blu-scuro);white-space:nowrap}
.brand img{width:30px;height:auto}
.nav ul{display:flex;gap:4px;list-style:none;margin:0 0 0 auto;padding:0}
.nav ul a{display:block;white-space:nowrap;padding:8px 11px;border-radius:99px;text-decoration:none;font-weight:700;font-size:.92rem;color:var(--grigio)}
.nav ul a:hover{background:var(--crema);color:var(--inchiostro)}
.btn{display:inline-flex;align-items:center;gap:8px;padding:12px 22px;border-radius:99px;background:var(--blu);color:#fff;text-decoration:none;font-weight:700;border:0;cursor:pointer;font-size:1rem;transition:transform .15s,background .15s}
.btn:hover{transform:translateY(-1px);background:var(--blu-scuro)}
.btn.small{padding:8px 16px;font-size:.9rem}
.btn.ghost{background:transparent;color:var(--blu-scuro);box-shadow:inset 0 0 0 2px currentColor}
.btn.ghost:hover{background:rgba(0,0,0,.04)}
.menu-btn{display:none;margin-left:auto;background:none;border:0;font-size:1.6rem;cursor:pointer;color:var(--blu-scuro);padding:6px}
@media (max-width:1240px){
  .nav ul{display:none;position:absolute;top:64px;left:0;right:0;flex-direction:column;background:var(--carta);border-bottom:1px solid var(--bordo);padding:10px 16px 16px}
  .nav ul.open{display:flex}
  .menu-btn{display:block}
  .nav .btn.small{display:none}
}

/* ---- hero ---- */
.hero{position:relative;overflow:hidden;background:linear-gradient(160deg,#3f87a8 0%,var(--blu) 55%,var(--blu-scuro) 100%);color:#fff;padding:64px 0 120px}
.hero::after{content:"";position:absolute;left:-10%;right:-10%;bottom:-1px;height:110px;background:var(--carta);border-radius:50% 50% 0 0/100% 100% 0 0}
.hero .wrap{position:relative;z-index:1;display:grid;grid-template-columns:1.25fr .75fr;gap:32px;align-items:center}
.hero h1{font-size:clamp(2.8rem,7.5vw,5.6rem);color:var(--giallo);margin:0}
.hero .sub{font:600 clamp(1.1rem,2.4vw,1.6rem)/1.2 Oswald,sans-serif;letter-spacing:.06em;text-transform:uppercase;margin:.3em 0 1em}
.hero p.lead{font-size:1.18rem;max-width:36em;opacity:.95}
.hero .actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}
.hero .btn{background:var(--giallo);color:var(--blu-scuro)}
.hero .btn:hover{background:#fff}
.hero .btn.ghost{background:transparent;color:#fff}
.hero .mascotte{justify-self:center;width:min(240px,60vw);filter:drop-shadow(0 18px 30px rgba(0,0,0,.25));animation:saluta 6s ease-in-out infinite;transform-origin:50% 90%}
@keyframes saluta{0%,100%{transform:rotate(-3deg)}50%{transform:rotate(3deg)}}
@media (prefers-reduced-motion:reduce){.hero .mascotte{animation:none}}
@media (max-width:820px){.hero .wrap{grid-template-columns:1fr}.hero .mascotte{width:170px;grid-row:1}}

/* ---- tre realtà ---- */
.realta{margin-top:-70px;position:relative;z-index:2}
.realta .grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.card-r{background:#fff;border-radius:var(--r);padding:26px 24px 24px;box-shadow:0 12px 30px rgba(30,40,50,.09);text-decoration:none;display:flex;flex-direction:column;border-top:8px solid var(--c);transition:transform .2s}
.card-r:hover{transform:translateY(-4px)}
.card-r .label{color:var(--c)}
.card-r h3{margin:.45em 0 .35em;color:var(--inchiostro)}
.card-r p{color:var(--grigio);font-size:.97rem;flex:1}
.card-r .vai{font-weight:700;color:var(--c)}
@media (max-width:860px){.realta .grid{grid-template-columns:1fr}}

/* ---- numeri ---- */
.numeri{padding:56px 0 8px}
.numeri .grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;text-align:center}
.numeri b{display:block;font:800 clamp(2.2rem,5vw,3.2rem)/1 "Baloo 2",sans-serif;color:var(--blu)}
.numeri span{color:var(--grigio);font-size:.95rem}
@media (max-width:700px){.numeri .grid{grid-template-columns:repeat(2,1fr);row-gap:28px}}

/* ---- sezioni ---- */
section.sez{padding:84px 0}
.tab{display:inline-block;color:#fff;background:var(--c);padding:10px 26px 8px 30px;border-radius:44px 0 0 0;font:600 clamp(1.4rem,3vw,2rem)/1.1 Oswald,sans-serif;text-transform:uppercase;letter-spacing:.02em;margin-bottom:22px}
.tab small{display:block;font-size:.5em;letter-spacing:.14em;opacity:.9;margin-top:3px}
.intro{max-width:46em;font-size:1.1rem;color:var(--grigio)}

/* storia */
.storia{background:var(--azzurro)}
.storia .cols{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:start}
.timeline{list-style:none;margin:0;padding:0;border-left:3px solid var(--blu);margin-left:8px}
.timeline li{position:relative;padding:0 0 22px 26px}
.timeline li::before{content:"";position:absolute;left:-10px;top:6px;width:17px;height:17px;border-radius:50%;background:var(--giallo);border:3px solid var(--blu)}
.timeline .anno{font:600 1.05rem/1.2 Oswald,sans-serif;color:var(--blu-scuro);letter-spacing:.04em}
.timeline p{margin:.2em 0 0;font-size:.98rem}
.collage{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.polaroid{background:#fff;padding:8px 8px 10px;border-radius:6px;box-shadow:0 8px 22px rgba(20,40,60,.15);margin:0}
.polaroid img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:3px}
.polaroid figcaption{font-size:.8rem;color:var(--grigio);padding:6px 2px 0;line-height:1.3}
.polaroid:nth-child(odd){transform:rotate(-1.6deg)}
.polaroid:nth-child(even){transform:rotate(1.4deg)}
.polaroid.wide{grid-column:span 2}
.polaroid.wide img{aspect-ratio:16/9}
.citazione{margin:36px 0 0;padding:22px 26px;background:var(--blu-scuro);color:#fff;border-radius:var(--r);font-size:1.08rem}
.citazione strong{color:var(--giallo)}
@media (max-width:900px){.storia .cols{grid-template-columns:1fr}}

/* blocchi con foto (associazione, coop) */
.blocchi{display:grid;gap:26px;margin-top:34px}
.blocco{display:grid;grid-template-columns:1fr 1fr;background:#fff;border-radius:var(--r);overflow:hidden;box-shadow:0 10px 28px rgba(30,40,50,.07)}
.blocco:nth-child(even) .foto{order:2}
.blocco .foto{position:relative;min-height:280px;background:#eee}
.blocco .foto img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.blocco .foto.insegna{overflow:hidden}
.blocco .foto.insegna::before{content:"";position:absolute;inset:-30px;background:url(img/macrame-insegna.webp) center/cover;filter:blur(22px) brightness(.85)}
.blocco .foto.insegna img{object-fit:contain;z-index:1}
.blocco .testo{padding:30px 32px}
.blocco .label{color:var(--c)}
.blocco h3{font-size:1.9rem;margin:.3em 0 .4em;color:var(--cs)}
.blocco p{color:#3c4346}
.blocco .meta{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 14px}
.pill{background:var(--cc);color:var(--cs);font-weight:700;font-size:.8rem;padding:4px 12px;border-radius:99px}
.blocco .link{font-weight:700;color:var(--cs)}
@media (max-width:820px){.blocco .foto.insegna{min-height:0;aspect-ratio:606/333}.blocco{grid-template-columns:1fr}.blocco:nth-child(even) .foto{order:0}.blocco .foto{min-height:240px}}

/* le nostre radici */
.radici{display:grid;grid-template-columns:1.15fr .85fr;gap:40px;align-items:center;background:var(--blu);color:#fff;border-radius:var(--r);padding:40px;margin-top:34px;position:relative;overflow:hidden}
.radici::before{content:"";position:absolute;right:-60px;bottom:-40px;width:340px;height:620px;background:url(img/mascotte.webp) center/contain no-repeat;opacity:.08;transform:rotate(-8deg);pointer-events:none}
.radici .label{color:var(--giallo)}
.radici h3{font-size:clamp(1.8rem,3.4vw,2.4rem);color:var(--giallo);margin:.3em 0 .6em}
.radici p{font-size:1.04rem;line-height:1.75;opacity:.96}
.radici p:first-of-type::first-letter{float:left;font:800 3.4em/0.8 "Baloo 2",sans-serif;color:var(--giallo);margin:.08em .08em 0 0}
.radici .data{display:inline-block;background:var(--giallo);color:var(--blu-scuro);font-weight:800;padding:2px 10px;border-radius:8px}
.radici-foto{display:grid;grid-template-columns:1fr 1fr;gap:16px;position:relative;z-index:1}
.radici-foto .polaroid{color:var(--grigio)}
.radici-foto .polaroid img{aspect-ratio:1/1}
.radici-foto .polaroid.alta{display:flex;flex-direction:column}
.radici-foto .polaroid.alta img{flex:1;min-height:0;aspect-ratio:auto;object-fit:cover;object-position:center top}
@media (max-width:900px){.radici{grid-template-columns:1fr;padding:28px 22px}}
.associazione{--c:var(--verde);--cs:var(--verde-scuro);--cc:var(--verde-chiaro);background:linear-gradient(180deg,var(--carta),var(--verde-chiaro))}
.coop-campo{--c:#7f9c78;--cs:var(--arancio-scuro);--cc:#fde3c4;background:var(--crema)}
.coop-campo .tab{background:var(--arancio)}
.coop-lindberg{--c:var(--petrolio);--cs:var(--rosa-scuro);--cc:var(--rosa-chiaro);background:var(--rosa-chiaro)}
.coop-lindberg .tab{background:var(--rosa-scuro)}
.coop-head{display:flex;gap:26px;align-items:flex-end;flex-wrap:wrap}
.coop-head .tab{margin-bottom:0}
.coop-head .intro{margin:0;flex:1;min-width:260px}

/* villaggio */
.villaggio{background:#1a2e1a;color:#fff;position:relative;overflow:hidden}
.villaggio .wrap{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
.villaggio h2{color:#ffd166}
.villaggio p{opacity:.9}
.villaggio ul{padding-left:1.1em;margin:0 0 1.4em}
.villaggio li{margin:.25em 0}
.villaggio .btn{background:#ffd166;color:#1a2e1a}
.villaggio .btn:hover{background:#fff}
.schermo{background:#0f1c0f;border-radius:28px;padding:14px;box-shadow:0 24px 60px rgba(0,0,0,.45);max-width:420px;justify-self:center;width:100%}
.schermo img{border-radius:18px;width:100%;aspect-ratio:4/3;object-fit:cover}
.schermo p{text-align:center;font:600 .85rem Oswald,sans-serif;letter-spacing:.14em;text-transform:uppercase;margin:12px 0 2px;color:#ffd166}
@media (max-width:820px){.villaggio .wrap{grid-template-columns:1fr}}

/* sostieni */
.sostieni{--c:var(--verde)}
.sost-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:30px}
.sost{background:#fff;border:2px solid var(--bordo);border-radius:var(--r);padding:26px}
.sost h3{color:var(--verde-scuro)}
.sost .grande{font:800 1.9rem/1.1 "Baloo 2",sans-serif;color:var(--arancio-scuro);word-break:break-all;margin:.2em 0 .4em}
.sost .iban{font:700 1.02rem/1.4 ui-monospace,Consolas,monospace;color:var(--blu-scuro);word-break:break-all;margin:.3em 0 .8em}
.copia{background:var(--verde-chiaro);color:var(--verde-scuro);border:0;border-radius:99px;padding:8px 16px;font-weight:700;cursor:pointer;font-size:.9rem}
.copia:hover{background:#c6e6c1}
.sost img{border-radius:14px;margin-top:10px;aspect-ratio:16/9;object-fit:cover;width:100%}
@media (max-width:900px){.sost-grid{grid-template-columns:1fr}}

/* contatti */
.contatti{background:var(--blu-scuro);color:#fff}
.contatti .wrap{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:start}
.contatti h2{color:var(--giallo)}
.contatti dl{display:grid;grid-template-columns:auto 1fr;gap:10px 20px;margin:20px 0 0}
.contatti dt{font:600 .85rem/1.6 Oswald,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--azzurro)}
.contatti dd{margin:0;font-weight:700}
.contatti a{color:#fff}
.enti{display:grid;gap:12px}
.ente{background:rgba(255,255,255,.08);border-radius:16px;padding:16px 20px;border-left:6px solid var(--c)}
.ente b{display:block;font-family:"Baloo 2",sans-serif;font-size:1.2rem}
.ente span{opacity:.85;font-size:.93rem}
@media (max-width:820px){.contatti .wrap{grid-template-columns:1fr}}

footer{background:#13323f;color:rgba(255,255,255,.75);padding:28px 0;font-size:.9rem}
footer .wrap{display:flex;flex-wrap:wrap;gap:12px 24px;justify-content:space-between;align-items:center}
footer a{color:#fff}

/* musica */
.musica{position:fixed;left:16px;bottom:16px;z-index:40;display:flex;align-items:center;gap:6px;background:rgba(29,75,97,.94);color:#fff;border-radius:99px;padding:6px 8px 6px 14px;box-shadow:0 10px 26px rgba(0,0,0,.25);backdrop-filter:blur(6px);font-size:.85rem;max-width:calc(100vw - 32px);transition:opacity .3s}
.musica[hidden]{display:none}
.musica .titolo{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-right:4px}
.musica .titolo b{color:var(--giallo);font-weight:700}
.musica button{width:36px;height:36px;flex:none;border-radius:50%;border:0;background:rgba(255,255,255,.14);color:#fff;font-size:1rem;cursor:pointer;display:grid;place-items:center}
.musica button:hover{background:rgba(255,255,255,.28)}
.musica .note{display:inline-block}
.musica.suona .note{animation:nota 1.2s ease-in-out infinite}
@keyframes nota{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}
.musica.mini .titolo,.musica.mini .riavvia{display:none}
.musica.mini{padding:6px}
@media (prefers-reduced-motion:reduce){.musica.suona .note{animation:none}}
.reveal{opacity:0;transform:translateY(18px);transition:opacity .7s ease,transform .7s ease}
.reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}}

/* pagine interne */
.nav ul a[aria-current="page"]{background:var(--crema);color:var(--inchiostro)}
.pagina-hero{position:relative;overflow:hidden;background:var(--c);color:#fff;padding:48px 0 110px}
.pagina-hero::after{content:"";position:absolute;left:-10%;right:-10%;bottom:-1px;height:90px;background:var(--carta);border-radius:50% 50% 0 0/100% 100% 0 0}
.pagina-hero .wrap{position:relative;z-index:1;display:grid;grid-template-columns:1fr auto;gap:28px;align-items:center}
.pagina-hero h1{font-size:clamp(2.4rem,6vw,4.2rem);color:var(--giallo);margin:.15em 0 .2em}
.pagina-hero .sub{font:600 clamp(1rem,2vw,1.3rem)/1.2 Oswald,sans-serif;letter-spacing:.08em;text-transform:uppercase;margin:0 0 .8em}
.pagina-hero p{max-width:40em;font-size:1.12rem;opacity:.95;margin:0}
.pagina-hero .mascotte{width:150px;filter:drop-shadow(0 14px 24px rgba(0,0,0,.25))}
.briciole{color:#fff;opacity:.9;font-weight:700;font-size:.92rem;text-decoration:none}
.briciole:hover{opacity:1;text-decoration:underline}
@media (max-width:700px){.pagina-hero .wrap{grid-template-columns:1fr}.pagina-hero .mascotte{display:none}}
.card-r .foto-card{margin:-26px -24px 18px;height:180px;overflow:hidden;border-radius:14px 14px 0 0}
.card-r .foto-card img{width:100%;height:100%;object-fit:cover;transition:transform .4s}
.card-r:hover .foto-card img{transform:scale(1.05)}
.card-r{border-top:0;border-bottom:8px solid var(--c)}
.altre{padding:20px 0 84px}
.altre h2{font-size:clamp(1.6rem,3vw,2.2rem);color:var(--blu-scuro)}
.altre .grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
@media (max-width:760px){.altre .grid{grid-template-columns:1fr}}
.cta-sost{display:flex;flex-wrap:wrap;gap:16px 28px;align-items:center;justify-content:space-between;background:var(--verde-scuro);color:#fff;border-radius:var(--r);padding:28px 32px;margin-top:40px}
.cta-sost h3{margin:0;color:var(--giallo)}
.cta-sost p{margin:.3em 0 0;opacity:.9}
.cta-sost .btn{background:var(--giallo);color:var(--verde-scuro)}

/* centro sociale */
.centro{background:#fff;border-radius:var(--r);box-shadow:0 10px 28px rgba(30,40,50,.07);padding:36px;margin-top:34px;border-top:8px solid var(--verde)}
.centro .label{color:var(--verde)}
.centro h3{font-size:clamp(1.8rem,3.4vw,2.4rem);color:var(--verde-scuro);margin:.3em 0 .6em}
.centro p{color:#3c4346;line-height:1.75}
.centro-testo{display:grid;grid-template-columns:1.3fr .7fr;gap:36px;align-items:start}
.progetti{background:var(--verde-chiaro);border-radius:16px;padding:22px 24px}
.progetti h4{font:700 1rem/1.4 "Nunito Sans",sans-serif;color:var(--verde-scuro);margin:0 0 12px}
.progetti ul{list-style:none;margin:0;padding:0}
.progetti li{position:relative;padding:0 0 12px 22px;font-size:.95rem;line-height:1.5}
.progetti li::before{content:"";position:absolute;left:2px;top:.55em;width:9px;height:9px;border-radius:50%;background:var(--verde)}
.galleria{columns:3 240px;column-gap:14px;margin-top:30px}
.foto-g{display:block;break-inside:avoid;margin:0 0 14px;position:relative;border-radius:12px;overflow:hidden;cursor:zoom-in;background:#eee}
.foto-g img{width:100%;transition:transform .4s}
.foto-g:hover img{transform:scale(1.04)}
.foto-g span{position:absolute;left:0;right:0;bottom:0;padding:24px 12px 9px;font-size:.85rem;font-weight:700;color:#fff;background:linear-gradient(transparent,rgba(0,0,0,.65))}
@media (max-width:860px){.centro{padding:26px 20px}.centro-testo{grid-template-columns:1fr}}
.lightbox{border:0;padding:0;background:transparent;max-width:100vw;max-height:100vh;width:100vw;height:100vh;overflow:hidden}
.lightbox::backdrop{background:rgba(10,15,20,.88)}
.lightbox[open]{display:flex;align-items:center;justify-content:center}
.lightbox figure{margin:0;max-width:min(92vw,1300px);text-align:center}
.lightbox img{max-width:100%;max-height:82vh;border-radius:10px;margin:0 auto;box-shadow:0 20px 60px rgba(0,0,0,.5)}
.lightbox figcaption{color:#fff;font-weight:700;margin-top:12px}
.lightbox button{position:fixed;border:0;background:rgba(255,255,255,.14);color:#fff;width:48px;height:48px;border-radius:50%;font-size:1.6rem;cursor:pointer;display:grid;place-items:center}
.lightbox button:hover{background:rgba(255,255,255,.3)}
.lb-chiudi{top:16px;right:16px;font-size:1.2rem!important}
.lb-prec{left:16px;top:50%;transform:translateY(-50%)}
.lb-succ{right:16px;top:50%;transform:translateY(-50%)}
.numeri b.frase{font-size:clamp(1.15rem,2.2vw,1.5rem);line-height:1.05;height:clamp(2.2rem,5vw,3.2rem);display:flex;align-items:flex-end;justify-content:center}
.schermo img{aspect-ratio:auto}
.villaggio.parco{background:#203a27}
.nav-btns{display:flex;gap:8px;margin-left:8px}
.btn.gramigna{background:var(--verde)}
.btn.gramigna:hover{background:var(--verde-scuro)}
.nav .solo-mobile{display:none}
@media (max-width:1240px){.nav-btns{display:none}.nav ul.open .solo-mobile{display:block}.nav .solo-mobile a{color:var(--blu-scuro)}}
.hero .sopra{font:600 clamp(1.1rem,2.4vw,1.6rem)/1 Oswald,sans-serif;letter-spacing:.14em;text-transform:uppercase;margin:0 0 .15em}
