/*
 * REAL.PRO Studios
 * MEDIA VISIBILITY FINAL
 *
 * Goal:
 * - reveal more photography and motion
 * - reduce excessive dark overlay
 * - preserve text contrast
 * - preserve cinematic REAL.PRO character
 * - no geometry/layout changes
 */


/* =========================================================
   1. INTERNAL PAGE HEROES
   ========================================================= */

html body.rp-standardized-page:not(.rp-page-contact)
main#main > section.rp-page-hero
.rp-page-hero__media img{
  filter:
    saturate(1.02)
    contrast(1.025)
    brightness(.98) !important;
}


/*
 * Existing hero layers are deliberately very dark.
 * Keep darkness behind copy, but let the middle/right side
 * reveal substantially more of the actual photography.
 */

html body.rp-standardized-page:not(.rp-page-contact)
main#main > section.rp-page-hero::before{
  background:
    radial-gradient(
      circle at 12% 68%,
      rgba(211,47,47,.16),
      transparent 28%
    ),
    linear-gradient(
      90deg,
      rgba(7,17,31,.84) 0%,
      rgba(7,17,31,.68) 36%,
      rgba(7,17,31,.24) 70%,
      rgba(7,17,31,.06) 100%
    ),
    linear-gradient(
      180deg,
      rgba(0,0,0,.28) 0%,
      rgba(0,0,0,.04) 42%,
      rgba(0,0,0,.38) 100%
    ) !important;
}


/* =========================================================
   2. HOME HERO
   ========================================================= */

html body.rp-page-index .hero-media img{
  filter:
    saturate(1.035)
    contrast(1.02)
    brightness(1.035) !important;
}


html body.rp-page-index .hero-overlay{
  background:
    linear-gradient(
      90deg,
      rgba(5,10,20,.82) 0%,
      rgba(5,10,20,.62) 28%,
      rgba(5,10,20,.27) 56%,
      rgba(5,10,20,.10) 74%,
      rgba(5,10,20,.16) 100%
    ),
    linear-gradient(
      180deg,
      rgba(5,10,20,.42) 0%,
      rgba(5,10,20,.08) 20%,
      rgba(5,10,20,.14) 70%,
      rgba(5,10,20,.54) 100%
    ) !important;
}


/* =========================================================
   3. HOME REEL / BACKGROUND VIDEO
   ========================================================= */

/*
 * Existing bundle uses opacity around .42.
 * Raise the actual video presence without compromising copy.
 */

html body.rp-page-index .reel video{
  opacity:.68 !important;

  filter:
    saturate(1.04)
    contrast(1.025)
    brightness(1.035) !important;
}


html body.rp-page-index .reel-overlay{
  background:
    linear-gradient(
      90deg,
      rgba(7,17,31,.78) 0%,
      rgba(7,17,31,.48) 42%,
      rgba(7,17,31,.06) 100%
    ),
    linear-gradient(
      180deg,
      rgba(0,0,0,.12) 0%,
      rgba(0,0,0,.42) 100%
    ) !important;
}


/* =========================================================
   4. HOME SERVICE MEDIA
   ========================================================= */

html body.rp-page-index
.rp-service-card__media img{
  filter:
    saturate(1.025)
    contrast(1.02)
    brightness(1.025) !important;
}


html body.rp-page-index
.rp-service-card__media::after{
  background:
    linear-gradient(
      90deg,
      transparent 64%,
      rgba(7,17,31,.14) 100%
    ),
    linear-gradient(
      180deg,
      transparent 74%,
      rgba(7,17,31,.12) 100%
    ) !important;
}


/* =========================================================
   5. VIDEO PRODUCTION · V65
   Preserve portfolio architecture and framing.
   Only improve media clarity.
   ========================================================= */

html body
.rp-v65-film__media video,

html body
.rp-v65-film__media img,

html body
.rp-v65-portrait__media img{
  filter:
    saturate(1.035)
    contrast(1.02)
    brightness(1.025) !important;
}


/* =========================================================
   6. MOBILE
   Mobile still needs slightly more protection behind copy,
   but substantially less than the previous heavy treatment.
   ========================================================= */

