
/* PPWF Volunteer Visibility Fix v2
   The earlier fix only handled the image itself. This version also handles
   the parent/card reveal state, pseudo overlays and animation opacity that
   can leave the whole portrait block visually dimmed.
*/

/* Broad but scoped selectors for common volunteer section naming. */
[class*="volunteer"],
[class*="Volunteer"],
[class*="our-volunteer"],
[class*="Our-Volunteer"],
[data-section*="volunteer"],
[data-section*="Volunteer"]{
  opacity: 1 !important;
  filter: none !important;
}

/* Volunteer/testimonial media itself. */
[class*="volunteer"] img,
[class*="Volunteer"] img,
[class*="testimonial"] img,
[class*="Testimonial"] img,
.volunteer-card img,
.volunteer-avatar,
.volunteer-img,
.testimonial-avatar{
  opacity: 1 !important;
  visibility: visible !important;
  filter: none !important;
  -webkit-filter: none !important;
  mix-blend-mode: normal !important;
  transform-style: flat;
}

/* Remove overlay layers that can create the grey wash. */
[class*="volunteer"]::before,
[class*="volunteer"]::after,
[class*="Volunteer"]::before,
[class*="Volunteer"]::after,
[class*="testimonial"]::before,
[class*="testimonial"]::after,
[class*="Testimonial"]::before,
[class*="Testimonial"]::after{
  opacity: 0 !important;
  background: transparent !important;
  content: none !important;
  box-shadow: none !important;
}

/* Neutralise ONLY opacity/filter animation on volunteer blocks while
   preserving transform/hover motion. */
[class*="volunteer"],
[class*="Volunteer"],
[class*="testimonial"],
[class*="Testimonial"]{
  animation-name: none !important;
  animation-duration: 0s !important;
  animation-delay: 0s !important;
  animation-fill-mode: both !important;
}

/* Restore normal hover interaction for media/card without fade. */
[class*="volunteer"] img,
[class*="Volunteer"] img,
[class*="testimonial"] img,
[class*="Testimonial"] img{
  transition-property: transform, box-shadow !important;
}

/* Specific common inline/attribute states. */
[class*="volunteer"][style*="opacity"],
[class*="Volunteer"][style*="opacity"],
[class*="volunteer"][class*="fade"],
[class*="Volunteer"][class*="fade"],
[class*="volunteer"][class*="reveal"],
[class*="Volunteer"][class*="reveal"]{
  opacity:1 !important;
  filter:none !important;
}

/* Mobile keeps the same hard visibility guarantee. */
@media (max-width:767px){
  [class*="volunteer"],
  [class*="Volunteer"],
  [class*="testimonial"],
  [class*="Testimonial"]{
    opacity:1 !important;
    filter:none !important;
  }
}
