/*********************************************/
/***** Menu Toggle Switches BEGIN*****/
/*********************************************/
.cmn-toggle-switch{position:relative;display:block;width:60px;height:40px;overflow:hidden;margin:4px 0 0 0;padding:0;-webkit-appearance:none;appearance:none;box-shadow:none;border-radius:none;border:none;cursor:pointer;-webkit-transition:background 0.5s;transition:background 0.5s;}
.cmn-toggle-switch:focus{outline:none;}
.cmn-toggle-switch span{display:block;position:absolute;top:16px;left:0;right:0;width:40px;height:4px;background-color:#000;}
.cmn-toggle-switch span:before,
.cmn-toggle-switch span:after{content:"";position:absolute;display:block;left:0;width:40px;height:4px;background-color:#000;}
.cmn-toggle-switch span:before{top:-10px;}
.cmn-toggle-switch span:after{bottom:-10px;}
/* Hamburger to "x" (htx). Takes on a hamburger shape, bars slide down to center and transform into an "x" */
.cmn-toggle-switch__htx{background-color:transparent;}
.cmn-toggle-switch__htx span{-webkit-transition:background 0 0.3s;transition:background 0 0.3s;}
.cmn-toggle-switch__htx span:before,
.cmn-toggle-switch__htx span:after{-webkit-transition-duration:0.3s, 0.3s;transition-duration:0.3s, 0.3s;transition-delay:0.3s, 0;}
.cmn-toggle-switch__htx span:before{-webkit-transition-property:top, -webkit-transform;transition-property:top, transform;}
.cmn-toggle-switch__htx span:after{-webkit-transition-property:bottom, -webkit-transform;transition-property:bottom, transform;}
/* active state, i.e. menu open */
.cmn-toggle-switch__htx.active{background-color:transparent;}
.cmn-toggle-switch__htx.active span{background:none;}
.cmn-toggle-switch__htx.active span:before{top:0;-webkit-transform:rotate(45deg);transform:rotate(45deg);}
.cmn-toggle-switch__htx.active span:after{bottom:0;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);}
.cmn-toggle-switch__htx.active span:before,
.cmn-toggle-switch__htx.active span:after{-webkit-transition-delay:0, 0.3s;transition-delay:0, 0.3s;background-color:#44D62C;}
.cmn-toggle-switch__htx.x-active span:before{top:0;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);}
.cmn-toggle-switch__htx.x-active span:after{bottom:0;-webkit-transform:rotate(45deg);transform:rotate(45deg);}
.cmn-toggle-switch__htx.x-active span:before,
.cmn-toggle-switch__htx.x-active span:after{-webkit-transition-delay:0, 0.3s;transition-delay:0, 0.3s;}
/*********************************************/
/***** END Menu Toggle Switches *****/
/*********************************************/

/*********************************************/
/***** Zoom In & Out BEGIN *****/
/*********************************************/
.zoom-in{-webkit-transform:scale(1.1);transform:scale(1.1);-webkit-transition:0.5s ease-in-out;transition:0.5s ease-in-out;}
.zoom-in:hover{-webkit-transform:scale(1);transform:scale(1);}
.zoom-out{-webkit-transform:scale(1);transform:scale(1);-webkit-transition:0.5s ease-in-out;transition:0.5s ease-in-out;}
.zoom-out:hover{-webkit-transform:scale(1.1);transform:scale(1.1);}
/*********************************************/
/***** END Zoom In & Out *****/
/*********************************************/

/*********************************************/
/***** UniversalInViewObserver BEGIN *****/
/*********************************************/
[data-observe]{opacity:0;transform:none;transition-property:opacity, transform;transition-duration:0.6s;transition-timing-function:ease;will-change:opacity, transform;}
/* Початкові позиції — автоматично за класом data-animation */
[data-animation="slide-up"]{transform:translateY(100%);}
[data-animation="slide-down"]{transform:translateY(-100%);}
[data-animation="slide-left"]{transform:translateX(-100%);}
[data-animation="slide-right"]{transform:translateX(100%);}
[data-animation="scale-up"]{transform:scale(0.8);}
[data-animation="fade-in"]{opacity:0;}
/* Коли в полі видимості */
[data-observe].in-view{opacity:1;transform:none;}
/* Анімаційна затримка */
[data-observe][data-delay]{transition-delay:var(--delay, 0s);}
/*********************************************/
/***** END UniversalInViewObserver *****/
/*********************************************/

/*********************************************/
/***** Counter BEGIN *****/
/*********************************************/
.counter-section{display:flex;flex-wrap:wrap;gap:40px;justify-content:center;padding:0 20px;text-align:center;}
.counter-item{position:relative;flex:1 1 160px;}
.counter{min-width:3ch;color:#000;font-size:5em;font-weight:800;}
.counter::before{content:"+";position:absolute;top:calc(25% - 16px);left:0;margin-left:4px;color:#44D62C;font-size:48px;}
.counter-label{font-size:16px;margin-top:8px;line-height:1.4;}
/*********************************************/
/***** END Counter *****/
/*********************************************/

/*********************************************/
/***** Counter BEGIN *****/
/*********************************************/
/* Сітка */
.v-industries{display:grid;grid-template-columns:1fr 1fr;gap:60px;vertical-align:middle;align-items:center;justify-content:center;}
/* Ліва колонка */
.v-tags{display:flex;flex-wrap:wrap;gap:10px;margin-top:1em;}
.v-tag{background:#F5F5F5;border:1px solid #DFDFDF;padding:6px 14px;border-radius:20px;cursor:pointer;font-size:14px;transition:all .2s ease;}
.v-tag.is-active{background:#44D62C;color:#FFF;border-color:#44D62C;}
/* Карусель */
.v-carousel{position:relative;width:400px;height:500px;perspective:1000px;}
.v-slide{position:absolute;top:50%;left:100%;width:100%;height:70%;opacity:0;transform:translate(-50%, -50%) scale(.8);transition:transform .6s ease, opacity .6s ease;z-index:0;}
.v-slide img{width:100%;height:100%;object-fit:cover;border-radius:16px;box-shadow:0 10px 25px rgba(0,0,0,.2);}
.v-slide.is-active{opacity:1;transform:translate(-50%, -50%) scale(1.25) rotateX(0deg);z-index:3;}
.v-slide.is-prev{opacity:.7;transform:translate(-50%, calc(-50% - 95%)) scale(.85) rotateX(45deg);z-index:2;}
.v-slide.is-next{opacity:.7;transform:translate(-50%, calc(-50% + 95%)) scale(.85) rotateX(-45deg);z-index:2;}
/*********************************************/
/***** END Counter *****/
/*********************************************/

/*********************************************/
/***** Анімована кнопка BEGIN *****/
/*********************************************/
.g-btn_shadow{background-color:transparent;border:1px solid rgba(255,255,255,0.25);color:#FFF;font-size:1.5em;transition:0.5s;}
.g-btn_shadow:hover{background-color:#44D62C;box-shadow:0 0 0 9px rgba(68,214,44,0.25);color:#FFF;}

/* From Uiverse.io by Cornerstone-04 */ 
.g-btn_orbit {
  width: 140px;
  height: auto;
  transition: .5s linear;
  position: relative;
  display: block;
  border-radius:9px;
  overflow: hidden;
  padding: 15px;
  text-align: center;
  margin: 0 5px;
  background: transparent;
  text-transform: uppercase;
  font-weight: 900;
}

.g-btn_orbit:before {
  position: absolute;
  content: '';
  left: 0;
  bottom: 0;
  height: 4px;
  width: 100%;
  border-bottom: 4px solid transparent;
  border-left: 4px solid transparent;
  box-sizing: border-box;
  transform: translateX(100%);
}

.g-btn_orbit:after {
  position: absolute;
  content: '';
  top: 0;
  left: 0;
  width: 100%;
  height: 4px;
  border-top: 4px solid transparent;
  border-right: 4px solid transparent;
  box-sizing: border-box;
  transform: translateX(-100%);
}

.g-btn_orbit:hover {
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5);
}

.g-btn_orbit:hover:before {
  border-color: #44D62C;
  height: 100%;
  transform: translateX(0);
  transition: .3s transform linear, .3s height linear .3s;
}

.g-btn_orbit:hover:after {
  border-color: #44D62C;
  height: 100%;
  transform: translateX(0);
  transition: .3s transform linear, .3s height linear .5s;
}
/*********************************************/
/***** END Counter *****/
/*********************************************/