/* ==========================================================================
   partner.css — страница «Стать партнером» (раздел «Партнёрам»), /partneram.html.
   Десктоп-база — 1920 (макет Figma 2277:175399, файл jR9PxS2XRShc9gJb1ySWi4).
   Мобильных макетов у страницы НЕТ (проверено по всей странице «В верстку») —
   ступени ≤1919/≤1023/≤767 — наша адаптация по лесенке проекта (эталон
   поведения — accreditation.css).
   Переиспользует: arrival.css (arr-hero, crumbs), base.css (section-label),
   page-tabs.css (ptabs--flow). Здесь — только новые блоки и дельты.
   Всё скоупится под .pnr (на <main>), чтобы не спорить с чужим адаптивом.

   Пожелание бэкендера: в текстовых телах карточек НЕТ классов у элементов —
   чистые p (стилизуются контекстно: .pnr-benefit p, .pnr-status__body p).
   ========================================================================== */

/* без висячих слов */
.pnr .arr-hero__intro p,
.pnr-benefit p,
.pnr-status__body p,
.pnr-contacts__text p { text-wrap: pretty; }
.pnr-h2, .pnr-status__title { text-wrap: balance; }

/* ==========================================================================
   HERO — светлый, тёмный текст (Figma 2277:175412). Полоса табов и баннер
   во всю ширину окна (в макете article и section.arr-hero — x=0 w=1920),
   гасим гаттер контейнера отрицательным полем — как на «Аккредитации».
   ========================================================================== */
.pnr .ptabs--flow,
.pnr .arr-hero--pnr {
  margin-inline: calc(var(--gutter) * -1);
}

/* Контент героя: Figma 2277:175424 — x=88, низ 60 (314+246 при высоте 620),
   ширина 799. Колонка: label →30→ заголовок →16→ лид (label h12 + mb14 +
   gap16 = 42 — как в макете y42 у текстовой группы). */
.arr-hero--pnr .arr-hero__inner {
  top: auto;
  bottom: 60px;
  left: 88px;
  width: 799px;
  max-width: 799px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
}
.arr-hero--pnr .section-label {
  display: flex;
  margin-bottom: 14px;
}
.arr-hero--pnr .arr-hero__title {
  margin-top: 0;
  font: 400 64px/72px var(--font-display);
  text-transform: uppercase;
  color: var(--c-text);
}
.arr-hero--pnr .arr-hero__intro {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-top: 0;
  max-width: 799px;
  font: 400 18px/1.6 var(--font-text);
  color: var(--c-text);
}

/* ==========================================================================
   ЧТО ПОЛУЧАЕТ ПАРТНЕР — заголовок 48/56 + 5 карточек (ряд 2 + ряд 3).
   Figma 2277:175434: h2 → 40 → сетка; ряды gap 16.
   ========================================================================== */
.pnr-benefits { margin-top: 80px; }

.pnr-h2 {
  font: 400 48px/56px var(--font-display);
  text-transform: uppercase;
  color: var(--c-text);
}

