/* Общие стили фона с анимированными фигурами для всех страниц */

/* Основной фон */
.common-background {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: #f8fafc;
  z-index: -10;
}

/* Контейнер для анимированных фигур */
.common-background-shapes {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: -9;
}

/* Базовые стили для всех фигур */
.common-background .shape {
  position: absolute;
  border-radius: 50%;
  background: rgba(0, 106, 180, 0.05);
  animation: float 6s ease-in-out infinite;
}

/* Анимация плавания */
@keyframes float {
  0%, 100% { 
    transform: translateY(0px); 
  }
  50% { 
    transform: translateY(-20px); 
  }
}

/* Фигура 1 */
.common-background .shape-1 {
  width: 80px;
  height: 80px;
  top: 20%;
  left: 10%;
  animation-delay: 0s;
}

/* Фигура 2 */
.common-background .shape-2 {
  width: 120px;
  height: 120px;
  top: 60%;
  right: 10%;
  animation-delay: 2s;
}

/* Фигура 3 */
.common-background .shape-3 {
  width: 60px;
  height: 60px;
  bottom: 20%;
  left: 20%;
  animation-delay: 4s;
}

/* Фигура 4 */
.common-background .shape-4 {
  width: 40px;
  height: 40px;
  top: 40%;
  right: 30%;
  animation-delay: 1s;
}

/* Фигура 5 */
.common-background .shape-5 {
  width: 90px;
  height: 90px;
  bottom: 40%;
  right: 20%;
  animation-delay: 3s;
}

/* Фигура 6 */
.common-background .shape-6 {
  width: 30px;
  height: 30px;
  top: 80%;
  left: 40%;
  animation-delay: 5s;
}

/* Фигура 7 */
.common-background .shape-7 {
  width: 70px;
  height: 70px;
  top: 10%;
  right: 40%;
  animation-delay: 2.5s;
}

/* Фигура 8 */
.common-background .shape-8 {
  width: 50px;
  height: 50px;
  bottom: 10%;
  left: 60%;
  animation-delay: 1.5s;
}

/* Адаптивность для мобильных устройств */
@media (max-width: 768px) {
  .common-background .shape-1 {
    width: 60px;
    height: 60px;
  }
  
  .common-background .shape-2 {
    width: 90px;
    height: 90px;
  }
  
  .common-background .shape-3 {
    width: 45px;
    height: 45px;
  }
  
  .common-background .shape-4 {
    width: 30px;
    height: 30px;
  }
  
  .common-background .shape-5 {
    width: 70px;
    height: 70px;
  }
  
  .common-background .shape-6 {
    width: 25px;
    height: 25px;
  }
  
  .common-background .shape-7 {
    width: 55px;
    height: 55px;
  }
  
  .common-background .shape-8 {
    width: 40px;
    height: 40px;
  }
}