/* Reliable subtle movement for Poroman hero and subpage banner photographs.
   Animates the existing background image directly; text remains stationary. */
.poroman-hero,
.pagehead {
  background-repeat: no-repeat !important;
  background-position: 50% 50% !important;
  background-size: 104% auto !important;
  animation: poroman-banner-drift 18s ease-in-out infinite alternate !important;
  will-change: background-position, background-size;
}

/* Preserve the existing photographs and readable dark overlays. */
.poroman-hero {
  background-image:
    linear-gradient(100deg,rgba(7,33,28,.90),rgba(20,58,43,.44)),
    url('/Images/hero.jpg') !important;
}
body[data-poroman-page="about"] .pagehead {
  background-image:linear-gradient(90deg,rgba(9,35,28,.88),rgba(9,35,28,.46)),url('/Images/about-banner.jpg') !important;
}
body[data-poroman-page="services"] .pagehead {
  background-image:linear-gradient(90deg,rgba(9,35,28,.88),rgba(9,35,28,.46)),url('/Images/services-banner.jpg') !important;
}
body[data-poroman-page="experience"] .pagehead {
  background-image:linear-gradient(90deg,rgba(9,35,28,.88),rgba(9,35,28,.46)),url('/Images/experience-banner.jpg') !important;
}
body[data-poroman-page="people"] .pagehead {
  background-image:linear-gradient(90deg,rgba(9,35,28,.88),rgba(9,35,28,.46)),url('/Images/people-banner.jpg') !important;
}
body[data-poroman-page="developments"] .pagehead {
  background-image:linear-gradient(90deg,rgba(9,35,28,.88),rgba(9,35,28,.46)),url('/Images/developments-banner.jpg') !important;
}
body[data-poroman-page="contact"] .pagehead {
  background-image:linear-gradient(90deg,rgba(9,35,28,.88),rgba(9,35,28,.46)),url('/Images/contact-banner.jpg') !important;
}

@keyframes poroman-banner-drift {
  0%   { background-position:48% 50%; background-size:104% auto; }
  50%  { background-position:52% 48%; background-size:108% auto; }
  100% { background-position:50% 52%; background-size:112% auto; }
}

@media (max-width:700px) {
  .poroman-hero,.pagehead {
    background-size:auto 108% !important;
    animation-name:poroman-banner-drift-mobile !important;
  }
  @keyframes poroman-banner-drift-mobile {
    0%   { background-position:48% 50%; background-size:auto 108%; }
    100% { background-position:52% 48%; background-size:auto 116%; }
  }
}

@media (prefers-reduced-motion:reduce) {
  .poroman-hero,.pagehead {
    animation:none !important;
    background-position:center !important;
    background-size:cover !important;
  }
}