@media (max-width:760px){

  html body.rp-standardized-page:not(.rp-page-contact)
  main#main > section.rp-page-hero::before{
    background:
      radial-gradient(
        circle at 12% 74%,
        rgba(211,47,47,.12),
        transparent 31%
      ),
      linear-gradient(
        180deg,
        rgba(5,12,23,.24) 0%,
        rgba(5,12,23,.10) 32%,
        rgba(5,12,23,.48) 72%,
        rgba(5,12,23,.76) 100%
      ),
      linear-gradient(
        90deg,
        rgba(7,17,31,.72) 0%,
        rgba(7,17,31,.38) 68%,
        rgba(7,17,31,.16) 100%
      ) !important;
  }


  html body.rp-standardized-page:not(.rp-page-contact)
  main#main > section.rp-page-hero
  .rp-page-hero__media img{
    filter:
      saturate(1.02)
      contrast(1.02)
      brightness(.97) !important;
  }


  html body.rp-page-index .hero-overlay{
    background:
      linear-gradient(
        180deg,
        rgba(5,10,20,.58) 0%,
        rgba(5,10,20,.38) 28%,
        rgba(5,10,20,.32) 58%,
        rgba(5,10,20,.60) 100%
      ),
      linear-gradient(
        90deg,
        rgba(5,10,20,.68) 0%,
        rgba(5,10,20,.38) 48%,
        rgba(5,10,20,.18) 100%
      ) !important;
  }


  html body.rp-page-index .reel video{
    opacity:.72 !important;
  }

}


/* =========================================================
   7. ACCESSIBILITY / LOW POWER
   No motion or geometry changes.
   ========================================================= */

@media (prefers-reduced-motion:reduce){

  html body.rp-page-index .reel video{
    filter:none !important;
  }

}

/* REALPRO_MEDIA_VISIBILITY_V2_START */

/* =========================================================
   HOME HERO
   More photography, while preserving copy protection.
   ========================================================= */

html body.rp-page-index .hero-media img{
  filter:
    saturate(1.05)
    contrast(1.02)
    brightness(1.06) !important;
}

html body.rp-page-index .hero-overlay{
  background:
    linear-gradient(
      90deg,
      rgba(5,10,20,.76) 0%,
      rgba(5,10,20,.52) 28%,
      rgba(5,10,20,.20) 57%,
      rgba(5,10,20,.06) 76%,
      rgba(5,10,20,.10) 100%
    ),
    linear-gradient(
      180deg,
      rgba(5,10,20,.32) 0%,
      rgba(5,10,20,.05) 22%,
      rgba(5,10,20,.09) 70%,
      rgba(5,10,20,.46) 100%
    ) !important;
}


/* =========================================================
   REAL IMPACT / REEL
   Original video opacity was extremely restrained.
   ========================================================= */

html body.rp-page-index .reel video{
  opacity:.80 !important;

  filter:
    saturate(1.06)
    contrast(1.02)
    brightness(1.055) !important;
}

html body.rp-page-index .reel-overlay{
  background:
    linear-gradient(
      90deg,
      rgba(7,17,31,.66) 0%,
      rgba(7,17,31,.34) 42%,
      rgba(7,17,31,.03) 100%
    ),
    linear-gradient(
      180deg,
      rgba(0,0,0,.07) 0%,
      rgba(0,0,0,.28) 100%
    ) !important;
}


/* =========================================================
   FINAL CTA
   The original overlay is especially heavy.
   Reveal the studio image while protecting the left copy.
   ========================================================= */

html body.rp-page-index .final-cta img{
  filter:
    saturate(1.045)
    contrast(1.02)
    brightness(1.06) !important;
}

html body.rp-page-index .final-cta-overlay{
  background:
    linear-gradient(
      90deg,
      rgba(7,17,31,.76) 0%,
      rgba(7,17,31,.48) 48%,
      rgba(7,17,31,.14) 100%
    ),
    linear-gradient(
      180deg,
      rgba(0,0,0,.14) 0%,
      rgba(0,0,0,.42) 100%
    ) !important;
}


/* =========================================================
   MOBILE
   Preserve slightly stronger text protection.
   ========================================================= */

