@charset "UTF-8";
/**
* @file persons.css
* @author восстановление clubber.ru
* @createDate 2016/12/07
* @version 2.0
*
* Стили раздела «Персоны» нового дизайна (/user/persons.php, /user/user.php).
*
* Правила .ro-button*, .filter-panel*, .breadcrumbs*, .section-header-actions,
* .table-places-* перенесены дословно из боевых
* /assets/templates/clubber/common.css и places.css (снимок архивной копии
* сайта, декабрь 2016) — в рабочей копии эти файлы обрезаны, а places.css
* вообще отсутствует, поэтому раздел держит свою копию стилей.
* .table-places-item красится рамкой вместо фоновой картинки i/div.gif,
* которой в рабочей копии нет.
*/

/* ------------------------------------------------------------------ */
/* buttons (боевой common.css)                                         */
/* ------------------------------------------------------------------ */
.ro-button {
  font-family: 'Proxima Nova';
  border: 2px solid #00aeef;
  border-radius: 4px;
  display: inline-block;
  padding: 6px 20px 5px;
  text-align: center;
  text-decoration: none;
  position: relative;
  background-color: #fff;
  font-size: 16px;
  cursor: pointer;
  color: #000;
  -webkit-transition: background-color .15s ease;
  -moz-transition: background-color .15s ease;
  -ms-transition: background-color .15s ease;
  -o-transition: background-color .15s ease;
  transition: background-color .15s ease;
}

.ro-button-cyan {
  color: #00aeef;
}

.ro-button-lightblue {
  background-color: #d0f2ff;
  border-color: #d0f2ff;
}

.ro-button-active,
.ro-button-highlight,
.ro-button:hover {
  color: #fff;
  border-color: #00aeef;
  background-color: #00aeef;
}

.ro-button[disabled],
.ro-button-disabled {
  opacity: .5;
  cursor: default;
}

.button {
  text-transform: uppercase;
  text-decoration: none;
  text-align: center;
  display: block;
}

/* ------------------------------------------------------------------ */
/* breadcrumbs + section header (боевой common.css)                   */
/* ------------------------------------------------------------------ */
.breadcrumbs {
  margin-bottom: 40px;
  text-transform: uppercase;
  font-size: 20px;
  font-family: 'Proxima Nova Condensed Bold';
}

.breadcrumbs-item {
  color: #000;
}

.breadcrumbs-divider:after {
  content: "/";
  margin: 0 8px;
}

span.breadcrumbs-item {
  color: #555;
}

.section-header-actions {
  float: right;
  margin-top: -8px;
}

.header-action {
  font-family: 'Proxima Nova Regular';
  font-size: 20px;
  font-style: normal;
  text-transform: none;
  color: #00aeef;
}

/* ------------------------------------------------------------------ */
/* filter panel (боевой common.css)                                    */
/* ------------------------------------------------------------------ */
.filter-panel-cnt {
  margin-bottom: 25px;
}

.filter-panel {
  position: relative;
}

.filter-panel-divider {
  border-bottom: 1px solid #d0d0d0;
}

.filter-panel-item {
  margin-right: 18px;
  margin-bottom: 20px;
}

.filter-panel-dropdown {
  position: absolute;
  display: inline-block;
  padding-top: 10px;
  z-index: 10;
  left: 0;
  top: 31px;
}

.filter-panel-dropdown-cnt {
  border-radius: 5px;
  border: 3px solid #00aeef;
  background-color: #fff;
  padding: 6px;

  min-width: 100px;
  min-height: 50px;
}

.filter-panel-dropdown-arrow-top {
  position: absolute;
  margin-left: 20px;
  top: 0;
  left: 0;
}

.filter-panel-dropdown-arrow-top:before {
  content: "";
  position: absolute;
  top: 2px;
  right: 0;

  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 8px 9px 8px;
  border-color: transparent transparent #00aeef transparent;
}

.filter-panel-dropdown-arrow-top:after {
  content: "";
  position: absolute;
  top: 6px;
  right: 2px;

  width: 0;
  height: 0;
  border-style: solid;
  border-width: 0 6px 7px 6px;
  border-color: transparent transparent #ffffff transparent;
}

.filter-panel-dropdown-col {
  display: inline-block;
  vertical-align: top;
}

.filter-panel-dropdown-col-item {
  padding: 7px 43px 7px 16px;
  cursor: pointer;
  white-space: nowrap;
}

.filter-panel-dropdown-col-item-count {
  color: #999;
  margin-left: 8px;
}

