/* Le dieci tappe del progetto (assets/progetto.js; in progetto.html e in fondo alla home).
   Pagina a scorrimento: testo a sinistra, disegno fisso a destra che cambia a ogni parte (su telefono il disegno sta sopra il testo).
   Solo variabili di assets/stile.css, nessun colore scritto qui. */
.intro-pag{max-width:760px;margin:0 0 6px}
.intro-pag h1{font-size:clamp(34px,6vw,52px);line-height:1.05;margin:4px 0 10px}
.intro-pag .sub{font-size:18px;color:var(--muted);margin:0}
.scena{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px 40px;align-items:stretch;margin-top:14px}
.colfig{grid-column:2;grid-row:1}
.testi{grid-column:1;grid-row:1}
.sticky{position:sticky;top:24px;height:min(74vh,600px);margin-top:18px}
.testi section{min-height:82vh;display:flex;flex-direction:column;justify-content:center;padding:26px 0;border-top:1px solid var(--line)}
.testi section:first-child{border-top:0}
.testi .num-parte{font:700 14px/1 var(--font-titoli);letter-spacing:.08em;text-transform:uppercase;color:var(--accent);margin:0 0 8px}
.testi h2{font-size:clamp(28px,3.6vw,38px);line-height:1.08;margin:0 0 14px}
.testi p{font-size:18px;line-height:1.55;margin:0 0 12px;max-width:34em}
.testi b{font-weight:700}
.testi .link-riga{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.fig{position:absolute;inset:0;margin:0;background:var(--card);border:1px solid var(--line);border-radius:14px;box-shadow:0 6px 22px var(--ombra);padding:14px;display:flex;flex-direction:column;opacity:0;pointer-events:none;transition:opacity .45s ease}
.fig.attiva{opacity:1;pointer-events:auto}
.fig svg{width:100%;height:100%;display:block;flex:1;min-height:0}
.fig figcaption{font-size:13.5px;color:var(--muted);margin:6px 2px 0;line-height:1.35}
html:not(.js) .sticky{position:static;height:auto}
html:not(.js) .fig{position:static;opacity:1;margin-bottom:12px;height:340px}
html:not(.js) .colfig{grid-column:1;grid-row:2}
@media (max-width:820px){
  .scena{display:block}
  .colfig{display:contents}
  .sticky{top:0;z-index:5;height:40vh;min-height:230px;margin:0 -16px;padding:8px 16px;background:var(--bg)}
  .testi section{min-height:64vh;padding:20px 0}
  .testi p{font-size:17px}
}
/* disegni */
.d-testo{font-family:var(--font-testi);fill:var(--ink);font-size:13px}
.d-piccolo{font-family:var(--font-testi);fill:var(--muted);font-size:11.5px}
.d-grande{font-family:var(--font-titoli);font-weight:700;fill:var(--ink);font-size:26px}
.d-titolo{font-family:var(--font-titoli);font-weight:700;fill:var(--ink);font-size:17px;letter-spacing:.02em;text-transform:uppercase}
.d-scatola{fill:var(--sunk);stroke:var(--line);stroke-width:1.5}
.d-scatola.acc{stroke:var(--oro);stroke-width:2.2}
.d-filo{stroke:var(--neu-blu);stroke-width:2;stroke-dasharray:4 5;fill:none}
.d-punto{fill:var(--oro)}
.d-spento{fill:var(--traccia);stroke:var(--line);stroke-width:1.2}
.d-acceso{fill:var(--vr-verde)}
.d-blu{fill:var(--neu-blu)}
.d-oro{fill:var(--neu-arancio)}
.d-rosso{fill:var(--vr-rosso)}
.d-zona{fill:var(--sunk);stroke:var(--line);stroke-width:.8}
.d-zona.doppio{fill:var(--vr-rosso);stroke:var(--vr-rosso);fill-opacity:0;transition:fill-opacity .6s ease}
.fig.attiva .d-zona.doppio{fill-opacity:.82}
.d-contorno{fill:none;stroke:var(--ink);stroke-width:2.2;opacity:.65}
.d-etichetta{font-family:var(--font-testi);font-weight:600;font-size:23px;fill:var(--ink);paint-order:stroke;stroke:var(--card);stroke-width:7px;stroke-linejoin:round}
.d-livello{fill:var(--sunk);stroke:var(--line);stroke-width:1.5}
.d-livello.fatto{fill:var(--pill-misurato-bg);stroke:var(--pill-misurato-linea)}
.d-livello.manca{fill:none;stroke:var(--vr-rosso);stroke-width:2.2;stroke-dasharray:7 5}
.d-barra{transform-box:fill-box;transform-origin:left center}
.d-su-blu{fill:var(--card)}
/* tappe 5-9: riquadri delle decisioni, righe dei risultati */
.testi .decisioni{list-style:none;padding:0;margin:0 0 8px;display:grid;gap:8px}
.testi .decisioni li{background:var(--card);border:1px solid var(--line);border-radius:10px;padding:9px 12px;font-size:16px;line-height:1.4}
.testi .decisioni b{display:block;font-size:17px;margin-bottom:2px}
.testi section#dati{display:block}
.testi .dq{min-height:30vh;display:flex;flex-direction:column;justify-content:center;gap:8px;border-top:1px dashed var(--line);padding:14px 0}
.testi .dq dl{display:grid;grid-template-columns:minmax(0,8.5em) minmax(0,1fr);gap:4px 12px;margin:0}
.testi .dq dt{font:700 12px/1.5 var(--font-titoli);letter-spacing:.06em;text-transform:uppercase;color:var(--accent);padding-top:3px}
.testi .dq dd{margin:0;font-size:16px;line-height:1.45}
.testi .dq dt:last-of-type,.testi .dq dd:last-of-type{font-weight:700}
.testi .dq .btn{align-self:flex-start}
.testi .fatti{list-style:none;padding:0;margin:0 0 10px;display:grid;gap:8px}
.testi .fatti li{border-left:3px solid var(--oro);padding:2px 0 2px 12px;font-size:16.5px;line-height:1.45}
.testi .cosa-farei .farei li{font-size:16px}
/* animazioni (spente con «riduci movimento») */
@keyframes scorri{from{transform:translateY(0);opacity:0}15%{opacity:1}85%{opacity:1}to{transform:translateY(46px);opacity:0}}
@keyframes accendi{from{opacity:0;transform:scale(.4)}to{opacity:1;transform:scale(1)}}
@keyframes cresci{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes cresciSu{from{transform:scaleY(0)}to{transform:scaleY(1)}}
@keyframes batti{0%,100%{opacity:.35}50%{opacity:1}}
.fig.attiva .a-scorri{animation:scorri 1.9s linear infinite}
.fig.attiva .a-accendi{transform-box:fill-box;transform-origin:center;animation:accendi .5s ease backwards}
.fig.attiva .a-cresci{animation:cresci 1.1s cubic-bezier(.2,.7,.2,1) backwards}
.fig.attiva .a-batti{animation:batti 2.2s ease-in-out infinite}
.fig.attiva .a-su{transform-box:fill-box;transform-origin:center bottom;animation:cresciSu 1.1s cubic-bezier(.2,.7,.2,1) backwards}
@media (prefers-reduced-motion:reduce){
  .fig{transition:none}
  .fig.attiva .a-scorri,.fig.attiva .a-accendi,.fig.attiva .a-cresci,.fig.attiva .a-batti,.fig.attiva .a-su{animation:none}
  .d-zona.doppio{transition:none}
  .a-scorri{display:none}
}
.finale-bottoni{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px}
