/* 126 · Biblioteca — boda para lectores: verde biblioteca, burdeos, cuero y pergamino. Se abre un libro de tapas de cuero, pasan dos hojas
   y en la primera página está el ex libris con los nombres.
   Portada: estantes de libros antiguos con la luz de la lámpara verde que respira (WebGL, modo velas) y polvo dorado.
   Orden: capítulos — cada sección es un capítulo con su número romano y un marcapáginas de cinta que baja al llegar.
   Fecha: las páginas pasan rápido y se detienen en la del día. Cierre: «Fin… y comienza nuestra historia». */
.c-biblioteca { --display-peso: 400; --nombre-color: #EFE3C8; --titulo-letra: "Cormorant Garamond"; --titulo-peso: 700; --titulo-espacio: 0;
	--dia-letra: "Libre Caslon Display"; --dia-color: #24382F; --y-letra: "Cormorant Garamond"; --y-color: #D2B06A; --y-tam: .58em; --pareja-tam: .78;
	--radio: 3px; --vj: 30px; --sombra: 0 18px 24px rgb(0 0 0 / .45); --nombre-tam: clamp(3.2rem, 8vw, 6.8rem); }
.c-biblioteca .xv-cielo { display: none; }
.c-biblioteca main { background: radial-gradient(90% 40% at 50% 0%, #26392F, #18261F 60%, #121C17); }
.c-biblioteca main > .xv-sec:not(#portada) { background: transparent; }
.c-biblioteca .v-velo { background: radial-gradient(52% 44% at 50% 48%, rgb(16 24 20 / .72), transparent 76%); }

/* apertura: el libro de cuero */
.c-biblioteca .ap-libro .ap-obj { width: min(70vw, 340px); aspect-ratio: .8; }
.c-biblioteca .ap-pagina { background: linear-gradient(90deg, #E3D4B2, #F2E8CF 8%, #EFE3C8); padding: 18px; }
.c-biblioteca .ap-pagina .ap-titulo { position: relative; z-index: 1; color: #24382F; padding: 0 14%; }
.c-biblioteca .ap-pagina .ap-titulo small { color: #6A2232; letter-spacing: .3em; font-size: .56rem; }
.c-biblioteca .ap-pagina .ap-titulo strong { font-size: clamp(1.3rem, 5.6vw, 1.9rem); }
.c-biblioteca .ap-pagina .ap-titulo em { color: #6A2232; }
.c-biblioteca .ap-sello { left: 4%; right: 4%; top: 50%; bottom: auto; width: 92% !important; translate: 0 -50%; opacity: 1; transform: none; z-index: 0; }
html.so-abre .c-biblioteca .ap-sello, .c-biblioteca.cel .ap-sello { animation: none; }
.c-biblioteca .ap-tapa-img { object-fit: cover; border-radius: 3px 8px 8px 3px; }
.c-biblioteca .ap-tapa-dorso { background: #3B2A1E; border-radius: 3px 8px 8px 3px; }
.c-biblioteca .ap-pagina::before, .c-biblioteca .ap-pagina::after { content: ""; position: absolute; inset: 0; z-index: 2; background: linear-gradient(90deg, #E8DABA, #F3EAD3); border-radius: 3px; transform-origin: 0 50%; box-shadow: inset 0 0 0 1px rgb(0 0 0 / .06); backface-visibility: hidden; opacity: 0; }
html.so-abre .c-biblioteca .ap-pagina::before { animation: bb-pasa .75s cubic-bezier(.6,0,.4,1) .95s both; }
html.so-abre .c-biblioteca .ap-pagina::after { animation: bb-pasa .75s cubic-bezier(.6,0,.4,1) 1.2s both; }
@keyframes bb-pasa { 0% { opacity: 1; transform: perspective(1200px) rotateY(0); } 92% { opacity: 1; transform: perspective(1200px) rotateY(-172deg); } 100% { opacity: 0; transform: perspective(1200px) rotateY(-175deg); } }
.c-biblioteca .so-escena::before, .c-biblioteca .ap-escena::before { background: radial-gradient(70% 60% at 50% 40%, #2E3B2E, #0C100D 85%); }

/* portada */
.c-biblioteca .e-evento { font-family: "Cormorant Garamond", serif; font-style: italic; font-weight: 500; font-size: 1.4rem; letter-spacing: .06em; text-transform: none; color: #D2B06A; }
.c-biblioteca .e-fecha { color: #D3C5A6; letter-spacing: .14em; }
.c-biblioteca .e-nombre { text-shadow: 0 2px 30px rgb(0 0 0 / .6); }
.bb-lampara { --w: min(24vmin, 220px); right: 7vw; bottom: 8vh; --dy: 10vh; --ex: 30vw; --ey: 0px; --ed: .4s; --fd: 9s; --fa: 2px; --fr: 0deg; }
.bb-lampara .e-img { filter: drop-shadow(0 0 40px rgb(255 214 140 / .35)) drop-shadow(0 20px 20px rgb(0 0 0 / .5)); }
.bb-libros { --w: min(30vmin, 290px); left: 5vw; bottom: 3vh; --dy: 12vh; --ex: -30vw; --ey: 0px; --ed: .6s; --fd: 10s; --fa: 2px; --fr: 0deg; }

/* capítulos: hojas de pergamino con número romano y marcapáginas */
.c-biblioteca main > .xv-sec:not(#portada):not(#fecha):not(#cierre) > .xv-ancho { position: relative; background: linear-gradient(90deg, #E6D7B6, #F1E7CF 6%, #EFE3C8 94%, #E3D3B0); color: #24382F;
	--papel: #FBF5E6; --tinta: #24382F; --tinta-2: #4E5A4A; --acento: #6A2232; --linea: rgba(36,56,47,.16);
	padding: clamp(54px, 6vw, 76px) clamp(26px, 6vw, 76px) clamp(40px, 5vw, 64px); border-radius: 3px; box-shadow: 0 40px 70px -36px rgb(0 0 0 / .85); }
.c-biblioteca .fi-romano { top: 20px; right: clamp(22px, 5vw, 60px); left: auto; font: italic 500 1.05rem/1 "Cormorant Garamond", serif; color: #6A2232; opacity: .9; letter-spacing: .08em; }
.bb-cinta { top: -8px; left: clamp(6px, 2.4vw, 30px); width: clamp(18px, 1.8vw, 24px); transform-origin: 50% 0; transform: scaleY(0); transition: transform 1.1s cubic-bezier(.3,1.3,.5,1) .3s; }
.bb-cinta img { filter: drop-shadow(0 6px 6px rgb(0 0 0 / .25)); }
.llego > .xv-ancho > .bb-cinta { transform: scaleY(1); }
.c-biblioteca .xv-kicker { color: #6A2232; letter-spacing: .3em; font-weight: 600; }
.c-biblioteca .xv-titulo { color: #24382F; }
.c-biblioteca .xv-titulo .xv-script { font-style: italic; font-weight: 500; color: #6A2232; }
.c-biblioteca .xv-superficie { background: rgb(255 251 240 / .6); border: 1px solid rgb(36 56 47 / .16); border-radius: 2px; box-shadow: none; }
.c-biblioteca .xv-momento time { color: #6A2232; font-family: "Cormorant Garamond", serif; font-weight: 700; font-size: 1.1rem; }
.c-biblioteca .e-firma { font-family: "Cormorant Garamond", serif; font-style: italic; color: #6A2232; }
.c-biblioteca .xv-boton:not(.xv-boton-suave) { background: #6A2232; color: #F6EEDC; border-color: #6A2232; }
.c-biblioteca .e-ornamento { width: min(70%, 280px); }
.c-biblioteca .e-bienvenida .xv-texto-grande::first-letter { font-family: "Libre Caslon Display", serif; float: left; font-size: 3.4em; line-height: .8; margin: .06em .08em 0 0; color: #6A2232; }

/* fecha: las páginas pasan y se detienen en la del día */
.c-biblioteca .e-fecha-k { font-family: "Cormorant Garamond", serif; font-style: italic; font-size: 1.4rem; letter-spacing: .06em; text-transform: none; color: #D2B06A; }
.bb-libro-m { left: 14%; right: 14%; top: 6%; bottom: 6%; border-radius: 3px; background: linear-gradient(90deg, #E6D7B6, #F2E8D1); box-shadow: 0 30px 50px -20px rgb(0 0 0 / .7), -10px 0 0 #3B2A1E, 10px 0 0 #3B2A1E;
	opacity: clamp(0, calc(var(--t1) * 2.5), 1); transform: perspective(1400px) rotateX(calc((1 - var(--t1)) * 30deg)); }
.bb-hoja { position: absolute; inset: 0 0 0 50%; transform-origin: 0 50%; border-radius: 0 3px 3px 0; background: linear-gradient(90deg, #E0D0AC, #F4EBD5); box-shadow: inset 1px 0 0 rgb(0 0 0 / .08);
	transform: perspective(1200px) rotateY(calc(clamp(0, (var(--t1) * 7 - var(--h)) , 1) * -180deg)); }
.bb-libro-m::before { content: ""; position: absolute; left: 50%; top: 0; bottom: 0; width: 1px; background: rgb(0 0 0 / .18); }
.c-biblioteca .e-dia-caja { z-index: 2; }
.c-biblioteca .e-dia { font-size: clamp(4.4rem, 13vw, 7.4rem); }
.c-biblioteca .e-mes { font-family: "Cormorant Garamond", serif; font-style: italic; color: #6A2232; font-size: clamp(1.4rem, 3.6vw, 2rem); }
.c-biblioteca .e-anio { color: #4E5A4A; }

/* cierre */
.bb-cierre-ex { position: absolute; left: 50%; top: 4%; width: min(46vmin, 340px); translate: -50% 0; opacity: .9; }
.c-biblioteca .e-cierre { padding-top: clamp(210px, 32vh, 280px); }
.c-biblioteca .e-cierre .xv-kicker { color: #D2B06A; }

@media (max-width: 760px) {
	.c-biblioteca { --nombre-tam: clamp(3rem, 14vw, 4.4rem); }
	.bb-lampara { --w: 34vw; right: -2vw; bottom: 4vh; } .bb-libros { --w: 40vw; left: -2vw; bottom: 2vh; }
	.c-biblioteca main > .xv-sec:not(#portada):not(#fecha):not(#cierre) > .xv-ancho { padding: 60px 22px 40px; }
	.bb-libro-m { left: 4%; right: 4%; top: 12%; bottom: 12%; }
}