/* Decorative viewport projection; foreground artwork remains untouched. */
body.project-detail-page.has-detail-backdrop {
  isolation: isolate;
  background: #171717 !important;
  background-image: none !important;
}
body.project-detail-page.has-detail-backdrop::before,
body.project-detail-page.has-detail-backdrop::after { content: none !important; }
.detail-backdrop {
  position: fixed;
  inset: -24px;
  z-index: -1;
  overflow: hidden;
  pointer-events: none;
  user-select: none;
  background: #171717;
  filter: blur(14px) brightness(.78);
}
.detail-backdrop-track {
  position: absolute;
  inset: 0;
}
.detail-backdrop img {
  position: absolute;
  left: 0;
  display: block;
  width: 100%;
  height: auto;
  max-width: none;
  opacity: 0;
  transition: opacity .2s ease;
}
.detail-backdrop img.is-loaded { opacity: 1; }
.detail-backdrop img[hidden] { display: none; }
/* Shadow the whole artwork column, not each image seam. */
.has-detail-backdrop .project-page {
  box-shadow: 0 0 32px 8px rgba(0, 0, 0, .26);
}
.has-detail-backdrop .gallery-preview,
.has-detail-backdrop .gallery-preview:hover,
.has-detail-backdrop .main-image-thumb,
.has-detail-backdrop .main-image-thumb:hover {
  box-shadow: 0 0 20px 4px rgba(0, 0, 0, .3) !important;
}
.has-detail-backdrop .project-intro {
  background: rgba(10, 10, 10, .78);
  color: #f3f3f3;
}
/* Text-heavy film sections need an opaque canvas; side gutters show the backdrop. */
.has-detail-backdrop.paris-ai-film-detail-page > .page-shell { background: transparent; }
.has-detail-backdrop .paris-section { background-color: #0a0a0a; }
@media (max-width: 760px) {
  .detail-backdrop { filter: blur(10px) brightness(.65); }
}
