/*! © 2026 Kerb3r0ps · www.kerb3r0ps.com */
:root { --ease: cubic-bezier(.16, 1, .3, 1); }
/* Biblioteca: catálogo de libros por área. Reutiliza tokens y utilidades de certificaciones.css + osint.css. */

.bib-filtros { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: 1.1rem; }

.bib-grid { display: flex; flex-direction: column; gap: clamp(2rem, 4vw, 3rem); margin-top: 1.6rem; }

.bib-cat-t { display: flex; align-items: baseline; gap: .7rem; font-family: var(--display); font-weight: 600; font-size: clamp(1.15rem, 2vw, 1.5rem); letter-spacing: -.02em; padding-bottom: .7rem; margin-bottom: 1.1rem; border-bottom: 1px solid var(--line); }
.bib-cat-t span { font-family: var(--body); font-weight: 500; font-size: .85rem; color: var(--ash); }

.bib-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(17rem, 1fr)); gap: 1rem; }

.bib-card { display: flex; flex-direction: column; gap: .5rem; padding: 1.15rem 1.2rem 1.1rem; border: 1px solid var(--line); border-radius: 1rem; background: var(--panel); transition: border-color .15s, transform .15s; }
.bib-card:hover { border-color: color-mix(in srgb, var(--bone) 28%, var(--line)); transform: translateY(-2px); }

