/* ==========================================================================
   Блок «Партнёры» — flexible-content layout: partners
   Карта/точки/пины/анимация фиксированы (не редактируются из админки).
   Редактируемые поля: заголовок, текст, ссылка, цвет фона (через --p-bg).
   ========================================================================== */

.partners {
  --p-bg: #f3f1ef;
  --p-ink: #282828;
  --p-muted: #868686;
  --p-dot: #d8d8da;
  --p-bar-bg: #fff;
  --p-bar-ink: #323232;

  position: relative;
  background: var(--p-bg);
  margin-inline: 30px;
  margin-bottom: 40px;
  height: 750px;
  padding-block: 64px 0;
  overflow: hidden;
}

.partners__inner {
  width: min(100%, 1670px);
  margin-inline: auto;
}

.partners__head {
  text-align: center;
  max-width: 640px;
  margin-inline: auto;
  opacity: 0;
  transform: translateY(14px);
  transition: opacity .7s cubic-bezier(.16,1,.3,1), transform .7s cubic-bezier(.16,1,.3,1);
}
.partners.is-in .partners__head {
  opacity: 1;
  transform: none;
}

.partners__title {
  margin: 0;
  color: var(--p-ink);
  font-family: Prata, serif;
  font-size: clamp(1.75rem, .4882rem + 1.8868vw, 2.375rem);
  font-weight: 400;
  line-height: normal;
  text-wrap: balance;
}

.partners__text {
  margin: 20px auto 0;
  color: var(--p-muted);
  font-family: Inter, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 150%;
  max-width: 570px;
  text-wrap: pretty;
}

.partners__map-wrap {
  position: relative;
  width: 100%;
  max-width: 1556px;
  margin: 16px auto 0;
  aspect-ratio: 1556 / 757;

  opacity: 0;
  transform: scale(.96);
  transition:
    opacity .9s cubic-bezier(.16,1,.3,1) .15s,
    transform 1s cubic-bezier(.16,1,.3,1) .15s;
}
.partners.is-in .partners__map-wrap {
  opacity: 1;
  transform: scale(1);
}

.partners__map {
  position: absolute;
  inset: 0;
  border-radius: clamp(10px, 1.4vw, 22px);
  overflow: hidden;
  background: var(--p-bg);
}

.partners-map__dots {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
  color: var(--p-dot);
  will-change: opacity;
}
.partners-map__dots circle {
  fill: currentColor;
  opacity: 0;
  transform-box: fill-box;
  transform-origin: center;
  transform: scale(.15);
  transition: opacity .28s ease-out, transform .28s cubic-bezier(.22,1,.36,1);
  transition-delay: 0ms;
}
.partners__map.is-dotted .partners-map__dots circle {
  opacity: 1;
  transform: scale(1);
}
/* Задержка появления точек по 25 "бакетам" (расстояние от центра), вместо
   уникального transition-delay на каждый из 3357 кружков — тот же плавный
   волновой эффект, но браузеру заметно дешевле пересчитывать стили. */
.partners-map__dots circle.d0 { transition-delay: 0ms; }
.partners-map__dots circle.d1 { transition-delay: 35ms; }
.partners-map__dots circle.d2 { transition-delay: 71ms; }
.partners-map__dots circle.d3 { transition-delay: 106ms; }
.partners-map__dots circle.d4 { transition-delay: 142ms; }
.partners-map__dots circle.d5 { transition-delay: 177ms; }
.partners-map__dots circle.d6 { transition-delay: 212ms; }
.partners-map__dots circle.d7 { transition-delay: 248ms; }
.partners-map__dots circle.d8 { transition-delay: 283ms; }
.partners-map__dots circle.d9 { transition-delay: 319ms; }
.partners-map__dots circle.d10 { transition-delay: 354ms; }
.partners-map__dots circle.d11 { transition-delay: 390ms; }
.partners-map__dots circle.d12 { transition-delay: 425ms; }
.partners-map__dots circle.d13 { transition-delay: 460ms; }
.partners-map__dots circle.d14 { transition-delay: 496ms; }
.partners-map__dots circle.d15 { transition-delay: 531ms; }
.partners-map__dots circle.d16 { transition-delay: 567ms; }
.partners-map__dots circle.d17 { transition-delay: 602ms; }
.partners-map__dots circle.d18 { transition-delay: 638ms; }
.partners-map__dots circle.d19 { transition-delay: 673ms; }
.partners-map__dots circle.d20 { transition-delay: 708ms; }
.partners-map__dots circle.d21 { transition-delay: 744ms; }
.partners-map__dots circle.d22 { transition-delay: 779ms; }
.partners-map__dots circle.d23 { transition-delay: 815ms; }
.partners-map__dots circle.d24 { transition-delay: 850ms; }

.partners-pin {
  position: absolute;
  width: 3.79%; /* 59 / 1556 */
  transform: translate(-50%, -100%);
  transform-origin: bottom center;
  filter: drop-shadow(0 6px 10px rgba(20, 18, 14, .18));
  opacity: 0;
  pointer-events: none;
  transition: opacity .45s ease-out, transform .55s cubic-bezier(.34,1.56,.64,1);
}
.partners-pin__inner {
  transform: translateY(-16px) scale(.6);
  transition: transform .55s cubic-bezier(.34,1.56,.64,1);
  transition-delay: inherit;
}
.partners__map.is-pinned .partners-pin {
  opacity: 1;
  pointer-events: auto;
}
.partners__map.is-pinned .partners-pin .partners-pin__inner {
  transform: translateY(0) scale(1);
}
.partners-pin svg { display: block; width: 100%; height: auto; }
.partners-pin:hover .partners-pin__inner,
.partners-pin:focus-visible .partners-pin__inner {
  transform: translateY(-3px) scale(1.06) !important;
}

.partners__bar {
  display: block;
  position: absolute;
  left: 20px;
  right: 20px;
  bottom: 20px;
  z-index: 2;
  padding-block: 12px;
  background: var(--p-bar-bg);
  color: var(--p-bar-ink);
  font-family: "Basis Grotesque Pro", sans-serif;
  font-size: 14px;
  font-weight: 400;
  text-align: center;
  text-decoration: underline;
  text-underline-offset: 3px;
  transition: color .15s, background-color .15s;
}
.partners__bar:hover,
.partners__bar:focus-visible {
  color: #fff;
  background: #000;
}
.partners__bar:focus-visible {
  outline: 2px solid #000;
  outline-offset: -2px;
}

@media (max-width: 720px) {
  .partners {
    height: 450px; /* -40% от 750px */
    margin-inline: 20px; /* было 30px — на 10px шире с каждой стороны */
  }
  .partners__map-wrap { max-width: 100%; }
  .partners-pin { width: 8%; }
  /* прячем каждую 5-ю точку — на 20% меньше точек, меньше "каши" на мобильном */
  .partners-map__dots circle:nth-child(5n) { display: none; }
  .partners__text {
    font-size: 14px;
    padding-inline: 20px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .partners__head,
  .partners__map-wrap,
  .partners-map__dots circle,
  .partners-pin,
  .partners-pin__inner {
    transition-duration: .01ms !important;
    transition-delay: 0ms !important;
  }
}
