/* Bridge styles so mirrored live HTML renders correctly inside WordPress */

html.uc-live-mirror,
body.uc-live-mirror {
  margin: 0;
  padding: 0;
  width: 100%;
  overflow-x: hidden;
  -webkit-text-size-adjust: 100%;
}

/* Neutralize Hello Elementor / WP content wrappers */
body.uc-live-mirror #page,
body.uc-live-mirror .site,
body.uc-live-mirror .site-content,
body.uc-live-mirror .site-main,
body.uc-live-mirror .page-content,
body.uc-live-mirror .entry-content,
body.uc-live-mirror .content-area {
  max-width: none !important;
  width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Hello Elementor injects this on non-front pages — mirrored pages have their own banner H1 */
body.uc-live-mirror .page-header {
  display: none !important;
}

/* Sub-page hero banners (BannerV1) — padding/background rules live in per-page CMS bundles */
.uc-live-mirror section.bnr.v1.bg-image {
  position: relative;
  overflow: hidden;
}

.uc-live-mirror section.bnr.v1 .img-bg {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  pointer-events: none;
}

.uc-live-mirror .bnr.v1 {
  --bnr-v1-pd-sp-1: 213;
  --bnr-v1-pd-sp-1-mbl: 40;
  --bnr-v1-pd-sp-2: 206;
  --bnr-v1-pd-sp-2-mbl: 40;
  --bnr-v1-img-o: 0.99;
  --bnr-v1-pd-sp-1-clc: calc((var(--bnr-v1-pd-sp-1-mbl) * 1px) + (var(--bnr-v1-pd-sp-1) - var(--bnr-v1-pd-sp-1-mbl)) * ((100vw - 318px) / (1920 - 320)));
  --bnr-v1-pd-sp-2-clc: calc((var(--bnr-v1-pd-sp-2-mbl) * 1px) + (var(--bnr-v1-pd-sp-2) - var(--bnr-v1-pd-sp-2-mbl)) * ((100vw - 318px) / (1920 - 320)));
}

.uc-live-mirror .bnr.v1 .mn_wd {
  position: relative;
  z-index: 2;
}

.uc-live-mirror .bnr.v1 .inf {
  padding-top: var(--bnr-v1-pd-sp-1-clc);
  padding-bottom: var(--bnr-v1-pd-sp-2-clc);
}

.uc-live-mirror .bnr.v1 .psu-bfr::before {
  background-color: var(--black, #000);
}

.uc-live-content {
  width: 100%;
  max-width: none;
  padding: 0;
  margin: 0;
  overflow: visible;
}

.uc-live-content > *:first-child {
  margin-top: 0;
}

.uc-live-content .cnt,
.uc-live-content section,
.uc-live-content main {
  max-width: none;
  overflow: visible !important;
}

/* Only constrain rich-text images — never CMS layout/background images */
.uc-live-mirror .cnt-stl img,
.uc-live-mirror .cnt-stl video,
.uc-live-mirror .cnt-stl iframe {
  max-width: 100%;
  height: auto;
}

/* Preserve live-site cover/crop behavior for section backgrounds and ratio boxes */
.uc-live-mirror picture.img-bg,
.uc-live-mirror .img-bg,
.uc-live-mirror .bg-wrp,
.uc-live-mirror picture.pd-h-,
.uc-live-mirror .pd-h-,
.uc-live-mirror .mp-bx,
.uc-live-mirror .img-bx {
  max-width: none;
}

.uc-live-mirror picture.img-bg img,
.uc-live-mirror .img-bg img,
.uc-live-mirror .bg-wrp img,
.uc-live-mirror picture.pd-h- img,
.uc-live-mirror .pd-h- img,
.uc-live-mirror .mp-bx img,
.uc-live-mirror .img-bx img {
  max-width: none !important;
}

/* Match live CMS full-bleed background cover positioning */
.uc-live-mirror .img-bg img {
  position: relative;
  left: 50%;
  top: 50%;
  width: auto !important;
  height: auto !important;
  min-width: calc(100% + 2px) !important;
  min-height: calc(100% + 2px) !important;
  transform: translate(-50%, -50%);
}

/* Aspect-ratio crop boxes (hex/framed content images) */
.uc-live-mirror picture.img img,
.uc-live-mirror .img.pd-h- img {
  position: absolute !important;
  width: 100% !important;
  height: 100% !important;
  left: 0 !important;
  top: 0 !important;
  object-fit: cover;
}

/* Location map boxes — picture.mp-bx needs an aspect-ratio shim without live CMS JS */
.uc-live-mirror picture.mp-bx,
.uc-live-content picture.mp-bx {
  display: block;
  position: relative;
  width: 100%;
  overflow: hidden;
}

.uc-live-mirror picture.mp-bx::after,
.uc-live-content picture.mp-bx::after {
  content: "" !important;
  display: block !important;
}

@media screen and (min-width: 1280px) {
  .uc-live-mirror .loc.v1 picture.mp-bx::after,
  .uc-live-content .loc.v1 picture.mp-bx::after {
    padding-bottom: var(--loc-v1-map-h, 70%);
  }
}

@media screen and (max-width: 1279px) {
  .uc-live-mirror picture.mp-bx::after,
  .uc-live-content picture.mp-bx::after {
    padding-bottom: 100%;
  }
}

.uc-live-mirror picture.mp-bx img,
.uc-live-content picture.mp-bx img {
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  width: 100% !important;
  height: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  transform: none !important;
  object-fit: contain;
}

/* CMS scrolling-list carousels — show items when USC.scrollingList is unavailable */
.uc-live-mirror [data-role="scroller"].active [data-role="item"].full:not(.s-active),
.uc-live-content [data-role="scroller"].active [data-role="item"].full:not(.s-active) {
  opacity: 1 !important;
  visibility: visible !important;
}

.uc-live-mirror [data-role="scroller"] [data-role="item"],
.uc-live-content [data-role="scroller"] [data-role="item"] {
  opacity: 1 !important;
  visibility: visible !important;
}

/* Service tile thumbnails — img-bg inside padded card needs a real box */
.uc-live-mirror #ServicesS7Feed a .rlt.ato,
.uc-live-content #ServicesS7Feed a .rlt.ato {
  position: relative;
  display: block;
  aspect-ratio: 1 / 1;
  min-height: 8rem;
}

.uc-live-mirror #ServicesS7Feed picture.img-bg.srv-img,
.uc-live-content #ServicesS7Feed picture.img-bg.srv-img {
  opacity: 1 !important;
}

