/* Режим проекции: кадры по адресам CDN, подпись индекса TA-v1, дата снимка. */
.rh-ta-img { position: relative; display: block; width: 100%; height: 100%; }
.rh-ta-img > img { display: block; width: 100%; height: 100%; object-fit: cover; }
.rh-ta-img > img[hidden],
.rh-ta-img > .rh-placeholder[hidden] { display: none; }
.card__rating-note,
.rh-ta-index__note { margin: 4px 0 0; font-size: 12px; line-height: 1.35; opacity: .7; }
.rh-ta-index { margin: 16px 0 0; }
.rh-ta-index__label { margin: 0; font-size: 13px; opacity: .8; }
.rh-ta-index__value { margin: 4px 0 0; font-size: 18px; font-weight: 600; }
.zhk-hero__credit { margin: 6px 0 0; font-size: 12px; opacity: .6; }
.rh-ta-score .wp50-score__method { max-width: 72ch; font-size: 14px; opacity: .85; }
.rh-ta-score .wp50-score__reasons { margin: 12px 0 0; padding-left: 18px; font-size: 13px; opacity: .8; }

/*
 * Боевая тема без шаблона WP50: фирменная заглушка и блок индекса на странице
 * ЖК стилизуются здесь, без dist/wp50.css (те же классы, что у WP50).
 */
/* Карточка каталога белая, а текст страницы белый: подписи нужен свой цвет. */
.card__rating-note { color: var(--color-card-rating-label, #ababab); opacity: 1; }

/* Первый экран ЖК: блок индекса — в колонке фактов, подпись кадров — под кадром. */
.zhk-hero__index { position: relative; width: min(528px, 36.6667vw); margin: min(28px, 1.94444vw) 0 0 calc(min(303px, calc(303 / 1440 * 100vw)) - var(--crop, 0px)); }
.zhk-hero__credit { position: absolute; margin: 0; left: calc(min(863px, calc(863 / 1440 * 100vw)) - var(--crop, 0px)); top: calc(max(-50px, -3.47222vw) + min(840px, 58.3333vw) + min(6px, .41667vw)); }
@media (width <= 700px) {
  .zhk-hero__index { order: 2; width: min(330px, 84.6154vw); margin: min(20px, 5.12821vw) 0 0 calc(var(--mobile-side, 0px) + min(20px, calc(20 / 390 * 100vw))); }
  .zhk-hero__credit { position: relative; left: auto; top: auto; order: 1; margin: min(6px, 1.53846vw) 0 0 calc(var(--mobile-side, 0px) + min(10px, calc(10 / 390 * 100vw))); }
}

.rh-placeholder {
  display: grid;
  place-items: center;
  align-content: center;
  gap: 18px;
  width: 100%;
  height: 100%;
  min-height: 240px;
  padding: 30px;
  box-sizing: border-box;
  color: #c8d7d3;
  text-align: center;
  background: #10201d url("assets/placeholders/project-image.svg") center / cover no-repeat;
}
.rh-placeholder__mark { display: block; width: clamp(96px, 16vw, 160px); }
.rh-placeholder__mark svg { display: block; width: 100%; height: auto; }
.rh-placeholder__label { font-size: 12px; letter-spacing: .12em; text-transform: uppercase; }
.card__media > .rh-placeholder,
.card__media > .rh-ta-img { position: absolute; inset: 0; }
.card__media .card__placeholder { min-height: 0; gap: 10px; padding: 16px; }
.card__placeholder .rh-placeholder__mark { width: clamp(64px, 8vw, 110px); }
.card__placeholder .rh-placeholder__label { font-size: 11px; }

.rh-ta-score {
  position: relative;
  box-sizing: border-box;
  padding: clamp(56px, 7vw, 112px) max(clamp(16px, 5vw, 96px), calc((100% - 1400px) / 2));
  color: #f6f6f6;
  background: #202624;
}
.rh-ta-score .wp50-section__head { display: grid; grid-template-columns: minmax(0, .65fr) minmax(0, 1.35fr); gap: 20px 8vw; align-items: end; margin-bottom: clamp(28px, 4vw, 56px); }
.rh-ta-score .wp50-kicker { grid-column: 1; margin: 0; color: var(--color-teal-eyebrow, #8bc0b8); font-size: 12px; line-height: 1.35; letter-spacing: .16em; text-transform: uppercase; }
.rh-ta-score .wp50-section__head h2 { grid-column: 1; margin: 0; font: 400 clamp(32px, 3.6vw, 60px)/1 var(--font-display, "Oranienbaum", serif); letter-spacing: -.015em; text-wrap: balance; }
.rh-ta-score .wp50-section__note { grid-column: 2; grid-row: 1 / span 2; align-self: end; max-width: 58ch; margin: 0; color: #a8b2af; font-size: 15px; line-height: 1.6; }
.rh-ta-score .wp50-score__comment { margin-top: 0; padding: 24px 0 0; border-top: 1px solid rgb(255 255 255 / 12%); color: #d4ddda; font-size: clamp(20px, 2vw, 28px); line-height: 1.5; }
.rh-ta-score .wp50-score__method { margin-top: 16px; line-height: 1.6; }

@media (max-width: 700px) {
  .rh-ta-score .wp50-section__head { display: block; }
  .rh-ta-score .wp50-section__head h2 { margin-top: 12px; }
  .rh-ta-score .wp50-section__note { margin-top: 16px; }
}