a.resource-card{color:var(--text-color);text-decoration:none;display:block}a.resource-card figure{border-radius:var(--border-radius-small);overflow:hidden}a.resource-card figure .hover-effect{justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:absolute;top:0;right:0}@media (max-width:600px){a.resource-card figure .hover-effect{justify-content:flex-end;align-items:flex-start;top:10px;right:10px}}a.resource-card figure .hover-effect strong{background:var(--green);text-align:center;border-radius:100%;justify-content:center;align-items:center;width:140px;height:140px;transition:all .5s cubic-bezier(.22,1,.36,1);display:flex;transform:scale(0)}@media (max-width:600px){a.resource-card figure .hover-effect strong{width:100px;height:100px;transform:scale(1)}}@media (hover:none){a.resource-card figure .hover-effect strong{display:none}}a.resource-card img.card-image{aspect-ratio:1;object-fit:cover;transition:all .5s cubic-bezier(.22,1,.36,1)}a.resource-card footer.figure-footer{justify-content:space-between;align-items:flex-end;gap:5px;width:100%;padding:20px;display:flex;position:absolute;bottom:0;left:0}@media (max-width:600px){a.resource-card footer.figure-footer{padding:10px}}a.resource-card .categories,a.resource-card .tags{flex-wrap:wrap;gap:8px;display:inline-flex}a.resource-card .categories .category,a.resource-card .categories .tag,a.resource-card .tags .category,a.resource-card .tags .tag{background:var(--white);color:var(--black);white-space:nowrap;border-radius:20px;padding:.5em .75em;font-weight:600;line-height:1}a.resource-card .author{background:var(--white);color:var(--black);white-space:nowrap;opacity:0;border-radius:20px;flex-shrink:0;justify-content:center;align-items:center;gap:8px;padding:.3em .6em .3em .3em;font-weight:500;transition:all .5s cubic-bezier(.22,1,.36,1);display:inline-flex}@media (hover:none){a.resource-card .author{opacity:1}}a.resource-card .author img{border-radius:100%;width:30px;height:30px}a.resource-card .bottom{margin-top:20px}a.resource-card .bottom .read-time{margin-bottom:10px;font-weight:500}a.resource-card .bottom p{margin:0;font-weight:500}@media (max-width:600px){a.resource-card .bottom p{font-size:var(--font-h6)}}@media (hover:hover){a.resource-card:hover img.card-image{transform:scale(1.1)}a.resource-card:hover .hover-effect strong{transform:scale(1)}a.resource-card:hover .author{opacity:1}}