.filter-panel-dropdown-col-item-active,
.filter-panel-dropdown-col-item:hover {
  background-color: #00aeef;
  color: #fff;
  position: relative;
}

.filter-panel-dropdown-col-item-active .filter-panel-dropdown-col-item-count,
.filter-panel-dropdown-col-item:hover .filter-panel-dropdown-col-item-count {
  color: #fff;
}

.filter-panel-dropdown-col-item-active:after {
  content: "";
  background-image: url('i/s.png');
  background-position: -741px -22px;
  height: 20px;
  width: 20px;
  display: block;
  position: absolute;
  right: 12px;
  top: 5px;
}

.filter-panel-select {
  margin: 20px 16px;
  position: relative;
}

.filter-panel-select-input-cnt {
  border: 2px solid #00aeef;
  padding: 6px 10px 7px;
  border-radius: 3px;
  position: relative;
}

input.filter-panel-select-input {
  width: 99%;
  border: none;
  font-style: normal;
  font-family: 'Proxima Nova Regular';
  font-size: 16px;
}

input.filter-panel-select-input:-moz-placeholder,
input.filter-panel-select-input::-moz-placeholder {
  font-style: italic !important;
  opacity: 0.3;
}

input.filter-panel-select-input::-webkit-input-placeholder {
  font-style: italic !important;
  opacity: 0.3;
}

input.filter-panel-select-input:-ms-input-placeholder {
  font-style: italic !important;
  opacity: 0.3;
}

.filter-action {
  margin-bottom: -2px;
  margin-top: -5px;
}

/* ------------------------------------------------------------------ */
/* icons — дополнение к обрезанному common.css                         */
/* ------------------------------------------------------------------ */
.ico-tw-small {
  background-position: 0 0;
  width: 26px;
  height: 26px;
}

.ico-fb-small {
  background-position: -28px 0;
  width: 26px;
  height: 26px;
}

.ico-ok-small {
  background-position: -56px 0;
  width: 26px;
  height: 26px;
}

.ico-ig-small {
  background-position: -84px 0;
  width: 26px;
  height: 26px;
}

.ico-people2-darkgray {
  background-position: -148px -115px;
  width: 24px;
  height: 23px;
}

.ico-people-darkgray {
  background-position: -126px -115px;
  width: 20px;
  height: 22px;
}

.ico-panels-darkgray {
  background-position: -174px -115px;
  width: 24px;
  height: 25px;
}

.ico-phone-darkgray {
  background-position: -200px -115px;
  width: 24px;
  height: 24px;
}

.ico-point-darkgray {
  background-position: -226px -115px;
  width: 17px;
  height: 26px;
}

.ico-cancel {
  background-position: -56px -58px;
  width: 20px;
  height: 20px;
}

.ico-reload-cyan {
  background-position: -784px 0;
  width: 16px;
  height: 16px;
}

.ico-reload-white,
.ico-reload-white-hover-in:hover span {
  background-position: -784px -18px;
  width: 16px;
  height: 16px;
}

.ico-place-cyan-big {
  background-position: -141px -231px;
  width: 45px;
  height: 38px;
}

/* маленький бейдж типа персоны (icon-type из common.css — 62x62) */
.icon-type-small {
  width: 31px;
  height: 31px;
  background-size: 100% auto;
  background-position: 50% center;
  background-repeat: no-repeat;
  display: inline-block;
}

/* ------------------------------------------------------------------ */
/* лента быстрого фильтра по типам персон (.cb-person-ribbon)          */
/*                                                                     */
/* Кнопки-«таблетки» со счётчиком: свой вариант ленты, не копия         */
/* .cb-type-ribbon из афиши (там подчёркивание текста). Скругление,     */
/* мягкая тень, подъём при наведении и залитая активная кнопка.        */
/* ------------------------------------------------------------------ */
.cb-person-ribbon {
  margin: 0 0 18px;
  padding-bottom: 4px;
  font-size: 0;               /* убираем пробелы между inline-block */
}

/* лента типов и поле поиска персоны стоят в одну строку
   (разметка поля — общая, section_search.css подключён в шаблоне) */
.cb-person-toolbar {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}

.cb-person-toolbar .cb-person-ribbon {
  -webkit-box-flex: 1;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
}

.cb-person-toolbar .cb-sec-search {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
  margin-left: 0;
  margin-top: 2px;
}

@media (max-width: 900px) {
  .cb-person-toolbar .cb-sec-search { margin-top: 0; }
}

