/* ==========================================================================
   Туры и авиабилеты — base.css
   Сброс, типографика, сетка, шапка, подвал. Значения только из tokens.css.
   Медиазапросы: только min-width 768px и 1200px. Префикс классов: tr.
   ========================================================================== */

/* ---------- Сброс ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: calc(var(--tr-header-h) + var(--tr-s-4)); }
body {
  margin: 0;
  background: var(--tr-bg);
  color: var(--tr-ink);
  font-family: var(--tr-font-body);
  font-size: var(--tr-fs-body);
  line-height: var(--tr-lh-body);
  font-weight: var(--tr-fw-regular);
  overflow-wrap: break-word;
}
h1, h2, h3, h4, p, ul, ol, dl, dd, dt, figure, fieldset, legend { margin: 0; padding: 0; }
ul, ol { list-style: none; }
fieldset { border: 0; min-width: 0; }
img, svg { display: block; max-width: 100%; }
a { color: inherit; }
button, input, select, textarea { font: inherit; color: inherit; margin: 0; }
button { cursor: pointer; }
table { border-collapse: collapse; border-spacing: 0; }
th { font-weight: inherit; text-align: left; }
summary { cursor: pointer; }
summary::-webkit-details-marker { display: none; }
[hidden] { display: none !important; }
:focus-visible { outline: var(--tr-focus-w) solid var(--tr-focus); outline-offset: var(--tr-focus-offset); }
body.has-cmpbar { padding-bottom: var(--tr-cmpbar-h); }

/* ---------- Служебное ---------- */
.tr-sr {
  position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0;
  overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0;
}
.tr-skip {
  position: absolute; left: var(--tr-s-4); top: -100px; z-index: 100;
  padding: var(--tr-s-2) var(--tr-s-4); background: var(--tr-ink); color: var(--tr-on-dark);
}
.tr-skip:focus { top: var(--tr-s-2); }
.tr-sprite { position: absolute; width: 0; height: 0; overflow: hidden; }

/* ---------- Типографика ---------- */
.tr-h1, .tr-h2, .tr-h3, .tr-h4 { font-family: var(--tr-font-head); color: var(--tr-ink); }
.tr-h1 { font-weight: 700; font-size: var(--tr-fs-h1); line-height: var(--tr-lh-h1); letter-spacing: var(--tr-ls-head); }
.tr-h2 { font-weight: 700; font-size: var(--tr-fs-h2); line-height: var(--tr-lh-h2); letter-spacing: var(--tr-ls-head); }
.tr-h3 { font-weight: 600; font-size: var(--tr-fs-h3); line-height: var(--tr-lh-h3); }
.tr-h4 { font-weight: 600; font-size: var(--tr-fs-h4); line-height: var(--tr-lh-h4); }
.tr-lead { font-size: var(--tr-fs-lead); line-height: var(--tr-lh-lead); color: var(--tr-muted); max-width: var(--tr-measure); }
.tr-small { font-size: var(--tr-fs-small); line-height: var(--tr-lh-small); }
.tr-micro { font-size: var(--tr-fs-micro); line-height: var(--tr-lh-micro); }
.tr-muted { color: var(--tr-muted); }
.tr-num { font-family: var(--tr-font-mono); font-weight: var(--tr-fw-medium); font-variant-numeric: tabular-nums; }
.tr-link {
  color: var(--tr-accent-2-text); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px;
}
.tr-link:hover { color: var(--tr-ink); text-decoration-thickness: 2px; }
.tr-none { color: var(--tr-quiet); }

