/* О школе: "ТЦ "Метромолл", офис 415" - где проходят занятия.
   Макет: фреймы gEgC2 (десктоп 1440x628) и j1ejf (телефон 390x1196).
   Разметка - ab-kabinet.tpl + ab-kabinet-item.tpl. */

.ab-kabinet {
  background: var(--white);
  padding-block: 100px; /* дамп gEgC2 padding=[100,56] */
}

.ab-kabinet__wrap {
  display: flex;
  flex-direction: column;
  gap: var(--gap-section); /* 44 в дампе = токену */
}

.ab-kabinet__head {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 40px; /* дамп SDAUu */
}

.ab-kabinet__copy {
  display: flex;
  flex-direction: column;
  gap: 14px; /* дамп eM6sr */
}

.ab-kabinet__kicker {
  margin: 0;
  font-family: var(--font-body);
  font-weight: 700;
  font-size: var(--kicker);  /* 12 */
  line-height: 15px;        /* 12 x 1.21 */
  letter-spacing: var(--kicker-ls);
  color: var(--magenta-text);
}

.ab-kabinet__h2 {
  margin: 0;
  font-family: var(--font-head);
  font-weight: 800;
  font-size: var(--h2-sm);  /* 48 - дамп f8Dxbg */
  line-height: 55px;        /* 48 x 1.14 */
  letter-spacing: var(--h2-sm-ls);
  color: var(--ink);
}

.ab-kabinet__link {
  flex: none;
  display: flex;
  align-items: center;
  gap: 8px; /* дамп m5X66 */
  color: var(--ink);
  text-decoration: none;
  font-size: 15px;
  font-weight: 600;
  line-height: 18px; /* 15 x 1.21 */
}

.ab-kabinet__link .ico {
  width: 16px;
  height: 16px;
  color: var(--magenta-text);
}

.ab-kabinet__gallery {
  gap: 20px; /* дамп NEOOZ */
}

/* Обёртка фотографии - кнопка (нажатие открывает фото во весь экран).
   В base.css у кнопок уже снят весь собственный набор (поля, рамка, фон,
   шрифт, цвет), остаётся задать коробку: кнопка по умолчанию строчно-
   блочная и ставит содержимое по центру, а здесь нужен обычный блок во
   всю ячейку ряда. Указатель - "лупа", чтобы по виду курсора было
   понятно, что фотографию можно открыть. */
.ab-kabinet-item {
  display: block;
  width: 100%;
  text-align: left;
  cursor: zoom-in;
}

.ab-kabinet-item__img {
  display: block;
  width: 100%;
  height: 300px;
  object-fit: cover;
  border-radius: 8px; /* дамп M4J9Y/lTAlu/w1HKgb */
}

/* ─── Телефон (<= 860) ───────────────────────────────────────── */

@media (max-width: 860px) {
  .ab-kabinet {
    padding-block: var(--section-y-m); /* 52 = токену */
  }

  .ab-kabinet__head {
    flex-direction: column;
    align-items: flex-start;
    gap: 26px; /* дамп c9TTrr */
  }

  .ab-kabinet__kicker {
    font-size: 11px;
    line-height: 13px; /* 11 x 1.21 */
  }

  .ab-kabinet__h2 {
    font-size: 30px;
    line-height: 34px; /* 30 x 1.14 = 34,2 */
    letter-spacing: -0.9px;
  }

  .ab-kabinet__link {
    font-size: 14px;
    line-height: 17px; /* 14 x 1.21 */
  }

  .ab-kabinet__gallery {
    gap: 20px; /* дамп Eeswu - то же, что на компьютере */
  }

  .ab-kabinet-item__img {
    height: 290px;
    /* Дамп xPlqt/FmFTl/E3uamO на телефоне не задаёт cornerRadius -
       в отличие от десктопных M4J9Y/lTAlu/w1HKgb (8px), на телефоне
       радиус снят. */
    border-radius: 0;
  }
}