/* ════════════════════════════════════════════════════════════════════
   КвадроТрип — главная страница, макет
   Бренд: тёмно-зелёный + чёрный 70% / беж 20% / оранжевый 10%
   Шрифты: Bebas Neue (заголовки) + Caveat (brush) + Montserrat (текст)
   ════════════════════════════════════════════════════════════════════ */

/* —————————————————————————————————————————————————
   Переменные бренда
   ————————————————————————————————————————————————— */
:root {
  --c-green: #1F3D2B;
  --c-green-deep: #14291C;
  --c-black: #121212;
  --c-orange: #FF6B00;
  --c-orange-deep: #E55C00;
  --c-beige: #F2E8DC;
  --c-beige-warm: #EBDDC9;
  --c-cream: #FBF5ED;
  --c-olive: #6B7F5E;
  --c-cream-text: #F7EFE3;
  --c-line: rgba(31,61,43,.12);
  --c-line-dark: rgba(247,239,227,.10);

  --f-display: 'Oswald', 'Bebas Neue', sans-serif;
  --f-display-alt: 'Russo One', 'Oswald', sans-serif;
  --f-brush: 'Caveat', cursive;
  --f-body: 'Montserrat', system-ui, sans-serif;

  --container: 1280px;
  --gutter: clamp(20px, 4vw, 56px);
  --radius: 4px;
  --radius-lg: 12px;
}

/* —————————————————————————————————————————————————
   Сброс + база
   ————————————————————————————————————————————————— */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: var(--f-body);
  font-size: 16px;
  line-height: 1.55;
  color: var(--c-black);
  background: var(--c-beige);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
}
img, video { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
button { font-family: inherit; cursor: pointer; }

/* Зерно поверх всей страницы — ощущение плёнки/гор */
.grain {
  position: fixed; inset: 0;
  pointer-events: none;
  z-index: 9999;
  opacity: .065;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.95' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  mix-blend-mode: multiply;
}

/* —————————————————————————————————————————————————
   Универсальные элементы
   ————————————————————————————————————————————————— */
.h2 {
  font-family: var(--f-display);
  font-weight: 600;
  font-size: clamp(38px, 5.5vw, 80px);
  line-height: .98;
  letter-spacing: .005em;
  margin: 0 0 .35em;
  color: var(--c-green-deep);
  text-transform: uppercase;
}
.h2--light { color: var(--c-cream-text); }

.brush {
  font-family: var(--f-brush);
  font-weight: 700;
  font-style: italic;
  display: inline-block;
  text-transform: none;
  letter-spacing: -.01em;
  line-height: .9;
  transform: translateY(.05em) rotate(-2deg);
}
.brush--orange { color: var(--c-orange); }

/* Заголовки со скриптовым словом: рукописный шрифт высокий и наклонён —
   при переносе на вторую строку он налезает на строку выше. Даём межстрочке воздух. */
.h2:has(.brush) { line-height: 1.15; }

.eyebrow {
  font-family: var(--f-body);
  font-weight: 600;
  font-size: 13px;
  letter-spacing: .25em;
  text-transform: uppercase;
  color: var(--c-olive);
  margin: 0 0 18px;
}
.eyebrow--light { color: var(--c-orange); }

/* —————————————————————————————————————————————————
   Кнопки
   ————————————————————————————————————————————————— */
.btn {
  display: inline-flex;
  align-items: center;
  gap: .55em;
  padding: 18px 28px;
  font-family: var(--f-display);
  font-size: 18px;
  letter-spacing: .08em;
  text-transform: uppercase;
  border: 2px solid transparent;
  border-radius: var(--radius);
  transition: transform .15s ease, background .2s ease, color .2s ease, box-shadow .2s ease;
  white-space: nowrap;
  cursor: pointer;
  position: relative;
}
.btn--primary {
  background: var(--c-orange);
  color: #fff;
  box-shadow: 0 2px 0 0 var(--c-orange-deep), 0 12px 30px -10px rgba(255,107,0,.55);
}
.btn--primary:hover {
  transform: translateY(-2px);
  background: var(--c-orange-deep);
  box-shadow: 0 4px 0 0 #b94a00, 0 18px 36px -10px rgba(255,107,0,.65);
}
.btn--ghost {
  background: transparent;
  color: var(--c-green-deep);
  border-color: var(--c-green-deep);
}
.btn--ghost:hover {
  background: var(--c-green-deep);
  color: var(--c-cream-text);
  transform: translateY(-2px);
}
.btn--ghost-light {
  color: var(--c-cream-text);
  border-color: rgba(247,239,227,.5);
}
.btn--ghost-light:hover {
  background: var(--c-cream-text);
  color: var(--c-green-deep);
  border-color: var(--c-cream-text);
}
.btn--lg { padding: 24px 40px; font-size: 22px; }
.btn__arrow {
  display: inline-block;
  transition: transform .2s ease;
}
.btn:hover .btn__arrow { transform: translateX(4px); }

/* —————————————————————————————————————————————————
   Логотип
   ————————————————————————————————————————————————— */
.logo {
  display: inline-flex;
  align-items: baseline;
  gap: 4px;
  text-decoration: none;
  user-select: none;
}
.logo__main {
  font-family: var(--f-display);
  font-size: 28px;
  letter-spacing: .03em;
  color: var(--c-cream-text);
  line-height: 1;
}
.logo__brush {
  font-family: var(--f-brush);
  font-weight: 700;
  font-size: 36px;
  color: var(--c-orange);
  line-height: 1;
  transform: translateY(.04em) rotate(-4deg);
  display: inline-block;
}
.is-scrolled .logo__main,
.nav.is-scrolled .logo__main { color: var(--c-cream-text); }

.logo--big .logo__main { font-size: 42px; }
.logo--big .logo__brush { font-size: 54px; }

/* —————————————————————————————————————————————————
   NAV
   ————————————————————————————————————————————————— */
.nav {
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 100;
  padding: 18px 0;
  background: linear-gradient(to bottom, rgba(18,18,18,.6), rgba(18,18,18,0));
  transition: background .25s ease, padding .25s ease;
}
.nav.is-scrolled {
  background: rgba(18,18,18,.94);
  backdrop-filter: blur(8px);
  padding: 12px 0;
  border-bottom: 1px solid var(--c-line-dark);
}
.nav__inner {
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 var(--gutter);
  display: flex;
  align-items: center;
  gap: 32px;
}
.nav__links {
  display: flex;
  gap: 28px;
  margin-left: 40px;
}
.nav__links a {
  font-size: 13px;
  letter-spacing: .15em;
  text-transform: uppercase;
  font-weight: 500;
  color: var(--c-cream-text);
  opacity: .8;
  transition: opacity .15s, color .15s;
}
.nav__links a:hover { opacity: 1; color: var(--c-orange); }
.nav__phone {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-family: var(--f-display);
  font-size: 18px;
  letter-spacing: .06em;
  color: var(--c-cream-text);
  border: 1px solid rgba(247,239,227,.3);
  padding: 10px 18px;
  border-radius: var(--radius);
  transition: background .2s, color .2s, border-color .2s;
  white-space: nowrap;
}
.nav__phone:hover {
  background: var(--c-orange);
  color: #fff;
  border-color: var(--c-orange);
}
.nav__phone-icon { color: var(--c-orange); }

/* ── Иконки соцконтакта в шапке: TG · MAX ── */
.nav__icons {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
/* Когда иконки стоят перед телефоном, не сдвигаем телефон auto'ом ещё раз */
.nav__icons + .nav__phone { margin-left: 0; }

.nav__icon {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(247,239,227,.08);
  color: var(--c-cream-text);
  border: 1px solid rgba(247,239,227,.22);
  transition: background .15s, color .15s, border-color .15s, transform .15s;
}
.nav__icon:hover {
  background: var(--c-orange);
  color: #fff;
  border-color: var(--c-orange);
  transform: translateY(-1px);
}
.nav__icon svg { display: block; }
.nav__icon-letter {
  font-family: var(--f-display);
  font-weight: 700;
  font-size: 16px;
  line-height: 1;
  letter-spacing: 0;
}
.nav__icon[aria-disabled="true"] {
  opacity: .55;
  pointer-events: none;
  position: relative;
}
.nav__icon[aria-disabled="true"]::after {
  content: "скоро";
  position: absolute;
  bottom: -10px;
  left: 50%;
  transform: translateX(-50%);
  font-family: var(--f-body);
  font-size: 8px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--c-orange);
  white-space: nowrap;
}

@media (max-width: 880px) {
  .nav__links { display: none; }
}
@media (max-width: 600px) {
  .nav__icon { width: 32px; height: 32px; }
  .nav__icon svg { width: 16px; height: 16px; }
  .nav__icon-letter { font-size: 14px; }
}

/* ════════════════════════════════════════════════════════
   ЭКРАН 1 — HERO
   ════════════════════════════════════════════════════════ */
.hero {
  position: relative;
  min-height: 100vh;
  padding: 140px var(--gutter) 100px;
  overflow: hidden;
  background: var(--c-black);
  color: var(--c-cream-text);
  display: flex;
  align-items: center;
}

/* Фон: имитация горного пейзажа из градиентов и силуэтов */
.hero__bg {
  position: absolute; inset: 0;
  z-index: 0;
}
.hero__mountains {
  position: absolute; inset: 0;
  background:
    /* Небо: восход над горами */
    radial-gradient(ellipse 80% 60% at 70% 100%, rgba(255,107,0,.35) 0%, rgba(255,107,0,0) 60%),
    radial-gradient(ellipse 100% 70% at 50% 100%, rgba(31,61,43,.95) 0%, rgba(31,61,43,0) 70%),
    linear-gradient(to bottom,
      #0d1612 0%,
      #1a2e22 30%,
      #2a3d2d 55%,
      #6b4825 80%,
      #c97a3a 100%);
}
.hero__mountains::before,
.hero__mountains::after {
  content: '';
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 50%;
  background-repeat: no-repeat;
  background-position: bottom;
  background-size: cover;
}
/* Дальние горы — полупрозрачный треугольный силуэт */
.hero__mountains::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 400' preserveAspectRatio='none'%3E%3Cpath fill='%231F3D2B' fill-opacity='.7' d='M0 400 L0 280 L120 200 L240 240 L360 160 L480 220 L600 140 L720 200 L840 130 L960 190 L1080 150 L1200 210 L1320 170 L1440 230 L1440 400 Z'/%3E%3C/svg%3E");
  opacity: .85;
}
/* Передние горы — лёгкий тёмный силуэт, чтобы не дублировать горы из фото */
.hero__mountains::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 400' preserveAspectRatio='none'%3E%3Cpath fill='%23121212' fill-opacity='.85' d='M0 400 L0 340 L80 290 L180 320 L280 250 L380 310 L500 240 L620 300 L760 220 L880 290 L1000 250 L1120 300 L1240 240 L1360 290 L1440 260 L1440 400 Z'/%3E%3C/svg%3E");
  height: 28%;
  opacity: .9;
}
.hero__vignette {
  position: absolute; inset: 0;
  background:
    radial-gradient(ellipse 100% 60% at 50% 0%, rgba(0,0,0,.55) 0%, rgba(0,0,0,0) 60%),
    linear-gradient(to right, rgba(0,0,0,.4) 0%, rgba(0,0,0,0) 30%, rgba(0,0,0,0) 70%, rgba(0,0,0,.3) 100%);
}

/* Диагональная техно-линия с надписью — как трек квадра */
.hero__diagonal-text {
  position: absolute;
  top: 12%;
  right: -10%;
  width: 60%;
  transform: rotate(-12deg);
  z-index: 1;
  pointer-events: none;
  font-family: var(--f-display);
  font-size: 16px;
  letter-spacing: .8em;
  color: var(--c-orange);
  opacity: .35;
  white-space: nowrap;
  overflow: hidden;
}

.hero__content {
  position: relative;
  z-index: 2;
  max-width: var(--container);
  width: 100%;
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.45fr);
  gap: 24px;
  align-items: start;
}

.hero__left { min-width: 0; max-width: 560px; }

.hero__kicker {
  display: inline-flex;
  align-items: center;
  gap: 16px;
  font-size: 12px;
  letter-spacing: .25em;
  text-transform: uppercase;
  color: var(--c-cream-text);
  opacity: .8;
  margin-bottom: 28px;
  font-weight: 500;
}
.hero__kicker-line {
  width: 56px; height: 1px;
  background: var(--c-orange);
}

.hero__title {
  font-family: var(--f-display);
  font-weight: 600;
  font-size: clamp(40px, 5.5vw, 84px);
  line-height: .96;
  letter-spacing: .005em;
  margin: 0 0 24px;
  text-transform: uppercase;
  color: var(--c-cream-text);
  text-shadow: 0 4px 30px rgba(0,0,0,.55);
}
.hero__title-accent {
  color: var(--c-orange);
  display: inline-block;
}

.hero__slogan {
  font-family: var(--f-body);
  font-size: clamp(20px, 2vw, 28px);
  line-height: 1.2;
  margin: 0 0 28px;
  color: var(--c-cream-text);
  font-weight: 300;
  font-style: italic;
}
.hero__slogan b {
  font-weight: 600;
  color: var(--c-orange);
  font-style: normal;
}
.hero__brush {
  font-family: var(--f-brush);
  font-weight: 700;
  color: var(--c-orange);
  font-style: normal;
  font-size: 1.5em;
  display: inline-block;
  transform: rotate(-3deg) translateY(.05em);
  text-shadow: 0 4px 30px rgba(255,107,0,.4);
  margin-right: .15em;
  line-height: .8;
}

.hero__sub {
  font-size: clamp(15px, 1.3vw, 17px);
  line-height: 1.6;
  max-width: 480px;
  margin: 0 0 36px;
  opacity: .85;
  font-weight: 300;
}
.hero__sub b { font-weight: 600; color: var(--c-orange); }

.hero__cta {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-bottom: 48px;
}

.hero__proof {
  padding-top: 32px;
  border-top: 1px solid var(--c-line-dark);
}
.hero__proof-item--rating {
  display: grid;
  grid-template-columns: auto 1fr;
  grid-template-rows: auto auto;
  column-gap: 20px;
  row-gap: 8px;
  align-items: center;
  max-width: 480px;
}
.hero__proof-num {
  font-family: var(--f-display);
  font-weight: 600;
  font-size: clamp(56px, 5vw, 72px);
  line-height: 1;
  color: var(--c-orange);
  grid-row: span 2;
}
.hero__proof-text {
  font-size: 12px;
  letter-spacing: .15em;
  text-transform: uppercase;
  opacity: .75;
  line-height: 1.4;
  font-weight: 500;
}
.hero__proof-links {
  display: flex;
  gap: 8px;
  align-self: end;
}
.hero__proof-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 14px;
  font-size: 12px;
  letter-spacing: .12em;
  text-transform: uppercase;
  font-weight: 600;
  color: var(--c-cream-text);
  border: 1px solid rgba(247,239,227,.3);
  border-radius: var(--radius);
  transition: background .15s, color .15s, border-color .15s;
}
.hero__proof-link span { color: var(--c-orange); }
.hero__proof-link:hover {
  background: var(--c-orange);
  color: #fff;
  border-color: var(--c-orange);
}
.hero__proof-link:hover span { color: #fff; }

/* Hero — правая колонка (фото квадра, растворяется в фоне) */
.hero__visual {
  position: relative;
  width: 100%;
  /* Шире своей колонки и сдвинут вправо-вверх. Высота фиксированная —
     подобрана так, чтобы низ видимой части фото лёг ровно на линию
     низа кнопки «Забронировать в Telegram» в левой колонке */
  margin-right: calc(var(--gutter) * -1.0);
  margin-left: 15%;
  margin-top: -68px;
  height: 760px;
  aspect-ratio: auto;
}
.hero__photo {
  position: absolute;
  inset: 0;
  background-image: url('assets/atv_hero.png');
  /* Крупнее естественного вписывания; снизу-справа фото
     уходит за границу — но там и так зона размытия (вода/края) */
  background-size: 110% auto;
  background-position: 60% 50%;
  background-repeat: no-repeat;
  /* Маска: плотный центр (квадр виден целиком, без размытия),
     лёгкое затухание у самых краёв — только вода/камни снизу
     и тёмные углы исходного фото уходят в фон Hero. */
  -webkit-mask-image:
    linear-gradient(
      to top,
      transparent 0%,
      rgba(0,0,0,.55) 10%,
      #000 22%
    ),
    linear-gradient(
      to right,
      transparent 0%,
      #000 3%,
      #000 70%,
      rgba(0,0,0,.55) 88%,
      transparent 100%
    );
  -webkit-mask-composite: source-in;
  mask-image:
    linear-gradient(
      to top,
      transparent 0%,
      rgba(0,0,0,.55) 10%,
      #000 22%
    ),
    linear-gradient(
      to right,
      transparent 0%,
      #000 3%,
      #000 70%,
      rgba(0,0,0,.55) 88%,
      transparent 100%
    );
  mask-composite: intersect;
  filter: saturate(1.05) contrast(1.05);
}
/* Лёгкая нижняя вуаль — добивает плавный переход воды в фон Hero */
.hero__photo::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(to bottom, transparent 55%, rgba(13,22,18,.4) 100%);
  pointer-events: none;
}

@media (max-width: 1180px) {
  .hero__content { gap: 24px; }
}
@media (max-width: 980px) {
  .hero__content { grid-template-columns: minmax(0, 1fr); gap: 32px; }
  .hero__left { max-width: none; min-width: 0; }
  .hero__visual {
    margin: -4% calc(var(--gutter) * -1);
    aspect-ratio: 16 / 10;
    max-height: 480px;
    min-width: 0;
  }
  .hero__photo {
    background-size: 100% auto;
    background-position: center;
    -webkit-mask-image: linear-gradient(
      to top,
      transparent 0%,
      rgba(0,0,0,.55) 8%,
      #000 18%
    );
    mask-image: linear-gradient(
      to top,
      transparent 0%,
      rgba(0,0,0,.55) 8%,
      #000 18%
    );
  }
}
@media (max-width: 720px) {
  .hero { padding: 110px var(--gutter) 140px; }
  .hero__diagonal-text { display: none; }

  /* Раскладка mobile: kicker → title → slogan → photo → sub → cta → proof */
  .hero__content {
    grid-template-columns: minmax(0, 1fr);
    gap: 20px;
  }
  .hero__left { display: contents; }
  .hero__kicker { order: 1; margin-bottom: 0; flex-wrap: wrap; row-gap: 6px; font-size: 11px; letter-spacing: .2em; }
  .hero__title  { order: 2; margin: 0; }
  .hero__slogan { order: 3; margin: 0; }
  .hero__visual {
    order: 4;
    width: auto;
    margin: 8px calc(var(--gutter) * -1) 8px;
    height: auto;
    aspect-ratio: 16 / 10;
    max-height: 360px;
  }
  .hero__sub    { order: 5; margin: 0; max-width: none; }
  .hero__cta    { order: 6; margin: 0; }
  .hero__proof  { order: 7; padding-top: 24px; }

  .hero__cta {
    flex-direction: column;
    align-items: stretch;
    width: 100%;
  }
  .hero__cta .btn {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    justify-content: center;
    white-space: normal;
    text-align: center;
    overflow-wrap: anywhere;
    padding: 14px 16px;
    font-size: 15px;
    letter-spacing: .05em;
    gap: .35em;
  }
  .btn__hide-sm { display: none; }
  .hero__proof-item--rating {
    grid-template-columns: auto 1fr;
    column-gap: 16px;
    row-gap: 8px;
    max-width: none;
  }
  .hero__proof-links { flex-wrap: wrap; }
  .hero__proof-link { padding: 6px 10px; font-size: 11px; letter-spacing: .08em; }

  .nav { padding: 12px 0; }
  .nav__inner { gap: 12px; }
  .logo__main { font-size: 22px; }
  .logo__brush { font-size: 28px; }
  .nav__phone {
    padding: 8px 12px;
    font-size: 14px;
    letter-spacing: .04em;
    gap: 6px;
  }
  .nav__phone-icon { display: none; }
}

