/* ==========================================================================
   libros.css · /libros/ — los dos libros como objetos
   hero (mesa con las dos cubiertas) · pliego I (papel) · pliego II (vino, en espejo) · cierre
   ========================================================================== */

/* objeto libro: cubierta + canto de páginas (sombra mínima) */
.libro3d { position: relative; display: block; transform-style: preserve-3d; transition: transform .5s var(--ease); will-change: transform; }
.libro3d img { width: 100%; height: auto; box-shadow: 0 1px 2px rgba(22, 18, 26, .22), 0 22px 36px -24px rgba(22, 18, 26, .55); }
.libro3d::after { content: ""; position: absolute; top: 3px; bottom: -3px; right: -6px; width: 6px; background: repeating-linear-gradient(180deg, #ece8e5 0 1px, #d6d0cd 1px 2px); transform: skewY(-30deg); transform-origin: 0 0; }
.libro3d::before { content: ""; position: absolute; left: 0; right: -6px; bottom: -6px; height: 6px; background: #cfc8c5; transform: skewX(-45deg); transform-origin: 0 0; }

/* HERO (vino) ---------------------------------------------------------------- */
.lh { overflow-x: clip; padding-bottom: clamp(72px, 9vw, 140px); }
.lh__rejilla { row-gap: 56px; align-items: center; }
.lh__texto { --c: 1 / 7; --ct: 1 / 11; }
.lh__meta { color: var(--c-sec); max-width: 40ch; }
.lh__meta li + li { margin-top: 6px; padding-top: 6px; border-top: 1px solid var(--c-linea); }
.lh__h { margin-top: clamp(24px, 3vw, 40px); font-size: clamp(2.8rem, 5.3vw, 5.7rem); line-height: .96; max-width: 13ch; }
.lh__entradilla { margin-top: clamp(24px, 3vw, 36px); max-width: 30ch; color: var(--hueso); }
.lh__enlaces { margin-top: clamp(28px, 3vw, 44px); }
.lh__mesa { --c: 7 / 13; position: relative; height: clamp(460px, 44vw, 640px); }
.lh__libro { position: absolute; display: block; transition: transform .6s var(--ease); }
.lh__libro--uno { left: 2%; top: 0; width: 50%; transform: rotate(-5deg); z-index: 1; }
.lh__libro--dos { right: 4%; bottom: 0; width: 43%; transform: rotate(4deg); z-index: 2; }
.lh__libro:hover, .lh__libro:focus-visible { z-index: 3; }
.lh__libro--uno:hover, .lh__libro--uno:focus-visible { transform: rotate(-2deg) translateY(-6px); }
.lh__libro--dos:hover, .lh__libro--dos:focus-visible { transform: rotate(1.5deg) translateY(-6px); }
.lh__libro:focus-visible { outline-offset: 8px; }
html.js .lh__libro .libro3d { animation: lh-libro-in 1s var(--ease) both; }
html.js .lh__libro--dos .libro3d { animation-delay: .18s; }
@keyframes lh-libro-in { from { opacity: 0; transform: translateY(26px); } }
@media (max-width: 1023px) {
  .lh__mesa { height: min(118vw, 600px); max-width: 560px; }
}

/* PLIEGOS -------------------------------------------------------------------- */
.lb__rejilla { row-gap: 44px; align-items: start; }
.lb--uno .lb__portada { --c: 1 / 6; }
.lb--uno .lb__texto { --c: 7 / 13; }
.lb--dos .lb__texto { --c: 1 / 7; grid-row: 1; }
.lb--dos .lb__portada { --c: 8 / 13; grid-row: 1; }
@media (min-width: 1024px) {
  .lb__portada { position: sticky; top: calc(var(--cabecera) + 40px); }
}
@media (max-width: 1023px) {
  .lb--dos .lb__texto, .lb--dos .lb__portada { grid-row: auto; }
  .lb--dos .lb__portada { order: -1; }
}
.lb__obj { display: block; width: min(100%, 420px); }
.lb__obj:focus-visible { outline-offset: 8px; }
.lb--uno .lb__obj { transform: rotate(-1.5deg); }
.lb--dos .lb__obj { width: min(84%, 380px); margin-left: auto; transform: rotate(1.5deg); position: relative; z-index: 1; }
.lb__portada .leyenda { margin-top: 20px; }
.lb--dos .lb__portada .leyenda { text-align: right; }
.lb__he { font-family: var(--f-he); font-size: clamp(4.6rem, 8.6vw, 9rem); line-height: 1; color: var(--fucsia-luz); text-align: right; margin-bottom: -.26em; position: relative; z-index: 0; white-space: nowrap; }
@media (max-width: 1023px) {
  .lb__obj { width: min(66%, 340px); }
  .lb--dos .lb__obj { width: min(60%, 320px); }
  .lb__he { font-size: clamp(3.6rem, 17vw, 6rem); }
}

.lb__genero { color: var(--c-acento-texto); }
.lb__h { margin-top: 14px; font-size: clamp(2.6rem, 4.6vw, 4.6rem); line-height: .98; max-width: 14ch; }
.lb__h .nm { font-size: .3em; vertical-align: 1.4em; }
.lb__nota--h { margin-top: 12px; }
.lb__nota--h [lang="he"] { font-size: 1.2rem; color: var(--c-acento-texto); margin-right: 4px; }
.lb__sub { margin-top: 14px; font-style: italic; font-size: clamp(1.3rem, 1.8vw, 1.6rem); color: var(--c-sec); }
.lb__cuerpo { margin-top: clamp(24px, 3vw, 36px); }
.lb__cuerpo p { font-size: clamp(1.1875rem, 1.35vw, 1.3125rem); }
.lb__nota { margin-top: 12px; }
.lb__chispa { margin-top: clamp(36px, 4.4vw, 60px); padding-top: 16px; border-top: 1px solid var(--c-fuerte); font-style: italic; font-size: clamp(1.7rem, 2.8vw, 2.6rem); line-height: 1.18; color: var(--c-acento-texto); max-width: 24ch; }
.lb__chispa p::before { content: "«"; } .lb__chispa p::after { content: "»"; }
.lb__chispa footer { margin-top: 12px; font-style: normal; color: var(--c-sec); font-size: .625rem; }
.lb__h3 { margin-top: clamp(40px, 5vw, 64px); font-size: clamp(1.6rem, 2.4vw, 2.2rem); }
.lb__h3 + .lb__cuerpo { margin-top: 14px; }
.lb__compra { margin-top: clamp(28px, 3vw, 40px); }
.lb__ficha { margin-top: clamp(40px, 5vw, 64px); }
.lb__ficha-cab { color: var(--c-sec); margin-bottom: 10px; }
.lb__ficha .ledger__fila { grid-template-columns: 12ch minmax(0, 1fr) auto; padding-inline: 0; }
@media (max-width: 767px) { .lb__ficha .ledger__fila { grid-template-columns: 1fr auto; } }

/* CIERRE ----------------------------------------------------------------------- */
.lc__h { --c: 1 / 10; max-width: 16ch; }
.puertas { border-top: 1px solid var(--c-fuerte); }
.puertas li { border-bottom: 1px solid var(--c-linea); }
.puertas__a {
  position: relative; display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gutter); row-gap: 4px; align-items: baseline;
  padding: clamp(18px, 2.2vw, 28px) 0; text-decoration: none; isolation: isolate; transition: color .3s;
}
.puertas__a::before { content: ""; position: absolute; inset: 0 calc(-1 * min(var(--margen), 24px)); background: var(--tinta); transform: scaleY(0); transform-origin: 50% 100%; transition: transform .4s var(--ease); z-index: -1; }
.puertas__a:hover, .puertas__a:focus-visible { color: var(--papel); outline: none; }
.puertas__a:hover::before, .puertas__a:focus-visible::before { transform: scaleY(1); }
.puertas__k { grid-column: 1 / 4; color: var(--c-sec); transition: color .3s; }
.puertas__a:hover .puertas__k, .puertas__a:focus-visible .puertas__k { color: var(--hueso-2); }
.puertas__t { grid-column: 4 / 8; font-family: var(--f-display); font-size: clamp(1.9rem, 3.4vw, 3.2rem); line-height: 1; letter-spacing: -0.02em; }
.puertas__d { grid-column: 8 / 12; font-size: 1.0625rem; line-height: 1.4; }
.puertas__fl { grid-column: 12 / 13; justify-self: end; font-family: var(--f-mono); font-size: 1.25rem; transition: transform .35s var(--ease); }
.puertas__a:hover .puertas__fl, .puertas__a:focus-visible .puertas__fl { transform: translateX(6px); color: var(--fucsia-luz); }
@media (max-width: 1023px) {
  .puertas__a { grid-template-columns: minmax(0, 1fr) auto; }
  .puertas__k, .puertas__t, .puertas__d { grid-column: 1 / 2; }
  .puertas__fl { grid-column: 2; grid-row: 2; }
}