/* Novel Patterns Blog CMS upgrade: banner images on listing cards. */
.blog-grid .blog-card-img > img,
.np-blog-grid .blog-card-img > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.blog-grid .blog-card-img .blog-card-tag,
.np-blog-grid .blog-card-img .blog-card-tag {
  position: absolute;
  z-index: 2;
}
.blog-featured .blog-featured-img > img {
  width: 100%;
  height: 100%;
  min-height: 320px;
  object-fit: cover;
  display: block;
}
@media (max-width: 768px) {
  .blog-featured .blog-featured-img > img { min-height: 220px; }
}

/* v2: every CMS listing card has a real banner image. */
.np-blog-grid .np-blog-card{
  overflow:hidden;
}
.np-blog-grid .np-blog-card-image{
  display:block;
  position:relative;
  width:calc(100% + 40px);
  height:190px;
  margin:-20px -20px 18px;
  overflow:hidden;
  background:#dfe8f4;
}
.np-blog-grid .np-blog-card-image img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}
.blog-grid .blog-card-img{
  position:relative;
  overflow:hidden;
}
.blog-grid .blog-card-img > img{
  position:absolute;
  inset:0;
}
@media (max-width:768px){
  .np-blog-grid .np-blog-card-image{height:175px;}
}

/* v3 corrective: card and featured media are first-class layout regions. */
.np-blog-featured .np-blog-featured-art{
  min-height:320px;
  overflow:hidden;
  border-radius:22px;
  background:linear-gradient(145deg,#0b1b33,#123a6f);
}
.np-blog-featured .np-blog-featured-art img{
  width:100%;
  height:100%;
  min-height:320px;
  object-fit:cover;
  object-position:center;
}
.np-blog-grid .np-blog-image-missing{
  display:block;
  width:100%;
  height:100%;
  background:linear-gradient(145deg,#0b1b33,#1d5aa6);
}
@media(max-width:768px){
  .np-blog-featured .np-blog-featured-art,
  .np-blog-featured .np-blog-featured-art img{min-height:220px;}
}

/* Verified local media should always render; this is a non-blank last-resort guard. */
.np-blog-featured .np-blog-featured-art.np-image-load-failed,
.np-blog-grid .np-blog-card-image.np-image-load-failed{
  background:
    radial-gradient(circle at 82% 18%,rgba(68,190,255,.28),transparent 34%),
    linear-gradient(145deg,#071426,#16447d);
}
.np-blog-featured .np-blog-featured-art.np-image-load-failed::after,
.np-blog-grid .np-blog-card-image.np-image-load-failed::after{
  content:'Novel Patterns';
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  color:rgba(255,255,255,.82);
  font-weight:800;
  letter-spacing:.04em;
}
.np-blog-featured .np-blog-featured-art{position:relative;}