.pnr-benefits__grid {
  margin-top: 40px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.pnr-benefits__row {
  display: flex;
  gap: 16px;
}

/* Карточка (Figma article): белая 50%, рамка line, r24, p48+рамка (=49 в
   макете), круг 115 + 24 + текст, вертикальное центрирование. */
.pnr-benefit {
  flex: 1 1 0;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 24px;
  padding: 48px;
  background: rgba(255, 255, 255, .5);
  border: 1px solid var(--c-line);
  border-radius: var(--r-24);
}
.pnr-benefit p {
  font: 400 18px/1.6 var(--font-text);
  color: var(--c-text);
}

/* Круглое фото: маска Figma = круг 115, исходник крупнее и смещён.
   Размер/сдвиг картинки — в % от круга (сняты с макета), чтобы при
   изменении диаметра на ступенях кадр не уезжал. */
.pnr-benefit__photo {
  position: relative;
  flex: none;
  width: 115px;
  height: 115px;
  border-radius: 50%;
  overflow: hidden;
}
.pnr-benefit__photo img {
  position: absolute;
  max-width: none;
  object-fit: cover;
}
/* Кадры по макету: (размер; смещение) в долях круга 115 */
.pnr-benefit--1 .pnr-benefit__photo img { width: 110.92%; height: 110.92%; left: -5.46%; top: -5.89%; }
.pnr-benefit--2 .pnr-benefit__photo img { width: 128.48%; height: 128.48%; left: -14.24%; top: -19.49%; }
.pnr-benefit--3 .pnr-benefit__photo img { width: 121.52%; height: 121.52%; left: -10.81%; top: -14.88%; }
.pnr-benefit--4 .pnr-benefit__photo img { width: 130.51%; height: 130.51%; left: -15.31%; top: -23.44%; }
.pnr-benefit--5 .pnr-benefit__photo img { width: 111.56%; height: 111.56%; left: -5.78%; top: -5.46%; }

/* ==========================================================================
   СТАТУСЫ ПАРТНЕРСТВА — 5 карточек-полос (Figma 2277:175514, gap 24).
   Карточка: коллаж-декор слева (абсолют, под контентом), заголовок 40/48
   шириной 539, тело в рамке r16 p32 — внутри ЧИСТЫЕ p (без классов).
   Паддинги макета 49/57 = рамка 1 + 48/56.
   ========================================================================== */
.pnr-status {
  margin-top: 80px;
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.pnr-status__card {
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: center;
  gap: 47px;
  padding: 48px 56px;
  background: rgba(255, 255, 255, .5);
  border: 1px solid var(--c-line);
  border-radius: var(--r-24);
}

/* Экспортированный срез коллажа уже содержит отражения и клип макета.
   Тянем на ВСЮ высоту карточки (в макете 2277:175514 коллаж от верха до низа,
   тело-плашка по центру): height:auto давал полосу по своему аспекту, и при
   ужатии до 437 (≤1919) низ карточки оставался пустым бежевым — на это и
   показывала Джулия. cover + left center: правый край (уходит в фон) обрезается
   незаметно, арки слева сохраняются. */
.pnr-status__collage {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 583px;
  height: 100%;
  object-fit: cover;
  object-position: left center;
}

.pnr-status__title {
  position: relative;
  z-index: 1;
  flex: none;
  width: 539px;
  font: 400 40px/48px var(--font-display);
  text-transform: uppercase;
  color: var(--c-text);
}
/* Переносы заголовков как в макете: ноды текста в Figma уже колонки 539
   («Титульный / партнер» и «Генеральный / партнер» — 2 строки, «Партнер /
   культурной / программы» — 3). Без ограничения браузер укладывал их
   в меньшее число строк. Сужаем ТЕКСТ паддингом (539 − ширина ноды макета),
   а не max-width — иначе сжалась бы сама колонка и тело уехало бы влево. */
.pnr-status__card:nth-child(1) .pnr-status__title { padding-right: 77px; }
.pnr-status__card:nth-child(2) .pnr-status__title { padding-right: 48px; }
.pnr-status__card:nth-child(4) .pnr-status__title { padding-right: 42px; }
/* «Форума» всегда на отдельной строке (по просьбе ревью — и на десктопе, и на
   1200, и в баннере): «Официальный / поставщик / Форума». */
.pnr-status__brk { display: inline; }

.pnr-status__body {
  position: relative;
  z-index: 1;
  flex: 1 1 0;
  min-width: 0;
  padding: 32px;
  border: 1px solid var(--c-line);
  border-radius: var(--r-16);
}
.pnr-status__body p {
  font: 400 16px/1.6 var(--font-text);
  color: var(--c-text);
}
.pnr-status__body p + p { margin-top: 8px; }

/* ==========================================================================
   КОНТАКТЫ — тёмная карта c-dark r24 с фоновым коллажем (запечённое
   затемнение в экспорте). Figma 2277:175566: label →24→ строка
   (текст 722 слева / почта справа).
   ========================================================================== */
.pnr-contacts { margin-top: 80px; }

.pnr-contacts__card {
  position: relative;
  overflow: hidden;
  padding: 48px 56px;
  border: 1px solid var(--c-dark);
  border-radius: var(--r-24);
  background: var(--c-dark);
}

.pnr-contacts__bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.pnr-contacts__inner {
  position: relative;
  z-index: 1;
}
/* В макете текст лейбла 18/1.6 (28.8), в base.css — 18/28: уточняем */
.pnr-contacts .section-label__text { line-height: 1.6; }

.pnr-contacts__row {
  margin-top: 24px;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 40px;
}

.pnr-contacts__text {
  max-width: 722px;
}
.pnr-contacts__text p {
  font: 400 16px/1.6 var(--font-text);
  color: var(--c-bg);
}

.pnr-contacts__mail {
  flex: none;
  display: flex;
  align-items: center;
  gap: 16px;
  color: #fff;
  text-decoration: none;
  font: 400 24px/32px var(--font-display);
  text-transform: uppercase;
}
.pnr-contacts__mail:hover { text-decoration: underline; text-underline-offset: 4px; }
.pnr-contacts__mail .icon {
  flex: none;
  width: 22px;
  height: 22px;
  fill: currentColor;
}

/* ==========================================================================
   ≤1440 — пропорциональная ступень (макет 1920 уменьшаем, эталон поведения —
   accreditation.css: значения не занижаем там, где их видит монитор 1920).
   ========================================================================== */
@media (max-width: 1919px) {
  .arr-hero--pnr .arr-hero__inner {
    top: auto;
    bottom: 60px;
    transform: none;
    left: 64px;
    width: 620px;
    max-width: 620px;
    gap: 14px;
  }
  .arr-hero--pnr .section-label { margin-bottom: 10px; } /* 10 + 14 = 24 */
  .arr-hero--pnr .arr-hero__title { margin-top: 0; font-size: 48px; line-height: 54px; }
  /* Ширина лида через vw: коллаж (скрипка/лавр) сдвигается влево вместе с
     сужением экрана, и текст лез на него. Цветная зона коллажа на уровне лида:
     1200 ≈ x596, 1440 дальше. 43vw держит запас: 1200 → 516 (кончается ~580,
     левее 596), 1440 → упирается в 620. */
  .arr-hero--pnr .arr-hero__intro { font-size: 16px; max-width: min(620px, 43vw); gap: 12px; }

  .pnr-benefits { margin-top: 64px; }
  .pnr-h2 { font-size: 32px; line-height: 40px; }
  .pnr-benefits__grid { margin-top: 32px; }
  .pnr-benefit { padding: 40px; gap: 20px; }
  .pnr-benefit p { font-size: 16px; }
  .pnr-benefit__photo { width: 96px; height: 96px; }

  .pnr-status { margin-top: 64px; gap: 20px; }
  .pnr-status__card { padding: 40px 48px; gap: 40px; }
  .pnr-status__collage { width: 437px; }
  .pnr-status__title { width: 420px; font-size: 32px; line-height: 40px; }
  .pnr-status__body { padding: 28px; }

  .pnr-contacts { margin-top: 64px; }
  .pnr-contacts__card { padding: 40px 48px; }
  .pnr-contacts .section-label__text { font-size: 16px; }
  .pnr-contacts__text { max-width: 640px; }
  .pnr-contacts__mail { font-size: 20px; line-height: 28px; }
}

/* ==========================================================================
   ≤1439 — статус-карточки в столбец. Row-лейаут (коллаж-абсолют на всю высоту)
   верен только на широком экране: на узком десктопе тело переносится на много
   строк, карточка растёт, и object-fit:cover раздувает коллаж до ~1.8× — арки
   «слипаются». Ниже 1440 уводим статус в столбец с коллажем-баннером, капнутым
   по высоте (max-height): на телефоне баннер помещается целиком (auto<cap), на
   планшете/узком десктопе — аккуратный срез с цветными арками, без зума.
   ========================================================================== */
/* ==========================================================================
   ≤1199 — статус-карточки в столбец. Row (коллаж-абсолют на всю высоту) держим
   до 1200 (горизонтальная композиция как на десктопе — просьба ревью). Ниже
   1200 — столбец: коллаж-баннер во ВСЮ ширину карточки, а заголовок НА баннере
   (как на десктопе title лежит на коллаже). Верх-лево всех коллажей светлый
   (яркость ~230), поэтому тёмный заголовок читается без подложки.
   ========================================================================== */
@media (max-width: 1199px) {
  .pnr-status { gap: 20px; }
  .pnr-status__card {
    --pnr-banner: 220px;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    padding: 0;
  }
  /* Коллаж — баннер во всю ширину карточки, ЗА заголовком */
  .pnr-status__collage {
    position: absolute;
    inset: 0 0 auto 0;
    width: 100%;
    height: var(--pnr-banner);
    object-fit: cover;
    object-position: left top;        /* светлый верх-лево под заголовок */
  }
  /* Заголовок — НА баннере; min-height = высота баннера, чтобы тело легло ниже */
  .pnr-status__title {
    position: relative;
    z-index: 1;
    width: auto;
    min-height: var(--pnr-banner);
    box-sizing: border-box;
    padding: 36px 40px 0;
  }
  /* сбрасываем row-паддинги переносов заголовка (nth-child) */
  .pnr-status__card:nth-child(1) .pnr-status__title,
  .pnr-status__card:nth-child(2) .pnr-status__title,
  .pnr-status__card:nth-child(4) .pnr-status__title { padding-right: 40px; }
  /* Тело — под баннером */
  .pnr-status__body { margin: 24px 40px 40px; }
}

/* ==========================================================================
   ≤1023 — планшет: hero в потоке, benefits/contacts в столбец. Статус уже в
   столбце (см. ≤1439); тут только паддинги под меньший экран.
   ========================================================================== */
@media (max-width: 1023px) {
  .arr-hero--pnr { height: auto; min-height: 360px; }
  /* Текст в макете лежит на светлой левой части коллажа — прижимаем кадр
     влево, чтобы тёмный текст не попадал на насыщенную зону (как на «Аккредитации»). */
  .arr-hero--pnr .arr-hero__img { object-position: left center; }
  .arr-hero--pnr .arr-hero__inner {
    position: relative;
    z-index: 1;
    top: auto;
    bottom: auto;
    transform: none;
    left: auto;
    right: auto;
    width: auto;
    max-width: none;
    padding: 40px 32px;
    gap: 14px;
  }
  .arr-hero--pnr .section-label { margin-bottom: 6px; } /* 6 + 14 = 20 */
  .arr-hero--pnr .arr-hero__title { margin-top: 0; font-size: 40px; line-height: 44px; }
  /* Планшет+мобилка: 52vw давал на 375 всего 195px (лид узкой колонкой при
     пустой светлой зоне справа — «растянуть текст»). Цветная зона коллажа на
     375 уходит за край (текст можно шире), на 600 ≈ x485, на 768 ≈ x577.
     min(520, 76vw): 375 → 285 (83% ширины, было 195), 600 → 456, 768+ → 520. */
  .arr-hero--pnr .arr-hero__intro { max-width: min(520px, 76vw); }

  .pnr-benefits { margin-top: 48px; }
  .pnr-h2 { font-size: 28px; line-height: 34px; }
  .pnr-benefits__grid { margin-top: 24px; }
  .pnr-benefits__row { flex-direction: column; }
  .pnr-benefit { padding: 32px; }

  /* столбец/баннер-с-заголовком заданы в ≤1199; тут только внешние отступы */
  .pnr-status { margin-top: 48px; gap: 16px; }

  .pnr-contacts { margin-top: 48px; }
  .pnr-contacts__card { padding: 32px; }
  .pnr-contacts__row { flex-direction: column; align-items: flex-start; gap: 24px; }
  .pnr-contacts__text { max-width: none; }
}

/* ==========================================================================
   ≤360 — узкая мобила. Табы и баннер по контейнеру (full-bleed гасим),
   как на «Аккредитации» (эталон — фреймы «Бронирование гостиниц 375w»).
   ========================================================================== */
@media (max-width: 767px) {
  .pnr .ptabs--flow,
  .pnr .arr-hero--pnr { margin-inline: 0; }

  .pnr .ptabs { margin-top: 24px; }
  .pnr .ptabs--flow + .arr-hero { margin-top: 10px; }

  .arr-hero--pnr { min-height: 300px; }
  .arr-hero--pnr .arr-hero__inner { padding: 24px 20px; gap: 12px; }
  .arr-hero--pnr .section-label { margin-bottom: 0; }
  .arr-hero--pnr .arr-hero__title { margin-top: 0; font-size: 30px; line-height: 34px; }
  .arr-hero--pnr .arr-hero__intro { font-size: 14px; gap: 12px; }

  .pnr-benefits { margin-top: 36px; }
  .pnr-h2 { font-size: 24px; line-height: 30px; }
  .pnr-benefits__grid { margin-top: 20px; gap: 12px; }
  .pnr-benefits__row { gap: 12px; }
  .pnr-benefit { padding: 20px; gap: 16px; }
  .pnr-benefit p { font-size: 14px; line-height: 20px; }
  .pnr-benefit__photo { width: 72px; height: 72px; }

  /* Мобилка: тот же баннер-с-заголовком (≤1199), но компактнее — ниже баннер,
     меньше паддинги, мельче заголовок/тело. «то же по мобилке» из ревью. */
  .pnr-status { margin-top: 36px; gap: 12px; }
  .pnr-status__card { --pnr-banner: 150px; }
  .pnr-status__title { font-size: 24px; line-height: 30px; padding: 24px 20px 0; }
  .pnr-status__card:nth-child(1) .pnr-status__title,
  .pnr-status__card:nth-child(2) .pnr-status__title,
  .pnr-status__card:nth-child(4) .pnr-status__title { padding-right: 20px; }
  .pnr-status__body { margin: 16px 20px 24px; padding: 20px; }
  .pnr-status__body p { font-size: 14px; line-height: 20px; }

  .pnr-contacts { margin-top: 36px; }
  .pnr-contacts__card { padding: 24px 20px; }
  .pnr-contacts__row { gap: 20px; }
  .pnr-contacts__text p { font-size: 14px; line-height: 20px; }
  /* Адрес почты Cochin 18px на 375 не влезал в карточку (303px контента) и
     обрезался клипом — 16px помещается целиком, без переноса. */
  .pnr-contacts__mail { font-size: 16px; line-height: 22px; gap: 10px; }
  .pnr-contacts__mail .icon { width: 20px; height: 20px; }
}