html {
  height: 100%;
  margin: 0;
  padding: 0;
  max-width: 100%;
}

body {
  height: 100%;
  margin: 0;
  padding: 0;
  overflow-x: hidden;
  width: 100%;
}

/* Секция сотрудничества */
.cooperation-section {
  background: #f2f6ff; /* Светлый фон */
  padding: 3rem 0; /* Увеличенный отступ */
  color: #0a0f1b; /* Темный текст */
  text-align: center;
  position: relative;
  overflow: hidden;
}

.cooperation-section h1 {
  font-size: 4rem; /* Увеличенный размер */
  font-weight: 700;
  margin-bottom: 1.5rem;
  color: #0a0f1b; /* Темный текст */
}

.cooperation-section .subtitle {
  font-size: 18px;
  color: var(--primary-color);
  margin-top: 6rem;
  margin-bottom: 6rem;
}

.cooperation-section .cards {
  display: flex;
  justify-content: center;
  gap: 4rem;
  flex-wrap: nowrap;
  margin-bottom: 6rem;
}

.cooperation-section .card {
  background: #ffffff; /* Белый фон карточек */
  border-radius: 2rem; /* Увеличенный радиус */
  padding: 4rem; /* Увеличенный отступ */
  width: 100%;
  max-width: 600px; /* Увеличенная ширина */
  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1); /* Увеличенная тень */
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.cooperation-section .card:hover {
  transform: translateY(-10px);
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2); /* Увеличенная тень при наведении */
}

.cooperation-section .card-content {
  text-align: left;
}

.cooperation-section .card h2 {
  font-size: 3rem; /* Увеличенный размер */
  font-weight: 600;
  margin-bottom: 2rem; /* Увеличенный отступ */
  color: #0a0f1b; /* Темный текст */
}

.cooperation-section .card-description {
  font-size: 14px;
  color: #4a5568;
  margin-bottom: 2.5rem;
  display: grid;
  justify-content: start;
}

.cooperation-section .card-income {
  background: #0056fd; /* Синий фон для дохода */
  padding: 1.5rem; /* Увеличенный отступ */
  border-radius: 1rem; /* Увеличенный радиус */
  margin-bottom: 2.5rem; /* Увеличенный отступ */
  text-align: center;
  position: relative;
  overflow: hidden;
}

.cooperation-section .card-income::before {
  content: '';
  position: absolute;
  top: -50%;
  left: -50%;
  width: 200%;
  height: 200%;
  background: radial-gradient(circle, rgba(255, 255, 255, 0.2), transparent);
  transform: rotate(45deg);
  z-index: 1;
}

.cooperation-section .card-income .income-amount {
  font-size: 2rem; /* Увеличенный размер */
  font-weight: 700;
  color: #ffffff; /* Белый текст */
  display: block;
  position: relative;
  z-index: 2;
}

.cooperation-section .card-income .income-label {
  font-size: 1.2rem; /* Увеличенный размер */
  color: rgba(255, 255, 255, 0.8); /* Полупрозрачный белый текст */
  position: relative;
  z-index: 2;
}

.cooperation-section .card-list {
  list-style: none;
  padding: 0;
  margin-bottom: 2.5rem; /* Увеличенный отступ */
}

.cooperation-section .card-list li {
  font-size: 12px;
  margin-bottom: 1.2rem;
  position: relative;
  padding-left: 2rem;
  color: var(--primary-color);
}

.cooperation-section .card-list li::before {
  content: "✔";
  position: absolute;
  left: 0;
  color: #0056fd; /* Синий цвет галочки */
  font-size: 1.2rem; /* Увеличенный размер */
}

.section-button {
  display: inline-block;
  background: rgb(0, 86, 253);
  color: rgb(255, 255, 255);
  padding: 1.2rem 3rem;
  border-radius: 1.4rem;
  text-decoration: none;
  font-size: 1rem;
  transition: background 0.3s;
}

.section-button:hover {
  background: #004ad9;
}

.blur-ball {
  position: absolute;
  border-radius: 50%;
  filter: blur(120px); /* Увеличенный блюр */
  z-index: -1; /* Шары под контентом */
}

.ball-1 {
  width: 800px;
  height: 800px;
  background: radial-gradient(circle, rgba(0, 86, 253, 0.2), transparent);
  top: -400px;
  left: -400px;
}

.ball-2 {
  width: 900px;
  height: 900px;
  background: radial-gradient(circle, rgba(0, 86, 253, 0.2), transparent);
  bottom: -450px;
  right: -450px;
}

#connector.ball-2 {
  width: 300px; /* Увеличенный размер */
  height: 600px;
  background: radial-gradient(circle, rgba(0, 86, 253, 0.2), transparent);
  bottom: -300px;
  right: -300px;
}


@media (max-width: 768px) {
  .cooperation-section .cards {
    flex-direction: column;
    align-items: center;
    gap: 3rem; /* Увеличенный отступ */
  }

  .cooperation-section .card {
    max-width: 100%;
    padding: 3rem; /* Увеличенный отступ */
  }

  .cooperation-section h2 {
    font-size: 3rem; /* Увеличенный размер */
    display: flex;
    justify-content: center;
  }

  .cooperation-section .card h3 {
    font-size: 2.5rem;
    display: grid;
    justify-content: center;
}

  .cooperation-section .card-description {
    font-size: 1.2rem; /* Увеличенный размер */
  }

  .cooperation-section .card-list li {
    font-size: 1.1rem; /* Увеличенный размер */
  }
}