@media (max-width: 480px) {
  .nav__phone {
    padding: 6px 10px;
    font-size: 13px;
    letter-spacing: .02em;
    /* На очень узких — компактный номер */
  }
  .nav__inner { gap: 8px; padding: 0 14px; }
}

/* Защита от горизонтального скролла на мобильных: какие-то декоративные
   фоны/псевдо-элементы могут чуть выходить за viewport. overflow-x: clip
   обрезает их, не ломая sticky внутри body (в отличие от overflow-x: hidden). */
html { overflow-x: clip; }

/* Стрелка скролла */
.hero__scroll {
  position: absolute;
  bottom: 32px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 3;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  font-size: 11px;
  letter-spacing: .3em;
  text-transform: uppercase;
  color: var(--c-cream-text);
  opacity: .6;
  transition: opacity .2s;
}
.hero__scroll:hover { opacity: 1; }
.hero__scroll-line {
  width: 1px;
  height: 36px;
  background: linear-gradient(to bottom, transparent, var(--c-cream-text));
  animation: scroll-pulse 2s infinite;
}
@keyframes scroll-pulse {
  0%, 100% { transform: scaleY(1); opacity: .6; }
  50% { transform: scaleY(1.3); opacity: 1; }
}

/* ════════════════════════════════════════════════════════
   ЭКРАН 2 — ЭМОЦИОНАЛЬНЫЙ БЛОК
   ════════════════════════════════════════════════════════ */
.emotions {
  background: var(--c-beige);
  padding: clamp(80px, 12vw, 160px) var(--gutter);
  position: relative;
}
.emotions__intro {
  max-width: var(--container);
  margin: 0 auto 80px;
}

.emotions__grid {
  max-width: var(--container);
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 32px;
}
.emo-card {
  position: relative;
  background: #fff;
  border-radius: var(--radius-lg);
  overflow: hidden;
  border: 1px solid var(--c-line);
  display: flex;
  flex-direction: column;
  transition: transform .2s ease, box-shadow .2s ease;
}
.emo-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 30px 60px -20px rgba(31,61,43,.25);
}
/* Шахматный порядок: 2 и 3 карточки сдвигаем вниз */
.emo-card:nth-child(2) { transform: translateY(40px); }
.emo-card:nth-child(2):hover { transform: translateY(34px); }
.emo-card:nth-child(3) { transform: translateY(0); }
.emo-card:nth-child(4) { transform: translateY(40px); }
.emo-card:nth-child(4):hover { transform: translateY(34px); }

.emo-card__photo {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  background-color: #1F3D2B;
  background-size: cover;
  background-position: center;
}
.emo-card__photo--1 {
  background-image: image-set(
    url("assets/emotions/emo-1-desktop.webp") type("image/webp"),
    url("assets/emotions/emo-1-desktop.jpg")  type("image/jpeg")
  );
}
.emo-card__photo--2 {
  background-image: image-set(
    url("assets/emotions/emo-2-desktop.webp") type("image/webp"),
    url("assets/emotions/emo-2-desktop.jpg")  type("image/jpeg")
  );
}
.emo-card__photo--3 {
  background-image: image-set(
    url("assets/emotions/emo-3-desktop.webp") type("image/webp"),
    url("assets/emotions/emo-3-desktop.jpg")  type("image/jpeg")
  );
}
.emo-card__photo--4 {
  background-image: image-set(
    url("assets/emotions/emo-4-desktop.webp") type("image/webp"),
    url("assets/emotions/emo-4-desktop.jpg")  type("image/jpeg")
  );
}
/* Fallback: браузеры без image-set с type() — отдаём JPEG напрямую */
@supports not (background-image: image-set(url("x.webp") type("image/webp"))) {
  .emo-card__photo--1 { background-image: url("assets/emotions/emo-1-desktop.jpg"); }
  .emo-card__photo--2 { background-image: url("assets/emotions/emo-2-desktop.jpg"); }
  .emo-card__photo--3 { background-image: url("assets/emotions/emo-3-desktop.jpg"); }
  .emo-card__photo--4 { background-image: url("assets/emotions/emo-4-desktop.jpg"); }
}
.emo-card__body {
  padding: 32px 32px 36px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  flex-grow: 1;
}
.emo-card__num {
  font-family: var(--f-body);
  font-size: 12px;
  letter-spacing: .25em;
  color: var(--c-orange);
  text-transform: uppercase;
  font-weight: 600;
}
.emo-card__title {
  font-family: var(--f-display);
  font-weight: 600;
  font-size: clamp(28px, 2.6vw, 40px);
  line-height: .98;
  margin: 0;
  color: var(--c-green-deep);
  text-transform: uppercase;
  letter-spacing: .005em;
}
.emo-card__text {
  margin: 0;
  font-size: 15px;
  line-height: 1.6;
  color: #444;
}

@media (max-width: 760px) {
  .emotions__grid { grid-template-columns: 1fr; gap: 24px; }
  .emo-card,
  .emo-card:nth-child(2),
  .emo-card:nth-child(4) { transform: none; }
  .emo-card:hover,
  .emo-card:nth-child(2):hover,
  .emo-card:nth-child(4):hover { transform: translateY(-6px); }
}

/* ════════════════════════════════════════════════════════
   ЭКРАН 3 — 4 ПРОДУКТА
   ════════════════════════════════════════════════════════ */
.products {
  background: var(--c-green-deep);
  color: var(--c-cream-text);
  padding: clamp(80px, 12vw, 160px) var(--gutter);
  position: relative;
}
.products__head {
  max-width: var(--container);
  margin: 0 auto 80px;
}