@media (max-width:760px){

  html body.rp-page-index .hero-overlay{
    background:
      linear-gradient(
        180deg,
        rgba(5,10,20,.50) 0%,
        rgba(5,10,20,.29) 28%,
        rgba(5,10,20,.26) 58%,
        rgba(5,10,20,.55) 100%
      ),
      linear-gradient(
        90deg,
        rgba(5,10,20,.62) 0%,
        rgba(5,10,20,.32) 50%,
        rgba(5,10,20,.12) 100%
      ) !important;
  }

  html body.rp-page-index .reel video{
    opacity:.76 !important;
  }

  html body.rp-page-index .reel-overlay{
    background:
      linear-gradient(
        90deg,
        rgba(7,17,31,.64) 0%,
        rgba(7,17,31,.34) 60%,
        rgba(7,17,31,.08) 100%
      ),
      linear-gradient(
        180deg,
        rgba(0,0,0,.10),
        rgba(0,0,0,.32)
      ) !important;
  }

  html body.rp-page-index .final-cta-overlay{
    background:
      linear-gradient(
        90deg,
        rgba(7,17,31,.78) 0%,
        rgba(7,17,31,.51) 55%,
        rgba(7,17,31,.20) 100%
      ),
      linear-gradient(
        180deg,
        rgba(0,0,0,.18),
        rgba(0,0,0,.45)
      ) !important;
  }

}

/* REALPRO_MEDIA_VISIBILITY_V2_END */

/* REALPRO_SITEWIDE_MEDIA_STANDARD_V3_START */

/*
 * REAL.PRO Studios
 * SITEWIDE MEDIA STANDARD V3
 *
 * PURPOSE
 * - make photography and video visibly present
 * - preserve cinematic depth
 * - reduce excessive navy/black veiling
 * - keep protection behind copy
 * - preserve page geometry and crop decisions
 *
 * EXCLUSIONS
 * - Home owns its approved V2 calibration
 * - Case studies preserve their individual art direction
 * - Footer/navigation untouched
 */


/* =========================================================
   A · INTERNAL HERO MEDIA
   ========================================================= */

html body.rp-standardized-page
:not(.rp-page-index)
main#main > section.rp-page-hero
.rp-page-hero__media img,

html body.rp-standardized-page
:not(.rp-page-index)
main#main > section.rp-page-hero
.rp-page-hero__media video{
  opacity:1 !important;

  filter:
    saturate(1.04)
    contrast(1.025)
    brightness(1.035) !important;
}


/* =========================================================
   B · INTERNAL HERO OVERLAY
   Darkness is concentrated on the copy side.
   The visual side remains significantly more open.
   ========================================================= */

html body.rp-standardized-page:not(.rp-page-index)
main#main > section.rp-page-hero::before{
  background:
    radial-gradient(
      circle at 12% 68%,
      rgba(211,47,47,.14),
      transparent 29%
    ),

    linear-gradient(
      90deg,
      rgba(7,17,31,.80) 0%,
      rgba(7,17,31,.58) 36%,
      rgba(7,17,31,.22) 70%,
      rgba(7,17,31,.055) 100%
    ),

    linear-gradient(
      180deg,
      rgba(0,0,0,.25) 0%,
      rgba(0,0,0,.035) 42%,
      rgba(0,0,0,.34) 100%
    ) !important;
}


/* Existing fine-grid texture remains but becomes quieter. */

html body.rp-standardized-page:not(.rp-page-index)
main#main > section.rp-page-hero::after{
  opacity:.20 !important;
}


/* Desktop atmospheric cloud should support, not veil, media. */

@media (min-width:761px){

  html body.rp-standardized-page:not(.rp-page-index)
  main#main > section.rp-page-hero
  .rp-page-hero__cloud{
    opacity:.34 !important;
  }

}


/* =========================================================
   C · STANDARD CONTENT PHOTOGRAPHY
   Visibility only. No dimensions/crops/layout changes.
   ========================================================= */

html body.rp-standardized-page:not(.rp-page-index):not([class*="rp-case-"])
main#main
:is(
  .image-frame,
  .image-frame--tall,
  .gallery-item,
  .media-link,
  .work-card,
  .portfolio-tile,
  .cta-media,
  .related-card
)
img{
  opacity:1 !important;

  filter:
    saturate(1.035)
    contrast(1.02)
    brightness(1.035) !important;
}


/* =========================================================
   D · SERVICE / RELATED CARD MEDIA
   ========================================================= */

html body.rp-standardized-page:not(.rp-page-index):not([class*="rp-case-"])
main#main
.service-card img,

