/* TNG responsive image delivery — picture/srcset, LQIP, layout stability */
.tng-picture {
  display: block;
  width: 100%;
  margin: 0;
}

.tng-picture img,
.tng-responsive-img {
  display: block;
  width: 100%;
  height: auto;
  max-width: 100%;
}

.tng-picture--lqip img,
.tng-responsive-img--lqip {
  background-color: var(--pair-atmo-deep, #050609);
  background-size: cover;
  background-position: center;
  filter: saturate(0.92) contrast(1.04);
}

.tng-picture img[loading="lazy"],
.tng-responsive-img[loading="lazy"] {
  content-visibility: auto;
}

.tng-picture img[fetchpriority="high"],
.tng-responsive-img[fetchpriority="high"] {
  content-visibility: visible;
}

/* Prevent layout shift — aspect ratio from width/height attrs */
.tng-picture img[width][height],
.tng-responsive-img[width][height] {
  aspect-ratio: attr(width) / attr(height);
}

@supports not (aspect-ratio: 1) {
  .tng-picture img[width][height] {
    height: auto;
  }
}
