/* ==========================================================================
   Страница «Партнерам и инвесторам» (investor.html). Подключается после style.css.
   ========================================================================== */

/* --- Первый экран: крупный заголовок на фоне «единорога» ----------------- */

.colloborators {
  position: relative;
  padding: 98px 0 0;
  overflow: hidden;
  overflow: clip;
}

.colloborators__unicorn {
  position: absolute;
  top: -5px;
  left: 220px;
  z-index: -1;
  width: 929px;
  height: 885px;
}

.colloborators__title {
  width: 760px;
  margin: 0 0 218px;
  font-weight: 300;
  font-size: 120px;
  line-height: 104px;
  letter-spacing: -2px;
  color: var(--c-text);
}

/* На планшете и мобильном крупный заголовок и картинка скрыты, как в оригинале;
   h1 остаётся для поисковиков и экранных дикторов */
@media (max-width: 1199px) {
  .colloborators { padding-top: 47px; }
  .colloborators__unicorn { display: none; }
  .colloborators__title {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
  }
}
@media (max-width: 767px) {
  .colloborators { padding-top: 24px; }
}

/* --- Две группы: «Партнерам» и «Инвесторам» ------------------------------ */

.colloborators__features {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
}

.partner__features,
.investor__features { width: 664px; }
.investor__features { margin-left: auto; }

.partner__title,
.investor__title {
  margin: .83em 0 40px;
  font-weight: 700;
  font-size: 1.375rem;
  line-height: 1.625rem;
}

.columns--investor { margin: 0; flex-wrap: nowrap; }

.columns__item--invest {
  width: 200px;
  min-height: 210px;
  margin-right: 32px;
  padding: 0;
  box-shadow: 0 0 0 20px transparent;
  transition: background-color .4s, box-shadow .4s;
  outline: none;
}
.columns__item--invest:last-child { margin-right: 0; }

.columns__title--invest {
  font-weight: 400;
  font-size: 1.125rem;
  line-height: 1.5rem;
}

/* Селектор специфичнее общего .columns--icons p — 16px на всех ширинах, как в оригинале */
.columns__item .card__text--colloborators {
  max-width: none;
  font-weight: 400;
  font-size: 1rem;
  line-height: 1.5rem;
}

/* Десктоп: описание спрятано, при наведении/фокусе пункт раскрывается вместо заголовка */
@media (min-width: 1200px) {
  .columns--investor > .columns__item { margin-bottom: 40px; }

  .columns--icons .columns__item--invest svg { width: 39px; height: 39px; }

  .card__text--colloborators {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
  }

  .columns__item--invest:hover,
  .columns__item--invest:focus-visible {
    flex-grow: 1;
    background-color: var(--c-grey);
    box-shadow: 0 0 0 20px var(--c-grey);
  }
  .columns__item--invest:hover + li,
  .columns__item--invest:focus-visible + li { display: none; }
  .columns__item--invest:hover h3,
  .columns__item--invest:focus-visible h3 { display: none; }
  .columns__item--invest:hover .card__text--colloborators,
  .columns__item--invest:focus-visible .card__text--colloborators {
    position: static;
    width: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    clip: auto;
  }
}

@media (min-width: 1200px) and (max-width: 1439px) {
  .partner__features,
  .investor__features { width: calc(50% - 16px); margin-right: 32px; }
  .investor__features { margin-right: 0; }
  .columns__item--invest { width: 30.12%; margin-right: 4.82%; }
}

@media (max-width: 1199px) {
  .colloborators__features { display: block; margin-bottom: 80px; }
  .partner__features { width: 100%; margin-bottom: 80px; }
  .investor__features { width: 100%; margin-left: 0; }

  .partner__title,
  .investor__title { font-weight: 400; font-size: 40px; line-height: 50px; }

  .columns--investor { flex-wrap: wrap; }
  .columns__item--invest { width: 100%; max-width: 100%; margin-right: 0; min-height: 0; }
  .columns__title--invest { font-weight: 500; font-size: 1.25rem; line-height: 1.75rem; }
}

/* На планшете пункты — список с иконкой слева */
@media (min-width: 768px) and (max-width: 1199px) {
  .columns--investor { display: block; max-width: 880px; }
  .columns--investor.columns--icons .columns__item { position: relative; padding-left: 136px; margin-bottom: 56px; }
  .columns--investor.columns--icons .columns__item:last-child { margin-bottom: 0; }
  .columns--investor.columns--icons svg { position: absolute; top: 0; left: 0; }
}

@media (max-width: 767px) {
  .colloborators__features { margin-bottom: 40px; }
  .partner__features { margin-bottom: 40px; }
  .partner__title,
  .investor__title { margin-top: 0; margin-bottom: 24px; font-size: 28px; line-height: 39px; }
  .columns__title--invest { margin-bottom: 7px; font-size: .875rem; line-height: 1.1875rem; }
  .columns--investor.columns--icons .columns__item { display: block; }
}

/* --- Баннер «Инвестиции в России» ---------------------------------------- */

.investor__card--russia { color: var(--c-white); background-color: var(--c-navy); }
.investor__card-picture { margin: 0; }

@media (min-width: 1980px) {
  .cards-wrapper--investor-russia { background: var(--c-navy); }
}

/* --- Документы и контакты ------------------------------------------------ */

.investor__contact { padding: 80px 0 115px; }

.contact__list-links {
  margin: 0;
  padding: 0;
  font-size: 1.125rem;
  line-height: 1.5rem;
}

@media (max-width: 767px) {
  .investor__contact { padding: 32px 0 64px; }
}

/* --- Блок «Инвестиции за рубежом» (есть в английской версии) --- */

.investor__card:not(.investor__card--russia) { background-color: var(--c-grey); }
/* Фото слева, текст справа — в отличие от блока «Инвестиции в России» */
.investor__card-picture--abroad { order: -1; }

@media (min-width: 1980px) {
  .cards-wrapper--investor-abroad { background: linear-gradient(to right, transparent 75%, var(--c-grey) 75%); }
}