html body.rp-standardized-page:not(.rp-page-index):not([class*="rp-case-"])
main#main
.card-image{
  opacity:1 !important;

  filter:
    saturate(1.035)
    contrast(1.02)
    brightness(1.035) !important;
}


/* =========================================================
   E · CTA MEDIA
   Give final-project imagery greater visibility.
   ========================================================= */

html body.rp-standardized-page:not(.rp-page-index):not([class*="rp-case-"])
main#main
.section--cta
.cta-media img{
  opacity:1 !important;

  filter:
    saturate(1.045)
    contrast(1.02)
    brightness(1.06) !important;
}


/* =========================================================
   F · VIDEOS ACROSS INTERNAL PAGES
   Includes service media and Video Production portfolio.
   Geometry, controls, object-fit and playback untouched.
   ========================================================= */

html body.rp-standardized-page:not(.rp-page-index):not([class*="rp-case-"])
main#main video{
  opacity:1 !important;

  filter:
    saturate(1.04)
    contrast(1.02)
    brightness(1.035) !important;
}


/* Keep the V65 work presentation rich but natural. */

html body.rp-page-video-production
.rp-v65-film__media video,

html body.rp-page-video-production
.rp-v65-film__media img,

html body.rp-page-video-production
.rp-v65-portrait__media img,

html body.rp-page-video-production
[data-rp-v65-dialog] video{
  opacity:1 !important;

  filter:
    saturate(1.045)
    contrast(1.02)
    brightness(1.035) !important;
}


/* =========================================================
   G · TABLET
   Same art direction, slightly stronger copy protection.
   ========================================================= */

@media (min-width:761px) and (max-width:1100px){

  html body.rp-standardized-page:not(.rp-page-index)
  main#main > section.rp-page-hero::before{
    background:
      radial-gradient(
        circle at 12% 68%,
        rgba(211,47,47,.13),
        transparent 30%
      ),

      linear-gradient(
        90deg,
        rgba(7,17,31,.78) 0%,
        rgba(7,17,31,.55) 42%,
        rgba(7,17,31,.20) 76%,
        rgba(7,17,31,.07) 100%
      ),

      linear-gradient(
        180deg,
        rgba(0,0,0,.23),
        rgba(0,0,0,.04) 45%,
        rgba(0,0,0,.35)
      ) !important;
  }

}


/* =========================================================
   H · MOBILE
   Stronger copy zone than desktop, without hiding photography.
   ========================================================= */

@media (max-width:760px){

  html body.rp-standardized-page:not(.rp-page-index)
  main#main > section.rp-page-hero::before{
    background:
      radial-gradient(
        circle at 12% 74%,
        rgba(211,47,47,.11),
        transparent 32%
      ),

      linear-gradient(
        180deg,
        rgba(5,12,23,.25) 0%,
        rgba(5,12,23,.10) 32%,
        rgba(5,12,23,.46) 72%,
        rgba(5,12,23,.72) 100%
      ),

      linear-gradient(
        90deg,
        rgba(7,17,31,.68) 0%,
        rgba(7,17,31,.38) 68%,
        rgba(7,17,31,.14) 100%
      ) !important;
  }


  html body.rp-standardized-page:not(.rp-page-index)
  main#main > section.rp-page-hero::after{
    opacity:.16 !important;
  }


  html body.rp-standardized-page:not(.rp-page-index)
  main#main > section.rp-page-hero
  .rp-page-hero__media img,

  html body.rp-standardized-page:not(.rp-page-index)
  main#main > section.rp-page-hero
  .rp-page-hero__media video{
    opacity:1 !important;

    filter:
      saturate(1.035)
      contrast(1.02)
      brightness(1.015) !important;
  }


  html body.rp-standardized-page:not(.rp-page-index):not([class*="rp-case-"])
  main#main
  .section--cta
  .cta-media img{
    filter:
      saturate(1.035)
      contrast(1.02)
      brightness(1.035) !important;
  }

}


/* =========================================================
   I · LOW MOTION / ACCESSIBILITY
   Visibility remains; motion behavior stays owned elsewhere.
   ========================================================= */

@media (prefers-reduced-motion:reduce){

  html body.rp-standardized-page
  main#main video{
    filter:none !important;
  }

}

/* REALPRO_SITEWIDE_MEDIA_STANDARD_V3_END */