.cb-person-ribbon-item {
  display: inline-block;
  margin: 0 8px 10px 0;
  padding: 8px 15px 9px;
  border: 1px solid #d9e7ef;
  border-radius: 18px;
  background-color: #fff;
  color: #22333d;
  font-family: 'Proxima Nova';
  font-size: 15px;
  line-height: 1;
  text-decoration: none;
  white-space: nowrap;
  -webkit-transition: background-color .15s ease, border-color .15s ease,
                      color .15s ease, box-shadow .15s ease;
  -moz-transition: background-color .15s ease, border-color .15s ease,
                   color .15s ease, box-shadow .15s ease;
  transition: background-color .15s ease, border-color .15s ease,
              color .15s ease, box-shadow .15s ease;
}

.cb-person-ribbon-item:hover {
  border-color: #00aeef;
  color: #0099d2;
  background-color: #f4fbff;
  box-shadow: 0 2px 6px rgba(0,174,239, .18);
}

/* тип, которого в выбранном городе нет (счётчик 0): кнопка на месте, но
   приглушена — лента не «схлопывается» и сразу видно, что именно пусто.
   Активная кнопка всегда остаётся яркой: правила для неё идут ниже. */
.cb-person-ribbon-item-empty:not(.cb-person-ribbon-item-active) {
  border-color: #e7eef2;
  background-color: #fbfdfe;
  color: #a3b5bf;
  box-shadow: none;
}

.cb-person-ribbon-item-empty:not(.cb-person-ribbon-item-active):hover {
  border-color: #bcd9e9;
  background-color: #f6fbfe;
  color: #7d97a5;
  box-shadow: none;
}

.cb-person-ribbon-item-active,
.cb-person-ribbon-item-active:hover {
  border-color: #00aeef;
  background-color: #00aeef;
  color: #fff;
  box-shadow: 0 2px 8px rgba(0,174,239, .35);
}

.cb-person-ribbon-count {
  display: inline-block;
  min-width: 20px;
  margin-left: 8px;
  padding: 2px 6px 3px;
  border-radius: 10px;
  background-color: #eaf8fd;
  color: #6c8b9c;
  font-family: 'Proxima Nova Regular';
  font-size: 12px;
  text-align: center;
  vertical-align: 1px;
}

.cb-person-ribbon-item:hover .cb-person-ribbon-count {
  background-color: #dceffb;
  color: #0099d2;
}

.cb-person-ribbon-item-empty:not(.cb-person-ribbon-item-active) .cb-person-ribbon-count,
.cb-person-ribbon-item-empty:not(.cb-person-ribbon-item-active):hover .cb-person-ribbon-count {
  background-color: #f1f6f8;
  color: #b6c6ce;
}

.cb-person-ribbon-item-active .cb-person-ribbon-count {
  background-color: rgba(255, 255, 255, .28);
  color: #fff;
}

/* ------------------------------------------------------------------ */
/* список персон (.table-places из боевого places.css)                 */
/* ------------------------------------------------------------------ */
.table-places-item {
  display: table;
  width: 100%;
  padding: 40px 0 20px;
  border-bottom: 1px solid #d0d0d0;
}

.table-places-item:last-child {
  border-bottom: none;
}

.table-places-item-left-cell {
  width: 66.6%;
}

.table-places-item-middle-cell {
  width: 11.1%;
}

.table-places-item-right-cell {
  width: 22.2%;
}

.table-places-item-image {
  float: left;
  margin-right: 20px;
  width: 140px;
  height: 140px;
  display: block;
  overflow: hidden;
}

.table-places-item-image img {
  width: 100%;
  min-height: 100%;
  display: block;
}

.table-places-item-data-cnt {
  padding-left: 160px;
}

.table-places-item-header-cnt {
  display: table;
  width: 100%;
}

.table-places-item-header-left-cnt {
  float: left;
}

.table-places-item-type {
  display: table;
  font-family: "Proxima Nova";
  font-size: 16px;
  color: #555;
  margin-bottom: 5px;
  line-height: 1.15;
}

.table-places-item-type .icon-type-small {
  display: table-cell;
  vertical-align: middle;
  padding-right: 10px;
}

.table-places-item-type-name {
  display: table-cell;
  vertical-align: middle;
}

.table-places-item-name {
  font-family: "Proxima Nova";
  font-weight: 700;
  font-size: 20px;
  text-transform: uppercase;
}

.table-places-item-name a {
  color: #000;
}

.table-places-item-name a:hover {
  color: #00aeef;
}

