
.auto-card{border:var(--border); background:transparent; padding:0; overflow:hidden; margin-bottom:var(--size); transition:all .5s ease; position:relative;}
.auto-card__photo{display:block; margin:-1px -1px 0; aspect-ratio:3/2;}
.auto-card__photo img{width:100%; height:100%; object-fit: contain;}
.auto-card__caption{min-height:6rem;}
.auto-card__body{display:block; padding:var(--size-small);}
.auto-card__price{display:block; font-weight:bold; font-size:1.25rem;}
.auto-card__char{display:flex; gap:.5rem; font-size:.875rem; color:var(--color-ghost); margin-top:0; margin-bottom:.5rem;}
.auto-card__char li:not(:first-child):before{content:'/'; position:relative; left:-5px;}
.auto-card__btn{margin-top:1rem;}
.auto-card:hover{background:var(--color-light); border-color:var(--color-light); box-shadow:0 1rem 4rem -2rem rgba(0,0,0,.3);}
.auto-card__title{display:block; font-weight:normal; }
.auto-card__title:hover{color:var(--color-ghost);}
.auto-card__btn{width:100%; background:transparent; color:var(--color-brand); border:1px solid var(--color-brand); }
.auto-card:hover .auto-card__btn{width:100%; background:var(--color-brand); color:var(--color-white); }

.auto-labels{position:absolute; top:0; left:0; padding:.5rem; display:flex; gap:1rem; font-size:.7rem;line-height:1;}
.auto-labels__item{border-radius:var(--radial-small);  padding:.25rem .5rem; background:var(--color-light)}
.auto-labels__item.type-{background:#259539; color:var(--color-white);}
.auto-labels__item.type-1{background:#d3bc5d;}

.subcats-nav{display:flex; flex-wrap:wrap; gap:.5rem; margin-top:var(--size-negative-half); margin-bottom:var(--size);}
.subcats-nav__link{display:block; border:var(--border); line-height:1; padding:.5rem 1rem;}
.subcats-nav__link:hover{background:var(--color-brand); color:var(--color-white); border-color:var(--color-brand);}

.country-nav{display:inline-flex; width: 100%; gap:1rem; margin-top:var(--size-negative-half); margin-bottom:var(--size);}
.country-nav__item{flex: 1;}
.country-nav__link{padding:.5rem 2rem; text-align:center;  display:block; font-weight:bold; border:1px solid var(--color-fill-darker); border-radius:var(--radial-card);}
.country-nav__link:hover{background:var(--color-brand); color:var(--color-white)}


@media screen and (min-width:47em) {
    .country-nav{width:auto;}
}