/* Tapas de libro con el estilo de PipbukSite (/catalogo): contratapa fija con el color del lomo,
   bloque de papel marfil y tapa con bisagra que se abre al pasar el mouse. Sin portada, degradé
   con título y autor. El color del lomo lo calcula app.js a partir de la portada.
   Además, la página Explorar con la estructura editorial del inicio (dashboard). */

/* ----- Explorar (misma estructura que el inicio) ----- */
.explore-count { grid-column: 2; grid-row: 1; font-size: .75rem; color: #77717f; }
.explore-hero { padding-bottom: clamp(2rem, 4vw, 3rem); }
.explore-hero h1 { color: #24212b; font: 500 clamp(2.5rem, 6vw, 4.8rem)/1.06 "Poppins", sans-serif; letter-spacing: -.065em; margin: 1.4rem 0; }
.explore-hero h1 em { color: #784dfe; font-family: Georgia, serif; font-weight: 400; letter-spacing: -.05em; }
.explore-search { display: flex; gap: .6rem; margin-top: 1.75rem; }
.explore-search input { flex: 1; min-width: 0; min-height: 50px; padding: .8rem 1.2rem; border: 1px solid #e2dfee; border-radius: 999px; background: #fff; font: inherit; font-size: .9rem; color: #24212b; box-shadow: 0 6px 18px #32245a08; }
.explore-search input:focus { outline: 2px solid #784dfe; outline-offset: 2px; border-color: #bba6ff; }
.explore-search .btn-primary { flex-shrink: 0; border-radius: 999px; padding: .8rem 1.4rem; font-size: .82rem; }
.explore-search .btn-primary span { margin-left: .5rem; }
.explore-hero .community-actions { margin-top: 1rem; }

/* Novedades en el estante beige, como "Entre páginas" del inicio. */
.explore-latest { grid-template-columns: .8fr 2.2fr; }
.explore-shelf-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.2rem; perspective: 1200px; }

.explore-catalog .community-section-heading { margin-bottom: 1.5rem; }
.explore-subtitle { margin: .4rem 0 0; color: #77717f; font-size: .85rem; }
.explore-chips { display: flex; flex-wrap: wrap; gap: .45rem; margin-bottom: 1.5rem; }
.explore-chips a { padding: .4rem .95rem; border: 1px solid #e2dfee; border-radius: 999px; background: #fff; color: #4c4658; font-size: .8rem; text-decoration: none; }
.explore-chips a:hover { border-color: #bba6ff; color: #5f34e0; }
.explore-chips a[aria-current] { background: #784dfe; border-color: #784dfe; color: #fff; }
.explore-finder { max-width: 620px; }
.explore-filters { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1.2rem; margin-top: .9rem; padding-left: .4rem; }
.explore-filters select { min-height: 40px; padding: .45rem 2rem .45rem .9rem; border: 1px solid #e2dfee; border-radius: 999px; background: #fff; font: inherit; font-size: .82rem; color: #24212b; }
.explore-toggle { display: inline-flex; align-items: center; gap: .4rem; min-height: 40px; font-size: .82rem; color: #4c4658; cursor: pointer; }
.explore-clear { font-size: .78rem; color: #5f34e0; }
.explore-page .community-purpose p a { color: #5f34e0; }

@media (max-width: 800px) {
    .explore-latest { grid-template-columns: minmax(0, 1fr); }
    .explore-shelf-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 540px) {
    .explore-search { flex-direction: column; }
    .explore-hero h1 { font-size: clamp(2.2rem, 10vw, 3rem); }
}

/* ----- Tapa de libro ----- */
.release-card { position: relative; display: flex; align-items: flex-end; aspect-ratio: 2 / 3; padding: 0; border: 0; border-radius: 2px; overflow: visible; isolation: isolate; perspective: 1400px; color: inherit; text-decoration: none; background: var(--binding-color, #58446d); box-shadow: 1px 2px 3px #30203920, 4px 8px 16px #30203918; }
.release-card:focus-visible { outline: 3px solid #784dfe; outline-offset: 6px; }
/* Bloque de papel marfil que asoma cuando la tapa se abre. */
.release-card::before { content: ""; position: absolute; inset: 3px 3px 3px 5px; border-radius: 0 2px 2px 0; background: linear-gradient(90deg, #dfd9cb 0, #f5f1e7 7%, #fffdf5 24%, #faf7ee 100%); box-shadow: inset -1px 0 #e8e2d5, 1px 1px 0 #eae5d9; }
.release-card .catalog-book-front { position: absolute; inset: 0; display: flex; align-items: flex-end; padding: .9rem; overflow: hidden; z-index: 1; border-radius: inherit; transform-origin: left center; backface-visibility: hidden; box-shadow: inset 0 -100px 65px -30px #000a; }
.release-card .catalog-book-front::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, #0003, transparent 2%, #ffffff18 3%, #00000012 4%, transparent 7%); pointer-events: none; }
.release-card .release-cover-image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.release-title { position: relative; z-index: 1; color: #fff; font-family: "Lexend Exa", "Lexend", sans-serif; font-weight: 600; font-size: .9rem; line-height: 1.3; text-align: left; overflow-wrap: break-word; hyphens: auto; }
.release-author { display: block; margin-top: .75rem; font-family: "Montserrat", sans-serif; font-size: .75rem; font-weight: 400; line-height: 1.5; }
.release-card .discovery-new-badge { z-index: 2; }

/* Tapas sin imagen: degradés de la paleta de PipbukSite. */
.release-hue-1 { background: linear-gradient(160deg, #0a0a0a, #784dfe); }
.release-hue-2 { background: linear-gradient(160deg, #7a2e2e, #f9a717); }
.release-hue-3 { background: linear-gradient(160deg, #1e3a2f, #3caf65); }
.release-hue-4 { background: linear-gradient(160deg, #3a1c4b, #9b5de5); }
.release-hue-5 { background: linear-gradient(160deg, #4b2b1c, #fc8f02); }
.release-hue-6 { background: linear-gradient(160deg, #12293d, #3d9ccc); }
/* La tarjeta en sí es la contratapa: su color es el del lomo, no el del degradé. */
.release-card[class*="release-hue-"] { background: var(--binding-color, #58446d); }

@media (prefers-reduced-motion: no-preference) {
    .release-card .catalog-book-front { transition: transform .6s cubic-bezier(.2, .7, .2, 1), box-shadow .6s ease; }
    .release-card:focus-visible .catalog-book-front { transform: rotateY(-18deg); box-shadow: inset 0 -100px 65px -30px #000a, 5px 1px 9px #30203918; }
}
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
    .release-card:hover .catalog-book-front { transform: rotateY(-18deg); box-shadow: inset 0 -100px 65px -30px #000a, 5px 1px 9px #30203918; }
}
@media (max-width: 600px) {
    .release-title { font-size: .75rem; }
}
/* En PipbukSite la tapa solo se abre; no se eleva toda la tarjeta. */
.release-card.discovery-cover:hover { transform: none; }

/* Con búsqueda o filtros, el titular se achica para que los resultados queden a la vista. */
.explore-page .explore-hero.is-compact { display: grid; grid-template-columns: minmax(0, 1fr) minmax(180px, .55fr); gap: 1.5rem; min-height: 0; padding: 1.75rem max(2rem, calc((100% - 1160px) / 2)); }
.explore-page .explore-hero.is-compact .community-hero-copy { width: 100%; min-width: 0; }
.explore-page .explore-hero.is-compact h1 { font-size: clamp(1.8rem, 3.5vw, 2.6rem); margin: .9rem 0 .5rem; }
.explore-page .explore-hero.is-compact .explore-hero-art { position: relative; inset: auto; width: 100%; height: 100%; min-height: 200px; margin: 0; border-radius: 16px; }
.explore-page .explore-hero.is-compact .explore-hero-art::before { display: none; }
.explore-hero.is-compact .explore-finder { max-width: 100%; }
.explore-hero.is-compact .explore-filters>label { min-width: 0; max-width: 100%; }
.explore-hero.is-compact .community-hero-copy > p { display: none; }
.explore-hero.is-compact .community-hero-copy::after { display: none; }
.explore-hero.is-compact .explore-search { margin-top: 1rem; }
@media (max-width: 760px) {
    .explore-page .explore-hero.is-compact { grid-template-columns: minmax(0, 1fr); gap: 1rem; padding: 1.25rem; }
    .explore-page .explore-hero.is-compact .explore-hero-art { height: 110px; min-height: 0; background-position: center 55%; }
}

/* En los libros relacionados del detalle, el título y autor quedan para lectores de pantalla. */
.bd-related .discovery-card h3,
.bd-related .discovery-card .discovery-author { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.explore-page .discovery-card-copy,
.bd-related .discovery-card-copy { padding-top: .55rem; }

/* Explorar: catálogo ilustrado, con los mismos materiales que Inicio. */
.explore-page .explore-hero .community-hero-copy { width: 55%; }
.explore-page .explore-hero { min-height: 430px; padding-top: 2.5rem; padding-bottom: 2.5rem; }
.explore-page .explore-hero h1 { font-size: clamp(2.6rem, 4.5vw, 4.2rem); }
.explore-page .explore-hero-copy::after { display: none; }
.explore-page .explore-hero-art { background-color: #f8f0df; background-image: url('../img/explore-story-world-reframed.webp'); background-size: cover; background-position: center; }
.explore-finder { max-width: 570px; margin-top: 1.4rem; }
.explore-search { display: flex; gap: .7rem; }
.explore-search input { width: 100%; min-width: 0; min-height: 48px; border: 1px solid #e4dfee; border-radius: 999px; padding: .8rem 1.2rem; font: inherit; font-size: .8rem; color: #171344; background: #ffffffed; box-shadow: 0 2px 5px #21134406; }
.explore-search .btn-primary { flex-shrink: 0; min-height: 48px; }
.explore-search input:focus-visible, .explore-page select:focus-visible { outline: 2px solid #8051ff; outline-offset: 2px; }
.explore-filters { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem 1.3rem; margin-top: .8rem; }
.explore-filters select, .explore-catalog-tools select { min-height: 40px; max-width: 100%; padding: .55rem .9rem; border: 1px solid #e4dfee; border-radius: 999px; background: #fff; font: inherit; font-size: .72rem; color: #171344; }
.explore-toggle { display: inline-flex; align-items: center; gap: .4rem; min-height: 40px; font-size: .72rem; color: #5f587d; cursor: pointer; }
.explore-toggle input { width: 16px; height: 16px; accent-color: #8051ff; }
.explore-clear { color: #8051ff; font-size: .75rem; }
.explore-page .explore-latest { margin-top: 1.5rem; padding: 1.6rem 2rem; grid-template-columns: minmax(220px, .8fr) minmax(0, 1.6fr); }
.explore-page .explore-latest h2 { font-size: clamp(2rem, 3.4vw, 3rem); }
.explore-latest-books { display: flex; align-items: center; gap: 1rem; min-width: 0; }
.explore-page .explore-shelf-grid { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 3rem) / 4); grid-template-columns: none; gap: 1rem; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; flex: 1; padding: .4rem 0; }
.explore-shelf-grid::-webkit-scrollbar { display: none; }
.explore-page .explore-shelf-grid .discovery-card-copy { display: none; }
.explore-page .explore-shelf-grid .discovery-card { scroll-snap-align: start; }
.explore-page .explore-shelf-grid .discovery-cover { aspect-ratio: 2 / 3; }
.explore-latest-books .community-slider-controls { flex-direction: column; flex-shrink: 0; }
.explore-latest-books .community-slider-controls button { width: 34px; height: 34px; }
.explore-page .explore-catalog { margin-top: 1.8rem; }
.explore-count { margin: .5rem 0 1rem; font-size: .75rem; color: #817b9f; }
.explore-catalog-tools { display: flex; align-items: center; flex-wrap: wrap; gap: .8rem; }
.explore-view-controls { display: flex; gap: .2rem; }
.explore-view-controls button { display: grid; place-items: center; width: 36px; height: 40px; border: 1px solid #e4dfee; border-radius: 7px; background: #fff; color: #817b9f; font-size: 1.1rem; cursor: pointer; }
.explore-view-controls button[aria-pressed='true'] { color: #8051ff; background: #eee7ff; }
.explore-genre-chips, .explore-chips { display: flex; flex-wrap: wrap; gap: .6rem; padding: .25rem 0 .8rem; margin-bottom: .5rem; }
/* Con JS, los géneros muestran dos filas y un botón para ver el resto. */
.explore-genre-chips.is-collapsed { max-height: calc(2 * 38px + .6rem + .25rem); overflow: hidden; padding-bottom: 0; margin-bottom: .6rem; }
.explore-genre-toggle { display: inline-flex; align-items: center; gap: .35rem; margin: 0 0 1.2rem; padding: .3rem 0; border: 0; background: none; color: #5f34e0; font: inherit; font-size: .8rem; font-weight: 500; cursor: pointer; }
.explore-genre-toggle:hover { text-decoration: underline; }
.explore-genre-toggle[hidden] { display: none; }
/* En pantallas chicas se desliza con el dedo, sin barra visible y con un desvanecido que indica que hay más. */
@media (max-width: 600px) {
    .explore-genre-chips, .explore-chips, .explore-genre-chips.is-collapsed { flex-wrap: nowrap; max-height: none; overflow-x: auto; scrollbar-width: none; scroll-padding-inline: 1rem; -webkit-mask-image: linear-gradient(to right, #000 85%, transparent); mask-image: linear-gradient(to right, #000 85%, transparent); }
    .explore-genre-chips::-webkit-scrollbar, .explore-chips::-webkit-scrollbar { display: none; }
    .explore-genre-chips a:last-child, .explore-chips a:last-child { margin-right: 2.5rem; }
}
.explore-genre-chips a, .explore-chips a { flex-shrink: 0; display: inline-flex; align-items: center; min-height: 38px; padding: .45rem .9rem; border: 1px solid #e8e0fa; border-radius: 9px; color: #70678b; background: #faf7ff; text-decoration: none; font-size: .7rem; }
.explore-genre-chips a[aria-current], .explore-chips a[aria-current] { background: #8051ff; border-color: #8051ff; color: white; }
.explore-page .explore-catalog-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); grid-auto-flow: row; grid-auto-columns: auto; gap: 1rem; overflow: visible; scroll-snap-type: none; }
.explore-catalog-grid .discovery-card { padding: .6rem; border: 1px solid #e9e4f2; border-radius: 9px; background: #fff; }
.explore-catalog-grid .discovery-card-copy { padding-top: .6rem; flex: 1; }
.explore-catalog-grid .discovery-new-badge { font-size: .55rem; }
.explore-details-link { display: block; text-align: center; padding: .55rem .25rem; border: 1px solid #c7b3ff; border-radius: 6px; color: #7543f4; text-decoration: none; font-size: .7rem; margin-top: .65rem; }
.explore-details-link:hover { background: #f3edff; }
.explore-page .explore-catalog-grid.is-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.explore-catalog-grid.is-list .discovery-card { display: grid; grid-template-columns: 80px minmax(0, 1fr); gap: .5rem 1rem; }
.explore-catalog-grid.is-list .discovery-cover { grid-row: 1 / 3; }
.explore-catalog-grid.is-list .discovery-card-copy { padding: 0; }
.explore-catalog-grid.is-list .explore-details-link { align-self: end; margin: 0; }
.community-dashboard.explore-page > .community-purpose { position: relative; overflow: hidden; width: 100%; margin-top: 2rem; padding: 2rem max(2rem, calc((100% - 1160px) / 2)); background: #f1ebff; grid-template-columns: auto minmax(220px, 1fr) minmax(200px, 1fr) 160px; }
.community-dashboard.explore-page > .community-purpose > p { color: #666184; font-size: .75rem; line-height: 1.7; }
.community-dashboard.explore-page > .community-purpose > p a { display: table; padding: .6rem 1rem; border-radius: 999px; background: #8051ff; color: #fff; text-decoration: none; margin-top: .7rem; }
.explore-purpose-art { width: 160px; height: auto; }
body:has(.explore-page) .site-footer { margin-top: 0; }
@media (max-width: 1100px) {
    .explore-page .explore-catalog-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .community-dashboard.explore-page > .community-purpose { grid-template-columns: auto minmax(0, 1fr) minmax(0, 1fr); }
    .explore-purpose-art { display: none; }
}
@media (max-width: 760px) {
    .explore-page .explore-hero .community-hero-copy { width: 100%; }
    .explore-page .explore-hero { padding: 2rem 1.25rem 0; }
    .explore-page .explore-hero h1 { font-size: clamp(2.5rem, 8vw, 3.5rem); }
    .explore-page .explore-latest { grid-template-columns: 1fr; padding: 1.4rem; gap: 1rem; }
    .explore-page .explore-latest h2 { margin: .5rem 0; }
    .explore-page .explore-latest h2 br, .explore-page .explore-latest p br { display: none; }
    .explore-page .explore-shelf-grid { grid-auto-columns: calc((100% - 2rem) / 3); }
    .explore-page .explore-catalog-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .community-dashboard.explore-page > .community-purpose { padding: 1.5rem 1rem; grid-template-columns: auto minmax(0, 1fr); }
    .community-dashboard.explore-page > .community-purpose > p { grid-column: 2; }
    .explore-catalog-tools { width: 100%; justify-content: space-between; }
}
@media (max-width: 480px) {
    .explore-page .explore-catalog-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .explore-page .explore-catalog-grid.is-list { grid-template-columns: minmax(0, 1fr); }
    .explore-page .explore-shelf-grid { grid-auto-columns: calc((100% - 1rem) / 2); }
    .explore-search { gap: .4rem; }
    .explore-search input { padding: .7rem .8rem; }
    .explore-search .btn-primary { padding: .6rem .9rem; }
    .explore-filters { gap: .25rem .8rem; }
}