/* The same photograph depth and blue dust as Work / project pages. */
:root { --ease-out: cubic-bezier(.23, 1, .32, 1); }
body.blog { isolation: isolate; }
#blog-particles {
  position: fixed; inset: 0; inline-size: 100%; block-size: 100%;
  z-index: -1; pointer-events: none;
}
.blog-main, .blog-footer { position: relative; }
.blog-image-frame {
  display: block; position: relative; overflow: hidden; inline-size: 100%;
  background: var(--blog-placeholder);
}
.blog-image-plane { display: block; position: absolute; inset: 0; }
.blog-parallax-enabled .blog-image-plane { inset: -12% 0; }
.blog-image-reveal { display: block; inline-size: 100%; block-size: 100%; }
.blog-image-frame img {
  display: block; inline-size: 100%; block-size: 100%; object-fit: cover;
  transition: transform .6s var(--ease-out);
}
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  .blog-work-card:hover .blog-image-frame img,
  .blog-figure .blog-image-frame:hover img,
  .blog-gallery-grid .blog-image-frame:hover img,
  .blog-rich .blog-image-frame:hover img { transform: scale(1.07); }
}
@media (prefers-reduced-motion: reduce) {
  .blog-image-plane { inset: 0 !important; transform: none !important; }
  .blog-image-frame img, .blog-image-reveal { transform: none !important; }
}