
/*Окно с видео в нижнем правом углу*/
.floating-video-container {
    position: fixed;   /* Фиксирует элемент относительно окна браузера */
    bottom: 20px;      /* Отступ от нижнего края */
    right: 20px;       /* Отступ от правого края */
    width: 400px;      /* Ширина окна с видео */
    z-index: 1000;     /* Чтобы видео было поверх других элементов */
    box-shadow: 0 4px 15px rgba(0,0,0,0.3); /* Тень для красоты */
    border-radius: 1rem;
    overflow: hidden;  /* Чтобы видео было с закругленными углами */
    background: #000;
    border:2px solid #fff;
    transition: transform 0.3s ease;
}

.floating-video {
    width: 100%;
    height: auto;
    display: block;
}

/*увеличение окна на 5%*/
.floating-video-link:hover .floating-video-container {
    border:3px solid #fd4600;
    transform: scale(1.05); /* Увеличение на 10% */
}

@media (max-width: 600px) {
    .floating-video-container {
        width: 150px; /* Уменьшите размер */
        bottom: 10px;
        left: 10px;
    }
}
/* Для всех SVG */
img[src$=".svg"] {
  width: auto;
  height: auto;
  max-width: 100%;
}

hr.dropdown-divider {
    height: 1px!important;
    background-color: #474972!important;
    border: 0;
}

.offcanvas-dark-backdrop::backdrop {
    background-color: rgba(50, 50, 50, 0.6) !important;
}


