@font-face {font-family: 'Campton-Bold';src: url('/wp-content/themes/uncode/uncode/library/fonts/3A8576_0_0.woff2') format('woff2'),url('/wp-content/themes/uncode/uncode/library/fonts/3A8576_0_0.woff') format('woff'),url('/wp-content/themes/uncode/uncode/library/fonts/3A8576_0_0.ttf') format('truetype');}
@font-face {font-family: 'Campton-Book';src: url('/wp-content/themes/uncode/uncode/library/fonts/3A8576_1_0.woff2') format('woff2'),url('/wp-content/themes/uncode/uncode/library/fonts/3A8576_1_0.woff') format('woff'),url('/wp-content/themes/uncode/uncode/library/fonts/3A8576_1_0.ttf') format('truetype');}
@font-face {font-family: 'Campton-Black';src: url('/wp-content/themes/uncode/uncode/library/fonts/3A8432_0_0.woff2') format('woff2'),url('/wp-content/themes/uncode/uncode/library/fonts/3A8432_0_0.woff') format('woff'),url('/wp-content/themes/uncode/uncode/library/fonts/3A8432_0_0.ttf') format('truetype');}  

.header-bg{
  background-repeat: no-repeat;
}
#logo-container-mobile{
  padding: 15px 36px 15px 36px;
}
.menu-container.force-no-shadows{
  background-color: rgba(255,255,255,1)!important;
}

html body .f-vhb .split-word-inner {
    font-family: 'Campton-Black';
    font-weight: 400;
}
html body .style-light .btn-accent.btn-text-skin.btn-outline, html body .style-light .btn-accent.btn-text-skin:not(.btn-outline):hover{
  color: rgba(255,255,255,0.7)!important;
}
.work-controls{
  margin-bottom: 40px;
}
.work-control{
  padding: 5px 10px;
  cursor: pointer;
  -moz-transition: cubic-bezier(0.77, 0, 0.175, 1) 0.35s;
  -o-transition: cubic-bezier(0.77, 0, 0.175, 1) 0.35s;
  -webkit-transition: cubic-bezier(0.77, 0, 0.175, 1) 0.35s;
  transition: cubic-bezier(0.77, 0, 0.175, 1) 0.35s;
}
.work-control.active{
  background-color: #8000ff;
  color: #fff;
  border-radius: 3px;
}
.vhb-hl{
   font-weight: 600;
    letter-spacing: 0.05em;
    font-family: 'Poppins';
    color: #303133;
    font-size: 14px;
    text-transform: uppercase;
}
html body .portfolio-wrapper  .post-title,
.vhb-hl-mdm{
    font-family: 'Campton-Black';
    font-weight: 400;
    color: #303133;
    font-size: 32px;
    text-transform: uppercase;
    /* test */
}

.postid-82645 .header-bg{
  background-color: #e72f91;
}

html body form .fist-bump{
  background-color: transparent!important;
  background-image: url(/wp-content/uploads/2019/12/first.png)!important;
  width: 150px!important;
  height: 150px;
  background-size: contain!important;
  border: none;
  text-indent: -99999px;
  overflow: hidden;
  margin: 0 auto;
  background-repeat: no-repeat;
  -moz-transition: cubic-bezier(0.77, 0, 0.175, 1) 0.35s;
  -o-transition: cubic-bezier(0.77, 0, 0.175, 1) 0.35s;
  -webkit-transition: cubic-bezier(0.77, 0, 0.175, 1) 0.35s;
  transition: cubic-bezier(0.77, 0, 0.175, 1) 0.35s;
  -moz-transform: scale(0.6) ;
  -o-transform: scale(0.6) ;
  -webkit-transform: scale(0.6) ;
  transform: scale(0.6) ;
}

.fist-bump-wrap .fist-text{
  -moz-transition: cubic-bezier(0.77, 0, 0.175, 1) 0.35s;
  -o-transition: cubic-bezier(0.77, 0, 0.175, 1) 0.35s;
  -webkit-transition: cubic-bezier(0.77, 0, 0.175, 1) 0.35s;
  transition: cubic-bezier(0.77, 0, 0.175, 1) 0.35s;
  opacity:0;
}
.fist-bump-wrap:hover .fist-text{
  opacity:1;
}

