/* Эксперты. Figma: Ecsperty/pc 975:2046, Ecsperty/mb 975:2137.
   Значения — из .design/spec/ecsperty.md.
   line-height задан в px по высотам текстовых нод Figma: `normal` в браузере
   и в Figma расходится на 1–2px для 48/32/28/26px. */

.au-experts {
  margin-top: 97px; /* фото эксперта y=601 при низе H1 504 */
}

.au-experts .au-container {
  display: flex;
  flex-direction: column;
  gap: 108px; /* низ линии 1973 → фото второго эксперта 2081 */
}

/* Group 24 975:2049 / Group 25 975:2067 */
.au-expert {
  position: relative;
}

/* Group 23 975:2061 — колонка «имя + роль» центрирована по фото (44 сверху и снизу) */
.au-expert__head {
  display: flex;
  align-items: center;
  gap: 36px; /* 252 + 36 = 288 — левый край имени */
}

/* 975:2062 — radius 290 браузер сводит к 107, то есть к половине высоты */
.au-expert__photo {
  flex: none;
  width: 252px;
  height: 214px;
  border-radius: 290px;
  overflow: hidden;
}

.au-expert__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Group 22 975:2063 — 58 + 32 + 36 = 126 */
.au-expert__text {
  display: flex;
  flex-direction: column;
  gap: 32px;
  min-width: 0;
}

/* 975:2064 — Inter Semi Bold 48, Figma h 58.
   Без nowrap: в макете имя и так в одну строку, а ниже 1920 запрет переноса
   не давал блоку сжаться и имя уходило под обрез */
.au-expert__name {
  font-size: 48px;
  font-weight: 600;
  line-height: 58px;
}

/* 975:2066 — стиль P1/Auren: Inter Regular 20 / lh 36 */
.au-expert__role {
  font-size: 20px;
  line-height: 36px;
}

/* Frame 119 975:2050 — пункты на 72 ниже фото */
.au-expert .au-feature-list {
  margin-top: 72px;
}

/* Frame 103 975:2052 — первый пункт фиксированной ширины, содержимое по центру
   (маркер встаёт на x 13); от его ширины считается позиция второго пункта */
.au-expert .au-feature:first-child {
  width: 285px;
  justify-content: center;
}

/* Frame 26 975:2126 — кнопка у правого края колонки, по центру строки имени:
   y 640 = 601 + 39, центр 674 совпадает с центром имени.
   Абсолют осознанный: в DOM кнопка стоит после списка характеристик, потому что
   на mb (975:2183) она идёт именно там — под пунктами. На pc макет поднимает её
   в строку имени, то есть визуальный и логический порядок расходятся, и поток
   их одновременно выразить не может: перенос в `head` ломает mb-раскладку. */
.au-expert__cta {
  position: absolute;
  top: 39px;
  right: 0;
  width: 285px; /* текст 217 + падды 34 — фиксируем внешний бокс */
  padding: 16px 34px;
}

/* ─── Аккордеон ──────────────────────────────────────────────────────────
   Frame 85: открытая строка 975:2102, закрытая 975:2112. Состояние — нативный
   <details>, поэтому все различия описаны через [open]. */

.au-acc {
  margin-top: 72px; /* строка 1007 при низе пунктов 935 */
}

.au-acc__item {
  position: relative;
  border-bottom: 0 solid var(--au-hairline-dark);
}

/* Линии 975:2133–975:2135 — только под закрытыми строками. В потоке:
   83 + 13 + 1 = 97, следующая строка получает 14 → шаг строк 111,
   а низ последней строки совпадает с линией, поэтому общий отступ
   пагинации 96 даёт y 2900 */
.au-acc__item:not([open]) {
  padding-bottom: 13px;
  border-bottom-width: 1px;
}

.au-acc__item:not([open]) + .au-acc__item {
  margin-top: 14px;
}

/* Frame 85 — строка 1728 × 83 */
.au-acc__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 0;
  list-style: none; /* нативный маркер <summary> */
  cursor: pointer;
}

.au-acc__row::-webkit-details-marker {
  display: none;
}

/* Frame 81 975:2103 / текст 975:2104 — Inter Semi Bold 32, Figma h 39 */
.au-acc__title {
  flex: 1;
  padding: 10px 0;
  font-size: 32px;
  font-weight: 600;
  line-height: 39px;
}

