.media-card[data-v-8bfb8f76]{position:relative;cursor:pointer;line-height:0}.media-card[data-v-8bfb8f76]:before{display:block;content:"";width:100%;height:100%;border:2px solid var(--color-yellow);box-sizing:border-box;position:absolute;top:0;left:0;border-radius:6px;z-index:1;background:linear-gradient(180deg,rgba(255,188,19,0) 30%,var(--Yellow,#ffbc13) 100%);opacity:0;transition:opacity var(--animation-duration) var(--animation-timing)}.media-card.size-l[data-v-8bfb8f76]{aspect-ratio:450/253}.media-card.size-m[data-v-8bfb8f76]{aspect-ratio:450/311}.media-card.size-s[data-v-8bfb8f76]{aspect-ratio:450/651}.media-card i[data-v-8bfb8f76]{position:absolute;top:50%;left:50%;z-index:1;display:flex;align-items:center;justify-content:center;width:23%;max-width:86px;height:auto;background:var(--color-white);border-radius:100%;aspect-ratio:1/1;transform:translate(-50%,-50%);transition:all var(--animation-duration) var(--animation-timing)}.media-card i svg[data-v-8bfb8f76]{display:block;width:100%;height:100%;color:var(--color-black)}.media-card .image[data-v-8bfb8f76]{position:relative;width:100%;height:100%;background-color:#0000004d;border-radius:8px;overflow:hidden}.media-card img[data-v-8bfb8f76]{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;transition:transform var(--animation-duration) var(--animation-timing)}@media(hover:hover)and (pointer:fine){.media-card[data-v-8bfb8f76]:hover:before{opacity:1}.media-card:hover i[data-v-8bfb8f76]{width:27%;max-width:100px;background:var(--color-yellow)}.media-card:hover img[data-v-8bfb8f76]{transform:scale(1.1)}}