/* Before/after category panels — first panel must sit above inactive tabs */
.uc-live-mirror .bfr-aft.s1.el-tab-box .el-panel.active,
.uc-live-content .bfr-aft.s1.el-tab-box .el-panel.active {
  z-index: 5 !important;
  visibility: visible !important;
}

.uc-live-mirror table {
  display: block;
  width: 100%;
  overflow-x: auto;
}

/* Lazy-load placeholders should show real images after migration */
.uc-live-content img[src^="data:"] {
  min-height: 1px;
}

/* Live CMS hides SVG sprites until JS runs */
.uc-live-mirror svg use,
.uc-live-content svg use {
  opacity: 1 !important;
}

/* patterns/1.jpg 404s on live site — disable broken texture overlay */
.uc-live-mirror:root,
.uc-live-content:root {
  --lt-ptrn-bg: none;
  --dk-ptrn-bg: none;
  --lt-inr-ptrn-bg: none;
  --dk-inr-ptrn-bg: none;
  --alt-inr-ptrn-bg: none;
}

/* Live CMS hides [data-src] until JS runs — force visibility in WordPress mirror */
.uc-live-content [data-src],
.uc-live-content [data-bg],
.uc-live-content picture.loading img,
.uc-live-mirror [data-src],
.uc-live-mirror [data-bg] {
  opacity: 1 !important;
  filter: none !important;
}

.uc-live-content picture.img-bg,
.uc-live-content picture.img-bg img {
  opacity: 1 !important;
  filter: none !important;
}

/* Scroll animations from live CMS — show content without live JS */
@media screen and (min-width: 1280px) {
  .uc-live-content [data-onvisible],
  .uc-live-mirror [data-onvisible],
  .uc-live-content .anm_fl,
  .uc-live-content .anm_hlf-l,
  .uc-live-content .anm_hlf-r,
  .uc-live-content .anm_seq-itm > *,
  .uc-live-content .anm_seq-itm-sp > *,
  .uc-live-content .anm_seq-lst > li,
  .uc-live-mirror .anm_fl,
  .uc-live-mirror .anm_hlf-l,
  .uc-live-mirror .anm_hlf-r,
  .uc-live-mirror .anm_seq-itm > *,
  .uc-live-mirror .anm_seq-itm-sp > *,
  .uc-live-mirror .anm_seq-lst > li,
  html.uc-live-mirror.show-20 .anm_img img,
  html.uc-live-mirror.show-20 .anm_seq-imgs > picture img,
  html.uc-live-mirror.show-20 .anm_hlf-lt,
  html.uc-live-mirror.show-20 .anm_hlf-rt,
  html.uc-live-mirror.show-20 .anm_hlf-up,
  html.uc-live-mirror.show-20 .anm_hlf-dn,
  html.uc-live-mirror.show-20 .anm_hlf-l,
  html.uc-live-mirror.show-20 .anm_hlf-r,
  html.uc-live-mirror.show-20 .anm_fl,
  html.uc-live-mirror.show-20 .anm_seq-itm > *,
  html.uc-live-mirror.show-20 .anm_seq-itm-sp > *,
  html.uc-live-mirror.show-20 .anm_seq-lst > li {
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
  }
}