.products__grid {
  max-width: var(--container);
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}
.product {
  position: relative;
  background: #1a3424;
  border-radius: var(--radius-lg);
  overflow: hidden;
  border: 1px solid rgba(247,239,227,.06);
  transition: transform .25s, box-shadow .25s, border-color .25s;
  display: flex;
  flex-direction: column;
}
.product:hover {
  transform: translateY(-6px);
  border-color: var(--c-orange);
  box-shadow: 0 40px 60px -30px rgba(0,0,0,.6);
}
.product--featured { border-color: var(--c-orange); }
.product__badge {
  position: absolute;
  top: 18px; right: 18px;
  z-index: 3;
  background: var(--c-orange);
  color: #fff;
  font-family: var(--f-display);
  font-size: 13px;
  letter-spacing: .15em;
  padding: 6px 14px;
  border-radius: var(--radius);
  text-transform: uppercase;
}
.product__photo {
  height: 220px;
  position: relative;
  background-size: cover;
  background-position: center;
}
.product__photo--1 {
  background:
    linear-gradient(135deg, rgba(255,107,0,.2), transparent 60%),
    linear-gradient(45deg, #2a4a32 0%, #1a3424 50%, #4a3818 100%);
}
.product__photo--1::after {
  content: '🏔'; font-size: 80px;
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  opacity: .15;
}
.product__photo--2 {
  background:
    radial-gradient(circle at 70% 30%, rgba(255,107,0,.4), transparent 50%),
    linear-gradient(120deg, #5a2818 0%, #2a3d2d 60%, #1F3D2B 100%);
}
.product__photo--2::after {
  content: '🔥'; font-size: 80px;
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  opacity: .25;
}
.product__photo--3 {
  background:
    linear-gradient(180deg, rgba(31,61,43,.3) 0%, rgba(18,18,18,.7) 100%),
    linear-gradient(60deg, #1a3424 0%, #2a4a32 100%);
}
.product__photo--3::after {
  content: '⛺'; font-size: 80px;
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  opacity: .25;
}
.product__photo--4 {
  background:
    linear-gradient(135deg, rgba(255,107,0,.15), transparent 50%),
    linear-gradient(225deg, #14291C 0%, #1a3424 50%, #6B7F5E 100%);
}
.product__photo--4::after {
  content: '🧭'; font-size: 80px;
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  opacity: .2;
}
.product__photo-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to bottom, transparent 50%, rgba(18,18,18,.4) 100%);
}
.product__body {
  padding: 24px 24px 28px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  flex-grow: 1;
}
.product__top {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  font-size: 12px;
  letter-spacing: .15em;
  text-transform: uppercase;
}
.product__kind { color: var(--c-orange); font-weight: 600; }
.product__time { color: rgba(247,239,227,.6); }
.product__price {
  font-family: var(--f-display);
  font-size: 32px;
  line-height: 1;
  color: var(--c-cream-text);
}
.product__price b { color: var(--c-cream-text); font-weight: 400; }
.product__price span {
  font-size: 16px;
  opacity: .6;
  margin-left: 4px;
}
.product__desc {
  margin: 0;
  font-size: 14px;
  line-height: 1.5;
  color: rgba(247,239,227,.75);
  flex-grow: 1;
}
.product__more {
  font-family: var(--f-display);
  font-size: 14px;
  letter-spacing: .15em;
  text-transform: uppercase;
  color: var(--c-orange);
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding-top: 8px;
  border-top: 1px solid rgba(247,239,227,.1);
  transition: gap .2s, color .2s;
}
.product__more:hover { gap: 14px; color: #fff; }

@media (max-width: 980px) {
  .products__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px) {
  .products__grid { grid-template-columns: 1fr; }
}

/* ════════════════════════════════════════════════════════
   ЭКРАН 4 — МАРШРУТЫ
   ════════════════════════════════════════════════════════ */
.routes {
  background: var(--c-beige);
  padding: clamp(80px, 12vw, 160px) var(--gutter);
}
.routes__head {
  max-width: var(--container);
  margin: 0 auto 56px;
}
.routes__title {
  font-weight: 600;
}
.routes__title-accent {
  color: var(--c-orange);
}
.routes__lead {
  list-style: none;
  margin: 24px 0 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 8px 28px;
  font-size: 16px;
  color: #555;
  max-width: 920px;
}
.routes__lead li {
  position: relative;
  padding-left: 18px;
}
.routes__lead li::before {
  content: '';
  position: absolute;
  left: 0; top: 50%;
  width: 8px; height: 8px;
  border-radius: 50%;
  background: var(--c-orange);
  transform: translateY(-50%);
}
@media (max-width: 760px) {
  .routes__lead {
    flex-direction: column;
    gap: 10px;
  }
}

.route-list {
  list-style: none;
  margin: 0 auto;
  padding: 0;
  max-width: var(--container);
  display: flex;
  flex-direction: column;
  border-top: 2px solid var(--c-green-deep);
}

/* details базовый сброс */
.route { display: block; border-bottom: 1px solid var(--c-line); transition: background .15s; }
.route summary { list-style: none; cursor: pointer; }
.route summary::-webkit-details-marker { display: none; }
.route:hover { background: rgba(255,107,0,.04); }
.route--featured { background: rgba(255,107,0,.06); }
.route--featured:hover { background: rgba(255,107,0,.1); }
.route--top {
  background: var(--c-green-deep);
  color: var(--c-cream-text);
  border-bottom-color: var(--c-green-deep);
}
.route--top:hover { background: #1a3424; }

.route__head {
  display: grid;
  grid-template-columns: 64px 1fr auto auto;
  gap: 28px;
  align-items: center;
  padding: 26px 16px;
  transition: padding .2s;
}
.route:hover .route__head { padding-left: 22px; }

.route__num {
  font-family: var(--f-display);
  font-weight: 600;
  font-size: 48px;
  line-height: 1;
  color: var(--c-green);
  opacity: .35;
  letter-spacing: .02em;
}
.route--top .route__num { color: var(--c-orange); opacity: 1; }
.route[open] .route__num { opacity: 1; color: var(--c-orange); }

.route__main { min-width: 0; }
.route__title {
  font-family: var(--f-display);
  font-weight: 600;
  font-size: clamp(22px, 2.2vw, 32px);
  margin: 0 0 4px;
  text-transform: uppercase;
  letter-spacing: .005em;
  color: var(--c-green-deep);
  line-height: 1.05;
  display: flex;
  align-items: baseline;
  gap: 12px;
  flex-wrap: wrap;
}
.route--top .route__title { color: var(--c-cream-text); }
.route__flag {
  font-family: var(--f-brush);
  font-size: 26px;
  color: var(--c-orange);
  font-weight: 700;
  transform: rotate(-4deg);
  display: inline-block;
}
.route__sub {
  margin: 0;
  font-size: 14px;
  color: #666;
  line-height: 1.4;
}
.route--top .route__sub { color: rgba(247,239,227,.7); }

.route__meta {
  display: flex;
  align-items: center;
  gap: 22px;
}
.route__time {
  font-family: var(--f-display);
  font-weight: 600;
  font-size: 22px;
  color: var(--c-green-deep);
  letter-spacing: .04em;
}
.route--top .route__time { color: var(--c-cream-text); }

.route__diff {
  display: inline-flex;
  gap: 3px;
}
.route__diff i {
  width: 8px; height: 8px;
  border-radius: 50%;
  background: rgba(31,61,43,.2);
  display: block;
}
.route--top .route__diff i { background: rgba(247,239,227,.2); }
.route__diff[data-level="1"] i:nth-child(-n+1),
.route__diff[data-level="2"] i:nth-child(-n+2),
.route__diff[data-level="3"] i:nth-child(-n+3),
.route__diff[data-level="4"] i:nth-child(-n+4),
.route__diff[data-level="5"] i:nth-child(-n+5) { background: var(--c-orange); }

.route__price {
  font-family: var(--f-display);
  font-weight: 600;
  font-size: 26px;
  color: var(--c-green-deep);
  letter-spacing: .03em;
  min-width: 105px;
  text-align: right;
}
.route--top .route__price { color: var(--c-orange); }

/* Кнопка-индикатор раскрытия */
.route__toggle {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-family: var(--f-body);
  font-size: 12px;
  letter-spacing: .15em;
  text-transform: uppercase;
  font-weight: 600;
  color: var(--c-orange);
  padding: 10px 14px;
  border: 1.5px solid var(--c-orange);
  border-radius: var(--radius);
  transition: background .15s, color .15s;
  white-space: nowrap;
}
.route:hover .route__toggle,
.route[open] .route__toggle {
  background: var(--c-orange);
  color: #fff;
}
.route--top .route__toggle {
  background: var(--c-orange);
  color: #fff;
}
.route--top:hover .route__toggle { background: #fff; color: var(--c-orange); }
.route__toggle-icon {
  font-family: var(--f-display);
  font-weight: 600;
  font-size: 22px;
  line-height: .8;
  transition: transform .25s;
}
.route[open] .route__toggle-icon { transform: rotate(45deg); }

/* Раскрывающееся тело маршрута */
.route__body {
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  gap: 32px;
  padding: 0 16px 32px;
  align-items: stretch;
  animation: route-open .25s ease-out;
}
@keyframes route-open {
  from { opacity: 0; transform: translateY(-8px); }
  to { opacity: 1; transform: translateY(0); }
}

.route__photo {
  position: relative;
  aspect-ratio: 16 / 10;
  border-radius: var(--radius-lg);
  overflow: hidden;
  background-size: cover;
  background-position: center;
}
.route__photo--1 { background: linear-gradient(135deg, #2a4a32 0%, #1F3D2B 100%); }
.route__photo--2 { background: linear-gradient(135deg, #6B7F5E 0%, #2a3d2d 100%); }
.route__photo--3 { background: radial-gradient(circle at 60% 40%, rgba(255,107,0,.3), transparent 60%), linear-gradient(135deg, #5a4030 0%, #2a3d2d 100%); }
.route__photo--4 { background: linear-gradient(180deg, #1F3D2B 0%, #6B7F5E 100%); }
.route__photo--5 { background: linear-gradient(135deg, #14291C 0%, #4a3818 100%); }
.route__photo--6 { background: radial-gradient(circle at 50% 60%, rgba(255,107,0,.4), transparent 60%), linear-gradient(135deg, #5a2818 0%, #2a3d2d 100%); }
.route__photo--7 { background: linear-gradient(135deg, #c97a3a 0%, #2a3d2d 60%, #14291C 100%); }
.route__photo-tag {
  position: absolute;
  bottom: 14px;
  left: 14px;
  font-size: 11px;
  letter-spacing: .15em;
  text-transform: uppercase;
  color: var(--c-cream-text);
  background: rgba(18,18,18,.75);
  padding: 6px 12px;
  border-radius: var(--radius);
  font-weight: 500;
}

/* Галерея фото в карточке маршрута. Активируется JS-ом
   на .route__photo[data-photos-slug] — тогда плейсхолдер-градиент
   перекрывается реальной фото-каруселью. */
.route__photo--has-gallery {
  background: #14291C;
}
.route-gallery {
  position: absolute;
  inset: 0;
  outline: none;
}
.route-gallery:focus-visible {
  outline: 2px solid var(--c-orange);
  outline-offset: -2px;
}
.route-gallery__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  background: #14291C;
}
.route-gallery__nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 42px;
  height: 42px;
  border-radius: 50%;
  border: none;
  background: rgba(18,18,18,.6);
  color: #fff;
  cursor: pointer;
  display: grid;
  place-items: center;
  font-family: inherit;
  transition: background .15s, transform .15s;
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}
.route-gallery__nav span {
  font-size: 26px;
  line-height: 1;
  margin-top: -3px;
}
.route-gallery__nav:hover {
  background: var(--c-orange);
  transform: translateY(-50%) scale(1.06);
}
.route-gallery__nav:active { transform: translateY(-50%) scale(.96); }
.route-gallery__nav--prev { left: 12px; }
.route-gallery__nav--next { right: 12px; }
.route-gallery__nav--next span { margin-left: 2px; }
.route-gallery__nav--prev span { margin-right: 2px; }

.route-gallery__counter {
  position: absolute;
  top: 12px;
  right: 12px;
  font-size: 11px;
  letter-spacing: .12em;
  color: var(--c-cream-text);
  background: rgba(18,18,18,.7);
  padding: 5px 10px;
  border-radius: 999px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}

.route-gallery__dots {
  position: absolute;
  bottom: 14px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  gap: 6px;
  padding: 6px 10px;
  background: rgba(18,18,18,.45);
  border-radius: 999px;
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}
.route-gallery__dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: rgba(255,255,255,.55);
  border: none;
  padding: 0;
  cursor: pointer;
  transition: background .2s, width .2s, border-radius .2s;
}
.route-gallery__dot:hover { background: rgba(255,255,255,.85); }
.route-gallery__dot.is-active {
  background: var(--c-orange);
  width: 18px;
  border-radius: 3px;
}

@media (max-width: 760px) {
  .route-gallery__nav { width: 36px; height: 36px; }
  .route-gallery__nav span { font-size: 22px; }
  .route-gallery__nav--prev { left: 8px; }
  .route-gallery__nav--next { right: 8px; }
  .route-gallery__counter { font-size: 10px; padding: 4px 8px; }
}

.route__details {
  display: flex;
  flex-direction: column;
  gap: 18px;
}
.route__desc {
  margin: 0;
  font-size: 15px;
  line-height: 1.6;
  color: #444;
}
.route--top .route__desc { color: rgba(247,239,227,.85); }

.route__facts {
  list-style: none;
  margin: 0;
  padding: 18px 0;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px 28px;
  border-top: 1px solid var(--c-line);
  border-bottom: 1px solid var(--c-line);
}
.route--top .route__facts { border-color: var(--c-line-dark); }
.route__facts li {
  display: flex;
  align-items: center;
  gap: 14px;
  min-width: 0;
}
.route__fact-ico {
  flex-shrink: 0;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: rgba(255,107,0,.10);
  color: var(--c-orange);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  line-height: 1;
  font-family: var(--f-display);
  font-weight: 600;
}
.route--top .route__fact-ico { background: rgba(255,107,0,.18); }
.route__fact-meta {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.route__fact-label {
  font-family: var(--f-body);
  font-weight: 600;
  font-size: 11px;
  letter-spacing: .15em;
  text-transform: uppercase;
  color: var(--c-olive);
  line-height: 1;
}
.route--top .route__fact-label { color: var(--c-orange); }
.route__fact-value {
  font-family: var(--f-display);
  font-weight: 500;
  font-size: 18px;
  line-height: 1.1;
  color: var(--c-green-deep);
  letter-spacing: .005em;
}
.route--top .route__fact-value { color: var(--c-cream-text); }

.route__cta-row {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: auto;
}
.route__book { border: none; }
.route__more.is-disabled {
  opacity: .55;
  pointer-events: none;
  cursor: not-allowed;
}

.routes__hint {
  max-width: var(--container);
  margin: 40px auto 0;
  padding: 22px 28px;
  background: var(--c-green-deep);
  color: var(--c-cream-text);
  border-radius: var(--radius-lg);
  font-size: 16px;
  letter-spacing: .02em;
  display: flex;
  align-items: center;
  gap: 16px;
}
.routes__hint-icon {
  flex: 0 0 auto;
  font-family: var(--f-display);
  font-weight: 600;
  font-size: 32px;
  color: var(--c-orange);
  line-height: 1;
}
.routes__hint-text {
  flex: 1 1 auto;
  min-width: 0;
  margin: 0;
}

/* CTA-блок «Все маршруты в каталоге» — после блока 9 карточек на главной */
.routes__catalog-cta {
  max-width: var(--container);
  margin: 32px auto 0;
  padding: 0 var(--gutter);
  text-align: center;
}
.routes__catalog-cta-hint {
  margin: 14px 0 0;
  font-size: 14px;
  color: var(--c-olive);
  letter-spacing: .03em;
}

.routes__hint b {
  color: var(--c-orange);
  font-family: var(--f-display);
  font-size: 22px;
  font-weight: 600;
  letter-spacing: .04em;
}

@media (max-width: 720px) {
  .routes__hint {
    padding: 18px 18px;
    gap: 14px;
    font-size: 15px;
    line-height: 1.4;
    align-items: flex-start;
  }
  .routes__hint-icon {
    font-size: 28px;
    margin-top: 1px;
  }
  .routes__hint b {
    font-size: 17px;
    letter-spacing: .03em;
  }
}

@media (max-width: 880px) {
  .route__head {
    grid-template-columns: 48px 1fr;
    grid-template-rows: auto auto auto;
    gap: 8px 18px;
    padding: 22px 12px;
  }
  .route__num { grid-row: span 3; font-size: 36px; }
  .route__meta {
    grid-column: 2;
    flex-wrap: wrap;
    gap: 14px;
  }
  .route__price { min-width: 0; text-align: left; }
  .route__toggle {
    grid-column: 2;
    justify-self: start;
    margin-top: 4px;
  }
  .route__body {
    grid-template-columns: 1fr;
    padding: 0 12px 24px;
    gap: 20px;
  }
  .route__facts { grid-template-columns: 1fr; gap: 10px; }
}

/* ════════════════════════════════════════════════════════
   ЭКРАН 5 — УТП
   ════════════════════════════════════════════════════════ */
.usp {
  background: var(--c-black);
  color: var(--c-cream-text);
  padding: clamp(80px, 12vw, 160px) var(--gutter);
  position: relative;
  overflow: hidden;
}
.usp::before {
  content: '';
  position: absolute;
  top: -10%; right: -10%;
  width: 60%; height: 60%;
  background: radial-gradient(circle, rgba(255,107,0,.15) 0%, transparent 60%);
  filter: blur(60px);
  pointer-events: none;
}
.usp__head {
  max-width: var(--container);
  margin: 0 auto 80px;
  position: relative;
}
.usp__grid {
  max-width: var(--container);
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
  background: var(--c-line-dark);
  border: 1px solid var(--c-line-dark);
  position: relative;
}
.usp-card {
  background: var(--c-black);
  padding: 44px 36px;
  display: flex;
  flex-direction: column;
  gap: 16px;
  transition: background .2s;
  position: relative;
}
.usp-card:hover { background: #1c1c1c; }
.usp-card__icon {
  font-size: 44px;
  line-height: 1;
  color: var(--c-orange);
  margin-bottom: 8px;
}
.usp-card__title {
  font-family: var(--f-display);
  font-size: 28px;
  letter-spacing: .005em;
  margin: 0;
  text-transform: uppercase;
  color: var(--c-cream-text);
  line-height: 1;
}
.usp-card__text {
  margin: 0;
  font-size: 15px;
  line-height: 1.55;
  color: rgba(247,239,227,.7);
}

@media (max-width: 880px) {
  .usp__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px) {
  .usp__grid { grid-template-columns: 1fr; }
}

/* ════════════════════════════════════════════════════════
   ЭКРАН 6 — БЕЗОПАСНОСТЬ
   ════════════════════════════════════════════════════════ */
.safety {
  background: var(--c-beige-warm);
  padding: clamp(80px, 12vw, 160px) var(--gutter);
}
.safety__container {
  max-width: var(--container);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  gap: 80px;
  align-items: start;
}
.safety__head {
  position: sticky;
  top: 100px;
}
.safety__lead {
  font-size: 17px;
  line-height: 1.6;
  color: #555;
  margin: 24px 0 0;
}
.safety__list {
  display: flex;
  flex-direction: column;
}
.safety__item {
  display: grid;
  grid-template-columns: 60px 1fr;
  gap: 24px;
  padding: 28px 0;
  border-bottom: 1px dashed rgba(31,61,43,.2);
  align-items: start;
}
.safety__item:last-child { border-bottom: none; }
.safety__mark {
  font-size: 32px;
  line-height: 1;
  text-align: center;
}
.safety__item h4 {
  font-family: var(--f-display);
  font-size: 24px;
  margin: 0 0 6px;
  text-transform: uppercase;
  color: var(--c-green-deep);
  letter-spacing: .005em;
  line-height: 1;
}
.safety__item p {
  margin: 0;
  font-size: 15px;
  color: #555;
  line-height: 1.5;
}

@media (max-width: 880px) {
  .safety__container { grid-template-columns: 1fr; gap: 40px; }
  .safety__head { position: static; }
}

/* ════════════════════════════════════════════════════════
   ЭКРАН 7 — ОТЗЫВЫ
   ════════════════════════════════════════════════════════ */
.reviews {
  background: var(--c-green-deep);
  color: var(--c-cream-text);
  padding: clamp(80px, 12vw, 160px) var(--gutter);
}
.reviews__head {
  max-width: var(--container);
  margin: 0 auto 56px;
}
.reviews__lead {
  font-size: 16px;
  line-height: 1.6;
  color: rgba(247,239,227,.75);
  max-width: 620px;
  margin: 16px 0 0;
}
.reviews__grid {
  max-width: var(--container);
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}
.review {
  background: #1a3424;
  padding: 28px 26px;
  border-radius: var(--radius-lg);
  border: 1px solid rgba(247,239,227,.08);
  display: flex;
  flex-direction: column;
  gap: 14px;
  transition: transform .2s, border-color .2s;
  text-decoration: none;
  color: inherit;
}
.review:hover { transform: translateY(-4px); border-color: var(--c-orange); }
.review__stars {
  color: var(--c-orange);
  font-size: 18px;
  letter-spacing: 4px;
}
.review__text {
  margin: 0;
  font-size: 15px;
  line-height: 1.6;
  color: rgba(247,239,227,.92);
  flex-grow: 1;
}
.review__text b { color: #fff; font-weight: 600; }
.review--big {
  grid-column: span 2;
  background: var(--c-orange);
  border-color: var(--c-orange);
  color: #fff;
}
.review--big:hover { border-color: #fff; }
.review--big .review__stars { color: #fff; }
.review--big .review__text b { color: #2a1100; }
.review__text--xl {
  font-family: var(--f-display);
  font-weight: 600;
  font-size: clamp(28px, 3.2vw, 44px);
  line-height: 1.05;
  letter-spacing: .005em;
  text-transform: uppercase;
}
.review__text--xl b { font-weight: 700; color: #2a1100; }
.review__foot {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  font-size: 12px;
  letter-spacing: .15em;
  text-transform: uppercase;
  padding-top: 14px;
  border-top: 1px solid rgba(247,239,227,.1);
  font-weight: 500;
}
.review__author { color: var(--c-orange); font-weight: 600; }
.review--big .review__author,
.review--big .review__src { color: rgba(255,255,255,.9); }
.review--big .review__foot { border-top-color: rgba(255,255,255,.3); }
.review__src { opacity: .65; }
.review__ext {
  display: inline-block;
  margin-left: 4px;
  color: var(--c-orange);
  opacity: 1;
}
.review--big .review__ext { color: #fff; }

/* Слайдер фото с маршрутов вместо одной из карточек */
.review-gallery {
  position: relative;
  border-radius: var(--radius-lg);
  overflow: hidden;
  min-height: 240px;
  background: #1a3424;
  border: 1px solid rgba(247,239,227,.08);
  isolation: isolate;
}
.review-gallery__viewport {
  position: relative;
  width: 100%;
  height: 100%;
  min-height: 260px;
  overflow: hidden;
}
.review-gallery__track {
  position: relative;
  width: 100%;
  height: 100%;
  min-height: 260px;
}
.review-gallery__slide {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: flex-end;
  padding: 18px;
  opacity: 0;
  transition: opacity .45s ease;
  pointer-events: none;
}
.review-gallery__slide.is-active {
  opacity: 1;
  pointer-events: auto;
}
.review-gallery__slide::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(18,18,18,.8) 0%, rgba(18,18,18,.2) 35%, transparent 60%);
  pointer-events: none;
}
.review-gallery__cap {
  position: relative;
  z-index: 1;
  font-size: 12px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--c-cream-text);
  font-weight: 600;
  background: rgba(18,18,18,.6);
  padding: 6px 12px;
  border-radius: var(--radius);
  backdrop-filter: blur(4px);
}

/* Стрелки навигации */
.review-gallery__nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 44px;
  height: 44px;
  border-radius: 50%;
  border: none;
  background: rgba(18,18,18,.6);
  color: var(--c-cream-text);
  font-size: 28px;
  line-height: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 3;
  transition: background .15s, color .15s, transform .15s;
  backdrop-filter: blur(4px);
  padding: 0;
}
.review-gallery__nav:hover {
  background: var(--c-orange);
  color: #fff;
  transform: translateY(-50%) scale(1.08);
}
.review-gallery__nav--prev { left: 12px; }
.review-gallery__nav--next { right: 12px; }

/* Точки-индикаторы */
.review-gallery__dots {
  position: absolute;
  bottom: 14px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  gap: 8px;
  z-index: 3;
}
.review-gallery__dots button {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  border: none;
  background: rgba(247,239,227,.5);
  padding: 0;
  cursor: pointer;
  transition: background .15s, width .15s;
}
.review-gallery__dots button.is-active {
  background: var(--c-orange);
  width: 24px;
  border-radius: 4px;
}
.review-gallery__dots button:hover { background: var(--c-cream-text); }
.review-gallery__dots button.is-active:hover { background: var(--c-orange); }

.reviews__links {
  max-width: var(--container);
  margin: 48px auto 0;
  text-align: center;
  font-size: 14px;
  letter-spacing: .05em;
  opacity: .9;
  color: var(--c-cream-text);
}
.reviews__links a {
  color: var(--c-orange);
  font-family: var(--f-display);
  font-weight: 600;
  font-size: 16px;
  letter-spacing: .12em;
  margin: 0 14px;
  text-transform: uppercase;
  border-bottom: 1px solid transparent;
  transition: border-color .15s;
}
.reviews__links a:hover { border-color: var(--c-orange); }

@media (max-width: 980px) {
  .reviews__grid { grid-template-columns: 1fr 1fr; }
  .review--big { grid-column: span 2; }
  .review-gallery { grid-column: span 2; }
}
@media (max-width: 600px) {
  .reviews__grid { grid-template-columns: 1fr; }
  .review--big { grid-column: span 1; }
  .review-gallery { grid-column: span 1; }
}

/* ════════════════════════════════════════════════════════
   ЭКРАН 8 — ЛИЦА
   ════════════════════════════════════════════════════════ */
.faces {
  background: var(--c-beige);
  padding: clamp(80px, 12vw, 160px) var(--gutter);
}
.faces__head {
  max-width: var(--container);
  margin: 0 auto 64px;
}
.faces__lead {
  font-size: 17px;
  line-height: 1.6;
  color: #555;
  max-width: 620px;
  margin: 16px 0 0;
}

.faces__grid {
  max-width: var(--container);
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
.face {
  background: #fff;
  border-radius: var(--radius-lg);
  overflow: hidden;
  border: 1px solid var(--c-line);
  display: flex;
  flex-direction: column;
  transition: transform .2s, box-shadow .2s;
}
.face:hover {
  transform: translateY(-6px);
  box-shadow: 0 30px 60px -30px rgba(31,61,43,.3);
}
.face__photo {
  position: relative;
  aspect-ratio: 4 / 5;
  overflow: hidden;
  background: #1F3D2B;
}
.face__photo picture,
.face__photo img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

/* Видео-карточка инструктажа */
.face--video {
  background: var(--c-green-deep);
  color: var(--c-cream-text);
  border-color: var(--c-green-deep);
}
.face__video {
  position: relative;
  aspect-ratio: 4 / 5;
  background:
    radial-gradient(circle at 50% 40%, rgba(255,107,0,.25) 0%, transparent 60%),
    linear-gradient(135deg, #14291C 0%, #1a3424 50%, #2a3d2d 100%);
  border-bottom: 1px solid var(--c-line-dark);
  overflow: hidden;
}
.face__video-el {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
  background: #000;
  display: block;
}
.face__video-placeholder {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 16px;
  cursor: pointer;
  transition: background .2s;
  background: transparent;
  border: 0;
  padding: 0;
  font: inherit;
  color: inherit;
  text-align: center;
  width: 100%;
  z-index: 2;
}
.face__video-placeholder[hidden] { display: none; }
.face__video-placeholder:hover { background: rgba(255,107,0,.06); }
.face__video-play {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  background: var(--c-orange);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 28px;
  padding-left: 6px;
  box-shadow: 0 14px 40px -8px rgba(255,107,0,.6);
  transition: transform .2s;
}
.face__video-placeholder:hover .face__video-play { transform: scale(1.1); }
.face__video-label {
  font-family: var(--f-display);
  font-weight: 600;
  font-size: 22px;
  letter-spacing: .05em;
  text-transform: uppercase;
  color: var(--c-cream-text);
}
.face__video-sub {
  font-size: 11px;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--c-orange);
  font-weight: 600;
}

.face__body {
  padding: 26px 26px 30px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  flex-grow: 1;
}
.face__role {
  font-size: 11px;
  letter-spacing: .25em;
  text-transform: uppercase;
  color: var(--c-orange);
  font-weight: 600;
  line-height: 1.4;
}
.face__name {
  font-family: var(--f-display);
  font-weight: 600;
  font-size: clamp(28px, 2.5vw, 38px);
  margin: 0;
  text-transform: uppercase;
  color: var(--c-green-deep);
  line-height: 1;
  letter-spacing: .005em;
}
.face--video .face__name { color: var(--c-cream-text); }
.face__quote {
  margin: 0;
  font-size: 15px;
  line-height: 1.55;
  color: #555;
  font-style: italic;
}
.face__quote--plain { font-style: normal; }
.face--video .face__quote { color: rgba(247,239,227,.85); }
.face--video .face__quote b { color: #fff; font-weight: 600; }
.face__tags {
  display: flex;
  flex-direction: column;
  gap: 8px;
  font-size: 13px;
  color: var(--c-olive);
  padding-top: 14px;
  border-top: 1px solid var(--c-line);
  margin-top: auto;
}
.face__tags span { font-weight: 500; }

@media (max-width: 880px) {
  .faces__grid { grid-template-columns: 1fr 1fr; }
  .face--video { grid-column: span 2; }
  .face--video .face__video { aspect-ratio: 16 / 6; }
}
@media (max-width: 560px) {
  .faces__grid { grid-template-columns: 1fr; }
  .face--video { grid-column: span 1; }
  .face--video .face__video { aspect-ratio: 16 / 9; }
}

/* ════════════════════════════════════════════════════════
   ЭКРАН 9 — ЦЕНЫ И СКИДКИ
   ════════════════════════════════════════════════════════ */
.price {
  background: var(--c-cream);
  padding: clamp(80px, 12vw, 160px) var(--gutter);
}
.price__head {
  max-width: var(--container);
  margin: 0 auto 56px;
}
.price__lead {
  font-size: 17px;
  line-height: 1.6;
  color: #555;
  max-width: 620px;
  margin: 16px 0 0;
}
.price__grid {
  max-width: var(--container);
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(360px, 1fr);
  grid-template-areas:
    "table discounts"
    "hint  discounts";
  column-gap: 36px;
  row-gap: 16px;
  align-items: start;
}
.price-table { grid-area: table; }
.price-table__hint { grid-area: hint; }
.discounts { grid-area: discounts; }

.price-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 16px;
}
.price-table th {
  font-family: var(--f-display);
  font-size: 13px;
  letter-spacing: .15em;
  text-transform: uppercase;
  color: var(--c-olive);
  text-align: left;
  padding: 14px 16px;
  border-bottom: 2px solid var(--c-green-deep);
}
.price-table th:nth-child(2),
.price-table th:nth-child(3) { text-align: center; }
.price-table th:nth-child(4) { text-align: right; }
.price-table td {
  padding: 18px 16px;
  border-bottom: 1px solid var(--c-line);
}
.price-table td:nth-child(1) { font-weight: 500; }
.price-table td:nth-child(2),
.price-table td:nth-child(3) { text-align: center; color: #666; }
.price-table td:nth-child(4) {
  text-align: right;
  font-family: var(--f-display);
  font-size: 22px;
  color: var(--c-green-deep);
  letter-spacing: .04em;
}
.price-table tr.is-hl td {
  background: rgba(255,107,0,.06);
}
.price-table tr.is-hl td:nth-child(4) { color: var(--c-orange); }

.discounts {
  background: var(--c-green-deep);
  color: var(--c-cream-text);
  padding: 36px 32px;
  border-radius: var(--radius-lg);
  display: flex;
  flex-direction: column;
  gap: 24px;
  position: sticky;
  top: 100px;
}
.discounts__title {
  font-family: var(--f-display);
  font-size: 32px;
  margin: 0;
  text-transform: uppercase;
  color: var(--c-cream-text);
  letter-spacing: .01em;
}
.discounts__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.discounts__list li {
  display: grid;
  grid-template-columns: 80px 1fr;
  gap: 16px;
  align-items: center;
  padding: 18px 0;
  border-bottom: 1px solid var(--c-line-dark);
  font-size: 15px;
  line-height: 1.4;
}
.discounts__list li:last-child { border-bottom: none; }
.discounts__num {
  font-family: var(--f-display);
  font-size: 32px;
  color: var(--c-orange);
  letter-spacing: .03em;
  line-height: 1;
}
.discounts__body {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.discounts__text {
  margin: 0;
  flex: 1;
}
.discounts__more {
  flex-shrink: 0;
}
.discounts__more {
  font-family: var(--f-body);
  font-size: 13px;
  letter-spacing: .04em;
  background: transparent;
  color: var(--c-cream-text);
  border: 1px solid rgba(255, 245, 224, .35);
  padding: 8px 14px;
  border-radius: 999px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  transition: background .15s, border-color .15s, color .15s;
}
.discounts__more:hover {
  background: var(--c-orange);
  border-color: var(--c-orange);
  color: #fff;
}
.discounts__more span {
  font-size: inherit;
  color: inherit;
  font-family: inherit;
  letter-spacing: inherit;
  line-height: 1;
}

@media (max-width: 880px) {
  .price__grid {
    grid-template-columns: 1fr;
    grid-template-areas:
      "table"
      "hint"
      "discounts";
  }
  .discounts { position: static; }
  .price-table { font-size: 14px; }
  .price-table td:nth-child(4) { font-size: 18px; }
  .price-table th, .price-table td { padding: 12px 8px; }
  /* Имя маршрута может переноситься — без этого «Сахрайские водопады» и
     «Лесной / Гора Гуд» с inline-тегами распирают строку. */
  .price-table td:nth-child(1) {
    word-break: break-word;
    overflow-wrap: anywhere;
  }
  .price-table { table-layout: fixed; width: 100%; }
  .price-table th:nth-child(1), .price-table td:nth-child(1) { width: 50%; }
  .price-table th:nth-child(2), .price-table td:nth-child(2) { width: 16%; }
  .price-table th:nth-child(3), .price-table td:nth-child(3) { width: 14%; }
  .price-table th:nth-child(4), .price-table td:nth-child(4) { width: 14%; text-align: right; }
  .price-table th:nth-child(5), .price-table td:nth-child(5) { width: 6%; }
}
@media (max-width: 480px) {
  .price-table { font-size: 13px; }
  .price-table td:nth-child(4) { font-size: 16px; }
  .price-table th, .price-table td { padding: 10px 6px; }
  /* На совсем узких экранах прячем колонку «Сложность» — оставляем имя/время/цену.
     Сложность остаётся в раскрытой карточке маршрута выше. */
  .price-table th:nth-child(3), .price-table td:nth-child(3) { display: none; }
  .price-table th:nth-child(1), .price-table td:nth-child(1) { width: 56%; }
  .price-table th:nth-child(2), .price-table td:nth-child(2) { width: 18%; }
  .price-table th:nth-child(4), .price-table td:nth-child(4) { width: 20%; }
  .price-table th:nth-child(5), .price-table td:nth-child(5) { width: 6%; }
  /* Inline-тег (NEW / 🌊 лето) на узком — переносим под имя */
  .price-table__tag {
    display: inline-block;
    margin-left: 0;
    margin-top: 2px;
  }
}

/* —————— Кликабельные строки таблицы цен —————— */
.price-table tbody tr {
  cursor: pointer;
  transition: background .15s;
}
.price-table tbody tr:hover {
  background: rgba(255,107,0,.08) !important;
}
.price-table__go {
  font-family: var(--f-display);
  font-weight: 600;
  color: var(--c-orange);
  text-align: right;
  font-size: 22px;
  width: 30px;
  transition: transform .2s;
}
.price-table tbody tr:hover .price-table__go { transform: translateX(4px); }
.price-table__hint {
  margin: 16px 0 0;
  font-size: 13px;
  color: var(--c-olive);
  font-style: italic;
  letter-spacing: .02em;
}

/* —————— Кнопки в блоке Extras —————— */
.extra__btn {
  margin-top: auto;
  align-self: flex-start;
  font-family: var(--f-body);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--c-orange);
  background: transparent;
  border: 1.5px solid var(--c-orange);
  padding: 12px 20px;
  border-radius: var(--radius);
  display: inline-flex;
  align-items: center;
  gap: 10px;
  transition: background .15s, color .15s, gap .15s;
  cursor: pointer;
}
.extra__btn:hover {
  background: var(--c-orange);
  color: #fff;
  gap: 14px;
}

/* —————— Лид в блоке контактов —————— */
.contacts__lead {
  font-size: 16px;
  line-height: 1.6;
  color: rgba(247,239,227,.8);
  max-width: 480px;
  margin: 16px 0 28px;
}

/* —————— МОДАЛЬНОЕ ОКНО —————— */
.modal {
  position: fixed;
  inset: 0;
  z-index: 200;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 20px;
}
.modal.is-open { display: flex; animation: modal-in .2s ease-out; }
@keyframes modal-in {
  from { opacity: 0; }
  to { opacity: 1; }
}
.modal__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(18,18,18,.78);
  backdrop-filter: blur(6px);
  cursor: pointer;
}
.modal__dialog {
  position: relative;
  z-index: 1;
  background: var(--c-beige);
  border-radius: var(--radius-lg);
  padding: 44px 48px 40px;
  max-width: 520px;
  width: 100%;
  max-height: 90vh;
  overflow-y: auto;
  box-shadow: 0 40px 100px -20px rgba(0,0,0,.6);
  animation: modal-pop .25s cubic-bezier(.2,.9,.3,1.2);
}
@keyframes modal-pop {
  from { opacity: 0; transform: translateY(20px) scale(.96); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}
.modal__close {
  position: absolute;
  top: 14px;
  right: 14px;
  width: 40px;
  height: 40px;
  border: none;
  background: transparent;
  font-size: 32px;
  line-height: 1;
  color: var(--c-green-deep);
  cursor: pointer;
  border-radius: 50%;
  transition: background .15s, color .15s;
  display: flex;
  align-items: center;
  justify-content: center;
}
.modal__close:hover {
  background: var(--c-orange);
  color: #fff;
}
.modal__title {
  font-family: var(--f-display);
  font-weight: 600;
  font-size: clamp(28px, 3vw, 36px);
  text-transform: uppercase;
  letter-spacing: .005em;
  color: var(--c-green-deep);
  margin: 0 0 12px;
  line-height: 1.05;
}
.modal__sub {
  margin: 0 0 24px;
  font-size: 15px;
  line-height: 1.5;
  color: #555;
}
.modal__form {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.modal__field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.modal__field span {
  font-size: 12px;
  letter-spacing: .15em;
  text-transform: uppercase;
  color: var(--c-olive);
  font-weight: 600;
}
.modal__field input,
.modal__field textarea {
  font-family: var(--f-body);
  font-size: 15px;
  padding: 12px 14px;
  border: 1.5px solid var(--c-line);
  border-radius: var(--radius);
  background: #fff;
  color: var(--c-black);
  transition: border-color .15s, box-shadow .15s;
  resize: vertical;
}
.modal__field input:focus,
.modal__field textarea:focus {
  outline: none;
  border-color: var(--c-orange);
  box-shadow: 0 0 0 3px rgba(255,107,0,.15);
}
.modal__submit {
  justify-content: center;
  margin-top: 6px;
}
.modal__small {
  margin: 4px 0 0;
  font-size: 12px;
  color: #666;
  line-height: 1.5;
  text-align: center;
}
.modal__small a {
  color: var(--c-orange);
  border-bottom: 1px solid currentColor;
}

.modal__consent {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin: -2px 0 0;
  font-size: 13px;
  color: #555;
  line-height: 1.5;
  cursor: pointer;
  user-select: none;
}
.modal__consent input[type="checkbox"] {
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  margin-top: 1px;
  accent-color: var(--c-orange);
  cursor: pointer;
}
.modal__consent a {
  color: var(--c-orange);
  border-bottom: 1px solid currentColor;
}

/* Honeypot — скрываем от живых пользователей всеми способами */
.modal__honeypot {
  position: absolute !important;
  left: -10000px !important;
  top: auto;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

/* Статус-строка формы (отправка / спасибо / ошибка) */
.modal__status {
  margin: 6px 0 0;
  min-height: 18px;
  font-size: 13px;
  line-height: 1.45;
  text-align: center;
  color: #666;
}
.modal__form.is-sending .modal__submit { opacity: .65; pointer-events: none; }
.modal__form.is-sending .modal__status { color: #555; }
.modal__form.is-success .modal__status { color: #1f8a3b; font-weight: 600; }
.modal__form.is-error   .modal__status { color: #c0392b; }
.modal__form.is-success .modal__field,
.modal__form.is-success .modal__consent,
.modal__form.is-success .modal__submit { display: none; }

@media (max-width: 600px) {
  .modal__dialog { padding: 36px 24px 28px; }
}

/* (бывший блок CSS корпоративов оставлен ниже как dead-code, не используется) */

/* ════════════════════════════════════════════════════════
   ЭКРАН 10 — КОРПОРАТИВАМ
   ════════════════════════════════════════════════════════ */
.corp {
  background: var(--c-black);
  color: var(--c-cream-text);
  padding: clamp(80px, 12vw, 140px) var(--gutter);
  position: relative;
  overflow: hidden;
}
.corp__inner {
  max-width: var(--container);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 80px;
  align-items: center;
}
.corp__lead {
  font-size: 17px;
  line-height: 1.6;
  color: rgba(247,239,227,.85);
  margin: 16px 0 28px;
  max-width: 520px;
}
.h2 .num {
  color: var(--c-orange);
  font-weight: 400;
  font-size: 1.3em;
  display: inline-block;
  transform: translateY(.05em);
}
.corp__features {
  list-style: none;
  margin: 0 0 36px;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.corp__features li {
  font-size: 16px;
  line-height: 1.5;
  display: flex;
  gap: 14px;
  align-items: baseline;
  color: rgba(247,239,227,.92);
}
.corp__features span {
  color: var(--c-orange);
  font-size: 18px;
  flex-shrink: 0;
}

.corp__right {
  position: relative;
  height: 540px;
}
.corp__photo {
  position: absolute;
  inset: 0;
  border-radius: var(--radius-lg);
  background:
    linear-gradient(135deg, rgba(255,107,0,.15) 0%, transparent 50%),
    linear-gradient(45deg, #2a4a32 0%, #1a3424 30%, #4a3818 100%);
  border: 1px solid rgba(247,239,227,.06);
  overflow: hidden;
}
.corp__photo::before {
  content: '🏢';
  font-size: 200px;
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: .12;
}
.corp__sticker {
  position: absolute;
  bottom: -32px;
  left: -32px;
  background: var(--c-orange);
  padding: 28px 32px;
  border-radius: var(--radius-lg);
  color: #fff;
  box-shadow: 0 30px 60px -20px rgba(255,107,0,.5);
  transform: rotate(-3deg);
  z-index: 2;
}
.corp__sticker-num {
  font-family: var(--f-display);
  font-size: 56px;
  line-height: .9;
  letter-spacing: .02em;
}
.corp__sticker-text {
  font-size: 12px;
  letter-spacing: .15em;
  text-transform: uppercase;
  margin-top: 8px;
  opacity: .9;
  line-height: 1.3;
}

@media (max-width: 980px) {
  .corp__inner { grid-template-columns: 1fr; gap: 40px; }
  .corp__right { height: 360px; }
  .corp__sticker { bottom: -24px; left: -16px; }
}

/* ════════════════════════════════════════════════════════
   ЭКРАН 11 — ЕЩЁ МОЖЕМ ПОМОЧЬ
   ════════════════════════════════════════════════════════ */
.extras {
  background: var(--c-beige);
  padding: clamp(80px, 12vw, 140px) var(--gutter);
}
.extras__head {
  max-width: var(--container);
  margin: 0 auto 60px;
}
.extras__grid {
  max-width: var(--container);
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
.extra {
  background: #fff;
  padding: 36px 32px;
  border-radius: var(--radius-lg);
  border: 1px solid var(--c-line);
  display: flex;
  flex-direction: column;
  gap: 16px;
  transition: transform .2s, box-shadow .2s;
}
.extra:hover {
  transform: translateY(-6px);
  box-shadow: 0 30px 60px -30px rgba(31,61,43,.3);
}
.extra__icon { font-size: 40px; line-height: 1; }
.extra__title {
  font-family: var(--f-display);
  font-size: 28px;
  margin: 0;
  text-transform: uppercase;
  color: var(--c-green-deep);
  letter-spacing: .005em;
  line-height: 1;
}
.extra__text {
  margin: 0;
  font-size: 15px;
  color: #555;
  line-height: 1.55;
}

@media (max-width: 880px) {
  .extras__grid { grid-template-columns: 1fr; }
}

/* ════════════════════════════════════════════════════════
   FAQ
   ════════════════════════════════════════════════════════ */
.faq {
  background: var(--c-beige-warm);
  padding: clamp(80px, 12vw, 140px) var(--gutter);
}
.faq__head {
  max-width: 880px;
  margin: 0 auto 56px;
}
.faq__list {
  max-width: 880px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
}
.faq-item {
  border-top: 1px solid rgba(31,61,43,.2);
  padding: 0;
  transition: padding .2s;
}
.faq-item:last-child { border-bottom: 1px solid rgba(31,61,43,.2); }

.faq-item summary {
  font-family: var(--f-display);
  font-size: clamp(20px, 2.2vw, 28px);
  text-transform: uppercase;
  letter-spacing: .005em;
  padding: 24px 60px 24px 0;
  list-style: none;
  cursor: pointer;
  color: var(--c-green-deep);
  position: relative;
  line-height: 1.15;
  transition: color .15s;
}
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary:hover { color: var(--c-orange); }
.faq-item summary::after {
  content: '+';
  position: absolute;
  right: 8px;
  top: 50%;
  transform: translateY(-50%);
  font-family: var(--f-display);
  font-size: 36px;
  color: var(--c-orange);
  line-height: 1;
  transition: transform .2s;
}
.faq-item[open] summary::after { transform: translateY(-50%) rotate(45deg); }
.faq-item[open] summary { color: var(--c-orange); }
.faq-item p {
  margin: 0;
  padding: 0 60px 28px 0;
  font-size: 16px;
  line-height: 1.6;
  color: #444;
  max-width: 720px;
}

/* ════════════════════════════════════════════════════════
   КОНТАКТЫ + КАРТА
   ════════════════════════════════════════════════════════ */
.contacts {
  background: var(--c-green-deep);
  color: var(--c-cream-text);
  padding: clamp(80px, 12vw, 140px) var(--gutter);
}
.contacts__inner {
  max-width: var(--container);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1.1fr;
  gap: 64px;
  align-items: stretch;
}
.contact-row {
  display: grid;
  grid-template-columns: 40px 1fr;
  grid-template-rows: auto auto;
  gap: 4px 16px;
  padding: 16px 0;
  border-bottom: 1px solid var(--c-line-dark);
  align-items: center;
}
.contact-row__icon {
  grid-row: span 2;
  font-size: 22px;
  line-height: 1;
  color: var(--c-orange);
}
.contact-row__main {
  font-family: var(--f-display);
  font-size: 26px;
  letter-spacing: .04em;
  color: var(--c-cream-text);
  transition: color .15s;
  line-height: 1;
}
a.contact-row__main:hover { color: var(--c-orange); }
.contact-row__sub {
  font-size: 12px;
  letter-spacing: .15em;
  text-transform: uppercase;
  opacity: .6;
}

.contacts__transfer {
  margin: 24px 0 32px;
  padding: 20px 24px;
  background: rgba(255,107,0,.1);
  border-left: 3px solid var(--c-orange);
  border-radius: 0 var(--radius) var(--radius) 0;
  font-size: 14px;
  line-height: 1.55;
}
.contacts__transfer b { color: var(--c-orange); }

.contacts__cta {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
}

/* Контейнер интерактивной карты */
.contacts__map {
  position: relative;
  border-radius: var(--radius-lg);
  overflow: hidden;
  background: #14291C; /* фон-заглушка, пока iframe не отрисовался */
  min-height: 400px;
  border: 1px solid rgba(247,239,227,.06);
}
/* Лёгкая зелёная дымка поверх карты — связывает её с палитрой секции */
.contacts__map--dark::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  background:
    radial-gradient(circle at 50% 50%, transparent 0%, rgba(20,41,28,.25) 100%),
    linear-gradient(180deg, rgba(20,41,28,.15) 0%, rgba(20,41,28,.25) 100%);
  mix-blend-mode: multiply;
}
.contacts__map-pin {
  position: absolute;
  top: 45%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 24px;
  height: 24px;
}
.contacts__map-pin-dot {
  position: absolute;
  inset: 4px;
  background: var(--c-orange);
  border-radius: 50%;
  border: 3px solid #fff;
  box-shadow: 0 4px 14px rgba(0,0,0,.5);
  z-index: 2;
}
.contacts__map-pin-pulse {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background: var(--c-orange);
  opacity: .5;
  animation: pin-pulse 2s infinite ease-out;
}
@keyframes pin-pulse {
  0% { transform: scale(.8); opacity: .8; }
  100% { transform: scale(3); opacity: 0; }
}
.contacts__map-label {
  position: absolute;
  bottom: 32px;
  left: 32px;
  z-index: 3;
  background: rgba(18,18,18,.8);
  backdrop-filter: blur(8px);
  padding: 16px 20px;
  border-radius: var(--radius);
  border-left: 3px solid var(--c-orange);
  text-decoration: none;
  transition: transform .2s, border-left-color .2s, background .2s;
}
a.contacts__map-label:hover { transform: translateY(-2px); border-left-color: #fff; background: rgba(18,18,18,.9); }
a.contacts__map-label:focus-visible { outline: 2px solid var(--c-orange); outline-offset: 3px; }
.contacts__map-title {
  font-family: var(--f-display);
  font-size: 22px;
  letter-spacing: .04em;
  color: var(--c-cream-text);
  line-height: 1;
}
.contacts__map-coords {
  font-size: 11px;
  letter-spacing: .15em;
  color: var(--c-orange);
  margin-top: 6px;
}

/* Кнопка «Открыть карту» — поверх плейсхолдера, исчезает после загрузки */
.contacts__map-open {
  position: absolute;
  right: 24px;
  bottom: 32px;
  z-index: 3;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 12px 22px;
  background: rgba(18,18,18,.7);
  backdrop-filter: blur(8px);
  border: 1px solid rgba(247,239,227,.2);
  border-radius: var(--radius);
  color: var(--c-cream-text);
  font-family: var(--f-display);
  font-size: 13px;
  letter-spacing: .18em;
  text-transform: uppercase;
  cursor: pointer;
  transition: background .2s, border-color .2s, transform .2s, opacity .4s;
}
.contacts__map-open:hover {
  background: rgba(255,107,0,.92);
  border-color: var(--c-orange);
  transform: translateY(-2px);
}
.contacts__map-open:focus-visible { outline: 2px solid var(--c-orange); outline-offset: 3px; }

/* iframe Яндекс-виджета — всегда видим, с dark-фильтром */
.contacts__map-frame {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
  z-index: 1;
  /* dark-mode через invert + hue-rotate — классический трюк, превращает светлую карту в тёмную с сохранением относительной цветовой логики */
  filter: invert(.92) hue-rotate(180deg) saturate(.65) brightness(1.05) contrast(.92);
}

@media (max-width: 980px) {
  .contacts__inner { grid-template-columns: 1fr; gap: 40px; }
  .contacts__map { min-height: 320px; }
  .contacts__map-open { right: 16px; bottom: 16px; padding: 10px 16px; font-size: 12px; }
  .contacts__map-label { bottom: 16px; left: 16px; padding: 12px 16px; }
  .contacts__map-title { font-size: 18px; }
}

/* ════════════════════════════════════════════════════════
   ФИНАЛЬНЫЙ CTA
   ════════════════════════════════════════════════════════ */
.final-cta {
  background: var(--c-black);
  color: var(--c-cream-text);
  padding: clamp(100px, 14vw, 180px) var(--gutter);
  position: relative;
  overflow: hidden;
  text-align: center;
}
.final-cta__bg {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 60% 80% at 50% 100%, rgba(255,107,0,.3) 0%, transparent 60%),
    radial-gradient(ellipse 80% 50% at 50% 0%, rgba(31,61,43,.6) 0%, transparent 70%),
    var(--c-black);
}
.final-cta__bg::before {
  content: '';
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 50%;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 400' preserveAspectRatio='none'%3E%3Cpath fill='%231F3D2B' fill-opacity='.5' d='M0 400 L0 280 L120 200 L240 240 L360 160 L480 220 L600 140 L720 200 L840 130 L960 190 L1080 150 L1200 210 L1320 170 L1440 230 L1440 400 Z'/%3E%3C/svg%3E");
  background-position: bottom;
  background-size: cover;
  background-repeat: no-repeat;
}
.final-cta__inner {
  position: relative;
  z-index: 2;
  max-width: 880px;
  margin: 0 auto;
}
.final-cta__kicker {
  font-size: 13px;
  letter-spacing: .3em;
  text-transform: uppercase;
  color: var(--c-orange);
  margin: 0 0 24px;
  font-weight: 600;
}
.final-cta__title {
  font-family: var(--f-display);
  font-size: clamp(48px, 9vw, 130px);
  line-height: .9;
  margin: 0 0 56px;
  text-transform: uppercase;
  letter-spacing: -.005em;
  color: var(--c-cream-text);
}
.final-cta__title .brush {
  font-family: var(--f-brush);
  font-weight: 700;
  text-transform: none;
  font-size: 1.05em;
  display: inline-block;
  transform: rotate(-3deg);
  text-shadow: 0 4px 30px rgba(255,107,0,.4);
}
.final-cta__buttons {
  display: flex;
  gap: 16px;
  justify-content: center;
  flex-wrap: wrap;
  margin-bottom: 32px;
}
.final-cta__small {
  margin: 32px 0 0;
  font-size: 14px;
  opacity: .65;
}

/* ════════════════════════════════════════════════════════
   ПОДВАЛ
   ════════════════════════════════════════════════════════ */
.foot {
  background: #0a0a0a;
  color: var(--c-cream-text);
  padding: 80px var(--gutter) 0;
}
.foot__inner {
  max-width: var(--container);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.5fr 1fr 1fr 1.2fr;
  gap: 48px;
  padding-bottom: 60px;
  border-bottom: 1px solid var(--c-line-dark);
}
.foot__col {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.foot__col h4 {
  font-family: var(--f-display);
  font-size: 16px;
  letter-spacing: .15em;
  color: var(--c-orange);
  margin: 0 0 4px;
  text-transform: uppercase;
}
.foot__col a, .foot__col span {
  font-size: 14px;
  opacity: .75;
  line-height: 1.5;
  transition: opacity .15s, color .15s;
}
.foot__col a:hover { opacity: 1; color: var(--c-orange); }

.foot__slogan {
  font-family: var(--f-brush);
  font-size: 28px;
  color: var(--c-orange);
  margin: 8px 0 16px;
  line-height: 1;
  transform: rotate(-2deg);
}
.foot__socials {
  display: flex;
  gap: 8px;
  margin-top: 12px;
}
.foot__socials a {
  width: 40px;
  height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--c-line-dark);
  border-radius: 50%;
  font-family: var(--f-display);
  font-size: 13px;
  letter-spacing: .05em;
  opacity: 1;
  transition: background .15s, color .15s, border-color .15s;
}
.foot__socials a:hover {
  background: var(--c-orange);
  color: #fff;
  border-color: var(--c-orange);
}

.foot__bar {
  max-width: var(--container);
  margin: 0 auto;
  padding: 24px 0;
  display: flex;
  justify-content: space-between;
  font-size: 12px;
  letter-spacing: .05em;
  opacity: .5;
  flex-wrap: wrap;
  gap: 12px;
}

@media (max-width: 880px) {
  .foot__inner { grid-template-columns: 1fr 1fr; gap: 40px 24px; }
}
@media (max-width: 480px) {
  .foot__inner { grid-template-columns: 1fr; }
}

/* ════════════════════════════════════════════════════════════════════
   ЭКРАН 8.5 — Lead-квиз «Подбор маршрута»
   Спека: wiki/marketing/lead_quiz_routepick.md
   Все селекторы под .quiz-* / .quiz-card-* — изолированы от остального лейаута.
   ════════════════════════════════════════════════════════════════════ */
.quiz {
  background: var(--c-beige-warm);
  padding: clamp(60px, 9vw, 120px) var(--gutter);
}
.quiz__inner {
  max-width: var(--container);
  margin: 0 auto;
}
.quiz__panel {
  background: var(--c-green-deep);
  color: var(--c-cream-text);
  border-radius: var(--radius-lg);
  padding: clamp(32px, 5vw, 64px) clamp(20px, 4vw, 56px);
  position: relative;
  overflow: hidden;
  box-shadow: 0 24px 60px -32px rgba(0,0,0,.45);
}
.quiz__panel::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 100% 0%, rgba(255,107,0,.12), transparent 45%),
    radial-gradient(circle at 0% 100%, rgba(107,127,94,.18), transparent 50%);
  pointer-events: none;
}
.quiz__head {
  position: relative;
  text-align: center;
  max-width: 720px;
  margin: 0 auto 36px;
}
.quiz__head .h2 { color: var(--c-cream-text); }
.quiz__lead {
  color: rgba(247,239,227,.78);
  font-size: clamp(15px, 1.4vw, 17px);
  margin: 16px 0 0;
}

/* — старт — */
.quiz__start {
  position: relative;
  text-align: center;
  padding: 24px 0 8px;
}
.quiz__start-hint {
  margin: 16px 0 0;
  font-size: 13px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: rgba(247,239,227,.55);
}

/* — тело: прогресс, шаг, назад — */
.quiz__body {
  position: relative;
  max-width: 760px;
  margin: 0 auto;
}
.quiz__progress {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 28px;
}
.quiz__progress-track {
  flex: 1;
  height: 4px;
  background: rgba(247,239,227,.12);
  border-radius: 2px;
  overflow: hidden;
}
.quiz__progress-bar {
  height: 100%;
  background: var(--c-orange);
  transition: width .35s ease;
}
.quiz__progress-text {
  font-family: var(--f-display);
  font-size: 13px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: rgba(247,239,227,.7);
  white-space: nowrap;
}

.quiz__step {
  min-height: 280px;
  opacity: 1;
  transition: opacity .22s ease;
}
.quiz__step-card { padding: 8px 0 4px; }
.quiz__step-num {
  font-family: var(--f-display);
  font-size: 12px;
  letter-spacing: .25em;
  text-transform: uppercase;
  color: var(--c-orange);
  margin: 0 0 12px;
}
.quiz__step-q {
  font-family: var(--f-display);
  font-weight: 500;
  font-size: clamp(26px, 3.6vw, 40px);
  line-height: 1.1;
  color: var(--c-cream-text);
  margin: 0 0 28px;
}

.quiz__options {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}
.quiz__opt {
  appearance: none;
  background: rgba(247,239,227,.04);
  color: var(--c-cream-text);
  border: 1.5px solid rgba(247,239,227,.18);
  border-radius: var(--radius);
  padding: 22px 18px;
  font-family: var(--f-body);
  font-weight: 500;
  font-size: 16px;
  line-height: 1.3;
  text-align: left;
  cursor: pointer;
  transition: background .15s, border-color .15s, transform .1s, color .15s;
}
.quiz__opt:hover {
  background: rgba(255,107,0,.08);
  border-color: var(--c-orange);
  color: var(--c-cream-text);
}
.quiz__opt:active { transform: translateY(1px); }
.quiz__opt.is-active {
  background: rgba(255,107,0,.16);
  border-color: var(--c-orange);
  color: #fff;
}

.quiz__nav {
  display: flex;
  justify-content: flex-start;
  margin-top: 24px;
}
.quiz__back {
  appearance: none;
  background: transparent;
  border: none;
  color: rgba(247,239,227,.65);
  font-family: var(--f-body);
  font-size: 14px;
  letter-spacing: .03em;
  cursor: pointer;
  padding: 8px 4px;
  transition: color .15s;
}
.quiz__back:hover { color: var(--c-orange); }
.quiz__back[hidden] { display: none; }

/* — результат — */
.quiz__result {
  position: relative;
  max-width: 1100px;
  margin: 0 auto;
}
.quiz__result-title {
  font-family: var(--f-display);
  font-weight: 500;
  font-size: clamp(24px, 3vw, 36px);
  color: var(--c-cream-text);
  margin: 0 0 8px;
  text-align: center;
}
.quiz__result-hint {
  text-align: center;
  color: rgba(247,239,227,.7);
  font-size: 14px;
  margin: 0 auto 24px;
  max-width: 560px;
}
.quiz__notice {
  background: rgba(255,107,0,.12);
  border-left: 3px solid var(--c-orange);
  color: var(--c-cream-text);
  padding: 12px 16px;
  border-radius: var(--radius);
  font-size: 14px;
  margin: 0 auto 24px;
  max-width: 720px;
}
.quiz__notice[hidden] { display: none; }
.quiz__error {
  text-align: center;
  color: var(--c-cream-text);
  padding: 32px;
}

.quiz__cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
  align-items: stretch;
  margin-bottom: 36px;
}

.quiz-card {
  background: var(--c-beige);
  color: var(--c-black);
  border-radius: var(--radius-lg);
  padding: 20px 20px 22px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  position: relative;
  border: 2px solid transparent;
  transition: transform .2s ease, box-shadow .2s ease;
}
.quiz-card--main {
  background: #fff;
  border-color: var(--c-orange);
  box-shadow: 0 18px 40px -20px rgba(255,107,0,.4);
  transform: translateY(-6px);
}
.quiz-card__label {
  position: absolute;
  top: -10px;
  left: 16px;
  background: var(--c-green-deep);
  color: var(--c-cream-text);
  font-family: var(--f-display);
  font-size: 11px;
  letter-spacing: .18em;
  text-transform: uppercase;
  padding: 4px 10px;
  border-radius: 3px;
  z-index: 2;
}
.quiz-card--main .quiz-card__label {
  background: var(--c-orange);
  color: #fff;
}
.quiz-card__media {
  aspect-ratio: 16 / 10;
  background: var(--c-olive);
  border-radius: var(--radius);
  display: flex;
  align-items: center;
  justify-content: center;
  background-image:
    linear-gradient(135deg, rgba(255,107,0,.10), transparent 60%),
    linear-gradient(0deg, rgba(0,0,0,.18), transparent 50%);
  background-color: var(--c-olive);
  position: relative;
  overflow: hidden;
}
.quiz-card__media-tag {
  font-family: var(--f-body);
  font-size: 12px;
  color: rgba(255,255,255,.85);
  letter-spacing: .05em;
}
.quiz-card__title {
  font-family: var(--f-display);
  font-weight: 600;
  font-size: 22px;
  letter-spacing: .01em;
  margin: 0;
  color: var(--c-green-deep);
  line-height: 1.2;
}

/* Крупный stat-блок: длительность + цена. Ради читаемости на расстоянии и
   ради того, чтобы взгляд цеплялся за главное — сколько и за сколько. */
.quiz-card__stats {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  background: rgba(31, 61, 43, .07);
  border-radius: var(--radius);
  padding: 12px 14px;
}
.quiz-card--main .quiz-card__stats {
  background: rgba(255, 107, 0, .08);
}
.quiz-card__stat {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.quiz-card__stat + .quiz-card__stat {
  border-left: 1px solid rgba(31, 61, 43, .12);
  padding-left: 10px;
}
.quiz-card--main .quiz-card__stat + .quiz-card__stat {
  border-left-color: rgba(255, 107, 0, .2);
}
.quiz-card__stat-num {
  font-family: var(--f-display);
  font-weight: 700;
  font-size: 26px;
  line-height: 1.05;
  letter-spacing: -.005em;
  color: var(--c-green-deep);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.quiz-card__stat--price .quiz-card__stat-num { color: var(--c-orange); }
.quiz-card__stat-label {
  font-family: var(--f-body);
  font-size: 11px;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: rgba(31, 61, 43, .55);
  font-weight: 500;
  line-height: 1.2;
}

.quiz-card__why {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.quiz-card__why li {
  position: relative;
  padding-left: 18px;
  font-size: 14px;
  line-height: 1.4;
  color: var(--c-black);
}
.quiz-card__why li::before {
  content: '•';
  position: absolute;
  left: 4px;
  top: 0;
  color: var(--c-orange);
  font-weight: 700;
}

/* «Обсудить» — главный CTA карточки, ведёт в Telegram с префилом
   по этому конкретному маршруту. Главная карточка получает оранжевую
   заливку, боковые — outline-стиль. */
.quiz-card__cta {
  margin-top: auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  font-family: var(--f-display);
  font-weight: 600;
  font-size: 13px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--c-green-deep);
  background: transparent;
  border: 1.5px solid var(--c-green-deep);
  border-radius: var(--radius);
  padding: 12px 18px;
  text-decoration: none;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
  transition: background .15s, color .15s, border-color .15s, transform .15s;
}
.quiz-card__cta-arrow {
  display: inline-block;
  transition: transform .15s;
}
.quiz-card__cta:hover {
  background: var(--c-green-deep);
  color: var(--c-cream-text);
  border-color: var(--c-green-deep);
}
.quiz-card__cta:hover .quiz-card__cta-arrow { transform: translateX(3px); }
.quiz-card--main .quiz-card__cta {
  background: var(--c-orange);
  color: #fff;
  border-color: var(--c-orange);
}
.quiz-card--main .quiz-card__cta:hover {
  background: #e06000;
  border-color: #e06000;
}

/* — CTA блок под карточками — */
.quiz__cta {
  text-align: center;
  border-top: 1px solid rgba(247,239,227,.12);
  padding-top: 28px;
}
.quiz__cta-title {
  font-family: var(--f-body);
  font-weight: 500;
  font-size: clamp(16px, 1.7vw, 20px);
  color: var(--c-cream-text);
  margin: 0 0 18px;
  line-height: 1.4;
}
.quiz__buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: center;
  margin-bottom: 12px;
}
.quiz-cta__btn {
  min-width: 160px;
  justify-content: center;
}
.quiz-cta__btn.btn--ghost {
  color: var(--c-cream-text);
  border-color: rgba(247,239,227,.4);
  background: transparent;
}
.quiz-cta__btn.btn--ghost:hover {
  background: rgba(247,239,227,.08);
  border-color: var(--c-cream-text);
}
.quiz__cta-note {
  font-size: 13px;
  color: rgba(247,239,227,.55);
  margin: 12px 0 0;
}

.quiz__restart {
  display: block;
  margin: 24px auto 0;
  appearance: none;
  background: transparent;
  border: none;
  color: rgba(247,239,227,.55);
  font-family: var(--f-body);
  font-size: 13px;
  letter-spacing: .05em;
  cursor: pointer;
  padding: 8px 12px;
  transition: color .15s;
}
.quiz__restart:hover { color: var(--c-orange); }

/* — Адаптив — */
@media (max-width: 880px) {
  .quiz__cards {
    grid-template-columns: 1fr;
    gap: 28px;
  }
  .quiz-card--main { transform: none; }
  .quiz-card--main { order: -1; } /* главный — первым на мобайле */
}
@media (max-width: 600px) {
  .quiz__panel { padding: 28px 18px; border-radius: var(--radius); }
  .quiz__options {
    grid-template-columns: 1fr;
  }
  .quiz__step { min-height: 340px; }
  .quiz__step-q { font-size: 24px; }
  .quiz__buttons .quiz-cta__btn {
    flex: 1 1 100%;
  }
}

/* ───────────────────────────────────────────────────────────
   Дополнения 2026-05-07: маршруты 08/09, блок сертификата.
   ─────────────────────────────────────────────────────────── */

/* Градиентные плейсхолдеры под новые маршруты — до прихода фото от Тимура */
.route__photo--8 { background: radial-gradient(circle at 30% 70%, rgba(255,107,0,.35), transparent 55%), linear-gradient(135deg, #2a3d2d 0%, #14291C 70%, #3a2818 100%); }
.route__photo--9 { background: linear-gradient(180deg, #6B7F5E 0%, #4a6b6e 50%, #2a4658 100%); }

/* Компактные плашки-флажки рядом с заголовком маршрута (не путать
   с большим brush-флагом .route__flag без модификатора). */
.route__flag--season,
.route__flag--new {
  font-family: var(--f-body);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  padding: 3px 8px;
  border-radius: 999px;
  display: inline-block;
  vertical-align: middle;
  margin-left: 8px;
  transform: none;
  line-height: 1.4;
  white-space: nowrap;
}
.route__flag--season {
  background: rgba(74, 107, 110, .15);
  color: #2a4658;
  border: 1px solid rgba(74, 107, 110, .3);
}
.route__flag--new {
  background: var(--c-orange);
  color: #fff;
}
.route--top .route__flag--season {
  background: rgba(247,239,227,.12);
  color: var(--c-cream-text);
  border-color: rgba(247,239,227,.3);
}

/* Тег внутри ячейки прайс-таблицы (NEW, лето) */
.price-table__tag {
  display: inline-block;
  margin-left: 6px;
  font-family: var(--f-body);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .08em;
  text-transform: uppercase;
  padding: 2px 6px;
  border-radius: 999px;
  background: var(--c-orange);
  color: #fff;
  vertical-align: middle;
  line-height: 1.4;
}

/* Блок «Подарочный сертификат» (заменил «Скидки» 2026-05-07) */
.discounts--cert .discounts__title {
  font-size: 26px;
  text-transform: none;
  letter-spacing: 0;
}
.discounts__lead {
  margin: 0;
  font-size: 14px;
  line-height: 1.5;
  color: rgba(247,239,227,.78);
}
.discounts__cta {
  margin-top: 8px;
  align-self: stretch;
}
.discounts--cert .discounts__list li {
  padding: 14px 0;
}
.discounts--cert .discounts__num {
  font-size: 28px;
  text-align: center;
}

/* ───────────────────────────────────────────────────────────
   Страницы отдельных маршрутов /marshruty/<slug>/
   Минимальный шаблон под SEO-страницы 08/09 — расширим, когда
   появятся фото-банки и пошаговые описания.
   ─────────────────────────────────────────────────────────── */
.route-page { padding-top: 90px; }
.route-page__hero {
  background: var(--c-cream-bg);
  padding: 80px 24px 60px;
  border-bottom: 1px solid var(--c-line);
}
.route-page__hero-inner {
  max-width: 920px;
  margin: 0 auto;
}
.route-page__hero h1 {
  margin: 12px 0 18px;
  line-height: 1.05;
}
.route-page__lead {
  font-size: 19px;
  line-height: 1.5;
  color: #555;
  max-width: 720px;
  margin: 0 0 28px;
}
.route-page__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 14px 28px;
  margin-bottom: 32px;
  font-size: 15px;
}
.route-page__meta b {
  font-family: var(--f-display);
  font-weight: 600;
  font-size: 19px;
  color: var(--c-green-deep);
  margin-right: 4px;
}
.route-page__cta {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
}
.route-page__body {
  padding: 60px 24px 100px;
}
.route-page__content {
  max-width: 760px;
  margin: 0 auto;
  font-size: 17px;
  line-height: 1.65;
}
.route-page__content h2 {
  font-family: var(--f-display);
  font-size: 28px;
  margin: 40px 0 16px;
  color: var(--c-green-deep);
}
.route-page__content h2:first-child { margin-top: 0; }
.route-page__content ul {
  padding-left: 22px;
  margin: 0 0 22px;
}
.route-page__content li { margin-bottom: 6px; }
.route-page__content a { color: var(--c-orange); text-decoration: underline; text-underline-offset: 2px; }
.route-page__note {
  margin-top: 24px;
  padding: 16px 18px;
  background: rgba(255,107,0,.08);
  border-left: 3px solid var(--c-orange);
  font-size: 15px;
  color: #444;
  border-radius: 0 8px 8px 0;
}
@media (max-width: 600px) {
  .route-page__hero { padding: 50px 18px 40px; }
  .route-page__lead { font-size: 17px; }
  .route-page__body { padding: 40px 18px 70px; }
  .route-page__content h2 { font-size: 24px; }
}

/* ════════════════════════════════════════════════════════════════════
   Страницы туров /marshruty/<slug>/ — полноценный шаблон
   Каркас: hero · программа · параметры · галерея · аудитория · FAQ ·
   похожие · бронь. Используется для всех 9 маршрутов; меняется только
   контент в слотах.
   ════════════════════════════════════════════════════════════════════ */

.tour-body { background: var(--c-beige); }
.tour {
  --tour-section-py: clamp(56px, 8vw, 100px);
  padding-top: 76px;
}

/* Хлебные крошки */
.tour-crumbs {
  max-width: var(--container);
  margin: 0 auto;
  padding: 18px var(--gutter) 0;
  font-size: 13px;
  letter-spacing: .04em;
  color: var(--c-olive);
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.tour-crumbs a { color: var(--c-olive); transition: color .15s; }
.tour-crumbs a:hover { color: var(--c-orange); }
.tour-crumbs__sep { color: rgba(31,61,43,.35); }
.tour-crumbs__current { color: var(--c-green-deep); font-weight: 600; }

/* Заголовок секции — общая шапка */
.tour-section__head {
  max-width: var(--container);
  margin: 0 auto var(--tour-section-py);
  padding: 0 var(--gutter);
  margin-bottom: clamp(28px, 3vw, 40px);
}
.tour-section__head .h2 { margin: 0; }

/* —————————————————————————————————————————————————
   ЭКРАН 1 — HERO
   ————————————————————————————————————————————————— */
.tour-hero {
  max-width: var(--container);
  margin: 0 auto;
  padding: clamp(28px, 4vw, 56px) var(--gutter) clamp(48px, 7vw, 90px);
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
  gap: clamp(28px, 5vw, 64px);
  align-items: center;
}
.tour-hero__left { min-width: 0; }
.tour-hero__kicker {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-family: var(--f-body);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: .25em;
  text-transform: uppercase;
  color: var(--c-olive);
  margin-bottom: 18px;
}
.tour-hero__kicker-line {
  width: 36px; height: 1px;
  background: var(--c-orange);
  display: inline-block;
}
.tour-hero__title {
  font-family: var(--f-display);
  font-weight: 600;
  font-size: clamp(46px, 8vw, 110px);
  line-height: .9;
  letter-spacing: .005em;
  text-transform: uppercase;
  color: var(--c-green-deep);
  margin: 0 0 18px;
}
.tour-hero__brush {
  font-family: var(--f-brush);
  font-weight: 700;
  font-style: italic;
  font-size: clamp(28px, 4vw, 48px);
  letter-spacing: -.01em;
  color: var(--c-orange);
  text-transform: none;
  display: inline-block;
  transform: translateY(.05em) rotate(-2deg);
  margin-top: 4px;
}
.tour-hero__lead {
  font-size: clamp(15px, 1.4vw, 17px);
  line-height: 1.55;
  color: #444;
  max-width: 560px;
  margin: 0 0 26px;
}
.tour-hero__meta {
  list-style: none; padding: 0; margin: 0 0 28px;
  display: flex;
  flex-wrap: wrap;
  gap: 14px 28px;
  border-top: 1px solid var(--c-line);
  border-bottom: 1px solid var(--c-line);
  padding: 16px 0;
}
.tour-hero__meta li {
  display: flex;
  flex-direction: column;
  line-height: 1;
}
.tour-hero__meta b {
  font-family: var(--f-display);
  font-weight: 600;
  font-size: clamp(20px, 2.2vw, 26px);
  color: var(--c-green-deep);
}
.tour-hero__meta span {
  font-size: 11px;
  letter-spacing: .15em;
  text-transform: uppercase;
  color: var(--c-olive);
  margin-top: 6px;
}
.tour-hero__proof {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 14px;
  color: #444;
  margin-top: 22px;
}
.tour-hero__proof-stars { color: var(--c-orange); letter-spacing: .05em; }
.tour-hero__proof b { color: var(--c-green-deep); font-weight: 700; }

.tour-hero__visual {
  position: relative;
  border-radius: var(--radius-lg);
  overflow: hidden;
  aspect-ratio: 16 / 11;
  box-shadow: 0 30px 60px -30px rgba(20,41,28,.45), 0 8px 20px -10px rgba(20,41,28,.25);
}
.tour-hero__visual img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* CTA-триада */
.tour-cta {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}
.tour-cta--wide {
  max-width: var(--container);
  margin: 28px auto 0;
  padding: 0 var(--gutter);
  justify-content: flex-start;
}
.tour-cta__btn {
  flex: 0 0 auto;
}
.tour-cta__btn--max[aria-disabled="true"] {
  opacity: .55;
  pointer-events: none;
  position: relative;
}
.tour-cta__btn--max[aria-disabled="true"]::after {
  content: "скоро";
  position: absolute;
  top: -8px; right: -8px;
  font-family: var(--f-body);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  background: var(--c-orange);
  color: #fff;
  padding: 2px 6px;
  border-radius: 3px;
}

@media (max-width: 880px) {
  .tour-hero {
    grid-template-columns: 1fr;
    gap: 24px;
  }
  .tour-hero__visual { order: -1; aspect-ratio: 16 / 10; }
}
@media (max-width: 600px) {
  .tour-cta { flex-direction: column; }
  .tour-cta .btn { justify-content: center; width: 100%; }
}

/* —————————————————————————————————————————————————
   ЭКРАН 2 — ПРОГРАММА (точка за точкой)
   ————————————————————————————————————————————————— */
.tour-program {
  max-width: var(--container);
  margin: 0 auto;
  padding: var(--tour-section-py) var(--gutter);
  border-top: 1px solid var(--c-line);
}
.tour-program__list {
  list-style: none;
  padding: 0;
  margin: 0;
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 32px;
}
.tour-program__list::before {
  content: "";
  position: absolute;
  top: 24px; bottom: 24px; left: 22px;
  width: 1px;
  background: linear-gradient(to bottom, var(--c-orange), rgba(255,107,0,.0));
  z-index: 0;
}
.tour-step {
  display: grid;
  grid-template-columns: 64px minmax(0, 1fr) minmax(0, 240px);
  gap: 24px;
  align-items: start;
  position: relative;
  z-index: 1;
}
.tour-step__num {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: var(--c-beige-warm);
  border: 2px solid var(--c-orange);
  color: var(--c-green-deep);
  font-family: var(--f-display);
  font-weight: 600;
  font-size: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  position: relative;
  z-index: 2;
}
.tour-step--main .tour-step__num {
  background: var(--c-orange);
  color: #fff;
  box-shadow: 0 0 0 6px rgba(255,107,0,.18);
}
.tour-step__body { padding-top: 4px; }
.tour-step__star {
  display: inline-block;
  font-family: var(--f-body);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .15em;
  text-transform: uppercase;
  color: var(--c-orange);
  margin-bottom: 6px;
}
.tour-step__title {
  font-family: var(--f-display);
  font-weight: 600;
  font-size: clamp(18px, 1.8vw, 22px);
  text-transform: uppercase;
  letter-spacing: .01em;
  color: var(--c-green-deep);
  margin: 0 0 8px;
  line-height: 1.15;
}
.tour-step__text {
  font-size: 15px;
  line-height: 1.6;
  color: #555;
  margin: 0;
}
.tour-step__photo {
  width: 240px;
  aspect-ratio: 4 / 3;
  border-radius: var(--radius-lg);
  overflow: hidden;
  box-shadow: 0 12px 28px -16px rgba(20,41,28,.35);
}
.tour-step__photo img {
  width: 100%; height: 100%; object-fit: cover;
}

@media (max-width: 880px) {
  .tour-step {
    grid-template-columns: 56px minmax(0, 1fr);
  }
  .tour-step__photo {
    grid-column: 2 / 3;
    width: 100%;
    margin-top: 12px;
  }
}
@media (max-width: 480px) {
  .tour-program__list::before { left: 18px; }
  .tour-step {
    grid-template-columns: 48px minmax(0, 1fr);
    gap: 14px;
  }
  .tour-step__num { width: 36px; height: 36px; font-size: 15px; }
}

/* —————————————————————————————————————————————————
   ЭКРАН 3 — ПАРАМЕТРЫ + ВКЛЮЧЕНО + ОПЦИИ
   ————————————————————————————————————————————————— */
.tour-params {
  background: #fff;
  border-top: 1px solid var(--c-line);
  border-bottom: 1px solid var(--c-line);
  padding: var(--tour-section-py) 0;
}
.tour-params__grid {
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 var(--gutter);
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr);
  gap: 40px;
  align-items: start;
}
.tour-params__table {
  width: 100%;
  border-collapse: collapse;
  font-size: 15px;
  line-height: 1.4;
}
.tour-params__table th,
.tour-params__table td {
  text-align: left;
  padding: 12px 14px;
  border-bottom: 1px solid var(--c-line);
}
.tour-params__table th {
  font-family: var(--f-body);
  font-weight: 500;
  color: var(--c-olive);
  width: 40%;
  white-space: nowrap;
}
.tour-params__table td { color: #333; }
.tour-params__table tr.tour-params__price b {
  font-family: var(--f-display);
  font-size: 22px;
  color: var(--c-orange);
  font-weight: 600;
}
.tour-params__table tr.tour-params__price td { color: var(--c-green-deep); }
.tour-params__table a { color: var(--c-orange); text-decoration: underline; text-underline-offset: 2px; }

.tour-note {
  display: inline-block;
  margin-left: 6px;
  font-size: 11px;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--c-olive);
  opacity: .75;
}

.tour-params__lists {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 20px;
}

.tour-list {
  border-radius: var(--radius-lg);
  padding: 24px 26px;
  border: 1px solid var(--c-line);
}
.tour-list--in {
  background: linear-gradient(180deg, #fff, var(--c-beige-warm));
  border-color: rgba(31,61,43,.18);
}
.tour-list--opt {
  background: var(--c-beige);
  border-style: dashed;
}
.tour-list__title {
  font-family: var(--f-display);
  font-weight: 600;
  font-size: 18px;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--c-green-deep);
  margin: 0 0 14px;
}
.tour-list--in .tour-list__title::before {
  content: "✔";
  display: inline-block;
  margin-right: 8px;
  color: var(--c-orange);
}
.tour-list--opt .tour-list__title::before {
  content: "+";
  display: inline-block;
  margin-right: 8px;
  color: var(--c-olive);
  font-weight: 700;
}
.tour-list__lead {
  font-size: 14px;
  color: var(--c-olive);
  margin: 0 0 10px;
}
.tour-list__items {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
  font-size: 15px;
  color: #333;
}
.tour-list__items li {
  position: relative;
  padding-left: 22px;
}
.tour-list__items li::before {
  content: "—";
  position: absolute;
  left: 0; top: 0;
  color: var(--c-orange);
  font-weight: 700;
}
.tour-list__hint {
  display: block;
  margin-top: 4px;
  font-size: 13px;
  color: var(--c-olive);
}
.tour-list__foot {
  margin: 14px 0 0;
  font-size: 13px;
  color: var(--c-olive);
  font-style: italic;
}

@media (max-width: 880px) {
  .tour-params__grid { grid-template-columns: 1fr; gap: 28px; }
}
@media (max-width: 480px) {
  .tour-params__table th,
  .tour-params__table td { padding: 10px 8px; font-size: 14px; }
  .tour-list { padding: 20px 18px; }
}

/* —————————————————————————————————————————————————
   ЭКРАН 4 — ГАЛЕРЕЯ
   ————————————————————————————————————————————————— */
.tour-gallery {
  max-width: var(--container);
  margin: 0 auto;
  padding: var(--tour-section-py) var(--gutter);
}
.tour-gallery__grid {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
}
.tour-gallery__item {
  border-radius: var(--radius);
  overflow: hidden;
  aspect-ratio: 4 / 3;
  background: var(--c-beige-warm);
  position: relative;
}
.tour-gallery__item.is-hidden { display: none; }
.tour-gallery__link {
  display: block;
  width: 100%;
  height: 100%;
  position: relative;
  overflow: hidden;
}
.tour-gallery__link img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .4s ease;
}
.tour-gallery__link:hover img { transform: scale(1.04); }
.tour-gallery__foot {
  margin-top: 28px;
  text-align: center;
}
.tour-gallery__more {
  background: transparent;
  border: 2px solid var(--c-green-deep);
  color: var(--c-green-deep);
  padding: 14px 28px;
  font-family: var(--f-display);
  font-weight: 600;
  font-size: 15px;
  letter-spacing: .12em;
  text-transform: uppercase;
  border-radius: var(--radius);
  cursor: pointer;
  transition: background .2s, color .2s;
}
.tour-gallery__more:hover {
  background: var(--c-green-deep);
  color: var(--c-cream-text);
}
.tour-gallery__done {
  margin: 0;
  font-size: 14px;
  color: var(--c-olive);
  font-style: italic;
}

/* hidden-атрибут на .btn-кнопке перебивается общим .btn { display: inline-flex }.
   Поднимаем специфичность через class+attribute, без !important. */
.tour-gallery__more[hidden],
.tour-gallery__done[hidden] { display: none; }

@media (max-width: 760px) {
  .tour-gallery__grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
  }
}

/* —————————————————————————————————————————————————
   ЭКРАН 5 — КОМУ ПОДХОДИТ + ОТЗЫВЫ
   ————————————————————————————————————————————————— */
.tour-audience {
  background: #fff;
  border-top: 1px solid var(--c-line);
  border-bottom: 1px solid var(--c-line);
  padding: var(--tour-section-py) 0;
}
.tour-audience__grid {
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 var(--gutter);
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 28px;
  margin-bottom: 56px;
}
.tour-audience__col {
  border-radius: var(--radius-lg);
  padding: 28px 30px;
}
.tour-audience__col--yes {
  background: rgba(107,127,94,.10);
  border-left: 4px solid var(--c-olive);
}
.tour-audience__col--no {
  background: rgba(255,107,0,.06);
  border-left: 4px solid var(--c-orange);
}
.tour-audience__title {
  font-family: var(--f-display);
  font-weight: 600;
  font-size: 20px;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--c-green-deep);
  margin: 0 0 16px;
}
.tour-audience__col--yes .tour-audience__title::before { content: "✓ "; color: var(--c-olive); }
.tour-audience__col--no .tour-audience__title::before { content: "✕ "; color: var(--c-orange); }
.tour-audience__list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
  font-size: 15px;
  line-height: 1.5;
  color: #333;
}
.tour-audience__list a {
  color: var(--c-orange);
  text-decoration: underline;
  text-underline-offset: 2px;
}

.tour-audience__reviews-title {
  max-width: var(--container);
  margin: 0 auto 20px;
  padding: 0 var(--gutter);
  font-family: var(--f-display);
  font-weight: 600;
  font-size: 22px;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--c-green-deep);
}
.tour-reviews {
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 var(--gutter);
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}
.tour-review {
  background: var(--c-beige);
  border-radius: var(--radius-lg);
  padding: 24px 26px;
  border: 1px solid var(--c-line);
}
.tour-review__stars {
  color: var(--c-orange);
  letter-spacing: .08em;
  margin-bottom: 12px;
  font-size: 16px;
}
.tour-review__text {
  margin: 0 0 14px;
  font-size: 15px;
  line-height: 1.55;
  color: #2a2a2a;
}
.tour-review__text b { color: var(--c-green-deep); }
.tour-review__foot {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 13px;
  border-top: 1px solid var(--c-line);
  padding-top: 12px;
}
.tour-review__author { font-weight: 600; color: var(--c-green-deep); }
.tour-review__src { color: var(--c-orange); }
.tour-reviews__more {
  max-width: var(--container);
  margin: 24px auto 0;
  padding: 0 var(--gutter);
  font-size: 14px;
  color: var(--c-olive);
}
.tour-reviews__more a { color: var(--c-orange); text-decoration: underline; }

@media (max-width: 760px) {
  .tour-audience__grid { grid-template-columns: 1fr; }
  .tour-reviews { grid-template-columns: 1fr; }
}

/* —————————————————————————————————————————————————
   ЭКРАН 6 — FAQ + БЕЗОПАСНОСТЬ
   ————————————————————————————————————————————————— */
.tour-faq {
  max-width: var(--container);
  margin: 0 auto;
  padding: var(--tour-section-py) var(--gutter);
}
.tour-faq__list {
  display: flex;
  flex-direction: column;
  gap: 0;
}
.tour-safety {
  margin-top: 36px;
  padding: 22px 26px;
  background: var(--c-green-deep);
  color: var(--c-cream-text);
  border-radius: var(--radius-lg);
  display: flex;
  align-items: flex-start;
  gap: 16px;
  flex-wrap: wrap;
}
.tour-safety__title {
  font-family: var(--f-display);
  font-weight: 600;
  font-size: 16px;
  letter-spacing: .08em;
  text-transform: uppercase;
  margin: 0;
  color: var(--c-orange);
  flex: 0 0 auto;
}
.tour-safety__text {
  margin: 0;
  font-size: 14px;
  line-height: 1.55;
  color: rgba(247,239,227,.85);
  flex: 1 1 320px;
}
.tour-safety__text a { color: var(--c-orange); text-decoration: underline; }

/* —————————————————————————————————————————————————
   ЭКРАН 6.5 — ПОХОЖИЕ МАРШРУТЫ
   ————————————————————————————————————————————————— */
.tour-related {
  background: var(--c-beige-warm);
  padding: var(--tour-section-py) 0;
}
.tour-related__grid {
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 var(--gutter);
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}
.tour-related__card {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 28px 30px;
  background: #fff;
  border-radius: var(--radius-lg);
  border: 1px solid var(--c-line);
  transition: transform .2s, box-shadow .2s, border-color .2s;
  position: relative;
  overflow: hidden;
  color: inherit;
}
.tour-related__card:hover {
  transform: translateY(-2px);
  box-shadow: 0 24px 40px -22px rgba(20,41,28,.4);
  border-color: var(--c-orange);
}
.tour-related__card--easier::before,
.tour-related__card--harder::before {
  content: "";
  position: absolute;
  top: 0; left: 0;
  width: 4px; height: 100%;
}
.tour-related__card--easier::before { background: var(--c-olive); }
.tour-related__card--harder::before { background: var(--c-orange); }
.tour-related__hint {
  font-family: var(--f-body);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--c-olive);
}
.tour-related__card--harder .tour-related__hint { color: var(--c-orange); }
.tour-related__name {
  font-family: var(--f-display);
  font-weight: 600;
  font-size: clamp(22px, 2.4vw, 28px);
  text-transform: uppercase;
  letter-spacing: .01em;
  color: var(--c-green-deep);
  margin: 4px 0 6px;
}
.tour-related__meta {
  font-size: 14px;
  color: #555;
  letter-spacing: .04em;
}
.tour-related__line {
  margin: 8px 0 0;
  font-size: 14px;
  color: #444;
  line-height: 1.5;
}
.tour-related__cta {
  margin-top: 14px;
  font-family: var(--f-display);
  font-size: 13px;
  letter-spacing: .15em;
  text-transform: uppercase;
  color: var(--c-orange);
}
.tour-related__all {
  max-width: var(--container);
  margin: 24px auto 0;
  padding: 0 var(--gutter);
  text-align: center;
  font-family: var(--f-display);
  font-size: 14px;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.tour-related__all a {
  color: var(--c-green-deep);
  border-bottom: 1px solid var(--c-orange);
  padding-bottom: 2px;
  transition: color .15s;
}
.tour-related__all a:hover { color: var(--c-orange); }

@media (max-width: 760px) {
  .tour-related__grid { grid-template-columns: 1fr; }
}

/* —————————————————————————————————————————————————
   ЭКРАН 7 — ФИНАЛЬНЫЙ CTA + ЛИД-ФОРМА
   ————————————————————————————————————————————————— */
.tour-book {
  position: relative;
  background: var(--c-green-deep);
  color: var(--c-cream-text);
  padding: var(--tour-section-py) 0;
  overflow: hidden;
  scroll-margin-top: 80px;
}
.tour-book__bg {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse at 80% 20%, rgba(255,107,0,.18), transparent 55%),
    radial-gradient(ellipse at 10% 90%, rgba(107,127,94,.25), transparent 55%);
  pointer-events: none;
}
.tour-book__inner {
  position: relative;
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 var(--gutter);
  text-align: center;
}
.tour-book__inner .final-cta__title {
  font-family: var(--f-display);
  font-weight: 600;
  font-size: clamp(36px, 5.5vw, 64px);
  line-height: 1;
  letter-spacing: .005em;
  text-transform: uppercase;
  color: var(--c-cream-text);
  margin: 14px 0 28px;
}
.tour-book__small {
  margin: 22px 0 0;
  font-size: 14px;
  color: rgba(247,239,227,.7);
  letter-spacing: .04em;
}
.tour-cta--center { justify-content: center; flex-wrap: wrap; }

.tour-form {
  background: #fff;
  color: var(--c-black);
  border-radius: var(--radius-lg);
  padding: 32px 32px 28px;
  display: flex;
  flex-direction: column;
  gap: 14px;
  box-shadow: 0 28px 60px -28px rgba(0,0,0,.6);
}
.tour-form__title {
  font-family: var(--f-display);
  font-weight: 600;
  font-size: 22px;
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--c-green-deep);
  margin: 0 0 8px;
}
.tour-form__field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.tour-form__field span {
  font-size: 12px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--c-olive);
  font-weight: 600;
}
.tour-form__field input,
.tour-form__field textarea {
  font-family: var(--f-body);
  font-size: 15px;
  padding: 12px 14px;
  border: 1px solid var(--c-line);
  border-radius: var(--radius);
  background: #fafafa;
  color: var(--c-black);
  resize: vertical;
  transition: border-color .15s, background .15s;
}
.tour-form__field input:focus,
.tour-form__field textarea:focus {
  outline: none;
  border-color: var(--c-orange);
  background: #fff;
}
.tour-form__honeypot {
  position: absolute;
  left: -9999px;
  width: 1px; height: 1px;
  overflow: hidden;
}
.tour-form__consent {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 13px;
  color: #555;
  line-height: 1.45;
}
.tour-form__consent input[type="checkbox"] {
  flex: 0 0 auto;
  margin-top: 3px;
  accent-color: var(--c-orange);
}
.tour-form__consent a { color: var(--c-orange); text-decoration: underline; }
.tour-form__submit {
  margin-top: 6px;
  justify-content: center;
}
.tour-form.is-sending .tour-form__submit { opacity: .7; pointer-events: none; }
.tour-form__status {
  margin: 0;
  font-size: 14px;
  min-height: 1.4em;
  color: var(--c-olive);
}
.tour-form.is-success .tour-form__status { color: #2d6a3a; font-weight: 600; }
.tour-form.is-error   .tour-form__status { color: #c0392b; font-weight: 600; }

.tour-book__channels {
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.tour-book__channels-title {
  font-family: var(--f-display);
  font-weight: 600;
  font-size: 16px;
  text-transform: uppercase;
  letter-spacing: .12em;
  color: var(--c-orange);
  margin: 0 0 4px;
}
.tour-channel {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr);
  grid-template-rows: auto auto;
  gap: 4px 14px;
  align-items: center;
  padding: 18px 22px;
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(247,239,227,.18);
  border-radius: var(--radius-lg);
  color: var(--c-cream-text);
  transition: background .15s, border-color .15s, transform .15s;
}
.tour-channel:hover {
  background: rgba(255,107,0,.12);
  border-color: var(--c-orange);
  transform: translateX(2px);
}
.tour-channel__icon {
  grid-row: 1 / 3;
  font-size: 22px;
  line-height: 1;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255,107,0,.15);
  border-radius: 50%;
}
.tour-channel__main {
  font-size: 15px;
  letter-spacing: .04em;
}
.tour-channel__main b {
  font-family: var(--f-display);
  font-weight: 600;
  font-size: 17px;
  letter-spacing: .03em;
  color: var(--c-cream-text);
  margin-left: 4px;
}
.tour-channel__sub {
  font-size: 12px;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: rgba(247,239,227,.55);
}
.tour-channel--max[aria-disabled="true"] {
  opacity: .55;
  pointer-events: none;
}
.tour-channel--max[aria-disabled="true"]:hover {
  background: rgba(255,255,255,.05);
  border-color: rgba(247,239,227,.18);
  transform: none;
}

@media (max-width: 880px) {
  .tour-book__grid { grid-template-columns: 1fr; }
}
@media (max-width: 480px) {
  .tour-form { padding: 24px 22px; }
}

/* —————————————————————————————————————————————————
   Inline-кнопка-ссылка («купить» в строке таблицы)
   ————————————————————————————————————————————————— */
.tour-link {
  display: inline;
  background: none;
  border: none;
  padding: 0;
  margin: 0;
  font: inherit;
  color: var(--c-orange);
  text-decoration: underline;
  text-underline-offset: 2px;
  cursor: pointer;
  transition: color .15s;
}
.tour-link:hover { color: var(--c-orange-deep); }
.tour-link:focus-visible { outline: 2px solid var(--c-orange); outline-offset: 2px; border-radius: 2px; }

/* —————————————————————————————————————————————————
   ЛАЙТБОКС галереи
   ————————————————————————————————————————————————— */
.tour-lightbox {
  position: fixed;
  inset: 0;
  z-index: 9998;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(8, 14, 10, .94);
  opacity: 0;
  pointer-events: none;
  transition: opacity .25s ease;
  padding: 4vh 6vw;
}
.tour-lightbox[aria-hidden="false"] {
  opacity: 1;
  pointer-events: auto;
}
.tour-lightbox__stage {
  margin: 0;
  max-width: 100%;
  max-height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
}
.tour-lightbox__img {
  max-width: 92vw;
  max-height: 84vh;
  width: auto;
  height: auto;
  object-fit: contain;
  border-radius: var(--radius);
  box-shadow: 0 40px 80px -30px rgba(0,0,0,.7);
  user-select: none;
  -webkit-user-drag: none;
}
.tour-lightbox__caption {
  font-size: 13px;
  letter-spacing: .04em;
  color: rgba(247,239,227,.75);
  text-align: center;
  max-width: 80vw;
}
.tour-lightbox__counter {
  position: absolute;
  top: 18px;
  left: 50%;
  transform: translateX(-50%);
  font-family: var(--f-display);
  font-size: 14px;
  letter-spacing: .12em;
  color: rgba(247,239,227,.75);
  background: rgba(0,0,0,.4);
  padding: 6px 14px;
  border-radius: 100px;
  white-space: nowrap;
}
.tour-lightbox__close,
.tour-lightbox__nav {
  position: absolute;
  background: rgba(247,239,227,.10);
  color: var(--c-cream-text);
  border: 1px solid rgba(247,239,227,.18);
  border-radius: 50%;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background .15s, transform .15s;
  font-family: var(--f-display);
  line-height: 1;
}
.tour-lightbox__close:hover,
.tour-lightbox__nav:hover {
  background: var(--c-orange);
  color: #fff;
  border-color: var(--c-orange);
}
.tour-lightbox__close {
  top: 18px; right: 18px;
  width: 44px; height: 44px;
  font-size: 28px;
  font-weight: 300;
}
.tour-lightbox__nav {
  top: 50%;
  transform: translateY(-50%);
  width: 56px; height: 56px;
  font-size: 32px;
}
.tour-lightbox__nav--prev { left: 18px; }
.tour-lightbox__nav--next { right: 18px; }
.tour-lightbox__nav:hover { transform: translateY(-50%) scale(1.05); }

@media (max-width: 600px) {
  .tour-lightbox { padding: 8vh 0 4vh; }
  .tour-lightbox__nav {
    width: 44px; height: 44px;
    font-size: 26px;
  }
  .tour-lightbox__nav--prev { left: 8px; }
  .tour-lightbox__nav--next { right: 8px; }
  .tour-lightbox__close { top: 12px; right: 12px; width: 38px; height: 38px; font-size: 24px; }
  .tour-lightbox__counter { top: 14px; font-size: 12px; padding: 4px 10px; }
  .tour-lightbox__img { max-width: 96vw; max-height: 76vh; }
}

/* Когда открыт лайтбокс или модалка — блокируем скролл фона */
body.tour-lock-scroll { overflow: hidden; }

/* ════════════════════════════════════════════════════════════════════
   COOKIE-БАННЕР
   Фиксирован к низу окна, не блокирует взаимодействие с сайтом.
   z-index 150 — ниже модалок (200), чтобы модалка перекрывала баннер.
   ════════════════════════════════════════════════════════════════════ */
.cookie-bar {
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: 150;
  background: var(--c-green-deep);
  color: var(--c-cream-text);
  border-top: 1px solid rgba(247,239,227,.08);
  box-shadow: 0 -16px 40px -16px rgba(0,0,0,.45);
  padding-bottom: env(safe-area-inset-bottom, 0);
  transform: translateY(110%);
  opacity: 0;
  transition: transform .35s cubic-bezier(.22,.61,.36,1), opacity .25s ease;
}
.cookie-bar.is-visible {
  transform: translateY(0);
  opacity: 1;
}
.cookie-bar.is-hiding {
  transform: translateY(110%);
  opacity: 0;
}
.cookie-bar__inner {
  max-width: var(--container);
  margin: 0 auto;
  padding: 16px var(--gutter);
  display: flex;
  align-items: center;
  gap: 24px;
}
.cookie-bar__text {
  flex: 1;
  margin: 0;
  font-size: 13px;
  line-height: 1.5;
  color: var(--c-cream-text);
  opacity: .92;
}
.cookie-bar__text a {
  color: var(--c-orange);
  border-bottom: 1px solid rgba(255,107,0,.4);
  transition: color .15s, border-color .15s;
}
.cookie-bar__text a:hover {
  color: #fff;
  border-bottom-color: #fff;
}
.cookie-bar__accept {
  flex-shrink: 0;
  padding: 12px 24px;
  font-size: 14px;
  letter-spacing: .08em;
}

@media (max-width: 760px) {
  .cookie-bar__inner {
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
    padding: 14px var(--gutter);
  }
  .cookie-bar__text {
    font-size: 12.5px;
  }
  .cookie-bar__accept {
    width: 100%;
    justify-content: center;
    padding: 12px 16px;
  }
}

/* —————————————————————————————————————————————————
   КАТАЛОГ МАРШРУТОВ /marshruty/
   Минимальный набор: hero-override, таблица сравнения,
   3 группы карточек, CTA-квиз, «что включено», «откуда возим»,
   FAQ, отзывы. Шапка/футер/модалка/cookie — общие.
   ————————————————————————————————————————————————— */

/* HERO каталога — 2 колонки: текст слева, стопка фото справа.
   align-items: start — чтобы текстовая колонка не растягивалась под высоту фото. */
.catalog-hero {
  align-items: start;
  /* Текстовой колонке нужно больше места для длинного слова «КВАДРОЦИКЛАХ» (13 букв) */
  grid-template-columns: minmax(0, 1.5fr) minmax(0, 0.8fr);
  padding-bottom: clamp(32px, 4vw, 56px);
}
.catalog-hero .tour-hero__left { min-width: 0; }
/* H1 в каталоге — мельче, чем дефолтные 110px из .tour-hero,
   иначе «КВАДРОЦИКЛАХ» не влезает в колонку текста */
.catalog-hero .tour-hero__title { font-size: clamp(42px, 6.2vw, 84px); }
/* Отступ списка-преимуществ от блока метаплашек 9/1,5–10 ч/6 000–35 000 ₽ */
.catalog-hero .tour-hero__meta { margin-top: 32px; }

/* Стопка из 3 фото — наложение с белой рамкой и лёгким поворотом.
   Контейнер сдвинут вправо от текстовой колонки, чтобы не наезжать на H1. */
.catalog-hero__photos {
  position: relative;
  width: 100%;
  height: clamp(340px, 34vw, 440px);
  margin: 0 auto;
  padding-left: clamp(16px, 3vw, 40px);
}
.catalog-hero__photo {
  position: absolute;
  width: 60%;
  height: 76%;
  object-fit: cover;
  border-radius: 6px;
  border: 8px solid #fff;
  box-shadow: 0 24px 40px -22px rgba(20,41,28,.55), 0 6px 14px -8px rgba(20,41,28,.3);
  transition: transform .35s ease, z-index 0s .35s;
  cursor: pointer;
}
.catalog-hero__photo--back  { top: 0;   left: 6%;  transform: rotate(-7deg); z-index: 1; }
.catalog-hero__photo--mid   { top: 12%; left: 22%; transform: rotate(3deg);  z-index: 2; }
.catalog-hero__photo--front { top: 22%; left: 38%; transform: rotate(-2deg); z-index: 3; }

/* Hover на любое фото — поднимаем его НА ПЕРВЫЙ ПЛАН: z-index, выпрямляем, чуть увеличиваем */
.catalog-hero__photo:hover {
  z-index: 10;
  transform: rotate(0deg) scale(1.04) translateY(-6px);
  transition: transform .35s ease, z-index 0s 0s;
  box-shadow: 0 30px 50px -20px rgba(20,41,28,.6), 0 8px 20px -8px rgba(20,41,28,.4);
}

@media (max-width: 900px) {
  .catalog-hero { grid-template-columns: 1fr; }
  .catalog-hero__photos { display: none; }
}

.catalog-hero__list {
  list-style: none;
  margin: 24px 0 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 14px;
  max-width: 760px;
  font-size: 17px;
  color: #333;
  line-height: 1.55;
}
.catalog-hero__list li {
  position: relative;
  padding-left: 22px;
}
.catalog-hero__list li::before {
  content: '';
  position: absolute;
  left: 0; top: 11px;
  width: 9px; height: 9px;
  border-radius: 50%;
  background: var(--c-orange);
}
.catalog-hero__list li b { color: var(--c-green-deep); font-weight: 700; }

/* СВОДНАЯ ТАБЛИЦА */
.catalog-compare {
  background: var(--c-beige);
  padding: var(--tour-section-py) 0;
}
.catalog-compare__inner {
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 var(--gutter);
}
.catalog-compare__lead {
  margin: 14px 0 24px;
  font-size: 15px;
  color: #444;
  line-height: 1.55;
  max-width: 760px;
}
.catalog-compare__wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  border-radius: var(--radius-lg);
  background: #fff;
  border: 1px solid var(--c-line);
}
.catalog-table {
  width: 100%;
  min-width: 720px;
}
.catalog-table th,
.catalog-table td { padding: 14px 16px; }
.catalog-table th:nth-child(n+2),
.catalog-table td:nth-child(n+2) { text-align: center; }
.catalog-table th:last-child,
.catalog-table td:last-child { text-align: right; }
.catalog-table tbody tr { cursor: pointer; transition: background .15s; }
.catalog-table tbody tr:hover { background: var(--c-beige-warm); }
.catalog-compare__hint {
  margin: 14px 0 0;
  font-size: 13px;
  color: var(--c-olive);
  text-align: center;
  letter-spacing: .03em;
}

/* ─── Мобильная таблица сравнения: каждая строка превращается в карточку ─── */
@media (max-width: 760px) {
  .catalog-compare__wrap {
    overflow: visible;
    background: transparent;
    border: none;
    border-radius: 0;
  }
  .catalog-table { min-width: 0; }
  .catalog-table thead { display: none; }
  .catalog-table,
  .catalog-table tbody,
  .catalog-table tr,
  .catalog-table td {
    display: block;
    width: 100%;
  }
  /* Строка-карточка: grid 2 колонки, чтобы 4 параметра шли парами 2×2.
     Название и цена занимают всю ширину через grid-column: 1 / -1. */
  .catalog-table tr {
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 20px;
    row-gap: 14px;
    background: #fff;
    border: 1px solid var(--c-line);
    border-radius: var(--radius-lg);
    padding: 18px 20px 16px;
    margin-bottom: 14px;
    box-shadow: 0 10px 20px -16px rgba(20,41,28,.35);
    position: relative;
  }
  .catalog-table tbody tr:hover { background: #fff; }
  /* Подсветка ходового маршрута — только обводка, без фона */
  .catalog-table tr.is-hl {
    border: 2px solid var(--c-orange);
    padding: 17px 19px 15px;
  }
  .catalog-table tr.is-hl td {
    background: transparent !important;
  }
  .catalog-table td {
    padding: 0;
    border: none;
    text-align: left !important;
    color: inherit !important;
  }

  /* Название маршрута — крупно, на всю ширину, разделитель снизу.
     flex-column + nowrap: имя в одну строку, бейдж (лето/NEW/флагман) — под именем. */
  .catalog-table td:first-child {
    grid-column: 1 / -1;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    font-family: var(--f-display);
    font-size: 16px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0;
    color: var(--c-green-deep);
    padding-bottom: 10px;
    border-bottom: 1px solid var(--c-line);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: clip;
  }
  .catalog-table td:first-child .catalog-flag { margin-left: 0; }

  /* 4 параметра — каждый в своей ячейке 2×2-сетки.
     Лейбл сверху мелко, значение под ним крупно.
     white-space: nowrap — чтобы «2,5 ч» не разрывалось на «2,5» и «ч». */
  .catalog-table td:nth-child(2),
  .catalog-table td:nth-child(3),
  .catalog-table td:nth-child(4),
  .catalog-table td:nth-child(5) {
    display: flex;
    flex-direction: column;
    gap: 4px;
    font-size: 16px;
    font-weight: 600;
    color: var(--c-green-deep);
    line-height: 1.1;
    white-space: nowrap;
  }
  .catalog-table td:nth-child(2)::before,
  .catalog-table td:nth-child(3)::before,
  .catalog-table td:nth-child(4)::before,
  .catalog-table td:nth-child(5)::before {
    font-family: var(--f-display);
    font-size: 10.5px;
    font-weight: 500;
    letter-spacing: .18em;
    text-transform: uppercase;
    color: var(--c-olive);
  }
  .catalog-table td:nth-child(2)::before { content: "Время"; }
  .catalog-table td:nth-child(3)::before { content: "Сложность"; }
  .catalog-table td:nth-child(4)::before { content: "Обед"; }
  .catalog-table td:nth-child(5)::before { content: "Новичкам"; }

  /* Цена — на всю ширину, крупно, со стрелкой-намёком «строка кликабельна» */
  .catalog-table td:last-child {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: auto 1fr auto;
    column-gap: 12px;
    align-items: baseline;
    padding-top: 10px;
    border-top: 1px solid var(--c-line);
    font-family: var(--f-display);
    font-size: 22px;
    font-weight: 700;
    color: var(--c-orange);
    text-align: right;
    white-space: nowrap;
  }
  .catalog-table td:last-child::before {
    content: "Цена";
    font-size: 11px;
    font-weight: 500;
    letter-spacing: .18em;
    text-transform: uppercase;
    color: var(--c-olive);
    text-align: left;
    align-self: center;
  }
  .catalog-table td:last-child::after {
    content: "→";
    color: var(--c-orange);
    font-size: 18px;
    align-self: center;
    transition: transform .2s;
  }
  .catalog-table tr:active td:last-child::after { transform: translateX(4px); }

  /* Бейджи в названии (NEW, лето, флагман) — оставляем, но мельче */
  .catalog-table td:first-child .catalog-flag {
    font-size: 9.5px;
    padding: 2px 6px;
    vertical-align: middle;
  }

  /* Квиз: на мобильном кнопка-старт ужимается по ширине блока,
     иначе .btn--lg (padding 24×40 + nowrap, 22px) вылазит за пределы квиз-карточки.
     Применяется и на главной, и на каталоге. */
  .quiz__panel .btn--lg {
    width: 100%;
    box-sizing: border-box;
    padding: 18px 20px;
    font-size: 17px;
    justify-content: center;
  }

  /* Карточки результатов квиза: «длительность» / «за квадр · обед включён»
     не помещаются в узкую колонку → мельче шрифт, без uppercase letter-spacing. */
  .quiz-card__stat-label {
    font-size: 10px;
    letter-spacing: .03em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
}

/* БЕЙДЖИ-ФЛАГИ */
.catalog-flag {
  display: inline-block;
  margin-left: 6px;
  padding: 2px 8px;
  font-family: var(--f-body);
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  border-radius: 3px;
  background: var(--c-olive);
  color: #fff;
  vertical-align: middle;
}
.catalog-flag--new    { background: var(--c-orange); }
.catalog-flag--season { background: #2c7da0; }
.catalog-flag--top    { background: var(--c-green-deep); }

/* ГРУППЫ МАРШРУТОВ */
.catalog-group {
  padding: var(--tour-section-py) 0;
}
.catalog-group--alt { background: var(--c-beige-warm); }
.catalog-group__head {
  max-width: var(--container);
  margin: 0 auto 32px;
  padding: 0 var(--gutter);
}
.catalog-group__lead {
  margin: 14px 0 0;
  font-size: 16px;
  color: #444;
  line-height: 1.55;
  max-width: 760px;
}

/* СЕТКА КАРТОЧЕК */
.catalog-grid {
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 var(--gutter);
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}
@media (max-width: 1024px) { .catalog-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 680px)  { .catalog-grid { grid-template-columns: 1fr; } }

/* КАРТОЧКА МАРШРУТА — работает и как <a>, и как <button> */
.catalog-card {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 26px 28px 24px;
  background: #fff;
  border-radius: var(--radius-lg);
  border: 1px solid var(--c-line);
  transition: transform .2s, box-shadow .2s, border-color .2s;
  position: relative;
  overflow: hidden;
  color: inherit;
  text-decoration: none;
  /* сброс button-стилей */
  font: inherit;
  text-align: left;
  cursor: pointer;
  width: 100%;
  appearance: none;
  -webkit-appearance: none;
}
.catalog-card::before {
  content: "";
  position: absolute;
  top: 0; left: 0;
  width: 4px; height: 100%;
  background: var(--c-olive);
}
.catalog-card--featured::before { background: var(--c-orange); }
.catalog-card--top::before      { background: var(--c-green-deep); }
.catalog-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 24px 40px -22px rgba(20,41,28,.4);
  border-color: var(--c-orange);
}
.catalog-card--has-page::after {
  content: "своя страница ↗";
  position: absolute;
  top: 14px; right: 14px;
  font-family: var(--f-body);
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--c-orange);
  opacity: .8;
}
.catalog-card__flags {
  position: absolute;
  top: 14px; left: 14px;
  display: flex;
  gap: 6px;
}
.catalog-card__flags .catalog-flag { margin-left: 0; }
.catalog-card__num {
  font-family: var(--f-display);
  font-weight: 700;
  font-size: 13px;
  letter-spacing: .2em;
  color: var(--c-olive);
  margin-bottom: 24px;
}
.catalog-card__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 24px;
  font-family: var(--f-display);
  letter-spacing: .03em;
  margin-bottom: 6px;
}
/* Каждая ячейка — лейбл сверху мелкими буквами + значение крупно */
.catalog-card__time,
.catalog-card__diff,
.catalog-card__price {
  display: flex;
  flex-direction: column;
  line-height: 1.05;
  font-size: 16px;
  font-weight: 600;
  color: var(--c-green-deep);
}
.catalog-card__time::before,
.catalog-card__diff::before,
.catalog-card__price::before {
  display: block;
  margin-bottom: 4px;
  font-size: 10px;
  font-weight: 500;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--c-olive);
}
.catalog-card__time::before  { content: "Время"; }
.catalog-card__diff::before  { content: "Сложность"; }
.catalog-card__price::before { content: "Цена"; }
.catalog-card__price {
  margin-left: auto;
  color: var(--c-orange);
  text-align: right;
}
.catalog-card__price::before { color: var(--c-olive); text-align: right; }
.catalog-card__name {
  font-family: var(--f-display);
  font-weight: 600;
  font-size: clamp(20px, 2.2vw, 24px);
  text-transform: uppercase;
  letter-spacing: .01em;
  color: var(--c-green-deep);
  margin: 6px 0 6px;
}
.catalog-card__line {
  margin: 0;
  font-size: 14px;
  color: #444;
  line-height: 1.55;
  flex-grow: 1;
}
.catalog-card__cta {
  display: inline-flex;
  align-items: center;
  align-self: flex-start;
  gap: 6px;
  margin-top: 16px;
  padding: 8px 0;
  font-family: var(--f-display);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .15em;
  text-transform: uppercase;
  color: var(--c-orange);
  background: none;
  border: none;
  cursor: pointer;
  text-decoration: none;
  transition: gap .2s, color .15s;
}
.catalog-card__cta:hover {
  gap: 10px;
  color: var(--c-orange-deep);
}
.catalog-card__cta:focus-visible {
  outline: 2px solid var(--c-orange);
  outline-offset: 4px;
  border-radius: 2px;
}

/* Галерея фото внутри карточки каталога — компактнее, чем на главной */
.catalog-card .route__photo {
  margin: 10px 0 14px;
  aspect-ratio: 16 / 10;
}
.catalog-card .route__photo-tag {
  font-size: 10px;
  bottom: 10px;
  left: 10px;
  padding: 4px 9px;
}

/* КВИЗ-БАННЕР (тёмный) */
.catalog-quiz-banner {
  background: var(--c-green-deep);
  color: var(--c-cream-text);
  padding: 56px 0;
}
.catalog-quiz-banner__inner {
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 var(--gutter);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
  flex-wrap: wrap;
}
.catalog-quiz-banner__text { max-width: 640px; }
.catalog-quiz-banner__lead {
  margin: 14px 0 0;
  font-size: 16px;
  color: rgba(247,239,227,.85);
  line-height: 1.55;
}

/* ЧТО ВКЛЮЧЕНО */
.catalog-included {
  background: var(--c-beige);
  padding: var(--tour-section-py) 0;
}
.catalog-included__inner {
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 var(--gutter);
}
.catalog-included__list {
  list-style: none;
  padding: 0;
  margin: 28px 0 0;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px 32px;
}
@media (max-width: 680px) { .catalog-included__list { grid-template-columns: 1fr; } }
.catalog-included__list li {
  display: grid;
  grid-template-columns: 36px 1fr;
  grid-template-rows: auto auto;
  column-gap: 12px;
  align-items: start;
  padding: 14px 0;
  border-bottom: 1px solid var(--c-line);
}
.catalog-included__ico {
  grid-row: span 2;
  font-size: 22px;
  line-height: 1;
}
.catalog-included__list li b {
  color: var(--c-green-deep);
  font-weight: 600;
  font-size: 16px;
}
.catalog-included__list li span:not(.catalog-included__ico) {
  font-size: 14px;
  color: #555;
  line-height: 1.45;
}
.catalog-included__note {
  margin: 28px 0 0;
  padding: 18px 22px;
  background: #fff;
  border-radius: var(--radius-lg);
  border: 1px solid var(--c-line);
  font-size: 15px;
  color: #333;
}
.catalog-included__note b { color: var(--c-orange); }

/* ОТКУДА ВОЗИМ */
.catalog-from {
  background: var(--c-beige-warm);
  padding: var(--tour-section-py) 0;
}
.catalog-from__inner {
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 var(--gutter);
}
.catalog-from__lead {
  margin: 14px 0 28px;
  font-size: 16px;
  color: #444;
  line-height: 1.55;
  max-width: 760px;
}
.catalog-from__list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px 24px;
}
@media (max-width: 760px) { .catalog-from__list { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 460px) { .catalog-from__list { grid-template-columns: 1fr; } }
.catalog-from__list li {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
  padding: 14px 18px;
  background: #fff;
  border-radius: var(--radius-lg);
  border: 1px solid var(--c-line);
}
.catalog-from__list li b { color: var(--c-green-deep); font-weight: 600; }
.catalog-from__list li span {
  font-family: var(--f-display);
  font-size: 13px;
  letter-spacing: .08em;
  color: var(--c-orange);
}

/* FAQ */
.catalog-faq {
  background: var(--c-beige);
  padding: var(--tour-section-py) 0;
}
.catalog-faq__inner {
  max-width: 820px;
  margin: 0 auto;
  padding: 0 var(--gutter);
}
.catalog-faq__list { margin-top: 28px; }

/* ОТЗЫВЫ — компактный блок (использует .review с главной) */
.catalog-reviews {
  background: var(--c-beige-warm);
  padding: var(--tour-section-py) 0;
}
.catalog-reviews__inner {
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 var(--gutter);
}
.catalog-reviews__grid {
  margin-top: 28px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}
@media (max-width: 900px) { .catalog-reviews__grid { grid-template-columns: 1fr; } }
.catalog-reviews__all {
  margin-top: 24px;
  text-align: center;
  font-size: 14px;
  color: #555;
}
.catalog-reviews__all a {
  color: var(--c-green-deep);
  border-bottom: 1px solid var(--c-orange);
  padding-bottom: 1px;
}
.catalog-reviews__all a:hover { color: var(--c-orange); }

/* =================================================================
   MOBILE OVERFLOW FIX (2026-05-25)
   Аудит puppeteer на iPhone 12 (390×844) показал три элемента,
   вылазящие за viewport на главной. html { overflow-x: clip }
   скрывает скроллбар, но часть кнопки/таблицы остаётся за экраном.
   ================================================================= */

/* 1) Кнопка «Все маршруты в каталоге →» в блоке .routes__catalog-cta
      была 479px на 390px viewport (padding 24×40, fs 22, nowrap).
      На мобиле — полная ширина, перенос, чуть компактнее. */
@media (max-width: 600px) {
  .routes__catalog-cta .btn--lg {
    display: block;
    width: 100%;
    box-sizing: border-box;
    padding: 18px 24px;
    font-size: 18px;
    white-space: normal;
    line-height: 1.25;
  }
}

/* 2) .price-table — на 390px viewport растягивалась до 409px.
      Корневая причина: .price__grid использует `grid-template-columns: 1fr`,
      что эквивалентно `minmax(auto, 1fr)`. `auto`-минимум равен min-content
      содержимого таблицы, и трек растёт до 409px при контейнере 350px.
      Фикс: явный `minmax(0, 1fr)` снимает auto-min, дальше table-layout:
      fixed + word-break + скрытие декоративной колонки-стрелки выравнивают
      4 колонки в 350px. */
@media (max-width: 880px) {
  .price__grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 600px) {
  .price-table {
    table-layout: fixed;
    width: 100%;
    font-size: 14px;
  }
  .price-table th  { padding: 10px 6px; font-size: 11px; letter-spacing: .08em; }
  .price-table td  { padding: 12px 6px; word-break: break-word; }
  .price-table td:nth-child(1) { font-size: 14px; line-height: 1.25; }
  .price-table td:nth-child(2),
  .price-table td:nth-child(3) { font-size: 13px; }
  .price-table td:nth-child(4) { font-size: 15px; letter-spacing: .02em; white-space: nowrap; }
  /* Декоративная колонка-стрелка скрыта на мобиле, цена остаётся
     кликабельной через ряд (cursor:pointer уже выставлен). */
  .price-table th:nth-child(5),
  .price-table td.price-table__go { display: none; }
}
@media (max-width: 400px) {
  .price-table { font-size: 13px; }
  .price-table th  { padding: 10px 4px; font-size: 10px; letter-spacing: .04em; }
  .price-table td  { padding: 12px 4px; }
  .price-table td:nth-child(1) { font-size: 13px; }
  .price-table td:nth-child(4) { font-size: 14px; }
}

/* 3) nav__phone — 2px overhang при viewport ≤390px (iPhone 12 mini).
      Видно только когда брендовые шрифты Oswald/Montserrat не загружены
      (fallback sans-serif шире). overflow-x: clip на html прячет визуально,
      но запас прочности не помешает. */
@media (max-width: 400px) {
  .nav__phone {
    padding: 5px 8px;
    font-size: 12px;
    letter-spacing: 0;
    gap: 4px;
  }
  .logo__main  { font-size: 24px; }
  .logo__brush { font-size: 30px; }
}

/* ════════════════════════════════════════════════════════
   Страница /tseny/ — мелкие добавки к каталожным классам
   ════════════════════════════════════════════════════════ */
/* Акцентный фон для блока-конвертера «цена за квадр» — выделяем из белых compare-секций */
.catalog-compare--accent { background: var(--c-beige); }
/* Утилита: не переносить (для приписок «за квадр» / «/ день» в таблице форматов) */
.nowrap { white-space: nowrap; }
/* Ссылка из секции цен главной на полную страницу /tseny/ */
.price-table__more { margin: 10px 0 0; font-size: 14px; }
.price-table__more a { color: var(--c-orange); font-weight: 600; border-bottom: 1px solid transparent; }
.price-table__more a:hover { border-bottom-color: var(--c-orange); }

/* ════════════════════════════════════════════════════════
   Страница /chertov-palec/ — галерея и подзаголовок CTA
   ════════════════════════════════════════════════════════ */
.cp-gallery {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  margin-top: 28px;
}
.cp-gallery a { display: block; overflow: hidden; border-radius: 10px; line-height: 0; }
.cp-gallery img {
  width: 100%; height: 100%; object-fit: cover; aspect-ratio: 4 / 3;
  transition: transform .35s ease;
}
.cp-gallery a:hover img { transform: scale(1.06); }
@media (max-width: 900px) { .cp-gallery { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 560px) { .cp-gallery { grid-template-columns: repeat(2, 1fr); gap: 8px; } }

.final-cta__lead-text {
  margin: 0 auto 26px;
  max-width: 620px;
  color: rgba(247,239,227,.9);
  font-size: 17px;
  line-height: 1.55;
}
/* Ссылка с маршрута на инфо-страницу достопримечательности */
.tour-hero__about { margin: 14px 0 0; font-size: 15px; }
.tour-hero__about a { color: var(--c-orange); font-weight: 600; border-bottom: 1px solid transparent; }
.tour-hero__about a:hover { border-bottom-color: var(--c-orange); }