.growbtn {
  border-radius: 18px;
  background-clip: padding-box;
  -webkit-background-clip: padding-box;
  overflow: hidden;

  transition: transform 0.25s cubic-bezier(0.4, 0, 0.2, 1),
              box-shadow 0.25s cubic-bezier(0.4, 0, 0.2, 1);
  will-change: transform, box-shadow;
}

.growbtn:hover {
  transform: translateY(-3px); /* плавный подъём */
  box-shadow: 0 8px 15px rgba(0,0,0,0.2); /* парящая тень */
}

.growbtn:active {
  transform: translateY(-1px); /* чуть опускается при нажатии */
  box-shadow: 0 4px 8px rgba(0,0,0,0.15);
}



@keyframes floatUpDown {
  0%   { transform: rotate(15deg) translateY(0); }
  50%  { transform: rotate(15deg) translateY(-15px); }
  100% { transform: rotate(15deg) translateY(0); }
}

.float-square {
  animation: floatUpDown 6s ease-in-out infinite;
}


.nav-block img,
.nav-block {
  display: inline-block;              
  cursor: pointer;                  
  transition: transform 0.15s cubic-bezier(0.4, 0, 0.6, 1);
}


.nav-block:hover,
.nav-block img:hover {
  transform: scale(1.05);
}


.nav-block:active,
.nav-block img:active {
  transform: scale(0.95);
}


.scroll-mouse-wrapper {
  display: inline-block;
  animation: bounce 1.2s ease-in-out infinite;
}

@keyframes bounce {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-8px); /* поднимаем на 8px ровно посередине */
  }
}

/* Верхний квадрат — подпрыгивает вверх */
.top-square {
  animation: moveUp 1.5s ease-in-out infinite;
}

/* Нижний квадрат — подпрыгивает вниз */
.bottom-square {
  animation: moveDown 1.5s ease-in-out infinite;
}

/* Анимация для верхнего квадрата */
@keyframes moveUp {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-10px); } /* поднимается выше */
}

/* Анимация для нижнего квадрата */
@keyframes moveDown {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(10px); }  /* опускается ниже */
}

/* Плавное мигание круга */
.block-circle {
  animation: blink 2s ease-in-out infinite; /* 2 секунды — медленнее */
}

@keyframes blink {
  0%, 100% { opacity: 1; }
  50% { opacity: 0; }
}

.card-group {
  border-radius: 18px;                  /* твое скругление */
  overflow: hidden;                     /* обрезает лишнее */
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.card-group:hover {
  transform: scale(1.05);
  box-shadow: 0 10px 20px rgba(0,0,0,0.2);
}









