/* Directori antic: conserva els enllaços guardats i mostra només grups. */
.species-directory-page .featured-species{padding:150px 0 80px;background:white}
.species-directory-page .header{background:rgba(255,255,255,.96)}
.species-directory-page .header::before{opacity:0}
.species-directory-page .header .nav-menu a,.species-directory-page .header .header-actions a{color:var(--color-primario)}
.species-directory-page .header .current::after{background:var(--color-secundario)}
.species-directory-page .header .language-selector span{color:#6b7280}
@media(max-width:768px){.species-directory-page .header .main-nav.mobile-open .nav-menu a{color:white}.species-directory-page .featured-species{padding-top:125px}}

/* Quatre grups: distribució 2 x 2, i espècies en dues columnes. */
.categories-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.species-group-page .species-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
@media(max-width:768px){.categories-grid,.species-group-page .species-grid{grid-template-columns:1fr}}

/* Mòbil: mostra la il·lustració sencera sense retalls laterals ni zoom. */
@media(max-width:768px){
    .species-group-page .species-card{
        background:#fff;
        height:auto;
        aspect-ratio:1280 / 905;
        border-radius:16px;
        overflow:hidden;
        clip-path:inset(0 round 16px);
        border:1px solid #ddeaf0;
    }
    .species-group-page .species-card img{
        display:block;
        object-fit:contain;
        object-position:center;
    }
    .species-group-page .species-card:hover img{
        transform:none;
    }
}

/* Categoria a dalt; nom i enllaç a baix per deixar lliure la il·lustració. */
.species-group-page .species-overlay{
    padding:24px;
    justify-content:flex-end;
    background:linear-gradient(to bottom,rgba(8,34,56,.30),transparent 25%,transparent 50%,rgba(8,34,56,.82));
}
.species-group-page .species-category{
    position:absolute;
    top:24px;
    left:24px;
    margin:0;
}
@media(max-width:768px){
    .species-group-page .species-overlay{padding:18px}
    .species-group-page .species-category{top:18px;left:18px}
    .species-group-page .species-overlay h3{
        font-size:1.35rem;
        margin-bottom:6px;
    }
}