/* ==========================================================================
   Туры и авиабилеты — page-company.css. Раскладка карточки сервиса
   (single-tr_company.php) и страницы сравнения (single-tr_compare.php).
   Компоненты — в components.css; здесь только то, чего там нет.
   ========================================================================== */

/* ---------- Карточка: шапка обзора ---------- */
.tr-co-hero__grid { display: grid; gap: var(--tr-s-5); }
.tr-co-hero__grid > * { min-width: 0; }
.tr-co-hero__main { display: grid; gap: var(--tr-s-4); align-content: start; }
.tr-co-hero__main > * { min-width: 0; }
.tr-co-hero__id { display: flex; align-items: flex-start; gap: var(--tr-s-4); min-width: 0; }
.tr-co-hero__title { display: grid; gap: var(--tr-s-2); min-width: 0; }
.tr-co-hero__badges { display: flex; flex-wrap: wrap; gap: var(--tr-s-2); }
.tr-co-hero__side { display: grid; gap: var(--tr-s-3); align-content: start; }
.tr-co-hero__side .tr-score--xl { grid-template-columns: auto minmax(0, 1fr); column-gap: var(--tr-s-3); }
.tr-co-hero__facts { order: 3; }
.tr-co-hero__score-link { grid-column: 1 / -1; justify-self: start; }
.tr-co-site { font-family: var(--tr-font-mono); font-size: var(--tr-fs-micro); line-height: var(--tr-lh-micro); color: var(--tr-muted); overflow-wrap: anywhere; }
.tr-co-site b { font-weight: 700; color: var(--tr-ink); }

/* ---------- Карточка: колонка обзора и боковая колонка ---------- */
.tr-co-layout { display: grid; gap: var(--tr-s-7); margin-top: var(--tr-s-7); }
.tr-co-layout > * { min-width: 0; }
.tr-co-body { display: grid; gap: var(--tr-s-9); }
.tr-co-body > * { min-width: 0; }
.tr-co-block { display: grid; gap: var(--tr-s-5); }
.tr-co-block > * { min-width: 0; }
.tr-co-block__head { display: grid; gap: var(--tr-s-2); }
.tr-co-aside { display: grid; gap: var(--tr-s-4); align-content: start; }
.tr-co-cta { display: none; }
.tr-co-cta__head { display: flex; align-items: center; gap: var(--tr-s-3); min-width: 0; }
.tr-co-cta__name { font-family: var(--tr-font-head); font-weight: 600; font-size: var(--tr-fs-h4); line-height: var(--tr-lh-h4); }

/* ---------- Условия «подпись — значение — источник» ---------- */
.tr-facts { border-top: var(--tr-bw-strong) solid var(--tr-line-ink); }
.tr-facts__row { display: grid; gap: var(--tr-s-1) var(--tr-s-5); padding: var(--tr-s-4) 0; border-bottom: var(--tr-bw) solid var(--tr-line); }
.tr-facts__row > * { min-width: 0; }
.tr-facts__label { font-weight: 700; font-size: var(--tr-fs-ui); line-height: var(--tr-lh-ui); color: var(--tr-ink); }
.tr-facts__hint { display: block; font-weight: 400; font-size: var(--tr-fs-micro); line-height: var(--tr-lh-micro); color: var(--tr-muted); }
.tr-facts__value { display: grid; gap: var(--tr-s-2); font-size: var(--tr-fs-body); line-height: 24px; }
.tr-facts__list { display: flex; flex-wrap: wrap; gap: var(--tr-s-2); }

/* ---------- Оценка по критериям: вес виден всегда, с 1200px — в одну строку ---------- */
.tr-breakdown__row { grid-template-columns: minmax(0, 1fr) auto auto; align-items: baseline; }
.tr-breakdown__weight { display: block; white-space: nowrap; }
.tr-breakdown__val { min-width: 40px; }
.tr-breakdown__row--total .tr-breakdown__name { font-family: var(--tr-font-head); font-weight: 600; font-size: var(--tr-fs-h4); line-height: var(--tr-lh-h4); }
.tr-breakdown__row--total .tr-breakdown__val { grid-column: 2 / -1; font-size: var(--tr-fs-score); line-height: var(--tr-lh-score); }

