/* PressPair V2038 — approved Pride rainbow-silk treatment.
   Scope: Pride Collection only. The selected silk is kept byte-for-byte,
   fixed once behind the full editorial page, and never tiled per section. */

body.pride-page {
  --pp-v2038-pride-blue: #0a3b70;
  --pp-v2038-pride-navy: #061b34;
  --pp-v2038-pride-gold: #d2a54b;
  --pp-v2038-white-silk: url('../images/v2020-silk-user-luxury-white-neutral.jpeg');
  --pp-v2038-rainbow-silk: url('../images/v2038-pride-rainbow-silk.webp');
  background: transparent !important;
  color: var(--pp-v2038-pride-blue) !important;
}

/* Keep the locked universal header on its approved white silk. */
html body.pride-page #ppGlobalHeader.pp-global-header,
html body.pride-page #ppGlobalHeader.pp-v2014-silk-header,
html body.pride-page #ppGlobalHeader.pp-v2015-seamless-header,
html body.pride-page #ppGlobalHeader .pp-global-mobile {
  background-color: #f7f3ea !important;
  background-image: var(--pp-v2038-white-silk) !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  background-size: cover !important;
  filter: none !important;
}

html body.pride-page .page-main {
  position: relative !important;
  isolation: isolate !important;
  background: transparent !important;
  background-image: none !important;
}

/* Replace the one existing Pride ocean layer with the selected silk. The
   established V2031/V2033 positioning keeps it continuous on desktop and
   iOS-safe in both automatic and manual mobile modes. */
html body.pride-page .page-main::before,
html.pp-mobile-mode body.pride-page .page-main::before {
  content: '' !important;
  display: block !important;
  inset: 0 !important;
  z-index: 0 !important;
  pointer-events: none !important;
  background-color: #f7f3ea !important;
  background-image: var(--pp-v2038-rainbow-silk) !important;
  background-repeat: no-repeat !important;
  background-position: 50% 48% !important;
  background-size: cover !important;
}

/* Retire the second, older intro-only wave layer. */
html body.pride-page .pride-intro::before {
  content: none !important;
  display: none !important;
  background: none !important;
}

/* Reveal the single silk canvas through all Pride editorial gutters. */
html body.pride-page .pride-intro,
html body.pride-page .pride-editorial,
html body.pride-page .pride-colors,
html body.pride-page .pride-banner,
html body.pride-page .pride-styles,
html body.pride-page .pride-pocket,
html body.pride-page .pride-lifestyle,
html body.pride-page .pride-shop,
html body.pride-page .pride-close {
  background-color: transparent !important;
  background-image: none !important;
}

/* Remove only the old navy copy fills. */
html body.pride-page .pride-editorial.split > div,
html body.pride-page .pride-pocket .copy {
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* Preserve the approved photo cards while replacing their navy fill. */
html body.pride-page .pride-styles .style-grid article {
  background: rgba(255, 255, 255, .16) !important;
  border: 1px solid rgba(210, 165, 75, .38) !important;
  box-shadow: 0 16px 34px rgba(6, 27, 52, .10) !important;
}

/* Blue editorial headlines. */
html body.pride-page .page-main .pride-intro h1,
html body.pride-page .page-main .pride-editorial.split h2,
html body.pride-page .page-main .pride-colors .head h2,
html body.pride-page .page-main .pride-styles .head h2,
html body.pride-page .page-main .pride-styles .style-grid h3,
html body.pride-page .page-main .pride-pocket .copy h2,
html body.pride-page .page-main .pride-shop .shop-copy h2,
html body.pride-page .page-main .pride-close h2 {
  color: var(--pp-v2038-pride-blue) !important;
  -webkit-text-fill-color: var(--pp-v2038-pride-blue) !important;
  text-shadow: none !important;
}

/* PressPair navy-blue body copy on the bright silk. */
html body.pride-page .page-main .pride-intro p,
html body.pride-page .page-main .pride-editorial.split p,
html body.pride-page .page-main .pride-colors .head p,
html body.pride-page .page-main .pride-styles .head p,
html body.pride-page .page-main .pride-pocket .copy p,
html body.pride-page .page-main .pride-shop .shop-copy p,
html body.pride-page .page-main .pride-close p {
  color: var(--pp-v2038-pride-navy) !important;
  -webkit-text-fill-color: var(--pp-v2038-pride-navy) !important;
  text-shadow: none !important;
}

/* True-gold kickers and short emphasis lines. */
html body.pride-page .page-main .pride-intro > span,
html body.pride-page .page-main .pride-editorial.split > div > span,
html body.pride-page .page-main .pride-colors .head > span,
html body.pride-page .page-main .pride-styles .head > span,
html body.pride-page .page-main .pride-pocket .copy > span,
html body.pride-page .page-main .pride-shop .shop-copy > span,
html body.pride-page .page-main .pride-intro strong,
html body.pride-page .page-main .pride-pocket .copy strong {
  color: var(--pp-v2038-pride-gold) !important;
  -webkit-text-fill-color: var(--pp-v2038-pride-gold) !important;
  text-shadow: none !important;
}

/* The comparison preview kept the footer on the approved white silk. */
html body.pride-page .site-footer {
  background-color: #f7f3ea !important;
  background-image: var(--pp-v2038-white-silk) !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  background-size: cover !important;
  color: var(--pp-v2038-pride-blue) !important;
  border-top: 0 !important;
  box-shadow: none !important;
}

html body.pride-page .site-footer .footer-brand b,
html body.pride-page .site-footer .footer-col h3 {
  color: var(--pp-v2038-pride-gold) !important;
  text-shadow: none !important;
}

html body.pride-page .site-footer .footer-brand small,
html body.pride-page .site-footer .footer-brand p,
html body.pride-page .site-footer .footer-col a,
html body.pride-page .site-footer .footer-bottom {
  color: var(--pp-v2038-pride-blue) !important;
  text-shadow: none !important;
}

html body.pride-page .site-footer .footer-bottom {
  border-top-color: rgba(210, 165, 75, .42) !important;
}

/* Portrait crop approved in the Option 1 mobile preview. */
html.pp-mobile-mode body.pride-page .page-main::before {
  background-position: 46% 50% !important;
}

@media (max-width: 760px) {
  html body.pride-page .page-main::before {
    background-position: 46% 50% !important;
  }
}

/* V2039 — desktop parity with the approved mobile silk canvas.
   Keep the single square artwork viewport-sized instead of stretching it
   across the full document height, which caused the desktop zoom/crop. */
html.pp-force-desktop body.pride-page .page-main::before {
  position: fixed !important;
  background-attachment: scroll !important;
  background-position: 46% 50% !important;
}