.uc-live-content [data-onvisible],
.uc-live-mirror [data-onvisible],
.uc-live-content .anm_fl,
.uc-live-content .anm_hlf-l,
.uc-live-content .anm_hlf-r,
.uc-live-content .anm_seq-itm > *,
.uc-live-content .anm_seq-itm-sp > *,
.uc-live-content .anm_seq-lst > li,
.uc-live-mirror .anm_fl,
.uc-live-mirror .anm_hlf-l,
.uc-live-mirror .anm_hlf-r,
.uc-live-mirror .anm_seq-itm > *,
.uc-live-mirror .anm_seq-itm-sp > *,
.uc-live-mirror .anm_seq-lst > li {
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
}

html.uc-live-mirror.show-20 .anm_img img,
html.uc-live-mirror.show-20 .anm_seq-imgs > picture img,
html.uc-live-mirror.show-20 .anm_hlf-lt,
html.uc-live-mirror.show-20 .anm_hlf-rt,
html.uc-live-mirror.show-20 .anm_hlf-up,
html.uc-live-mirror.show-20 .anm_hlf-dn,
html.uc-live-mirror.show-20 .anm_hlf-l,
html.uc-live-mirror.show-20 .anm_hlf-r,
html.uc-live-mirror.show-20 .anm_fl,
html.uc-live-mirror.show-20 .anm_seq-itm > *,
html.uc-live-mirror.show-20 .anm_seq-itm-sp > *,
html.uc-live-mirror.show-20 .anm_seq-lst > li,
.uc-live-content .anm_img img,
.uc-live-content .anm_seq-imgs > picture img,
.uc-live-content .anm_hlf-lt,
.uc-live-content .anm_hlf-rt,
.uc-live-content .anm_hlf-up,
.uc-live-content .anm_hlf-dn,
.uc-live-content .anm_hlf-l,
.uc-live-content .anm_hlf-r,
.uc-live-content .anm_fl,
.uc-live-content .anm_seq-itm > *,
.uc-live-content .anm_seq-itm-sp > *,
.uc-live-content .anm_seq-lst > li {
  opacity: 1 !important;
  transform: none !important;
}
body.uc-live-mirror #HeaderV1_1,
body.uc-live-mirror #HeaderV1_4,
body.uc-live-mirror [data-process="if"] {
  display: inline !important;
}

body.uc-live-mirror .flx-blk-500 {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

/* Mobile navigation overlay (works with live-mirror.js toggling html.mnu-opn) */
@media screen and (max-width: 1280px) {
  html.mnu-opn {
    overflow: hidden;
  }

  /* CMS bundle shows the mobile panel as fixed even when closed — hide until open. */
  body.uc-live-mirror .hdr .nv {
    display: none !important;
    visibility: hidden !important;
    transform: translateX(-100%) !important;
  }

  html.mnu-opn body.uc-live-mirror .hdr .nv {
    display: flex !important;
    visibility: visible !important;
    position: fixed;
    top: 0;
    right: 0;
    width: min(22rem, 88vw);
    height: 100vh;
    z-index: 9999;
    flex-direction: column;
    overflow-y: auto;
    background: #1787bd;
    color: #fff;
    padding: 1.5rem 1rem 2rem;
    box-shadow: -4px 0 24px rgba(0, 0, 0, 0.25);
  }

  html.mnu-opn body.uc-live-mirror .hdr .nv ul[role="menubar"] {
    flex-direction: column;
    width: 100%;
  }

  html.mnu-opn body.uc-live-mirror .hdr .nv ul[role="menubar"] > li {
    width: 100% !important;
    margin: 0 !important;
  }

  html.mnu-opn body.uc-live-mirror .hdr .fly-nv {
    display: block !important;
    position: static;
    opacity: 1 !important;
    visibility: visible !important;
  }
}

@media screen and (max-width: 500px) {
  .uc-live-mirror .hdr .cta .btn,
  .uc-live-mirror .mstg .btn {
    display: block;
    width: 100%;
    text-align: center;
    margin-bottom: 0.5rem;
  }
}

/* Agency footer credit — replaces Scorpion wordmark on mirrored sites */
.uc-live-mirror .wtf-ftr-credit,
.uc-live-content .wtf-ftr-credit {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.2rem;
  text-decoration: none;
  color: inherit;
  transition: color 0.2s ease, transform 0.2s ease;
}

.uc-live-mirror .wtf-ftr-credit:hover,
.uc-live-mirror .wtf-ftr-credit:focus,
.uc-live-content .wtf-ftr-credit:hover,
.uc-live-content .wtf-ftr-credit:focus {
  color: #12355b;
  transform: translateY(-1px);
}

.uc-live-mirror .wtf-ftr-label,
.uc-live-content .wtf-ftr-label {
  font-size: 0.72rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  opacity: 0.65;
}

.uc-live-mirror .wtf-ftr-brand,
.uc-live-content .wtf-ftr-brand {
  font-size: 1.3rem;
  font-weight: 600;
  letter-spacing: 0.03em;
  line-height: 1.1;
}

@media screen and (max-width: 700px) {
  .uc-live-mirror .wtf-ftr-credit,
  .uc-live-content .wtf-ftr-credit {
    align-items: flex-start;
    margin-top: 1rem;
  }
}