.table-places-item-header-right-cnt {
  float: right;
}

.table-places-item-count {
  display: inline-block;
  margin-right: 10px;
}

.table-places-item-count:last-child {
  margin-right: 0;
}

.table-places-item-count a {
  color: #555;
  text-decoration: none;
}

.table-places-item-count a:hover {
  color: #00aeef;
}

.table-places-item-descript {
  margin-top: 15px;
}

.table-places-item-descript p {
  color: #555;
  line-height: 20px;
  margin-bottom: 10px;
}

.table-places-item-readmore-link {
  color: #555;
}

.table-places-item-readmore-link:hover {
  color: #00aeef;
}

.table-places-item-info-blk {
  vertical-align: middle;
}

.table-places-item-info-ico {
  width: 27px;
  min-height: 1px;
  margin-right: 10px;
  float: left;
}

.table-places-item-info-data {
  display: table-cell;
  height: 27px;
  padding-bottom: 14px;
  vertical-align: middle;
  font-size: 18px;
  line-height: 1.25;
}

.table-places-item-info-data,
.table-places-item-info-data a {
  color: #555;
}

.table-places-item-info-data a:hover {
  color: #00aeef;
}

/* заглушка, если аватара нет вовсе */
.table-places-item-image-empty {
  background-color: #f5f5f5;
  background-image: url('i/types/boy.png');
  background-position: 50% center;
  background-repeat: no-repeat;
  background-size: 62px auto;
}

/* ------------------------------------------------------------------ */
/* «Загрузить еще»                                                     */
/* ------------------------------------------------------------------ */
.persons-more-cnt {
  text-align: center;
  margin-top: 40px;
}

.persons-loader {
  text-align: center;
  padding: 20px 0;
  color: #555;
  font-size: 16px;
}

.persons-empty {
  padding: 60px 0;
  text-align: center;
  color: #555;
  font-size: 20px;
}

#personsTotal {
  color: #999;
  font-size: 16px;
  font-family: 'Proxima Nova Regular';
  text-transform: none;
  margin-left: 15px;
}

/* ------------------------------------------------------------------ */
/* профиль персоны (/user/user.php)                                    */
/* ------------------------------------------------------------------ */
.user-profile-cnt {
  display: table;
  width: 100%;
}

.user-profile-left {
  width: 300px;
  padding-right: 30px;
}

.user-profile-right {
  width: 100%;
}

.user-profile-avatar {
  width: 300px;
  height: 300px;
  overflow: hidden;
  background-color: #f5f5f5;
  margin-bottom: 20px;
}

.user-profile-avatar img {
  width: 100%;
  display: block;
}

.user-profile-type {
  display: table;
  font-family: "Proxima Nova";
  font-size: 18px;
  color: #555;
  margin-bottom: 15px;
}

.user-profile-type .icon-type-small {
  display: table-cell;
  vertical-align: middle;
  padding-right: 10px;
}

.user-profile-info {
  font-size: 18px;
  line-height: 1.3;
  color: #555;
  margin-bottom: 20px;
}

.user-profile-info-row {
  margin-bottom: 8px;
}

.user-profile-info-label {
  color: #999;
}

.user-profile-about {
  font-size: 18px;
  line-height: 1.5;
  color: #555;
}

.user-profile-actions {
  margin-top: 25px;
}

.user-profile-actions .ro-button {
  margin-right: 10px;
  margin-bottom: 10px;
}

.user-profile-section {
  margin-top: 50px;
}

.user-profile-section-title {
  font-family: 'Proxima Nova Condensed Bold';
  font-size: 24px;
  text-transform: uppercase;
  border-bottom: 2px solid #d0d0d0;
  padding-bottom: 10px;
  margin-bottom: 25px;
}

.user-profile-counters {
  margin-bottom: 5px;
}

.user-profile-counter {
  display: inline-block;
  min-width: 110px;
  margin-right: 25px;
  margin-bottom: 15px;
  color: #555;
  font-size: 16px;
}

.user-profile-counter-value {
  display: block;
  font-family: 'Proxima Nova Bold';
  font-size: 32px;
  color: #000;
  line-height: 1.1;
}

.user-profile-counter a {
  color: #000;
}

.user-profile-counter a:hover {
  color: #00aeef;
}

/* афиша в профиле */
.user-profile-afisha-item {
  display: table;
  width: 100%;
  padding: 20px 0;
  border-bottom: 1px solid #d0d0d0;
}

.user-profile-afisha-item:last-child {
  border-bottom: none;
}

