/* ==========================================================================
   Партнёрам — макет 1:2483 (1920×5159).

   Две собственные секции страницы:
     · «Модели сотрудничества» — Group 2315 (1:2501), три карточки с фото;
     · «Как стать партнёром»   — Group 2316 (1:2584), четыре шага.

   Блоки «Почему Арм-Гарант выбирают…» (1:2525) и CTA (1:2619) —
   общие, живут в front-why.css и front-cta.css.

   Вертикальный ритм страницы: между всеми секциями 190 px, это ровно
   `.section` из base.css (padding-block 95). Поэтому здесь используется
   `.section`, а не `.page-section` (у неё 64 px и ритм не сходится).
   ========================================================================== */

/* --- Модели сотрудничества -------------------------------------------------
   Заголовок 1:2502 центрирован (x=695, ширина 529 → центр 960), сетка
   1:2503 начинается на y=683, то есть через 48 после заголовка. */

.partners-models {
  /* От низа лида (1:2500 кончается на 449) до заголовка секции (577)
     в макете 128. У `.page-head` снизу 48 — добираем оставшиеся 80. */
  padding-top: 80px;
}

.partners-models__title {
  margin-bottom: var(--space-48);
  text-align: center;
}

/* Карточки 600×651 при контейнере 1840 → зазор 20. */
.partners-models__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

/* Карточка 1:2504: отступ 40, радиус 24, шаг между фото, текстом
   и кнопкой — 48.

   Высоту НЕ фиксируем и кнопки НЕ выравниваем по нижнему краю. В макете
   все три карточки одной высоты (651), но кнопка стоит сразу под текстом,
   поэтому у первой она на 28 px выше: 1:2510 y=503, 1:2517 и 1:2524 y=531
   (описание первой карточки на строку короче). Проверено по рендеру ноды
   1:2503 — ступенька видна и там. Не «чинить». */
.partners-model {
  display: flex;
  flex-direction: column;
  gap: var(--space-48);
  padding: 40px;
  border-radius: var(--radius-lg);
  background: var(--color-bg-soft);
}

/* Photo Section 1:2505 — 520×200, радиус 12, фото кадрируется по центру. */
.partners-model__photo {
  height: 200px;
  border-radius: var(--radius-md);
  overflow: hidden;
}

.partners-model__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Text content 1:2507 — заголовок и описание через 16. */
.partners-model__body {
  display: flex;
  flex-direction: column;
  gap: var(--space-16);
}

.partners-model__title {
  font-size: var(--fs-32);
  font-weight: var(--fw-medium);
  line-height: var(--lh-tight);
  letter-spacing: var(--ls-32);
}

.partners-model__text {
  font-size: var(--fs-20);
  font-weight: var(--fw-regular);
  line-height: var(--lh-loose);
  letter-spacing: var(--ls-20);
  color: var(--color-text-muted);
}

/* Submit button container 1:2510 растянут на всю ширину контента (520),
   поэтому кнопке нужен flex вместо inline-flex. */
.partners-model__btn {
  display: flex;
  width: 100%;
}

/* --- Как стать партнёром ---------------------------------------------------
   Заголовок 1:2585 по левому краю, ниже через 48 — Steps Container 1:2586:
   четыре колонки по 430 с зазором 40. */

.partners-how__title {
  margin-bottom: var(--space-48);
}

.partner-steps {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--gutter);
  align-items: start;
}

/* Шаг 1:2587 — без подложки и отступов: на белом фоне. */
.partner-step {
  display: flex;
  flex-direction: column;
  gap: var(--space-24);
}

/* Step Badge Row 1:2588 — кружок и пунктир по центру, зазор 16. */
.partner-step__badge {
  display: flex;
  align-items: center;
  gap: var(--space-16);
}

/* Number Circle 1:2589 — 56×56, цифра 20 Regular (не 32 и не Medium). */
.partner-step__num {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 56px;
  height: 56px;
  border-radius: var(--radius-pill);
  background: var(--color-brand);
  color: var(--color-text-invert);
  font-size: var(--fs-20);
  font-weight: var(--fw-regular);
  line-height: var(--lh-tight);
  letter-spacing: var(--ls-20);
}

/* Line 1:2591 — синий пунктир: штрих 5, пробел 3, шаг 8 (снято попиксельно
   с рендера ноды 1:2586, ряды заливки #4867BF идут 5 px через 3 px).
   border-style: dashed в Chrome даёт штрих 2/2, поэтому градиент. */
.partner-step__line {
  flex: 1 1 auto;
  height: 1px;
  background-image: repeating-linear-gradient(
    to right,
    var(--color-brand) 0 5px,
    transparent 5px 8px
  );
}

/* Step Content 1:2592 — заголовок и описание через 12. */
.partner-step__body {
  display: flex;
  flex-direction: column;
  gap: var(--space-12);
}

.partner-step__title {
  font-size: var(--fs-32);
  font-weight: var(--fw-medium);
  line-height: var(--lh-tight);
  letter-spacing: var(--ls-32);
}

.partner-step__text {
  font-size: var(--fs-20);
  font-weight: var(--fw-regular);
  line-height: var(--lh-loose);
  letter-spacing: var(--ls-20);
  color: var(--color-text-muted);
}

/* --- Ниже 1920 px ----------------------------------------------------------
   Мобильных кадров в макете нет, раскладка ниже — решение вёрстки. */

@media (max-width: 1200px) {
  .partners-models__grid { grid-template-columns: repeat(2, 1fr); }
  .partner-steps { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 900px) {
  .partners-models__grid { grid-template-columns: 1fr; }
}

@media (max-width: 700px) {
  .partners-models { padding-top: var(--space-48); }
  .partners-models__title,
  .partners-how__title { font-size: var(--fs-32); }
  .partners-model {
    gap: var(--space-24);
    padding: var(--space-24);
    /* Без min-width:0 колонка грида растягивается под неразрывный текст
       кнопки и карточка вылезает за контейнер. */
    min-width: 0;
  }
  /* Кнопка 24 px + круг 56 в карточку узкого экрана не влезает
     (контент 295 при 390) — на мобиле уменьшаем её. */
  .partners-model__btn {
    gap: var(--space-12);
    padding-left: var(--space-16);
    font-size: var(--fs-18);
  }
  .partners-model__btn .cta-btn__icon { width: 44px; height: 44px; }
  .partners-model__btn .cta-btn__icon svg { width: 26px; height: 26px; }
  .partner-steps { grid-template-columns: 1fr; }
  .partner-step__title { font-size: var(--fs-24); }
}

/* --- Телефон: размеры, не попавшие в блоки выше ---------------------------- */
@media (max-width: 700px) {
  .partners-model__title { font-size: var(--fs-24); letter-spacing: var(--ls-24); }
}