.link-bw{color:#8000ff!important; }
.link-bw:hover{color:#8000ff!important;}

.fist-bump:hover{
    -moz-transform: scale(1) ;
  -o-transform: scale(1) ;
  -webkit-transform: scale(1) ;
  transform: scale(1) ;
}

body.home #page-header .vc_row{
  /* background-image: url(/wp-content/uploads/2019/11/cloth.jpg); */
}

.menu-container.style-accent-bg{
  background-color: #502c6d;
  /* background: rgb(81 45 109)!important;   */
  border: none!important;
}

/* Homepage: transparent nav over hero at scroll top (override Uncode opacity:0 hack) */
@media (min-width: 960px) {
  body.home:not(.navbar-hover) .menu-wrapper:not(.no-header) #masthead.menu-transparent.style-dark-original:not(.is_stuck),
  body.home:not(.navbar-hover) .menu-wrapper:not(.no-header) #masthead.menu-transparent.style-dark-original:not(.is_stuck) > * {
    opacity: 1 !important;
    background: transparent !important;
    background-color: transparent !important;
    box-shadow: none !important;
  }
}
body.home #masthead.menu-transparent:not(.is_stuck) .menu-container,
body.home #masthead.menu-transparent:not(.is_stuck) .menu-container .row-menu,
body.home #masthead.menu-transparent:not(.is_stuck) .menu-container .row-brand,
body.home #masthead.menu-transparent:not(.is_stuck) .navbar-header {
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
}
body.home #masthead.menu-transparent.is_stuck .menu-container.style-accent-bg {
  background-color: #502c6d !important;
  box-shadow: none !important;
}
body.home #masthead.menu-absolute {
  position: absolute !important;
  top: 0;
  left: 0;
  right: 0;
  width: 100% !important;
  z-index: 200;
}
.new{

}
.limit-logo-width{
  width: 100%;
  max-width: 300px!important;
  margin: 0 auto!important;
}
#index-2 .tmb-img-ratio.tmb .t-entry-visual .t-entry-visual-cont > a > img{
  object-fit: cover;
}

.menu-dark .row-brand, .menu-dark .row-menu .row-menu-inner {
    border-bottom: none!important;
}

body.home #page-header .row-header{
    margin: 0;
    min-height: 100vh;
    min-height: 100dvh;
    display: flex;
    align-items: center;
    background-color: transparent;
    background-size:cover;
    background-position: bottom center;
    /* background: linear-gradient(to bottom,#d2d2d2 50%,#ffffff 100%)!important; */
  /* background: linear-gradient(to top left,#d716e9,#9012fe 50%,#006cff 100%)!important; */
}

/* .isotope-container .t-entry-visual-overlay .style-dark-bg{
  background-color: #8000ff!important
} */

body.home #masthead .menu-container{
  border: none!important;
}
html body.home:not(.menu-force-opacity) header.menu-primary.style-light-override:not(.is_stuck):not(.is_mobile_open) div div div.menu-horizontal > div.menu-horizontal-inner > div.nav > ul.menu-smart > li > a,
html body.home:not(.menu-force-opacity) #masthead.menu-transparent.menu-dark:not(.is_stuck):not(.is_mobile_open) .menu-smart > li > a {
  color: #fff!important;
}
.form-group{
  margin-bottom: 1em;
}
.form-control{
  background: #fff;
  width: 100%;
  font-family: Roboto;
}
.texture-bg .background-inner{
    background-repeat: repeat!important;
    background-position: center center!important;
    background-size: initial!important;
}

.hp-text{
  z-index:9;
  color: #fff;
  max-width: 800px;
  margin: 0 auto;
  padding: 0 20px;
}
.hp-h1{
  z-index:1;
}
.hp-h1,
.hp-h1 span{
   font-family: 'Campton-Black';
    /* color: #303133; */
     color: #fff; 
    font-weight: 400;
    /* font-size: 100px!important; */
    font-size: 5vw;
    line-height: 1;       
}
@media (max-width: 959px){
  .home #page-header .wpb_row.row-inner{
    margin-top:-100px;
  }
  #menu-mainmenu{
    margin-top: -50px;
  }
  #menu-mainmenu li a{
    font-family: 'Campton-Black'!important;
    text-transform: uppercase!important;
    font-size: 8.5vw !important;
  }
}

.btn-white{
  border-color: #fff;
  color: #fff!important;
}
.btn-white:hover{
  background: #fff;
  color: #8000ff!important;
}



html body div div h1,
html body div div .header-title{
  font-weight: 400!important;
  font-family: 'Campton-Black'!important;
  text-transform: uppercase;
}
html body div div h1 > span,
html body div div .header-title > span {
  font-weight: 400!important;
}
html body div h1.font-762333,
html body div h1.font-762333 > span{
  font-weight: 400!important;
  font-family: 'Campton-Black'!important;
}
@media(max-width:979px){
  .hp-h1,
  .hp-h1 span{
    font-size: 38px!important;
  }
  .trans-4 p{
    font-size: 14px;
    width: 100%;
    max-width: 600px;
    margin: 0 auto;
  }
}

.isotope-wrapper.no-gutter.style-color-wayh-bg {
    background-color: #fff!important;
}

.row-navigation-light{
  display: none;
}

@media (max-width: 959px){
  html body .menu-container .logo-container {
    position: relative;
    padding: 10px 36px!important;
  }
  .mobile-hide{
    display:none!important;
  }
  .submenu-dark .menu-smart, .submenu-dark .menu-sidebar-inner, .submenu-dark .main-menu-container {
    background-color: #502c6d!important;
  }
}

