/* DN_FORCE_FUNDRAISING_IMAGE_SMALL_V1_20260529 */

/* Hard override by image src. This beats the previous reveal-figure rules. */
img.reveal-figure[src*="hero-fundraising"],
img[src*="hero-fundraising"] {
  display: block !important;
  width: min(390px, 24vw) !important;
  inline-size: min(390px, 24vw) !important;
  max-width: 390px !important;
  min-width: 0 !important;
  height: auto !important;
  opacity: .84 !important;
  object-fit: contain !important;
  transform: translateX(20px) scale(1) !important;
  transform-origin: center center !important;
  filter:
    brightness(.88)
    contrast(1.02)
    saturate(.92)
    drop-shadow(0 18px 54px rgba(40, 90, 220, .14))
    drop-shadow(0 16px 54px rgba(0, 0, 0, .42)) !important;
}

/* Limit the visual area itself so the image cannot behave like a hero illustration. */
.reveal-visual,
.reveal-media,
.reveal-art,
.reveal-figure-wrap {
  max-width: 520px !important;
  width: 520px !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  overflow: visible !important;
}

/* Reduce inherited glow/stage from previous attempts. */
.reveal-visual::before,
.reveal-media::before,
.reveal-art::before,
.reveal-figure-wrap::before {
  width: 38% !important;
  height: 38% !important;
  left: 52% !important;
  top: 54% !important;
  opacity: .34 !important;
  filter: blur(30px) !important;
}

.reveal-visual::after,
.reveal-media::after,
.reveal-art::after,
.reveal-figure-wrap::after {
  content: none !important;
  display: none !important;
}

@media (max-width: 1100px) {
  .reveal-visual,
  .reveal-media,
  .reveal-art,
  .reveal-figure-wrap {
    width: 100% !important;
    max-width: 520px !important;
  }

  img.reveal-figure[src*="hero-fundraising"],
  img[src*="hero-fundraising"] {
    width: min(420px, 58vw) !important;
    inline-size: min(420px, 58vw) !important;
    max-width: 420px !important;
    transform: none !important;
  }
}

@media (max-width: 760px) {
  img.reveal-figure[src*="hero-fundraising"],
  img[src*="hero-fundraising"] {
    width: 100% !important;
    inline-size: 100% !important;
    max-width: 100% !important;
    opacity: .86 !important;
    transform: none !important;
  }
}
