
.chb-service-hero-engine{
  --gold:#b79b3a;
  --dark:#0f1214;
  position:relative;
  min-height:var(--chb-hero-min-desktop,88vh);
  display:flex;
  align-items:flex-end;
  overflow:hidden;
  background:var(--dark);
  color:#fff;
}

.chb-service-hero-engine *,
.chb-service-hero-engine *:before,
.chb-service-hero-engine *:after{
  box-sizing:border-box;
}

.chb-service-hero-engine__image,
.chb-service-hero-engine__shade{
  position:absolute;
  inset:0;
}

.chb-service-hero-engine__image{
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  transform:scale(1.001);
}

.chb-service-hero-engine__image--desktop{display:block}
.chb-service-hero-engine__image--mobile{display:none}

.chb-service-hero-engine__shade{
  background:
    linear-gradient(90deg,
      rgba(7,10,12,var(--chb-hero-overlay-desktop,.58)) 0%,
      rgba(7,10,12,calc(var(--chb-hero-overlay-desktop,.58) * .72)) 42%,
      rgba(7,10,12,.12) 78%),
    linear-gradient(180deg,rgba(7,10,12,.04) 0%,rgba(7,10,12,.12) 48%,rgba(7,10,12,.72) 100%);
}

.chb-service-hero-engine__shell{
  position:relative;
  z-index:2;
  width:min(var(--chb-hero-max,1500px),calc(100% - 56px));
  margin:0 auto;
  padding:182px 0 78px;
}

.chb-service-hero-engine__topline{
  display:flex;
  justify-content:space-between;
  gap:25px;
  margin-bottom:42px;
  padding-bottom:15px;
  border-bottom:1px solid rgba(255,255,255,.27);
  font-family:"Lemon Milk",Arial,sans-serif;
  font-size:6px;
  line-height:1;
  letter-spacing:.15em;
  color:rgba(255,255,255,.54);
}

.chb-service-hero-engine__topline span:first-child{
  color:var(--gold);
}

.chb-service-hero-engine__content{
  display:grid;
  grid-template-columns:minmax(0,1.42fr) minmax(320px,.48fr);
  gap:90px;
  align-items:end;
}

.chb-service-hero-engine h1{
  max-width:1080px;
  margin:0;
  color:#fff;
  font-family:"Lemon Milk",Arial,sans-serif;
  font-size:clamp(72px,7.3vw,122px);
  line-height:.87;
  letter-spacing:-.058em;
  font-weight:500;
}

.chb-service-hero-engine__aside{
  padding-bottom:7px;
}

.chb-service-hero-engine__aside p{
  max-width:470px;
  margin:0 0 28px;
  color:rgba(255,255,255,.73);
  font-size:14px;
  line-height:1.75;
}

.chb-service-hero-engine__actions{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
}

.chb-service-hero-engine__actions a{
  min-height:52px;
  padding:0 17px;
  display:inline-flex;
  align-items:center;
  justify-content:space-between;
  gap:22px;
  border:1px solid rgba(255,255,255,.36);
  color:#fff!important;
  font-family:"Lemon Milk",Arial,sans-serif;
  font-size:6px;
  line-height:1;
  letter-spacing:.06em;
  transition:background .2s ease,border-color .2s ease,color .2s ease;
}

.chb-service-hero-engine__actions a.is-primary{
  background:var(--gold);
  border-color:var(--gold);
  color:#111!important;
}

.chb-service-hero-engine__actions a:hover{
  background:#fff!important;
  border-color:#fff!important;
  color:#111!important;
}

.chb-service-hero-engine__scroll{
  position:absolute;
  z-index:3;
  right:26px;
  bottom:28px;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:9px;
  color:rgba(255,255,255,.50)!important;
  font-family:"Lemon Milk",Arial,sans-serif;
  font-size:5px;
  letter-spacing:.14em;
}

.chb-service-hero-engine__scroll span{
  width:1px;
  height:52px;
  background:linear-gradient(var(--gold),rgba(255,255,255,.12));
}

.chb-service-hero-engine__anchor{
  position:relative;
  top:-80px;
}

@media(max-width:1050px){
  .chb-service-hero-engine__content{
    grid-template-columns:1fr;
    gap:32px;
  }

  .chb-service-hero-engine__aside{
    max-width:600px;
  }

  .chb-service-hero-engine h1{
    font-size:clamp(62px,9vw,92px);
  }
}

@media(max-width:760px){
  .chb-service-hero-engine{
    min-height:var(--chb-hero-min-mobile,760px);
  }

  .chb-service-hero-engine__image--desktop{display:none}
  .chb-service-hero-engine__image--mobile{display:block}

  .chb-service-hero-engine__shade{
    background:
      linear-gradient(180deg,
        rgba(7,10,12,.16) 0%,
        rgba(7,10,12,calc(var(--chb-hero-overlay-mobile,.68) * .68)) 43%,
        rgba(7,10,12,.91) 100%);
  }

  .chb-service-hero-engine__shell{
    width:calc(100% - 28px);
    padding:128px 0 46px;
  }

  .chb-service-hero-engine__topline{
    margin-bottom:28px;
  }

  .chb-service-hero-engine__topline span:last-child{
    display:none;
  }

  .chb-service-hero-engine__content{
    gap:23px;
  }

  .chb-service-hero-engine h1{
    font-size:47px;
    line-height:.92;
    letter-spacing:-.045em;
  }

  .chb-service-hero-engine__aside p{
    font-size:11px;
    line-height:1.65;
    margin-bottom:20px;
  }

  .chb-service-hero-engine__actions{
    display:grid;
    grid-template-columns:1fr 1fr;
  }

  .chb-service-hero-engine__actions a{
    min-width:0;
    min-height:46px;
    padding:0 11px;
    gap:8px;
    font-size:5px;
  }

  .chb-service-hero-engine__scroll{
    display:none;
  }
}


