/* Salingolpe — archivio Pubblicazioni, pagina 21.
   Foglio indipendente e limitato alla sola sezione editoriale. */

.volumes { background:#f4efe5; color:#232922; }
.volumes__overline {
  margin:0; color:#99584c; font-size:.72rem; font-weight:800;
  letter-spacing:.18em; line-height:1.7; text-transform:uppercase;
}
.volumes__hero {
  position:relative; isolation:isolate; overflow:hidden;
  color:#fbf6ee;
  background:linear-gradient(110deg,#262d29 0%,#343b34 58%,#4b5143 100%);
}
.volumes__hero::before {
  content:""; position:absolute; inset:0; opacity:.26; z-index:-1;
  background:repeating-linear-gradient(100deg,transparent 0,transparent 77px,rgba(221,201,172,.15) 78px,transparent 79px);
}
.volumes__hero-grid {
  display:grid; grid-template-columns:minmax(0, .99fr) minmax(0,1.01fr);
  min-height:45rem; gap:2rem;
}
.volumes__hero-copy {
  position:relative; z-index:5; padding:clamp(5rem,8vw,8.5rem) 0 4rem;
  display:flex; flex-direction:column; align-items:flex-start; justify-content:center;
}
.volumes__hero-copy .volumes__overline {color:#f2c8a5;}
.volumes__hero h1 {
  font:500 clamp(4.6rem,7.7vw,8.8rem)/.84 var(--font-serif);
  margin:2.3rem 0 0; letter-spacing:-.042em; word-break:normal;
}
.volumes__hero h1 em { color:#efc49e; font-weight:400; }
.volumes__hero-intro {
  max-width:34rem; font-size:clamp(1.05rem,1.45vw,1.23rem);
  line-height:1.85; margin:2.7rem 0 2rem; color:#ece9dc;
}
.volumes__hero-button {
  text-decoration:none; display:inline-flex; align-items:center;
  gap:2rem; padding:.8rem 1.3rem; background:#f4dfc6; color:#282e29;
  font-size:.73rem; font-weight:800; text-transform:uppercase; letter-spacing:.11em;
  transition:background-color .2s ease, transform .2s ease;
}
.volumes__hero-button:hover {background:#fff4e5; transform:translateY(-2px);}
.volumes__hero-note {
  margin:3.5rem 0 0; font-size:.65rem; text-transform:uppercase;
  letter-spacing:.16em; font-weight:700; color:#cfcdbd;
}
.volumes__hero-art {
  min-height:41rem; position:relative; isolation:isolate;
  display:flex; align-items:center;
}
.volumes__hero-art-mat {
  position:absolute; top:10%; right:6%; bottom:10%; left:10%;
  border:1px solid #f7eddd55; transform:rotate(4deg);
}
.volumes__hero-art-book {
  position:absolute; z-index:2; display:block; background:#e9decf;
  box-shadow:0 22px 50px #0006; border:.55rem solid #f8f2e8;
  transition:transform .3s ease;
}
.volumes__hero-art-book img {width:100%; height:100%; display:block; object-fit:contain; background:#e6ddd1;}
.volumes__hero-art-book--one {left:2%; top:14%; width:43%; height:57%; transform:rotate(-8deg);}
.volumes__hero-art-book--two {left:39%; top:10%; width:40%; height:69%; transform:rotate(7deg); z-index:3;}
.volumes__hero-art-book--three {right:0; bottom:12%; width:31%; height:44%; transform:rotate(-2deg); z-index:4;}
.volumes__hero-art-book--one:hover {transform:rotate(-6deg) translateY(-8px);}
.volumes__hero-art-book--two:hover {transform:rotate(5deg) translateY(-8px);}
.volumes__hero-art-book--three:hover {transform:rotate(0deg) translateY(-8px);}
.volumes__hero-art-caption {
  position:absolute; z-index:4; bottom:10%; left:5%;
  text-transform:uppercase; letter-spacing:.13em; font-weight:700;
  font-size:.7rem; line-height:1.5; color:#f3ddc4;
}
.volumes__catalogue {padding:clamp(4.5rem,7vw,8rem) 0;}
.volumes__heading {
  display:grid; grid-template-columns:1.3fr .7fr; gap:3rem;
  align-items:end; border-bottom:1px solid #cfc3b2;
  padding:0 0 2.4rem; margin-bottom:2rem;
}
.volumes__heading h2 {
  font:500 clamp(3.6rem,5.9vw,6.8rem)/.9 var(--font-serif);
  letter-spacing:-.035em; margin:1rem 0 0;
}
.volumes__heading h2 em {color:#873d3e;}
.volumes__heading>p {margin:0; max-width:26rem; color:#5d5f56; font-size:.94rem; line-height:1.85;}
.volumes__entries {display:flex; flex-direction:column; gap:1.6rem;}
.volumes__entry {
  display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);
  min-height:30rem; background:#fffdf8; border:1px solid #dfd7ca;
}
.volumes__entry:nth-child(2) {background:#ede4d6;}
.volumes__entry:nth-child(2) .volumes__cover-link {order:2;}
.volumes__entry:nth-child(3) {background:#f6f2eb;}
.volumes__cover-link {
  position:relative; display:flex; flex-direction:column;
  justify-content:center; align-items:center; gap:1.4rem;
  min-width:0; background:#dcd2c1; padding:2.9rem 2rem;
  text-decoration:none; overflow:hidden;
}
.volumes__entry:nth-child(2) .volumes__cover-link {background:#c9bfad;}
.volumes__entry:nth-child(3) .volumes__cover-link {background:#d4ccbe;}
.volumes__cover-link::before {
  content:""; position:absolute; inset:1.3rem; border:1px solid #ffffff75;
  pointer-events:none;
}
.volumes__cover-frame {
  position:relative; z-index:1; width:min(100%,16rem);
  height:22.5rem; background:#f6eee1;
  border:7px solid #fffdf8;
  box-shadow:10px 18px 36px #40372838;
  display:grid; place-items:center; overflow:hidden;
  transition:transform .3s ease;
}
.volumes__cover-link:hover .volumes__cover-frame {transform:translateY(-5px) rotate(-1deg);}
.volumes__cover-frame img {max-width:100%; max-height:100%; width:100%; height:100%; object-fit:contain;}
.volumes__cover-label {
  position:relative; z-index:1; color:#5e5144;
  font-size:.66rem; font-weight:800; text-transform:uppercase; letter-spacing:.16em;
}
.volumes__entry-content {
  display:flex; flex-direction:column; justify-content:center;
  align-items:flex-start; padding:clamp(2.5rem,5vw,6rem);
}
.volumes__entry-head {
  display:flex; width:100%; justify-content:space-between; gap:1.5rem;
  padding-bottom:1rem; margin-bottom:2.4rem;
  border-bottom:1px solid #d4cabd;
  font-size:.68rem; font-weight:800; text-transform:uppercase;
  letter-spacing:.11em; color:#8b4d45;
}
.volumes__entry-head span:last-child {text-align:right; color:#736b61;}
.volumes__entry h3 {
  margin:0; font:500 clamp(2.85rem,4.3vw,5rem)/.92 var(--font-serif);
  letter-spacing:-.025em; max-width:42rem;
}
.volumes__entry h3 a {text-decoration:none; color:#273029;}
.volumes__entry h3 a:hover {color:#863d3e;}
.volumes__entry-description {
  color:#4f554d; font-size:1rem; line-height:1.85;
  max-width:37rem; margin:1.6rem 0 2rem;
}
.volumes__entry-cta {
  display:inline-flex; align-items:center; gap:1.8rem;
  padding:0 0 .6rem; border-bottom:1px solid #9c554f;
  color:#773439; text-decoration:none; text-transform:uppercase;
  letter-spacing:.09em; font-size:.75rem; font-weight:800;
}
.volumes__entry-cta:hover {color:#a9574b;}
.volumes__end {background:#322b2a; padding:clamp(4.5rem,7vw,7rem) 0; color:#fbf5e9;}
.volumes__end-grid {display:grid; grid-template-columns:1.2fr .8fr; gap:5rem; align-items:center;}
.volumes__end .volumes__overline {color:#ebbea2;}
.volumes__end h2 {
  font:500 clamp(3.6rem,6.1vw,6.8rem)/.9 var(--font-serif);
  margin:1.2rem 0 0; letter-spacing:-.03em;
}
.volumes__end h2 em {color:#f1c5a3;}
.volumes__end-grid>div:last-child {display:flex; flex-direction:column;}
.volumes__end-grid>div:last-child p {line-height:1.8; color:#dfd7c9; margin:0 0 2rem;}
.volumes__end-grid a {
  display:flex; justify-content:space-between; gap:1.2rem; padding:1.2rem 0;
  border-top:1px solid #ffffff55; color:#fdf5e7; text-decoration:none; font-size:.84rem;
  font-weight:800;
}
.volumes__end-grid a:hover {color:#efc5a2;}

@media (max-width:1050px) {
  .volumes__hero-grid {min-height:38rem; gap:0;}
  .volumes__hero h1 {font-size:clamp(4.5rem,8vw,7rem);}
  .volumes__hero-art {min-height:36rem;}
  .volumes__hero-art-book--one {width:48%;}
  .volumes__hero-art-book--two {left:36%; width:43%;}
  .volumes__hero-art-book--three {right:0; width:33%;}
  .volumes__entry-content {padding:2.6rem;}
}
@media (max-width:780px) {
  .volumes__hero-grid {grid-template-columns:1fr; min-height:0;}
  .volumes__hero-copy {padding:4rem 0 1.3rem;}
  .volumes__hero h1 {font-size:clamp(4.4rem,11vw,7rem);}
  .volumes__hero-intro {margin:1.6rem 0 1.6rem; max-width:35rem;}
  .volumes__hero-note {margin:2rem 0 0;}
  .volumes__hero-art {min-height:27rem; max-width:36rem; width:100%; margin-inline:auto;}
  .volumes__hero-art-book--one {top:8%; height:65%;}
  .volumes__hero-art-book--two {top:3%; height:80%;}
  .volumes__hero-art-book--three {bottom:5%; height:54%;}
  .volumes__hero-art-caption {bottom:4%;}
  .volumes__heading {grid-template-columns:1fr; gap:1rem;}
  .volumes__heading>p {max-width:43rem;}
  .volumes__entry {grid-template-columns:1fr; min-height:0;}
  .volumes__entry:nth-child(2) .volumes__cover-link {order:0;}
  .volumes__cover-link {padding:2.4rem 1rem;}
  .volumes__cover-frame {height:21rem; width:min(80%,15rem);}
  .volumes__entry-content {padding:2.4rem 1.7rem 2.8rem;}
  .volumes__entry h3 {font-size:clamp(2.7rem,7vw,4.1rem);}
  .volumes__end-grid {grid-template-columns:1fr; gap:2rem;}
}
@media (max-width:480px) {
  .volumes__hero-copy {padding-top:3.3rem;}
  .volumes__overline {font-size:.62rem;}
  .volumes__hero h1 {font-size:clamp(4rem,15vw,5.6rem); margin-top:1.5rem;}
  .volumes__hero-intro {font-size:1.04rem; line-height:1.7;}
  .volumes__hero-note {font-size:.59rem;}
  .volumes__hero-art {min-height:21.5rem;}
  .volumes__hero-art-book {border-width:5px;}
  .volumes__hero-art-book--one {top:11%; height:64%;}
  .volumes__hero-art-book--two {top:4%; height:77%;}
  .volumes__hero-art-book--three {bottom:6%; height:53%;}
  .volumes__hero-art-caption {font-size:.53rem; bottom:4%;}
  .volumes__catalogue {padding:3.8rem 0;}
  .volumes__heading h2 {font-size:3.55rem;}
  .volumes__heading>p {font-size:.89rem;}
  .volumes__entries {gap:1rem;}
  .volumes__cover-link {padding:2rem 1rem;}
  .volumes__cover-frame {height:18rem; width:13.2rem;}
  .volumes__entry-content {padding:2rem 1.25rem 2.3rem;}
  .volumes__entry-head {margin-bottom:1.6rem; font-size:.61rem;}
  .volumes__entry h3 {font-size:3rem;}
  .volumes__entry-description {font-size:.92rem; line-height:1.75; margin:1.3rem 0 1.6rem;}
  .volumes__end {padding:3.7rem 0;}
  .volumes__end h2 {font-size:3.8rem;}
}
/* Copertine senza spazi artificiali: il telaio segue l'immagine, non
   un'altezza fissa. Bordo sottile e omogeneo in tutte le anteprime. */
.volumes__hero-art-book {
  height:auto;
  padding:0;
  border:6px solid #f8f2e8;
  background:transparent;
  line-height:0;
}
.volumes__hero-art-book img {
  display:block;
  width:100%;
  height:auto;
  max-height:none;
  object-fit:initial;
  background:transparent;
}
.volumes__cover-frame {
  display:block;
  width:min(100%,16rem);
  height:auto;
  padding:0;
  border:6px solid #fffdf8;
  background:transparent;
  line-height:0;
}
.volumes__cover-frame img {
  display:block;
  width:100%;
  height:auto;
  max-width:none;
  max-height:none;
  object-fit:initial;
  background:transparent;
}
@media(max-width:780px) {
  .volumes__cover-frame { width:min(80%,15rem); height:auto; }
}
@media(max-width:480px) {
  .volumes__hero-art-book { border-width:5px; }
  .volumes__cover-frame { width:min(100%,13.2rem); height:auto; }
}
@media (prefers-reduced-motion:reduce) {
 .volumes__hero-button,.volumes__cover-frame,.volumes__hero-art-book {transition:none;}
}