/* 975:2114 — у закрытой строки заголовок 0.6 */
.au-acc__item:not([open]) .au-acc__title {
  opacity: 0.6;
}

/* Frame 82 975:2105 — бокс 48 × 48: иконка 28 × 28 с падом 10.
   Заливка ассета 975:2116 у закрытой строки — rgba(0,0,0,0.3) */
.au-acc__icon {
  flex: none;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  opacity: 0.3;
}

.au-acc__icon img {
  width: 28px;
  height: 28px;
}

/* 975:2106 — у открытой строки стрелка развёрнута и заливка без прозрачности.
   Поворот против часовой: стрелка смотрит вправо. По часовой она указывала
   влево, в пустое поле слева от заголовка. */
.au-acc__item[open] .au-acc__icon {
  transform: rotate(-90deg);
  opacity: 1;
}

/* 975:1430 — у Hover закрытой строки заголовок и стрелка без прозрачности.
   :focus-visible идёт парой: с клавиатуры строка иначе не отзывается */
.au-acc__row:hover .au-acc__title,
.au-acc__row:focus-visible .au-acc__title {
  opacity: 1;
}

.au-acc__row:hover .au-acc__icon,
.au-acc__row:focus-visible .au-acc__icon {
  opacity: 1;
}

/* Frame 86 975:2100 — панель: 30 сверху, 40 снизу, текст во фрейме с падом 10 */
.au-acc__panel {
  padding: 30px 0 40px;
}

/* 975:2101 — Inter Medium 16 / lh 23, ширина текстовой ноды 1570 */
.au-acc__panel p {
  max-width: 1570px;
  padding: 10px 0;
  font-size: 16px;
  font-weight: 500;
  line-height: 23px;
}

/* панель сертификатов: снизу 50 (низ 1826 → строка 1876) */
.au-acc__panel--certs {
  padding-bottom: 50px;
}

/* ─── Сертификаты ────────────────────────────────────────────────────────
   975:2122–975:2125 — ряд из карточек 348 × 487 с gap 24 (шаг 372).
   Состояния — компонент Sertificate 975:1406 (Hover 975:1409, Click 975:1412) */

.au-certs {
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
}

.au-cert {
  position: relative;
  display: block;
  flex: none;
  width: 348px;
  height: 487px;
  border-radius: 20px;
  overflow: hidden;
}

/* заполняет карточку только изображение сертификата: лупа задаёт свой размер */
.au-cert img:not(.au-cert__zoom) {
  width: 100%;
  height: 100%;
  object-fit: cover;
  /* скан кроится только снизу, как в макете (`h-[101.05%]` от верхнего края) */
  object-position: top;
}

/* Hover 975:1409 — наложение rgba(0,0,0,0.6) на всю карточку */
.au-cert::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.6);
  opacity: 0;
}

/* 975:1279 — лупа 72 × 72 по центру карточки (на PC это 138, 208) */
.au-cert__zoom {
  position: absolute;
  z-index: 1;
  left: calc(50% - 36px);
  top: calc(50% - 36px);
  width: 72px;
  height: 72px;
  opacity: 0;
}

.au-cert:hover::after,
.au-cert:focus-visible::after,
.au-cert:hover .au-cert__zoom,
.au-cert:focus-visible .au-cert__zoom {
  opacity: 1;
}

/* Click 975:1412 — то же наложение и opacity 0.5 на всю карточку */
.au-cert:active {
  opacity: 0.5;
}

/* ─── MB: 390px ──────────────────────────────────────────────────────────
   Frame 162 975:2142: колонка, gap 48. Кнопка уходит под пункты, стрелка
   аккордеона встаёт по центру первой строки заголовка. */

