/* Toolbelt Websites — Websites for Roofers staging
   Exact Electricians page layout system with Roofers staging imagery. */

.roofer-page .plumber-hero--editorial .plumber-hero__media img{
  object-position:68% center;
}

.roofer-page .plumber-editorial-photo img{
  object-position:43% 50%;
}

.roofer-page .plumber-services-story__image img{
  object-position:47% 50%;
}

.roofer-page .plumber-conversion-story__image img{
  object-position:58% 48%;
}

.roofer-page .plumber-browser__address{
  text-transform:uppercase;
  letter-spacing:.08em;
}

.roofer-page .plumber-final-cta::before{
  background:
    linear-gradient(90deg,rgba(8,10,12,.99) 0%,rgba(8,10,12,.94) 38%,rgba(8,10,12,.76) 58%,rgba(8,10,12,.28) 100%),
    url('/assets/images/roofers/final-cta.webp') 66% 47%/cover no-repeat;
}

@media (max-width:980px){
  .roofer-page .plumber-hero--editorial .plumber-hero__media img{object-position:66% center;}
  .roofer-page .plumber-final-cta::before{
    background:
      linear-gradient(90deg,rgba(8,10,12,.99) 0%,rgba(8,10,12,.95) 48%,rgba(8,10,12,.60) 78%,rgba(8,10,12,.30) 100%),
      url('/assets/images/roofers/final-cta.webp') 64% 46%/cover no-repeat;
  }
}

@media (max-width:760px){
  .roofer-page .plumber-hero--editorial .plumber-hero__media img{object-position:62% center;}
  .roofer-page .plumber-editorial-photo img{object-position:40% 50%;}
  .roofer-page .plumber-services-story__image img{object-position:48% 52%;}
  .roofer-page .plumber-conversion-story__image img{object-position:55% 48%;}
  .roofer-page .plumber-final-cta::before{
    background:
      linear-gradient(90deg,rgba(8,10,12,.98) 0%,rgba(8,10,12,.92) 68%,rgba(8,10,12,.66) 100%),
      linear-gradient(180deg,rgba(8,10,12,.28) 0%,rgba(8,10,12,.66) 52%,rgba(8,10,12,.94) 100%),
      url('/assets/images/roofers/final-cta.webp') 61% 48%/cover no-repeat;
  }
}

@media (max-width:520px){
  .roofer-page .plumber-hero--editorial .plumber-hero__media img{object-position:60% center;}
  .roofer-page .plumber-final-cta::before{background-position:center,center,59% 48%;}
}

/* ROOFER CONVERSION POLISH V1.0 */
/* Match the vertical rhythm used by the other approved trade-page sections. */
.roofer-page .plumber-conversion-story__content > .plumber-intro{
  margin-top:25px;
}

/* The numbered journey already communicates sequence. Remove the decorative
   glyph arrows and let the three steps sit as a clean, evenly balanced row. */
.roofer-page .plumber-contact-flow{
  grid-template-columns:repeat(3,minmax(0,1fr));
  column-gap:clamp(22px,2.4vw,34px);
}
.roofer-page .plumber-contact-flow > i{
  display:none;
}

@media (max-width:760px){
  .roofer-page .plumber-conversion-story__content > .plumber-intro{
    margin-top:20px;
  }
  .roofer-page .plumber-contact-flow{
    grid-template-columns:1fr;
    row-gap:18px;
  }
}
/* /ROOFER CONVERSION POLISH V1.0 */

/* ROOFER SHOWCASE IMAGE V1.0 */
/* The supplied Evans Electric screenshot is taller than the original concept artwork.
   Keep the approved browser presentation while art-directing the crop around the
   navigation, roofer hero and quote form rather than shrinking the screenshot. */
.roofer-page .plumber-showcase .plumber-browser__screen--real{
  aspect-ratio:3/2;
}
.roofer-page .plumber-showcase .plumber-browser__screen--real img{
  object-fit:cover;
  object-position:center top;
}
/* /ROOFER SHOWCASE IMAGE V1.0 */


/* ROOFER PRODUCTION IMAGERY V1.0.2 */
.roofer-page .tb-roofer-image{display:block;width:100%;height:100%;object-fit:cover}
.roofer-page .plumber-final-cta::before{background:linear-gradient(90deg,rgba(8,10,12,.99) 0%,rgba(8,10,12,.94) 38%,rgba(8,10,12,.76) 58%,rgba(8,10,12,.28) 100%),url('/assets/images/roofers/06-roofer-inspecting-a-sunlit-stone-cottage.webp') 66% 47%/cover no-repeat}
@media (max-width:980px){.roofer-page .plumber-final-cta::before{background:linear-gradient(90deg,rgba(8,10,12,.99) 0%,rgba(8,10,12,.95) 48%,rgba(8,10,12,.60) 78%,rgba(8,10,12,.30) 100%),url('/assets/images/roofers/06-roofer-inspecting-a-sunlit-stone-cottage.webp') 64% 46%/cover no-repeat}}
@media (max-width:760px){.roofer-page .plumber-final-cta::before{background:linear-gradient(90deg,rgba(8,10,12,.98) 0%,rgba(8,10,12,.92) 68%,rgba(8,10,12,.66) 100%),linear-gradient(180deg,rgba(8,10,12,.28) 0%,rgba(8,10,12,.66) 52%,rgba(8,10,12,.94) 100%),url('/assets/images/roofers/06-roofer-inspecting-a-sunlit-stone-cottage.webp') 61% 48%/cover no-repeat}}
@media (max-width:520px){.roofer-page .plumber-final-cta::before{background-position:center,center,59% 48%}}
/* /ROOFER PRODUCTION IMAGERY V1.0.2 */