.glass-bg {
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);

  /* Градиент внутри шапки:
     - от 30% чёрного вверху
     - до прозрачности уже на 60% высоты
     - нижние 40% — полностью прозрачны */
  background: linear-gradient(
    to bottom,
    rgba(0, 0, 0, 0.3) 0%,
    rgba(0, 0, 0, 0)   60%,
    rgba(0, 0, 0, 0)   100%
  );

  border-radius: 12px;
  box-shadow: none !important;
}

.contact-btn .tn-atom {
  transition: transform 0.2s ease-in-out;
}
.contact-btn .tn-atom:hover {
  transform: scale(0.95);
}

.icontg .tn-atom {
  transition: transform 0.2s ease-in-out;
}
.icontg .tn-atom:hover {
  transform: scale(0.95);
}

.abus .tn-atom {
  transition: transform 0.2s ease-in-out;
}
.abus .tn-atom:hover {
  transform: scale(0.95);
}

.partnbtn .tn-atom {
  transition: transform 0.2s ease-in-out;
}
.partnbtn .tn-atom:hover {
  transform: scale(0.95);
}

.product .tn-atom {
  transition: transform 0.2s ease-in-out;
}
.product .tn-atom:hover {
  transform: scale(0.95);
}

.menu-zero {
  position: fixed !important;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 9999 !important;
}






::selection {
    /* укажи цвет выделения текста */
    background: #7a01ff;
}






@media screen and (min-width: 1201px) {
    ::-webkit-scrollbar-thumb {
        /* Укажи цвет скроллбара */
        background: #7a01ff;
        /* Укажи радиус скругления скроллбара */
        border-radius: 20px;
    }
    ::-webkit-scrollbar {
        /* Укажи ширину вертикального скроллбара */
        width: 5px;
        /* Укажи высоту горизонтального скроллбара */
        height: 5px;
        /* Укажи цвет фона под скроллбаром */
        background: #000000;
    }
}




/* 1) курсор… */
.arrow-left,
.arrow-right {
  cursor: pointer !important;
}

/* 2) transition на icon */
.arrow-icon {
  transition: transform 0.2s ease-out !important;
  transform-origin: center center !important;
  pointer-events: none !important;
}

/* 3) теперь — только соседний (+)  
   при hover по .arrow-left анимируется только первый .arrow-icon  
   при hover по .arrow-right — только второй */
.arrow-left:hover + .arrow-icon {
  transform: scale(0.9) !important;
}
.arrow-right:hover + .arrow-icon {
  transform: scale(0.9) !important;
}



/* 1) плавный переход у самой иконки */
.startstop img,
.startstop svg {
  transition: transform 0.2s ease-out !important;
  transform-origin: center center !important;
}

/* 2) курсор «рука» */
.videocorob,
.startstop {
  cursor: pointer !important;
}

/* 3) при hover на превью (если .startstop идёт после .videocorob) 
      и при hover на самой кнопке — уменьшаем иконку */
.videocorob:hover ~ .startstop img,
.videocorob:hover ~ .startstop svg,
.startstop:hover img,
.startstop:hover svg {
  transform: scale(0.9) !important;
}



/* Glass/blur для шэйпа contact-block */
.contact-block,
.contact-block .tn-atom {                 /* охватываем и сам элемент, и его «атом» */
  background: rgba(255, 255, 255, 0.2) !important;  /* 20% — как у тебя */
  backdrop-filter: blur(12px);            /* основной блюр (за шэйпом) */
  -webkit-backdrop-filter: blur(12px);    /* Safari */
  
  /* ↓ необязательные «красивости», можешь убрать/подправить */
  border-radius: 20px;
}


/* БЛЮР БЛОКА КОНТАКТЫ */

/* Glass/blur для шэйпа contact-block */
.panel-overlay,
.panel-overlay .tn-atom {                 /* охватываем и сам элемент, и его «атом» */
  background: rgba(255, 255, 255, 0.2) !important;  /* 20% — как у тебя */
  backdrop-filter: blur(20px);            /* основной блюр (за шэйпом) */
  -webkit-backdrop-filter: blur(12px);    /* Safari */
  
  /* ↓ необязательные «красивости», можешь убрать/подправить */
  border-radius: 25px;
  
}