/* The project page uses the approved logo film as a decorative background. */
.project-background {
  position: fixed;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  pointer-events: none;
  background: #050707;
}

.project-background img,
.project-background video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.project-background video {
  transition: opacity .5s ease;
}

.has-background-video .project-background video:not(.is-active) {
  opacity: 0;
}

.project-background::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, rgb(3 6 5 / .64), rgb(3 6 5 / .40)),
    linear-gradient(0deg, rgb(3 6 5 / .40), rgb(3 6 5 / .08) 60%, rgb(3 6 5 / .24));
}

.project-page .inner-main,
.project-page .site-footer {
  position: relative;
  z-index: 1;
}

.project-page .page-heading,
.project-page .contact-direct {
  text-shadow: 0 2px 16px rgb(0 0 0 / .65);
}

.project-page .page-heading > p,
.project-page .contact-direct p {
  color: #c8cec9;
}

.project-page .brief-form {
  background: rgb(13 18 15 / .92);
  border: 1px solid rgb(255 255 255 / .13);
}


/* Keep the complete wordmark within a narrow phone screen. */
@media (max-aspect-ratio: 1/1) {
  .project-background img,
  .project-background video {
    object-fit: contain;
  }
}

@media (prefers-reduced-motion: reduce) {
  .project-background video { transition: none; }
}

@media print {
  .project-background { display: none; }
}