/* Meister Carbon Cleaners — Subpage Image Heroes V8
   Real MCC imagery, limited to the hero area so content stays clean and readable.
*/

.page-hero-how,
.page-hero-gallery,
.page-hero-franchise,
.page-hero-workshops,
.page-hero-dealers,
.page-hero-fleets{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  border-bottom:0!important;
  background-color:#11151a!important;
  background-repeat:no-repeat!important;
  background-size:cover!important;
}

.page-hero-how{
  background-image:
    linear-gradient(90deg,rgba(10,13,17,.93) 0%,rgba(10,13,17,.80) 54%,rgba(10,13,17,.58) 100%),
    url('/mcc/assets/img/heroes/how-it-works.webp')!important;
  background-position:center 55%!important;
}
.page-hero-gallery{
  background-image:
    linear-gradient(90deg,rgba(10,13,17,.92) 0%,rgba(10,13,17,.77) 54%,rgba(10,13,17,.54) 100%),
    url('/mcc/assets/img/heroes/gallery.webp')!important;
  background-position:center 56%!important;
}
.page-hero-franchise{
  background-image:
    linear-gradient(90deg,rgba(10,13,17,.92) 0%,rgba(10,13,17,.78) 52%,rgba(10,13,17,.46) 100%),
    url('/mcc/assets/img/heroes/franchise.webp')!important;
  background-position:center 60%!important;
}
.page-hero-workshops{
  background-image:
    linear-gradient(90deg,rgba(10,13,17,.93) 0%,rgba(10,13,17,.77) 54%,rgba(10,13,17,.48) 100%),
    url('/mcc/assets/img/heroes/workshops.webp')!important;
  background-position:center 54%!important;
}
.page-hero-dealers{
  background-image:
    linear-gradient(90deg,rgba(10,13,17,.93) 0%,rgba(10,13,17,.73) 53%,rgba(10,13,17,.44) 100%),
    url('/mcc/assets/img/heroes/dealers.webp')!important;
  background-position:center 52%!important;
}
.page-hero-fleets{
  background-image:
    linear-gradient(90deg,rgba(10,13,17,.86) 0%,rgba(10,13,17,.62) 52%,rgba(10,13,17,.36) 100%),
    url('/mcc/assets/img/heroes/fleets.webp')!important;
  background-position:center 51%!important;
}

/* Keep all hero copy legible and consistent. */
.page-hero-how h1,
.page-hero-gallery h1,
.page-hero-franchise h1,
.page-hero-workshops h1,
.page-hero-dealers h1,
.page-hero-fleets h1{
  color:#fff!important;
  text-shadow:0 2px 24px rgba(0,0,0,.22);
}

.page-hero-how p,
.page-hero-gallery p,
.page-hero-franchise p,
.page-hero-workshops p,
.page-hero-dealers p,
.page-hero-fleets p{
  color:rgba(255,255,255,.84)!important;
}

.page-hero-how .page-kicker,
.page-hero-gallery .page-kicker,
.page-hero-franchise .page-kicker,
.page-hero-workshops .page-kicker,
.page-hero-dealers .page-kicker,
.page-hero-fleets .page-kicker{
  background:rgba(255,255,255,.92)!important;
  color:#e30613!important;
  border-color:rgba(255,255,255,.34)!important;
}

.page-hero-how .page-hero-card,
.page-hero-gallery .page-hero-card,
.page-hero-franchise .page-hero-card,
.page-hero-workshops .page-hero-card,
.page-hero-dealers .page-hero-card,
.page-hero-fleets .page-hero-card{
  background:rgba(18,22,28,.78)!important;
  color:#fff!important;
  border:1px solid rgba(255,255,255,.14)!important;
  box-shadow:0 18px 50px rgba(0,0,0,.18)!important;
  backdrop-filter:blur(8px);
}

.page-hero-how .page-hero-card p,
.page-hero-gallery .page-hero-card p,
.page-hero-franchise .page-hero-card p,
.page-hero-workshops .page-hero-card p,
.page-hero-dealers .page-hero-card p,
.page-hero-fleets .page-hero-card p{
  color:rgba(255,255,255,.82)!important;
}

.page-hero-how .btn-outline,
.page-hero-gallery .btn-outline,
.page-hero-franchise .btn-outline,
.page-hero-workshops .btn-outline,
.page-hero-dealers .btn-outline,
.page-hero-fleets .btn-outline{
  color:#fff!important;
  border-color:rgba(255,255,255,.55)!important;
  background:rgba(255,255,255,.08)!important;
}