/* ---------- Сетка ---------- */
.tr-container { width: 100%; max-width: var(--tr-container); margin-inline: auto; padding-inline: var(--tr-gutter); }
.tr-main { display: block; padding-bottom: var(--tr-section); }
.tr-section { margin-top: var(--tr-section); }
/* линия сгиба: пунктир на ширину контейнера между блоками, где меняется тема */
.tr-section--fold { margin-top: calc(var(--tr-section) * .75); }
.tr-section--tight { margin-top: var(--tr-s-7); }
.tr-section--fold > .tr-container::before {
  content: ""; display: block; margin-bottom: calc(var(--tr-section) * .75);
  border-top: var(--tr-bw) dashed var(--tr-line-strong);
}
.tr-section__head { display: grid; gap: var(--tr-s-2); margin-bottom: var(--tr-s-5); }
.tr-section__sub { font-size: var(--tr-fs-ui); line-height: var(--tr-lh-ui); color: var(--tr-muted); max-width: var(--tr-measure); }
.tr-section__foot { margin-top: var(--tr-s-5); }
.tr-measure { max-width: var(--tr-measure); }
.tr-grid { display: grid; gap: var(--tr-gap); }
.tr-grid > * { min-width: 0; }
.tr-stack { display: grid; gap: var(--tr-s-4); }
.tr-stack > * { min-width: 0; }

@media (min-width: 768px) {
  .tr-section__head { margin-bottom: var(--tr-s-6); }
  .tr-grid--2, .tr-grid--3, .tr-grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 1200px) {
  .tr-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .tr-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  /* текст слева до 760px, справа узкая колонка (оглавление, пояснение) */
  .tr-grid--text { grid-template-columns: minmax(0, var(--tr-measure)) minmax(0, 1fr); column-gap: var(--tr-s-10); align-items: start; }
}

/* ---------- Полоса горизонта: только над шапкой и над подвалом ---------- */
.tr-horizon { border-top: var(--tr-bw-band) solid var(--tr-accent); }
.tr-horizon::before { content: ""; display: block; height: var(--tr-bw-band); background: var(--tr-accent-2); }

/* ---------- Шапка ---------- */
.tr-header {
  position: sticky; top: 0; z-index: var(--tr-z-header);
  background: var(--tr-bg); border-bottom: var(--tr-bw-strong) solid var(--tr-line-ink);
}
.tr-header__bar {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
  column-gap: var(--tr-s-4); min-height: calc(var(--tr-header-h) - var(--tr-bw-strong));
}
.tr-brand { display: inline-flex; align-items: center; gap: var(--tr-s-2); min-height: 44px; text-decoration: none; color: var(--tr-ink); }
.tr-mark { flex: none; width: 32px; height: 32px; }
.tr-brand__text { display: grid; }
.tr-brand__name { font-family: var(--tr-font-head); font-weight: 700; font-size: 20px; line-height: 24px; }
.tr-brand__tagline { display: none; font-size: var(--tr-fs-label); line-height: var(--tr-lh-label); color: var(--tr-quiet); }
.tr-header__toggle {
  display: inline-flex; align-items: center; gap: var(--tr-s-2); min-width: 44px; height: 44px; padding: 0 var(--tr-s-3);
  background: var(--tr-surface); border: var(--tr-bw) solid var(--tr-line-ink); border-radius: var(--tr-r-2);
  font-weight: 700; font-size: var(--tr-fs-ui); line-height: var(--tr-lh-ui);
}
.tr-header__toggle:hover { background: var(--tr-surface-2); }
.tr-header__toggle[aria-expanded="true"] { background: var(--tr-ink); color: var(--tr-on-dark); }

.tr-nav {
  display: none; flex: 0 0 100%; min-width: 0; max-height: calc(100vh - var(--tr-header-h)); overflow-y: auto;
  margin-inline: calc(var(--tr-gutter) * -1); padding: var(--tr-s-4) var(--tr-gutter) var(--tr-s-5);
  background: var(--tr-surface); border-top: var(--tr-bw) solid var(--tr-line-ink);
}
.tr-nav.is-open { display: block; }
.tr-nav__cta { margin-bottom: var(--tr-s-3); }
.tr-nav__link {
  display: flex; align-items: center; gap: var(--tr-s-1); width: 100%; min-height: 48px; padding: 0;
  background: none; border: 0; border-bottom: var(--tr-bw) solid var(--tr-line);
  font-weight: 600; font-size: var(--tr-fs-ui); line-height: var(--tr-lh-ui); color: var(--tr-ink);
  text-align: left; text-decoration: none;
}
.tr-nav__link:hover { color: var(--tr-accent-text); }
.tr-nav__link[aria-current="page"] { text-decoration: underline; text-decoration-color: var(--tr-accent); text-decoration-thickness: 2px; text-underline-offset: 6px; }
.tr-nav__more-btn { display: none; }

