/* Thin bridge only — designer style.css now owns .adcrds / .banr2.
   Fixes a pack gap: mobile banner img has no desktop hide rule. */

.banner-hm .ban_sli .sld .ad_ban img.banr_sl2_mbimg {
  display: none;
}

/* Reserved hero while LCP art loads — not a white flash */
.home-cnt .banner-hm {
  min-height: 620px;
  background-color: #f3eee8;
}

/* AOS hides [data-aos] until JS — keep first-slide copy visible */
.home-cnt .banner-hm [data-aos] {
  opacity: 1;
  transform: none;
}

@media screen and (max-width: 991px) {
  .banner-hm .ban_sli .sld .ad_ban img.banr_sl2_mbimg {
    display: block;
  }
}

/*
  Owl Carousel ships with `.owl-carousel { display: none }` until JS adds `.owl-loaded`.
  Under /btnew, HomeRuntime previously loaded `/design/js/*` (no basePath); Apache/CI at
  the site root returns HTML 200, so jQuery never defined, Owl never inited, hero vanished.
  Always show the home banner; hide extra slides only before Owl initializes.
*/
.banner-hm .ban_sli.owl-carousel {
  display: block !important;
}

.banner-hm .ban_sli:not(.owl-loaded) > .sld:not(:first-child) {
  display: none;
}

/*
  Contained homepage (pack .container is 1425 / max-container 1673, centered).
  Applies to every home band — not a single-section patch.
*/
.home-cnt .container {
  max-width: 1425px;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  box-sizing: border-box;
}

.home-cnt .max-container {
  max-width: 1673px;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  box-sizing: border-box;
}

/*
  Pack .crd_img { z-index: -1 } paints product art behind the page.
  Isolate each card so backgrounds stay visible without breaking sticky stack.
*/
.home-cnt .adcrds #cards {
  position: relative;
  padding-top: 80px;
  padding-bottom: 80px;
}

/* Last sticky card has no following sibling — reserve travel so Biteqwik can cover Buildostore */
.home-cnt .adcrds #cards .card-stack-end {
  display: block;
  width: 100%;
  pointer-events: none;
  visibility: hidden;
  height: min(72vh, 720px);
  min-height: 560px;
}

.home-cnt .adcrds #cards .card:last-of-type .card__content {
  min-height: 560px;
}

.home-cnt .adcrds #cards .card {
  margin-bottom: 0;
}

/* Pull cards together so the sticky stack peeks without a large white gap */
.home-cnt .adcrds #cards .card + .card {
  margin-top: -48px;
}

.home-cnt .adcrds #cards .card .card__content {
  isolation: isolate;
  position: relative;
  z-index: 0;
  overflow: hidden;
  /* Opaque fallback so sticky stack doesn't show lower-card text through */
  background-color: #070b14;
}

.home-cnt .adcrds #cards .card .card__content.cdp {
  background-color: #fbe7e9;
}

.home-cnt .adcrds #cards .card .card__content.mob_grn {
  background-color: #0a2e14;
}

.home-cnt .adcrds #cards .card .card__content .crd_img {
  z-index: 0;
  pointer-events: none;
}

.home-cnt .adcrds #cards .card .card__content .crd_img img.crd_bg {
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
}

.home-cnt .adcrds #cards .card .card__content .crd_img img.crd_mb_bg1,
.home-cnt .adcrds #cards .card .card__content .crd_img img.crd_mb_bg2,
.home-cnt .adcrds #cards .card .card__content .crd_img img.crd_mb_bg3,
.home-cnt .adcrds #cards .card .card__content .crd_img img.crd_mb_bg4 {
  display: none;
}

.home-cnt .adcrds #cards .card .card__content .flxd {
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: relative;
  z-index: 1;
  width: 100%;
}

/* Keep mockup column visible — globals img {height:auto} was collapsing pack art */
.home-cnt .adcrds #cards .card .card__content .flxd .rgt {
  flex: 0 1 55%;
  width: 55%;
  min-width: 0;
}

.home-cnt .adcrds #cards .card .card__content .flxd .rgt img {
  display: block;
  width: 100%;
  max-width: none;
  height: 600px;
  object-fit: cover;
}

.home-cnt .adcrds #cards .card .card__content.truckk .flxd .rgt img {
  height: 700px;
  object-fit: fill;
}

.home-cnt .adcrds #cards .card .card__content.mob_grn .flxd .rgt img {
  height: 600px;
}

.home-cnt .adcrds #cards .card .card__content .flxd .crd_cnt .lg img,
.home-cnt .adcrds #cards .card .card__content .flxd .crd_cnt .str img:not(.mobNw) {
  display: block;
  max-width: none;
}

/* Pack ships desktop + mobile headline PNGs; never show both */
.home-cnt .adcrds #cards .card .card__content .flxd .crd_cnt .str img.mobNw {
  display: none;
}

.home-cnt .adcrds #cards .card .card__content .flxd .crd_cnt.cd1 .str img:not(.mobNw) {
  width: 609px;
  height: 317px;
  object-fit: contain;
}

.home-cnt .adcrds #cards .card .card__content.truckk .flxd .cd2 .str img:not(.mobNw) {
  width: 100%;
  height: 380px;
  object-fit: contain;
}

.home-cnt .adcrds #cards .card .card__content .flxd .crd_cnt.cd3 .str img {
  width: auto;
  max-width: 100%;
  height: auto;
  object-fit: contain;
}