.user-profile-afisha-date {
  display: table-cell;
  width: 130px;
  vertical-align: top;
  font-family: 'Proxima Nova Condensed Bold';
  font-size: 20px;
  text-transform: uppercase;
  color: #000;
}

.user-profile-afisha-body {
  display: table-cell;
  vertical-align: top;
  color: #555;
  font-size: 18px;
  line-height: 1.35;
}

/* друзья/поклонники в профиле */
.user-profile-people {
  overflow: hidden;
}

.user-profile-person {
  float: left;
  width: 140px;
  margin-right: 20px;
  margin-bottom: 20px;
}

.user-profile-person-image {
  display: block;
  width: 140px;
  height: 140px;
  overflow: hidden;
  margin-bottom: 10px;
  background-color: #f5f5f5;
  background-image: url('i/types/boy.png');
  background-position: 50% center;
  background-repeat: no-repeat;
  background-size: 62px auto;
}

.user-profile-person-image img {
  width: 100%;
  display: block;
}

.user-profile-person-name {
  color: #000;
  text-align: center;
}

.user-profile-person-name:hover {
  color: #00aeef;
}

/* отзывы в профиле */
.user-comment-item {
  display: table;
  width: 100%;
  padding: 20px 0;
  border-bottom: 1px solid #d0d0d0;
}

.user-comment-item:last-child {
  border-bottom: none;
}

.user-comment-avatar {
  display: table-cell;
  width: 72px;
  vertical-align: top;
}

.user-comment-avatar img {
  width: 72px;
  height: 72px;
  display: block;
}

.user-comment-body {
  display: table-cell;
  vertical-align: top;
  padding-left: 20px;
}

.user-comment-head {
  margin-bottom: 8px;
}

.user-comment-author {
  color: #000;
  font-family: 'Proxima Nova Bold';
}

.user-comment-author:hover {
  color: #00aeef;
}

.user-comment-date {
  color: #999;
  font-size: 14px;
  margin-left: 10px;
}

.user-comment-text {
  color: #555;
  font-size: 18px;
  line-height: 1.4;
}

/* ==========================================================================
   PERSONA-LAYOUT (23.09.2026): страница персоны по макету Дизайна 4 —
   «15_Persona.jpg» (вид наблюдателя) и «11_News.jpg» (вид владельца).

   Раскладка: широкая обложка 1172 × 364 (аватар с кнопками слева + типовое
   тематическое изображение по типу персоны), ниже две колонки — левая 270 px
   (меню раздела, краткая информация, «Поделиться», друзья, поклонники) и
   правая (блоки страницы). Акцент #00aeef, кнопки 35 px — как в эталоне
   (assets/templates/clubber/common.css, раздел ДИЗАЙН-ЭТАЛОН-1).

   Линейное меню раздела (.cb-pmenu) убрано по решению владельца: «Делаем меню
   Персоны слева. Так симпатичнее» — вернулись к макетному .cb-side.
   ========================================================================== */

/* --- левое меню страницы персоны (макет: панель 270 px, #d0f2ff) --------- */
.cb-side {
  width: 270px;
  background-color: #d0f2ff;
  list-style: none;
  margin: 0 0 30px;
  padding: 0;
}

