/* Selected artwork, scoped to the three discovery screens only.
   Native backgrounds leave fixed popovers and sticky sidebars untouched. */
:root {
  --pf-brand-background-image: url('/static/images/pathfinder-opportunity-background-v2.png');
}

body.home-intro .intro-hero {
  background-color: #fff;
  background-image:
    linear-gradient(180deg, #ffffff08 0, #ffffff24 220px, #ffffffd9 600px, #fff 760px),
    var(--pf-brand-background-image);
  background-position: center top;
  background-size: 100% 100%, 100% auto;
  background-repeat: no-repeat;
}

/* The illustration replaces the old decorative wash, not the white product card. */
body.home-intro .intro-main .intro-showcase {
  background: transparent;
}

body.notice-reference #noticeReferencePage .notice-reference-search-area::before {
  background-color: #f4f8ff;
  background-image: linear-gradient(90deg, #ffffff0d, #ffffff26), var(--pf-brand-background-image);
  background-position: center top;
  background-size: 100% 100%, 100% auto;
  background-repeat: no-repeat;
  pointer-events: none;
}

/* Keep the existing message; avoid layering two unrelated illustrations. */
body.notice-reference #noticeReferencePage .notice-reference-hero-visual img {
  display: none;
}

body.info-page.idea-workspace-page {
  background-color: #f5f8fe;
  background-image:
    linear-gradient(180deg, #f5f8fe00 72px, #f5f8fe1a 260px, #f5f8fed9 620px, #f5f8fe 760px),
    var(--pf-brand-background-image);
  background-position: center top, center 72px;
  background-size: 100% 100%, 100% auto;
  background-repeat: no-repeat;
}

@media (max-width: 700px) {
  /* Show the quiet left-hand relief on narrow screens, away from reading areas. */
  body.home-intro .intro-hero {
    background-image:
      linear-gradient(180deg, #ffffff40 0, #ffffff80 300px, #fff 680px),
      var(--pf-brand-background-image);
    background-position: left top;
    background-size: 100% 100%, 1100px auto;
  }

  body.notice-reference #noticeReferencePage .notice-reference-search-area::before {
    background-image: linear-gradient(90deg, #ffffff40, #ffffff80), var(--pf-brand-background-image);
    background-position: left top;
    background-size: 100% 100%, 1100px auto;
  }

  body.info-page.idea-workspace-page {
    background-image:
      linear-gradient(180deg, #f5f8fe26 64px, #f5f8fe80 280px, #f5f8fe 680px),
      var(--pf-brand-background-image);
    background-position: left top, left 64px;
    background-size: 100% 100%, 1100px auto;
  }
}

@media print {
  body.home-intro .intro-hero,
  body.notice-reference #noticeReferencePage .notice-reference-search-area::before,
  body.info-page.idea-workspace-page {
    background: #fff !important;
  }
}

@media (forced-colors: active) {
  body.home-intro .intro-hero,
  body.notice-reference #noticeReferencePage .notice-reference-search-area::before,
  body.info-page.idea-workspace-page {
    background: Canvas !important;
  }
}
