/* =========================================================
   LIBRO — foglio di stile condiviso dalle pagine /libri/*.html
   Stessi token del sito principale (index.html), versione
   "leggera": niente preloader né GSAP. Cursore custom e alone
   rosso sì (asset/js/cursor.js), riscritti senza dipendenze.
   ========================================================= */
:root{
  --paper:#F2EEE5;
  --paper-2:#E9E3D6;
  --ink:#15120D;
  --ink-2:#1A1712;
  --smoke:#6B6357;
  --smoke-dark:#948B7C;
  --accent:#A81729;
  --accent-h:#C8283C;
  --line:rgba(21,18,13,.15);
  --line-d:rgba(242,238,229,.15);
  --glow:rgba(168,23,41,.19);

  --f-display:"Bricolage Grotesque","Space Grotesk",system-ui,sans-serif;
  --f-mono:"Space Mono",ui-monospace,monospace;

  --pad:clamp(20px,5vw,88px);
  --ease:cubic-bezier(.2,.7,.2,1);
}

*{margin:0;padding:0;box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  font-family:var(--f-display);
  font-weight:400;
  background:var(--paper);
  color:var(--ink);
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{display:block;width:100%;height:100%;object-fit:cover}
a{color:inherit;text-decoration:none}
::selection{background:var(--accent);color:var(--ink)}

/* grana leggera, puro CSS, nessun JS */
body::before{
  content:"";position:fixed;inset:0;z-index:1;pointer-events:none;opacity:.35;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.35'/%3E%3C/svg%3E");
  mix-blend-mode:multiply;
}
/* alone rosso che segue il mouse, come nel sito principale (asset/js/cursor.js) */
body::after{
  content:"";position:fixed;inset:0;z-index:1;pointer-events:none;
  opacity:0;transition:opacity .6s var(--ease);
  background:radial-gradient(480px 480px at var(--msx,50%) var(--msy,50%),var(--glow),transparent 70%);
}
body.is-glowing::after{opacity:1}

.mono{font-family:var(--f-mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase}
.eyebrow{font-family:var(--f-mono);font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--accent)}

/* ========================= HEADER ========================= */
.site-header{
  position:sticky;top:0;z-index:20;
  display:flex;align-items:center;justify-content:space-between;gap:20px;
  padding:20px var(--pad);
  background:var(--paper);border-bottom:1px solid var(--line);
  flex-wrap:wrap;
}
.site-header__mark{font-size:15px;letter-spacing:.02em;font-weight:500}
.site-header__mark b{color:var(--accent)}
.site-header__nav{display:flex;gap:22px;flex-wrap:wrap}
.site-header__nav a{font-family:var(--f-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;position:relative;transition:color .3s var(--ease)}
.site-header__nav a::after{content:"";position:absolute;left:0;bottom:-4px;width:0;height:1px;background:currentColor;transition:width .3s var(--ease)}
.site-header__nav a:hover{color:var(--accent)}
.site-header__nav a:hover::after{width:100%}
.site-header__social{display:flex;align-items:center;gap:14px}
.site-header__social a{display:flex;color:var(--accent);opacity:.85;transition:opacity .3s var(--ease)}
.site-header__social a:hover{opacity:1}
.site-header__social svg{width:13px;height:13px;fill:currentColor}
@media(max-width:640px){.site-header__social{display:none}}

/* ========================= SHELL ========================= */
.section{position:relative;z-index:2;padding:clamp(50px,8vh,100px) var(--pad)}
.section--dark{background:var(--ink-2);color:var(--paper)}
.section--dark .eyebrow{color:var(--accent)}
/* lo sfondo opaco di .section--dark (ed. il footer) copre l'alone globale
   (body::after): lo ricreiamo qui in locale, stessa tecnica di index.html */
.section--dark::before,
.site-footer::before{
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  opacity:0;transition:opacity .6s var(--ease);
  background:radial-gradient(480px 480px at var(--msx,50%) var(--msy,50%),var(--glow),transparent 70%);
}
body.is-glowing .section--dark::before,
body.is-glowing .site-footer::before{opacity:1}
.section--dark>*,.site-footer>*{position:relative;z-index:2}
.sec-head{display:flex;justify-content:space-between;align-items:baseline;gap:20px;margin-bottom:clamp(30px,5vw,56px);padding-top:14px;border-top:1px solid var(--line)}
.section--dark .sec-head{border-top:1px solid var(--line-d)}
.sec-head__num{font-family:var(--f-mono);font-size:11px;letter-spacing:.2em;color:var(--accent)}

.crumb{display:inline-flex;align-items:center;gap:8px;margin:28px var(--pad) 0;font-family:var(--f-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--smoke)}
.crumb:hover{color:var(--accent)}

/* ========================= HERO ========================= */
.book-hero{
  padding:28px var(--pad) clamp(50px,8vh,100px);
  display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(30px,5vw,70px);align-items:center;
}
.book-hero__kind{margin-bottom:18px}
.book-hero__title{
  font-size:clamp(34px,5.2vw,68px);line-height:.98;font-weight:700;
  letter-spacing:-.03em;margin-bottom:16px;
}
.book-hero__tagline{font-size:clamp(17px,2vw,22px);color:var(--smoke);line-height:1.5;max-width:42ch;margin-bottom:26px}
.book-hero__quote{
  border-left:2px solid var(--accent);padding-left:20px;margin-bottom:32px;
  font-size:clamp(16px,1.6vw,19px);line-height:1.55;font-style:italic;max-width:42ch;color:var(--ink);
}
.book-hero__actions{display:flex;flex-wrap:wrap;align-items:center;gap:24px}
.btn-buy{
  display:inline-flex;align-items:center;gap:10px;
  font-family:var(--f-mono);font-size:12px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--paper);background:var(--accent);padding:14px 22px;border-radius:2px;
  transition:background .3s var(--ease),transform .3s var(--ease);
}
.btn-buy:hover{background:var(--accent-h);transform:translateY(-2px)}
.link-ghost{
  font-family:var(--f-mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--ink);border-bottom:1px solid var(--ink);padding-bottom:3px;
}
.link-ghost:hover{color:var(--accent);border-color:var(--accent)}
.book-hero__cover{
  position:relative;aspect-ratio:2/3;overflow:hidden;border-radius:2px;
  background:linear-gradient(135deg,var(--tint,#2A241A),var(--ink));
  border:2px solid var(--accent);
}
.book-hero__cover img{position:relative;z-index:1}
@media(max-width:860px){
  .book-hero{grid-template-columns:1fr;padding-top:20px}
  .book-hero__cover{order:-1;max-width:280px;margin:0 auto}
}

/* ========================= SYNOPSIS ========================= */
.book-synopsis p{font-size:clamp(17px,1.6vw,19px);line-height:1.75;color:var(--ink);max-width:68ch}
.book-synopsis p+p{margin-top:20px}
.book-synopsis strong{color:var(--accent);font-weight:700}

/* ========================= EXCERPT ========================= */
.excerpt{max-width:68ch}
.excerpt__label{display:block;margin-bottom:22px}
.excerpt__cite{font-family:var(--f-mono);font-size:11px;letter-spacing:.08em;color:var(--smoke-dark);display:block;margin-bottom:26px}
.excerpt__body p{font-size:clamp(16px,1.5vw,18px);line-height:1.8;color:var(--paper);opacity:.92}
.excerpt__body p+p{margin-top:18px}
.excerpt__line{display:block;margin-top:16px}
.excerpt__speaker{font-family:var(--f-mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--accent);margin-right:10px}
.excerpt__pull{margin-top:30px;padding-left:20px;border-left:2px solid var(--accent);font-style:italic;font-size:clamp(16px,1.6vw,19px);line-height:1.55;opacity:.92}

/* ========================= ARTICOLI (approfondimenti) ========================= */
.articles{display:grid;gap:clamp(40px,6vw,72px)}
.article{max-width:70ch;padding-top:clamp(28px,4vw,44px);border-top:1px solid var(--line)}
.article:first-child{padding-top:0;border-top:none}
.article__num{font-family:var(--f-mono);font-size:11px;letter-spacing:.14em;color:var(--accent);display:block;margin-bottom:14px}
.article__title{font-size:clamp(22px,2.6vw,32px);font-weight:700;letter-spacing:-.02em;line-height:1.15;margin-bottom:10px}
.article__dek{font-size:15px;color:var(--smoke);margin-bottom:18px;line-height:1.5}
.article__body p{font-size:16px;line-height:1.75;color:var(--ink)}
.article__body p+p{margin-top:14px}
.article__quote{margin-top:18px;padding-left:18px;border-left:2px solid var(--accent);font-style:italic;font-size:16px;line-height:1.5;color:var(--smoke)}
.articles__note{margin-top:clamp(24px,4vw,40px);font-family:var(--f-mono);font-size:11px;letter-spacing:.03em;color:var(--smoke);line-height:1.6;max-width:60ch}

/* ========================= AUTORE ========================= */
.author-card{
  border:1px solid var(--line);background:var(--paper-2);padding:clamp(24px,3vw,34px);
  border-radius:2px;max-width:60ch;display:grid;gap:10px;
}
.author-card__label{font-family:var(--f-mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--accent)}
.author-card__name{font-size:18px;font-weight:600}
.author-card p{font-size:15px;line-height:1.7;color:var(--smoke)}

/* ========================= FOOTER ========================= */
.site-footer{
  position:relative;background:var(--ink-2);color:var(--paper);padding:clamp(50px,8vh,90px) var(--pad) 30px;
}
.site-footer__mail{display:inline-flex;align-items:center;gap:12px;font-size:clamp(20px,3vw,30px);border-bottom:1px solid var(--accent);padding-bottom:6px}
.site-footer__note{display:block;margin-top:12px;font-family:var(--f-mono);font-size:11px;letter-spacing:.06em;color:var(--smoke-dark)}
.site-footer__grid{display:flex;flex-wrap:wrap;justify-content:space-between;gap:30px;margin-top:clamp(50px,8vw,90px);border-top:1px solid var(--line-d);padding-top:24px}
.site-footer__grid .col{display:flex;flex-direction:column;gap:10px}
.site-footer__grid a{color:var(--smoke-dark);font-size:14px;transition:color .25s var(--ease)}
.site-footer__grid a:hover{color:var(--paper)}
.site-footer__grid .lbl{font-family:var(--f-mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--accent);margin-bottom:4px}
.site-footer__copy{font-family:var(--f-mono);font-size:11px;letter-spacing:.06em;color:var(--smoke-dark);margin-top:30px}

/* ========================= CURSORE CUSTOM ========================= */
/* attivo solo se JS lo abilita (desktop + pointer fine + no reduced-motion),
   vedi .has-cursor su <html> — asset/js/cursor.js, versione senza GSAP */
.has-cursor,.has-cursor a,.has-cursor button{cursor:none}
#cursor{position:fixed;top:0;left:0;z-index:80;pointer-events:none;
  opacity:0;transition:opacity .35s var(--ease)}
#cursor.is-on{opacity:1}
.cursor__dot{position:absolute;top:0;left:0;width:6px;height:6px;margin:-3px 0 0 -3px;
  border-radius:50%;background:var(--ink);transition:opacity .3s var(--ease),background-color .3s var(--ease)}
.cursor__ring{position:absolute;top:0;left:0;width:32px;height:32px;margin:-16px 0 0 -16px;
  border-radius:50%;border:1px solid var(--ink);display:flex;align-items:center;justify-content:center;
  transition:width .4s var(--ease),height .4s var(--ease),margin .4s var(--ease),border-color .3s var(--ease)}
.cursor__label{font-family:var(--f-mono);font-size:9px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink);opacity:0;transition:opacity .25s var(--ease) .05s,color .3s var(--ease);white-space:nowrap}
#cursor.on-dark .cursor__dot{background:var(--paper)}
#cursor.on-dark .cursor__ring{border-color:var(--paper)}
#cursor.on-dark .cursor__label{color:var(--paper)}
#cursor.is-big .cursor__ring{width:88px;height:88px;margin:-44px 0 0 -44px;border-color:var(--accent)}
#cursor.is-big .cursor__dot{opacity:0}
#cursor.is-big .cursor__label{opacity:1}
#cursor.is-hover .cursor__ring{width:56px;height:56px;margin:-28px 0 0 -28px;border-color:var(--accent)}
#cursor.is-hover .cursor__dot{opacity:0}
@media(pointer:coarse){#cursor{display:none!important}}

:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}