/* Page hero background, on every page except the home page (David, October 25, 2026).
   The diamond pattern from David's Beverly Hills mockup sits behind the hero text, and the photo is shown clear, with no
   shading or fade. On a page with a photo the pattern stops at the photo (desktop); on phones, and on pages without a
   photo, it fills the hero. Image: /assets/img/hero/hero-diamond-background.webp, made by
   build-kit/fixes/bh-hero-background/rebuild_bg.py. Added by build-kit/fixes/hero_background_sitewide_2026-10-25.py. */
.r-hero{--hero-ph:clamp(360px,36vw,720px);background:#072d57}
.r-hero::before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:url("/assets/img/hero/hero-diamond-background.webp") left center/cover no-repeat}
.r-hero .r-hero-img{-webkit-mask-image:none;mask-image:none}
.r-hero .r-hero-fade{display:none}
@media (min-width:861px){
  .r-hero:not(.no-img)::before{right:var(--hero-ph)}
  .r-hero .r-hero-img{width:var(--hero-ph)}
  .r-hero:not(.no-img) .r-hero-copy{max-width:min(640px,calc(100vw - var(--hero-ph) - max(0px,(100vw - 1180px) / 2) - 72px))}
  .r-hero .r-hero-cap{max-width:calc(var(--hero-ph) - 48px)}
}
/* The photo panel is narrower than before (about a third of the width), so a few photos are moved to keep the vehicle's
   logo or the building's name in view (desktop only; on phones the photo runs full width). */
@media (min-width:861px){
  .r-hero-img[src*="century-city-century-park-east"]{object-position:62% 70%}
  .r-hero-img[src*="palm-springs-courthouse"]{object-position:70% 70%}
  .r-hero-img[src*="stanislaus-county-courthouse"]{object-position:80% 70%}
  .r-hero-img[src*="stanley-mosk-courthouse"]{object-position:50% 70%}
  .r-hero-img[src*="vehicle-oakland-federal-building"]{object-position:45% 70%}
}