.card{width:100%;position:relative}.card-content{width:100%;display:flex;flex-direction:column}.card-content img{width:100%;aspect-ratio:2/3}.card-content.shadow:before{content:"";position:absolute;display:block;top:0;left:0;width:100%;background:linear-gradient(180deg,rgba(18,18,18,0) 70%,var(--primary) 100%);aspect-ratio:2/3}.card-content h3{font-size:16px;margin:16px 0 0;color:var(--white)}.card-content span{color:var(--primary-light);font-size:12px;font-weight:400;margin-top:8px;display:block}.card-rate{position:absolute;top:0;right:0;display:flex;align-items:center;background-color:var(--natural-black);padding:4px 8px}.card-rate img{margin-top:-1px;margin-right:4px}.card-rate span{font-size:12px;color:var(--white);display:block;line-height:10px}.card-button{position:absolute;top:34px;right:0;background-color:var(--natural-black);border:none;display:flex;align-items:center;justify-content:center;padding:5px;cursor:pointer;opacity:1;transition:opacity .3s ease}.card-button:hover{opacity:.7}.card-button.active{background-color:var(--primary)}