body.home .menu-horizontal{
  /* padding-top: 30px; */
}

.portfolio-template-default .mejs-container{
  background: #fff;
}

.vhb-velvet-wrap {
    overflow: hidden;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: calc(100% + var(--vhb-curtain-overhang, 12vh));
    z-index: 1;
    transform: translate3d(0,0,0);
}
.vhb-velvet-wrap canvas.vhb-velvet {
    display: block;
    width: 100% !important;
    height: 100% !important;
}
body.home .isotope-filters{
  background-color: #141618;
  padding-top: 30px;
}
body.home .isotope-filters .menu-horizontal li a{
  color: #d4d7dd
}
body.home .isotope-filters .menu-horizontal li a.active{
  color: #fff;
}
body.home .isotope-filters .menu-horizontal .filter-show-all a{
  color: rgba(196, 200, 208, 0.5);
}

.vh-banner-content{
  height: auto;
}
.vh-banner-image{
  height: 80vh;
}
.h-100{
  height: 100%;
}
html body.home .post-wrapper{
  margin-top: -100vh!important;
  margin-top: -100dvh!important;
}
.banner-0{
  height: 100vh;
}
body.home .row.no-top-padding.no-bottom-padding.no-h-padding.full-width.row-parent{
  margin-left:0;
  margin-right:0;
}
.limit-width-banner{
  max-width: 80%;
  margin: 0 auto;
  overflow: hidden;  
}

.limit-width-banner p{
  margin:0!important;
  padding:0!important;
}

.box-shadow{
  -webkit-box-shadow: 2px 2px 20px 0px rgba(0,0,0,0.4);
  -moz-box-shadow: 2px 2px 20px 0px rgba(0,0,0,0.4);
  box-shadow: 2px 2px 20px 0px rgba(0,0,0,0.4);
}

.postid-4154 .header-bg{
  background-color: #00aeef;
}

.post-content img{
  max-height:100%;
  object-fit: contain;
  margin: 0 auto;
}

@media(max-width: 960px){
  /* .limit-width-banner .content-area{
     display: none;    
  } */
  .info-content .detail-label{
    display: none!important;
  }
  .detail-container{
    width: 100%!important;
  }
  .detail-value{
    text-align: center;
  }
}

.limit-width-banner p{
  width: 100%;
  text-align: center;
  height: 100%;
  display:flex;
  margin-top:0;
  padding: 50px 0;
}
.with-content{
  padding: 30px 0;
}
.limit-width-banner p img{
  margin: 0 auto;
  max-height: 100%;  
  object-fit: contain;
  height: auto;
}
.vhb-banners{

}
.vhb-banners .row-container{
  margin-top:0;
}
.row{
  margin-left:0;
  margin-right:0;
}
.menu-container.menu-hide.style-accent-bg.menu-borders{
  width: 100%!important;
}

.postid-4154 .header-bg{
  background-size: contain!important;
}

@media (max-width: 569px){
  .btn:not(input):not(.checkout-button), .btn-link:not(input):not(.checkout-button) {
    transform: scale(0.8);
    transform-origin: center!important;
  }
}

@media (max-width: 768px){
  .limit-width-banner .col-sm-12{
    flex: 0 0 100%;
    max-width: 100%;
  }
}
.box-container{
  width:100%!important;
  margin: 0!important;
}
.home .custom-link.btn.border-width-0.text-center.btn-text-skin.btn-accent.btn-flat.btn-icon-left{
  transform-origin: center!important;
}

.content-area .d-flex{
  width: 100%;
}
.content-area{
  overflow: hidden;
}
.banner-image-item{
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
}
.footer-content-block.row-container{
  display: none;
}

.page-id-82647 .style-color-xsdn-bg .uncol.style-dark{
  /* background-color: #8000ff; */
  background-color: #502c6d;
  color: #fff;
}
.page-id-82647 .row.unequal.no-top-padding.no-bottom-padding.no-h-padding.full-width.row-parent.row-header{
  margin: 0;
}

/*
 * Basic pages (Contact, etc.): Uncode .row is display:table, which breaks
 * Bootstrap offset-sm-* / col-sm-* used inside VC text blocks. Force a
 * centered content column.
 */