.cb-side li { border-bottom: 1px solid #ffffff; }
.cb-side li:last-child { border-bottom: 0; }

.cb-side a {
  display: block;
  padding: 15px 22px;
  font-family: 'Proxima Nova Regular';
  font-size: 16px;
  line-height: 20px;
  color: #000;
  text-decoration: none;
}

.cb-side a:hover { background-color: #eaf8fd; }

.cb-side li.cb-side-active a,
.cb-side li.cb-side-active a:hover {
  background-color: #00aeef;          /* активный пункт — плашка акцентом */
  color: #ffffff;
}

/* подпись группы пунктов («Моя страница», «На странице») */
.cb-side-group {
  padding: 9px 22px 7px;
  background-color: #bfe7f8;
  border-bottom: 0;
  font-family: 'Proxima Nova Condensed Bold';
  font-size: 13px;
  letter-spacing: .02em;
  text-transform: uppercase;
  color: #0b6f96;
}

.cb-side-badge {
  display: inline-block;
  float: right;
  min-width: 22px;
  height: 22px;
  padding: 0 6px;
  border-radius: 11px;
  background-color: #f24841;          /* бейдж-счётчик из макета */
  color: #ffffff;
  font-size: 13px;
  line-height: 22px;
  text-align: center;
}

/* две колонки страницы: меню 270 px + контент */
/* PERSONA-MENU-1 (24.09.2026). Владислав: «На странице Персоны. Надо починить
   размер меню блока слева по ширине. Я показал красной рамкой. Проверь в Макете.»
   Причина: таблица работала в автоматическом режиме (`table-layout: auto`), а у
   правой колонки стояла ширина `100%` — браузер сам делил 1170 px между
   колонками и сжимал левую до 105 px: имя персоны ломалось на две строки, строки
   вроде «Род деятельности» переносились. По макету Persona.psd
   (_design_src/ЭТАЛОН_элементов.md, стр. 134: «Левая колонка меню — 270 px,
   x = 134…404») левая колонка равна по ширине фото персоны — 270 px от левого
   края. Ставим жёсткий режим таблицы: левая колонка ровно 300 px вместе с
   отступом 30 px (то есть 270 px контента, как фото), остальное забирает
   правая колонка. */
.cb-side-cnt { display: table; width: 100%; table-layout: fixed; }
.cb-side-cnt .cb-side-cell {
  display: table-cell;
  width: 300px;
  box-sizing: border-box;
  vertical-align: top;
  padding-right: 30px;
}
.cb-side-cnt .cb-side-body { display: table-cell; width: auto; vertical-align: top; }

/* --- шапка страницы: аватар, кнопки и широкое изображение ---------------- */
.cb-cover {
  position: relative;
  width: 1172px;
  max-width: 100%;
  height: 364px;
  overflow: hidden;
  margin-bottom: 40px;
  background-color: #0e0c14;          /* тёмная подложка под изображением */
}

.cb-cover-img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 40%;
}

/* затемнение под текстом: имя и сведения читаются на любом изображении */
.cb-cover-shade {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background: -webkit-linear-gradient(top, rgba(14,12,20,.78) 0, rgba(14,12,20,.14) 45%, rgba(14,12,20,.62) 100%);
  background: linear-gradient(180deg, rgba(14,12,20,.78) 0, rgba(14,12,20,.14) 45%, rgba(14,12,20,.62) 100%);
}

/* аватар с кнопками — слева на изображении, как в макете */
.cb-cover-avatar {
  position: absolute;
  left: 0;
  top: 0;
  width: 200px;
  height: 100%;
  padding: 20px 0 20px 20px;
  box-sizing: border-box;
}

.cb-cover-avatar-img {
  display: block;
  width: 180px;
  height: 180px;
  overflow: hidden;
  background-color: #0e0c14;
}

.cb-cover-avatar-img img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.cb-cover-avatar-actions { margin-top: 16px; }
.cb-cover-avatar-actions .ro-button {
  display: block;
  width: 180px;
  margin: 0 0 10px;
  padding-left: 8px;
  padding-right: 8px;
  text-align: center;
  font-size: 14px;
}
.cb-cover-avatar-actions .cb-fav-heart { display: inline-block; margin: 0 0 10px; }

/* сведения персоны — на изображении справа от аватара (вид владельца) */
.cb-cover-info { position: absolute; left: 220px; top: 29px; right: 24px; color: #fff; }

.cb-cover-name {
  font-family: 'Proxima Nova Bold';
  font-size: 20px;
  line-height: 24px;
  text-transform: uppercase;
  margin-bottom: 8px;
}

.cb-cover-type {
  display: inline-block;
  margin-bottom: 10px;
  padding: 2px 12px;
  border-radius: 14px;
  background-color: rgba(0,174,239,.85);
  color: #fff;
  font-size: 14px;
  line-height: 20px;
}

.cb-cover-row { font-size: 16px; line-height: 22px; }
.cb-cover-label { color: #aaaaaa; }        /* подпись сведений — серая из макета */
.cb-cover-note { margin-top: 10px; font-size: 12px; color: rgba(255,255,255,.6); }

/* старый ряд кнопок на обложке оставлен на случай промежуточных сборок */
.cb-cover-actions { position: absolute; left: 24px; bottom: 24px; }
.cb-cover-actions .ro-button { margin: 0 10px 0 0; vertical-align: middle; }
.cb-cover-actions .cb-fav-heart { margin-right: 10px; vertical-align: middle; }

/* заливка акцентом + белый текст: так кнопки выглядят на изображении */
.cb-cover-avatar-actions .ro-button-cyan-w-bg,
.cb-cover-avatar-actions .ro-button-cyan-w-bg:hover,
.cb-cover-actions .ro-button-cyan-w-bg,
.cb-cover-actions .ro-button-cyan-w-bg:hover {
  color: #fff;
  background-color: #00aeef;
  border-color: #00aeef;
}

/* --- краткая информация левой колонки ----------------------------------- */
.cb-pinfo { margin: 0 0 26px; }

.cb-pinfo-name {
  font-family: 'Proxima Nova Bold';
  font-size: 20px;
  line-height: 24px;
  margin-bottom: 10px;
}

.cb-pinfo-row { font-size: 16px; line-height: 22px; margin-bottom: 4px; }
.cb-pinfo-label { color: #999999; }
.cb-pinfo-strong { font-family: 'Proxima Nova Extrabold'; }

/* звёзды рейтинга — 18 × 18, шаг 21, акцентом (как в макете) */
.cb-stars { display: inline-block; line-height: 0; vertical-align: middle; }
.cb-star {
  display: inline-block;
  width: 18px;
  height: 18px;
  margin-right: 3px;
  font-size: 15px;
  line-height: 18px;
  text-align: center;
  color: #d5d5d5;
}
.cb-star-on { color: #00aeef; }

/* --- «Поделиться» и блоки друзей/поклонников ----------------------------- */
.cb-share-head {
  font-family: 'Proxima Nova Condensed Bold';
  font-size: 20px;
  line-height: 20px;
  text-transform: uppercase;
  margin: 0 0 10px;
}
.cb-share { margin: 0 0 26px; line-height: 0; }
.cb-share a { display: inline-block; margin-right: 6px; }

.cb-people { margin: 0 0 26px; }
.cb-people-head {
  font-family: 'Proxima Nova Condensed Bold';
  font-size: 20px;
  line-height: 20px;
  text-transform: uppercase;
  margin: 0 0 12px;
}
.cb-people-head a { color: #000; text-decoration: none; }
.cb-people-head a:hover { color: #00aeef; }
.cb-people-head .cb-people-cnt { color: #999999; }

.cb-people-grid { display: flex; flex-wrap: wrap; margin: 0 -8px 8px 0; }
.cb-people-item { width: 72px; margin: 0 8px 8px 0; }
.cb-people-item img { display: block; width: 72px; height: 72px; object-fit: cover; }
.cb-people-more {
  display: block;
  font-size: 20px;
  line-height: 24px;
  color: #999999;
  text-decoration: none;
}
.cb-people-empty { font-size: 14px; color: #999999; }

/* --- правая колонка: блоки страницы -------------------------------------- */
.cb-sec { margin: 0 0 40px; }

.cb-sec-title {
  font-family: 'Proxima Nova Condensed Bold';
  font-size: 24px;
  line-height: 30px;
  text-transform: uppercase;
  padding-bottom: 8px;
  margin-bottom: 20px;
  border-bottom: 1px solid #d0d0d0;
  color: #000;
}

.cb-sec-actions { margin-top: 10px; }
.cb-sec-text { font-size: 16px; line-height: 25px; color: #000; }

/* сетки карточек: 5 в ряд 163, 4 в ряд 207, 3 в ряд 273 (макет) */
/* шаг 13 px: контент правой колонки 870 px — пять карточек по 163 px
   из макета встают в один ряд (5×163 + 4×13 = 867) */
.cb-cards { display: flex; flex-wrap: wrap; margin: 0 -13px 0 0; }
.cb-cards .cb-card { width: 163px; margin: 0 13px 20px 0; }
.cb-cards-4 .cb-card { width: 207px; }
.cb-cards-3 .cb-card { width: 273px; }

.cb-card { display: block; text-decoration: none; color: #000; }
.cb-card-img {
  display: block;
  position: relative;
  width: 100%;
  height: 163px;
  overflow: hidden;
  margin-bottom: 8px;
  background-color: #eef1f3;
}
.cb-cards-4 .cb-card-img { height: 207px; }
.cb-cards-3 .cb-card-img { height: 156px; }
.cb-card-img img { display: block; width: 100%; height: 100%; object-fit: cover; }
.cb-card-name { display: block; font-size: 18px; line-height: 20px; color: #000; }
.cb-card-role { display: block; font-size: 16px; line-height: 20px; color: #aaaaaa; }
.cb-card:hover .cb-card-name { color: #00aeef; }

/* «Предпочтения персоны» — метка «в любимых» (сердечко) */
.cb-card-fav {
  position: absolute;
  right: 6px;
  top: 6px;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background-color: rgba(255,255,255,.92);
  color: #ef6f8f;
  font-size: 15px;
  line-height: 26px;
  text-align: center;
}

/* «Достижения и награды» — список с акцентными звёздами */
.cb-awards { margin: 0; padding: 0; list-style: none; }
.cb-award { display: table; margin-bottom: 18px; }
.cb-award-ico {
  display: table-cell;
  width: 44px;
  vertical-align: top;
  text-align: center;
}
.cb-award-ico span {
  display: inline-block;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background-color: #00aeef;
  color: #fff;
  font-size: 18px;
  line-height: 34px;
  text-align: center;
}
.cb-award-body { display: table-cell; vertical-align: top; padding-left: 14px; font-size: 16px; line-height: 22px; }
.cb-award-years { display: block; color: #999999; font-size: 14px; }

/* «Резидент в местах» — карточки заведений */
.cb-card-place .cb-card-img { background-color: #f4f6f8; }

/* «Входит в Коллективы» — строки списка */
.cb-collective-row { font-size: 16px; line-height: 24px; margin-bottom: 8px; }
.cb-collective-row .cb-collective-role { color: #999999; }

/* --- мобильный вид и узкие экраны ---------------------------------------- */
@media (max-width: 1240px) {
  .cb-cover { height: auto; }
  .cb-cover-img { position: static; height: 240px; }
  .cb-cover-shade { display: none; }
  .cb-cover-avatar {
    position: static;
    width: 100%;
    height: auto;
    padding: 16px;
  }
  .cb-cover-avatar-img { width: 140px; height: 140px; }
  .cb-cover-avatar-actions .ro-button { display: inline-block; width: auto; margin: 0 8px 8px 0; }
  .cb-cover-info {
    position: static;
    padding: 0 16px 16px;
    color: #000;
  }
  .cb-cover-name { color: #000; }
  .cb-cover-label { color: #999999; }
  .cb-cover-note { color: #999999; }
  .cb-cover { background-color: #fff; }
  .cb-cards .cb-card, .cb-cards-4 .cb-card, .cb-cards-3 .cb-card {
    width: calc(50% - 15px);
  }
  .cb-cards-4 .cb-card-img, .cb-cards-3 .cb-card-img { height: 163px; }
}

@media (max-width: 1000px) {
  .cb-side-cnt, .cb-side-cnt .cb-side-cell, .cb-side-cnt .cb-side-body {
    display: block;
    width: auto;
    padding-right: 0;
  }
  .cb-side { width: 100%; margin-bottom: 24px; }
  .cb-cards .cb-card, .cb-cards-4 .cb-card, .cb-cards-3 .cb-card {
    width: calc(50% - 15px);
  }
}

/* ==========================================================================
   ПЕРЕХОДНЫЙ БЛОК (PERSONA-LAYOUT, 23.09.2026): линейное меню .cb-pmenu.

   На локальном стенде страница персоны уже собрана по макету — с левым меню
   .cb-side, и .cb-pmenu в шаблоне больше нет. Но на NAS и на живом сайте
   лежит прежняя версия user/user_v2.tpl (общий файл, его собирает координатор)
   и она ещё использует .cb-pmenu. Чтобы живая страница не потеряла оформление
   меню до сборки, стили линейного меню оставлены здесь.

   УДАЛИТЬ этот блок сразу после выкладки нового user_v2.tpl на NAS —
   тогда в persons.css останется только макетное .cb-side.
   ========================================================================== */
.cb-pmenu { margin: 0 0 30px; background-color: #d0f2ff; }
.cb-pmenu-list { display: flex; flex-wrap: wrap; margin: 0; padding: 0; list-style: none; }
.cb-pmenu-list li { border-right: 1px solid #fff; }
.cb-pmenu-list li:last-child { border-right: 0; }
.cb-pmenu-list a { display: block; padding: 10px 22px; font-family: 'Proxima Nova Regular';
  font-size: 16px; line-height: 20px; color: #000; text-decoration: none; }
.cb-pmenu-list a:hover { background-color: #eaf8fd; }
.cb-pmenu-list li.cb-pmenu-active a,
.cb-pmenu-list li.cb-pmenu-active a:hover { background-color: #00aeef; color: #fff; }

/* ФОТО-РАБОТЫ-1 (25.09.2026): заголовок ленты с кнопкой справа
   (ленты «Галерея» и «Работы» на странице персоны — решение Владислава:
   кнопку «Все фотоальбомы» ставим напротив заголовка ленты). */
.cb-sec-title-row{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.cb-sec-title-row .ro-button{margin:0;flex:0 0 auto;white-space:nowrap}