/* =========================================================================
   I QUADERNI DI LEO — foglio di stile v2
   Direzione: editoriale illustrato (Standard §4.3). Chiaroscuro, cobalto
   dominante, silhouette, molta aria. I sette quaderni come oggetti reali.
   Font di stampa: Caladea (display) + Carlito (utility). Nessun tracker.
   ========================================================================= */

:root{
  --carta:#F6F4EE; --carta-2:#FBFAF6; --riga:#E3E1D8;
  --inchiostro:#16202E; --grafite:#5F6570;
  --cobalto:#253F75; --cobalto-scuro:#16274B; --cobalto-notte:#0E1B38;
  --ocra:#D6A24A; --ocra-scuro:#B9822A;
  --q-rosso:#9E2B25; --q-blu:#253F75; --q-verde:#2C4130;
  --q-arancio:#D9622B; --q-nero:#1E1E1E; --q-giallo:#E3B23C; --q-bianco:#FFFFFF;
  --misura:66ch;
  --ombra-s:0 1px 2px rgba(15,25,45,.06);
  --ombra-m:0 10px 30px rgba(15,25,45,.12);
  --ombra-l:0 24px 60px rgba(14,27,56,.28);
}

*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;}
body{margin:0;color:var(--inchiostro);background:var(--carta);
  font-family:"Caladea",Cambria,Georgia,serif;font-size:1.08rem;line-height:1.68;}
img{max-width:100%;height:auto;display:block;}
a{color:var(--cobalto);text-underline-offset:3px;}
a:hover{color:var(--cobalto-scuro);}

h1,h2,h3{font-family:"Caladea",Cambria,Georgia,serif;line-height:1.1;font-weight:700;letter-spacing:-.015em;}
h1{font-size:clamp(2.6rem,6.4vw,5rem);margin:.1em 0 .25em;}
h2{font-size:clamp(1.7rem,3.4vw,2.6rem);margin:0 0 .6rem;}
h3{font-size:1.22rem;margin:0 0 .35rem;letter-spacing:-.01em;}

.eyebrow{font-family:"Carlito",Calibri,system-ui,sans-serif;font-size:.72rem;
  font-weight:700;text-transform:uppercase;letter-spacing:.22em;margin:0 0 .9rem;}
.lead{font-size:1.28rem;line-height:1.55;max-width:var(--misura);}
p,li{max-width:var(--misura);}
.muted{color:var(--grafite);}

.wrap{max-width:1120px;margin:0 auto;padding:0 clamp(1.2rem,4vw,2.6rem);}
section{padding:clamp(2.6rem,6vw,5rem) 0;}
.divider{border:0;border-top:1px solid var(--riga);}

/* navigazione */
.nav{font-family:"Carlito",Calibri,system-ui,sans-serif;position:sticky;top:0;z-index:30;
  background:rgba(246,244,238,.86);backdrop-filter:saturate(1.2) blur(10px);
  border-bottom:1px solid var(--riga);}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;gap:1rem;
  min-height:66px;flex-wrap:wrap;}
.brand{display:flex;align-items:center;gap:.6rem;font-weight:700;letter-spacing:-.01em;
  color:var(--inchiostro);text-decoration:none;font-size:1.02rem;}
.brand .dot{width:15px;height:19px;border-radius:1px 3px 3px 1px;background:var(--cobalto);
  box-shadow:inset 3px 0 0 var(--cobalto-notte);flex:none;}
.nav ul{list-style:none;display:flex;gap:.1rem;margin:0;padding:0;flex-wrap:wrap;}
.nav a{color:var(--inchiostro);text-decoration:none;font-size:.9rem;padding:.42rem .72rem;border-radius:5px;}
.nav a:hover{background:rgba(37,63,117,.09);}
.nav a[aria-current="page"]{color:var(--cobalto);font-weight:700;}