body.page .uncode_text_column .row {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center !important;
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  table-layout: auto !important;
}
body.page .uncode_text_column .row > [class*="col-sm-"],
body.page .uncode_text_column .row > [class*="offset-sm-"] {
  display: block !important;
  float: none !important;
  position: relative !important;
  box-sizing: border-box !important;
}
@media (min-width: 576px) {
  body.page .uncode_text_column .row > .col-sm-8,
  body.page .uncode_text_column .row > .offset-sm-2.col-sm-8 {
    flex: 0 0 66.666667% !important;
    width: 66.666667% !important;
    max-width: 720px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  body.page .uncode_text_column .row > .col-sm-6,
  body.page .uncode_text_column .row > .offset-sm-3.col-sm-6 {
    flex: 0 0 50% !important;
    width: 50% !important;
    max-width: 560px !important;
    margin-left: 0 !important;
  }
  body.page .uncode_text_column .row > .col-sm-10,
  body.page .uncode_text_column .row > .offset-sm-1.col-sm-10 {
    flex: 0 0 83.333333% !important;
    width: 83.333333% !important;
    max-width: 900px !important;
    margin-left: 0 !important;
  }
}
body.page .form-contact {
  width: 100%;
  max-width: 100%;
  margin: 0 auto;
}
body.page .uncode_text_column .vhb-hl-mdm,
body.page .uncode_text_column h1,
body.page .uncode_text_column h2,
body.page .uncode_text_column > p {
  text-align: center;
}
/* Contact page: keep the whole content block visually centered */
body.page-id-82647 .row-parent.limit-width.row-header,
body.page .row-parent.limit-width.row-header {
  margin-left: auto !important;
  margin-right: auto !important;
}


/* CHRISTMAS CARD */
.christmas-video{
  width: 100%;
  height: auto;
  margin-bottom: -5px;
  max-height: 80vh;
}
.blurry-bg{
  filter: blur(10px);
  -webkit-filter: blur(10px);
  -moz-transition: cubic-bezier(0.77, 0, 0.175, 1) 0.35s;
  -o-transition: cubic-bezier(0.77, 0, 0.175, 1) 0.35s;
  -webkit-transition: cubic-bezier(0.77, 0, 0.175, 1) 0.35s;
  transition: cubic-bezier(0.77, 0, 0.175, 1) 0.35s;
}
.christmas-card{
  width: 90%;  
  max-width: 1200px;
  left: 50%;
  top: 50%;
  transform: translateX(-50%) translateY(-50%);
  margin: 0 auto;
  /* background: rgb(233,51,71);
  background: radial-gradient(circle, rgba(233,51,71,1) 0%, rgba(187,27,47,1) 100%);   */
  text-align:center;
  position: fixed;
  color: #fff;
  /* border: 10px solid #fff; */
  z-index: 10;
}
.christmas-card-bg{
  content: "";
  left: 0; top: 0;
  width: 100%; height: 100%;
  background: rgba(81, 44, 111,1);
  /* background-image: url(https://cdn.velvethammerbranding.com/assets/videos/videos/frosty.png); */
  background-size: 100% 100%;
  background-position: center center;
  display: block;
  position: fixed;
}
#canvas-snowflake{
  width: 400px; height: 400px;
}
.snowf-canvas{
  z-index: 10;
  position: fixed!important;
}
#merry{
  margin-top: 40px;
  max-width: 300px;
}
#merry path{
 fill: #fff;
}
.initial-gen{
  display:inline-block;
  width: 40px;
  padding: 10px;
  text-align: center;
  text-transform: uppercase;
  color: #fff;
  background: transparent;
  border: 1px solid #fff;
  border-radius: 3px;
  margin: 5px;
}
.christmas-card .close{
  cursor: pointer;
  padding: 10px 15px;
  color: #333;
  font-weight: 800;
  border-radius: 50%;
  background: #fff;
  position: absolute;
  right: -15px; 
  top: -15px;
  content: "X";
  display: inline-block;
  z-index: 15;
}
.christmas-card .play{
  box-sizing: border-box;
  width: 74px;
  height: 74px;
  border-width: 37px 0px 37px 74px;
  left: 50%;
  top: 50%;
  position: absolute;
  z-index: 1;
  border-color: transparent transparent transparent #fff;
  border-style: solid;
  -moz-transition: cubic-bezier(0.77, 0, 0.175, 1) 0.35s;
  -o-transition: cubic-bezier(0.77, 0, 0.175, 1) 0.35s;
  -webkit-transition: cubic-bezier(0.77, 0, 0.175, 1) 0.35s;
  transition: cubic-bezier(0.77, 0, 0.175, 1) 0.35s;
  -moz-transform: translateX(-50%) translateY(-50%);
  -o-transform: translateX(-50%) translateY(-50%);
  -webkit-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
  cursor: pointer
}
.christmas-card-wrap{
  position: relative;
}
.christmas-card .play:hover{
  -moz-transform: translateX(-50%) translateY(-50%) scale(1.2);
  -o-transform: translateX(-50%) translateY(-50%) scale(1.2);
  -webkit-transform: translateX(-50%) translateY(-50%) scale(1.2);
  transform: translateX(-50%) translateY(-50%) scale(1.2);
}
.custom-link{
  color: rgba(233,51,71,1);
  display: inline-block;
}
.card-step-1{
  display: block;
}
.card-step-2{
  display: none;
}
.card-step-2 video{
  width: 100%;
  height: auto;
  margin-bottom: -5px;
}
.christmas-card.step-2 .card-step-1{
  display: none;  
}
.christmas-card.step-2 .card-step-2{
  display: block;  
}
/* End Card CHRISTMAS CARD */

