/* EVATECH blog image consistency fix — 2026-09-11
   Use the exact article hero image on Homepage and Blog cards, but never crop the source.
*/

/* Homepage Useful Articles: full source image over a soft fill made from the same image. */
[data-page="home-v4"] .v4-article {
  isolation:isolate;
  background:#191919;
}
[data-page="home-v4"] .v4-article::before {
  content:"";
  position:absolute;
  z-index:0;
  inset:-28px;
  background-image:var(--v4-article-image);
  background-position:center;
  background-size:cover;
  filter:blur(22px) brightness(.5) saturate(.9);
  opacity:.72;
  transform:scale(1.08);
}
[data-page="home-v4"] .v4-article>img {
  position:relative;
  z-index:1;
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
  opacity:1;
}
[data-page="home-v4"] .v4-article:hover>img { transform:scale(1.015); }
[data-page="home-v4"] .v4-article__body {
  z-index:2;
  padding-top:84px;
  background:linear-gradient(transparent,rgba(0,0,0,.92));
}

/* Blog listing: same full article image, with a subtle same-image fill behind it. */
.v4-blog-list__media {
  position:relative;
  height:220px;
  overflow:hidden;
  isolation:isolate;
  border-radius:16px;
  background:#151515;
}
.v4-blog-list__media::before {
  content:"";
  position:absolute;
  z-index:0;
  inset:-22px;
  background-image:var(--v4-blog-image);
  background-position:center;
  background-size:cover;
  filter:blur(18px) brightness(.62) saturate(.9);
  opacity:.68;
  transform:scale(1.08);
}
.v4-blog-list .v4-blog-list__media img {
  position:relative;
  z-index:1;
  display:block;
  width:100%;
  height:100%;
  margin:0;
  border-radius:0;
  object-fit:contain;
  object-position:center;
}

/* Article hero: preserve the original aspect ratio instead of clipping it to 520px. */
.v4-blog-article img {
  display:block;
  width:100%;
  height:auto;
  max-height:none;
  margin:26px auto;
  object-fit:contain;
  object-position:center;
}

@media (max-width:899px) {
  .v4-blog-list__media { height:clamp(280px,78vw,520px); }
}
