/* Chrome condiviso: header (.hd*) + footer (.ft*) identici su tutte le pagine del canvas.
   Prima erano copiati in ogni CSS per-pagina (you/cose/chisiamo/partecipa/toolkit/single) →
   qui in UN posto solo. Enqueue come dipendenza comune, prima della CSS di pagina (functions.php).
   NB: .hd prende position:absolute dal .canvas>* della pagina. single.php ha il suo header a
   flusso (.sa-hd/.sa-nav) → resta nel suo CSS. --teal è definito nei :root per-pagina. */

/* ===== HEADER ===== */
.hd{top:0;left:0;width:1920px;height:174px}
.hd-logo{position:absolute;left:116px;top:50px}
.hd-logo img{display:block;width:157px;height:auto}
.hd-nav{position:absolute;right:96px;top:66px;display:flex;align-items:center;gap:14px;font-size:20px}
.hd-nav a{color:var(--teal);text-decoration:none;font-weight:500}
.hd-nav a.active{font-weight:700}
.hd-nav span{color:var(--teal);opacity:.6}

/* ===== FOOTER (a flusso, responsive) ===== */
.ft{background:var(--teal);color:#fff;font-family:"Poppins",sans-serif;width:100%}
.ft a{color:#fff;text-decoration:none}
.ft-inner{max-width:1400px;margin:0 auto;padding:72px 80px 56px;display:flex;flex-wrap:wrap;gap:56px;justify-content:space-between}
.ft-brand{max-width:460px}
.ft-logo{font-family:"Madimi One";font-size:28px;line-height:1}
.ft-claim{font-family:"Madimi One";font-size:19px;letter-spacing:3px;text-transform:uppercase;opacity:.92;margin-top:2px}
.ft-desc{font-weight:300;font-size:16px;line-height:1.65;margin-top:20px;opacity:.9}
.ft-col{display:flex;flex-direction:column;gap:12px}
.ft h4{font-weight:600;font-size:14px;letter-spacing:1.5px;text-transform:uppercase;margin-bottom:6px}
.ft-org{font-weight:500;font-size:16px;opacity:.9;line-height:1.35;max-width:320px}
.ft-contact a{font-weight:300;font-size:16px;opacity:.9;width:fit-content}
.ft-contact a:hover{opacity:1;text-decoration:underline}
.ft-bar{border-top:1px solid rgba(255,255,255,.25);max-width:1400px;margin:0 auto;padding:22px 80px;display:flex;flex-wrap:wrap;gap:12px;justify-content:space-between;font-size:13px;font-weight:300;opacity:.85}
.ft-bar a:hover{text-decoration:underline}
/* Striscia loghi istituzionali sopra il footer (Home + Cos'è) */
.ft-loghi{background:#fff;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:44px;padding:30px 28px}
.ft-loghi img{height:auto;max-width:100%}
.ft-partner{width:calc(1336px * var(--s,1))}   /* feedback2 v2: scala come i loghi nel canvas (Partecipa/Chi siamo, base 1336/131 × --s) → stessa dimensione a ogni larghezza */
.ft-aris{width:calc(131px * var(--s,1))}
/* Astra scroll-to-top: dequeuando il CSS di Astra il suo JS lo mostra grezzo (freccia nera in basso a sx sotto il footer) → nascosto ovunque */
#ast-scroll-top{display:none!important}
@media(max-width:760px){
  /* feedback3 F4: a 390px servivano 400px (300+30+22+44) → ARIS andava a capo, e su schermi più
     larghi no ("su alcuni cell"). Da qui nowrap + misure che stanno anche a 360px.
     feedback5 F4: le due immagini erano alla STESSA altezza (266/48 → ~29px entrambe), ma nel
     design ARIS è la METÀ della striscia (canvas 1336→h145, 131→h79) → su mobile appariva 1,85×
     troppo grande. Ora si tiene il rapporto del design (partner/aris = 1336/131 = 10,2):
     286+28+14 gap+32 padding = 360. */
  .ft-loghi{gap:14px;padding:24px 16px;flex-wrap:nowrap}
  .ft-partner{width:286px}
  .ft-aris{width:28px}
  .ft-inner{flex-direction:column;flex-wrap:nowrap;padding:48px 28px 40px;gap:34px}
  .ft-brand{max-width:none;width:100%}
  .ft-desc{max-width:100%}
  .ft-bar{flex-direction:column;flex-wrap:nowrap;gap:8px;padding:18px 28px}
  .ft-logo{font-size:24px}
}