.has-poster{
  background-size: cover;
  background-position: center;
}

#stage-contact{
    position: absolute;
    left: -36px;
    top: -36px;
    width: 100%;
}
.my-1{
  margin-left: 10px;
  margin-right: 10px;
}

.impact{
  -moz-transform: scale(5);
  -o-transform: scale(5);
  -webkit-transform: scale(5);
  transform: scale(5);
  opacity: 0;  
}
.trans-1 {
  -moz-transition: cubic-bezier(0.77, 0, 0.175, 1) 0.35s;
  -o-transition: cubic-bezier(0.77, 0, 0.175, 1) 0.35s;
  -webkit-transition: cubic-bezier(0.77, 0, 0.175, 1) 0.35s;
  transition: cubic-bezier(0.77, 0, 0.175, 1) 0.35s;
  -moz-transition-delay: 0.3s;
  -o-transition-delay: 0.3s;
  -webkit-transition-delay: 0.3s;
  transition-delay: 0.3s;
}
.trans-2 {
  -moz-transition: cubic-bezier(0.77, 0, 0.175, 1) 0.35s;
  -o-transition: cubic-bezier(0.77, 0, 0.175, 1) 0.35s;
  -webkit-transition: cubic-bezier(0.77, 0, 0.175, 1) 0.35s;
  transition: cubic-bezier(0.77, 0, 0.175, 1) 0.35s;
  -moz-transition-delay: 0.6s;
  -o-transition-delay: 0.6s;
  -webkit-transition-delay: 0.6s;
  transition-delay: 0.6s;
}
.trans-3 {
  -moz-transition: cubic-bezier(0.77, 0, 0.175, 1) 0.35s;
  -o-transition: cubic-bezier(0.77, 0, 0.175, 1) 0.35s;
  -webkit-transition: cubic-bezier(0.77, 0, 0.175, 1) 0.35s;
  transition: cubic-bezier(0.77, 0, 0.175, 1) 0.35s;
  -moz-transition-delay: 0.9s;
  -o-transition-delay: 0.9s;
  -webkit-transition-delay: 0.9s;
  transition-delay: 0.9s;
}
.trans-4 {
  -moz-transition: cubic-bezier(0.77, 0, 0.175, 1) 0.35s;
  -o-transition: cubic-bezier(0.77, 0, 0.175, 1) 0.35s;
  -webkit-transition: cubic-bezier(0.77, 0, 0.175, 1) 0.35s;
  transition: cubic-bezier(0.77, 0, 0.175, 1) 0.35s;
  -moz-transition-delay: 1.2s;
  -o-transition-delay: 1.2s;
  -webkit-transition-delay: 1.2s;
  transition-delay: 1.2s;
}
.trans-5 {
  -moz-transition: cubic-bezier(0.77, 0, 0.175, 1) 0.35s;
  -o-transition: cubic-bezier(0.77, 0, 0.175, 1) 0.35s;
  -webkit-transition: cubic-bezier(0.77, 0, 0.175, 1) 0.35s;
  transition: cubic-bezier(0.77, 0, 0.175, 1) 0.35s;
  -moz-transition-delay: 1.5s;
  -o-transition-delay: 1.5s;
  -webkit-transition-delay: 1.5s;
  transition-delay: 1.5s;
}

.style-white-bg{
  background-color: #fff;
}

.text-center{
  text-align: center;
}
.deep-center .btn-container{
    text-align: center;
}

@media (max-width: 959px) {
  html body.menu-mobile-centered .mobile-hidden:not(.social-icon):not(.menu-social) {
    display: block !important;
  }
}
/* Homepage client banners: Uncode zoom-in on .content-area (see vhb-curtain-assets.php) */

