/* увеличение картинки при ховере */
.image-zoom {
    border-radius: 0px;
    overflow: hidden;
}
.image-zoom .tn-atom {
    border-radius: 0px;
    transition: transform 400ms ease-in-out;
}
.image-zoom:hover .tn-atom {
    transform: scale(110%);
}


/* Основной стиль водной кнопки */
.waterbutton {
  position: relative;
  z-index: 1;
  overflow: hidden;
  background: #003889; /* Начальный цвет кнопки */
  border: 1px solid #003889;
  transition: color 0.3s ease, box-shadow 0.3s ease;
}

/* Псевдоэлементы для всплеска */
.waterbutton:before,
.waterbutton:after {
  content: '';
  position: absolute;
  top: 30%;
  right: -50%;
  left: -50%;
  height: 0;
  padding-bottom: 200%; /* Радиус круга */
  border-radius: 35%; /* Закругляем кружки */
  z-index: -1;
  background: linear-gradient(25deg, #ffffff, rgba(255, 255, 255, 0)); /* Белый всплеск */
  transition: transform 1.25s ease;
}

/* Левый всплеск */
.waterbutton:before {
  transform: translate3d(-5%, 4.7em, 0) rotate(330deg);
}

/* Правый всплеск */
.waterbutton:after {
  transform: translate3d(5%, 4.7em, 0) rotate(0deg);
}

/* Эффект при наведении */
.waterbutton:hover, .waterbutton:focus {
  box-shadow: 0 0 30px rgba(255, 255, 255, 0.5); /* Добавляем тень */
}

.waterbutton:hover:before,
.waterbutton:focus:before,
.waterbutton:hover:after,
.waterbutton:focus:after {
  transform: translate3d(0, -2.5em, 0) rotate(180deg); /* Анимация всплеска */
}

/* эффект для кнопки "отправить запрос" */
.sendrequest {
  border: 1px solid #003889;
  box-shadow: inset 0 0 20px rgba(255, 255, 255, 0);
  background-color: #003889; /* Изначальный цвет кнопки */
  outline: 1px solid;
  outline-color: rgba(0, 56, 137, .5);
  outline-offset: 0px;
  text-shadow: none;
  transition: all 1000ms cubic-bezier(0.19, 1, 0.22, 1);
} 

.sendrequest:hover {
  border: 1px solid #003889; /* Синий бордер при наведении */
  background-color: #ffffff; /* Цвет кнопки становится белым */
  box-shadow: inset 0 0 20px rgba(0, 56, 137, 0.1), 0 0 20px rgba(0, 56, 137, 0.35); /* Внутреннее и внешнее свечение синего цвета */
  outline-color: rgba(0, 56, 137, 0); /* Убираем контур */
  outline-offset: 15px; /* Смещение контура */
  text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3); /* Чёрная тень текста с 30% прозрачности */
}