@font-face{font-family:"Newsreader";src:url("caratteri/newsreader-400.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap;}
@font-face{font-family:"Newsreader";src:url("caratteri/newsreader-400-italic.woff2") format("woff2");font-weight:400;font-style:italic;font-display:swap;}
@font-face{font-family:"Newsreader";src:url("caratteri/newsreader-500.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap;}
@font-face{font-family:"Inter";src:url("caratteri/inter-400.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap;}
@font-face{font-family:"Inter";src:url("caratteri/inter-500.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap;}
@font-face{font-family:"Inter";src:url("caratteri/inter-600.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap;}

:root{
  /* ---- palette: cambia questi valori per cambiare tutto il sito ---- */
  --fondo:#F7FAFC;        /* superficie: bianco caldo */
  --sup:#FFFFFF;          /* riquadri */
  --bordo:#DCE4EC;        /* filetti */
  --navy:#1A365D;         /* colore principale: titoli, marchio */
  --testo:#2D3748;        /* testo corrente */
  --fioco:#5A6B80;        /* grafite: testo secondario */
  --acc:#9C6B0A;          /* accento per TESTI ed etichette (4,5:1 su bianco) */
  --acc-pieno:#D69E2E;    /* accento per RIEMPIMENTI: zafferano pieno */
  --acc-su:#1A365D;       /* testo sopra il riempimento (5,1:1) */

  --display:"Newsreader",Georgia,"Times New Roman",serif;
  --testo-f:"Inter",system-ui,sans-serif;
  --gutter:clamp(1.25rem,5vw,5rem);
  --max:1280px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;background:var(--fondo);color:var(--testo);
  font-family:var(--testo-f);font-weight:400;
  font-size:clamp(1rem,.97rem + .2vw,1.07rem);line-height:1.66;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;
}
a{color:inherit;}
.wrap{max-width:var(--max);margin:0 auto;padding:0 var(--gutter);}
.salta{position:absolute;left:-9999px;}
.salta:focus{left:1rem;top:1rem;background:var(--navy);color:#fff;padding:.6rem 1rem;z-index:300;}
:focus-visible{outline:2px solid var(--acc);outline-offset:4px;}

.etichetta{font-size:.7rem;font-weight:600;letter-spacing:.19em;text-transform:uppercase;color:var(--acc);margin:0 0 1.2rem;}
.titolo{font-family:var(--display);color:var(--navy);font-weight:400;line-height:1.08;letter-spacing:-.012em;margin:0 0 1.2rem;font-size:clamp(2rem,1.25rem + 3vw,3.4rem);}
.corpo{color:var(--fioco);max-width:58ch;margin:0 0 2.6rem;}

#avanzamento{position:fixed;top:0;left:0;height:2px;width:100%;transform:scaleX(0);transform-origin:left;background:var(--acc-pieno);z-index:200;}

/* ---------- cursore ---------- */
#punto,#anello{position:fixed;top:0;left:0;pointer-events:none;z-index:250;border-radius:50%;opacity:0;}
#punto{width:6px;height:6px;background:var(--acc-pieno);margin:-3px 0 0 -3px;}
#anello{width:38px;height:38px;border:1px solid color-mix(in srgb,var(--acc) 45%,transparent);margin:-19px 0 0 -19px;transition:width .25s,height .25s,margin .25s,border-color .25s,background .25s;}
#anello.attivo{width:64px;height:64px;margin:-32px 0 0 -32px;background:color-mix(in srgb,var(--acc-pieno) 16%,transparent);border-color:var(--acc-pieno);}
body.cursore-attivo,body.cursore-attivo a,body.cursore-attivo button{cursor:none;}
@media (hover:none),(pointer:coarse){#punto,#anello{display:none !important;}}

/* ---------- testata ---------- */
.testata{position:fixed;top:0;left:0;right:0;z-index:100;background:transparent;border-bottom:1px solid transparent;
  transition:background .35s ease,backdrop-filter .35s ease,border-color .35s ease;}
.testata.compatta{background:rgba(247,250,252,.90);backdrop-filter:blur(14px);border-bottom-color:var(--bordo);}
.testata .wrap{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;min-height:98px;transition:min-height .35s ease;}
.testata.compatta .wrap{min-height:74px;}
.marchio{text-decoration:none;display:block;line-height:0;color:var(--navy);}
.marchio img{display:block;height:56px;width:auto;transition:height .35s ease;}
.testata.compatta .marchio img{height:42px;}
@media (max-width:620px){.marchio img{height:42px;}.testata.compatta .marchio img{height:36px;}}
.menu{display:flex;gap:2rem;font-size:.77rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;}
.menu a{text-decoration:none;color:var(--fioco);transition:color .2s;position:relative;}
.menu a::after{content:"";position:absolute;left:0;bottom:-5px;width:0;height:1px;background:var(--acc-pieno);transition:width .3s cubic-bezier(.22,.7,.2,1);}
.menu a:hover{color:var(--testo);}
.menu a:hover::after{width:100%;}
@media (max-width:900px){.menu{display:none;}}

/* ---------- apertura ---------- */
.apertura{padding:clamp(8.5rem,15vw,11rem) 0 clamp(2.5rem,5vw,3.5rem);position:relative;}
.apertura .wrap{position:relative;}
.apertura h1{font-family:var(--display);color:var(--navy);font-weight:400;font-size:clamp(2.3rem,1.1rem + 4.6vw,4.6rem);
  line-height:1.05;letter-spacing:-.014em;margin:0 0 1.3rem;max-width:15ch;}
.apertura h1 .acceso{color:var(--acc);font-style:italic;}
.sommario{font-size:clamp(1rem,.95rem + .35vw,1.13rem);color:var(--fioco);max-width:54ch;margin:0 0 2.5rem;}
.azioni{display:flex;flex-wrap:wrap;gap:.75rem;}
.bottone{display:inline-block;font-size:.78rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;text-decoration:none;
  padding:1rem 1.8rem;background:var(--acc-pieno);color:var(--acc-su);border:1px solid var(--acc-pieno);transition:background .22s,color .22s;}
.bottone:hover{background:transparent;color:var(--acc);}
.bottone.vuoto{background:transparent;color:var(--navy);border-color:var(--bordo);}
.bottone.vuoto:hover{border-color:var(--acc-pieno);color:var(--acc);}


/* ---------- sezioni ---------- */
.sezione{padding:clamp(4rem,9vw,7rem) 0;border-top:1px solid var(--bordo);}
.intestazione{margin-bottom:2.4rem;}

/* ---------- schede attività ---------- */
.bento{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;}
.cella{background:var(--sup);border:1px solid var(--bordo);border-radius:14px;padding:1.6rem;min-height:180px;box-shadow:0 1px 2px rgba(26,54,93,.04);
  display:flex;flex-direction:column;justify-content:space-between;
  transition:transform .32s cubic-bezier(.22,.7,.2,1),border-color .32s;}
.cella:hover{transform:translateY(-4px);border-color:var(--acc-pieno);box-shadow:0 16px 34px -22px rgba(26,54,93,.35);}
.cella h3{font-family:var(--display);color:var(--navy);font-weight:500;font-size:1.32rem;margin:0 0 .45rem;letter-spacing:-.008em;}
.cella p{margin:0;font-size:.9rem;color:var(--fioco);line-height:1.58;}
.pill{align-self:flex-start;margin-bottom:.95rem;font-size:.63rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;
  color:var(--acc);border:1px solid var(--bordo);border-radius:999px;padding:.3rem .65rem;}
.c2{grid-column:span 2;}
.cpieno{background:var(--acc-pieno);border-color:var(--acc-pieno);grid-column:span 2;}
.cpieno h3{color:var(--acc-su);}
.cpieno p{color:var(--acc-su);opacity:.82;}
.cpieno .pill{color:var(--acc-su);border-color:color-mix(in srgb,var(--acc-su) 40%,transparent);}
@media (max-width:920px){.bento{grid-template-columns:repeat(2,1fr);}.c2,.cpieno{grid-column:span 2;}}
@media (max-width:560px){.bento{grid-template-columns:1fr;}.c2,.cpieno{grid-column:span 1;}}

/* ---------- metodo ---------- */
.metodo{display:grid;grid-template-columns:repeat(auto-fit,minmax(225px,1fr));gap:12px;list-style:none;margin:0;padding:0;}
.metodo li{background:var(--sup);border:1px solid var(--bordo);border-radius:14px;padding:1.6rem 1.4rem;
  box-shadow:0 1px 2px rgba(26,54,93,.04);
  transition:transform .3s cubic-bezier(.22,.7,.2,1),border-color .3s,box-shadow .3s;}
.metodo li:hover{transform:translateY(-4px);border-color:var(--acc-pieno);box-shadow:0 16px 34px -22px rgba(26,54,93,.35);}
.metodo b{display:block;font-family:var(--display);color:var(--navy);font-weight:500;font-size:1.12rem;margin-bottom:.4rem;}
.metodo span{font-size:.92rem;color:var(--fioco);}

/* ---------- profilo ---------- */
.profilo{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(1.5rem,5vw,4rem);align-items:start;}
.profilo p{color:var(--fioco);margin:0 0 1.1rem;max-width:60ch;}
.scheda{border:1px solid var(--bordo);background:var(--sup);padding:1.7rem;border-radius:14px;}
.scheda dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:.75rem 1.3rem;font-size:.92rem;}
.scheda dt{font-size:.64rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--acc);padding-top:.3rem;}
.scheda dd{margin:0;}
@media (max-width:880px){.profilo{grid-template-columns:1fr;}}

/* ---------- contatti ---------- */
.contatti{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.5rem,5vw,4rem);}
.grande{font-family:var(--display);color:var(--navy);font-weight:400;font-size:clamp(1.7rem,1rem + 2.5vw,2.9rem);letter-spacing:-.01em;line-height:1.14;margin:0 0 1.2rem;}
.recapiti{list-style:none;margin:0;padding:0;}
.recapiti li{padding:1rem 0;border-bottom:1px solid var(--bordo);}
.recapiti span{display:block;font-size:.64rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--acc);margin-bottom:.25rem;}
.recapiti a{text-decoration:none;border-bottom:1px solid transparent;transition:border-color .2s;}
.recapiti a:hover{border-bottom-color:var(--acc-pieno);}
@media (max-width:880px){.contatti{grid-template-columns:1fr;}}

/* ---------- piede ---------- */
.piede{border-top:1px solid var(--bordo);padding:2.2rem 0 3rem;background:var(--sup);}
.piede .wrap{display:flex;flex-wrap:wrap;gap:.8rem 2rem;justify-content:space-between;font-size:.74rem;color:var(--fioco);}

.rivela{opacity:0;transform:translateY(18px);transition:opacity .8s cubic-bezier(.22,.7,.2,1),transform .8s cubic-bezier(.22,.7,.2,1);}
.rivela.vista{opacity:1;transform:none;}

@media (prefers-reduced-motion:reduce){
  *{animation:none !important;}
  .rivela{opacity:1;transform:none;transition:none;}
  html{scroll-behavior:auto;}
  #punto,#anello{display:none !important;}
}

/* ====================================================== */
/* ============ PAGINE DELLE ATTIVITÀ =================== */
/* ====================================================== */

.briciole{font-size:.72rem;font-weight:500;letter-spacing:.1em;text-transform:uppercase;color:var(--fioco);margin:0 0 1.4rem;}
.briciole a{text-decoration:none;border-bottom:1px solid transparent;transition:border-color .2s;}
.briciole a:hover{border-bottom-color:var(--acc-pieno);}
.briciole span{color:var(--acc);}

.apertura-pagina{padding:clamp(8.5rem,15vw,10.5rem) 0 clamp(2rem,4vw,3rem);}
.apertura-pagina h1{font-family:var(--display);color:var(--navy);font-weight:400;
  font-size:clamp(2.1rem,1.1rem + 3.6vw,3.8rem);line-height:1.06;letter-spacing:-.014em;margin:0 0 1.2rem;max-width:18ch;}
.occhio{font-size:clamp(1.02rem,.95rem + .4vw,1.2rem);color:var(--fioco);max-width:60ch;margin:0 0 2.2rem;}

/* blocco a due colonne: titolo a sinistra, contenuto a destra */
.blocco{display:grid;grid-template-columns:1fr;gap:1.4rem;padding:clamp(3rem,6vw,4.5rem) 0;border-top:1px solid var(--bordo);}
.blocco > h2{font-family:var(--display);color:var(--navy);font-weight:400;font-size:clamp(1.5rem,1.1rem + 1.4vw,2.1rem);
  letter-spacing:-.01em;line-height:1.12;margin:0;}
.blocco p{color:var(--fioco);max-width:64ch;margin:0 0 1.1rem;}
.blocco p:last-child{margin-bottom:0;}
@media (min-width:920px){.blocco{grid-template-columns:minmax(0,22ch) 1fr;gap:clamp(2rem,5vw,4.5rem);}}

/* elenco con segno zafferano */
.elenco{list-style:none;margin:0;padding:0;}
.elenco li{position:relative;padding:.55rem 0 .55rem 1.5rem;border-bottom:1px solid var(--bordo);color:var(--fioco);}
.elenco li:last-child{border-bottom:0;}
.elenco li::before{content:"";position:absolute;left:0;top:1.28rem;width:7px;height:7px;background:var(--acc-pieno);}
.elenco b{color:var(--navy);font-weight:600;}

/* fasi numerate */
.fasi{list-style:none;counter-reset:f;margin:0;padding:0;display:grid;gap:12px;}
.fasi li{counter-increment:f;background:var(--sup);border:1px solid var(--bordo);border-radius:14px;
  padding:1.4rem 1.5rem 1.4rem 3.6rem;position:relative;box-shadow:0 1px 2px rgba(26,54,93,.04);}
.fasi li::before{content:counter(f,decimal-leading-zero);position:absolute;left:1.4rem;top:1.45rem;
  font-family:var(--display);font-size:.95rem;font-weight:500;color:var(--acc);}
.fasi b{display:block;font-family:var(--display);color:var(--navy);font-weight:500;font-size:1.12rem;margin-bottom:.25rem;}
.fasi span{font-size:.93rem;color:var(--fioco);}

/* riquadro delle consegne */
.consegna{background:var(--sup);border:1px solid var(--bordo);border-left:3px solid var(--acc-pieno);border-radius:0 14px 14px 0;padding:1.5rem 1.7rem;}
.consegna h3{font-size:.68rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--acc);margin:0 0 .9rem;}
.consegna ul{list-style:none;margin:0;padding:0;}
.consegna li{padding:.42rem 0;color:var(--testo);font-size:.95rem;}
.consegna li + li{border-top:1px solid var(--bordo);}

/* nota di delimitazione */
.nota{background:var(--sup);border:1px dashed var(--bordo);border-radius:14px;padding:1.3rem 1.5rem;font-size:.92rem;color:var(--fioco);}
.nota b{color:var(--navy);font-weight:600;}

/* richiamo finale */
.richiamo{padding:clamp(3rem,6vw,4.5rem) 0;border-top:1px solid var(--bordo);}
.richiamo .grande{max-width:22ch;}

/* altre attività */
.altre{padding:clamp(2.5rem,5vw,3.5rem) 0 clamp(3.5rem,7vw,5rem);border-top:1px solid var(--bordo);}
.altre h2{font-size:.7rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--acc);margin:0 0 1.2rem;}
.altre-griglia{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;}
.altre-griglia a{text-decoration:none;background:var(--sup);border:1px solid var(--bordo);border-radius:14px;
  padding:1.3rem 1.4rem;display:block;box-shadow:0 1px 2px rgba(26,54,93,.04);
  transition:transform .3s cubic-bezier(.22,.7,.2,1),border-color .3s,box-shadow .3s;}
.altre-griglia a:hover{transform:translateY(-4px);border-color:var(--acc-pieno);box-shadow:0 16px 34px -22px rgba(26,54,93,.35);}
.altre-griglia b{display:block;font-family:var(--display);color:var(--navy);font-weight:500;font-size:1.08rem;margin-bottom:.2rem;}
.altre-griglia span{font-size:.88rem;color:var(--fioco);}

/* la scheda attività diventa un link */
a.cella{text-decoration:none;color:inherit;}
.freccia{font-size:.68rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--acc);margin-top:1rem;display:block;}
.cpieno .freccia{color:var(--acc-su);}


/* ====================================================== */
/* ============ NAVIGAZIONE ============================= */
/* ====================================================== */

.menu{align-items:center;}
.menu > a,.voce-btn{position:relative;}

/* voce con tendina */
.voce-tendina{position:relative;}
.voce-btn{display:flex;align-items:center;gap:.4rem;background:none;border:0;cursor:pointer;
  font-family:var(--testo-f);font-size:.77rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;
  color:var(--fioco);padding:.2rem 0;transition:color .2s;}
.voce-btn:hover,.voce-btn[aria-expanded="true"]{color:var(--testo);}
.voce-btn::after{content:"";position:absolute;left:0;bottom:-5px;width:0;height:1px;background:var(--acc-pieno);transition:width .3s cubic-bezier(.22,.7,.2,1);}
.voce-btn:hover::after,.voce-btn[aria-expanded="true"]::after{width:100%;}
.chev{width:9px;height:9px;flex:none;transition:transform .25s ease;}
.voce-btn[aria-expanded="true"] .chev{transform:rotate(180deg);}

.tendina{position:absolute;top:calc(100% + 16px);left:-.9rem;min-width:300px;z-index:120;
  background:var(--sup);border:1px solid var(--bordo);border-radius:14px;padding:.5rem;
  box-shadow:0 26px 52px -30px rgba(26,54,93,.5);
  opacity:0;visibility:hidden;transform:translateY(-7px);
  transition:opacity .22s ease,transform .22s cubic-bezier(.22,.7,.2,1),visibility .22s;}
.tendina.aperta{opacity:1;visibility:visible;transform:none;}
.tendina::before{content:"";position:absolute;top:-18px;left:0;right:0;height:18px;}
.tendina a{display:block;text-decoration:none;padding:.72rem .9rem;border-radius:10px;transition:background .2s;}
.tendina a:hover{background:var(--fondo);}
.tendina b{display:block;font-family:var(--display);color:var(--navy);font-weight:500;font-size:1.04rem;
  letter-spacing:-.008em;text-transform:none;margin-bottom:.1rem;}
.tendina span{display:block;font-size:.72rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--acc);}

/* pulsante per telefono */
.hamburger{display:none;position:relative;z-index:200;flex-direction:column;gap:5px;
  background:none;border:0;cursor:pointer;padding:.55rem .25rem;}
.hamburger span{display:block;width:25px;height:2px;background:var(--navy);transition:transform .28s,opacity .22s;}
.hamburger[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.hamburger[aria-expanded="true"] span:nth-child(2){opacity:0;}
.hamburger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

.velo{position:fixed;inset:0;background:rgba(26,54,93,.35);backdrop-filter:blur(2px);z-index:140;
  opacity:0;visibility:hidden;transition:opacity .3s,visibility .3s;}
.velo.aperto{opacity:1;visibility:visible;}

@media (max-width:900px){
  /* Il pannello e il pulsante devono restare sopra il velo esterno. */
  .testata{z-index:160;}
  /* Il filtro creerebbe un contenitore per il menu fixed dopo lo scroll. */
  .testata.compatta{backdrop-filter:none;-webkit-backdrop-filter:none;}
  .hamburger{display:flex;}
  .velo{display:block;}
  .menu{display:block;position:fixed;top:0;right:0;bottom:0;width:min(86vw,350px);
    background:var(--sup);border-left:1px solid var(--bordo);padding:6.5rem 1.6rem 2.5rem;
    visibility:hidden;transform:translateX(100%);transition:transform .32s cubic-bezier(.22,.7,.2,1),visibility .32s;
    overflow-y:auto;z-index:150;gap:0;}
  .menu.aperto{visibility:visible;transform:none;}
  .voce-tendina{position:static;}
  .voce-btn{pointer-events:none;width:100%;color:var(--acc);font-size:.68rem;letter-spacing:.17em;margin-bottom:.5rem;}
  .voce-btn::after{display:none;}
  .chev{display:none;}
  .tendina{position:static;min-width:0;opacity:1;visibility:visible;transform:none;
    background:transparent;border:0;border-radius:0;box-shadow:none;padding:0;margin-bottom:1.4rem;}
  .tendina::before{display:none;}
  .tendina a{padding:.62rem 0;border-radius:0;}
  .tendina a:hover{background:transparent;}
  .menu > a{display:block;padding:.95rem 0;border-top:1px solid var(--bordo);color:var(--navy);}
  .menu > a::after{display:none;}
}

@media (prefers-reduced-motion:reduce){
  .tendina,.menu,.velo,.hamburger span,.chev{transition:none !important;}
}


/* l'ancora non finisce sotto la testata fissa */
:target,.sezione[id],section[id]{scroll-margin-top:96px;}
@media (max-width:620px){:target,.sezione[id],section[id]{scroll-margin-top:78px;}}