.speaking-club {
  align-items: center;
  justify-content: space-between;
  background-color: #dee6e8; /* Adjust background color as needed */
  gap: 5%;
  padding: 10.5% 5.6%;
  padding-bottom: 18rem;
  margin: 0 auto;
  margin-bottom: 0;
  box-sizing: inherit;
  position: relative;
}

.speaking-club .container {
  gap: 2.5%;
}

.speaker-image-container {
  align-self: flex-start; /* Выравнивание только этого элемента по верхнему краю */
  position: relative;
  /* width: 50%; */
  margin: 0 auto; /* Центрируем контейнер */
  margin-bottom: 2rem;
}

.speaker-image {
  width: 100%; /* Задаем ширину картинки 100% от ширины контейнера */
  height: auto; /* Высота будет установлена автоматически для сохранения пропорций */
}

.speaking-club h2 {
  font-family: "Exo 2", sans-serif;
  font-weight: 700;
  font-size: 3.8rem;
  margin-bottom: 2rem;
  position: relative;
  top: 4.5rem;
  left: 17rem;
  margin-top: -10rem;
}

.club-info p {
  font-size: 1.8rem;
  font-weight: 400;
  line-height: 2.5rem;
  margin-bottom: 2rem;
  padding-right: 1rem;
}

.club-info {
  align-self: flex-start; /* Выравнивание только этого элемента по верхнему краю */
  color: black; /* Adjust the color as needed */
  margin-top: 6rem;
}

.speaker-image-container,
.club-info {
  flex: 1 1 50%; /* Занимает 50% ширины родителя, но может сжиматься и растягиваться */
}

.highlighted-link {
  color: #5a808a; /* Задаём красный цвет для ссылки */
  text-decoration: none; /* Убираем подчёркивание ссылки, если необходимо */
}

/* Адаптация для средних экранов, например планшетов */
@media (max-width: 768px) {
  .speaker-image-container,
  .club-info {
    flex-basis: 100%; /* Каждый элемент займет 100% ширины родителя, становясь шириной в один столбец */
  }
  .speaking-club .container {
    flex-direction: column; /* Элементы будут располагаться в одном столбце, один за другим */
  }

  .speaking-club h2 {
    top: 0;
    left: 0;
    margin-top: 0;
  }

  .club-info {
    margin-top: 0;
  }
}

/* Адаптация для мобильных устройств */
@media (max-width: 480px) {
  .speaking-club h2 {
    font-size: 2.2rem; /* Уменьшенный размер шрифта для заголовка */
  }

  .club-info p {
    font-size: 1.5rem; /* Уменьшенный размер шрифта для описания */
  }

  .speaking-club {
    background-color: white; /* Adjust background color as needed */
    margin-bottom: 0;
    padding-bottom: 6rem;
  }
}