.blog { padding-block: var(--space-10); }
p.blog__overtitle { font-size: var(--fs-20); line-height: 1.1; margin: 0 0 var(--space-1); }
h2.blog__title { font-size: var(--fs-55); line-height: 1.1; margin: 0 0 var(--space-6); }
.blog__grid { display: flex; gap: var(--space-4); }
.post-card { background: var(--white); border-radius: 0 0 2rem 2rem; display: flex; flex-direction: column;}
a.post-card__image-link { display: block; position: relative; &:after { position: absolute; content: ""; left: 0; width: 100%; height: 100%; bottom: -2px; background: transparent linear-gradient(0deg, #ffffff 0%, #ffffff 8%, #ffffffd9 22%, #ffffff00 50%) 0% 0% no-repeat padding-box; } }
img.post-card__image { width: 100%; object-fit: cover;}
.post-card__meta { padding: 5px var(--space-3) var(--space-3); display:flex; flex-direction: column; height: 100%;}
.post-card__category { font-size: var(--fs-20); text-decoration: none; text-transform: uppercase; display: block; margin-bottom: var(--space-1);}
p.post-card__title { font-size: var(--fs-25); line-height: 1.2; margin: 0 0 var(--space-3);}
p.post-card__title a { text-decoration: none;}
a.post-card__btn, a.blog__cta { background: var(--cobalt); border: 3px solid var(--cobalt); border-radius: 5rem; font-size: var(--fs-20); text-decoration: none; display: flex; justify-content: center; align-items: center; margin-top: auto; box-sizing: border-box; }
a.blog__cta { width: 16rem; margin: var(--space-8) auto 0; height: 4rem; }

@media (max-width: 550px){
    .post-card { flex: 0 0 calc(90% - (var(--space-4) / 2)); }
}
@media (min-width: 551px) and (max-width: 766.9px){
    .post-card { flex: 0 0 calc(60% - (var(--space-4) / 2)); }
}
@media (max-width: 766.9px){
    img.post-card__image { height: 15rem; }
}
@media (min-width: 767px) and (max-width: 899.9px){
    .post-card { flex: 0 0 calc(50% - (var(--space-4) / 2)); }
    img.post-card__image { height: 15rem; }
}
@media (max-width: 899.9px){
    .blog__grid { overflow-x: auto; }
}
@media (min-width: 900px){
    .blog__grid { flex-wrap: wrap; }
    .post-card { flex: 0 0 calc((100% - (2 * var(--space-4))) / 3); }
}
@media (min-width: 900px) and (max-width: 1400px){
    img.post-card__image { height: 13rem; }
}
@media  (max-width: 1099.9px){
    a.post-card__btn { height: 3rem; }
}
@media (min-width: 1100px) {
    a.post-card__btn { height: 3.5rem; }
}
@media (min-width: 1401px){
    img.post-card__image { height: 18rem; }
}