/* ======================================================
   BIBLIOTECA
   ====================================================== */

.biblioteca-hero{
    padding:18px 0;
}

.biblioteca-hero .section-title{
    margin:0;
}

.biblioteca-hero .section-title h1{
    margin-bottom:8px;
}

/*
   Catálogo fijo: máximo 4 libros por fila.
   El ancho de cada tarjeta no crece cuando hay menos libros.
*/
.biblioteca-grid{
    display:grid;
    grid-template-columns:repeat(4, 280px);
    justify-content:center;
    gap:2rem;
    padding:0 0 70px;
}

.biblioteca-card{
    width:280px;
    display:flex;
    flex-direction:column;
    background:var(--color-white);
    border-radius:var(--radius-lg);
    overflow:hidden;
    box-shadow:var(--shadow-sm);
    transition:transform .25s ease,box-shadow .25s ease;
}

.biblioteca-card:hover{
    transform:translateY(-5px);
    box-shadow:var(--shadow-md);
}

.biblioteca-cover{
    width:100%;
    aspect-ratio:841.89/595.276;
    object-fit:cover;
    display:block;
    background:#eef2f7;
}

.biblioteca-card-content{
    padding:1.25rem;
    display:flex;
    flex-direction:column;
    flex:1;
}

.biblioteca-card-content h3{
    margin:0 0 .75rem;
    color:var(--color-primary-dark);
}

.biblioteca-card-content p{
    margin:0 0 1.25rem;
    color:var(--color-gray);
    flex:1;
}

.biblioteca-meta{
    display:flex;
    gap:.6rem;
    flex-wrap:wrap;
    margin-bottom:1.1rem;
}

.biblioteca-meta span{
    padding:.35rem .7rem;
    border-radius:999px;
    background:#eef4fb;
    color:var(--color-primary-dark);
    font-size:.82rem;
    font-weight:600;
}

.biblioteca-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:.5rem;
    padding:.8rem 1.1rem;
    border-radius:var(--radius-md);
    background:var(--color-primary);
    color:#fff;
    font-weight:700;
    transition:var(--transition);
}

.biblioteca-btn:hover{
    background:var(--color-primary-dark);
    color:#fff;
}

/* 3 columnas */
@media(max-width:1250px){
    .biblioteca-grid{
        grid-template-columns:repeat(3, 280px);
    }
}

/* 2 columnas */
@media(max-width:930px){
    .biblioteca-grid{
        grid-template-columns:repeat(2, 280px);
        gap:1.5rem;
    }
}

/* 1 columna / celular */
@media(max-width:620px){
    .biblioteca-hero{
        padding:18px 0 8px;
    }

    .biblioteca-grid{
        grid-template-columns:minmax(0, 280px);
        gap:1.25rem;
        padding-bottom:50px;
    }

    .biblioteca-card{
        width:280px;
        max-width:calc(100vw - 32px);
    }
}