.home-cnt .adcrds #cards .card .card__content .flxd .crd_cnt.cd4 .str img {
  width: auto;
  max-width: 100%;
  height: auto;
  object-fit: contain;
}

/*
  What We Do — pack uses z-index:-2 on the circle (hides it behind page bg).
  Keep circle visible but BELOW copy + service cards so text isn't buried.
*/
.home-cnt .wte-main .wte {
  isolation: isolate;
  position: relative;
  z-index: 0;
  align-items: center;
}

.home-cnt .wte-main .wte-img-sec {
  z-index: 0 !important;
  width: 45.2%;
  min-height: 520px;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  pointer-events: none;
}

.home-cnt .wte-main .wte-img-sec picture {
  display: block;
  width: 100%;
  max-width: 100%;
}

.home-cnt .wte-main .wte-img-sec .wte-img-circle,
.home-cnt .wte-main .wte-img-sec .whteNew,
.home-cnt .wte-main .wte-img-sec .wte-img-mbl {
  width: 100%;
  max-width: 100%;
  height: 520px;
  object-fit: contain;
}

/* Only one graphic — never stack circle / tablet / mobile art */
.home-cnt .wte-main .wte-img-sec .wte-img-circle {
  display: block;
  /* SVG source sits on a black canvas; screen knocks black out on white */
  mix-blend-mode: screen;
}

.home-cnt .wte-main .wte-img-sec .whteNew,
.home-cnt .wte-main .wte-img-sec .wte-img-mbl {
  display: none !important;
}

.home-cnt .wte-main .wte-img-sec .cnt-blk {
  width: 270px !important;
  height: 270px !important;
  top: 29%;
  left: 0;
  z-index: 1;
  pointer-events: auto;
}

.home-cnt .wte-main .wte-spec {
  width: 29% !important;
  position: relative;
  z-index: 3;
}

/* Soften pack negative pull so cards stay readable over the circle */
.home-cnt .wte-main .wte-spec .spec-bx {
  position: relative;
  z-index: 3;
  background-color: #fff;
}

.home-cnt .wte-main .wte-spec .spec-bx.lft-1 {
  margin-left: -72px;
}

.home-cnt .wte-main .wte-spec .spec-bx.lft-2 {
  margin-left: -36px;
}

.home-cnt .wte-main .wte .wte-dec {
  width: 23%;
  position: relative;
  z-index: 3;
}

/* Never leave home AOS nodes invisible (overflow-x:clip breaks in-view detection) */
.home-cnt [data-aos] {
  opacity: 1 !important;
  transform: none !important;
}

/*
  Do NOT set overflow-x:hidden on html/body. Hidden on one axis makes the
  other compute to auto and Chrome then refuses position:sticky on .adcrds cards.
  Pack uses overflow-x:clip, which clips bleed without breaking sticky.
*/

@media screen and (max-width: 1199px) {
  .home-cnt .wte-main .wte-img-sec {
    width: 100%;
    min-height: 0;
    pointer-events: auto;
  }
  .home-cnt .wte-main .wte-img-sec .wte-img-circle,
  .home-cnt .wte-main .wte-img-sec .whteNew,
  .home-cnt .wte-main .wte-img-sec .wte-img-mbl {
    height: 360px;
  }
  .home-cnt .wte-main .wte .wte-dec,
  .home-cnt .wte-main .wte-spec {
    width: 100% !important;
  }
  .home-cnt .wte-main .wte-spec .spec-bx.lft-1,
  .home-cnt .wte-main .wte-spec .spec-bx.lft-2 {
    margin-left: 0;
  }
}

/* Pack switches circle → whteNew at 880px; keep wte-img-mbl unused */
@media screen and (max-width: 880px) {
  .home-cnt .wte-main .wte-img-sec .wte-img-circle {
    mix-blend-mode: normal;
  }
}

@media screen and (max-width: 1199px) {
  .home-cnt .adcrds #cards .card .card__content .flxd .crd_cnt.cd1 .str img:not(.mobNw) {
    display: none;
  }
  .home-cnt .adcrds #cards .card .card__content .flxd .crd_cnt.cd1 .str img.mobNw {
    display: block;
    width: 100%;
    max-width: 420px;
    height: auto;
    object-fit: contain;
  }
}

@media screen and (max-width: 991px) {
  .home-cnt .adcrds #cards .card .card__content .flxd {
    flex-direction: column;
  }
  .home-cnt .adcrds #cards .card .card__content .flxd .rgt {
    width: 70%;
    flex: none;
  }
  .home-cnt .adcrds #cards .card .card__content .flxd .rgt img,
  .home-cnt .adcrds #cards .card .card__content.truckk .flxd .rgt img,
  .home-cnt .adcrds #cards .card .card__content.mob_grn .flxd .rgt img {
    height: auto;
    max-height: 438px;
    object-fit: contain;
  }
  .home-cnt .adcrds #cards .card .card__content .flxd .crd_cnt {
    width: 100%;
  }
  .home-cnt .adcrds #cards .card .card__content.truckk .flxd .cd2 .str img:not(.mobNw) {
    display: none;
  }
  .home-cnt .adcrds #cards .card .card__content.truckk .flxd .cd2 .str img.mobNw {
    display: block;
    width: 100%;
    height: auto;
    object-fit: contain;
  }
}