.bib-card-top { display: flex; align-items: center; justify-content: space-between; gap: .6rem; }
.bib-acc { font: 600 .66rem/1 var(--mono, ui-monospace, monospace); letter-spacing: .12em; padding: .28rem .5rem; border-radius: 999px; border: 1px solid var(--line); color: var(--ash); }
.bib-card.es-gratis .bib-acc { color: #0c0c0d; background: var(--int, #F8BE38); border-color: transparent; }
.bib-meta { font-size: .76rem; color: var(--ash); letter-spacing: .02em; white-space: nowrap; }

.bib-tit { font-family: var(--display); font-weight: 600; font-size: 1.02rem; line-height: 1.25; letter-spacing: -.01em; overflow-wrap: anywhere; }
.bib-sub { color: var(--ash); font-size: .88rem; }
.bib-nota { color: var(--ash); font-size: .82rem; line-height: 1.4; }

.bib-cta { margin-top: auto; display: flex; flex-direction: column; gap: .15rem; padding-top: .7rem; font-weight: 600; font-size: .9rem; color: var(--bone); text-decoration: none; }
.bib-cta:hover { text-decoration: underline; text-underline-offset: 3px; }
.bib-fuente { font-weight: 400; font-size: .76rem; color: var(--ash); letter-spacing: .01em; }

.bib-vacio { padding: 2.5rem 0; color: var(--ash); text-align: center; }

@media (max-width: 560px) {
  .bib-cards { grid-template-columns: 1fr; }
}
/* 'Cómo está hecha': la línea divisoria respeta los márgenes del contenido, con aire arriba y abajo */
.mapa { padding-bottom: clamp(2rem, 4vw, 3.5rem); }
.osint-legal { border-top: none; margin-top: 0; padding-bottom: clamp(2.5rem, 5vw, 3.5rem); }
.osint-legal .wrap { border-top: 1px solid var(--line); padding-top: clamp(2.5rem, 5vw, 3.5rem); }


/* ───────── Preview: portada + resumen (popover en escritorio, hoja inferior en móvil) ───────── */
.bib-cover { position: relative; aspect-ratio: 3 / 4; border-radius: .5rem; overflow: hidden; background: linear-gradient(150deg, var(--panel-2, #16181c), var(--panel, #0f1012)); box-shadow: inset 0 0 0 1px var(--line); flex: none; }
.bib-cover img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transition: opacity .3s; }
.bib-cover.con-img img { opacity: 1; }
.bib-cover { background: linear-gradient(160deg, color-mix(in srgb, var(--cc, #9C9CA6) 16%, #141518), #0e0f11); }
.bib-cover::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 3px; background: var(--cc, #9C9CA6); opacity: .9; z-index: 1; }
.bib-cover-ph { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: space-between; gap: .4rem; padding: .7rem .6rem; text-align: left; }
.bib-cover-ph b { font-family: var(--display); font-weight: 600; font-size: .78rem; line-height: 1.2; letter-spacing: -.01em; color: var(--bone); text-wrap: balance; display: -webkit-box; -webkit-line-clamp: 5; -webkit-box-orient: vertical; overflow: hidden; }
.bib-cover-ph i { font-style: normal; font-size: .68rem; color: var(--ash); overflow-wrap: anywhere; }
.bib-cover.con-img::before, .bib-cover.con-img .bib-cover-ph { opacity: 0; }

.bib-pv-txt { display: flex; flex-direction: column; gap: .35rem; min-width: 0; }
.bib-pv-txt h4 { font-family: var(--display); font-weight: 600; font-size: 1.28rem; line-height: 1.25; letter-spacing: -.01em; }
.bib-pv-sub { color: var(--ash); font-size: .88rem; }
.bib-pv-res { color: var(--bone); font-size: .98rem; line-height: 1.5; }
.bib-pv-fuente { margin-top: auto; color: var(--ash); font-size: .78rem; }
.bib-pv-txt .bib-acc { align-self: flex-start; }

/* escritorio: popover */
.bib-pop { position: absolute; z-index: 60; width: 31rem; max-width: calc(100vw - 2rem); display: grid; grid-template-columns: 11rem 1fr; gap: 1.35rem; padding: 1.35rem; border: 1px solid var(--line); border-radius: 1.1rem; background: color-mix(in srgb, var(--panel) 94%, #000); backdrop-filter: blur(10px); box-shadow: 0 30px 70px -22px rgba(0,0,0,.92); opacity: 0; transform: translateY(10px) scale(.97); transform-origin: left center; pointer-events: none; transition: opacity .28s var(--ease), transform .4s var(--ease); }
.bib-pop.on { opacity: 1; transform: none; }
.bib-pop .bib-cover { opacity: 0; transform: translateY(6px); transition: opacity .35s var(--ease) .06s, transform .45s var(--ease) .06s; }
.bib-pop.on .bib-cover { opacity: 1; transform: none; }
.bib-pop .bib-pv-txt > * { opacity: 0; transform: translateY(5px); animation: bibIn .45s var(--ease) forwards; }
.bib-pop.on .bib-pv-txt > *:nth-child(1){animation-delay:.08s}.bib-pop.on .bib-pv-txt > *:nth-child(2){animation-delay:.13s}.bib-pop.on .bib-pv-txt > *:nth-child(3){animation-delay:.18s}.bib-pop.on .bib-pv-txt > *:nth-child(4){animation-delay:.23s}.bib-pop.on .bib-pv-txt > *:nth-child(5){animation-delay:.28s}
.bib-pop:not(.on) .bib-pv-txt > * { animation: none; }
@keyframes bibIn { to { opacity: 1; transform: none; } }

/* móvil: hoja inferior */
.bib-modal { position: fixed; inset: 0; z-index: 80; display: flex; align-items: flex-end; visibility: hidden; }
.bib-modal.on { visibility: visible; }
.bib-modal-bg { position: absolute; inset: 0; background: rgba(0,0,0,.6); opacity: 0; transition: opacity .2s; }
.bib-modal.on .bib-modal-bg { opacity: 1; }
.bib-modal-card { position: relative; width: 100%; max-height: 88vh; overflow-y: auto; display: grid; grid-template-columns: 6.5rem 1fr; gap: 1rem; padding: 1.3rem 1.2rem calc(1.3rem + env(safe-area-inset-bottom)); border-radius: 1.2rem 1.2rem 0 0; background: var(--panel); box-shadow: 0 -20px 50px -10px rgba(0,0,0,.8); transform: translateY(100%); transition: transform .25s cubic-bezier(.16,1,.3,1); }
.bib-modal.on .bib-modal-card { transform: none; }
.bib-modal-card .bib-cover { width: 6.5rem; }
.bib-modal-acc { grid-column: 1 / -1; display: flex; gap: .7rem; margin-top: .2rem; }
.bib-modal-cta { flex: 1; text-align: center; padding: .8rem 1rem; border-radius: 999px; background: var(--bone); color: #0c0c0d; font-weight: 600; font-size: .95rem; text-decoration: none; }
.bib-modal-x { padding: .8rem 1.2rem; border-radius: 999px; border: 1px solid var(--line); background: transparent; color: var(--bone); font-weight: 600; font-size: .95rem; cursor: pointer; }
@media (prefers-reduced-motion: reduce) { .bib-pop, .bib-modal-bg, .bib-modal-card, .bib-pop .bib-cover { transition: none; } .bib-pop .bib-pv-txt > * { animation: none; opacity: 1; transform: none; } }