.section-hero {
    background: linear-gradient(#555555, #94a3b8),
      url('../images/bg_image.jpg'),
    url('../images/bg_stroki.png');
    background-repeat: no-repeat;
    background-position: top;
    background-size: cover!important;
  -webkit-text-size-adjust: 100%;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    background-blend-mode: overlay, screen; /* режим смешивания */
}

.section-setka {
    background: linear-gradient(#555555, #94a3b8),
    url('../images/bg_stroki.png');
    background-repeat: no-repeat;
    background-position: top;
    background-size: cover!important;
  -webkit-text-size-adjust: 100%;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    background-blend-mode: overlay, screen; /* режим смешивания */
}


/***Скрол***/

.scroll-line {
  position: fixed;      /* линия остаётся на месте при прокрутке */
  top: 0;
  right: 4px; /* отступ от правого края */
  transform: translateX(-50%); /* корректировка центра */
  width: 2px;
  height: 100vh;        /* высота на весь экран */
  background-color: #fff; /* белый цвет линии */
  z-index: 999;      /* чтобы линия была сверху всех элементов */
  overflow: hidden;     /* скрываем «оранжевую» часть до прокрутки */
}

.scroll-line::before {
content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 0;
  background-color: #fd4600; /* оранжевый цвет */
  transition: height 0.3s ease; /* плавное заполнение */
}
.diamond {
  position: absolute;
  bottom: -5px; /* смещение вниз за пределы линии */
  left: -4px; /* центрируем ромб */
  width: 10px;
  height: 10px;
  background-color: #fd4600; /* оранжевый ромб */
  transform: rotate(45deg); /* поворачиваем на 45° */
  z-index: 10000;
}
.scroll-line::before {
  height: var(--scroll-percent);
}

/****Картинка для кнопки****/
.with-icon {
  background-image: url('../images/with.svg'); 
    background-position: left top;
    background-repeat: no-repeat;
    padding-left: 58px;
    background-color: #fd4600;
    transition-property: background-position;
    transition-duration: 0.2s;
}

/* Дополнительно: эффект при наведении (опционально) */

.with-icon:hover {
  background-color: #cc3a17;
    background-position: -5px 5px;
    transition-property: background-position;
    transition-duration: 0.2s;
}

/*Анимация иконки*/
.icon-ani:hover {  
    /* Запустить анимацию встряхивания и сделать так, чтобы анимация длилась 0,5 секунды */  
    animation: shake 0.5s; 
} 

@keyframes shake {  
    0% { transform: translate(1px, 1px) rotate(0deg); }  
    10% { transform: translate(-1px, -2px) rotate(-1deg); }  
    20% { transform: translate(-3px, 0px) rotate(1deg); }  
    30% { transform: translate(3px, 2px) rotate(0deg); }  
    40% { transform: translate(1px, -1px) rotate(1deg); }  
    50% { transform: translate(-1px, 2px) rotate(-1deg); }  
    60% { transform: translate(-3px, 1px) rotate(0deg); }  
    70% { transform: translate(3px, 1px) rotate(-1deg); }  
    80% { transform: translate(-1px, -1px) rotate(1deg); }  
    90% { transform: translate(1px, 2px) rotate(0deg); }  
    100% { transform: translate(1px, -2px) rotate(-1deg); }  
}  

/***Cube***/
.cube {
  background-color: #fd4600;
  color: white;
  padding: 0.5rem;
  border: none;
  border-radius: 1px;
  width:10px;
  height:10px;
  margin:5px;
  cursor: pointer;
  animation: css-animation-glow 1.5s ease-in-out infinite alternate;
}
 
@keyframes css-animation-glow {
  0% {
    box-shadow: 0 0 5px #fff;
  }
  100% {
    box-shadow: 0 0 5px #fff, 0 0 10px #fff;
  }
}

/******/
@media (max-width:1200px) {
.bg-position-top-center {
    background-position: bottom right !important;
}
}
/**/
.head-title {
    font-size: clamp(2rem, 8vw, 3rem)!important;
}
/**/
.video-container {
  position: relative;
  width: 100%; /* или любая другая ширина */
  height: 100%; /* или auto, min-height и т.д. */
  overflow: hidden; /* обрезает лишнее */
  margin: 0 auto;
}

.video-bg {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  background: #0f172a;
  
  /* Обеспечивает покрытие всего контейнера */
  object-fit: cover;
  
  /* Для поддержки старых браузеров */
  z-index: -1;
}

.content {
  position: relative;
  z-index: 1;
  color: white;
  padding: 20px;
  text-align: center;
}

/* Адаптивность для мобильных устройств */
@media (max-width: 768px) {
  .video-container {
    height: 100%; /* Меньшая высота на мобильных */
  }
}

/*Эффекты для картинок*/

img.svg-icon {
  filter: hue-rotate(90deg); /* поворот цветового круга */
  filter: saturate(2);      /* насыщенность */
  filter: brightness(0.8);  /* яркость */
}

/*квадрат*/
/* From Uiverse.io by andrew-manzyk */ 
.dot-logo {
  --main-color: #fd4600;
  transform: scale(1); /* You can change the size */
  z-index: 999;
}

.dot-logo svg {
  width: 3rem;
  height: 3rem;
}

.dot-logo svg path:first-child {
  will-change: d;
  fill: var(--main-color);
  animation: morph 2s ease-in-out infinite;
}

.dot-logo svg path:not(:first-child) {
  fill: none;
  stroke: var(--main-color);
  stroke-width: 0;
}

.dot-logo svg path:nth-child(2) {
  animation: wave 2s linear infinite;
  animation-delay: 1.7s;
}

.dot-logo svg path:nth-child(3) {
  animation: wave 2s linear infinite;
  animation-delay: 0.3s;
}

.dot-logo svg path:nth-child(4) {
  animation: wave 2s linear infinite;
  animation-delay: 1s;
}

@keyframes wave {
  0% {
    stroke-width: 0;
    transform: scale(1) translateX(0px) translateY(0px);
    opacity: 0;
  }
  10% {
    stroke-width: 5;
    transform: scale(1.05) translateX(-2.25px) translateY(-2.25px);
    opacity: 0.3;
  }
  30% {
    stroke-width: 10;
    transform: scale(1.1) translateX(-4.5px) translateY(-4.5px);
    opacity: 0;
  }
  100% {
    stroke-width: 0;
    transform: scale(1) translateX(0px) translateY(0px);
    opacity: 0;
  }
}

@keyframes morph {
  0% {
    d: path(
      "M10,20 C10,17.24 11.12,14.74 12.93,12.93 L12.93,12.93 C14.74,11.12 17.24,10 20,10 L80,10 C82.76,10 85.26,11.12 87.07,12.93 L87.07,12.93 C88.88,14.74 90,17.24 90,20 L90,80 C90,82.76 88.88,85.26 87.07,87.07 L87.07,87.07 C85.26,88.88 82.76,90 80,90 L20,90 C17.24,90 14.74,88.88 12.93,87.07 L12.93,87.07 C11.12,85.26 10,82.76 10,80Z M68,50 C68,45.02 65.98,40.52 62.72,37.27 L62.72,37.27 C59.47,34.01 54.97,32 50,32 L50,32 C45.02,32 40.52,34.01 37.27,37.27 L37.27,37.27 C34.01,40.52 32,45.02 32,50 L32,50 C32,54.97 34.01,59.47 37.27,62.72 L37.27,62.72 C40.52,65.98 45.02,68 50,68 L50,68 C54.97,68 59.47,65.98 62.72,62.72 L62.72,62.72 C65.98,59.47 68,54.97 68,50Z"
    );
  }
  10% {
    d: path(
      "M10,20 C10,17.24 11.12,14.74 12.93,12.93 L12.93,12.93 C14.74,11.12 17.24,10 20,10 L80,10 C82.76,10 85.26,11.12 87.07,12.93 L87.07,12.93 C88.88,14.74 90,17.24 90,20 L90,80 C90,82.76 88.88,85.26 87.07,87.07 L87.07,87.07 C85.26,88.88 82.76,90 80,90 L20,90 C17.24,90 14.74,88.88 12.93,87.07 L12.93,87.07 C11.12,85.26 10,82.76 10,80Z M68,50 C68,45.02 65.98,40.52 62.72,37.27 L62.72,37.27 C59.47,34.01 54.97,32 50,32 L50,32 C45.02,32 40.52,34.01 37.27,37.27 L37.27,37.27 C34.01,40.52 32,45.02 32,50 L32,50 C32,54.97 34.01,59.47 37.27,62.72 L37.27,62.72 C40.52,65.98 45.02,68 50,68 L50,68 C54.97,68 59.47,65.98 62.72,62.72 L62.72,62.72 C65.98,59.47 68,54.97 68,50Z"
    );
  }
  33% {
    d: path(
      "M10,37.57 C10,34.92 11.05,32.37 12.92,30.5 L30.5,12.92 C32.37,11.05 34.92,10 37.57,10 L62.42,10 C65.07,10 67.62,11.05 69.49,12.92 L87.07,30.5 C88.94,32.37 90,34.92 90,37.57 L90,62.42 C90,65.07 88.94,67.62 87.07,69.49 L69.49,87.07 C67.62,88.94 65.07,90 62.42,90 L37.57,90 C34.92,90 32.37,88.94 30.5,87.07 L12.92,69.49 C11.05,67.62 10,65.07 10,62.42Z M68,50 C68,49.12 67.66,48.24 66.99,47.57 L52.42,33 C51.75,32.33 50.87,32 50,32 L50,32 C49.12,32 48.24,32.33 47.57,33 L33,47.57 C32.33,48.24 32,49.12 32,50 L32,50 C32,50.87 32.33,51.75 33,52.42 L47.57,66.99 C48.24,67.66 49.12,68 50,68 L50,68 C50.87,68 51.75,67.66 52.42,66.99 L66.99,52.42 C67.66,51.75 68,50.87 68,50Z"
    );
  }
  43% {
    d: path(
      "M10,37.57 C10,34.92 11.05,32.37 12.92,30.5 L30.5,12.92 C32.37,11.05 34.92,10 37.57,10 L62.42,10 C65.07,10 67.62,11.05 69.49,12.92 L87.07,30.5 C88.94,32.37 90,34.92 90,37.57 L90,62.42 C90,65.07 88.94,67.62 87.07,69.49 L69.49,87.07 C67.62,88.94 65.07,90 62.42,90 L37.57,90 C34.92,90 32.37,88.94 30.5,87.07 L12.92,69.49 C11.05,67.62 10,65.07 10,62.42Z M68,50 C68,49.12 67.66,48.24 66.99,47.57 L52.42,33 C51.75,32.33 50.87,32 50,32 L50,32 C49.12,32 48.24,32.33 47.57,33 L33,47.57 C32.33,48.24 32,49.12 32,50 L32,50 C32,50.87 32.33,51.75 33,52.42 L47.57,66.99 C48.24,67.66 49.12,68 50,68 L50,68 C50.87,68 51.75,67.66 52.42,66.99 L66.99,52.42 C67.66,51.75 68,50.87 68,50Z"
    );
  }
  66% {
    d: path(
      "M10,50 C10,38.95 14.48,28.95 21.72,21.72 L21.72,21.72 C28.95,14.48 38.95,10 50,10 L50,10 C61.05,10 71.05,14.48 78.28,21.72 L78.28,21.72 C85.52,28.95 90,38.95 90,50 L90,50 C90,61.05 85.52,71.05 78.28,78.28 L78.28,78.28 C71.05,85.52 61.05,90 50,90 L50,90 C38.95,90 28.95,85.52 21.72,78.28 L21.72,78.28 C14.48,71.05 10,61.05 10,50Z M63.72,39.7 C63.72,38.75 63.34,37.9 62.71,37.28 L62.71,37.28 C62.09,36.65 61.24,36.27 60.29,36.27 L39.7,36.27 C38.75,36.27 37.9,36.65 37.28,37.28 L37.28,37.28 C36.65,37.9 36.27,38.75 36.27,39.7 L36.27,60.29 C36.27,61.24 36.65,62.09 37.28,62.71 L37.28,62.71 C37.9,63.34 38.75,63.72 39.7,63.72 L60.29,63.72 C61.24,63.72 62.09,63.34 62.71,62.71 L62.71,62.71 C63.34,62.09 63.72,61.24 63.72,60.29Z"
    );
  }
  76% {
    d: path(
      "M10,50 C10,38.95 14.48,28.95 21.72,21.72 L21.72,21.72 C28.95,14.48 38.95,10 50,10 L50,10 C61.05,10 71.05,14.48 78.28,21.72 L78.28,21.72 C85.52,28.95 90,38.95 90,50 L90,50 C90,61.05 85.52,71.05 78.28,78.28 L78.28,78.28 C71.05,85.52 61.05,90 50,90 L50,90 C38.95,90 28.95,85.52 21.72,78.28 L21.72,78.28 C14.48,71.05 10,61.05 10,50Z M63.72,39.7 C63.72,38.75 63.34,37.9 62.71,37.28 L62.71,37.28 C62.09,36.65 61.24,36.27 60.29,36.27 L39.7,36.27 C38.75,36.27 37.9,36.65 37.28,37.28 L37.28,37.28 C36.65,37.9 36.27,38.75 36.27,39.7 L36.27,60.29 C36.27,61.24 36.65,62.09 37.28,62.71 L37.28,62.71 C37.9,63.34 38.75,63.72 39.7,63.72 L60.29,63.72 C61.24,63.72 62.09,63.34 62.71,62.71 L62.71,62.71 C63.34,62.09 63.72,61.24 63.72,60.29Z"
    );
  }
  100% {
    d: path(
      "M10,20 C10,17.24 11.12,14.74 12.93,12.93 L12.93,12.93 C14.74,11.12 17.24,10 20,10 L80,10 C82.76,10 85.26,11.12 87.07,12.93 L87.07,12.93 C88.88,14.74 90,17.24 90,20 L90,80 C90,82.76 88.88,85.26 87.07,87.07 L87.07,87.07 C85.26,88.88 82.76,90 80,90 L20,90 C17.24,90 14.74,88.88 12.93,87.07 L12.93,87.07 C11.12,85.26 10,82.76 10,80Z M68,50 C68,45.02 65.98,40.52 62.72,37.27 L62.72,37.27 C59.47,34.01 54.97,32 50,32 L50,32 C45.02,32 40.52,34.01 37.27,37.27 L37.27,37.27 C34.01,40.52 32,45.02 32,50 L32,50 C32,54.97 34.01,59.47 37.27,62.72 L37.27,62.72 C40.52,65.98 45.02,68 50,68 L50,68 C54.97,68 59.47,65.98 62.72,62.72 L62.72,62.72 C65.98,59.47 68,54.97 68,50Z"
    );
  }
}
