/* ============================================================
   LIBRERIA EFFETTI — fx.css
   Nove effetti, senza dipendenze. I primi quattro usano lo scorrimento,
   gli altri cinque (13-17) no: la sezione resta alta quanto il suo contenuto.
   Tutte le classi iniziano con "fx-" e non toccano il resto del sito.
   I colori si cambiano dalle variabili --fx-* (vedi LEGGIMI.txt);
   i caratteri sono quelli del sito che ospita la libreria.
   ============================================================ */

/* ==== [base] ==== */
.fx-parole,.fx-galleria,.fx-racconto,.fx-pannelli,
.fx-indice,.fx-fisarmonica,.fx-griglia,.fx-percorso,.fx-lista{box-sizing:border-box}
.fx-parole *,.fx-galleria *,.fx-racconto *,.fx-pannelli *,
.fx-indice *,.fx-fisarmonica *,.fx-griglia *,.fx-percorso *,.fx-lista *{box-sizing:inherit}
.fx-pin{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden}
.fx-scuro{background:var(--fx-ink,#0D1524);color:#fff}
.fx-chiaro{background:var(--fx-paper,#FBFCFE);color:var(--fx-ink,#0D1524)}
.fx-etichetta{display:block;font-size:.72rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;
  color:var(--fx-accent-2,#E02328)}
.fx-scuro .fx-etichetta{color:var(--fx-accent-2-chiaro,var(--fx-accent-2,#F2565B))}

/* ==== [parole] ==== 03 · Testo che si accende */
.fx-parole{position:relative}
.fx-parole .fx-pin{display:grid;place-items:center}
.fx-parole-testo{margin:0 auto;max-width:var(--fx-larghezza-testo,1040px);padding:0 var(--fx-margine,clamp(18px,4vw,48px));
  text-align:center;font-weight:700;letter-spacing:-.03em;line-height:1.22;
  font-size:var(--fx-parole-size,clamp(1.5rem,3.6vw,3.1rem))}
.fx-parole-testo em{font-style:inherit}
.fx-w{opacity:.14;transition:opacity .3s ease}
.fx-w.fx-on{opacity:1}
.fx-w.fx-hl.fx-on{color:var(--fx-accent,#1E63C4)}
.fx-scuro .fx-w.fx-hl.fx-on{color:var(--fx-accent-chiaro,var(--fx-accent,#2B7FE0))}
.fx-statico .fx-parole .fx-pin{position:static;height:auto;padding:12vh 0}
.fx-statico .fx-w{opacity:1}
.fx-statico .fx-w.fx-hl{color:var(--fx-accent,#1E63C4)}

/* ==== [galleria] ==== 02 · Galleria orizzontale */
.fx-galleria{position:relative}
.fx-galleria .fx-pin{display:flex;flex-direction:column;justify-content:center}
.fx-galleria-testa{position:absolute;left:0;right:0;top:min(11vh,110px);
  max-width:var(--fx-larghezza,1200px);margin:0 auto;padding:0 var(--fx-margine,clamp(18px,4vw,48px));
  display:flex;align-items:flex-end;justify-content:space-between;gap:20px}
.fx-galleria-testa h2{margin:0;font-size:clamp(1.7rem,3.2vw,2.6rem);line-height:1.05}
.fx-galleria-testa small{font-size:.7rem;font-weight:500;letter-spacing:.18em;text-transform:uppercase;opacity:.55;white-space:nowrap}
.fx-galleria-binario{display:flex;gap:clamp(14px,1.8vw,24px);padding:0 var(--fx-margine,clamp(18px,4vw,48px));
  width:max-content;will-change:transform}
.fx-scheda{position:relative;flex:0 0 auto;width:var(--fx-scheda-larghezza,clamp(240px,24vw,340px));
  aspect-ratio:var(--fx-scheda-proporzione,3/4.2);border-radius:var(--fx-raggio,18px);overflow:hidden;
  display:flex;flex-direction:column;justify-content:flex-end;padding:clamp(18px,2vw,26px);
  color:#fff;text-decoration:none;background:linear-gradient(160deg,var(--fx-g1,#2B7FE0),var(--fx-g2,#0B3A82));
  box-shadow:0 18px 40px -22px rgba(0,0,0,.6);transition:transform .35s ease}
.fx-scheda:hover{transform:translateY(-6px)}
.fx-scheda img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.fx-scheda::before{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.55),transparent 60%)}
.fx-scheda > *{position:relative}
.fx-scheda-eti{font-size:.66rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;opacity:.8}
.fx-scheda-titolo{margin:.35em 0 0;font-size:clamp(1.15rem,1.7vw,1.5rem);line-height:1.15}
.fx-scheda-sub{margin:.35em 0 0;font-size:.8rem;opacity:.7}
.fx-galleria-barra{position:absolute;left:var(--fx-margine,clamp(18px,4vw,48px));right:var(--fx-margine,clamp(18px,4vw,48px));
  bottom:min(8vh,72px);height:2px;background:rgba(127,127,127,.3);border-radius:2px;overflow:hidden}
.fx-galleria-barra i{display:block;height:100%;width:100%;transform-origin:left;transform:scaleX(0);
  background:linear-gradient(90deg,var(--fx-accent,#1E63C4),var(--fx-accent-2,#E02328))}
.fx-statico .fx-galleria .fx-pin{position:static;height:auto;padding:10vh 0 7vh}
.fx-statico .fx-galleria-testa{position:static;margin-bottom:28px}
.fx-statico .fx-galleria-binario{width:auto;overflow-x:auto;transform:none!important;padding-bottom:12px;
  scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch}
.fx-statico .fx-scheda{scroll-snap-align:start}
.fx-statico .fx-galleria-barra{display:none}

/* ==== [racconto] ==== 07 · Racconto a scorrimento */
.fx-racconto{position:relative}
.fx-racconto-griglia{display:grid;grid-template-columns:1.05fr 1fr;gap:clamp(30px,5vw,72px);align-items:center;
  max-width:var(--fx-larghezza,1200px);height:100%;margin:0 auto;padding:0 var(--fx-margine,clamp(18px,4vw,48px))}
/* titolo in cima ai passi (facoltativo) */
.fx-racconto-titolo{margin:0 0 clamp(18px,2.4vw,34px)}
.fx-racconto-titolo h2{margin:.3em 0 0;font-size:clamp(1.8rem,3.1vw,2.8rem);line-height:1.05;letter-spacing:-.03em}
.fx-racconto-titolo p{margin:.7em 0 0;font-size:clamp(.95rem,1.1vw,1.08rem);line-height:1.55;opacity:.72;max-width:48ch}
/* elenco dei passi: numero grande + titolo, con la linea che si riempie */
.fx-racconto-passi{position:relative}
.fx-passo{position:relative;display:grid;grid-template-columns:auto 1fr;gap:clamp(12px,1.4vw,20px);align-items:baseline;
  padding:clamp(9px,1.1vw,14px) 0 clamp(9px,1.1vw,14px) clamp(18px,2vw,26px);opacity:.32;transition:opacity .4s,transform .5s cubic-bezier(.2,.7,.2,1)}
.fx-passo.fx-on{opacity:1;transform:translateX(6px)}
.fx-passo::before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:rgba(127,127,127,.28)}
.fx-passo.fx-on::before{background:var(--fx-accent-2,#E02328)}
.fx-passo-n{font-weight:700;font-size:clamp(1rem,1.3vw,1.2rem);letter-spacing:-.02em;line-height:1;min-width:2.2em;
  color:var(--fx-accent,#1E63C4)}
.fx-scuro .fx-passo-n{color:var(--fx-accent-chiaro,var(--fx-accent,#2B7FE0))}
.fx-passo h3{margin:0;font-size:clamp(1.3rem,2.1vw,1.85rem);line-height:1.12}
.fx-passo > p{grid-column:2;margin:.35em 0 0;font-size:.95rem;line-height:1.55;opacity:.75}
.fx-etichetta + h3{margin-top:.35em}
/* il riquadro */
.fx-racconto-visual{position:relative;width:100%;max-width:460px;aspect-ratio:4/5;max-height:74svh;justify-self:center;
  border-radius:var(--fx-raggio,18px);overflow:hidden;border:1px solid rgba(127,127,127,.25)}
.fx-visual{position:absolute;inset:0;opacity:0;transform:scale(1.06);
  transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform 1s cubic-bezier(.2,.7,.2,1);
  background:radial-gradient(120% 80% at 15% 0%,rgba(255,255,255,.16),transparent 55%),
             linear-gradient(160deg,var(--fx-g1,#2B7FE0) 0%,var(--fx-g2,#0B3A82) 100%);
  display:flex;flex-direction:column;justify-content:space-between;padding:clamp(22px,2.6vw,32px);color:#fff}
.fx-visual.fx-on{opacity:1;transform:none}
.fx-visual > img{position:absolute;inset:0;z-index:0;width:100%;height:100%;object-fit:cover;object-position:top}
.fx-visual::after{content:"";position:absolute;inset:0;z-index:0;background:linear-gradient(to top,rgba(8,14,28,.94) 0%,rgba(8,14,28,.72) 42%,rgba(8,14,28,.05) 75%),linear-gradient(to bottom,rgba(8,14,28,.55),rgba(8,14,28,0) 38%);opacity:0;pointer-events:none}
.fx-visual.fx-foto::after{opacity:1}
.fx-visual > *{position:relative;z-index:1}
.fx-visual-n{font-weight:700;font-size:clamp(3rem,6vw,4.8rem);line-height:1;letter-spacing:-.04em;opacity:.5}
.fx-visual.fx-foto .fx-visual-n{font-size:clamp(1.6rem,3vw,2.4rem);opacity:.85;text-shadow:0 2px 12px rgba(0,0,0,.5)}
.fx-visual > .fx-visual-ico{position:absolute;right:clamp(20px,3vw,32px);top:clamp(20px,3vw,32px);width:56px;height:56px;
  border-radius:14px;background:rgba(255,255,255,.16);backdrop-filter:blur(6px);display:grid;place-items:center}
.fx-visual-ico svg{width:26px;height:26px;stroke:#fff;fill:none}
.fx-visual-body{display:flex;flex-direction:column;gap:.55em}
.fx-visual-t{font-weight:600;font-size:clamp(1.35rem,2.1vw,1.85rem);line-height:1.15}
.fx-visual-d{margin:0;font-size:clamp(.9rem,1.05vw,1rem);line-height:1.55;opacity:.9;
  display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
.fx-visual-punti{list-style:none;margin:.25em 0 0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.fx-visual-punti li{font-size:.78rem;font-weight:600;padding:.4em .75em;border-radius:999px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.22)}
.fx-visual-link{display:inline-flex;align-items:center;gap:.4em;margin-top:.5em;font-weight:600;font-size:.9rem;color:#fff;text-decoration:none;
  border-bottom:1px solid rgba(255,255,255,.45);padding-bottom:2px;align-self:flex-start}
.fx-visual-link:hover{border-bottom-color:#fff}
/* schermi bassi (portatili) */
@media (max-height:760px) and (min-width:861px){
  .fx-racconto-titolo p{display:none}
  .fx-racconto-titolo h2{font-size:1.7rem}
  .fx-passo{padding-top:6px;padding-bottom:6px}
  .fx-passo h3{font-size:1.3rem}
  .fx-racconto-visual{max-height:70svh}
  .fx-visual-d{-webkit-line-clamp:3}
  .fx-visual-punti{display:none}
}
/* telefono: riquadro sopra, numeri dei passi in fila, titolo del passo attivo */
@media (max-width:860px){
  .fx-racconto-griglia{grid-template-columns:1fr;gap:14px;align-content:center}
  .fx-racconto-visual{order:-1;width:100%;max-width:100%;aspect-ratio:auto;height:min(58svh,520px);max-height:none}
  .fx-visual{padding:18px}
  .fx-visual-n{font-size:2rem}
  .fx-visual > .fx-visual-ico{width:42px;height:42px;right:18px;top:18px}
  .fx-visual-ico svg{width:20px;height:20px}
  .fx-visual-t{font-size:1.3rem}
  .fx-visual-d{font-size:.9rem;-webkit-line-clamp:4}
  .fx-visual-punti li{font-size:.72rem}
  .fx-racconto-titolo{margin-bottom:8px}
  .fx-racconto-titolo h2{font-size:1.45rem}
  .fx-racconto-titolo p{display:none}
  .fx-racconto-passi{display:flex;flex-wrap:wrap;gap:6px 10px;align-items:center}
  .fx-racconto-passi .fx-racconto-titolo{flex:0 0 100%}
  .fx-passo{display:inline-flex;gap:8px;align-items:center;padding:6px 10px;border-radius:999px;transform:none;opacity:.5;
    border:1px solid rgba(127,127,127,.35)}
  .fx-passo::before{display:none}
  .fx-passo.fx-on{opacity:1;transform:none;border-color:var(--fx-accent-2,#E02328)}
  .fx-passo h3{display:none}
  .fx-passo.fx-on h3{display:block;font-size:.95rem}
  .fx-passo > p,.fx-etichetta{display:none}
  .fx-passo-n{font-size:.85rem;min-width:0}
}
/* riduzione movimento: tutto disteso */
.fx-statico .fx-racconto .fx-pin{position:static;height:auto;padding:10vh 0}
.fx-statico .fx-racconto-griglia{height:auto;align-items:start}
.fx-statico .fx-passo{opacity:1;display:grid;transform:none}
.fx-statico .fx-racconto-visual{position:sticky;top:20px;max-height:none;height:auto;aspect-ratio:4/5}
.fx-statico .fx-visual{position:relative;opacity:1;transform:none;aspect-ratio:4/5;margin-bottom:10px}
@media (max-width:860px){
  .fx-statico .fx-racconto-passi{display:block}
  .fx-statico .fx-passo{display:grid;padding:9px 0 9px 18px;border:0;border-radius:0;opacity:1}
  .fx-statico .fx-passo::before{display:block}
  .fx-statico .fx-passo h3{display:block;font-size:1.2rem}
  .fx-statico .fx-passo-n{font-size:1rem}
  .fx-statico .fx-racconto-visual{position:static;display:none}
}

/* ==== [pannelli] ==== 12 · Pannelli che si allargano */
.fx-pannelli{display:flex;gap:10px;height:var(--fx-pannelli-altezza,min(70svh,600px));
  max-width:var(--fx-larghezza,1200px);margin:0 auto;padding:0 var(--fx-margine,clamp(18px,4vw,48px))}
.fx-pannello{position:relative;flex:1 1 0;min-width:0;border-radius:var(--fx-raggio,18px);overflow:hidden;cursor:pointer;
  color:#fff;text-decoration:none;background:linear-gradient(150deg,var(--fx-g1,#2B7FE0),var(--fx-g2,#0B3A82));
  transition:flex-grow .7s cubic-bezier(.22,1,.36,1),filter .5s}
.fx-pannello:not(.fx-on){filter:saturate(.55) brightness(.72)}
.fx-pannello.fx-on{flex-grow:5}
.fx-pannello img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.fx-pannello::before{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.55),transparent 62%)}
.fx-pannello-verticale{position:absolute;left:50%;bottom:26px;transform:translateX(-50%) rotate(180deg);writing-mode:vertical-rl;
  font-size:.8rem;font-weight:600;letter-spacing:.14em;white-space:nowrap;transition:opacity .3s}
.fx-pannello.fx-on .fx-pannello-verticale{opacity:0}
.fx-pannello-info{position:absolute;left:0;right:0;bottom:0;padding:80px clamp(20px,2.4vw,30px) clamp(22px,2.4vw,30px);
  opacity:0;transform:translateY(18px);transition:opacity .3s,transform .3s}
.fx-pannello.fx-on .fx-pannello-info{opacity:1;transform:none;transition:opacity .5s .28s,transform .6s .28s}
.fx-pannello-info > .fx-pannello-ico{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;background:rgba(255,255,255,.16);margin:0 0 14px}
.fx-pannello-ico svg{width:22px;height:22px;stroke:#fff;fill:none}
.fx-pannello-info b{display:block;font-weight:600;font-size:clamp(1.2rem,1.8vw,1.6rem);line-height:1.15;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fx-pannello-info > span{display:block;margin-top:.5em;font-size:.88rem;opacity:.85;line-height:1.55;max-width:46ch}
.fx-pannello-info > .fx-pannello-cta{display:inline-block;width:auto;margin-top:1em;font-weight:600;font-size:.82rem;padding:.6em 1.1em;
  border-radius:999px;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.3)}
@media (max-width:860px){
  .fx-pannelli{flex-direction:column;height:var(--fx-pannelli-altezza-mobile,86svh);gap:8px}
  /* da telefono l'etichetta e' orizzontale: deve andare a capo, non uscire dal pannello */
  .fx-pannello-verticale{writing-mode:horizontal-tb;transform:translate(-50%,50%);bottom:50%;
    white-space:normal;text-align:center;width:calc(100% - 34px);letter-spacing:.07em;line-height:1.35}
  .fx-pannello-info{padding:36px 18px 18px}
  .fx-pannello-info b{white-space:normal;overflow:visible;text-overflow:clip}
}
.fx-statico .fx-pannelli{height:auto;flex-wrap:wrap}
.fx-statico .fx-pannello{flex:1 1 260px;min-height:260px;filter:none}
.fx-statico .fx-pannello-verticale{display:none}
.fx-statico .fx-pannello-info{opacity:1;transform:none;padding-top:40px}

/* ==== [indice] ==== 13 · Indice a lato, si cambia al clic */
.fx-indice{padding:var(--fx-sezione,clamp(48px,6vw,86px)) 0}
.fx-indice-wrap{max-width:var(--fx-larghezza,1280px);margin:0 auto;padding-inline:var(--fx-margine,clamp(20px,4vw,64px))}
.fx-indice-griglia{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(28px,4vw,64px);align-items:center}
.fx-indice-voci{display:grid;gap:2px;border-left:2px solid var(--fx-bordo,rgba(13,21,36,.10));margin-top:clamp(22px,3vw,34px)}
.fx-scuro .fx-indice-voci{border-left-color:rgba(255,255,255,.16)}
.fx-indice-voce{all:unset;cursor:pointer;display:grid;grid-template-columns:52px 1fr;align-items:center;gap:6px;
  padding:13px 16px;border-left:2px solid transparent;margin-left:-2px;transition:background .18s}
.fx-indice-voce:hover{background:color-mix(in srgb,var(--fx-accent,#1E63C4) 6%,transparent)}
.fx-indice-voce:focus-visible{outline:2px solid var(--fx-accent,#1E63C4);outline-offset:-2px}
.fx-indice-voce .fx-n{font-weight:600;font-size:.95rem;color:#9AA7BC !important;transition:color .18s}
.fx-indice-voce .fx-t{font-weight:600;font-size:clamp(1.02rem,1.5vw,1.28rem);color:#8C97A8 !important;transition:color .18s;line-height:1.25}
.fx-scuro .fx-indice-voce .fx-n,.fx-scuro .fx-indice-voce .fx-t{color:rgba(255,255,255,.5)}
.fx-indice-voce[aria-selected="true"]{border-left-color:var(--fx-accent-2,#E02328)}
.fx-indice-voce[aria-selected="true"] .fx-n{color:var(--fx-accent,#1E63C4) !important}
.fx-indice-voce[aria-selected="true"] .fx-t{color:var(--fx-ink,#0D1524) !important}
.fx-scuro .fx-indice-voce[aria-selected="true"] .fx-n{color:var(--fx-accent-chiaro,#2B7FE0)}
.fx-scuro .fx-indice-voce[aria-selected="true"] .fx-t{color:#fff}
.fx-indice-schede{position:relative;border-radius:calc(var(--fx-raggio,12px) + 6px);overflow:hidden;
  min-height:var(--fx-indice-altezza,clamp(330px,38vw,430px));box-shadow:0 26px 54px -30px rgba(13,21,36,.5)}
.fx-indice-scheda{position:absolute;inset:0;padding:clamp(26px,3vw,40px);display:flex;flex-direction:column;color:#fff;
  opacity:0;visibility:hidden;transform:translateY(12px);transition:opacity .38s,transform .38s,visibility .38s;
  background:radial-gradient(120% 80% at 15% 0%,rgba(255,255,255,.16),transparent 55%),
             linear-gradient(160deg,var(--fx-g1,#2B7FE0),var(--fx-g2,#0B3A82))}
.fx-indice-scheda.fx-on{opacity:1;visibility:visible;transform:none}
.fx-indice-scheda .fx-testa{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}
.fx-indice-scheda .fx-num{font-weight:800;font-size:clamp(3rem,5.5vw,4.6rem);line-height:1;color:rgba(255,255,255,.22);letter-spacing:-.05em}
.fx-indice-scheda .fx-corpo{margin-top:auto;padding-top:26px}
.fx-indice-scheda b{color:inherit;display:block;font-weight:600;font-size:clamp(1.3rem,2.1vw,1.85rem);line-height:1.16}
.fx-indice-scheda p{margin:.7em 0 0;font-size:clamp(.92rem,.98vw,1.02rem);color:rgba(255,255,255,.88);max-width:44ch}

/* ==== [fisarmonica] ==== 14 · Fisarmonica */
.fx-fisarmonica{display:grid;gap:10px}
.fx-fisarmonica details{border:1px solid var(--fx-bordo,rgba(13,21,36,.10));border-radius:var(--fx-raggio,12px);
  background:var(--fx-paper,#FBFCFE);overflow:hidden;transition:box-shadow .2s,border-color .2s}
.fx-scuro .fx-fisarmonica details{background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.14)}
.fx-fisarmonica details[open]{border-color:color-mix(in srgb,var(--fx-accent,#1E63C4) 32%,transparent);
  box-shadow:0 16px 34px -24px rgba(13,21,36,.42)}
.fx-fisarmonica summary{cursor:pointer;list-style:none;display:grid;grid-template-columns:54px 1fr 28px;align-items:center;gap:8px;
  padding:clamp(16px,1.8vw,21px) clamp(16px,2vw,24px)}
.fx-fisarmonica summary::-webkit-details-marker{display:none}
.fx-fisarmonica summary:focus-visible{outline:2px solid var(--fx-accent,#1E63C4);outline-offset:-2px}
.fx-fisarmonica .fx-n{font-weight:600;font-size:.95rem;color:var(--fx-accent,#1E63C4) !important}
.fx-fisarmonica .fx-t{color:inherit;font-weight:600;font-size:clamp(1.05rem,1.5vw,1.3rem);line-height:1.2}
.fx-fisarmonica .fx-piu{width:22px;height:22px;position:relative;justify-self:end}
.fx-fisarmonica .fx-piu::before,.fx-fisarmonica .fx-piu::after{content:"";position:absolute;inset:50% 0 auto 0;height:2px;
  border-radius:2px;background:var(--fx-accent,#1E63C4);transform:translateY(-50%);transition:transform .28s}
.fx-fisarmonica .fx-piu::after{transform:translateY(-50%) rotate(90deg)}
.fx-fisarmonica details[open] .fx-piu::after{transform:translateY(-50%) rotate(0)}
.fx-fisarmonica .fx-corpo{color:inherit;padding:0 clamp(16px,2vw,24px) clamp(20px,2.2vw,26px) calc(54px + clamp(16px,2vw,24px));
  max-width:74ch;font-size:clamp(.92rem,.98vw,1.02rem);opacity:.78}

/* ==== [griglia] ==== 15 · Griglia di schede sfumate */
.fx-griglia{display:grid;grid-template-columns:repeat(var(--fx-griglia-colonne,2),minmax(0,1fr));gap:clamp(14px,1.6vw,22px)}
.fx-griglia-scheda{position:relative;border-radius:calc(var(--fx-raggio,12px) + 4px);padding:clamp(24px,2.6vw,34px);
  color:#fff;overflow:hidden;min-height:var(--fx-griglia-altezza,clamp(210px,20vw,260px));display:flex;flex-direction:column;
  text-decoration:none;transition:transform .3s cubic-bezier(.2,.7,.3,1),box-shadow .3s;
  background:linear-gradient(160deg,var(--fx-g1,#2B7FE0),var(--fx-g2,#0B3A82))}
.fx-griglia-scheda::after{content:"";position:absolute;inset:0;
  background:radial-gradient(120% 80% at 15% 0%,rgba(255,255,255,.17),transparent 55%)}
.fx-griglia-scheda>*{position:relative;z-index:1}
.fx-griglia-scheda:hover{transform:translateY(-5px);box-shadow:0 30px 54px -32px rgba(13,21,36,.62)}
.fx-griglia-scheda .fx-testa{display:flex;justify-content:space-between;align-items:flex-start;gap:14px}
.fx-griglia-scheda .fx-num{font-weight:800;font-size:clamp(2.2rem,3.4vw,3rem);line-height:1;color:rgba(255,255,255,.24);letter-spacing:-.05em}
.fx-griglia-scheda b{color:inherit;display:block;font-weight:600;font-size:clamp(1.15rem,1.7vw,1.45rem);margin-top:auto;padding-top:22px;line-height:1.18}
.fx-griglia-scheda p{margin:.6em 0 0;font-size:.94rem;color:rgba(255,255,255,.87);max-width:42ch}

/* ==== [percorso] ==== 16 · Percorso a tappe */
.fx-percorso-linea{position:relative;height:2px;background:var(--fx-bordo,rgba(13,21,36,.10));margin:0 0 clamp(26px,3vw,38px)}
.fx-scuro .fx-percorso-linea{background:rgba(255,255,255,.14)}
.fx-percorso-linea i{position:absolute;inset:0 auto 0 0;width:0;
  background:linear-gradient(90deg,var(--fx-accent,#1E63C4),var(--fx-accent-2,#E02328));
  transition:width 1.5s cubic-bezier(.3,.8,.3,1)}
.fx-percorso.fx-vista .fx-percorso-linea i{width:100%}
.fx-percorso-tappe{display:grid;grid-template-columns:repeat(var(--fx-percorso-colonne,4),minmax(0,1fr));gap:clamp(14px,2vw,30px)}
.fx-tappa{position:relative;opacity:0;transform:translateY(16px);transition:opacity .55s,transform .55s}
.fx-percorso.fx-vista .fx-tappa{opacity:1;transform:none}
.fx-percorso.fx-vista .fx-tappa:nth-child(2){transition-delay:.13s}
.fx-percorso.fx-vista .fx-tappa:nth-child(3){transition-delay:.26s}
.fx-percorso.fx-vista .fx-tappa:nth-child(4){transition-delay:.39s}
.fx-percorso.fx-vista .fx-tappa:nth-child(5){transition-delay:.52s}
.fx-tappa::before{content:"";position:absolute;top:calc(-1 * clamp(26px,3vw,38px) - 7px);left:0;width:13px;height:13px;
  border-radius:50%;background:var(--fx-paper,#FBFCFE);border:2px solid var(--fx-accent,#1E63C4)}
.fx-scuro .fx-tappa::before{background:var(--fx-ink,#0D1524)}
.fx-tappa:last-child::before{border-color:var(--fx-accent-2,#E02328)}
.fx-tappa .fx-n{font-weight:600;font-size:.82rem;letter-spacing:.14em;color:var(--fx-accent,#1E63C4)}
.fx-tappa:last-child .fx-n{color:var(--fx-accent-2,#E02328)}
.fx-tappa b{color:inherit;display:block;font-weight:600;font-size:clamp(1.05rem,1.5vw,1.3rem);margin:.5em 0 0;line-height:1.2}
.fx-tappa p{color:inherit;margin:.6em 0 0;font-size:.92rem;opacity:.75}

/* ==== [lista] ==== 17 · Lista a numeri grandi */
.fx-lista{border-top:1px solid var(--fx-bordo,rgba(13,21,36,.10))}
.fx-scuro .fx-lista,.fx-scuro .fx-lista-riga{border-color:rgba(255,255,255,.14)}
.fx-lista-riga{display:grid;grid-template-columns:clamp(96px,11vw,168px) minmax(0,1fr) auto;gap:clamp(18px,3vw,44px);
  align-items:center;padding:clamp(22px,2.6vw,34px) 0;border-bottom:1px solid var(--fx-bordo,rgba(13,21,36,.10));
  transition:background .25s;text-decoration:none;color:inherit}
.fx-lista-riga:hover{background:color-mix(in srgb,var(--fx-accent,#1E63C4) 4%,transparent)}
.fx-lista-riga .fx-num{font-weight:800;font-size:clamp(2.6rem,6vw,4.6rem);line-height:.9;letter-spacing:-.06em;
  color:#DCE3EE;transition:color .25s}
.fx-scuro .fx-lista-riga .fx-num{color:rgba(255,255,255,.18)}
.fx-lista-riga:hover .fx-num{color:transparent;
  background-image:linear-gradient(140deg,var(--fx-accent,#1E63C4),var(--fx-accent-2,#E02328));
  -webkit-background-clip:text;background-clip:text}
.fx-lista-riga b{color:inherit;display:block;font-weight:600;font-size:clamp(1.15rem,1.9vw,1.6rem);line-height:1.16}
.fx-lista-riga p{color:inherit;margin:.55em 0 0;opacity:.75;font-size:clamp(.92rem,.98vw,1.02rem);max-width:62ch}

/* ---- telefono, effetti 13-17 ---- */
@media (max-width:900px){
  .fx-indice-griglia{grid-template-columns:1fr;gap:26px}
  .fx-indice-schede{min-height:var(--fx-indice-altezza-mobile,clamp(320px,74vw,390px))}
  .fx-griglia{grid-template-columns:1fr}
  .fx-percorso-tappe{grid-template-columns:1fr;gap:26px}
  .fx-percorso-linea{display:none}
  .fx-tappa::before{display:none}
  .fx-tappa{border-left:2px solid var(--fx-bordo,rgba(13,21,36,.10));padding-left:18px}
  .fx-tappa:last-child{border-left-color:var(--fx-accent-2,#E02328)}
  .fx-lista-riga{grid-template-columns:clamp(70px,20vw,96px) 1fr;row-gap:10px}
}
/* chi ha "riduci movimento" vede tutto fermo e completo */
.fx-statico .fx-percorso .fx-tappa{opacity:1;transform:none}
.fx-statico .fx-percorso .fx-percorso-linea i{width:100%}
.fx-statico .fx-indice-scheda{position:static;opacity:1;visibility:visible;transform:none;margin-bottom:10px}
.fx-statico .fx-indice-schede{min-height:0}
.fx-statico .fx-indice-voci{display:none}
