/* ============================================================
   PROGETTO E CALCOLO — foglio di stile della collana
   Base: andrealucioposteraro.it/pubblicazioni.html (stessi token,
   stessa tipografia). Le aggiunte per il sito della collana sono
   in fondo, dopo «COMPONENTI DEL SITO DELLA COLLANA».
============================================================ */
:root{
  --testo2:#3A3B40;
  --bianco:#FFFFFF; --fondo:#FAFAF8; --nero:#111214;
  --grigio:#6E7076; --grigio-chiaro:#A9ABB2;
  --accento:#1E3A5F; --linea:#E4E4E0; --maxw:1160px;
  --arancio:#B85A20; --arancio-scuro:#994917;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'Inter',system-ui,sans-serif;background:var(--bianco);color:var(--nero);line-height:1.7;font-size:16px;-webkit-font-smoothing:antialiased;overflow-x:hidden}
::selection{background:var(--accento);color:#fff}
a{color:inherit}
img{max-width:100%;display:block}
a:focus-visible,button:focus-visible{outline:2px solid var(--accento);outline-offset:3px}

.wrap{max-width:var(--maxw);margin:0 auto;padding:0 32px}
.label{font-size:.72rem;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--grigio)}
h1{font-family:'Inter Tight',sans-serif;font-weight:500;font-size:clamp(2rem,4.6vw,3.3rem);letter-spacing:-.035em;line-height:1.05}
h2{font-family:'Inter Tight',sans-serif;font-weight:500;font-size:clamp(1.35rem,2.6vw,1.9rem);letter-spacing:-.025em;line-height:1.2}

.fade{opacity:0;transform:translateY(22px);transition:opacity .8s cubic-bezier(.22,.61,.36,1),transform .8s cubic-bezier(.22,.61,.36,1)}
.fade.visible{opacity:1;transform:none}
.d1{transition-delay:.07s}.d2{transition-delay:.14s}.d3{transition-delay:.21s}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .fade{opacity:1;transform:none;transition:none}
  h1 .w>span{transform:none!important;animation:none!important}
  .foto img{clip-path:none!important;transform:none!important}
}
#progress{position:fixed;top:0;left:0;height:2px;background:var(--accento);width:0;z-index:70}

/* ---------- NAV ---------- */
header{position:fixed;top:0;left:0;right:0;z-index:60;background:rgba(255,255,255,.88);backdrop-filter:blur(14px);border-bottom:1px solid var(--linea)}
.nav{display:flex;align-items:center;justify-content:space-between;height:68px}
.logo{font-family:'Inter Tight',sans-serif;font-weight:600;font-size:.95rem;letter-spacing:-.01em;text-decoration:none}
#mainnav ul{display:flex;gap:36px;list-style:none;align-items:center}
#mainnav a{text-decoration:none;font-size:.88rem;color:var(--grigio);transition:color .2s ease}
#mainnav a:hover,#mainnav a.attivo{color:var(--nero)}
.menu-btn{display:none;background:none;border:none;font-size:.8rem;font-weight:500;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;color:var(--nero);padding:8px 0}
@media(max-width:860px){
  .menu-btn{display:block}
  #mainnav{position:absolute;top:68px;left:0;right:0;background:var(--bianco);border-bottom:1px solid var(--linea);display:none}
  #mainnav.open{display:block}
  #mainnav ul{flex-direction:column;gap:0;padding:8px 32px 20px;align-items:stretch}
  #mainnav a{display:block;padding:13px 0;border-bottom:1px solid var(--linea);font-size:.95rem}
  #mainnav li:last-child a{border-bottom:none}
}

/* ---------- HERO CON FOTO ---------- */
.hero{padding:150px 0 70px}
.hero-grid{display:grid;grid-template-columns:1fr 300px;gap:64px;align-items:center}
@media(max-width:900px){.hero-grid{grid-template-columns:1fr;gap:40px}.foto{max-width:230px}}
.hero .label{display:block;margin-bottom:22px}
h1 .w{display:inline-block;overflow:hidden;vertical-align:top;
      padding-bottom:.18em;margin-bottom:-.18em}   /* spazio per g, p, q */
h1 .w>span{display:inline-block;transform:translateY(115%);animation:su .85s cubic-bezier(.22,.61,.36,1) forwards;animation-delay:calc(.15s + var(--i)*.07s)}
@keyframes su{to{transform:translateY(0)}}
.ruolo{font-size:1.05rem;color:var(--accento);font-weight:500;margin-top:18px}
.sommario{font-size:1.02rem;color:var(--grigio);max-width:56ch;margin-top:20px}
.contatti-riga{display:flex;gap:26px;flex-wrap:wrap;margin-top:30px;padding-top:22px;border-top:1px solid var(--linea);font-size:.89rem}
.contatti-riga a{color:var(--grigio);text-decoration:none;transition:color .2s}
.contatti-riga a:hover{color:var(--accento)}

/* ---------- NUMERI ---------- */
.stats{margin-top:56px;padding-top:30px;border-top:1px solid var(--linea);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:30px 36px}
@media(max-width:820px){.stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:26px 24px}}
.stat .n{font-family:'Inter Tight',sans-serif;font-weight:500;font-size:clamp(1.6rem,3vw,2.2rem);letter-spacing:-.02em;font-variant-numeric:tabular-nums;line-height:1.1}
.stat .n small{font-size:.5em;color:var(--grigio)}
.stat .t{font-size:.8rem;color:var(--grigio);margin-top:2px}
/* sottile barra che si riempie: dà misura visiva al numero */
.stat .riemp{display:block;height:2px;background:var(--linea);margin-top:12px;position:relative;overflow:hidden;border-radius:2px}
.stat .riemp::after{
  content:"";position:absolute;inset:0 auto 0 0;width:0;background:var(--accento);
  transition:width 1.4s cubic-bezier(.22,.61,.36,1);
}
.stat.visto .riemp::after{width:var(--w)}
@media(prefers-reduced-motion:reduce){.stat .riemp::after{transition:none}}

/* ---------- SEZIONI ---------- */
.sezione{padding:86px 0}
.sezione.grigia{background:var(--fondo);border-top:1px solid var(--linea);border-bottom:1px solid var(--linea)}
.sez-head{display:flex;align-items:baseline;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-bottom:44px}
.sez-head .label{display:block;margin-bottom:10px}
.sez-num{font-size:.78rem;color:var(--grigio-chiaro);font-variant-numeric:tabular-nums}