/* Homepage client banners: 1/3 logo (centered) + 2/3 HTML/products */
.vhb-banners .with-content {
  padding: 0;
}
.vhb-banners .vh-banner-content {
  min-height: 35vh;
  height: auto;
  display: flex;
  align-items: stretch;
}
.vhb-banners .vh-banner-content > a {
  display: block;
  width: 100%;
  text-decoration: none;
  color: inherit;
}
.vhb-banners .limit-width-banner {
  width: 100%;
  max-width: 1404px;
  margin: 0 auto;
  padding: 0 clamp(16px, 3vw, 48px);
  overflow: visible;
  box-sizing: border-box;
}
.vhb-banners .vhb-banner-inner {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: clamp(32px, 4vw, 56px);
  width: 100%;
  min-height: 35vh;
  box-sizing: border-box;
}
.vhb-banners .vhb-banner-logo {
  flex: 0 0 33.333%;
  max-width: 33.333%;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: clamp(24px, 4vh, 48px) clamp(16px, 2vw, 32px);
  box-sizing: border-box;
}
.vhb-banners .vhb-banner-logo img {
  display: block;
  max-width: min(100%, 320px);
  max-height: min(28vh, 240px);
  width: auto;
  height: auto;
  margin: 0 auto;
  object-fit: contain;
}
.vhb-banners .vhb-banner-products {
  flex: 0 0 66.667%;
  max-width: 66.667%;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: clamp(24px, 4vh, 48px) clamp(16px, 2vw, 32px);
  box-sizing: border-box;
  overflow: hidden;
}
.vhb-banners .vhb-banner-products-inner {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.vhb-banners .vhb-banner-products-inner > p {
  width: 100%;
  margin: 0 !important;
  padding: 0 !important;
  display: flex;
  align-items: center;
  justify-content: center;
}
.vhb-banners .vhb-banner-products-inner .d-flex > div {
  font-size: 15px;
  line-height: 1.65;
  color: #303133;
}
.vhb-banners .vhb-banner-products img {
  display: block;
  max-width: 100%;
  max-height: min(30vh, 280px);
  width: auto;
  height: auto;
  margin: 0 auto;
  object-fit: contain;
}
.vhb-banners .vhb-banner-products .d-flex {
  width: 100%;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  gap: clamp(8px, 1.5vw, 24px);
}
.vhb-banners .vhb-banner-products .d-flex > [class*="col-"] {
  flex: 1 1 auto;
  max-width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.5rem;
}
@media (max-width: 959px) {
  .vhb-banners .vhb-banner-products {
    display: none !important;
  }
  .vhb-banners .vhb-banner-inner {
    min-height: auto;
  }
  .vhb-banners .vhb-banner-logo {
    flex: 0 0 100%;
    max-width: 100%;
    padding: clamp(28px, 6vw, 40px) clamp(20px, 5vw, 32px);
  }
  .vhb-banners .vhb-banner-logo img {
    max-width: min(85%, 280px);
    max-height: none;
  }
  .vhb-banners .vh-banner-content {
    min-height: auto;
  }
}




/* Homepage hero: curtain behind headline (mount inside #page-header) */
body.home {
  --vhb-curtain-overhang: 12vh;
}
body.home #page-header {
  position: relative;
  z-index: 5;
}
body.home #page-header .row-header {
  position: relative;
  z-index: 1;
  overflow: visible;
}
body.home #page-header .row-header .vhb-velvet-wrap {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: calc(100% + var(--vhb-curtain-overhang, 12vh));
  z-index: 1;
  pointer-events: none;
  overflow: hidden;
}
body.home #page-header .row-header .vhb-velvet-wrap canvas {
  display: block;
  width: 100% !important;
  height: 100% !important;
  pointer-events: auto;
}
body.home #page-header .hp-h1,
body.home #page-header .hp-text,
body.home #page-header .vc_custom_heading_wrap {
  position: relative;
  z-index: 10;
}
body.home #masthead {
  z-index: 200;
}




/* Homepage hero backdrop: vhb_enqueue_home_hero_background() (first banner bg) */
/* Hero impact reveal: vhb-curtain-assets.php (do not force opacity:1) */
/* ACF multi-image rows inside banner products (needs .d-flex + .col-sm-*) */
.vhb-banners .vhb-banner-products-inner .d-flex {
  display: flex !important;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  width: 100%;
}
.vhb-banners .vhb-banner-products-inner .d-flex > [class*="col-"] {
  position: relative;
  flex: 1 1 0;
  min-width: 0;
  width: auto !important;
  max-width: none;
  padding: 0.35rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
.vhb-banners .vhb-banner-products-inner .d-flex > .col-sm-3 {
  flex: 0 0 25%;
  max-width: 25%;
}
.vhb-banners .vhb-banner-products-inner .d-flex > .col-sm-4 {
  flex: 0 0 33.333%;
  max-width: 33.333%;
}
.vhb-banners .vhb-banner-products-inner .d-flex img {
  max-height: min(20vh, 200px);
  width: auto;
  max-width: 100%;
  height: auto;
  object-fit: contain;
}
@media (max-width: 959px) {
  .vhb-banners .vhb-banner-products-inner .d-flex {
    display: none !important;
  }
}

/* Homepage CTA + footer (Want to see more? / copyright bar) */
body.home #row-unique-2.row-container {
  position: relative;
  z-index: 3;
  clear: both;
}
body.home #row-unique-2 .curtain.animate_inner_when_almost_visible,
body.home #row-unique-2 .zoom-out.animate_when_almost_visible {
  opacity: 1 !important;
  visibility: visible !important;
}
body.home #row-unique-2 .column_parent,
body.home #row-unique-2 .uncell,
body.home #row-unique-2 .uncont,
body.home #row-unique-2 .vc_custom_heading_wrap,
body.home #row-unique-2 .heading-text {
  text-align: center !important;
  width: 100%;
}
body.home #row-unique-2 .heading-text-inner {
  justify-content: center;
}
body.home #row-unique-2 .text-color-uydo-color,
body.home #row-unique-2 .text-color-uydo-color p {
  color: rgba(255, 255, 255, 0.9) !important;
}
body.home #row-unique-2 .text-color-uydo-color a.link-bw,
body.home #row-unique-2 .link-bw,
body.home #row-unique-2 .link-bw:hover {
  color: #8000ff !important;
}
body.home #row-unique-2 .row-inner .align_left > .uncol > .uncoltable > .uncell > .uncont,
body.home #row-unique-2 .column_parent.align_left,
body.home #row-unique-2 .wpb_column.column_parent {
  text-align: center !important;
}
body.home #row-unique-2 .vc_custom_heading_wrap,
body.home #row-unique-2 .heading-text,
body.home #row-unique-2 .heading-text h2,
body.home #row-unique-2 .heading-text h3,
body.home #row-unique-2 .heading-text p {
  text-align: center !important;
  margin-left: auto;
  margin-right: auto;
}
body.home #row-unique-2 .heading-text.el-text-split {
  display: flex !important;
  justify-content: center !important;
  align-items: center;
  width: 100%;
}
body.home #row-unique-2 .heading-text-inner {
  display: inline-flex !important;
  justify-content: center !important;
  align-items: center;
  flex-wrap: wrap;
  text-align: center;
  width: auto;
  max-width: 100%;
}
body.home #row-unique-2 .split-word,
body.home #row-unique-2 .split-word-flow {
  display: inline-block;
  text-align: center;
}