.page-hero-how .btn-outline:hover,
.page-hero-gallery .btn-outline:hover,
.page-hero-franchise .btn-outline:hover,
.page-hero-workshops .btn-outline:hover,
.page-hero-dealers .btn-outline:hover,
.page-hero-fleets .btn-outline:hover{
  background:rgba(255,255,255,.15)!important;
}

/* Quote page — only applies when the unified V7 quote page is installed. */
.quote-page .quote-hero{
  background-image:
    linear-gradient(90deg,rgba(10,13,17,.93) 0%,rgba(10,13,17,.79) 53%,rgba(10,13,17,.52) 100%),
    url('/mcc/assets/img/heroes/quote.webp')!important;
  background-size:cover!important;
  background-position:center 54%!important;
  border-bottom:0!important;
}
.quote-page .quote-hero h1{color:#fff!important;text-shadow:0 2px 24px rgba(0,0,0,.22)}
.quote-page .quote-hero p{color:rgba(255,255,255,.84)!important}
.quote-page .quote-hero .page-kicker{
  background:rgba(255,255,255,.92)!important;
  color:#e30613!important;
}
.quote-page .quote-help-card{
  background:rgba(255,255,255,.94)!important;
  backdrop-filter:blur(8px);
}

@media(max-width:860px){
  .page-hero-how,
  .page-hero-gallery,
  .page-hero-franchise,
  .page-hero-workshops,
  .page-hero-dealers,
  .page-hero-fleets{
    background-position:center!important;
  }

  .page-hero-how,
  .page-hero-gallery,
  .page-hero-franchise,
  .page-hero-workshops,
  .page-hero-dealers,
  .page-hero-fleets,
  .quote-page .quote-hero{
    background-image:
      linear-gradient(90deg,rgba(10,13,17,.91),rgba(10,13,17,.73)),
      var(--mcc-mobile-hero,none);
  }

  /* Restore each image after the mobile overlay rule. */
  .page-hero-how{background-image:linear-gradient(90deg,rgba(10,13,17,.91),rgba(10,13,17,.73)),url('/mcc/assets/img/heroes/how-it-works.webp')!important}
  .page-hero-gallery{background-image:linear-gradient(90deg,rgba(10,13,17,.91),rgba(10,13,17,.73)),url('/mcc/assets/img/heroes/gallery.webp')!important}
  .page-hero-franchise{background-image:linear-gradient(90deg,rgba(10,13,17,.91),rgba(10,13,17,.73)),url('/mcc/assets/img/heroes/franchise.webp')!important}
  .page-hero-workshops{background-image:linear-gradient(90deg,rgba(10,13,17,.91),rgba(10,13,17,.73)),url('/mcc/assets/img/heroes/workshops.webp')!important}
  .page-hero-dealers{background-image:linear-gradient(90deg,rgba(10,13,17,.91),rgba(10,13,17,.73)),url('/mcc/assets/img/heroes/dealers.webp')!important}
  .page-hero-fleets{background-image:linear-gradient(90deg,rgba(10,13,17,.88),rgba(10,13,17,.66)),url('/mcc/assets/img/heroes/fleets.webp')!important}
  .quote-page .quote-hero{background-image:linear-gradient(90deg,rgba(10,13,17,.91),rgba(10,13,17,.72)),url('/mcc/assets/img/heroes/quote.webp')!important}
}


/* V8.1: keep hero benefit pills readable on dark photographic heroes. */
.page-hero-how .page-hero-card .chip,
.page-hero-gallery .page-hero-card .chip,
.page-hero-franchise .page-hero-card .chip,
.page-hero-workshops .page-hero-card .chip,
.page-hero-dealers .page-hero-card .chip,
.page-hero-fleets .page-hero-card .chip{
  background:rgba(255,255,255,.94)!important;
  border-color:rgba(255,255,255,.75)!important;
  color:#20262e!important;
  text-shadow:none!important;
}
.page-hero-how .page-hero-card .chip i,
.page-hero-gallery .page-hero-card .chip i,
.page-hero-franchise .page-hero-card .chip i,
.page-hero-workshops .page-hero-card .chip i,
.page-hero-dealers .page-hero-card .chip i,
.page-hero-fleets .page-hero-card .chip i{
  color:#e30613!important;
}