@media (min-width: 768px) {
  .tr-brand__tagline { display: block; }
}
@media (min-width: 1200px) {
  .tr-header__toggle { display: none; }
  .tr-nav {
    display: flex; flex: 1 1 auto; align-items: center; justify-content: flex-end; gap: var(--tr-s-4);
    max-height: none; overflow: visible; margin: 0; padding: 0; background: none; border: 0;
  }
  .tr-nav .tr-nav__cta { display: none; }
  .tr-nav__list { display: flex; align-items: center; gap: var(--tr-s-4); }
  .tr-nav__list--aux { padding-left: var(--tr-s-4); border-left: var(--tr-bw) solid var(--tr-line-strong); }
  .tr-nav__link { width: auto; min-height: 44px; border-bottom: 0; white-space: nowrap; text-decoration: none; }
  .tr-nav__link:hover, .tr-nav__link[aria-current="page"] {
    color: var(--tr-ink); text-decoration: underline; text-decoration-color: var(--tr-accent);
    text-decoration-thickness: 2px; text-underline-offset: 8px;
  }
  .tr-nav__more { position: relative; }
  .tr-nav__more-btn { display: flex; }
  .tr-nav__sub {
    display: none; position: absolute; right: 0; top: 100%; min-width: 220px; padding: var(--tr-s-2) var(--tr-s-4);
    background: var(--tr-surface); border: var(--tr-bw) solid var(--tr-line-ink);
  }
  .tr-nav__more.is-open .tr-nav__sub, .tr-nav__more:focus-within .tr-nav__sub { display: block; }
  .tr-nav__more.is-open .tr-icon { transform: rotate(180deg); }
}

/* ---------- Подвал ---------- */
.tr-footer { padding: var(--tr-s-9) 0 var(--tr-s-7); background: var(--tr-dark-bg); color: var(--tr-on-dark); }
.tr-footer :focus-visible { outline-color: var(--tr-accent-on-dark); }
.tr-footer__cols { display: grid; gap: var(--tr-s-7); }
.tr-footer__col { min-width: 0; }
.tr-footer__title { margin-bottom: var(--tr-s-2); font-family: var(--tr-font-head); font-weight: 600; font-size: var(--tr-fs-ui); line-height: var(--tr-lh-ui); color: var(--tr-on-dark); }
.tr-footer__link {
  display: flex; align-items: center; min-height: 44px; font-size: var(--tr-fs-ui); line-height: 24px;
  color: var(--tr-on-dark-muted); text-decoration: none;
}
.tr-footer__link:hover { color: var(--tr-on-dark); text-decoration: underline; text-underline-offset: 4px; }
.tr-footer__disclosure {
  margin-top: var(--tr-s-7); padding: var(--tr-s-4); border: var(--tr-bw) solid var(--tr-dark-line);
  font-size: var(--tr-fs-small); line-height: 22px; color: var(--tr-on-dark-muted);
}
.tr-footer__disclosure a { color: var(--tr-accent-2-on-dark); text-underline-offset: 3px; }
.tr-footer__disclosure a:hover { color: var(--tr-on-dark); }
.tr-footer__bottom {
  display: flex; flex-wrap: wrap; align-items: center; gap: var(--tr-s-3) var(--tr-s-6); margin-top: var(--tr-s-6);
  font-size: var(--tr-fs-micro); line-height: var(--tr-lh-micro); color: var(--tr-on-dark-muted);
}
.tr-footer__brand { display: inline-flex; align-items: center; gap: var(--tr-s-2); color: var(--tr-on-dark); text-decoration: none; }
.tr-footer__brand .tr-brand__name { font-size: 18px; }
.tr-footer__date { font-family: var(--tr-font-mono); font-size: var(--tr-fs-label); line-height: var(--tr-lh-label); }

@media (min-width: 768px) {
  .tr-footer__cols { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--tr-s-8) var(--tr-gap); }
  .tr-footer__link { min-height: 32px; }
  .tr-footer__copy { margin-left: auto; }
}
@media (min-width: 1200px) {
  .tr-footer__cols { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}