/* Split-word heading: Uncode floats words left (float:left + table-row) — force center */
body.home #row-unique-2 .vc_custom_heading_wrap.f-vhb {
  width: 100% !important;
  text-align: center !important;
}
body.home #row-unique-2 .heading-text > h2,
body.home #row-unique-2 .heading-text > h3 {
  text-align: center !important;
  width: 100%;
}
body.home #row-unique-2 .heading-text-inner {
  display: inline-block !important;
  clear: none !important;
  float: none !important;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
  overflow: visible !important;
}
body.home #row-unique-2 .split-word,
body.home #row-unique-2 .split-word-flow,
body.home #row-unique-2 .split-word-inner {
  float: none !important;
  display: inline-block !important;
  text-align: center !important;
}
body.home #row-unique-2 .row-parent.limit-width {
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Remove bottom white gap: body min-height + GDPR panel in document flow */
body.home {
  min-height: 0 !important;
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
}
body.home .gdpr.gdpr-privacy-preferences {
  position: fixed !important;
  top: auto !important;
  bottom: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  pointer-events: none;
  z-index: 999999;
}
body.home .gdpr-overlay {
  pointer-events: none;
}
html {
  background-color: #141618;
}
body.home {
  background-color: #ffffff;
}
/* Sitewide footer band (home + portfolio + rest) */
footer#colophon.site-footer,
footer#colophon .footer-last,
footer#colophon .style-dark-bg,
footer#colophon .vhb-site-footer-bar {
  background-color: #141618 !important;
}
body.home #row-unique-2.style-color-wayh-bg,
body.home #row-unique-2.style-color-wayh-bg.row-container {
  background-color: #141618 !important;
}

/* Homepage footer stack: dark band flush to bottom, no white gap (keep Uncode table layout) */
body.home .box-wrapper,
body.home .box-container,
body.home .main-wrapper,
body.home .page-wrapper,
body.home .sections-container {
  min-height: 0 !important;
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
}
body.home #row-unique-2.row-container,
body.home footer#colophon.site-footer,
body.home footer#colophon .footer-last,
body.home footer#colophon .footer-last > .row.row-parent {
  margin-bottom: 0 !important;
}

footer#colophon.site-footer {
  display: block !important;
  height: auto !important;
  overflow: visible !important;
  position: relative;
  z-index: 4;
  clear: both;
  width: 100%;
}
footer#colophon .footer-last {
  overflow: visible;
}
footer#colophon .footer-last > .row.row-parent {
  display: flex !important;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
  padding: 20px 36px !important;
  min-height: 56px;
  box-sizing: border-box;
}
footer#colophon .footer-last .uncell {
  display: block !important;
  float: none !important;
  flex: 0 1 auto;
  width: auto !important;
  max-width: none;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  overflow: visible;
  line-height: 1.5;
}
footer#colophon .footer-last .site-info {
  flex: 1 1 auto;
  text-align: left !important;
  font-size: 13px;
}
footer#colophon .footer-last .uncell.text-right {
  flex: 0 0 auto;
  text-align: right !important;
  margin-left: auto;
}
footer#colophon .footer-last .uncell.col-lg-6 {
  width: auto !important;
  max-width: none !important;
}
footer#colophon .social-icon.icon-inline a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 8px 12px;
}
footer#colophon .social-icon i {
  font-size: 22px !important;
  line-height: 1;
}
@media (max-width: 959px) {
  footer#colophon .footer-last > .row.row-parent {
    flex-wrap: wrap;
    justify-content: space-between;
    padding: 24px 20px !important;
  }
  footer#colophon .footer-last .site-info {
    flex: 1 1 100%;
    text-align: center !important;
    margin-bottom: 8px;
  }
  footer#colophon .footer-last .uncell.text-right {
    flex: 1 1 100%;
    text-align: center !important;
    margin-left: 0;
  }
}