/* ---------- Шаги ---------- */
.tr-steps { counter-reset: step; display: grid; gap: var(--tr-s-3); max-width: var(--tr-measure); }
.tr-steps > li { counter-increment: step; position: relative; min-height: 32px; padding: var(--tr-s-1) 0 0 44px; font-size: var(--tr-fs-ui); line-height: 24px; }
.tr-steps > li::before {
  content: counter(step); position: absolute; left: 0; top: 0; display: grid; place-items: center; width: 32px; height: 32px;
  background: var(--tr-surface); border: var(--tr-bw) solid var(--tr-line-ink); border-radius: var(--tr-r-1);
  font-family: var(--tr-font-mono); font-weight: 700; font-size: var(--tr-fs-small); line-height: 1; color: var(--tr-ink);
}

/* ---------- Официальный сайт ---------- */
.tr-co-official { display: grid; gap: var(--tr-s-4); padding: var(--tr-s-5); background: var(--tr-surface); border: var(--tr-bw) solid var(--tr-line-ink); border-radius: var(--tr-r-2); }
.tr-co-official > * { min-width: 0; }

/* ---------- Простой список ссылок ---------- */
.tr-co-links { display: grid; gap: var(--tr-s-2) var(--tr-gap); margin-top: var(--tr-s-4); }
.tr-co-links[hidden] { display: none; }
.tr-co-links a { display: inline-block; padding: var(--tr-s-1) 0; font-size: var(--tr-fs-ui); line-height: var(--tr-lh-ui); color: var(--tr-ink); text-underline-offset: 3px; }
.tr-co-links a:hover { color: var(--tr-accent-text); }
.tr-co-more { margin-top: var(--tr-s-4); }

/* ---------- Сравнение: заголовок и два сервиса ---------- */
.tr-cmp-hero__grid { display: grid; gap: var(--tr-s-5); }
.tr-cmp-hero__grid > * { min-width: 0; }
.tr-cmp-hero__head { display: grid; gap: var(--tr-s-4); align-content: start; }
.tr-cmp-hero__meta { font-family: var(--tr-font-mono); font-weight: var(--tr-fw-medium); font-size: var(--tr-fs-micro); line-height: var(--tr-lh-micro); color: var(--tr-muted); }
.tr-cmp-sides { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--tr-s-3); align-items: stretch; }
.tr-cmp-side { display: grid; gap: var(--tr-s-3); align-content: start; min-width: 0; padding: var(--tr-s-4) var(--tr-s-3); background: var(--tr-surface); border: var(--tr-bw) solid var(--tr-line-ink); border-top: var(--tr-bw-band) solid var(--tr-accent); border-radius: var(--tr-r-2); }
.tr-cmp-side--b { border-top-color: var(--tr-accent-2); }
.tr-cmp-side > * { min-width: 0; }
.tr-cmp-side__name { font-family: var(--tr-font-head); font-weight: 600; font-size: var(--tr-fs-h4); line-height: var(--tr-lh-h4); color: var(--tr-ink); overflow-wrap: anywhere; }
.tr-cmp-side__kind { font-size: var(--tr-fs-micro); line-height: var(--tr-lh-micro); color: var(--tr-muted); }
.tr-cmp-side__actions { display: grid; gap: var(--tr-s-2); align-self: end; }
.tr-cmp-side__actions .tr-btn { padding: 0 var(--tr-s-2); }
.tr-cmp-sides__or {
  position: absolute; z-index: 1; left: 50%; top: var(--tr-s-6); display: grid; place-items: center; width: 36px; height: 36px; margin-left: -18px;
  background: var(--tr-ink); border-radius: var(--tr-r-round); font-family: var(--tr-font-mono); font-weight: 700; font-size: 11px; line-height: 1; color: var(--tr-on-dark);
}

