/* SAFARIBOK | startsida.css | Version 1.2.1 | 2026-10-07 */
/* Bootstrap 4 grid; source card spacing and breakpoints retained. */
#app.webb-home .grid.row{display:flex;gap:0;margin-left:-12px;margin-right:-12px;margin-bottom:-30px}
#app.webb-home .home-animal-column{padding-left:12px;padding-right:12px;margin-bottom:30px;flex:0 0 25%;max-width:25%}
#app.webb-home .home-animal-column .animal-card{height:100%}
@media(max-width:1100px){#app.webb-home .home-animal-column{flex-basis:33.333333%;max-width:33.333333%}}
@media(max-width:780px){#app.webb-home .grid.row{margin-left:-7.5px;margin-right:-7.5px;margin-bottom:-23px}#app.webb-home .home-animal-column{flex-basis:50%;max-width:50%;padding-inline:7.5px;margin-bottom:23px}}

/* Ikoner centreras geometriskt; ingen teckenbaslinje eller generell knapp-padding påverkar dem. */
#app.webb-home .category-navigation button {
    display: inline-grid;
    place-items: center;
    padding: 0;
    line-height: 1;
    flex: 0 0 auto;
}
#app.webb-home .category-navigation button i {
    display: block;
    width: 1em;
    height: 1em;
    font-size: 15px;
    line-height: 1;
    text-align: center;
    margin: 0;
    transform: none;
}
#app.webb-home .category-navigation button i::before { display: block; line-height: 1; }

/* SAFARIBOK 1.3.0: Bootstrap-kolumner får inte krympa kort inuti CSS Grid. */
#app.webb-home .home-animal-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;margin:0}
#app.webb-home .home-animal-grid>.home-animal-column{width:auto;max-width:none;min-width:0;padding:0}
#app.webb-home .home-animal-grid .animal-card{display:block;width:100%;min-width:0}
#app.webb-home .home-animal-grid .image-wrap{position:relative;width:100%;height:auto;aspect-ratio:4/3;overflow:hidden;border-radius:15px}
#app.webb-home .home-animal-grid .image-wrap>a{display:block;width:100%;height:100%}
#app.webb-home .home-animal-grid .image-wrap img{display:block;width:100%;height:100%;object-fit:cover}
#app.webb-home .home-animal-grid .image-label{max-width:calc(100% - 70px)}
@media(max-width:1100px){#app.webb-home .home-animal-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:780px){#app.webb-home .home-animal-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:480px){#app.webb-home .home-animal-grid{grid-template-columns:1fr}}

/* 1.3.1: Kortet ska fylla sin gridcell även om äldre kolumnregler finns kvar. */
#app.webb-home .home-animal-grid>.home-animal-column{width:100%!important;max-width:100%!important;flex:none!important;padding:0!important;margin:0!important}
#app.webb-home .home-animal-grid .animal-card .image-wrap{width:100%!important;max-width:none!important;height:auto!important;aspect-ratio:4/3!important}
#app.webb-home .home-animal-grid .animal-card .image-wrap img{width:100%!important;height:100%!important;max-width:none!important;max-height:none!important;object-fit:cover!important}