@media (max-width: 1023px) {
  .au-experts {
    margin-top: 72px; /* блок 328 при низе H1 256 */
  }

  .au-experts .au-container {
    gap: 72px; /* в MB-макете один эксперт; шаг взят как у строк аккордеона */
  }

  /* Frame 161 975:2143 */
  .au-expert__head {
    gap: 18px;
  }

  /* 975:2145 — кадр смещён к левому краю фотографии */
  .au-expert__photo {
    width: 105px;
    height: 139px;
  }

  .au-expert__photo img {
    object-position: left;
  }

  /* Frame 159 975:2146 — ширина 215, gap 24 */
  .au-expert__text {
    width: 215px;
    gap: 24px;
  }

  /* 975:2148 — Inter Semi Bold 26, Figma h 62 на две строки */
  .au-expert__name {
    font-size: 26px;
    line-height: 31px;
    white-space: normal;
  }

  /* 975:2150 — Inter Regular 18, Figma h 22 */
  .au-expert__role {
    font-size: 18px;
    line-height: 22px;
  }

  /* Frame 109 975:2151 — пункты на 48 ниже ряда с фото */
  .au-expert .au-feature-list {
    margin-top: 48px;
  }

  .au-expert .au-feature:first-child {
    width: auto;
  }

  /* Frame 26 975:2183 — кнопка под пунктами: y 898 при низе блока 851 */
  .au-expert__cta {
    position: static;
    margin-top: 47px;
  }

  /* 975:2170 — заголовок 1038 при низе кнопки 966 */
  .au-acc {
    margin-top: 72px;
  }

  /* на MB линий под строками нет, шаг строк — 72 от низа контента */
  .au-acc__item:not([open]) {
    padding-bottom: 0;
    border-bottom-width: 0;
  }

  .au-acc__item + .au-acc__item {
    margin-top: 72px;
  }

  .au-acc__row {
    padding: 0;
  }

  /* 975:2170 — Inter Semi Bold 28, Figma h 68 на две строки, ширина 303 */
  .au-acc__title {
    flex: none;
    width: 303px;
    padding: 0;
    font-size: 28px;
    line-height: 34px;
  }

  /* 975:2174 / 975:2176 — бокс 28 × 28. Бокс выходит на 5px в правое поле:
     у ассета есть внутренние поля, поэтому глиф закрытой стрелки упирается
     в 362.4, то есть в правый край контента 364.
     По вертикали ориентир — глиф, а не бокс: в макете он начинается на 14 от
     верха заголовка (Ecsperty 975:2176 глиф 3079 при заголовке 3065, FAQ
     975:2452 глиф 344 при заголовке 330), а внутри бокса глиф стоит на 9 —
     отсюда top 5. У повёрнутой стрелки макет держит центр на 1.25 выше
     (там своя рамка 18 × 28), общий бокс это отклонение сохраняет */
  .au-acc__icon {
    position: absolute;
    top: 5px;
    right: -5px;
    width: 28px;
    height: 28px;
  }

  /* на MB заливка стрелки 0.3 и у открытой строки (975:2174).
     Повёрнутая стрелка лежит в макете в своей рамке 18 × 28, и её центр стоит
     на 1.5 выше центра закрытой: 17.5 от верха заголовка у Ecsperty `975:2174`
     и 17.75 у FAQ `975:2464` против 18.5 и 19 у закрытых. Общий бокс 28 × 28
     даёт центр top + 14, поэтому у открытой строки top на 1.5 меньше */
  .au-acc__item[open] .au-acc__icon {
    top: 3.5px;
    opacity: 0.3;
  }

  /* 975:2173 — панель: 36 сверху, снизу ничего: шаг до следующей строки (72)
     задаёт margin-top самой строки, иначе отступ удваивается */
  .au-acc__panel {
    padding: 36px 0 0;
  }

  .au-acc__panel p {
    max-width: 329px;
    padding: 0;
  }

  .au-acc__panel--certs {
    padding-bottom: 0;
  }

  /* 975:2181 / 975:2182 — сертификаты колонкой, gap 24. Высота 473 — это
     348 × 487 в масштабе 338 / 348; у первой карточки в макете 474 (округление) */
  .au-certs {
    flex-direction: column;
  }

  /* макетные 338 при вьюпорте 390; уже 390 карточка сжимается,
     иначе выходит за гаттер (соотношение скана 5 : 7 держит высоту) */
  .au-cert {
    width: min(338px, 100%);
    aspect-ratio: 338 / 473;
    height: auto;
  }

  /* в MB-макете 975:2137 пагинации нет */
  .au-page--experts .au-pagination {
    display: none;
  }
}
