/* Livres affichés comme d'anciens manuscrits reliés cuir */
.manuscript-shelf{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:2.5rem 2rem;padding:1rem 0 2rem}
.manuscript-item{display:flex;flex-direction:column;align-items:center;text-align:center}
.manuscript-item .manuscript-info{margin-top:1rem;width:100%;max-width:240px}
.manuscript-item .manuscript-info p{font-size:15px;line-height:1.4;margin:.2rem 0}
.manuscript-item .manuscript-price{font-family:'Mulish',sans-serif;font-weight:700;color:#5a3a12}

.manuscript{
  --leather:#5b2a17; --leather-dark:#2e130a; --gold:#d8b25a; --gold-dark:#8a6420;
  position:relative;display:block;width:100%;max-width:240px;aspect-ratio:2/3;
  border-radius:4px 10px 10px 4px;text-decoration:none;color:var(--gold);
  background:
    radial-gradient(ellipse at 30% 20%,rgba(255,255,255,.10),transparent 55%),
    radial-gradient(ellipse at 70% 85%,rgba(0,0,0,.35),transparent 60%),
    repeating-radial-gradient(circle at 40% 60%,rgba(0,0,0,.05) 0 2px,transparent 2px 5px),
    linear-gradient(135deg,var(--leather),var(--leather-dark));
  box-shadow:
    inset 0 0 0 1px rgba(0,0,0,.6),
    inset 0 0 28px rgba(0,0,0,.55),
    6px 6px 0 -1px #efe3c4,           /* tranche des pages */
    6px 6px 0 0 #b9a77c,
    10px 14px 22px rgba(0,0,0,.45);
  transition:transform .25s ease, box-shadow .25s ease;
  overflow:hidden;
}
.manuscript:hover,.manuscript:focus-visible{transform:translateY(-6px) rotate(-1deg);color:var(--gold)}
.manuscript:focus-visible{outline:3px solid var(--gold);outline-offset:4px}

/* Dos du livre avec nervures */
.manuscript::before{
  content:"";position:absolute;inset:0 auto 0 0;width:9%;
  background:
    repeating-linear-gradient(to bottom,transparent 0 14%,rgba(0,0,0,.45) 14% 15%,rgba(216,178,90,.35) 15% 16%,transparent 16% 22%),
    linear-gradient(to right,rgba(0,0,0,.55),rgba(255,255,255,.08) 60%,rgba(0,0,0,.35));
  border-right:1px solid rgba(0,0,0,.5);
}

/* Cadre doré intérieur (double filet) */
.manuscript-frame{
  position:absolute;inset:7% 7% 7% 14%;
  border:2px solid var(--gold);
  box-shadow:inset 0 0 0 4px transparent,inset 0 0 0 5px rgba(216,178,90,.7);
  display:flex;flex-direction:column;align-items:center;justify-content:space-between;
  padding:9% 7%;
}
/* Fleurons dans les coins */
.manuscript-frame .corner{position:absolute;width:14px;height:14px;color:var(--gold);font-size:14px;line-height:14px}
.manuscript-frame .corner.tl{top:-8px;left:-8px}.manuscript-frame .corner.tr{top:-8px;right:-8px}
.manuscript-frame .corner.bl{bottom:-8px;left:-8px}.manuscript-frame .corner.br{bottom:-8px;right:-8px}

.manuscript-ornament{font-size:1.1rem;letter-spacing:.4em;opacity:.9;line-height:1;text-shadow:0 1px 0 rgba(0,0,0,.6)}

/* Cartouche central qui contient le titre — aucun débordement */
.manuscript-cartouche{
  flex:1 1 auto;width:100%;min-height:0;margin:8% 0;
  display:flex;align-items:center;justify-content:center;
  border-top:1px solid rgba(216,178,90,.6);border-bottom:1px solid rgba(216,178,90,.6);
  padding:6% 2%;overflow:hidden;
}
.manuscript-title{
  margin:0;width:100%;max-height:100%;
  font-family:'Cinzel Decorative','Cinzel',Georgia,serif;font-weight:700;
  font-size:1.35rem;line-height:1.2;
  text-transform:uppercase;text-align:center;
  color:var(--gold);
  background:linear-gradient(180deg,#f6e2a4 0%,#d8b25a 45%,#9c7428 100%);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
  filter:drop-shadow(0 1px 0 rgba(0,0,0,.7));
  overflow-wrap:anywhere;word-break:break-word;hyphens:auto;
  display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:7;overflow:hidden;
}
.manuscript-author{
  font-family:'Mulish',Georgia,serif;font-style:italic;font-size:.8rem;line-height:1.3;
  color:#e9d49a;max-width:100%;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}

/* Teintes de cuir variées */
.manuscript.leather-1{--leather:#5b2a17;--leather-dark:#2e130a}
.manuscript.leather-2{--leather:#1f3b2c;--leather-dark:#0c1a12}
.manuscript.leather-3{--leather:#2a2350;--leather-dark:#120e27}
.manuscript.leather-4{--leather:#6b1d1d;--leather-dark:#300a0a}
.manuscript.leather-5{--leather:#4a3420;--leather-dark:#1f150b}

@media (max-width:480px){
  .manuscript-shelf{grid-template-columns:repeat(2,minmax(0,1fr));gap:1.8rem 1rem}
  .manuscript-author{font-size:.7rem}
}