/* HERO cinematografico */
.hero{position:relative;overflow:hidden;background:var(--cobalto-notte);color:#EDEFF5;isolation:isolate;}
.hero .scena{position:absolute;inset:0;z-index:-1;}
.hero .scena svg{width:100%;height:100%;display:block;}
.hero .wrap{padding-top:clamp(3.4rem,7vw,6rem);padding-bottom:clamp(9rem,16vw,13rem);}
.hero .eyebrow{color:var(--ocra);}
.hero h1{max-width:15ch;color:#fff;text-shadow:0 1px 30px rgba(0,0,0,.35);}
.hero .lead{color:#D5DAE6;max-width:52ch;}
.hero em{color:#fff;font-style:italic;}
.hero .azioni{margin-top:2rem;}

/* scaffale dei sette quaderni come oggetti */
.mensola{position:relative;margin-top:calc(-1 * clamp(6rem,11vw,9rem));z-index:2;}
.scaffale{display:grid;grid-template-columns:repeat(7,1fr);gap:clamp(.5rem,1vw,.9rem);
  align-items:end;padding:0 clamp(1.2rem,4vw,2.6rem);max-width:1120px;margin:0 auto;}
.libro{position:relative;display:flex;flex-direction:column;justify-content:space-between;
  text-decoration:none;color:#fff;min-height:230px;padding:1rem .85rem 1.1rem;
  border-radius:2px 6px 6px 2px;box-shadow:var(--ombra-l);background-clip:padding-box;
  transition:transform .22s cubic-bezier(.2,.7,.2,1),box-shadow .22s ease;}
.libro::before{content:"";position:absolute;top:0;bottom:0;left:0;width:9px;
  border-radius:2px 0 0 2px;background:rgba(0,0,0,.28);}
.libro::after{content:"";position:absolute;top:6px;bottom:6px;right:-3px;width:3px;
  border-radius:0 2px 2px 0;background:repeating-linear-gradient(to bottom,#f3f1ea 0 2px,#d9d6cc 2px 3px);
  box-shadow:1px 0 2px rgba(0,0,0,.15);}
.libro:hover,.libro:focus-visible{transform:translateY(-14px) rotate(-.6deg);
  box-shadow:0 34px 70px rgba(14,27,56,.42);outline:none;}
.libro .num{font-family:"Carlito",Calibri,sans-serif;font-size:.68rem;letter-spacing:.2em;opacity:.7;margin-left:6px;}
.libro .parola{font-family:"Caladea",serif;font-weight:700;font-size:1.12rem;line-height:1.05;margin-left:6px;}
.libro .dom{font-family:"Carlito",Calibri,sans-serif;font-size:.72rem;line-height:1.28;opacity:.92;margin-left:6px;}
.libro.rosso{background:linear-gradient(155deg,#B23A33,var(--q-rosso));}
.libro.blu{background:linear-gradient(155deg,#31538f,var(--q-blu));}
.libro.verde{background:linear-gradient(155deg,#3a5641,var(--q-verde));}
.libro.arancio{background:linear-gradient(155deg,#EA7C42,var(--q-arancio));}
.libro.nero{background:linear-gradient(155deg,#333,var(--q-nero));}
.libro.giallo{background:linear-gradient(155deg,#efc463,var(--q-giallo));color:#2a2410;}
.libro.giallo .num,.libro.giallo .dom{opacity:.82;}
.libro.bianco{background:linear-gradient(155deg,#fff,#f0efe9);color:var(--inchiostro);}
.libro.bianco::before{background:rgba(0,0,0,.12);}
.libro.bianco .num{color:var(--grafite);opacity:1;}
.libro.bianco .dom{color:var(--grafite);opacity:1;}
.scala-nota{font-family:"Carlito",Calibri,sans-serif;font-size:.82rem;color:var(--grafite);
  display:flex;justify-content:space-between;max-width:1120px;margin:1rem auto 0;
  padding:0 clamp(1.4rem,4vw,2.8rem);}

/* pulsanti */
.azioni{display:flex;gap:.8rem;flex-wrap:wrap;}
.btn{font-family:"Carlito",Calibri,sans-serif;font-weight:700;font-size:.96rem;text-decoration:none;
  padding:.8rem 1.4rem;border-radius:6px;display:inline-block;
  transition:transform .14s ease,box-shadow .14s ease,background .14s ease;}
.btn:hover{transform:translateY(-2px);}
.btn.primo{background:var(--ocra);color:#20150a;box-shadow:0 8px 20px rgba(214,162,74,.35);}
.btn.primo:hover{background:#e4b25c;color:#20150a;}
.btn.due{background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.5);}
.btn.due:hover{border-color:#fff;background:rgba(255,255,255,.08);color:#fff;}
.su-carta .btn.primo{background:var(--cobalto);color:#fff;box-shadow:0 8px 20px rgba(37,63,117,.28);}
.su-carta .btn.primo:hover{background:var(--cobalto-scuro);color:#fff;}
.su-carta .btn.due{color:var(--cobalto);border-color:var(--cobalto);}
.su-carta .btn.due:hover{background:rgba(37,63,117,.07);color:var(--cobalto);}

/* blocchi su carta */
.cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:1.3rem;margin-top:1.8rem;}
.card{background:var(--carta-2);border:1px solid var(--riga);border-radius:8px;padding:1.4rem 1.5rem;box-shadow:var(--ombra-s);}
.card .kaccento{width:34px;height:4px;border-radius:2px;background:var(--cobalto);margin-bottom:.9rem;}
.card p{font-size:.99rem;margin-bottom:0;}

/* schede volume */
.volumi{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1.5rem;margin-top:2rem;}
.vol{background:var(--carta-2);border:1px solid var(--riga);border-radius:10px;overflow:hidden;
  box-shadow:var(--ombra-s);display:flex;flex-direction:column;transition:transform .18s ease,box-shadow .18s ease;}
.vol:hover{transform:translateY(-4px);box-shadow:var(--ombra-m);}
.vol .testa{padding:1.3rem 1.4rem 1.2rem;color:#fff;position:relative;}
.vol .testa .num{font-family:"Carlito",Calibri,sans-serif;font-size:.7rem;letter-spacing:.2em;opacity:.8;}
.vol .testa h3{margin:.25rem 0 .15rem;color:inherit;font-size:1.5rem;}
.vol .testa .q{font-family:"Carlito",Calibri,sans-serif;font-size:.92rem;opacity:.94;}
.vol .corpo{padding:1.2rem 1.4rem 1.4rem;flex:1;display:flex;flex-direction:column;gap:.7rem;}
.vol .sub{font-style:italic;color:var(--grafite);font-size:.96rem;margin:0;}
.vol .blurb{font-size:.98rem;margin:0;}
.vol .stato{font-family:"Carlito",Calibri,sans-serif;font-size:.74rem;font-weight:700;text-transform:uppercase;
  letter-spacing:.12em;margin-top:auto;display:inline-flex;align-items:center;gap:.5rem;}
.vol .stato::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor;}
.vol .stato.pubblicato{color:var(--q-verde);}
.vol .stato.preparazione{color:var(--ocra-scuro);}
.testa.rosso{background:linear-gradient(155deg,#B23A33,var(--q-rosso));}
.testa.blu{background:linear-gradient(155deg,#31538f,var(--q-blu));}
.testa.verde{background:linear-gradient(155deg,#3a5641,var(--q-verde));}
.testa.arancio{background:linear-gradient(155deg,#EA7C42,var(--q-arancio));}
.testa.nero{background:linear-gradient(155deg,#333,var(--q-nero));}
.testa.giallo{background:linear-gradient(155deg,#efc463,var(--q-giallo));color:#2a2410;}
.testa.bianco{background:linear-gradient(155deg,#fff,#f1f0ea);color:var(--inchiostro);border-bottom:1px solid var(--riga);}
.testa.giallo .num,.testa.giallo .q{opacity:.85;}
.testa.bianco .num{color:var(--grafite);opacity:1;}

/* area docenti */
.schede{list-style:none;padding:0;margin:1.8rem 0 0;display:grid;gap:.8rem;}
.schede li{display:flex;align-items:center;gap:1rem;background:var(--carta-2);border:1px solid var(--riga);
  border-left:4px solid var(--cobalto);border-radius:8px;padding:1rem 1.2rem;box-shadow:var(--ombra-s);}
.schede .icona{font-family:"Carlito",Calibri,sans-serif;font-weight:700;font-size:.7rem;letter-spacing:.08em;
  color:var(--cobalto);border:1.5px solid var(--cobalto);border-radius:4px;padding:.24rem .46rem;flex:none;}
.schede .titolo{font-weight:700;}
.schede .meta{color:var(--grafite);font-size:.86rem;font-family:"Carlito",Calibri,sans-serif;}
.schede a.dl{margin-left:auto;flex:none;font-family:"Carlito",Calibri,sans-serif;font-weight:700;font-size:.86rem;
  text-decoration:none;background:var(--cobalto);color:#fff;padding:.5rem .9rem;border-radius:5px;}
.schede a.dl:hover{background:var(--cobalto-scuro);}
.avviso{background:var(--carta-2);border:1px dashed var(--cobalto);border-radius:8px;padding:1.1rem 1.3rem;
  color:var(--grafite);font-size:.96rem;}

.quota{border-left:3px solid var(--ocra);padding:.3rem 0 .3rem 1.2rem;font-style:italic;font-size:1.16rem;
  color:var(--inchiostro);max-width:var(--misura);margin:1.6rem 0;}

/* fascia scura interna */
.fascia{background:var(--cobalto-notte);color:#EDEFF5;}
.fascia .eyebrow{color:var(--ocra);}
.fascia h2{color:#fff;}
.fascia p{color:#CDD3E0;}

/* piè di pagina */
.foot{background:var(--cobalto-notte);color:#C9D0E0;font-family:"Carlito",Calibri,sans-serif;}
.foot .wrap{padding:2.8rem 0 2.6rem;display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:1.6rem;}
.foot h4{font-size:.74rem;text-transform:uppercase;letter-spacing:.16em;color:var(--ocra);margin:0 0 .7rem;}
.foot a{color:#E7EAF2;text-decoration:none;display:block;font-size:.92rem;padding:.18rem 0;}
.foot a:hover{color:#fff;}
.foot .claim{font-family:"Caladea",serif;color:#AEB6C8;max-width:34ch;}
.foot .fine{grid-column:1/-1;border-top:1px solid rgba(255,255,255,.12);padding-top:1.1rem;color:#8D96AB;
  font-size:.82rem;display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;}
.foot .fine p{margin:0;max-width:none;}

/* responsive */
@media (max-width:860px){
  .scaffale{grid-template-columns:repeat(4,1fr);gap:.7rem;}
  .libro{min-height:180px;}
  .foot .wrap{grid-template-columns:1fr 1fr;}
}
@media (max-width:520px){
  .scaffale{grid-template-columns:repeat(2,1fr);}
  .mensola{margin-top:-5rem;}
  .foot .wrap{grid-template-columns:1fr;}
}

@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto;}}
.libro{animation:sali .55s cubic-bezier(.2,.7,.2,1) both;}
.libro:nth-child(1){animation-delay:.05s}.libro:nth-child(2){animation-delay:.11s}
.libro:nth-child(3){animation-delay:.17s}.libro:nth-child(4){animation-delay:.23s}
.libro:nth-child(5){animation-delay:.29s}.libro:nth-child(6){animation-delay:.35s}
.libro:nth-child(7){animation-delay:.41s}
@keyframes sali{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}
:focus-visible{outline:2px solid var(--ocra);outline-offset:3px;border-radius:3px;}

/* hero ridotto per le pagine interne (senza scaffale sovrapposto) */
.hero.slim .wrap{padding-bottom:clamp(2.6rem,6vw,4.4rem);}
.hero.slim{border-bottom:1px solid rgba(255,255,255,.08);}
.hero.slim .lead{max-width:60ch;}