/* =========================================================
   v1.1.0 — TITLE-ONLY HERO
   Matches homepage H1 sizing exactly.
   ========================================================= */

/* Hide all supporting UI from earlier versions in case cached markup remains. */
.chb-service-hero-engine .chb-service-hero-engine__topline,
.chb-service-hero-engine .chb-service-hero-engine__aside,
.chb-service-hero-engine .chb-service-hero-engine__actions,
.chb-service-hero-engine .chb-service-hero-engine__scroll{
  display:none!important;
}

/* Hero now contains one visual message only: the H1. */
.chb-service-hero-engine__content--title-only{
  display:block!important;
  width:100%!important;
}

/* Exact desktop H1 scale used by the current City Home homepage hero. */
.chb-service-hero-engine h1{
  max-width:980px!important;
  margin:0!important;
  font-size:clamp(52px,5.2vw,82px)!important;
  line-height:.98!important;
  letter-spacing:-.045em!important;
}

/* With the supporting content removed, give the title more breathing room. */
.chb-service-hero-engine__shell{
  padding-bottom:84px!important;
}

/* Exact mobile H1 scale used by the current City Home homepage hero. */
@media(max-width:760px){
  .chb-service-hero-engine h1{
    max-width:100%!important;
    font-size:clamp(40px,12.3vw,56px)!important;
    line-height:.98!important;
    letter-spacing:-.045em!important;
  }

  .chb-service-hero-engine__shell{
    padding-bottom:46px!important;
  }
}


/* =========================================================
   v1.1.3 — SAFE HOMEPAGE-STYLE TITLE POSITION
   No transforms. No header selectors. No page-level spacing changes.
   ========================================================= */

/* Put the title in the same visual zone as the homepage hero:
   vertically centred inside the image rather than pinned to the bottom. */
.chb-service-hero-engine{
  align-items:center!important;
}

.chb-service-hero-engine__shell{
  padding-top:70px!important;
  padding-bottom:0!important;
}

.chb-service-hero-engine__content--title-only{
  display:block!important;
  width:100%!important;
}

/* Keep the exact homepage-style H1 scale from v1.1.0. */
.chb-service-hero-engine h1{
  max-width:980px!important;
  margin:0!important;
  transform:none!important;
  font-size:clamp(52px,5.2vw,82px)!important;
  line-height:.98!important;
  letter-spacing:-.045em!important;
}

/* Mobile stays centred as well, with enough top allowance for the overlay header. */
@media(max-width:760px){
  .chb-service-hero-engine{
    align-items:center!important;
  }

  .chb-service-hero-engine__shell{
    padding-top:74px!important;
    padding-bottom:0!important;
  }

  .chb-service-hero-engine h1{
    transform:none!important;
    font-size:clamp(40px,12.3vw,56px)!important;
    line-height:.98!important;
    letter-spacing:-.045em!important;
  }
}


/* =========================================================
   v1.1.4 — MOBILE HERO MATCHES HOMEPAGE
   New Home Builds + Big Home Renovations only.
   ========================================================= */

@media(max-width:760px){
  .chb-service-hero-engine{
    align-items:stretch!important;
  }

  .chb-service-hero-engine__shell{
    width:100%!important;
    min-height:var(--chb-hero-min-mobile,760px)!important;
    margin:0!important;
    padding:82px 24px 28px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
  }

  .chb-service-hero-engine__content--title-only{
    width:100%!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    text-align:center!important;
  }

  .chb-service-hero-engine h1{
    width:100%!important;
    max-width:350px!important;
    margin:0 auto!important;
    padding:0!important;
    text-align:center!important;
    font-size:42px!important;
    line-height:.98!important;
    letter-spacing:-.045em!important;
    font-weight:500!important;
    transform:none!important;
  }
}


/* =========================================================
   v1.1.5 — EXACT HOMEPAGE H1 TYPOGRAPHY
   Copied directly from City Home Hero Carousel Manager v1.2.5.
   ========================================================= */

.chb-service-hero-engine h1{
  font-family:"Lemon Milk",sans-serif!important;
  font-weight:500!important;
  font-style:normal!important;
  font-size:clamp(52px,5.2vw,82px)!important;
  line-height:1.01!important;
  letter-spacing:-.035em!important;
  text-transform:uppercase!important;
}

@media(max-width:760px){
  .chb-service-hero-engine h1{
    font-family:"Lemon Milk",sans-serif!important;
    font-weight:500!important;
    font-style:normal!important;
    font-size:clamp(40px,12.3vw,56px)!important;
    line-height:1.02!important;
    letter-spacing:-.035em!important;
    max-width:100%!important;
    text-transform:uppercase!important;
  }
}
