/* trogloditi.com. Una sola legge: più una frase è semplice, più è grande. */
@font-face{font-family:Anton;src:url(/assets/fonts/anton.woff2) format("woff2");font-display:swap;font-weight:400}
@font-face{font-family:"Instrument Serif";src:url(/assets/fonts/instrument-serif-i.woff2) format("woff2");font-style:italic;font-display:swap;font-weight:400}
@font-face{font-family:"Instrument Sans";src:url(/assets/fonts/instrument-sans.woff2) format("woff2-variations");font-display:swap;font-weight:400 700}

:root{
  --ocra:#EFA82F;--carbone:#13110E;--carta:#FFF8E8;--notte:#0A1530;--ciano:#22B9E3;--ematite:#C4391F;--prugna:#240B14;--crema:#FFE3CF;
  --bordo:clamp(16px,4vw,56px);
  --c:clamp(36px,8vw,120px);
  --vero:Anton,Impact,"Arial Narrow",sans-serif;
  --guru:"Instrument Serif",Georgia,serif;
  --testo-f:"Instrument Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --fascia:56px;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:44px}
body{margin:0;background:var(--carbone);color:var(--carbone);font:400 17px/1.5 var(--testo-f);overflow-x:hidden;-webkit-font-smoothing:antialiased}
img,svg{display:block;max-width:100%}
a{color:inherit}
h1,h2,h3,p,ul,ol,figure{margin:0;padding:0}
ul,ol{list-style:none}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
main{transform-origin:50% 40%;overflow-x:clip}
:focus-visible{outline:3px solid currentColor;outline-offset:3px}
.nascosto{position:absolute!important;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}

/* Temi: ogni libro porta i suoi colori e il resto del sito resta uguale. */
.tema-seo{--fondo:var(--ocra);--inchiostro:var(--carbone);--forte:var(--carbone);--sasso:var(--carbone);--sasso2:#2a241b;--sasso-testo:var(--carta);--t1:var(--carbone);--t2:var(--carta);--btn:var(--carbone);--btn-testo:var(--ocra)}
.tema-bitcoin{--fondo:var(--notte);--inchiostro:var(--carta);--forte:var(--ciano);--sasso:var(--ciano);--sasso2:#4cc9ec;--sasso-testo:var(--notte);--t1:var(--carta);--t2:var(--ciano);--btn:var(--ciano);--btn-testo:var(--notte)}
.tema-ai{--fondo:var(--ematite);--inchiostro:#FFF3E6;--forte:var(--crema);--sasso:var(--prugna);--sasso2:#3b1725;--sasso-testo:var(--crema);--t1:var(--crema);--t2:var(--prugna);--btn:var(--prugna);--btn-testo:var(--crema)}
.tema-carbone{--fondo:var(--carbone);--inchiostro:var(--carta);--forte:var(--ocra);--sasso:var(--ocra);--sasso2:#f6bd55;--sasso-testo:var(--carbone);--t1:var(--ocra);--t2:var(--carta);--btn:var(--ocra);--btn-testo:var(--carbone)}
.tema-notte{--fondo:var(--notte);--inchiostro:var(--carta);--forte:var(--ciano);--sasso:var(--ciano);--sasso2:#4cc9ec;--sasso-testo:var(--notte);--t1:var(--carta);--t2:var(--ciano);--btn:var(--ciano);--btn-testo:var(--notte)}
.tema-carta{--fondo:var(--carta);--inchiostro:var(--carbone);--forte:var(--carbone);--sasso:var(--carbone);--sasso2:#2a241b;--sasso-testo:var(--carta);--t1:var(--carbone);--t2:var(--ocra);--btn:var(--carbone);--btn-testo:var(--carta)}
[class*="tema-"]{background-color:var(--fondo);color:var(--inchiostro)}

/* Pulsanti */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5em;min-height:52px;padding:.7em 1.15em;background:var(--btn);color:var(--btn-testo);font:600 16px/1.2 var(--testo-f);text-decoration:none;text-align:center;clip-path:polygon(0 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%);transition:transform .12s}
.btn:hover{transform:translateY(-2px)}
.btn:active{transform:translateY(1px)}
.btn--vuoto{background:none;color:inherit;clip-path:none;box-shadow:inset 0 0 0 2px currentColor}
.btn[disabled]{opacity:.6}

/* Logo: la O bucata lascia vedere il colore del libro. */
.logo{display:inline-flex;align-items:baseline;gap:.05em;font:400 clamp(21px,2.4vw,27px)/1 var(--vero);letter-spacing:.02em;text-decoration:none;color:inherit}
.logo small{font-size:.52em;letter-spacing:.06em;opacity:.8}
.testata{display:flex;align-items:center;justify-content:space-between;padding:16px var(--bordo) 0}
.testata nav{display:flex;gap:clamp(14px,2.4vw,28px);font-weight:600;font-size:15px}
.testata nav a{text-decoration:none}
.testata nav a:hover{text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:2px}

/* ── Apertura ─────────────────────────────────────────── */
.apertura{--h:19.6vw;--righe:3;--cima:58px;--centro:calc(var(--cima) + var(--h) * var(--righe) * .54);--pendenza:8.5vw;position:relative;min-height:100vh;min-height:100svh;overflow:hidden;background:var(--ocra);isolation:isolate}
.strato{position:relative;min-height:inherit;display:flex;flex-direction:column;padding-bottom:calc(53vw + 18px)}
.strato--a{--fondo:var(--ocra);background:var(--ocra);color:var(--carbone)}
.strato--b{position:absolute;inset:0;background:var(--notte);color:var(--carta);clip-path:polygon(0 calc(var(--centro) + var(--pendenza)),100% calc(var(--centro) - var(--pendenza)),100% 100%,0 100%);pointer-events:none}
.strato--b .logo,.strato--b nav{visibility:hidden}
.titolo{font:400 var(--h)/1.08 var(--vero);text-transform:uppercase;letter-spacing:.002em;padding:10px var(--bordo) 0;min-height:calc(var(--h) * var(--righe) * 1.08 + 10px)}
.titolo .p{display:inline-block}
.apertura__sotto{padding:clamp(12px,2vw,20px) var(--bordo) 0;font-size:clamp(17px,2.1vw,23px);line-height:1.34;max-width:34em;font-weight:500}
.apertura__sotto strong{font-weight:700}
.apertura__azione{display:flex;flex-wrap:wrap;gap:10px;padding:clamp(14px,2vw,22px) var(--bordo) 0}
.apertura .apertura__rivedi{min-width:0;padding-inline:1em}
.strato--a{--btn:var(--carbone);--btn-testo:var(--ocra)}
.strato--b{--btn:var(--ciano);--btn-testo:var(--notte)}
.apertura .btn{min-width:210px;font:400 clamp(21px,2.4vw,26px)/1 var(--vero);text-transform:uppercase;letter-spacing:.015em}

/* Il film dell'apertura: tre colpi, poi il titolo. */
.tavola--apertura{display:none}
.film .tavola--apertura,.film-fine .tavola--apertura{display:block;position:absolute;z-index:3;left:var(--bordo);right:var(--bordo);top:var(--cima);height:calc(var(--h) * var(--righe) * 1.08 + 10px)}
.film .titolo{color:var(--ocra)}
.film .apertura__rivedi{visibility:hidden}
.film:not(.pronto) .tavola--apertura .cioe{visibility:hidden}
.film .strato--b{clip-path:polygon(0 100%,100% 100%,100% 100%,0 100%)}
.film-fine .tavola--apertura .palco{opacity:0}
.film .strato--a{--sasso:var(--carbone)}
.js .tavola--apertura .palco{--pavimento:0px;height:calc(100% - 26px);max-width:680px;--sasso:var(--carbone);--sasso2:#2a241b;--sasso-testo:var(--carta)}
.tavola--apertura .tavola__comandi{position:absolute;right:0;bottom:0;margin:0;z-index:4}
.film-fine .tavola--apertura .tavola__comandi{display:none}
.tavola--apertura .cioe{flex:none;min-height:0;padding:.22em .62em;font-size:clamp(23px,6vw,36px);--btn:var(--carta);--btn-testo:var(--carbone)}
.apertura>.mucchio{position:absolute;inset:0;z-index:4}

.scaffale{position:absolute;z-index:2;left:0;right:0;bottom:-4vw;display:flex;align-items:flex-end;justify-content:space-between;gap:2.4vw;padding:0 var(--bordo)}
.scaffale a{display:block;flex:0 0 37.5vw;transition:transform .16s;text-decoration:none;transform-origin:50% 100%}
.scaffale a:first-child{transform:rotate(-2deg)}
.scaffale a:nth-child(2){transform:rotate(1.2deg)}
.scaffale a:nth-child(3){flex-basis:17vw;transform:rotate(3deg)}
.scaffale a:hover{transform:translateY(-12px) rotate(-1deg);z-index:4}
.scaffale img,.copertina-ai{aspect-ratio:2/3;width:100%;height:auto;box-shadow:0 0 0 1px rgba(255,248,232,.14),0 12px 30px rgba(0,0,0,.42)}

/* Copertina del libro in arrivo: ancora da finire. */
.copertina-ai{position:relative;display:flex;flex-direction:column;justify-content:space-between;background:var(--ematite);color:var(--crema);padding:9% 8%;container-type:inline-size;overflow:hidden}
.copertina-ai b{font:400 44cqw/1 var(--vero);background:linear-gradient(112deg,var(--crema) 49.6%,var(--prugna) 50%);-webkit-background-clip:text;background-clip:text;color:transparent}
.copertina-ai span{font:400 12.4cqw/1.05 var(--vero);text-transform:uppercase;color:var(--prugna)}
.copertina-ai em{font:600 7.4cqw/1.2 var(--testo-f);font-style:normal;background:var(--prugna);color:var(--crema);padding:.5em .6em;align-self:flex-start}

/* ── Stanze ───────────────────────────────────────────── */
.stanza{position:relative;padding:calc(var(--c) + clamp(28px,5vw,64px)) var(--bordo) clamp(90px,12vw,170px);margin-top:calc(var(--c) * -1);clip-path:polygon(0 var(--c),100% 0,100% 100%,0 100%)}
.stanza:nth-of-type(n){z-index:1}
.occhiello{font:600 14px/1.2 var(--testo-f);letter-spacing:.08em;text-transform:uppercase}
.parolona{--s:calc(90vw / (var(--n) * .47));font:400 min(var(--s),400px)/1.06 var(--vero);text-transform:uppercase;background:linear-gradient(112deg,var(--t1) 49.7%,var(--t2) 50%);-webkit-background-clip:text;background-clip:text;color:transparent;width:fit-content;padding-right:.04em;margin-top:6px}
.parolona a{color:inherit;text-decoration:none}
.titolo-libro{font:inherit}
.titolo-libro a{color:inherit;text-decoration:none}
.titolo-libro .parolona,.titolo-libro .sottoparola{display:block}
.sottoparola{font:400 clamp(30px,5.4vw,64px)/1.1 var(--vero);text-transform:uppercase;margin-top:-.1em}
.sottoparola{-webkit-text-fill-color:currentColor}
.stanza__testa{margin-bottom:clamp(22px,3.4vw,40px)}
.attacco{font-size:clamp(19px,2.3vw,26px);line-height:1.34;font-weight:500;max-width:30em;margin-top:14px}
.scheda{display:grid;gap:clamp(26px,4vw,48px);margin-top:clamp(34px,5vw,64px)}
.scheda .libro{width:min(62vw,280px)}
.scheda .formati{margin-top:0}

/* Il libro: sottile davvero, lo spessore viene dalle pagine. */
.libro{position:relative;display:block;transform:rotate(-2.2deg);transition:transform .18s}
.libro:hover{transform:rotate(0) translateY(-6px)}
.libro img{width:100%;height:auto;aspect-ratio:2/3;box-shadow:calc(var(--sp,8px) * -.1) 2px 0 rgba(255,255,255,.28) inset,18px 22px 34px rgba(0,0,0,.36)}

/* ── La tavola: frase, masso, bottone ─────────────────── */
.tavola{position:relative}
.tavola__livelli{display:grid;gap:14px;font-size:19px}
.tavola__livelli li:first-child .t{font:italic 400 1.1em/1.3 var(--guru)}
.tavola__livelli li:last-child .t{font:400 clamp(34px,7vw,64px)/1.1 var(--vero);text-transform:uppercase;display:block}
.etichetta{display:block;font:600 13px/1.2 var(--testo-f);letter-spacing:.08em;text-transform:uppercase;opacity:.75;margin-bottom:2px}
.js .tavola__livelli{display:none}
.tavola__comandi,.palco{display:none}
.js .palco{--pavimento:62px;display:block;position:relative;height:clamp(380px,64vh,560px)}
.js .tavola__comandi{display:flex;flex-wrap:wrap;align-items:center;gap:12px 18px;margin-top:14px}
.masso,.masso--meta{position:absolute;inset:0 0 var(--pavimento) 0;background:var(--sasso);transition:clip-path .32s cubic-bezier(.2,.8,.2,1)}
.masso::before{content:"";position:absolute;inset:0;background:var(--sasso2);clip-path:polygon(0 0,46% 0,30% 100%,0 100%);opacity:.8}
.masso--meta{transition:none;z-index:2}
.frase{position:absolute;left:0;right:0;top:calc(50% - var(--pavimento) / 2);transform:translateY(-50%);z-index:1;margin:0 auto;width:fit-content;text-wrap:balance}
.frase .p{display:inline-block;will-change:transform}
.frase[data-voce=guru]{font:italic 400 1em/1.24 var(--guru);color:var(--sasso-testo)}
.frase[data-voce=chiara]{font:600 1em/1.2 var(--testo-f);color:var(--sasso-testo);letter-spacing:-.01em}
.frase[data-voce=ah]{font:400 1em/1.15 var(--vero);color:var(--t1);text-transform:uppercase;text-align:left}
.frase--tagliata .p{will-change:auto}
.frase--tagliata{background:linear-gradient(112deg,var(--t1) 49.7%,var(--t2) 50%);-webkit-background-clip:text;background-clip:text;color:transparent!important}
.mucchio{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:2}
.maceria{position:absolute;white-space:nowrap;color:var(--sasso-testo);line-height:1.1;padding:1px 3px;transition:color .12s}
.maceria--giu{color:var(--inchiostro)}
.maceria--viva{pointer-events:auto;cursor:pointer;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.scheggia{position:absolute;z-index:3;background:var(--sasso);clip-path:polygon(50% 0,100% 80%,0 100%);pointer-events:none}
.cioe{min-height:64px;flex:1 1 220px;max-width:420px;padding:.2em .9em;background:var(--btn);color:var(--btn-testo);font:400 clamp(28px,4.2vw,38px)/1.1 var(--vero);text-transform:uppercase;letter-spacing:.01em;clip-path:polygon(0 0,100% 0,100% calc(100% - 16px),calc(100% - 16px) 100%,0 100%);transition:transform .08s}
.cioe:active,.cioe.premuto{transform:scale(.95)}
.annuisco{min-height:44px;padding:0 4px;font-size:15px;font-weight:600;text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
.rimetti{display:none;min-height:44px;font-size:15px;font-weight:600;text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
.tavola--finita .rimetti{display:inline-block}
.riga-maceria{min-height:1.5em;font-size:16px;font-weight:600;margin-top:6px}
.riga-maceria:empty{display:none}
.tavola__dopo{margin-top:16px}
.js .tavola__dopo{visibility:hidden;height:0;overflow:hidden}
.js .tavola--finita .tavola__dopo{visibility:visible;height:auto;animation:timbro .18s ease-out}
.tavola__dopo p{font:400 clamp(26px,4.6vw,44px)/1.14 var(--vero);text-transform:uppercase}
@keyframes timbro{from{transform:scale(1.08);opacity:0}}

/* ── Formati ──────────────────────────────────────────── */
.formati{display:grid;gap:12px;margin-top:clamp(28px,4vw,48px)}
.formato{display:flex;flex-direction:column;gap:10px;padding:18px;background:color-mix(in srgb,var(--inchiostro) 9%,var(--fondo));clip-path:polygon(0 0,100% 0,100% calc(100% - 18px),calc(100% - 18px) 100%,0 100%)}
.formato .formato__nome{font:400 clamp(25px,3vw,32px)/1.1 var(--vero);text-transform:uppercase}
.formato p{font-size:17px;margin-bottom:auto}
.formato .btn{width:100%}
.nota-amazon{margin-top:14px;font-size:14px;line-height:1.4;max-width:46em}
.scheda .nota-amazon{margin:0 0 12px}
.formato .nota-sm,.foglio .nota-sm{font-size:14px;margin:0}
.btn--attesa{opacity:.6;pointer-events:none}

/* ── Sezioni di testo ─────────────────────────────────── */
.sezione{position:relative;z-index:1;padding:calc(var(--c) + clamp(30px,6vw,70px)) var(--bordo) clamp(70px,10vw,140px);margin-top:calc(var(--c) * -1);clip-path:polygon(0 var(--c),100% 0,100% 100%,0 100%)}
.titolone{font:400 clamp(40px,8.6vw,110px)/1.06 var(--vero);text-transform:uppercase;max-width:12em}
.titolone--medio{font-size:clamp(34px,6vw,70px)}
.titolone--piccolo{font-size:clamp(30px,5vw,54px)}
.lettura{max-width:38em;margin-top:10px;font-size:clamp(18px,2vw,21px);line-height:1.5}
.firma{margin-top:clamp(20px,3vw,30px);font:italic 400 18px/1.3 var(--guru)}
.parola-prima{min-height:calc(100svh - 40px)}
.pagina-piena{min-height:100vh}
.stanza.stanza--pagina{clip-path:none;margin-top:0;padding-top:22px;background:none}
.occhiello a{text-decoration:none}
.titolone--taglio{background:linear-gradient(112deg,var(--t1) 49.7%,var(--t2) 50%);-webkit-background-clip:text;background-clip:text;color:transparent}
.sottotitolo{font-size:clamp(19px,2.3vw,26px);font-weight:500;line-height:1.34;max-width:32em;margin-top:12px}
.spazio{margin-top:clamp(26px,4vw,44px)}

/* Definizione */
.voce{max-width:980px}
.voce__parola{font:400 clamp(66px,17.4vw,230px)/1.06 var(--vero)}
.voce__tipo{font:italic 400 clamp(20px,2.6vw,28px)/1.2 var(--guru);margin:4px 0 22px}
.voce ol{display:grid;gap:clamp(14px,2vw,22px);counter-reset:n}
.voce li{counter-increment:n;display:grid;grid-template-columns:auto 1fr;gap:.6em;font:500 clamp(21px,3.1vw,36px)/1.22 var(--testo-f)}
.voce li::before{content:counter(n) ".";font:400 1em/1.22 var(--vero);color:var(--ematite)}
.fregio{margin-top:clamp(40px,7vw,90px)}
.fregio img{width:100%;max-width:880px}
.fregio p{font:400 clamp(26px,4.4vw,54px)/1.14 var(--vero);text-transform:uppercase;margin-top:18px;max-width:17em}

/* Tavole dentro le sezioni: non serve un masso largo come lo schermo. */
.sezione .palco,.parola-testa .palco{max-width:820px}
.sezione .tavola__comandi,.parola-testa .tavola__comandi{max-width:820px}

/* Scappa */
.scappa-pila{display:grid;gap:clamp(30px,5vw,56px);margin-top:clamp(26px,4vw,44px)}
.scappa-pila .frase[data-voce=ah]{color:var(--t1)}

/* Parole */
.parole{display:flex;flex-wrap:wrap;gap:8px 10px;margin-top:clamp(20px,3vw,32px)}
.parole a{display:inline-flex;align-items:center;min-height:44px;padding:.1em .6em;font:400 clamp(21px,2.6vw,28px)/1.2 var(--vero);text-transform:uppercase;text-decoration:none;background:var(--sasso);color:var(--sasso-testo);transition:transform .1s}
.parole a:hover{transform:translateY(-2px) rotate(-1deg)}

/* Domande */
.domande{display:grid;gap:clamp(18px,2.4vw,28px);max-width:820px;margin-top:clamp(24px,3vw,36px)}
.domande h3{font:400 clamp(25px,3vw,32px)/1.16 var(--vero);text-transform:uppercase}
.domande p{margin-top:4px;font-size:18px}

/* Elenchi delle pagine libro */
.elenco{display:grid;gap:10px;margin-top:16px;max-width:760px}
.elenco li{display:grid;grid-template-columns:18px 1fr;gap:10px;font-size:19px;line-height:1.36}
.elenco li::before{content:"";width:12px;height:12px;margin-top:.42em;background:var(--forte);clip-path:polygon(0 0,100% 0,100% 62%,62% 100%,0 100%)}

/* La pila dei dorsi: lo spessore viene dalle pagine vere. */
.pila{display:grid;gap:3px;margin-top:clamp(24px,3vw,36px)}
.dorso{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:0 clamp(14px,3vw,34px);min-height:44px;height:calc(var(--pagine) * .62px);text-decoration:none;font:400 clamp(21px,3.2vw,40px)/1 var(--vero);text-transform:uppercase;transition:transform .14s}
.dorso:hover{transform:translateX(clamp(8px,2vw,26px))}
.dorso small{font:600 12px/1 var(--testo-f);letter-spacing:.24em;white-space:nowrap}
.dorso--arrivo{outline:2px dashed var(--crema);outline-offset:-6px}

/* Piede */
.piede{position:relative;z-index:1;padding:clamp(30px,5vw,50px) var(--bordo) calc(var(--fascia) + 30px + env(safe-area-inset-bottom));font-size:15px;line-height:1.5}
.piede__conto{font:400 clamp(24px,3.6vw,40px)/1.16 var(--vero);text-transform:uppercase;max-width:20em}
.piede__tuo{font:400 clamp(21px,3vw,32px)/1.16 var(--vero);text-transform:uppercase;color:var(--ocra);margin-top:8px}
.piede__colofone{font:italic 400 19px/1.3 var(--guru);margin-top:12px}
.piede__righe{display:grid;gap:8px;margin-top:22px;max-width:60em;opacity:.85}
.piede nav{display:flex;flex-wrap:wrap;gap:6px 18px;margin-top:16px;font-weight:600}

/* Fascia: la striscia nera della copertina diventa la barra di acquisto. */
.fascia{position:fixed;z-index:30;left:0;right:0;bottom:0;height:calc(var(--fascia) + env(safe-area-inset-bottom));visibility:hidden;display:flex;align-items:center;gap:10px;padding:0 10px 0 var(--bordo);padding-bottom:env(safe-area-inset-bottom);background:var(--carbone);color:var(--carta);transform:translateY(100%);transition:transform .2s,visibility .2s}
.fascia--vista{transform:none;visibility:visible}
.fascia__copertina{width:30px;height:45px;object-fit:cover;flex:none}
.fascia__titolo{flex:1;min-width:0;font:400 19px/1.1 var(--vero);letter-spacing:.015em;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fascia__compra{flex:none;height:42px;padding:0 20px;background:var(--ocra);color:var(--carbone);font:400 21px/1 var(--vero);text-transform:uppercase;clip-path:polygon(0 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%)}
.evoluto{position:fixed;z-index:29;left:0;bottom:calc(var(--fascia) + env(safe-area-inset-bottom));width:40px;height:30px;pointer-events:none;opacity:0;transition:opacity .2s;mix-blend-mode:difference}
.fascia--vista~.evoluto{opacity:1}
.evoluto svg{position:absolute;left:0;bottom:0;height:30px;width:auto;fill:#fff;visibility:hidden}
.evoluto svg.attiva{visibility:visible}

/* La versione per esperti: il grigio esiste solo qui. */
.piede__esperti{font-weight:600;text-decoration:underline;text-underline-offset:4px;color:var(--ocra)}
.in-esperti,.in-esperti body{overflow:hidden}
.in-esperti .fascia,.in-esperti .evoluto{visibility:hidden}
.esperti{position:fixed;inset:0;z-index:60;overflow:auto;background:#f5f6f8;color:#6b7280;font:400 15px/1.55 Arial,Helvetica,sans-serif}
.esperti[hidden]{display:none}
.esperti__avviso{position:sticky;top:0;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 16px;background:var(--carbone);color:var(--carta);font:600 14px/1.25 var(--testo-f)}
.esperti__avviso .cioe{flex:none;min-height:42px;padding:0 .8em;font-size:22px;--btn:var(--ocra);--btn-testo:var(--carbone)}
.esperti__cookie{padding:8px 16px;background:#e5e7eb;font-size:13px;text-align:center}
.esperti__testa{display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px 24px;padding:16px clamp(16px,6vw,80px);background:#fff;border-bottom:1px solid #e5e7eb;font-size:14px}
.esperti__testa b{color:#374151}
.esperti__eroe{display:grid;gap:24px;align-items:center;padding:clamp(30px,6vw,70px) clamp(16px,6vw,80px)}
.esperti__eroe h2{font:400 clamp(24px,3.2vw,36px)/1.25 Arial,Helvetica,sans-serif;color:#374151}
.esperti__eroe p{margin:12px 0 20px}
.esperti__bottone{display:inline-block;padding:10px 20px;background:#2563eb;color:#fff;border-radius:4px}
.esperti__foto{min-height:220px;border-radius:6px;background:linear-gradient(135deg,#dbe2ea,#c3ccd6)}
.esperti__colonne{display:grid;gap:18px;padding:0 clamp(16px,6vw,80px) 40px}
.esperti__colonne div{padding:20px;background:#fff;border:1px solid #e5e7eb;border-radius:6px}
.esperti__colonne h3{font:700 16px/1.3 Arial,Helvetica,sans-serif;color:#374151;margin-bottom:6px}
.esperti__voce{padding:40px clamp(16px,6vw,80px);background:#fff;text-align:center}
.esperti__voce p{font-size:21px;color:#374151}
.esperti__piede{padding:20px clamp(16px,6vw,80px);font-size:12px}

/* Foglio dei formati e scontrino */
dialog{border:0;padding:0;color:inherit}
dialog::backdrop{background:rgba(19,17,14,.62)}
.foglio{position:fixed;inset:auto 0 0 0;width:100%;max-width:560px;max-height:86vh;margin:0 auto;padding:18px var(--bordo) calc(22px + env(safe-area-inset-bottom));overscroll-behavior:contain;background:var(--carbone);color:var(--carta);overflow:auto;--btn:var(--ocra);--btn-testo:var(--carbone)}
.foglio h2{font:400 26px/1.15 var(--vero);text-transform:uppercase;padding-right:64px;margin-top:6px}
.foglio [data-pannello]+[data-pannello]{margin-top:20px}
.foglio__chiudi{position:absolute;right:10px;top:8px;min-height:44px;padding:0 10px;font:700 15px/1 var(--testo-f);text-decoration:underline;text-underline-offset:3px}
.foglio ul{display:grid;gap:10px;margin-top:14px}
.foglio li{display:grid;gap:6px}
.foglio li b{font:400 21px/1.15 var(--vero);text-transform:uppercase}
.foglio .btn{width:100%}
.foglio .nota-amazon{font-size:13px;opacity:.85}
.scontrino{width:min(330px,calc(100vw - 32px));padding:20px 18px 14px;background:#fffdf6;color:#1b1b1b;font:400 14px/1.45 ui-monospace,"Cascadia Mono",Consolas,monospace;margin:auto;clip-path:polygon(0 0,100% 0,100% calc(100% - 8px),95% 100%,90% calc(100% - 8px),85% 100%,80% calc(100% - 8px),75% 100%,70% calc(100% - 8px),65% 100%,60% calc(100% - 8px),55% 100%,50% calc(100% - 8px),45% 100%,40% calc(100% - 8px),35% 100%,30% calc(100% - 8px),25% 100%,20% calc(100% - 8px),15% 100%,10% calc(100% - 8px),5% 100%,0 calc(100% - 8px))}
.scontrino[open]{animation:sale .26s cubic-bezier(.2,.8,.2,1)}
.scontrino h2{font:700 15px/1.3 ui-monospace,"Cascadia Mono",Consolas,monospace;text-align:center;letter-spacing:.06em;border-bottom:1px dashed #1b1b1b;padding-bottom:8px;margin-bottom:8px}
.scontrino__righe{display:grid;gap:6px}
.scontrino__chiudi{display:block;width:100%;min-height:44px;margin-top:10px;font-weight:700;text-decoration:underline}
@keyframes sale{from{transform:translateY(60px)}}

/* Moduli */
.modulo{display:grid;gap:10px;max-width:480px;margin-top:18px}
.modulo label{display:grid;gap:4px;font-size:15px;font-weight:600}
.modulo input,.modulo textarea{width:100%;min-height:52px;padding:.7em .8em;font:400 17px/1.3 var(--testo-f);color:var(--carbone);background:var(--carta);border:2px solid var(--carbone);border-radius:0}
.modulo .btn{width:100%}
.modulo .trappola{position:absolute;left:-9999px}
.esito{font-weight:600;min-height:1.5em}
.totale{font-weight:700;font-size:19px}
.form--fatto input,.form--fatto textarea,.form--fatto button,.form--fatto label{display:none}
.privacy-breve{font-size:14px}
.due{display:grid;gap:10px}

/* Pagine di testo */
.testo{max-width:720px}
.testo h2{font:400 clamp(25px,3.4vw,34px)/1.16 var(--vero);text-transform:uppercase;margin:32px 0 6px}
.testo p{margin-top:10px}
.sintesi{font-weight:500;font-size:19px}

/* Pagina di una parola */
.parola-testa{padding:18px var(--bordo) clamp(30px,6vw,60px)}
.parola-testa .tavola{margin-top:20px}
.parola-testa h1{font:400 clamp(34px,7.6vw,84px)/1.08 var(--vero);text-transform:uppercase;margin-top:14px}
.per-chi-riceve{font-size:18px;font-weight:500;margin-top:8px;max-width:34em}
.manda{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}

/* La striscia per scegliere il libro */
.salta{position:sticky;top:0;z-index:20;display:flex;background:var(--carbone)}
.salta a{flex:1;min-height:44px;display:grid;place-items:center;font:400 19px/1 var(--vero);letter-spacing:.02em;text-transform:uppercase;color:var(--carta);text-decoration:none}

/* Dopo il masso: il libro */
.dopo-libro{display:grid;grid-template-columns:72px minmax(0,1fr);gap:14px;align-items:center}
.dopo-libro .libro{transform:rotate(-3deg)}
.dopo-libro p{margin-bottom:10px}
.tavola__dopo{scroll-margin-bottom:calc(var(--fascia) + 14px)}

/* Pagina d'ordine */
.ordine__libro{width:min(38vw,150px);margin-top:18px}

/* Lista d'attesa */
.lista-riga{display:grid;gap:10px}

@media (min-width:760px){
  body{font-size:18px}
  .apertura{--h:12.7vw;--righe:2;--cima:66px;--pendenza:7vw}
  .strato{padding-bottom:clamp(120px,14vw,220px)}
  .apertura__sotto{max-width:27em}
  .scaffale{justify-content:flex-end;gap:1.6vw;bottom:-5vw}
  .scaffale a{flex-basis:clamp(170px,17vw,250px)}
  .scaffale a:nth-child(3){flex-basis:clamp(100px,10vw,150px)}
  .stanza__griglia{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(24px,4vw,64px);align-items:start}
  .stanza__griglia .parolona{--s:calc(40vw / (var(--n) * .47))}
  .stanza__testa{margin-bottom:0;position:sticky;top:24px}
  .scheda{grid-template-columns:clamp(220px,26vw,340px) minmax(0,1fr);align-items:start}
  .scheda .libro{width:100%}
  .formati{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
  .due{grid-template-columns:1fr 1fr}
  .esperti__eroe{grid-template-columns:1.1fr 1fr}
  .esperti__colonne{grid-template-columns:repeat(3,1fr)}
  .lista-riga{grid-template-columns:1fr auto}
  .js .palco{height:clamp(400px,62vh,600px)}
  .sezione .palco{height:clamp(340px,50vh,440px)}
  .foglio{bottom:auto;top:50%;transform:translateY(-50%)}
  .tavola--apertura .tavola__comandi{right:auto;left:calc(min(680px,100%) - 120px)}
}
@media (min-width:1100px){
  .apertura{--h:12.2vw}
  .stanza,.sezione{padding-left:max(var(--bordo),calc((100vw - 1320px)/2));padding-right:max(var(--bordo),calc((100vw - 1320px)/2))}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
}

/* Revisione finale */
.sezione>.stanza__testa .libro{width:min(62vw,280px);margin-top:24px}
.scaffale img{box-shadow:0 0 0 2px rgba(255,248,232,.34),0 14px 34px rgba(0,0,0,.55)}
.tavola--finita .annuisco{display:none}
.tavola--finita .cioe{flex:0 1 46%}
.titolone,.fregio p,.tavola__dopo p,.piede__conto,.sottotitolo{text-wrap:balance}
.formati{grid-auto-rows:auto;gap:12px}
.formato{display:grid;grid-row:span 5;grid-template-rows:subgrid;gap:10px;align-content:start}
.formato p{margin-bottom:0}
.testata nav a{display:inline-block;padding:12px 4px;margin:-12px -4px}
.logo{padding-block:8px;margin-block:-8px}
.piede nav{gap:0 18px}
.piede nav a,.piede nav button{display:inline-block;padding:10px 0}
main>.sezione:last-child{padding-bottom:clamp(30px,4vw,48px)}
.scappa-pila .tavola:nth-child(even) .masso,.giro .tavola:nth-child(even) .masso{transform:scaleX(-1)}
.per-chi-riceve:not([hidden])~.tavola .palco{height:clamp(300px,46svh,420px)}
html:has(dialog[open]){overflow:hidden}
.scontrino{overscroll-behavior:contain}
@media (max-width:759px){
  .film .tavola--apertura{top:calc(var(--cima) - 18px)}
}
@media (max-width:759px) and (min-height:720px){
  .scaffale{bottom:calc(var(--c) + 8px)}
}
@media (max-width:759px) and (max-height:700px){
  .js .palco{height:clamp(340px,56vh,560px)}
}
@media (min-width:760px){
  .scaffale a{flex-basis:clamp(170px,max(17vw,min(32vw,25vh)),250px)}
  .scaffale a:nth-child(3){flex-basis:clamp(130px,13vw,190px)}
  .sezione>.stanza__testa{position:static;display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:56px;align-items:center;margin-bottom:0}
  .sezione>.stanza__testa .libro{width:100%;margin-top:0}
  .js .palco{--pavimento:92px}
  .js .tavola--apertura .palco{--pavimento:0px}
  .domande--colonne{max-width:none;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:22px 40px}
  .parola-testa:has(.ordine__libro){display:grid;grid-template-columns:minmax(0,480px) 300px;gap:0 72px;align-items:start}
  .parola-testa:has(.ordine__libro) h1,.parola-testa:has(.ordine__libro) .sottotitolo{grid-column:1/-1}
  .ordine__libro{grid-column:2;grid-row:3;width:100%}
}
@media (min-width:1100px){
  .scappa-pila{grid-template-columns:repeat(3,minmax(0,1fr));align-items:start}
  .scappa-pila .tavola__comandi{flex-wrap:wrap}
}
/* Il taglio delle parole giganti si apre mentre scorri. Chi non lo supporta vede il taglio fermo. */
@property --taglio{syntax:'<percentage>';inherits:false;initial-value:49.7%}
@media (prefers-reduced-motion:no-preference){
  @supports (animation-timeline:view()){
    .parolona{background-image:linear-gradient(112deg,var(--t1) var(--taglio),var(--t2) calc(var(--taglio) + .3%));animation:taglio linear both;animation-timeline:view();animation-range:entry 0% cover 42%}
    @keyframes taglio{from{--taglio:0%}to{--taglio:49.7%}}
  }
}