/* righe CV */
.riga{display:grid;grid-template-columns:170px 1fr;gap:40px;padding:26px 0;border-top:1px solid var(--linea);transition:padding-left .3s ease}
.riga:hover{padding-left:8px}
@media(max-width:680px){.riga{grid-template-columns:1fr;gap:6px;padding:22px 0}.riga:hover{padding-left:0}}
.riga .periodo{font-size:.85rem;color:var(--grigio);padding-top:3px}
.riga h3{font-family:'Inter Tight',sans-serif;font-weight:500;font-size:1.08rem;letter-spacing:-.01em;margin-bottom:3px}
.riga .ente{font-size:.88rem;color:var(--accento);font-weight:500;margin-bottom:8px}
.riga p{font-size:.95rem;color:var(--testo2);max-width:66ch}
.riga ul{list-style:none;margin-top:8px}
.riga li{font-size:.93rem;color:var(--testo2);padding-left:16px;position:relative}
.riga li::before{content:"";position:absolute;left:0;top:.78em;width:5px;height:1px;background:var(--grigio-chiaro)}
.riga .isbn{font-size:.8rem;color:var(--grigio-chiaro);margin-top:6px}
.libro{
  display:inline-flex;align-items:center;gap:8px;margin-top:12px;
  font-size:.83rem;font-weight:500;text-decoration:none;color:var(--nero);
  border:1px solid var(--linea);border-radius:2px;padding:9px 16px;
  transition:background .2s,color .2s,border-color .2s;
}
.libro:hover{background:var(--accento);border-color:var(--accento);color:#fff}
.acquisto{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}
.acquisto .libro{margin-top:0}
.acquisto .libro.pieno{background:var(--nero);border-color:var(--nero);color:#fff}
.acquisto .libro.pieno:hover{background:var(--accento);border-color:var(--accento)}
/* ---------- DOWNLOAD ---------- */
.download{
  margin:80px 0 30px;padding:36px 40px;border:1px solid var(--linea);border-radius:2px;
  display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;
}
.download h3{font-family:'Inter Tight',sans-serif;font-weight:500;font-size:1.15rem;letter-spacing:-.01em;margin-bottom:4px}
.download p{font-size:.9rem;color:var(--grigio)}
.btn{
  font-size:.88rem;font-weight:500;text-decoration:none;padding:13px 26px;border-radius:2px;
  border:1px solid var(--nero);color:var(--nero);background:transparent;display:inline-block;
  transition:background .2s,color .2s,border-color .2s;
}
.btn:hover{background:var(--nero);color:#fff}
.btn.primary{background:var(--nero);color:#fff}
.btn.primary:hover{background:var(--accento);border-color:var(--accento)}

.nota-privacy{font-size:.78rem;color:var(--grigio-chiaro);border-top:1px solid var(--linea);padding-top:22px;margin-bottom:40px}
footer{padding:32px 0;border-top:1px solid var(--linea)}
.foot{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:.8rem;color:var(--grigio-chiaro)}
.foot a{text-decoration:none;transition:color .2s}
.foot a:hover{color:var(--nero)}

/* ---------- selettore lingua ---------- */
.lang{display:inline-flex;align-items:center;border:1px solid var(--linea);border-radius:2px;overflow:hidden;margin-left:20px;flex-shrink:0}
.lang-btn{
  font-family:inherit;font-size:.72rem;font-weight:500;letter-spacing:.08em;
  padding:6px 11px;border:none;background:transparent;color:var(--grigio);cursor:pointer;
  transition:background .2s ease,color .2s ease;line-height:1.4;
}
.lang-btn:hover{color:var(--nero)}
.lang-btn.on{background:var(--nero);color:#fff}
@media(max-width:800px){
  .lang{margin:0 0 0 auto;margin-right:14px}
}

/* ============================================================
   TEMA SCURO — attivo nella versione inglese
   Le variabili vengono ribaltate: tutto il sito si adatta,
   perche' ogni colore fa riferimento a queste sei voci.
============================================================ */
html.scuro{
  --testo2:#C9CBD2;
  --bianco:#0E1014;
  --fondo:#161A21;
  --nero:#F3F3EF;
  --grigio:#9DA0A9;
  --grigio-chiaro:#82858E;
  --accento:#8FB0E8;
  --linea:#272C36;
}
html.scuro body{background:var(--bianco);color:var(--nero)}
body,header,nav,section,footer,.cert,.download,.cv-download,.reveal-img,.btn,.tag-row span,.filtro,.sw-tab{
  transition:background-color .45s ease,color .45s ease,border-color .45s ease;
}
@media(prefers-reduced-motion:reduce){
  body,header,nav,section,footer,.cert,.download,.cv-download,.reveal-img,.btn,.tag-row span,.filtro,.sw-tab{transition:none}
}
html.scuro header{background:rgba(14,16,20,.88)}
html.scuro #mainnav{background:var(--bianco)}
html.scuro .testo p,
html.scuro .riga p,
html.scuro .riga li,
html.scuro .p-desc,
html.scuro .project-body p,
html.scuro .cert p,
html.scuro .sw .nome b,
html.scuro .tag-row span{color:#C9CBD2}
html.scuro .tag-row span,
html.scuro .cert,
html.scuro .sw-tab,
html.scuro .filtro,
html.scuro .lang{background:transparent}
html.scuro .cert{background:var(--fondo)}
html.scuro .cert:hover{box-shadow:0 16px 32px rgba(0,0,0,.35);border-color:#39404D}
html.scuro .btn{color:var(--nero);border-color:var(--nero)}
html.scuro .btn:hover{background:var(--nero);color:var(--bianco)}
html.scuro .btn.primary{background:var(--nero);color:var(--bianco)}
html.scuro .btn.primary:hover{background:var(--accento);border-color:var(--accento);color:#0E1014}
html.scuro .filtro.active,
html.scuro .sw-tab.active,
html.scuro .lang-btn.on{background:var(--nero);color:var(--bianco)}
html.scuro .download,
html.scuro .cv-download{background:var(--fondo)}
html.scuro .drive,
html.scuro .acquisto .libro.pieno{background:var(--nero);border-color:var(--nero);color:var(--bianco)}
html.scuro .libro,
html.scuro .project-body .drive{color:var(--nero);border-color:var(--linea)}
html.scuro .drive:hover,
html.scuro .libro:hover,
html.scuro .project-body .drive:hover{background:var(--accento);border-color:var(--accento);color:#0E1014}
html.scuro .reveal-img,
html.scuro .card,
html.scuro .project::before{background:var(--fondo)}
html.scuro .reveal-img.disegno{background:#EFEFEA}   /* i disegni tecnici restano su fondo chiaro */
html.scuro .gal img,
html.scuro .reveal-img>img{filter:brightness(.94) contrast(1.02)}
html.scuro .reveal-img.disegno>img{filter:none}
html.scuro .video-tile{background:#000}
html.scuro .project:hover>*{color:var(--bianco)}
html.scuro .foto .cornice{background:transparent}
html.scuro .barra,
html.scuro .punti i{background:var(--linea)}
html.scuro .punti i.on,
html.scuro .barra i{background:var(--accento)}
html.scuro #lightbox{background:rgba(6,7,9,.97)}
html.scuro .hero .bg-grid{opacity:.55}
/* ---------- SCHEDE DEI VOLUMI ---------- */
.volume{
  display:grid;grid-template-columns:150px 1fr;gap:44px;align-items:start;
  padding:52px 0;border-top:1px solid var(--linea);
}
.volume:first-of-type{border-top:none;padding-top:16px}
@media(max-width:820px){.volume{grid-template-columns:1fr;gap:20px;padding:36px 0}}
.vol-num{
  font-family:'Inter Tight',sans-serif;font-weight:500;
  font-size:clamp(2.4rem,5vw,3.4rem);letter-spacing:-.03em;line-height:1;
  color:var(--linea);
}
.vol-num small{display:block;font-size:.24em;letter-spacing:.16em;color:var(--grigio);margin-top:8px}
.volume h2{font-size:clamp(1.4rem,2.6vw,1.9rem);margin-bottom:6px}
.volume .ed{font-size:.9rem;color:var(--accento);font-weight:500;margin-bottom:16px}
.volume .desc{font-size:1rem;color:var(--testo2);max-width:66ch}
.volume .dettagli{margin-top:22px;border-top:1px solid var(--linea);max-width:520px}
.volume .dettagli div{display:flex;justify-content:space-between;gap:16px;padding:9px 0;border-bottom:1px solid var(--linea);font-size:.85rem}
.volume .dettagli dt{color:var(--grigio)}
.volume .dettagli dd{text-align:right;font-weight:500}
.dentro{margin-top:22px}
.dentro .label{display:block;margin-bottom:10px}
.dentro ul{list-style:none}
.dentro li{font-size:.94rem;color:var(--testo2);padding-left:16px;position:relative;margin-bottom:3px}
.dentro li::before{content:"";position:absolute;left:0;top:.78em;width:6px;height:1px;background:var(--grigio-chiaro)}

/* ---------- LIBRERIA CON SFOGLIO ----------
   I volumi stanno in fila con il dorso in vista. Uno alla volta
   esce di lato, si apre, sfoglia dieci pagine, si richiude sulla
   copertina e torna al suo posto.
------------------------------------------------- */
.vetrina{
  position:relative;margin:56px 0 10px;padding:30px 0 64px;
  perspective:2400px;perspective-origin:50% 42%;
}
.vetrina .scaffale{
  display:flex;justify-content:flex-start;align-items:flex-start;gap:16px;
  padding:30px 0 0;transform-style:preserve-3d;
}
/* ----- i dorsi in fila ----- */
.vetrina .dorso{
  position:relative;width:var(--dorso);height:500px;flex-shrink:0;
  background:#16222E;cursor:pointer;border:0;padding:0;
  box-shadow:0 12px 26px rgba(17,18,20,.28);
  transition:transform .7s cubic-bezier(.3,.7,.3,1), opacity .5s ease, margin .7s cubic-bezier(.3,.7,.3,1), filter .4s ease;
  opacity:0;animation:entra .7s ease forwards;
  animation-delay:calc(.2s + var(--i) * .12s);
}
@keyframes entra{to{opacity:1}}
.vetrina .dorso img{width:100%;height:100%;display:block;object-fit:contain}
.vetrina .dorso:hover{transform:translateY(-14px)}
.vetrina .scaffale:hover .dorso:not(:hover){filter:brightness(.86)}
/* il volume estratto lascia il suo posto vuoto */
.vetrina .dorso.fuori{opacity:0;visibility:hidden;pointer-events:none}
/* i dorsi non si spostano: resta solo il vuoto del volume estratto */

/* ----- il libro aperto a doppia pagina, di fianco allo scaffale ----- */
.vetrina .libro{
  position:absolute;top:30px;right:0;
  width:700px;height:500px;right:0;
  transform-style:preserve-3d;pointer-events:none;
  opacity:0;transform:translateX(-46px) scale(.94);
  transition:opacity .5s ease, transform .7s cubic-bezier(.22,.61,.36,1);
  z-index:6;
}
.vetrina .libro.attivo{opacity:1;transform:none}
/* da chiuso: si vede la sola copertina, centrata sul posto */
.vetrina .libro.chiuso{transform:none}
.vetrina .libro.attivo.chiuso{transform:none}

/* le due metà del libro */
.vetrina .meta{
  position:absolute;top:0;width:350px;height:100%;
  background:transparent center/contain no-repeat;
  transition:opacity .3s ease, background-color .3s ease;
}
/* il fondo bianco compare solo quando c'e' davvero una pagina */
.vetrina .meta[style*="url"]{background-color:#fff}
.vetrina .meta.sinistra{left:0;box-shadow:inset -14px 0 22px -14px rgba(17,18,20,.45)}
.vetrina .meta.destra{left:350px;box-shadow:inset 14px 0 22px -14px rgba(17,18,20,.45),
                                            0 22px 44px rgba(17,18,20,.28)}
/* a libro chiuso: a sinistra la quarta, a destra la copertina */
/* una meta' senza pagina non deve lasciare un rettangolo colorato */
.vetrina .meta:not([style*="url"]){background-color:transparent;box-shadow:none}
.vetrina .libro.chiuso .meta.destra{box-shadow:0 22px 44px rgba(17,18,20,.30)}
.vetrina .libro.chiuso .meta.sinistra{box-shadow:0 22px 44px rgba(17,18,20,.30)}
.vetrina .libro.chiuso::after{opacity:0}

/* il foglio che si volta: due facce, come una pagina vera */
.vetrina .foglio{
  position:absolute;top:0;left:350px;width:350px;height:100%;
  transform-style:preserve-3d;transform-origin:left center;
  animation:volta 1.25s cubic-bezier(.36,.05,.28,1) forwards;
  will-change:transform;
  z-index:4;
}
@keyframes volta{
  0%  {transform:rotateY(0deg)      translateZ(0)}
  50% {transform:rotateY(-90deg)    translateZ(24px)}
  100%{transform:rotateY(-180deg)   translateZ(0)}
}
.vetrina .foglio .faccia{
  position:absolute;inset:0;backface-visibility:hidden;
  background:#fff center/contain no-repeat;
}
.vetrina .foglio .retro{transform:rotateY(180deg)}
/* ombra che scorre sulla pagina mentre gira */
.vetrina .foglio .faccia::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(90deg, rgba(17,18,20,.30), transparent 60%);
  animation:velo 1.25s ease-in-out forwards;
}
@keyframes velo{0%{opacity:0}20%{opacity:.5}50%{opacity:.9}80%{opacity:.4}100%{opacity:0}}

/* il libro accetta il tocco quando e' aperto */
.vetrina .libro.attivo{pointer-events:auto;cursor:pointer}
/* frecce per voltare a mano */
.vetrina .freccia{
  position:absolute;top:50%;transform:translateY(-50%);
  width:38px;height:38px;border-radius:50%;border:1px solid var(--linea);
  background:var(--bianco);color:var(--nero);font-size:1.1rem;line-height:1;
  display:flex;align-items:center;justify-content:center;cursor:pointer;
  opacity:0;transition:opacity .3s ease,background .2s ease,color .2s ease,border-color .2s ease;
  z-index:8;padding:0;
}
.vetrina .libro:hover .freccia,
.vetrina.manuale .freccia{opacity:1}
.vetrina .freccia:hover:not(:disabled){background:var(--accento);border-color:var(--accento);color:#fff}
.vetrina .freccia:disabled{opacity:.25;cursor:default}

/* i comandi: sul largo ai lati del libro, sul telefono sotto */
.vetrina .comandi{
  position:absolute;top:30px;right:0;width:700px;height:500px;
  pointer-events:none;z-index:8;
}
.vetrina .comandi .freccia{pointer-events:auto}
.vetrina .freccia{position:absolute;top:50%;transform:translateY(-50%)}
.vetrina .freccia.prec{left:-56px}
.vetrina .freccia.succ{right:-56px}
/* voltata all'indietro: il foglio rientra da sinistra */
.vetrina .foglio.indietro{
  left:0;transform-origin:right center;
  animation:voltaIndietro 1.25s cubic-bezier(.36,.05,.28,1) forwards;
  will-change:transform;
}
@keyframes voltaIndietro{
  0%  {transform:rotateY(0deg)     translateZ(0)}
  50% {transform:rotateY(90deg)    translateZ(24px)}
  100%{transform:rotateY(180deg)   translateZ(0)}
}

/* volume fissato con il clic: resta aperto e comandabile */
.vetrina.manuale .libro{box-shadow:none}
.vetrina.manuale .freccia{opacity:1}
.vetrina.manuale .dorso{cursor:pointer}
.vetrina.manuale .invito{opacity:0}
/* la piega centrale */
.vetrina .libro::after{
  content:"";position:absolute;left:349px;top:0;width:2px;height:100%;
  background:linear-gradient(90deg, rgba(17,18,20,.18), rgba(17,18,20,.06));
  z-index:5;pointer-events:none;opacity:0;transition:opacity .4s ease;
}
.vetrina .libro.attivo:not(.chiuso)::after{opacity:1}

/* contatore delle pagine */
.vetrina .conta{
  position:absolute;right:0;width:700px;text-align:center;
  bottom:8px;font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--grigio-chiaro);opacity:0;transition:opacity .4s ease;
}
.vetrina .conta.attivo{opacity:1}
.vetrina .titolo-corrente{
  position:absolute;right:0;width:700px;top:calc(100% - 52px);text-align:center;
  font-size:.7rem;letter-spacing:.15em;text-transform:uppercase;color:var(--accento);
  opacity:0;transition:opacity .4s ease;
}
.vetrina .titolo-corrente.attivo{opacity:1}
/* nessun ripiano: ogni volume sta per conto suo */
.vetrina .invito{
  position:absolute;left:0;width:24%;bottom:-38px;text-align:center;
  font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--grigio-chiaro);
  transition:opacity .4s ease;pointer-events:none;
}
.vetrina.in-lettura .invito{opacity:0}
.vetrina .dorso .mini{display:none!important}

/* ============ SCHERMI STRETTI ============
   Impaginazione verticale: una pagina per volta, grande e centrata,
   i comandi sotto e la fila delle copertine in fondo.
   Niente rotazioni: sui telefoni scattano, si usa una dissolvenza.
========================================== */
@media(max-width:900px){
  .vetrina{
    position:relative;display:block;
    padding:10px 0 0;margin:34px 0 0;
    perspective:none;text-align:center;overflow:visible;
  }

  /* titolo e contatore, sopra */
  .vetrina .titolo-corrente,
  .vetrina .conta{
    position:static!important;display:block;width:auto;max-width:none;
    right:auto;left:auto;top:auto;bottom:auto;
    transform:none!important;opacity:1!important;text-align:center;margin:0 auto;
  }
  .vetrina .titolo-corrente{color:var(--accento);margin-bottom:3px}
  .vetrina .conta{margin-bottom:14px}

  /* il libro: una pagina sola, centrata */
  .vetrina .libro{
    position:relative!important;top:auto!important;right:auto!important;left:auto!important;
    width:86vw;max-width:400px;
    height:calc(86vw * 1.428);max-height:571px;
    margin:0 auto;opacity:1!important;transform:none!important;
    transform-style:flat;
  }
  .vetrina .libro::after{display:none}
  .vetrina .meta{
    position:absolute;top:0;left:0!important;width:100%!important;height:100%;
    background-position:center;background-size:contain;background-repeat:no-repeat;
    background-color:transparent;box-shadow:none;
  }
  .vetrina .meta.sinistra{display:none!important}
  .vetrina .meta.destra{box-shadow:0 12px 26px rgba(17,18,20,.18)}

  /* la pagina cambia con una dissolvenza, non con una rotazione */
  .vetrina .foglio{
    position:absolute;top:0;left:0!important;width:100%!important;height:100%;
    transform:none!important;transform-style:flat;
    animation:sfuma .42s ease forwards!important;
  }
  .vetrina .foglio .retro{display:none}
  .vetrina .foglio .faccia{
    background-position:center;background-size:contain;background-repeat:no-repeat;
    animation:none!important;
  }
  .vetrina .foglio .faccia::after{display:none}
  @keyframes sfuma{from{opacity:1}to{opacity:0}}

  /* i comandi, sotto il libro */
  .vetrina .comandi{
    position:static!important;top:auto;right:auto;width:auto!important;height:auto!important;
    display:flex;justify-content:center;align-items:center;gap:30px;
    margin:16px auto 0;pointer-events:auto;
  }
  .vetrina .freccia{
    position:static!important;transform:none!important;left:auto;right:auto;top:auto;
    opacity:1!important;width:46px;height:46px;flex-shrink:0;
  }

  /* la fila delle copertine da cui scegliere */
  .vetrina .scaffale{
    display:grid!important;grid-template-columns:repeat(4,1fr);gap:10px;
    min-height:0;padding:22px 0 0;margin:0;transform:none!important;
    justify-content:stretch;align-items:start;
  }
  .vetrina .dorso{
    position:relative;width:100%!important;height:auto!important;
    background:none;border:0;padding:0;margin:0!important;
    opacity:1!important;visibility:visible!important;animation:none!important;
    transform:none!important;filter:none!important;
    box-shadow:0 6px 14px rgba(17,18,20,.16);
    outline:2px solid transparent;outline-offset:2px;
    transition:outline-color .3s ease, box-shadow .3s ease;
  }
  .vetrina .dorso img:not(.mini){display:none!important}
  .vetrina .dorso .mini{display:block!important;width:100%;height:auto}
  .vetrina .dorso.fuori{outline-color:var(--accento);box-shadow:0 10px 22px rgba(30,58,95,.26)}

  .vetrina .invito{
    position:static!important;width:auto;left:auto;bottom:auto;
    display:block;text-align:center;margin:22px auto 0;opacity:1!important;line-height:1.6;
  }
}
@media(max-width:420px){
  .vetrina .freccia{width:42px;height:42px}
  .vetrina .scaffale{gap:7px}
}

@media(prefers-reduced-motion:reduce){
  .vetrina .dorso{opacity:1;animation:none}
  .vetrina .libro .foglio.gira{animation-duration:.01s}
}

/* copertina dentro la scheda del volume */
.volume .vol-cop{display:block;margin-top:18px;width:100%;max-width:150px}
.volume .vol-cop img{width:100%;display:block;border:1px solid var(--linea);box-shadow:0 10px 24px rgba(17,18,20,.12)}
@media(max-width:820px){.volume .vol-cop{max-width:120px;margin-top:10px}}


/* pulsante della libreria dei prompt: arancio del volume 2 */
.libro.prompt{
  background:var(--arancio);border-color:var(--arancio);color:#fff;
}
.libro.prompt:hover{background:var(--arancio-scuro);border-color:var(--arancio-scuro);color:#fff}
.libro.prompt::before{
  content:"";width:7px;height:7px;border-radius:50%;background:#fff;
  opacity:.85;flex-shrink:0;
}
html.scuro .libro.prompt{
  background:var(--arancio);border-color:var(--arancio);color:#fff;
}

/* ---------- edizione in un'altra lingua ---------- */
.altra-edizione{
  margin-top:26px;padding-top:22px;border-top:1px solid var(--linea);
  display:grid;grid-template-columns:104px 1fr;gap:22px;align-items:start;
}
@media(max-width:820px){.altra-edizione{grid-template-columns:84px 1fr;gap:16px}}
.libro.attesa{
  color:var(--grigio-chiaro);border-color:var(--linea);border-style:dashed;
  cursor:default;pointer-events:none;
}
.libro.attesa small{font-size:.72em;letter-spacing:.1em;text-transform:uppercase;margin-left:2px}
.altra-edizione img{width:100%;display:block;box-shadow:0 8px 18px rgba(17,18,20,.16)}
.altra-edizione .lingua{
  display:inline-flex;align-items:center;gap:8px;margin-bottom:6px;
  font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--grigio);
}
.altra-edizione .lingua b{
  font-size:.64rem;letter-spacing:.1em;font-weight:600;color:#fff;background:var(--nero);
  border-radius:2px;padding:3px 7px;
}
.altra-edizione h3{
  font-family:'Inter Tight',sans-serif;font-weight:500;font-size:1.12rem;
  letter-spacing:-.01em;margin-bottom:2px;
}
.altra-edizione .sotto{font-style:italic;color:var(--grigio);font-size:.92rem;margin-bottom:10px}
.altra-edizione p{font-size:.94rem;color:var(--testo2);max-width:58ch}
html.scuro .altra-edizione .lingua b{background:var(--nero);color:var(--bianco)}
.in-uscita{
  display:inline-block;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;
  color:var(--accento);border:1px solid var(--accento);border-radius:2px;padding:4px 10px;margin-bottom:12px;
}

/* ============================================================
   COMPONENTI DEL SITO DELLA COLLANA
============================================================ */

/* logo a due righe: collana + editore */
.logo{display:flex;flex-direction:column;line-height:1.15}
.logo small{font-family:'Inter',sans-serif;font-weight:500;font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;color:var(--grigio)}

/* briciole (pagine interne) */
.briciole{font-size:.78rem;color:var(--grigio-chiaro);margin-bottom:22px;display:flex;gap:8px;flex-wrap:wrap}
.briciole a{text-decoration:none;color:var(--grigio);transition:color .2s}
.briciole a:hover{color:var(--accento)}

/* intestazione delle pagine interne, più bassa della home */
.hero.interna{padding:140px 0 30px}
.hero.interna .sommario{max-width:64ch}

/* ---------- griglia dei volumi (home e catalogo) ---------- */
.griglia-volumi{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:28px 22px}
@media(max-width:1000px){.griglia-volumi{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:600px){.griglia-volumi{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 14px}}
.scheda{display:flex;flex-direction:column;gap:6px;text-decoration:none;color:inherit}
.scheda .cop{aspect-ratio:178/254;background:var(--fondo);border:1px solid var(--linea);overflow:hidden;
  box-shadow:0 10px 24px rgba(17,18,20,.10);transition:transform .35s cubic-bezier(.22,.61,.36,1),box-shadow .35s ease}
.scheda .cop img{width:100%;height:100%;object-fit:cover}
.scheda:hover .cop{transform:translateY(-6px);box-shadow:0 18px 34px rgba(17,18,20,.16)}
.scheda .num{font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--grigio-chiaro);font-variant-numeric:tabular-nums;margin-top:10px}
.scheda h3{font-family:'Inter Tight',sans-serif;font-weight:500;font-size:1rem;letter-spacing:-.01em;line-height:1.3}
.scheda .ed{font-size:.8rem;color:var(--accento);font-weight:500}
/* volume in preparazione: copertina tratteggiata, niente link */
.scheda.prossimo{pointer-events:none}
.scheda.prossimo .cop{background:transparent;border:1px dashed var(--grigio-chiaro);box-shadow:none;
  display:flex;align-items:center;justify-content:center;text-align:center;padding:18px}
.scheda.prossimo .cop span{font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--grigio)}
.scheda.prossimo h3{color:var(--grigio)}

/* ---------- principi della collana ---------- */
.principi{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:34px 40px}
@media(max-width:860px){.principi{grid-template-columns:1fr;gap:26px}}
.principio{border-top:1px solid var(--linea);padding-top:18px}
.principio h3{font-family:'Inter Tight',sans-serif;font-weight:500;font-size:1.08rem;letter-spacing:-.01em;margin-bottom:6px}
.principio p{font-size:.94rem;color:var(--testo2)}

/* ---------- testo lungo (pagina collana, autori) ---------- */
.testo{max-width:66ch}
.testo p{font-size:1rem;color:var(--testo2);margin-bottom:14px}
.testo h3{font-family:'Inter Tight',sans-serif;font-weight:500;font-size:1.15rem;letter-spacing:-.01em;margin:30px 0 8px}

/* ---------- due colonne: titolo a sinistra, contenuto a destra ---------- */
.due-col{display:grid;grid-template-columns:260px 1fr;gap:48px;align-items:start}
@media(max-width:820px){.due-col{grid-template-columns:1fr;gap:18px}}

/* ---------- indice del volume ---------- */
.indice{list-style:none;counter-reset:cap;border-top:1px solid var(--linea);max-width:720px}
.indice li{counter-increment:cap;display:grid;grid-template-columns:44px 1fr auto;gap:14px;
  padding:12px 0;border-bottom:1px solid var(--linea);font-size:.95rem;color:var(--testo2)}
.indice li::before{content:counter(cap,decimal-leading-zero);color:var(--grigio-chiaro);font-variant-numeric:tabular-nums;font-size:.85rem;padding-top:1px}
.indice li span{color:var(--grigio-chiaro);font-variant-numeric:tabular-nums;font-size:.85rem}

/* ---------- segnaposto: contenuti ancora da scrivere ---------- */
.da-fare{border:1px dashed var(--grigio-chiaro);border-radius:2px;padding:18px 20px;font-size:.88rem;color:var(--grigio);max-width:720px}
.da-fare b{font-weight:500;color:var(--nero)}

/* ---------- come citare ---------- */
.citazione{display:flex;gap:16px;align-items:flex-start;justify-content:space-between;flex-wrap:wrap;
  background:var(--fondo);border:1px solid var(--linea);border-radius:2px;padding:18px 20px;max-width:720px}
.citazione p{font-size:.9rem;color:var(--testo2);flex:1 1 320px}
.citazione button{font-family:inherit;font-size:.78rem;font-weight:500;padding:8px 14px;border-radius:2px;
  border:1px solid var(--linea);background:var(--bianco);color:var(--nero);cursor:pointer;transition:background .2s,color .2s,border-color .2s}
.citazione button:hover{background:var(--accento);border-color:var(--accento);color:#fff}

/* ---------- errata corrige ---------- */
.errata{width:100%;border-collapse:collapse;font-size:.88rem;max-width:720px}
.errata th{text-align:left;font-weight:500;color:var(--grigio);font-size:.75rem;letter-spacing:.1em;text-transform:uppercase;padding:8px 10px 8px 0;border-bottom:1px solid var(--linea)}
.errata td{padding:10px 10px 10px 0;border-bottom:1px solid var(--linea);color:var(--testo2);vertical-align:top}
.errata td:first-child{font-variant-numeric:tabular-nums;white-space:nowrap}
.tabella-scorre{overflow-x:auto}

/* ---------- volume precedente / successivo ---------- */
.naviga-vol{display:grid;grid-template-columns:1fr 1fr;gap:16px;border-top:1px solid var(--linea);padding-top:26px}
.naviga-vol a{text-decoration:none;display:flex;flex-direction:column;gap:2px;padding:4px 0}
.naviga-vol a:last-child{text-align:right}
.naviga-vol small{font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--grigio-chiaro)}
.naviga-vol span{font-family:'Inter Tight',sans-serif;font-weight:500;font-size:1.02rem;transition:color .2s}
.naviga-vol a:hover span{color:var(--accento)}

/* ---------- autore ---------- */
.autore{display:grid;grid-template-columns:120px 1fr;gap:28px;padding:30px 0;border-top:1px solid var(--linea)}
@media(max-width:600px){.autore{grid-template-columns:1fr;gap:12px}}
.autore .ruolo-coll{font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--grigio)}
.autore h3{font-family:'Inter Tight',sans-serif;font-weight:500;font-size:1.2rem;letter-spacing:-.01em;margin:2px 0 6px}
.autore p{font-size:.95rem;color:var(--testo2);max-width:62ch}
.autore .vols{font-size:.85rem;color:var(--accento);font-weight:500;margin-top:8px}
.autore .sigla{width:120px;aspect-ratio:1;border:1px solid var(--linea);display:flex;align-items:center;justify-content:center;
  font-family:'Inter Tight',sans-serif;font-size:1.6rem;font-weight:500;color:var(--grigio-chiaro);letter-spacing:-.02em}
@media(max-width:600px){.autore .sigla{width:72px;font-size:1.1rem}}

/* ---------- elenco puntato con trattino, fuori dalle schede ---------- */
.trattini{list-style:none}
.trattini li{font-size:.95rem;color:var(--testo2);padding-left:16px;position:relative;margin-bottom:5px}
.trattini li::before{content:"";position:absolute;left:0;top:.78em;width:6px;height:1px;background:var(--grigio-chiaro)}

/* ---------- materiali digitali ---------- */
.materiali{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
@media(max-width:700px){.materiali{grid-template-columns:1fr}}
.materiale{border:1px solid var(--linea);border-radius:2px;padding:24px;display:flex;flex-direction:column;gap:8px;text-decoration:none;
  transition:border-color .25s,transform .3s cubic-bezier(.22,.61,.36,1)}
.materiale:hover{border-color:var(--accento);transform:translateY(-3px)}
.materiale .label{color:var(--grigio-chiaro)}
.materiale h3{font-family:'Inter Tight',sans-serif;font-weight:500;font-size:1.08rem;letter-spacing:-.01em}
.materiale p{font-size:.92rem;color:var(--testo2)}
.materiale .vai{margin-top:auto;padding-top:10px;font-size:.83rem;font-weight:500;color:var(--accento)}
.materiale.arancio .vai{color:var(--arancio)}

/* ---------- vetrina con un solo volume (pagina del volume) ---------- */
.vetrina.singolo .invito{display:none}
@media(min-width:901px){.vetrina.singolo{min-height:600px}}

/* titolo del volume nella sua pagina: h1, ma alla scala delle schede */
.volume h1.vol-titolo{font-size:clamp(1.8rem,3.6vw,2.6rem);margin-bottom:6px;text-wrap:balance}
@media(min-width:901px){
  .vetrina.singolo .scaffale{height:0;padding:0;overflow:hidden}
  .vetrina.singolo .libro,.vetrina.singolo .comandi,
  .vetrina.singolo .conta,.vetrina.singolo .titolo-corrente{right:calc(50% - 350px)}
  .vetrina.singolo .titolo-corrente{top:calc(100% - 22px)}
  .vetrina.singolo .conta{bottom:-18px}
}

/* ============================================================
   EFFETTI — colori presi dalle copertine della collana
============================================================ */
:root{ --notte:#111D25; --notte2:#15222C; --tratto:#AFC3DF; --tratto-tenue:rgba(175,195,223,.14); --carta:#F3F1EA }

/* ---------- transizione fra pagine (browser che la supportano) ---------- */


#progress{background:var(--accento)}

/* ---------- intestazione sopra le parti scure ---------- */
header.su-scuro{background:rgba(17,29,37,.55);border-bottom-color:rgba(255,255,255,.08)}
header.su-scuro .logo{color:#fff}
header.su-scuro .logo small{color:rgba(255,255,255,.55)}
header.su-scuro #mainnav a{color:rgba(255,255,255,.62)}
header.su-scuro #mainnav a:hover,header.su-scuro #mainnav a.attivo{color:#fff}
header.su-scuro .menu-btn{color:#fff}
@media(max-width:860px){ header.su-scuro #mainnav{background:var(--notte);border-bottom-color:rgba(255,255,255,.1)}
  header.su-scuro #mainnav a{border-bottom-color:rgba(255,255,255,.08)} }
header{transition:background .4s ease,border-color .4s ease}

/* ---------- LA TAVOLA (intestazione della home) ---------- */
.tavola{position:relative;overflow:hidden;background:var(--notte);color:var(--carta);
  padding:124px 0 0;display:flex;flex-direction:column;cursor:crosshair}
.tavola a,.tavola button{cursor:pointer}
.griglia-tecnica{position:absolute;inset:0;pointer-events:none;
  background-image:
    linear-gradient(rgba(175,195,223,.10) 1px,transparent 1px),
    linear-gradient(90deg,rgba(175,195,223,.10) 1px,transparent 1px),
    linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
  background-size:120px 120px,120px 120px,24px 24px,24px 24px;
  mask-image:radial-gradient(ellipse 80% 70% at 60% 45%,#000 40%,transparent 100%);
  -webkit-mask-image:radial-gradient(ellipse 80% 70% at 60% 45%,#000 40%,transparent 100%)}
.tavola>.wrap{width:100%}
.tavola-grid{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:30px 56px;align-items:end}
@media(max-width:900px){.tavola-grid{grid-template-columns:minmax(0,1fr);gap:34px}.tavola{padding-top:110px}}
.tavola .label{color:var(--tratto);display:block;margin-bottom:22px}
.tavola h1{font-size:clamp(3rem,7.4vw,6.4rem);letter-spacing:-.05em;line-height:.92;color:#fff;text-wrap:balance}
.tavola h1 .w:nth-child(2) span{color:var(--tratto);font-weight:300}
.tavola .sommario{color:rgba(243,241,234,.72);font-size:1.05rem;max-width:46ch;margin-top:0}
.tavola .acquisto{margin-top:30px}
.tavola .libro{color:var(--carta);border-color:rgba(255,255,255,.22)}
.tavola .libro:hover{background:var(--carta);border-color:var(--carta);color:var(--notte)}
.libro.chiaro,.acquisto .libro.chiaro{background:var(--carta);border-color:var(--carta);color:var(--notte)}
.libro.chiaro:hover,.acquisto .libro.chiaro:hover{background:var(--tratto);border-color:var(--tratto);color:var(--notte)}

/* il banco: la trave a tutta larghezza, i volumi come carichi concentrati */
.banco{position:relative;margin-top:44px}
.trave{position:relative;display:block;width:100%;height:auto;margin-top:-3.4%;z-index:0;pointer-events:none;overflow:visible}
.trave .tr{fill:none;stroke:rgba(243,241,234,.5);stroke-width:1.4;stroke-dasharray:1;stroke-dashoffset:1;vector-effect:non-scaling-stroke;
  transition:stroke-dashoffset 1.2s cubic-bezier(.65,0,.35,1);transition-delay:calc(.4s + var(--k)*.03s)}
.trave .tr.fine{stroke-width:1;stroke:rgba(243,241,234,.38)}
.trave .tr.forte{stroke-width:3;stroke:var(--carta)}
.trave .tr.proiez{stroke-width:1;stroke:rgba(175,195,223,.45);stroke-dasharray:1;}
.trave .tr.mom{stroke:var(--tratto);stroke-width:2;transition-duration:1.8s}
.trave .tr.tratteggio{stroke:var(--tratto);stroke-width:1;opacity:.4}
.trave .area{fill:rgba(175,195,223,.07);opacity:0;transition:opacity 1s ease 1.6s}
.trave.disegna .tr{stroke-dashoffset:0}
.trave.disegna .area{opacity:1}
.trave text{font-family:'Inter',sans-serif;font-size:17px;letter-spacing:.05em;fill:rgba(243,241,234,.7);font-variant-numeric:tabular-nums;opacity:0;animation:appari .6s ease 2.2s forwards}
.trave text.acc{fill:var(--tratto)}
.trave text.pic{font-size:13px;letter-spacing:.14em;fill:rgba(243,241,234,.5)}
@media(max-width:900px){.trave text{font-size:36px}.trave text.pic{font-size:28px}}
/* mirino */
.mirino{position:absolute;inset:0;pointer-events:none;z-index:3;opacity:0;transition:opacity .25s}
.mirino.on{opacity:1}
.mirino .mx,.mirino .my{position:absolute;background:rgba(175,195,223,.35)}
.mirino .mx{left:0;right:0;height:1px;top:var(--y)}
.mirino .my{top:0;bottom:0;width:1px;left:var(--x)}
.mirino::after{content:"";position:absolute;left:var(--x);top:var(--y);width:14px;height:14px;margin:-7px 0 0 -7px;border:1px solid var(--tratto)}
.mirino .coord{position:absolute;left:var(--x);top:var(--y);transform:translate(14px,14px);white-space:pre;
  font-size:.66rem;letter-spacing:.1em;color:var(--tratto);font-variant-numeric:tabular-nums;background:rgba(17,29,37,.8);padding:3px 7px}

/* cartiglio, come in una tavola di progetto */
.cartiglio{position:relative;z-index:2;margin-top:48px;border-top:1px solid rgba(255,255,255,.1);display:grid;grid-template-columns:repeat(4,auto);justify-content:space-between}
.cartiglio span{font-size:.64rem;letter-spacing:.16em;text-transform:uppercase;color:rgba(243,241,234,.45);padding:14px 0;font-variant-numeric:tabular-nums}
@media(max-width:600px){.cartiglio{grid-template-columns:repeat(2,auto)}.cartiglio span{padding:10px 0}}

/* ---------- libro 3D ---------- */
.l3d{width:var(--w);height:var(--h);perspective:1800px;position:relative}
.l3d::after{content:"";position:absolute;left:8%;right:-6%;bottom:-26px;height:30px;border-radius:50%;
  background:radial-gradient(closest-side,rgba(0,0,0,.45),transparent);filter:blur(6px);z-index:-1}
.l3d-corpo{position:relative;width:100%;height:100%;transform-style:preserve-3d;
  transform:rotateX(var(--rx,4deg)) rotateY(var(--ry,-28deg));transition:transform .7s cubic-bezier(.22,.61,.36,1)}
.l3d .f{position:absolute;display:block;background:#1B2733 center/100% 100% no-repeat;backface-visibility:hidden}
.l3d .fronte,.l3d .retro{inset:0}
.l3d .fronte{transform:translateZ(calc(var(--d)/2))}
.l3d .fronte::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,rgba(255,255,255,.14),transparent 38%,transparent 70%,rgba(0,0,0,.18))}
.l3d .retro{transform:rotateY(180deg) translateZ(calc(var(--d)/2))}
.l3d .dorso{top:0;left:50%;width:var(--d);height:100%;margin-left:calc(var(--d)/-2);transform:rotateY(-90deg) translateZ(calc(var(--w)/2))}
.l3d .taglio{top:1.5%;bottom:1.5%;left:50%;width:calc(var(--d) - 2px);margin-left:calc(var(--d)/-2 + 1px);transform:rotateY(90deg) translateZ(calc(var(--w)/2 - 2px));
  background:repeating-linear-gradient(90deg,#F4F1E8 0 1px,#DCD7C9 1px 2px)}
.l3d .testa,.l3d .piede{left:1%;width:97%;top:50%;height:calc(var(--d) - 2px);margin-top:calc(var(--d)/-2 + 1px);background:repeating-linear-gradient(0deg,#F4F1E8 0 1px,#DCD7C9 1px 2px)}
.l3d .testa{transform:rotateX(90deg) translateZ(calc(var(--h)/2 - 2px))}
.l3d .piede{transform:rotateX(-90deg) translateZ(calc(var(--h)/2 - 2px))}
/* libro "in preparazione": solo fil di ferro */
.l3d.filo::after{display:none}
.l3d.filo .f{background:transparent!important;border:1px dashed rgba(175,195,223,.7);backface-visibility:visible}
.l3d.filo .fronte::after{display:none}
.l3d.filo .fronte{display:flex;align-items:center;justify-content:center;text-align:center}
.l3d.filo .fronte span{font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--tratto)}
.l3d.filo .l3d-corpo{animation:giraFilo 14s linear infinite}
@keyframes giraFilo{from{transform:rotateX(8deg) rotateY(0)}to{transform:rotateX(8deg) rotateY(360deg)}}

/* i volumi appoggiati sulla trave */
.pila{position:relative;z-index:1;--mx:0;--my:0}
.pila-libro{position:absolute;bottom:0;display:block;transform:translateX(-50%);transform-style:preserve-3d;
  opacity:0;animation:cade .9s cubic-bezier(.22,.61,.36,1) forwards;animation-delay:calc(.3s + var(--i)*.12s)}
@keyframes cade{from{opacity:0;translate:0 -50px}to{opacity:1;translate:0 0}}
.pila-libro .l3d::after{bottom:-8px;height:12px;left:4%;right:4%}
.pila-libro .l3d-corpo{transform-origin:50% 100%;
  transform:rotateX(calc(3deg - var(--my)*6deg)) rotateY(calc(-22deg + var(--mx)*22deg))}
.pila-libro:hover{z-index:5}
.pila-libro:hover .l3d-corpo,.pila-libro:focus-visible .l3d-corpo{transform:rotateX(2deg) rotateY(-6deg) translateY(-16px) translateZ(40px)}
.pila-libro:focus-visible{outline:none}
.pila-libro .didasc{position:absolute;left:50%;top:calc(100% + 14px);transform:translateX(-50%);white-space:nowrap;
  font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;color:rgba(243,241,234,.0);transition:color .3s}
.pila-libro:hover .didasc{color:rgba(243,241,234,.7)}

/* ---------- NASTRO DEI TERMINI ---------- */
.nastro{overflow:hidden;background:var(--accento);color:var(--carta);padding:18px 0;white-space:nowrap}
.nastro-in{display:inline-flex;gap:0;will-change:transform}
.nastro span{font-family:'Inter Tight',sans-serif;font-weight:500;font-size:clamp(1.3rem,2.8vw,2.1rem);letter-spacing:-.02em;padding:0 22px;display:inline-flex;align-items:center;gap:44px}
.nastro span::after{content:"";width:7px;height:7px;border:1px solid rgba(243,241,234,.6);transform:rotate(45deg)}

/* ---------- CORSA ORIZZONTALE DEI VOLUMI ---------- */
.corsa{position:relative;background:var(--bianco)}
.corsa-sticky{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;display:flex;flex-direction:column;padding-top:100px}
.corsa-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap;width:100%}
.corsa-head .label{display:block;margin-bottom:10px}
.corsa-indice{display:flex;gap:18px;position:relative;padding-bottom:10px}
.corsa-indice span{font-size:.72rem;letter-spacing:.12em;color:var(--grigio-chiaro);font-variant-numeric:tabular-nums;transition:color .3s}
.corsa-indice span.on{color:var(--nero)}
.corsa-indice i{position:absolute;left:0;bottom:0;height:2px;background:var(--accento);width:0}
.corsa-indice::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--linea);z-index:-1}
.corsa-track{display:flex;flex:1;align-items:center;will-change:transform}
.pannello{--c:0;flex:0 0 100vw;display:flex;justify-content:center;align-items:center}
.pannello-in{width:100%;max-width:var(--maxw);padding:0 32px;display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1fr);gap:64px;align-items:center}
.pannello-libro{display:flex;justify-content:center}
.pannello-libro .l3d-corpo{transform:rotateX(4deg) rotateY(calc(-20deg + var(--c)*60deg));transition:none}
.pannello-testo{opacity:calc(1 - min(1, max(var(--c), calc(var(--c) * -1)) * 2.4));transform:translateX(calc(var(--c)*60px))}
.pannello-num{display:block;font-family:'Inter Tight',sans-serif;font-weight:500;font-size:clamp(3.2rem,6vw,5rem);letter-spacing:-.05em;line-height:1;
  color:var(--accento);font-variant-numeric:tabular-nums;margin-bottom:18px}
.pannello-num small{font-size:.22em;letter-spacing:.16em;color:var(--grigio);margin-left:10px;vertical-align:.9em;font-weight:500}
.pannello-testo .label{display:block;margin-bottom:14px;color:var(--accento)}
.pannello-testo h3{font-family:'Inter Tight',sans-serif;font-weight:500;font-size:clamp(1.8rem,3.6vw,3rem);letter-spacing:-.035em;line-height:1.05;text-wrap:balance}
.pannello-testo .sotto{font-style:italic;color:var(--grigio);margin-top:8px}
.pannello-testo p:not(.sotto){color:var(--testo2);margin-top:16px;max-width:44ch;font-size:1.02rem}
.pannello-testo .acquisto{margin-top:24px}
.pannello.prossimo h3,.pannello.prossimo .pannello-num{color:var(--grigio-chiaro)}
.pannello.prossimo .l3d.filo .f{border-color:var(--grigio-chiaro)}
.pannello.prossimo .l3d.filo .fronte span{color:var(--grigio)}
/* senza aggancio (telefono o movimento ridotto): scorrimento a mano */
.corsa.nativa .corsa-sticky{position:relative;height:auto;padding:80px 0 60px}
.corsa.nativa .corsa-track{overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-left:20px;padding:30px 0 20px 20px;transform:none!important;-webkit-overflow-scrolling:touch;scrollbar-width:none}
.corsa.nativa .corsa-track::-webkit-scrollbar{display:none}
.corsa.nativa .pannello{flex:0 0 84vw;scroll-snap-align:start;padding-right:16px}
.corsa.nativa .pannello-in{grid-template-columns:1fr;gap:26px;padding:0}
.corsa.nativa .pannello-testo{opacity:1;transform:none}
.corsa.nativa .pannello-libro .l3d-corpo{transform:rotateX(4deg) rotateY(-24deg)}
.corsa.nativa .corsa-indice{display:none}

/* ---------- MISURE: i numeri con la linea di quota ---------- */
.misure{background:var(--notte);color:var(--carta);padding:96px 0;position:relative;overflow:hidden}
.misure .label{color:var(--tratto)}
.misure h2{color:#fff}
.misure .sez-head{margin-bottom:56px}
.misure-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:54px 48px}
@media(max-width:820px){.misure-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:40px 24px}}
.misura .n{font-family:'Inter Tight',sans-serif;font-weight:500;font-size:clamp(2.6rem,5.4vw,4.4rem);letter-spacing:-.04em;line-height:1;font-variant-numeric:tabular-nums;color:#fff}
.misura .t{font-size:.84rem;color:rgba(243,241,234,.6);margin-top:8px}
/* la quota: linee di richiamo alle estremità, linea di misura, tratti obliqui */
.quota{position:relative;height:18px;margin-top:18px}
.quota b{position:absolute;left:0;top:50%;height:1px;width:0;background:var(--tratto);transition:width 1.5s cubic-bezier(.22,.61,.36,1)}
.quota::before,.quota b::after{content:"";position:absolute;top:50%;width:1px;height:18px;background:var(--tratto);margin-top:-9px}
.quota::before{left:0}
.quota b::after{right:0;height:18px}
.quota b::before{content:"";position:absolute;right:-5px;top:-5px;width:10px;height:1px;background:var(--tratto);transform:rotate(-45deg);transform-origin:center;top:0}
.quota i{position:absolute;left:-5px;top:50%;width:10px;height:1px;background:var(--tratto);transform:rotate(-45deg)}
.misura.visto .quota b{width:var(--w)}
.misura .quota{opacity:.9}

/* ---------- COLLANA APERTA ---------- */
.aperta{background:var(--notte2);color:var(--carta);padding:110px 0;position:relative;overflow:hidden}
.aperta .griglia-tecnica{mask-image:radial-gradient(ellipse 50% 70% at 25% 50%,#000 20%,transparent 90%);-webkit-mask-image:radial-gradient(ellipse 50% 70% at 25% 50%,#000 20%,transparent 90%)}
.aperta-grid{position:relative;display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:60px;align-items:center}
@media(max-width:820px){.aperta-grid{grid-template-columns:1fr;gap:40px}}
.aperta .filo-box{display:flex;justify-content:center}
.aperta .label{color:var(--tratto);display:block;margin-bottom:16px}
.aperta h2{font-size:clamp(2rem,4.6vw,3.6rem);letter-spacing:-.04em;line-height:1.02;color:#fff;text-wrap:balance}
.aperta h2 em{font-style:normal;color:var(--tratto)}
.aperta p{color:rgba(243,241,234,.72);max-width:54ch;margin-top:20px}
.aperta .libro{color:var(--carta);border-color:rgba(255,255,255,.22)}
.aperta .libro:hover{background:var(--carta);border-color:var(--carta);color:var(--notte)}

/* ---------- principi: una linea d'oro al passaggio ---------- */
.principio{position:relative;transition:transform .35s cubic-bezier(.22,.61,.36,1)}
.principio::before{content:"";position:absolute;top:-1px;left:0;height:2px;width:100%;background:var(--accento);transform:scaleX(0);transform-origin:left;transition:transform .5s cubic-bezier(.22,.61,.36,1)}
.principio:hover{transform:translateY(-4px)}
.principio:hover::before{transform:scaleX(1)}
.principi .principio:nth-child(2){transition-delay:0s}

/* ---------- pulsanti magnetici ---------- */
.magnetico{transition:transform .25s cubic-bezier(.22,.61,.36,1),background .2s,color .2s,border-color .2s}

/* ---------- pagina del volume: libro da ruotare ---------- */
.libro-mano{display:flex;justify-content:center;padding:10px 0 34px;cursor:grab;touch-action:pan-y;user-select:none}
.libro-mano.presa{cursor:grabbing}
.libro-mano .l3d-corpo{transition:none}
.mano-nota{display:block;text-align:center;font-size:.64rem;letter-spacing:.14em;text-transform:uppercase;color:var(--grigio-chiaro);margin-top:-8px}
.volume.con-libro{grid-template-columns:260px 1fr}
@media(max-width:820px){.volume.con-libro{grid-template-columns:1fr}}

@media(prefers-reduced-motion:reduce){
  .pila-libro{opacity:1;animation:none}
  .l3d.filo .l3d-corpo{animation:none}
  .trave .tr{stroke-dashoffset:0;transition:none}
  .trave text{opacity:1;animation:none}
  .quota b{transition:none}
}
@keyframes appari{to{opacity:1}}
.trave .proiez{fill:none;stroke:rgba(175,195,223,.4);stroke-width:1;stroke-dasharray:4 5;opacity:0;transition:opacity .8s ease 1.4s}
.trave.disegna .proiez{opacity:1}
.trave .tr{vector-effect:none}
@media(max-width:900px){.trave .tr{stroke-width:2.6}.trave .tr.forte{stroke-width:5}.trave .tr.mom{stroke-width:3.4}.trave .tr.fine,.trave .proiez{stroke-width:2}}
.tavola-lato{padding-bottom:14px}
.tavola .cartiglio{margin-top:36px}

/* ============================================================
   IL MARCHIO GLYPHE — tutto bianco, compasso celeste
============================================================ */
:root{ --celeste:#A9CDEE }
.logo{flex-direction:row;align-items:center;gap:11px}
.logo-t{display:flex;flex-direction:column;line-height:1.15}
.marchio{width:30px;height:auto;flex-shrink:0;overflow:visible}
.marchio .g-ingranaggio{fill:var(--nero)}
.marchio .g-comp{fill:var(--accento)}
header.su-scuro .marchio .g-ingranaggio{fill:#fff}
header.su-scuro .marchio .g-comp{fill:var(--celeste)}
.marchio .g-ingranaggio path,.marchio .g-comp{transition:fill .4s ease}

.editore{display:flex;align-items:flex-end;gap:26px;margin-bottom:34px;flex-wrap:wrap}
.editore .label{margin:0 0 6px;line-height:1.7;color:rgba(243,241,234,.62)}
.glyphe{width:clamp(170px,17vw,236px);height:auto;overflow:visible;cursor:pointer}
.glyphe .g-ingranaggio,.glyphe .g-scritta{fill:#fff}
.glyphe .g-compasso{fill:var(--celeste)}
.glyphe .g-arco{fill:none;stroke:var(--celeste);stroke-width:2.5;stroke-dasharray:1;stroke-dashoffset:1;opacity:.9}
.glyphe .g-lettera{transform-box:fill-box;transform-origin:50% 100%;opacity:0;transform:translateY(38%);
  animation:lettera .7s cubic-bezier(.22,.61,.36,1) forwards;animation-delay:calc(1.25s + var(--i)*.09s)}
@keyframes lettera{to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.glyphe .g-lettera{animation:none;opacity:1;transform:none}.glyphe .g-arco{display:none}}
/* il marchio dell'editore in testa alla colonna di destra */
.tavola-lato .editore{display:block;margin:0 0 30px -6px}
.tavola-lato .glyphe{width:clamp(160px,14vw,200px)}
.tavola{padding-top:112px}
.banco{margin-top:30px}
@media(max-width:900px){.tavola-lato .editore{margin-bottom:22px}.tavola-lato .glyphe{width:150px}}
.mirino .coord.sx{transform:translate(calc(-100% - 14px),14px)}
.mirino.muto .coord{opacity:0}
.mirino .coord{transition:opacity .2s}
/* il titolo che sale parola per parola: spazio intorno alla parola perché
   la curva della "o" (e ogni lettera che sborda) non venga tagliata */
h1 .w{padding:.08em .1em .2em;margin:-.08em -.1em -.2em}
/* i volumi poggiano sopra la trave, non ci affondano */
.pila-libro{bottom:5px}
@media(max-width:900px){.pila-libro{bottom:3px}}

/* ---------- sipario fra le pagine, con il logo Glyphe ---------- */
.passaggio{position:fixed;inset:0;z-index:95;background:var(--notte);pointer-events:none;
  display:flex;align-items:center;justify-content:center;clip-path:inset(100% 0 0 0);visibility:hidden}
.passaggio .griglia-tecnica{mask-image:radial-gradient(ellipse 40% 45% at 50% 50%,#000 10%,transparent 100%);-webkit-mask-image:radial-gradient(ellipse 40% 45% at 50% 50%,#000 10%,transparent 100%)}
.passaggio-logo{position:relative;opacity:0;transform:translateY(14px) scale(.96);transition:opacity .35s ease .12s,transform .6s cubic-bezier(.22,.61,.36,1) .12s}
.passaggio .glyphe{width:clamp(160px,18vw,230px);cursor:default}
.passaggio .g-lettera{animation-delay:calc(.2s + var(--i)*.05s)}
.passaggio.chiude,.passaggio.coperto,.passaggio.apre{visibility:visible}
.passaggio.chiude{clip-path:inset(0 0 0 0);transition:clip-path .55s cubic-bezier(.76,0,.24,1)}
.passaggio.coperto{clip-path:inset(0 0 0 0);transition:none}
.passaggio.apre{clip-path:inset(0 0 100% 0);transition:clip-path .6s cubic-bezier(.76,0,.24,1)}
.passaggio.chiude .passaggio-logo,.passaggio.coperto .passaggio-logo{opacity:1;transform:none}
.passaggio.apre .passaggio-logo{opacity:0;transform:translateY(-10px);transition:opacity .25s ease,transform .4s ease}
@media(prefers-reduced-motion:reduce){.passaggio{display:none}}

.libro .en{font-size:.62rem;font-weight:600;letter-spacing:.1em;background:var(--nero);color:var(--bianco);border-radius:2px;padding:2px 6px;margin-right:2px}
.libro:hover .en{background:#fff;color:var(--accento)}

/* ---------- lingua IT / EN nell'intestazione ---------- */
.nav #mainnav{margin-left:auto}
.nav .lang{margin-left:30px}
.lang-btn[aria-pressed="true"]{pointer-events:none}
header.su-scuro .lang{border-color:rgba(255,255,255,.18)}
header.su-scuro .lang-btn{color:rgba(255,255,255,.6)}
header.su-scuro .lang-btn:hover{color:#fff}
header.su-scuro .lang-btn.on{background:var(--carta);color:var(--notte)}
@media(max-width:860px){.nav .lang{margin-left:auto;margin-right:16px}}
.autore .vols a{color:inherit;text-decoration:none;border-bottom:1px solid transparent;transition:border-color .2s}
.autore .vols a:hover{border-bottom-color:currentColor}

/* ============================================================
   PIÈ DI PAGINA: mappa dei collegamenti, scura come la testata
============================================================ */
.mappa{position:relative;overflow:hidden;background:var(--notte);color:var(--carta);padding:72px 0 56px}
.mappa .griglia-tecnica{opacity:.45;mask-image:linear-gradient(180deg,#000,transparent 70%);-webkit-mask-image:linear-gradient(180deg,#000,transparent 70%)}
.mappa .wrap{position:relative}
.mappa a{color:inherit;text-decoration:none;transition:color .2s,border-color .2s,background .2s}
.m-testa{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;flex-wrap:wrap;padding-bottom:36px;margin-bottom:40px;border-bottom:1px solid rgba(255,255,255,.1)}
.m-marchio img{display:block;width:150px;height:auto}
.m-motto{font-family:'Inter Tight',sans-serif;font-size:clamp(1.2rem,2.2vw,1.6rem);letter-spacing:-.02em;color:rgba(243,241,234,.8);max-width:28ch;text-wrap:balance}
.m-label{display:block;color:var(--tratto);margin-bottom:18px}
/* i volumi: copertina, numero, titolo, acquisto */
.m-libri{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:52px}
.m-libro{display:grid;grid-template-columns:56px 1fr;gap:14px;align-items:center;padding:14px;border:1px solid rgba(255,255,255,.1);border-radius:2px;background:rgba(255,255,255,.02);transition:border-color .25s,background .25s}
.m-libro:hover{border-color:rgba(175,195,223,.45);background:rgba(175,195,223,.05)}
.m-cop img{display:block;width:56px;height:80px;object-fit:cover;box-shadow:0 8px 18px rgba(0,0,0,.4)}
.m-info{min-width:0;display:flex;flex-direction:column;gap:3px}
.m-num{font-size:.64rem;letter-spacing:.16em;text-transform:uppercase;color:rgba(243,241,234,.45);font-variant-numeric:tabular-nums}
.m-tit{font-family:'Inter Tight',sans-serif;font-weight:500;font-size:1rem;letter-spacing:-.01em;line-height:1.25;color:#fff}
.m-tit:hover{color:var(--tratto)}
.m-acq{display:flex;gap:8px;flex-wrap:wrap;margin-top:6px}
.m-acq a{font-size:.72rem;font-weight:500;padding:4px 9px;border:1px solid rgba(255,255,255,.18);border-radius:2px;color:rgba(243,241,234,.8);white-space:nowrap}
.m-acq a:hover{background:var(--carta);border-color:var(--carta);color:var(--notte)}
/* colonne di link */
.m-cols{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr) minmax(0,.8fr);gap:40px 56px}
.m-lista{list-style:none;border-top:1px solid rgba(255,255,255,.1)}
.m-lista li{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:11px 0;border-bottom:1px solid rgba(255,255,255,.1);font-size:.9rem}
.m-lista a{color:rgba(243,241,234,.85)}
.m-lista a:hover{color:#fff}
.m-nota{font-size:.68rem;letter-spacing:.12em;color:rgba(243,241,234,.4);white-space:nowrap}
.m-due{display:grid;grid-template-columns:1fr 1fr;column-gap:24px}
.m-mail{font-size:.95rem;margin-bottom:10px}
.m-mail a{border-bottom:1px solid rgba(175,195,223,.5)}
.m-mail a:hover{color:var(--tratto)}
.m-nota-l{font-size:.84rem;color:rgba(243,241,234,.55);margin-bottom:6px}
.m-nota-l a:hover{color:#fff}
@media(max-width:1000px){.m-libri{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:860px){.m-cols{grid-template-columns:1fr;gap:36px}}
@media(max-width:600px){
  .mappa{padding:56px 0 40px}
  .m-testa{flex-direction:column;align-items:flex-start;gap:16px;padding-bottom:28px;margin-bottom:32px}
  .m-marchio img{width:124px}
  .m-libri{grid-template-columns:1fr;gap:10px;margin-bottom:40px}
  .m-libro{grid-template-columns:48px 1fr;padding:12px}
  .m-cop img{width:48px;height:68px}
}
/* la barra finale continua il fondo scuro */
footer{background:var(--notte);border-top:1px solid rgba(255,255,255,.08);padding:22px 0 calc(22px + env(safe-area-inset-bottom,0px))}
footer .foot{color:rgba(243,241,234,.45)}
footer .foot a{color:rgba(243,241,234,.6)}
footer .foot a:hover{color:#fff}

/* ============================================================
   PANNELLI DEI VOLUMI: azioni ordinate
============================================================ */
.azioni{display:flex;gap:10px;flex-wrap:wrap;margin-top:24px}
.azioni .libro{margin-top:0}
.extra{list-style:none;margin-top:18px;border-top:1px solid var(--linea);max-width:440px}
.extra li{border-bottom:1px solid var(--linea)}
.extra a{display:flex;align-items:center;gap:10px;padding:11px 0;font-size:.9rem;font-weight:500;color:var(--nero);text-decoration:none;transition:color .2s}
.extra a:hover{color:var(--accento)}
.extra a.arancio{color:var(--arancio)}
.extra a.arancio::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--arancio);flex-shrink:0}
.extra a.arancio:hover{color:var(--arancio-scuro)}
.extra .en{margin-right:0}
.scorri{display:none}

/* ============================================================
   RIFINITURA GENERALE E TELEFONO
============================================================ */
.due-col>*,.tavola-grid>*,.pannello-in>*,.volume>*{min-width:0}
.libro{min-height:40px}
@media(hover:none){.solo-mouse{display:none}}
@media(max-width:900px){
  /* sfoglio di un solo volume: niente fila di miniature */
  .vetrina.singolo .scaffale{display:none!important}
  .vetrina.singolo .titolo-corrente{margin-top:4px}
  .corsa.nativa .corsa-sticky{padding:72px 0 48px}
  .corsa.nativa .corsa-head{gap:10px}
  .pannello-num{font-size:3rem;margin-bottom:12px}
  .pannello-testo h3{font-size:1.7rem}
}
@media(max-width:600px){
  .wrap{padding:0 20px}
  .sezione{padding:60px 0}
  .hero.interna{padding:108px 0 20px}
  .sez-head{margin-bottom:26px;gap:8px}
  h2{font-size:1.55rem}
  .tavola h1{font-size:clamp(2.7rem,13vw,3.4rem)}
  .tavola .sommario{font-size:1rem}
  .misure{padding:64px 0}
  .misure .sez-head{margin-bottom:34px}
  .aperta{padding:72px 0}
  .principi{gap:22px}
  .volume{padding:28px 0}
  .volume .desc{font-size:.98rem}
  .volume .dettagli{max-width:none}
  .dentro li{margin-bottom:6px}
  /* pulsanti in colonna, tutti della stessa larghezza */
  .volume .acquisto,.altra-edizione .acquisto{display:grid;grid-template-columns:1fr;gap:8px}
  .volume .acquisto .libro,.altra-edizione .acquisto .libro{justify-content:center;text-align:center;padding:12px 14px}
  .azioni{display:grid;grid-template-columns:1fr 1fr;gap:8px}
  .azioni .libro{justify-content:center;text-align:center;padding:12px 10px}
  .azioni .libro.pieno{grid-column:1/-1}
  .extra{max-width:none}
  .download{padding:24px 20px!important;margin:44px 0 20px!important;gap:18px}
  .download>div:last-child{display:grid!important;grid-template-columns:1fr;gap:8px!important;width:100%}
  .download .btn{text-align:center}
  .due-col{gap:14px}
  .errata th:nth-child(2),.errata td:nth-child(2){display:none}
  .citazione{padding:16px}
  .naviga-vol{padding-top:20px;gap:12px}
  .naviga-vol span{font-size:.95rem}
  .autore{padding:24px 0}
  .materiali{gap:12px}
  .materiale{padding:20px}
  .riga{padding:18px 0}
  .libro-mano{padding-bottom:22px}
  .foot{flex-direction:column;gap:8px}
}
@media(max-width:380px){
  .logo-t{font-size:.88rem}
  .nav .lang{margin-right:10px}
  .lang-btn{padding:6px 9px}
}
.errata td[colspan]{white-space:normal}
.azioni .libro.pieno{background:var(--nero);border-color:var(--nero);color:#fff}
.azioni .libro.pieno:hover{background:var(--accento);border-color:var(--accento)}
.extra .en{font-size:.6rem;font-weight:600;letter-spacing:.1em;background:var(--nero);color:var(--bianco);border-radius:2px;padding:2px 6px}
.extra a:hover .en{background:var(--accento)}
@media(max-width:600px){.azioni .libro{white-space:nowrap;font-size:.8rem;padding:12px 8px}}

/* ---------- indice del volume: parti, capitoli, pagine ---------- */
.indice-nota{font-size:.84rem;color:var(--grigio);margin-top:10px;max-width:24ch}
.indice-parti{display:grid;gap:30px;max-width:760px}
.parte-tit{display:block;font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--accento);margin-bottom:8px}
.indice2{list-style:none;border-top:1px solid var(--linea)}
.indice2 li{display:grid;grid-template-columns:38px 1fr auto;gap:12px;align-items:baseline;padding:10px 0;border-bottom:1px solid var(--linea);font-size:.95rem;color:var(--testo2)}
.indice2 b{font-weight:500;font-size:.8rem;color:var(--grigio-chiaro);font-variant-numeric:tabular-nums}
.indice2 .pg{font-size:.82rem;color:var(--grigio);font-variant-numeric:tabular-nums}
.indice2 li:hover .t{color:var(--nero)}
@media(min-width:1000px){.indice-parti.lunga{grid-template-columns:1fr 1fr;column-gap:40px;max-width:none}}
.scena + .hero.interna{padding-top:44px}

/* ---------- collaboratori futuri (non ancora ufficiali) ---------- */
.prossimi{padding-top:10px}
.intro-prossimi{max-width:62ch;color:var(--testo2);font-size:1rem;margin:-6px 0 8px}
.autore.futuro>*{opacity:.46;transition:opacity .4s ease}
.autore.futuro:hover>*,.autore.futuro:focus-within>*{opacity:.72}
.autore.futuro .sigla{border-style:dashed;color:var(--grigio)}
.autore.futuro h3{color:var(--testo2)}
.autore .in-definizione{display:inline-block;margin-top:10px;font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--grigio);border:1px dashed var(--linea);padding:4px 10px}
@media(hover:none){.autore.futuro>*{opacity:.55}}
.autore p+p{margin-top:10px}

/* ---------- corsa su telefono: un volume per schermata, con navigazione ---------- */
.corsa .scorri{display:none}
.corsa-nav{display:none}
.corsa.nativa .corsa-track{flex:none;overflow-y:hidden;transition:height .35s cubic-bezier(.22,.61,.36,1);box-sizing:border-box;padding:28px 0 6px;scroll-padding:0;scroll-snap-type:x mandatory;align-items:flex-start;gap:0}
.corsa.nativa .pannello{flex:0 0 100%;scroll-snap-align:center;scroll-snap-stop:always;padding:0;align-items:flex-start}
.corsa.nativa .pannello-in{max-width:560px;margin:0 auto;padding:0 20px;gap:22px}
.corsa.nativa .pannello-libro{justify-content:center;padding:6px 0 4px}
.corsa.nativa .pannello-testo{text-align:left}
.corsa.nativa .corsa-nav{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;max-width:560px;margin:14px auto 0;box-sizing:border-box;padding:18px 20px 0;position:relative}
.corsa.nativa .corsa-nav::before{content:"";position:absolute;left:20px;right:20px;top:0;height:1px;background:var(--linea)}
.corsa-nav .cn-freccia{width:44px;height:44px;flex:0 0 44px;border:1px solid var(--linea);background:var(--bianco);color:var(--nero);
  font:500 1.05rem 'Inter',sans-serif;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:border-color .2s,opacity .2s}
.corsa-nav .cn-freccia:active{border-color:var(--nero)}
.corsa-nav .cn-freccia[disabled]{opacity:.3;cursor:default}
.corsa-nav .cn-punti{display:flex;align-items:center;gap:8px}
.corsa-nav .cn-punti button{width:8px;height:8px;padding:0;border:0;background:var(--linea);cursor:pointer;transition:width .3s,background .3s;position:relative}
.corsa-nav .cn-punti button::after{content:"";position:absolute;inset:-12px -4px}
.corsa-nav .cn-punti button.on{width:26px;background:var(--accento)}
.corsa-nav .cn-conta{font-size:.72rem;letter-spacing:.14em;color:var(--grigio);font-variant-numeric:tabular-nums;min-width:4.2em;text-align:center}
.corsa.nativa .pannello-testo .label{letter-spacing:.09em;line-height:1.6}
.corsa.nativa .corsa-head{box-sizing:border-box;width:100%;max-width:560px;margin:0 auto}
.l3d.filo .fronte span{backface-visibility:hidden;-webkit-backface-visibility:hidden}
.corsa.nativa .extra{max-width:none}
.corsa.nativa .extra li:last-child{border-bottom:0}

/* ============================================================
   MODULO DI CANDIDATURA
============================================================ */
.modulo-griglia{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:64px;align-items:start}
.modulo-griglia>*{min-width:0}
.modulo fieldset{border:0;border-top:1px solid var(--linea);padding:28px 0 8px;margin:0}
.modulo fieldset:first-of-type{border-top-color:var(--nero)}
.modulo legend{display:flex;align-items:baseline;gap:14px;padding:0 0 18px;font-family:'Inter Tight',sans-serif;font-weight:500;font-size:1.25rem;letter-spacing:-.01em;color:var(--nero);float:left;width:100%}
.modulo legend+*{clear:both}
.modulo legend small{font-family:'Inter',sans-serif;font-size:.78rem;font-weight:400;color:var(--grigio);letter-spacing:0}
.fs-num{font-family:'Inter',sans-serif;font-size:.7rem;font-weight:500;letter-spacing:.14em;color:var(--accento);font-variant-numeric:tabular-nums}
.modulo .due{display:grid;grid-template-columns:1fr 1fr;gap:0 20px}
.modulo .campo{margin-bottom:18px;min-width:0}
.modulo label{display:block;font-size:.85rem;font-weight:500;color:var(--nero);margin-bottom:7px}
.modulo label small{font-weight:400;color:var(--grigio);margin-left:4px;font-size:.78rem}
.modulo .obb{color:var(--arancio);font-weight:500}
.modulo input[type=text],.modulo input[type=email],.modulo input[type=tel],.modulo input[type=url],.modulo select,.modulo textarea{
  display:block;width:100%;box-sizing:border-box;font:400 1rem/1.5 'Inter',sans-serif;color:var(--nero);background:var(--bianco);
  border:1px solid var(--linea);border-radius:0;padding:11px 13px;min-height:46px;transition:border-color .2s,box-shadow .2s;-webkit-appearance:none;appearance:none}
.modulo select{background-image:linear-gradient(45deg,transparent 50%,var(--grigio) 50%),linear-gradient(135deg,var(--grigio) 50%,transparent 50%);
  background-position:calc(100% - 19px) 50%,calc(100% - 14px) 50%;background-size:5px 5px;background-repeat:no-repeat;padding-right:38px}
.modulo textarea{min-height:130px;resize:vertical}
.modulo textarea.breve{min-height:88px}
.modulo ::placeholder{color:var(--grigio-chiaro)}
.modulo input:focus,.modulo select:focus,.modulo textarea:focus{outline:none;border-color:var(--accento);box-shadow:0 0 0 3px rgba(30,58,95,.12)}
.modulo .campo.errato input,.modulo .campo.errato select,.modulo .campo.errato textarea{border-color:var(--arancio)}
.errore-campo{font-size:.8rem;color:var(--arancio);margin-top:6px}
.esca{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
/* allegati */
.modulo .drop{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;text-align:center;
  border:1px dashed var(--grigio-chiaro);background:var(--carta);padding:28px 20px;cursor:pointer;margin:0;transition:border-color .2s,background .2s}
.modulo .drop:hover,.modulo .drop.sopra{border-color:var(--accento);background:#EDF1F6}
.modulo .drop.pieno{opacity:.5;pointer-events:none}
.modulo .drop input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%}
.modulo .drop svg{width:38px;height:38px;fill:none;stroke:var(--accento);stroke-width:1.4;stroke-linejoin:round;margin-bottom:4px}
.modulo .drop b{font-size:.95rem;font-weight:500;color:var(--nero)}
.modulo .drop span{font-size:.8rem;font-weight:400;color:var(--grigio);max-width:46ch;line-height:1.5}
.elenco-allegati{list-style:none;margin:10px 0 0;padding:0}
.elenco-allegati li{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;gap:12px;align-items:center;padding:9px 0;border-bottom:1px solid var(--linea);font-size:.88rem}
.elenco-allegati .ext{font-size:.62rem;font-weight:600;letter-spacing:.08em;color:var(--bianco);background:var(--accento);padding:3px 6px;min-width:34px;text-align:center}
.elenco-allegati .nome{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.elenco-allegati .peso{color:var(--grigio);font-variant-numeric:tabular-nums;font-size:.8rem}
.elenco-allegati button{width:32px;height:32px;border:1px solid var(--linea);background:var(--bianco);cursor:pointer;font-size:1.1rem;line-height:1;color:var(--nero)}
.elenco-allegati button:hover{border-color:var(--nero)}
/* consenso e invio */
.modulo .consenso{border-top:1px solid var(--linea);padding-top:24px;margin-top:10px}
.modulo .spunta{display:grid;grid-template-columns:22px 1fr;gap:12px;align-items:start;font-weight:400;font-size:.92rem;color:var(--testo2);cursor:pointer;margin:0}
.modulo .spunta input{width:20px;height:20px;margin:2px 0 0;accent-color:var(--accento)}
.informativa{font-size:.78rem;line-height:1.6;color:var(--grigio);margin:12px 0 0 34px;max-width:70ch}
.informativa a,.modulo-lato .nota a,.esito a{color:var(--accento)}
.invio{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-top:26px}
.invio .libro{min-width:220px;justify-content:center}
.invio .libro[disabled]{opacity:.55;cursor:wait}
.stato{font-size:.88rem;color:var(--grigio)}
.stato.err{color:var(--arancio)}
/* esito */
.esito{border-top:1px solid var(--nero);padding-top:30px}
.esito .label{display:block;margin-bottom:10px}
.esito-codice{font-family:'Inter Tight',sans-serif;font-weight:500;font-size:clamp(2rem,6vw,3.2rem);letter-spacing:-.03em;color:var(--accento);font-variant-numeric:tabular-nums;margin-bottom:18px}
.esito p{color:var(--testo2);max-width:60ch;margin-bottom:10px}
.esito .acquisto{margin-top:22px}
/* colonna laterale */
.modulo-lato{position:sticky;top:96px;border-top:1px solid var(--nero);padding-top:26px}
.modulo-lato h2{font-family:'Inter Tight',sans-serif;font-weight:500;font-size:1.05rem;letter-spacing:-.01em;margin:0 0 12px}
.modulo-lato h2:not(:first-child){margin-top:28px}
.modulo-lato .trattini li{font-size:.9rem}
.passi{list-style:none;counter-reset:p;margin:0;padding:0}
.passi li{counter-increment:p;display:grid;grid-template-columns:28px 1fr;gap:2px 10px;padding:10px 0;border-bottom:1px solid var(--linea)}
.passi li::before{content:counter(p,decimal-leading-zero);grid-row:span 2;font-size:.7rem;font-weight:500;letter-spacing:.1em;color:var(--accento);padding-top:3px}
.passi b{font-size:.9rem;font-weight:500;color:var(--nero)}
.passi span{font-size:.84rem;color:var(--grigio);line-height:1.5}
.modulo-lato .nota{font-size:.8rem;color:var(--grigio);line-height:1.6;margin-top:22px}
@media(max-width:900px){
  .modulo-griglia{grid-template-columns:1fr;gap:40px}
  .modulo-lato{position:static}
}
@media(max-width:600px){
  .modulo .due{grid-template-columns:1fr}
  .modulo legend{font-size:1.12rem}
  .informativa{margin-left:0}
  .invio{flex-direction:column;align-items:stretch}
  .invio .libro{width:100%}
  .esito .acquisto .libro{flex:1 1 100%}
}
.invio .libro.pieno{background:var(--nero);border-color:var(--nero);color:#fff;font-family:inherit;font-size:.9rem;margin-top:0;padding:14px 26px;cursor:pointer}
.invio .libro.pieno:hover{background:var(--accento);border-color:var(--accento)}
.esito .acquisto button.libro{font-family:inherit;cursor:pointer;background:transparent}

/* ============================================================
   LA TRAVE CHE LAVORA (home)
============================================================ */
.banco{position:relative}
.banco .pila{position:absolute;left:0;top:0;width:100%;z-index:2}
.banco .trave{margin-top:0;display:block;width:100%;pointer-events:none;overflow:visible}
.banco .pila-libro,.banco .dorso-libro{position:absolute;left:0;top:0;bottom:auto;animation:none;opacity:0;transform-origin:50% 100%;
  will-change:transform;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.banco .pila-libro{cursor:grab}
.banco .pila-libro.trascina{cursor:grabbing;z-index:6}
.banco .pila-libro.trascina .l3d-corpo{transform:rotateX(3deg) rotateY(-12deg) translateZ(24px)}
.banco .pila-libro.trascina .didasc,.banco .pila-libro.sollevato .didasc{color:rgba(243,241,234,.75)}
.banco .pila-libro.sollevato .l3d-corpo{transform:rotateX(2deg) rotateY(-8deg)}
@media(hover:none){.banco .pila-libro{cursor:pointer}}
.dorso-libro{display:block;background:#1B2733 center/100% 100% no-repeat;border-radius:1px;
  box-shadow:inset -1px 0 0 rgba(0,0,0,.4),inset 1px 0 0 rgba(255,255,255,.1),0 6px 10px -6px rgba(0,0,0,.6);transition:translate .28s cubic-bezier(.22,.61,.36,1)}
.dorso-libro:hover,.dorso-libro:focus-visible{translate:0 -20px;z-index:5;outline:none}
.dorso-scheda{position:absolute;left:calc(100% + 14px);top:14%;display:grid;grid-template-columns:58px 150px;gap:4px 12px;
  align-items:center;padding:10px 12px 10px 10px;background:var(--notte2);border:1px solid rgba(175,195,223,.28);box-shadow:0 18px 40px -18px rgba(0,0,0,.8);
  opacity:0;pointer-events:none;transition:opacity .2s}
.dorso-scheda img{grid-row:span 2;width:58px;height:auto;display:block}
.dorso-scheda b{font-size:.6rem;letter-spacing:.16em;color:var(--tratto);font-weight:500;align-self:end}
.dorso-scheda span{font-family:'Inter Tight',sans-serif;font-size:.86rem;color:var(--carta);line-height:1.25;align-self:start}
.dorso-libro:hover .dorso-scheda,.dorso-libro:focus-visible .dorso-scheda{opacity:1}
.trave .tv-t{font-family:'Inter',sans-serif;font-size:12px;letter-spacing:.04em;fill:rgba(243,241,234,.72);font-variant-numeric:tabular-nums;opacity:1;animation:none}
.trave .tv-t.pic{font-size:10.5px;letter-spacing:.14em;fill:rgba(243,241,234,.48)}
.trave .tv-t.acc{fill:var(--tratto)}
.trave .tv-sub{font-size:72%}
.trave .tv-rif{fill:none;stroke:rgba(243,241,234,.22);stroke-width:1;stroke-dasharray:5 6}
.trave .tv-trave{fill:none;stroke:var(--carta);stroke-width:3;stroke-linejoin:round;stroke-linecap:round}
.trave .tv-app{fill:none;stroke:rgba(243,241,234,.6);stroke-width:1.4}
.trave .tv-r{fill:none;stroke:var(--tratto);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.trave .tv-base{stroke:rgba(243,241,234,.28);stroke-width:1}
.trave .tv-m{fill:none;stroke:var(--tratto);stroke-width:2;stroke-linejoin:round}
.trave .tv-area{fill:rgba(175,195,223,.08)}
.trave .tv-tr{fill:none;stroke:rgba(175,195,223,.32);stroke-width:1}
.trave .tv-q{fill:none;stroke:rgba(243,241,234,.36);stroke-width:1}
.trave .tv-qq{fill:none;stroke:var(--tratto);stroke-width:1.2}
.banco-nota{font-size:.64rem;letter-spacing:.14em;text-transform:uppercase;color:rgba(243,241,234,.42);margin:4px 0 0;min-height:1em}
@media(max-width:900px){
  .trave .tv-t{font-size:10px}
  .trave .tv-t.pic{font-size:8.6px;letter-spacing:.1em}
  .trave .tv-trave{stroke-width:2.4}
  .banco-nota{font-size:.58rem;letter-spacing:.1em;line-height:1.6}
}
.dorso-libro.a-sinistra .dorso-scheda{left:auto;right:calc(100% + 14px)}
.dorso-libro .dorso-scheda{z-index:8}
/* link a Instagram nel piè di pagina */
.m-social{margin:2px 0 12px}
.m-social a{display:inline-flex;align-items:center;gap:9px;font-size:.88rem;color:rgba(243,241,234,.82);text-decoration:none;transition:color .2s}
.m-social a:hover{color:var(--tratto)}
.m-social .ig{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6}
.m-social .ig .pieno{fill:currentColor;stroke:none}
.m-social span{border-bottom:1px solid transparent;transition:border-color .2s}
.m-social a:hover span{border-bottom-color:currentColor}