/* Smoother client-banner parallax (VHB RAF; avoids Uncode Math.floor + scroll jank) */
body.home .vhb-banners .vhb-parallax .background-wrapper {
  will-change: transform;
  backface-visibility: hidden;
}

.work-controls .work-control {
  display: inline-block;
  text-decoration: none;
  color: #303133;
}
.work-controls .work-control.active,
.work-controls .work-control:hover {
  background-color: #8000ff;
  color: #fff;
  border-radius: 3px;
}
@media (prefers-reduced-motion: reduce) {
  body.home #vhb-velvet-wrap { display: none !important; }
  body.home #page-header .impact {
    opacity: 1 !important;
    transform: scale(1) !important;
  }
  .vhb-banners .impact { opacity: 1 !important; transform: scale(1) !important; }
}

/* Single scrollbar: scroll on html only; preserve Uncode hmenu table scaffolding
 * on box-wrapper/box-container (required so .menu-wrapper table-row is full width). */
html {
  overflow-x: hidden !important;
  overflow-y: scroll !important;
  height: auto !important;
}
body {
  height: auto !important;
  min-height: 100%;
  max-height: none !important;
  overflow: visible !important;
}
body.home .box-wrapper {
  display: table !important;
  table-layout: fixed;
  width: 100%;
  height: auto !important;
  min-height: 100%;
  max-height: none !important;
  overflow: visible !important;
}
body.home .box-container {
  display: table !important;
  width: 100%;
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
}
body.home.hmenu .main-wrapper {
  display: table-row !important;
  height: auto !important;
  overflow: visible !important;
}
body.home .sections-container {
  display: table !important;
  table-layout: fixed;
  width: 100%;
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
}
body.home .page-wrapper,
body.home .page-body {
  display: table-row !important;
  height: auto !important;
  overflow: visible !important;
}
/* Pages: keep Uncode table scaffolding (same as prod) so .menu-wrapper
 * table-row stretches full width. Only the content column needs block. */
body.page .box-wrapper,
body.page .box-container {
  display: table !important;
  table-layout: fixed;
  width: 100% !important;
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
}
body.page.hmenu .menu-wrapper {
  display: table-row !important;
  width: 100% !important;
}
body.page.hmenu #masthead {
  width: 100% !important;
}
body.page .main-wrapper,
body.page .sections-container,
body.page .page-wrapper,
body.page .page-body {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  table-layout: auto !important;
  height: auto !important;
  overflow: visible !important;
}
body.page .row-parent.limit-width {
  margin-left: auto !important;
  margin-right: auto !important;
}
body.home,
body.home .box-wrapper,
body.home .box-container,
body.home .main-wrapper,
body.home .page-wrapper,
body.home .sections-container {
  min-height: 0 !important;
}
html.lenis,
html.lenis body {
  height: auto !important;
  overflow: visible !important;
}
html.lenis {
  overflow-y: scroll !important;
}

/* Header: logo left, Work/Contact right (all templates; was home-only).
 * Without width:100% on .row-menu-inner, the accent bar shrink-wraps. */
@media (min-width: 960px) {
  body.hmenu #masthead .row-menu-inner {
    display: table !important;
    width: 100%;
  }
  body.hmenu #masthead .menu-container,
  body.hmenu #masthead .row-menu {
    width: 100%;
  }
  body.hmenu #masthead .logo-container,
  body.hmenu #masthead .main-menu-container {
    display: table-cell !important;
    vertical-align: middle;
    float: none !important;
  }
  body.hmenu #masthead .logo-container {
    width: 1%;
    white-space: nowrap;
  }
  body.hmenu #masthead .main-menu-container {
    width: auto;
  }
  body.hmenu #masthead .menu-horizontal-inner {
    display: flex !important;
    align-items: center;
    justify-content: flex-end;
    width: 100%;
  }
  body.hmenu #masthead .navbar-nav.navbar-nav-last {
    float: none !important;
    margin-left: auto;
  }
  body.hmenu #masthead .menu-smart {
    display: flex !important;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: flex-end;
  }
  body.hmenu #masthead .menu-smart > li {
    float: none !important;
  }
}