/* ---------- Сравнение: таблица «бок о бок». До 768px условие — строкой, под ним две ячейки ---------- */
.tr-vs--stack { display: block; min-width: 0; }
.tr-vs--stack thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.tr-vs--stack tbody { display: block; }
.tr-vs--stack tbody tr { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.tr-vs--stack tbody th { grid-column: 1 / -1; width: auto; background: var(--tr-surface-2); color: var(--tr-ink); text-align: left; }
.tr-vs--stack tbody tr:first-child th { border-top: 0; }
.tr-vs--stack td { min-width: 0; border-top: 0; overflow-wrap: anywhere; }
.tr-vs--stack td + td { border-left: var(--tr-bw) solid var(--tr-line); }
.tr-vs--stack td::before { content: attr(data-label); display: block; margin-bottom: var(--tr-s-1); font-weight: 700; font-size: var(--tr-fs-label); line-height: var(--tr-lh-label); letter-spacing: var(--tr-ls-label); color: var(--tr-quiet); }
.tr-vs__svc { display: flex; align-items: center; gap: var(--tr-s-3); min-width: 0; text-align: left; }
.tr-vs__svc a { color: var(--tr-ink); text-underline-offset: 3px; }
.tr-vs__svc a:hover { color: var(--tr-accent-text); }
.tr-vs__val { display: block; }
.tr-vs td .tr-src { margin-top: var(--tr-s-2); }
.tr-vs td.tr-vs__best { background: var(--tr-accent-2-soft); }
.tr-vs__mark { display: flex; margin-bottom: var(--tr-s-2); }
.tr-vs__mark .tr-badge { background: var(--tr-surface); white-space: normal; }
.tr-vs__num { font-family: var(--tr-font-mono); font-weight: 700; font-size: var(--tr-fs-score); line-height: var(--tr-lh-score); }
.tr-vs-legend { display: flex; flex-wrap: wrap; align-items: center; gap: var(--tr-s-2) var(--tr-s-3); margin-top: var(--tr-s-3); font-size: var(--tr-fs-micro); line-height: var(--tr-lh-micro); color: var(--tr-muted); }
.tr-vs-legend__swatch { flex: none; width: 16px; height: 16px; background: var(--tr-accent-2-soft); border: var(--tr-bw) solid var(--tr-accent-2); }
.tr-vs-legend > span:last-child { flex: 1 1 240px; }

/* ---------- Сравнение: оценка по критериям, две полосы на критерий ---------- */
.tr-duel { border-top: var(--tr-bw-strong) solid var(--tr-line-ink); }
.tr-duel__row { display: grid; gap: var(--tr-s-2) var(--tr-s-5); padding: var(--tr-s-4) 0; border-bottom: var(--tr-bw) solid var(--tr-line); }
.tr-duel__row > * { min-width: 0; }
.tr-duel__name { font-weight: 700; font-size: var(--tr-fs-ui); line-height: var(--tr-lh-ui); }
.tr-duel__weight { margin-left: var(--tr-s-2); font-family: var(--tr-font-mono); font-weight: 400; font-size: var(--tr-fs-micro); color: var(--tr-quiet); white-space: nowrap; }
.tr-duel__why { display: block; margin-top: var(--tr-s-1); font-family: var(--tr-font-body); font-weight: 400; font-size: var(--tr-fs-small); line-height: var(--tr-lh-small); color: var(--tr-muted); }
.tr-duel__side { display: grid; grid-template-columns: 96px minmax(0, 1fr) 44px; align-items: center; gap: var(--tr-s-3); font-size: var(--tr-fs-small); line-height: var(--tr-lh-small); }
.tr-duel__who { color: var(--tr-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tr-duel__bar { height: 8px; background: var(--tr-line); }
.tr-duel__bar > span { display: block; height: 100%; background: var(--tr-ink); }
.tr-duel__val { font-family: var(--tr-font-mono); font-weight: 700; font-size: var(--tr-fs-ui); text-align: right; font-variant-numeric: tabular-nums; }
.tr-duel__side--best .tr-duel__who { font-weight: 700; color: var(--tr-ink); }
.tr-duel__side--best .tr-duel__bar > span { background: var(--tr-accent-2-fill); }
.tr-duel__row--total { border-top: var(--tr-bw) solid var(--tr-line-ink); border-bottom: 0; }
.tr-duel__row--total .tr-duel__name { font-family: var(--tr-font-head); font-weight: 600; font-size: var(--tr-fs-h4); line-height: var(--tr-lh-h4); }
.tr-duel__row--total .tr-duel__val { font-size: var(--tr-fs-score); line-height: var(--tr-lh-score); }

/* ---------- Сравнение: кому что выбрать, возврат ---------- */
.tr-cmp-pair { display: grid; gap: var(--tr-gap); }
.tr-cmp-choice { display: grid; gap: var(--tr-s-4); align-content: start; min-width: 0; padding: var(--tr-s-5); background: var(--tr-surface); border: var(--tr-bw) solid var(--tr-line-ink); border-top: var(--tr-bw-band) solid var(--tr-accent); border-radius: var(--tr-r-2); }
.tr-cmp-choice--b { border-top-color: var(--tr-accent-2); }
.tr-cmp-choice > * { min-width: 0; }
.tr-cmp-choice__head { display: flex; align-items: center; gap: var(--tr-s-3); min-width: 0; }
.tr-cmp-choice__actions { display: flex; flex-wrap: wrap; gap: var(--tr-s-2); align-self: end; }
.tr-cmp-choice__actions .tr-btn { flex: 1 1 140px; }
.tr-cmp-choice__label { font-weight: 700; font-size: var(--tr-fs-label); line-height: var(--tr-lh-label); letter-spacing: var(--tr-ls-label); color: var(--tr-quiet); }

@media (min-width: 768px) {
  .tr-co-hero__grid { grid-template-columns: minmax(0, 1fr) 280px; gap: var(--tr-s-5) var(--tr-gap); align-items: start; }
  .tr-co-hero__main { grid-column: 1; grid-row: 1; }
  .tr-co-hero__facts { grid-column: 1; grid-row: 2; }
  .tr-co-hero__side { grid-column: 2; grid-row: 1 / span 2; }
  .tr-facts__row { grid-template-columns: 220px minmax(0, 1fr); }
  .tr-co-official { grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: var(--tr-s-6); padding: var(--tr-s-6); }
  .tr-co-links { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .tr-cmp-sides { gap: var(--tr-gap); }
  .tr-cmp-side { padding: var(--tr-s-5); }
  .tr-cmp-side__actions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .tr-cmp-pair { grid-template-columns: repeat(2, minmax(0, 1fr)); }

  .tr-vs--stack { display: table; min-width: 560px; }
  .tr-vs--stack thead { position: static; display: table-header-group; width: auto; height: auto; overflow: visible; clip-path: none; }
  .tr-vs--stack tbody { display: table-row-group; }
  .tr-vs--stack tbody tr { display: table-row; }
  .tr-vs--stack tbody th { width: 22%; background: none; color: var(--tr-quiet); }
  .tr-vs--stack tbody tr:first-child th { border-top: var(--tr-bw) solid var(--tr-line); }
  .tr-vs--stack td { border-top: var(--tr-bw) solid var(--tr-line); overflow-wrap: normal; }
  .tr-vs--stack td::before { content: none; }
  .tr-vs td, .tr-vs tbody th, .tr-vs thead th { padding: var(--tr-s-4); }

  .tr-duel__row { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); }
  .tr-duel__name { grid-row: 1 / span 2; }
  .tr-duel__side { grid-column: 2; grid-template-columns: 120px minmax(0, 1fr) 48px; }
}

@media (min-width: 1200px) {
  .tr-co-hero__grid { grid-template-columns: minmax(0, 8fr) minmax(0, 4fr); gap: var(--tr-s-5) var(--tr-s-10); }
  .tr-co-layout { grid-template-columns: minmax(0, 8fr) minmax(0, 4fr); gap: var(--tr-s-10); align-items: start; margin-top: var(--tr-s-9); }
  .tr-co-body { grid-column: 1; grid-row: 1; gap: var(--tr-s-10); }
  .tr-co-aside { grid-column: 2; grid-row: 1; position: sticky; top: calc(var(--tr-header-h) + var(--tr-s-5)); }
  .tr-co-aside .tr-toc { position: static; }
  .tr-co-cta { display: grid; gap: var(--tr-s-3); padding: var(--tr-s-5); background: var(--tr-surface); border: var(--tr-bw) solid var(--tr-line-ink); border-radius: var(--tr-r-2); }
  .tr-co-links { grid-template-columns: repeat(3, minmax(0, 1fr)); }

  .tr-breakdown__row { grid-template-columns: minmax(0, 1fr) 88px 160px 48px; align-items: center; }
  .tr-breakdown__name { grid-column: 1; grid-row: 1; }
  .tr-breakdown__weight { grid-column: 2; grid-row: 1; }
  .tr-breakdown__bar { grid-column: 3; grid-row: 1; }
  .tr-breakdown__val { grid-column: 4; grid-row: 1; }
  .tr-breakdown__row--total .tr-breakdown__val { grid-column: 2 / -1; }

  .tr-cmp-hero__grid { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--tr-s-10); align-items: start; }
  .tr-cmp-side { padding: var(--tr-s-6); }
  .tr-cmp-side__actions { grid-template-columns: minmax(0, 1fr); }
}

/* цитата условия: врезка .tr-note--quote на теге blockquote — без браузерного отступа */
blockquote.tr-note { margin: 0; }