.article-card{border:1px solid var(--border-color);border-radius:12px;box-shadow:0 7px 29px #64646f33;box-shadow:0 2px 8px #63636333;display:flex;flex-direction:column}.article-card .image{border-radius:8px;height:120px;-o-object-fit:cover;object-fit:cover;width:100%}.article-card .image-placeholder{background-color:var(--bg-color);height:120px;width:100%}.article-card .body{display:grid;flex:1;gap:12px 8px;grid-template-columns:1fr 1fr;grid-template-rows:auto 1fr auto;padding:16px}.article-card .body .topic{border-radius:8px;font-size:.75rem;justify-self:start;padding:4px 8px}.article-card .body .title{font-size:.875rem;font-weight:600;grid-column:1/3}.article-card .body .desc{color:var(--gray-color);font-size:.75rem;grid-column:1/3;margin-top:auto}.article-card .body .views{align-items:center;align-self:end;color:var(--gray-color);display:flex;font-size:.875rem;gap:7px}.article-card .body .views .icon{background-color:var(--gray-color);height:18px;-webkit-mask-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' xml:space='preserve' viewBox='0 0 122.88 83.78'%3E%3Cpath d='M95.73 10.81c10.53 7.09 19.6 17.37 26.48 29.86l.67 1.22-.67 1.21c-6.88 12.49-15.96 22.77-26.48 29.86-10.27 6.92-21.93 10.82-34.29 10.82s-24.02-3.9-34.28-10.81C16.62 65.87 7.55 55.59.67 43.1L0 41.89l.67-1.22C7.55 28.18 16.62 17.9 27.15 10.81 37.42 3.9 49.08 0 61.44 0s24.01 3.9 34.29 10.81M60.79 22.17l4.08.39a13.8 13.8 0 0 0-2.31 7.67c0 7.48 5.86 13.54 13.1 13.54 2.32 0 4.5-.62 6.39-1.72.03.47.05.94.05 1.42 0 11.77-9.54 21.31-21.31 21.31s-21.31-9.54-21.31-21.31c0-11.76 9.54-21.3 21.31-21.3M109 41.89c-5.5-9.66-12.61-17.6-20.79-23.11-8.05-5.42-17.15-8.48-26.77-8.48-9.61 0-18.71 3.06-26.76 8.48-8.18 5.51-15.29 13.45-20.8 23.11 5.5 9.66 12.62 17.6 20.8 23.1 8.05 5.42 17.15 8.48 26.76 8.48 9.62 0 18.71-3.06 26.77-8.48 8.18-5.5 15.29-13.44 20.79-23.1'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' xml:space='preserve' viewBox='0 0 122.88 83.78'%3E%3Cpath d='M95.73 10.81c10.53 7.09 19.6 17.37 26.48 29.86l.67 1.22-.67 1.21c-6.88 12.49-15.96 22.77-26.48 29.86-10.27 6.92-21.93 10.82-34.29 10.82s-24.02-3.9-34.28-10.81C16.62 65.87 7.55 55.59.67 43.1L0 41.89l.67-1.22C7.55 28.18 16.62 17.9 27.15 10.81 37.42 3.9 49.08 0 61.44 0s24.01 3.9 34.29 10.81M60.79 22.17l4.08.39a13.8 13.8 0 0 0-2.31 7.67c0 7.48 5.86 13.54 13.1 13.54 2.32 0 4.5-.62 6.39-1.72.03.47.05.94.05 1.42 0 11.77-9.54 21.31-21.31 21.31s-21.31-9.54-21.31-21.31c0-11.76 9.54-21.3 21.31-21.3M109 41.89c-5.5-9.66-12.61-17.6-20.79-23.11-8.05-5.42-17.15-8.48-26.77-8.48-9.61 0-18.71 3.06-26.76 8.48-8.18 5.51-15.29 13.45-20.8 23.11 5.5 9.66 12.62 17.6 20.8 23.1 8.05 5.42 17.15 8.48 26.76 8.48 9.62 0 18.71-3.06 26.77-8.48 8.18-5.5 15.29-13.44 20.79-23.1'/%3E%3C/svg%3E");width:18px}.article-card .body .read-btn{align-self:flex-end;border:1px solid var(--gray-color);border-radius:50%;height:36px;justify-self:end;transition:.3s ease;width:36px}.article-card .body .read-btn .icon{background-color:var(--gray-color);height:40%;-webkit-mask-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill-rule='evenodd' clip-rule='evenodd' image-rendering='optimizeQuality' shape-rendering='geometricPrecision' text-rendering='geometricPrecision' viewBox='0 0 267 512.43'%3E%3Cpath fill-rule='nonzero' d='M3.22 18.9c-4.28-4.3-4.3-11.31-.04-15.64s11.2-4.35 15.48-.04l245.12 245.16c4.28 4.3 4.3 11.31.04 15.64L18.66 509.22a10.874 10.874 0 0 1-15.48-.05c-4.26-4.33-4.24-11.33.04-15.63L240.5 256.22z'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' fill-rule='evenodd' clip-rule='evenodd' image-rendering='optimizeQuality' shape-rendering='geometricPrecision' text-rendering='geometricPrecision' viewBox='0 0 267 512.43'%3E%3Cpath fill-rule='nonzero' d='M3.22 18.9c-4.28-4.3-4.3-11.31-.04-15.64s11.2-4.35 15.48-.04l245.12 245.16c4.28 4.3 4.3 11.31.04 15.64L18.66 509.22a10.874 10.874 0 0 1-15.48-.05c-4.26-4.33-4.24-11.33.04-15.63L240.5 256.22z'/%3E%3C/svg%3E");transition:.3s ease;width:40%}.article-card .body .read-btn:hover{background-color:var(--main-color);border-color:var(--main-color)}.article-card .body .read-btn:hover .icon{background-color:#fff}@media only screen and (min-width:600px){.article-card .image,.article-card .image-placeholder{height:180px}.article-card .body{padding:20px}.article-card .body .title{font-size:1rem}.article-card .body .desc{font-size:.8125rem}.article-card .body .views{font-size:1rem}}