.blog-card{
  --card-image:none;
  position:relative;
  min-height:340px;
  display:flex!important;
  flex-direction:column;
  justify-content:flex-end;
  isolation:isolate;
  overflow:hidden;
  padding:34px!important;
  background:var(--navy-mid);
  border-color:rgba(143,162,184,.22)!important;
}
.blog-card::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-2;
  background-image:var(--card-image);
  background-size:cover;
  background-position:center;
  transition:transform .45s ease,filter .45s ease;
}
.blog-card::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:linear-gradient(180deg,rgba(6,13,23,.05) 10%,rgba(6,13,23,.5) 50%,rgba(6,13,23,.98) 100%);
}
.blog-card h3{color:var(--white);text-wrap:balance;text-shadow:0 2px 18px rgba(0,0,0,.3)}
.blog-card p{color:#b8c8d9!important}
.blog-card p:last-child{color:var(--teal-bright)!important}
.blog-card:hover::before{transform:scale(1.035);filter:saturate(1.08)}
.article-hero-media{
  position:relative;
  margin-top:42px;
  width:100%;
  aspect-ratio:12/5;
  overflow:hidden;
  border:1px solid rgba(143,162,184,.2);
  border-radius:24px;
  background:var(--navy-mid);
  box-shadow:0 28px 80px rgba(0,0,0,.26);
}
.article-hero-media::after{
  content:"";
  position:absolute;
  inset:0;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.03);
  pointer-events:none;
}
.article-hero-media img{width:100%;height:100%;display:block;object-fit:cover}
@media(max-width:650px){
  .blog-card{min-height:300px;padding:26px!important}
  .article-hero-media{margin-top:30px;aspect-ratio:4/3;border-radius:18px}
}
@media(prefers-reduced-motion:reduce){.blog-card::before{transition:none}}